/*
 * Voiplix Wiki — design tokens.
 * Light: same HSL variable names/values as apps/web/app/globals.css `:root`.
 * Dark: the wiki's dark mode IS the product's "glass" theme — the lead's
 * explicit direction, since every screenshot in this wiki is captured in
 * that theme (apps/web/app/globals.css `.dark[data-theme="glass"]`,
 * apps/web/lib/theme/themes.ts id "glass"): a cool, neutral slate (215°)
 * with a brighter sky-blue accent (200°) and the same gloss treatment on
 * raised surfaces (see wiki.css `.glass-surface`, ported from the
 * `background-image` recipe around globals.css:660 — a 1px light edge plus
 * a 160deg diagonal into `--secondary`, no backdrop-filter, no box-shadow,
 * no motion, for the same reasons the product gives there).
 * Extra --wiki-* tokens are additions only used inside the wiki itself.
 */

:root {
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;
  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;
  --primary: 222.2 47.4% 11.2%;
  --primary-foreground: 210 40% 98%;
  --secondary: 210 40% 96.1%;
  --secondary-foreground: 222.2 47.4% 11.2%;
  --muted: 210 40% 96.1%;
  --muted-foreground: 215.4 16.3% 46.9%;
  --accent: 210 40% 96.1%;
  --accent-foreground: 222.2 47.4% 11.2%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;
  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 222.2 84% 4.9%;
  --radius: 0.5rem;
  color-scheme: light;

  /* Callout accents (wiki-only, on top of the product tokens above) */
  --wiki-tip: 142 71% 35%;
  --wiki-tip-bg: 142 60% 96%;
  --wiki-note: 217 91% 55%;
  --wiki-note-bg: 214 90% 96%;
  --wiki-warn: 38 92% 42%;
  --wiki-warn-bg: 43 96% 95%;

  --wiki-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --wiki-shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.06);
  --wiki-shadow-lg: 0 20px 40px -12px rgb(0 0 0 / 0.18);
  --wiki-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);

  --wiki-topbar-h: 56px;
  --wiki-sidebar-w: 268px;
  --wiki-toc-w: 220px;
  --wiki-content-max: 760px;
}

:root[data-theme="dark"] {
  /* = apps/web/app/globals.css .dark[data-theme="glass"], verbatim. */
  --background: 215 30% 9%;
  --foreground: 210 30% 98%;
  --card: 215 28% 12%;
  --card-foreground: 210 30% 98%;
  --popover: 215 28% 14%;
  --popover-foreground: 210 30% 98%;
  --primary: 200 85% 62%;
  --primary-foreground: 215 40% 8%;
  --secondary: 215 22% 19%;
  --secondary-foreground: 210 30% 98%;
  --muted: 215 22% 17%;
  --muted-foreground: 213 18% 74%;
  --accent: 215 24% 22%;
  --accent-foreground: 210 30% 98%;
  --destructive: 0 62.8% 45%;
  --destructive-foreground: 0 0% 98%;
  --border: 215 20% 22%;
  --input: 215 20% 25%;
  --ring: 200 85% 62%;
  color-scheme: dark;

  --wiki-tip: 152 55% 58%;
  --wiki-tip-bg: 152 30% 14%;
  --wiki-note: 200 85% 68%;
  --wiki-note-bg: 210 35% 17%;
  --wiki-warn: 38 92% 62%;
  --wiki-warn-bg: 38 35% 15%;

  --wiki-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);
  --wiki-shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.45);
  --wiki-shadow-lg: 0 20px 40px -12px rgb(0 0 0 / 0.55);
  --wiki-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.6);
}

/* No explicit choice saved yet: follow the OS, exactly like the product's
   anti-FOUC default before a cookie exists — and land on the same "glass"
   values, since that IS the wiki's default look. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --background: 215 30% 9%;
    --foreground: 210 30% 98%;
    --card: 215 28% 12%;
    --card-foreground: 210 30% 98%;
    --popover: 215 28% 14%;
    --popover-foreground: 210 30% 98%;
    --primary: 200 85% 62%;
    --primary-foreground: 215 40% 8%;
    --secondary: 215 22% 19%;
    --secondary-foreground: 210 30% 98%;
    --muted: 215 22% 17%;
    --muted-foreground: 213 18% 74%;
    --accent: 215 24% 22%;
    --accent-foreground: 210 30% 98%;
    --destructive: 0 62.8% 45%;
    --destructive-foreground: 0 0% 98%;
    --border: 215 20% 22%;
    --input: 215 20% 25%;
    --ring: 200 85% 62%;
    color-scheme: dark;

    --wiki-tip: 152 55% 58%;
    --wiki-tip-bg: 152 30% 14%;
    --wiki-note: 200 85% 68%;
    --wiki-note-bg: 210 35% 17%;
    --wiki-warn: 38 92% 62%;
    --wiki-warn-bg: 38 35% 15%;

    --wiki-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);
    --wiki-shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.45);
    --wiki-shadow-lg: 0 20px 40px -12px rgb(0 0 0 / 0.55);
    --wiki-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.6);
  }
}