/* =========================================================
   ELIZNA ADMIN VISUAL SYSTEM V2 — R12-R1
   28 AUGUST 2026

   Presentation-only premium / glossy UI layer.
   Preserves R11-R5 behavior and real-data architecture.
   ========================================================= */

:root {
  --elz-bg: #f7f2e9;
  --elz-bg-2: #fffdfa;
  --elz-card: rgba(255,255,255,.92);
  --elz-card-strong: rgba(255,255,255,.98);
  --elz-ink: #27231f;
  --elz-muted: #746b60;

  --elz-gold: #b88a3a;
  --elz-gold-2: #e7c777;
  --elz-gold-3: #fff2bf;

  --elz-emerald: #0d936d;
  --elz-emerald-2: #4ccda0;
  --elz-emerald-soft: #e8f8f1;

  --elz-plum: #743f80;
  --elz-plum-2: #b168bd;
  --elz-plum-soft: #f7edf8;

  --elz-coral: #d7685e;
  --elz-coral-2: #ff9e90;
  --elz-coral-soft: #fff0ed;

  --elz-blue: #3f7fd4;
  --elz-blue-2: #8fc5ff;
  --elz-blue-soft: #eef6ff;

  --elz-amber: #d29a2f;
  --elz-line: rgba(130,101,58,.17);
  --elz-line-strong: rgba(130,101,58,.25);

  --elz-shadow: 0 16px 36px rgba(74,53,24,.10);
  --elz-shadow-soft: 0 7px 18px rgba(74,53,24,.075);
  --elz-radius-xl: 18px;
  --elz-radius-lg: 13px;
  --elz-radius-md: 9px;
}

/* ---------- Global surface ---------- */

html,
body {
  background:
    radial-gradient(circle at 8% 0%, rgba(231,199,119,.18), transparent 26%),
    radial-gradient(circle at 100% 8%, rgba(76,205,160,.10), transparent 24%),
    radial-gradient(circle at 72% 100%, rgba(177,104,189,.07), transparent 30%),
    linear-gradient(180deg,#fcfaf5 0%,#f5eee4 100%) !important;
  color: var(--elz-ink);
}

body {
  letter-spacing: -.012em;
}

/* ---------- Sidebar ---------- */

body aside,
body nav {
  backdrop-filter: blur(20px);
}

body aside {
  position: relative;
}

body aside::after {
  content: "";
  pointer-events: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 52px;
  height: 250px;
  background:
    radial-gradient(circle at 18% 76%, rgba(255,255,255,.96) 0 8%, transparent 9%),
    radial-gradient(circle at 32% 66%, rgba(244,226,184,.72) 0 10%, transparent 11%),
    radial-gradient(circle at 14% 54%, rgba(255,248,232,.90) 0 12%, transparent 13%),
    radial-gradient(circle at 45% 88%, rgba(234,205,147,.42) 0 9%, transparent 10%),
    linear-gradient(150deg,transparent 35%,rgba(238,213,162,.24) 70%,transparent);
  opacity: .68;
  mask-image: linear-gradient(to top,#000 0 80%,transparent);
}

body aside a,
body nav a {
  transition:
    transform .16s ease,
    background .16s ease,
    border-color .16s ease,
    box-shadow .16s ease;
}

body aside a:hover,
body nav a:hover {
  transform: translateX(2px);
}

body aside a[aria-current="page"],
body nav a[aria-current="page"],
body aside a[data-active="true"],
body nav a[data-active="true"],
#elizna-admin-users-nav[data-active="true"],
#elizna-ai-nav-link[data-active="true"] {
  background:
    linear-gradient(135deg,#fff,#fff3d5) !important;
  border: 1px solid rgba(184,138,58,.29) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 8px 18px rgba(117,82,28,.09) !important;
  color: #44331e !important;
}

/* ---------- Global cards ---------- */

.cc-card,
.cc-kpi,
.cc-executive-hero,
.cc-health-cluster,
.ai-card,
.au-card,
.au-hero,
.au-user,
.ai-knowledge-readiness,
.ai-doc-governance {
  background:
    linear-gradient(155deg,rgba(255,255,255,.98),rgba(255,251,242,.89)) !important;
  border-color: var(--elz-line) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    var(--elz-shadow-soft) !important;
}

.cc-card,
.cc-kpi,
.ai-card,
.au-card,
.au-user {
  position: relative;
  overflow: hidden;
}

.cc-card::after,
.cc-kpi::after,
.ai-card::after,
.au-card::after,
.au-user::after {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.30),
      transparent 34%,
      rgba(255,255,255,.10) 64%,
      transparent
    );
  opacity: .8;
}

.cc-card > *,
.cc-kpi > *,
.ai-card > *,
.au-card > *,
.au-user > * {
  position: relative;
  z-index: 1;
}

/* ---------- R12 utility bar ---------- */

#elizna-r12-utility {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
  padding: 8px;
  border: 1px solid var(--elz-line);
  border-radius: 12px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,248,234,.90));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    var(--elz-shadow-soft);
}

.elz-r12-search {
  position: relative;
  min-width: 0;
}

.elz-r12-search input {
  width: 100%;
  min-width: 0;
  height: 38px;
  box-sizing: border-box;
  padding: 0 78px 0 38px;
  border-radius: 9px;
  border: 1px solid rgba(120,95,60,.17);
  background:
    linear-gradient(180deg,#fff,#fcf8f1);
  color: var(--elz-ink);
  font: inherit;
  font-size: 10px;
  box-shadow:
    inset 0 1px 2px rgba(77,57,27,.035);
}

.elz-r12-search::before {
  content: "⌕";
  position: absolute;
  left: 13px;
  top: 50%;
  transform: translateY(-50%);
  color: #74695a;
  font-size: 18px;
  z-index: 2;
}

.elz-r12-shortcut {
  position: absolute;
  right: 9px;
  top: 50%;
  transform: translateY(-50%);
  padding: 3px 7px;
  border: 1px solid rgba(116,92,56,.14);
  border-radius: 6px;
  background: rgba(247,242,233,.92);
  color: #837969;
  font-size: 7px;
  font-weight: 800;
}

.elz-r12-search-results {
  display: none;
  position: absolute;
  z-index: 200;
  left: 0;
  right: 0;
  top: calc(100% + 7px);
  padding: 6px;
  border: 1px solid var(--elz-line);
  border-radius: 10px;
  background: rgba(255,255,255,.98);
  box-shadow: var(--elz-shadow);
  backdrop-filter: blur(18px);
}

.elz-r12-search-results.open {
  display: grid;
  gap: 4px;
}

.elz-r12-search-results a {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 9px;
  border-radius: 7px;
  color: var(--elz-ink);
  text-decoration: none;
  font-size: 9px;
}

.elz-r12-search-results a:hover {
  background:
    linear-gradient(135deg,#fff8e9,#f0f8f5);
}

.elz-r12-actions-wrap {
  position: relative;
}

.elz-r12-actions-button,
.elz-r12-ask-button {
  position: relative;
  overflow: hidden;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(153,104,29,.22);
  border-radius: 10px;
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
}

.elz-r12-actions-button {
  color: #684a1d;
  background:
    linear-gradient(
      180deg,
      #fff9e9 0%,
      #f9e5b6 55%,
      #efd296 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 7px 14px rgba(127,89,27,.11);
}

.elz-r12-ask-button {
  color: #fff;
  background:
    linear-gradient(
      180deg,
      #b96cc2 0%,
      #8e4b99 52%,
      #6c3479 100%
    );
  border-color: rgba(97,46,110,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.36),
    0 8px 18px rgba(107,50,119,.22);
}

.elz-r12-actions-button::before,
.elz-r12-ask-button::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      120deg,
      transparent 0 34%,
      rgba(255,255,255,.40) 44%,
      transparent 55%
    );
  transform: translateX(-120%);
  transition: transform .5s ease;
}

.elz-r12-actions-button:hover::before,
.elz-r12-ask-button:hover::before {
  transform: translateX(120%);
}

.elz-r12-actions-menu {
  display: none;
  position: absolute;
  z-index: 210;
  right: 0;
  top: calc(100% + 7px);
  min-width: 210px;
  padding: 6px;
  border: 1px solid var(--elz-line);
  border-radius: 10px;
  background: rgba(255,255,255,.98);
  box-shadow: var(--elz-shadow);
}

.elz-r12-actions-menu.open {
  display: grid;
  gap: 4px;
}

.elz-r12-actions-menu a,
.elz-r12-actions-menu button {
  width: 100%;
  min-height: 34px;
  box-sizing: border-box;
  border: 0;
  border-radius: 7px;
  padding: 0 9px;
  background: transparent;
  color: var(--elz-ink);
  text-align: left;
  font: inherit;
  font-size: 9px;
  text-decoration: none;
  cursor: pointer;
}

.elz-r12-actions-menu a:hover,
.elz-r12-actions-menu button:hover {
  background: #faf4e7;
}

.elz-r12-account {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 190px;
  padding: 5px 7px;
  border-left: 1px solid rgba(120,95,60,.13);
}

.elz-r12-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 28%,#fff6dc,#d6ad64 64%,#9b7130);
  color: #fff;
  font-family: Georgia,"Times New Roman",serif;
  font-weight: 700;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.68),
    0 4px 10px rgba(102,72,26,.12);
}

.elz-r12-account div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.elz-r12-account strong,
.elz-r12-account small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.elz-r12-account strong {
  font-size: 8px;
}

.elz-r12-account small {
  font-size: 7px;
  color: var(--elz-muted);
}

/* ---------- Hero ---------- */

.cc-executive-hero {
  border-radius: var(--elz-radius-xl) !important;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.98),
      rgba(255,247,228,.94) 54%,
      rgba(240,250,246,.92)
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 16px 38px rgba(90,65,28,.10) !important;
}

.cc-executive-title h1 {
  letter-spacing: -.035em;
}

.cc-health-cluster {
  background:
    linear-gradient(135deg,#fff,#eef9f4) !important;
}

.cc-health-overall strong {
  color: var(--elz-emerald) !important;
}

.cc-health-domains b {
  background:
    linear-gradient(
      90deg,
      var(--elz-emerald),
      var(--elz-emerald-2)
    ) !important;
  box-shadow: 0 0 12px rgba(76,205,160,.28);
}

/* ---------- KPI cards ---------- */

.cc-kpis-executive {
  gap: 7px !important;
}

.cc-kpi {
  min-height: 78px !important;
  border-radius: 11px !important;
  padding: 9px 10px !important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

.cc-kpi:hover {
  transform: translateY(-2px);
  border-color: rgba(184,138,58,.28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 12px 24px rgba(87,63,28,.11) !important;
}

.cc-kpi:nth-child(1) {
  background: linear-gradient(150deg,#fff,#fff3d4) !important;
}
.cc-kpi:nth-child(2) {
  background: linear-gradient(150deg,#fff,#eef6ff) !important;
}
.cc-kpi:nth-child(3) {
  background: linear-gradient(150deg,#fff,#e8f8f1) !important;
}
.cc-kpi:nth-child(4) {
  background: linear-gradient(150deg,#fff,#fff0ed) !important;
}
.cc-kpi:nth-child(5) {
  background: linear-gradient(150deg,#fff,#f6ecf8) !important;
}
.cc-kpi:nth-child(6) {
  background: linear-gradient(150deg,#fff,#fff7e5) !important;
}
.cc-kpi:nth-child(7) {
  background: linear-gradient(150deg,#fff,#f0edff) !important;
}
.cc-kpi:nth-child(8) {
  background: linear-gradient(150deg,#fff,#e8f8f1) !important;
}

.cc-spark polyline {
  stroke: var(--elz-emerald) !important;
  filter: drop-shadow(0 2px 4px rgba(13,147,109,.17));
}

/* ---------- Alerts ---------- */

.cc-alert-links a {
  border-radius: 9px !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 5px 13px rgba(83,63,33,.055);
}

.cc-alert-links a.critical {
  background: linear-gradient(135deg,#fff,#fff0ed) !important;
  border-color: rgba(215,104,94,.27) !important;
}

.cc-alert-links a.attention {
  background: linear-gradient(135deg,#fff,#fff7e7) !important;
  border-color: rgba(210,154,47,.28) !important;
}

.cc-alert-links a.info {
  background: linear-gradient(135deg,#fff,#eef6ff) !important;
  border-color: rgba(63,127,212,.20) !important;
}

.cc-alert-links a.good {
  background: linear-gradient(135deg,#fff,#e8f8f1) !important;
  border-color: rgba(13,147,109,.20) !important;
}

/* ---------- Cards / compact layout ---------- */

.cc-card {
  border-radius: 12px !important;
  padding: 11px !important;
}

.cc-card-head {
  margin-bottom: 7px !important;
}

.cc-dashboard-row {
  gap: 8px !important;
}

.cc-mini-kpis {
  gap: 6px !important;
}

.cc-mini-kpis > div {
  padding: 7px !important;
  border-radius: 8px !important;
}

/* ---------- Charts / bars / donut ---------- */

.cc-donut {
  background:
    conic-gradient(
      from 180deg,
      var(--elz-gold) calc(var(--cc-pct) * .40%),
      var(--elz-emerald) calc(var(--cc-pct) * 1%),
      #eee7db 0
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 8px 18px rgba(80,58,25,.10);
}

/* ---------- Product command ---------- */

.cc-product-command > article {
  border-color: rgba(184,138,58,.18) !important;
  background:
    linear-gradient(145deg,#fff,#faf4e8) !important;
}

.cc-product-thumb {
  background:
    radial-gradient(circle at 35% 25%,#fff9e8,#ecd9ad 66%,#c8a05e) !important;
  color: #7e5a20 !important;
}

.cc-product-channels section {
  background:
    linear-gradient(180deg,#fff,#fcfaf5) !important;
}

/* ---------- Status pills ---------- */

.cc-pill,
.ai-pill,
.au-cf-status,
.ai-history-partial-badge {
  border-radius: 999px !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    0 2px 5px rgba(61,47,28,.04);
}

.cc-pill.good,
.ai-pill.good,
.au-cf-status.allowlisted {
  color: #0a7555 !important;
  background: linear-gradient(180deg,#f7fffb,#dff6ec) !important;
  border-color: rgba(13,147,109,.24) !important;
}

.cc-pill.attention,
.ai-pill.attention,
.ai-history-partial-badge,
.au-cf-status.not-verified {
  color: #7b591c !important;
  background: linear-gradient(180deg,#fffdf3,#ffefc8) !important;
  border-color: rgba(210,154,47,.28) !important;
}

.cc-pill.info,
.ai-pill.info {
  color: #315f9c !important;
  background: linear-gradient(180deg,#f8fbff,#e7f2ff) !important;
  border-color: rgba(63,127,212,.22) !important;
}

.cc-pill.critical,
.ai-pill.critical,
.au-cf-status.removed {
  color: #98463f !important;
  background: linear-gradient(180deg,#fff8f6,#ffe2dd) !important;
  border-color: rgba(215,104,94,.25) !important;
}

/* ---------- Global buttons ---------- */

button,
input[type="button"],
input[type="submit"] {
  transition:
    transform .16s ease,
    filter .16s ease,
    box-shadow .16s ease;
}

button:not(:disabled):hover,
input[type="button"]:not(:disabled):hover,
input[type="submit"]:not(:disabled):hover {
  transform: translateY(-1px);
  filter: saturate(1.08);
}

.cc-toolbar button,
.cc-ai-prompt button,
.ai-action,
.ai-card button,
.au-form > button,
.au-user-actions button:first-child,
.au-card-head button,
[data-cc-refresh],
[data-ai-submit],
[data-ai-refresh],
[data-au-save] {
  position: relative;
  overflow: hidden;
  color: #fff !important;
  background:
    linear-gradient(
      180deg,
      #5a4530 0%,
      #403225 52%,
      #2f271f 100%
    ) !important;
  border: 1px solid rgba(75,54,28,.28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    0 7px 14px rgba(61,44,25,.14) !important;
}

.cc-toolbar button::before,
.cc-ai-prompt button::before,
.ai-action::before,
.ai-card button::before,
.au-form > button::before,
.au-user-actions button:first-child::before,
.au-card-head button::before,
[data-cc-refresh]::before,
[data-ai-submit]::before,
[data-ai-refresh]::before,
[data-au-save]::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      120deg,
      transparent 0 34%,
      rgba(255,255,255,.28) 44%,
      transparent 56%
    );
  transform: translateX(-120%);
  transition: transform .48s ease;
}

.cc-toolbar button:hover::before,
.cc-ai-prompt button:hover::before,
.ai-action:hover::before,
.ai-card button:hover::before,
.au-form > button:hover::before,
.au-user-actions button:first-child:hover::before,
.au-card-head button:hover::before,
[data-cc-refresh]:hover::before,
[data-ai-submit]:hover::before,
[data-ai-refresh]:hover::before,
[data-au-save]:hover::before {
  transform: translateX(120%);
}

/* ---------- AI ---------- */

.elizna-ai-page [data-ai-mode].active,
.elizna-ai-page .ai-mode-tabs button.active {
  background:
    linear-gradient(135deg,#fff7df,#efe0bc) !important;
  border-color: rgba(184,138,58,.30) !important;
  color: #503a1e !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.94),
    0 7px 14px rgba(113,80,27,.09);
}

.ai-partial-warning {
  background:
    linear-gradient(135deg,#fffaf0,#fff0c9) !important;
  border-color: rgba(184,138,58,.29) !important;
}

/* ---------- Admin Users ---------- */

.au-cloudflare-boundary {
  background:
    linear-gradient(135deg,#eef6ff,#f7edf8) !important;
  border-color: rgba(63,127,212,.17) !important;
}

/* ---------- Responsive ---------- */

@media(max-width:1200px) {
  #elizna-r12-utility {
    grid-template-columns: 1fr auto;
  }

  .elz-r12-account {
    grid-column: 1 / -1;
    border-left: 0;
    border-top: 1px solid rgba(120,95,60,.13);
    padding-top: 8px;
  }
}

@media(max-width:760px) {
  #elizna-r12-utility {
    grid-template-columns: 1fr;
  }

  .elz-r12-actions-wrap,
  .elz-r12-actions-button,
  .elz-r12-ask-button {
    width: 100%;
  }

  .elz-r12-account {
    min-width: 0;
  }
}