/* ============================================================
   tokens.css — Sistema de diseño URI://STUDIO (v1, oct 2026)
   Colores, tipografía y forma compartidos por la tienda, el
   seguimiento de pedidos y el taller. Nombres al estilo shadcn/ui
   para poder migrar más adelante sin renombrar nada.
   Tema oscuro por defecto; claro si el sistema lo prefiere o si
   la página fija data-theme="light". data-theme="dark" en cualquier
   elemento lo deja en oscuro.
   ============================================================ */

/* Fuentes de interfaz autoalojadas (OFL-1.1, vía Fontsource).
   Las de public/fonts/*.ttf son de producto (texto 3D) y no se usan en la UI. */
@font-face { font-family: 'Unbounded'; font-weight: 500; font-display: swap; src: url('/fonts/ui/unbounded-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Unbounded'; font-weight: 500; font-display: swap; src: url('/fonts/ui/unbounded-latin-ext-500-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Unbounded'; font-weight: 700; font-display: swap; src: url('/fonts/ui/unbounded-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Unbounded'; font-weight: 700; font-display: swap; src: url('/fonts/ui/unbounded-latin-ext-700-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Instrument Sans'; font-weight: 400; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Instrument Sans'; font-weight: 400; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-ext-400-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Instrument Sans'; font-weight: 500; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-500-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Instrument Sans'; font-weight: 500; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-ext-500-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Instrument Sans'; font-weight: 600; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Instrument Sans'; font-weight: 600; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-ext-600-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Instrument Sans'; font-weight: 700; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-700-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Instrument Sans'; font-weight: 700; font-display: swap; src: url('/fonts/ui/instrument-sans-latin-ext-700-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'JetBrains Mono'; font-weight: 400; font-display: swap; src: url('/fonts/ui/jetbrains-mono-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-weight: 400; font-display: swap; src: url('/fonts/ui/jetbrains-mono-latin-ext-400-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'JetBrains Mono'; font-weight: 600; font-display: swap; src: url('/fonts/ui/jetbrains-mono-latin-600-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-weight: 600; font-display: swap; src: url('/fonts/ui/jetbrains-mono-latin-ext-600-normal.woff2') format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --background: #0E1116;  --foreground: #E6E9EF;
  --card: #161A21;        --card-foreground: #E6E9EF;
  --muted: #1E232C;       --muted-foreground: #A3ACBA;
  --primary: #7DD3FC;     --primary-foreground: #052636;
  --primary-soft: #0F2A3A;
  --border: #2C333F;      --input: #6B768A;   --ring: #7DD3FC;
  --success: #72D99E;     --warning: #FFB951; --destructive: #FF8A80;
  --grid: rgba(125, 211, 252, .10);
  --glow: rgba(125, 211, 252, .16);
  --shadow-pop: 0 30px 80px -40px rgba(0, 0, 0, .7);
  --backdrop: rgba(6, 8, 12, .72);

  --font-display: "Unbounded", "Arial Black", system-ui, sans-serif;
  --font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --radius-sm: 6px; --radius: 10px; --radius-lg: 14px;
  --ease: cubic-bezier(.2, 0, 0, 1);
  color-scheme: dark;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --background: #F6F8FA;  --foreground: #0E1116;
    --card: #FFFFFF;        --card-foreground: #0E1116;
    --muted: #EBEFF3;       --muted-foreground: #4E5868;
    --primary: #0369A1;     --primary-foreground: #FFFFFF;
    --primary-soft: #E0F2FE;
    --border: #D3DAE2;      --input: #7A8494;   --ring: #0369A1;
    --success: #137333;     --warning: #985300; --destructive: #C0262D;
    --grid: rgba(3, 105, 161, .09);
    --glow: rgba(3, 105, 161, .10);
    --shadow-pop: 0 24px 60px -30px rgba(14, 17, 22, .35);
    --backdrop: rgba(14, 17, 22, .45);
    color-scheme: light;
  }
}
[data-theme="light"] {
  --background: #F6F8FA;  --foreground: #0E1116;
  --card: #FFFFFF;        --card-foreground: #0E1116;
  --muted: #EBEFF3;       --muted-foreground: #4E5868;
  --primary: #0369A1;     --primary-foreground: #FFFFFF;
  --primary-soft: #E0F2FE;
  --border: #D3DAE2;      --input: #7A8494;   --ring: #0369A1;
  --success: #137333;     --warning: #985300; --destructive: #C0262D;
  --grid: rgba(3, 105, 161, .09);
  --glow: rgba(3, 105, 161, .10);
  --shadow-pop: 0 24px 60px -30px rgba(14, 17, 22, .35);
  --backdrop: rgba(14, 17, 22, .45);
  color-scheme: light;
}

/* Una zona concreta (p. ej. un diálogo) puede fijar el tema oscuro aunque la página esté en claro */
:root[data-theme="dark"], [data-theme="dark"] {
  --background: #0E1116;  --foreground: #E6E9EF;
  --card: #161A21;        --card-foreground: #E6E9EF;
  --muted: #1E232C;       --muted-foreground: #A3ACBA;
  --primary: #7DD3FC;     --primary-foreground: #052636;
  --primary-soft: #0F2A3A;
  --border: #2C333F;      --input: #6B768A;   --ring: #7DD3FC;
  --success: #72D99E;     --warning: #FFB951; --destructive: #FF8A80;
  --grid: rgba(125, 211, 252, .10);
  --glow: rgba(125, 211, 252, .16);
  --shadow-pop: 0 30px 80px -40px rgba(0, 0, 0, .7);
  --backdrop: rgba(6, 8, 12, .72);
  color-scheme: dark;
}

/* Base común */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font: 16px/1.6 var(--font-sans);
  -webkit-font-smoothing: antialiased;
}
:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; border-radius: 4px; }
.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.eyebrow { font: 600 .75rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted-foreground); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}