/*
 * Sentinel Console — custom theme
 *
 * DaisyUI 4.x stores color variables as raw oklch(L C H) components WITHOUT
 * the oklch() wrapper. Components reference them as oklch(var(--p)) etc.
 * Using the old DaisyUI 3.x HSL format ("252 92% 83%") is silently ignored
 * because oklch() treats those numbers as (L=252%, C=92%, H=83deg) — invalid.
 *
 * Reference palette (from .claude/Sentinel Console.html SVG):
 *   #12141f  page background
 *   #1e2030  card surface
 *   #191b29  sidebar
 *   #3f424d  border / separator
 *   #595d6c  muted text
 *   #b5abfc  primary lavender
 *   #5cc79a  success mint
 *   #e0736f  error coral
 */

/* ── Sidebar & chrome color tokens (theme-switchable) ──────────────────── */
:root {
  /* Sidebar chrome — night defaults */
  --s-bg:             rgb(19,21,34);
  --s-border:         rgb(50,52,70);
  --s-text:           rgb(207,211,229);
  --s-text-bright:    rgb(228,231,245);
  --s-text-muted:     rgb(117,121,140);
  --s-text-dimmed:    rgba(255,255,255,0.25);
  --s-accent:         rgb(181,171,252);
  --s-accent-bg:      rgba(181,171,252,0.08);
  --s-accent-border:  rgba(181,171,252,0.35);
  --s-item-active-bg: rgb(43,39,65);
  --s-avatar-ring:    rgb(93,82,148);
  --s-dropdown-bg:    rgb(26,29,46);
  --s-dropdown-border:rgba(255,255,255,0.07);
  --s-hover-faint:    rgba(255,255,255,0.03);
  --s-hover-light:    rgba(255,255,255,0.05);
  --s-hover-medium:   rgb(38,40,55);
  --s-button-border:  rgb(63,66,77);
  /* Page chrome */
  --chrome-loader-bg:       rgb(15,17,26);
  --chrome-loader-icon:     rgb(181,171,252);
  --chrome-loader-ring:     rgba(181,171,252,0.15);
  --chrome-loader-ring-top: rgb(181,171,252);
  --chrome-toast-bg:        rgb(25,27,42);
  --chrome-toast-border:    rgba(255,255,255,0.08);
  --chrome-toast-text:      rgb(207,211,229);
  /* Content area */
  --c-surface:       rgb(30,32,48);
  --c-surface-alt:   rgb(25,27,42);
  --c-surface-deep:  rgb(19,21,34);
  --c-border:        rgb(63,66,77);
  --c-text:          rgb(207,211,229);
  --c-text-bright:   rgb(228,231,245);
  --c-text-mid:      rgb(147,151,171);
  --c-text-muted:    rgb(117,121,140);
  --c-text-label:    rgb(233,233,237);
  --c-text-dim:      rgba(255,255,255,0.35);
  --c-hover:         rgb(38,40,55);
  --c-subtle:        rgba(255,255,255,0.04);
  --c-subtle-more:   rgba(255,255,255,0.07);
  --c-accent:        rgb(181,171,252);
  --c-input-bg:      rgb(18,20,31);
  --c-user-avatar:   rgb(66,58,106);
  /* Severity badge: info/low */
  --badge-info-bg:   rgb(28,38,56);
  --badge-info-text: rgb(143,168,216);
  /* Diff viewer: additions / deletions / modifications */
  --diff-add-bg:     rgb(17,28,22);
  --diff-add-border: rgb(30,52,41);
  --diff-add-text:   rgb(147,171,147);
  --diff-del-bg:     rgb(28,16,20);
  --diff-del-border: rgb(58,36,48);
  --diff-del-text:   rgb(171,147,147);
  --diff-mod-bg:     rgb(25,22,14);
  --diff-mod-border: rgb(53,48,31);
  --diff-mod-sep:    rgb(44,40,26);
}

/* ── Night theme (DaisyUI color tokens) ───────────────────────────────── */
[data-theme="night"] {
  color-scheme: dark;

  /* Primary — lavender #b5abfc (oklch ≈ 76% 0.18 275) */
  --p:  76%  0.18  275;
  --pc: 14%  0.04  275;

  /* Secondary — keep DaisyUI default purple-pink */
  --s:  74%  0.22  342;
  --sc: 14%  0.04  342;

  /* Accent — teal accent */
  --a:  74%  0.17  184;
  --ac: 14%  0.04  184;

  /* Neutral — #3f424d range */
  --n:  28%  0.02  265;
  --nc: 82%  0.02  265;

  /* Base surfaces — the three background levels */
  --b1: 9.5% 0.02  265;   /* #12141f — page background   */
  --b2: 14%  0.03  265;   /* #1e2030 — card / panel      */
  --b3: 12%  0.025 265;   /* #191b29 — sidebar / inputs  */
  --bc: 82%  0.02  265;   /* body content text           */

  /* Success — mint #5cc79a (oklch ≈ 73% 0.14 162) */
  --su:  73% 0.14  162;
  --suc: 14% 0.03  162;

  /* Warning — amber */
  --wa:  80% 0.15   70;
  --wac: 14% 0.03   70;

  /* Info — sky */
  --in:  70% 0.14  222;
  --inc: 14% 0.03  222;

  /* Error — coral #e0736f (oklch ≈ 62% 0.15 24) */
  --er:  62% 0.15   24;
  --erc: 14% 0.02   24;

  /* Rounded corners — match reference card style */
  --rounded-box:  1rem;
  --rounded-btn:  0.5rem;
  --rounded-badge: 1rem;
}

/* ── Light theme ───────────────────────────────────────────────────────── */
[data-theme="light"] {
  color-scheme: light;

  /* DaisyUI color tokens */
  --p:  50%  0.20  275;   /* brand purple, readable on white */
  --pc: 97%  0.01  275;
  --s:  60%  0.20  342;
  --sc: 97%  0.01  342;
  --a:  60%  0.17  184;
  --ac: 97%  0.01  184;
  --n:  88%  0.01  265;
  --nc: 20%  0.02  265;
  --b1: 97%  0.008 265;   /* near-white page background */
  --b2: 93%  0.008 265;   /* card surface */
  --b3: 90%  0.010 265;   /* inputs */
  --bc: 18%  0.02  265;   /* near-black text */
  --su: 73%  0.14  162;
  --suc: 14% 0.03  162;
  --wa: 80%  0.15   70;
  --wac: 14% 0.03   70;
  --in: 70%  0.14  222;
  --inc: 14% 0.03  222;
  --er: 62%  0.15   24;
  --erc: 14% 0.02   24;
  --rounded-box:  1rem;
  --rounded-btn:  0.5rem;
  --rounded-badge: 1rem;

  /* Sidebar chrome overrides */
  --s-bg:             rgb(248,249,251);
  --s-border:         rgb(220,224,234);
  --s-text:           rgb(50,54,80);
  --s-text-bright:    rgb(20,24,48);
  --s-text-muted:     rgb(110,114,140);
  --s-text-dimmed:    rgba(0,0,0,0.30);
  --s-accent:         rgb(103,88,220);
  --s-accent-bg:      rgba(103,88,220,0.10);
  --s-accent-border:  rgba(103,88,220,0.35);
  --s-item-active-bg: rgb(237,234,255);
  --s-avatar-ring:    rgb(147,128,234);
  --s-dropdown-bg:    rgb(248,249,251);
  --s-dropdown-border:rgba(0,0,0,0.08);
  --s-hover-faint:    rgba(0,0,0,0.03);
  --s-hover-light:    rgba(0,0,0,0.05);
  --s-hover-medium:   rgb(224,226,234);
  --s-button-border:  rgb(210,213,224);
  /* Page chrome */
  --chrome-loader-bg:       rgb(248,249,251);
  --chrome-loader-icon:     rgb(103,88,220);
  --chrome-loader-ring:     rgba(103,88,220,0.15);
  --chrome-loader-ring-top: rgb(103,88,220);
  --chrome-toast-bg:        rgb(255,255,255);
  --chrome-toast-border:    rgba(0,0,0,0.08);
  --chrome-toast-text:      rgb(30,34,58);
  /* Content area overrides */
  --c-surface:       rgb(255,255,255);
  --c-surface-alt:   rgb(248,249,251);
  --c-surface-deep:  rgb(240,242,248);
  --c-border:        rgb(210,213,224);
  --c-text:          rgb(30,34,58);
  --c-text-bright:   rgb(20,24,48);
  --c-text-mid:      rgb(80,84,110);
  --c-text-muted:    rgb(110,114,140);
  --c-text-label:    rgb(80,85,105);
  --c-text-dim:      rgba(0,0,0,0.35);
  --c-hover:         rgb(236,238,246);
  --c-subtle:        rgba(0,0,0,0.03);
  --c-subtle-more:   rgba(0,0,0,0.06);
  --c-accent:        rgb(103,88,220);
  --c-input-bg:      rgb(248,249,252);
  --c-user-avatar:   rgb(237,234,255);
  /* Severity badge: info/low */
  --badge-info-bg:   rgb(219,234,254);
  --badge-info-text: rgb(37,99,235);
  /* Diff viewer: additions / deletions / modifications */
  --diff-add-bg:     rgb(240,253,244);
  --diff-add-border: rgb(134,239,172);
  --diff-add-text:   rgb(22,101,52);
  --diff-del-bg:     rgb(254,242,242);
  --diff-del-border: rgb(252,165,165);
  --diff-del-text:   rgb(153,27,27);
  --diff-mod-bg:     rgb(254,252,232);
  --diff-mod-border: rgb(253,224,71);
  --diff-mod-sep:    rgb(250,204,21);
}

/* ── Sidebar nav light-theme overrides ────────────────────────────────── */
[data-theme="light"] .snav-item {
  color: rgb(80,84,110);
}
[data-theme="light"] .snav-item:hover:not(.snav-active) {
  background: rgb(232,234,242);
  color: rgb(20,24,48);
}
[data-theme="light"] .snav-active {
  border-color: rgb(130,110,220);
  background: rgb(235,232,255);
  color: rgb(70,50,190);
}

/* ── Theme toggle icon visibility (CSS-driven, no JS dependency) ───────── */
[data-theme="night"] .icon-moon { display: none; }
[data-theme="light"]  .icon-sun  { display: none; }

/* ── Hide overlay on desktop — defensive against CDN specificity races ── */
@media (min-width: 1024px) {
  .drawer-overlay { display: none !important; }
}

/* ── Hide Alpine-cloak elements until Alpine initialises ── */
[x-cloak] { display: none !important; }

/* ── Compact table rows for data-dense views ── */
.table-compact td,
.table-compact th {
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}

/* ── Severity badge shortcuts ── */
.badge-severity-critical { @apply badge badge-error;   }
.badge-severity-high     { @apply badge badge-warning; }
.badge-severity-medium   { @apply badge badge-info;    }
.badge-severity-low      { @apply badge badge-ghost;   }

/* ── Monospace for JSON diffs and path displays ── */
.font-mono-sm {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8rem;
}

/* ── Light-mode select option background ── */
[data-theme="light"] select option {
  background: rgb(248,249,251);
  color: rgb(20,24,48);
}
