/* ═══════════════════════════════════════════════════════════════════
   CEART · tokens.css — FUENTE ÚNICA DE VERDAD del sistema de diseño
   ───────────────────────────────────────────────────────────────────
   Todas las pantallas de la app enlazan este archivo. Cada pantalla
   solo declara, en su <style> inline, los tokens que DIFIEREN de aquí
   (tema oscuro de cafetería/scan, sub-paleta de admin, etc.).

   Cambiar un color de marca = editar UNA línea aquí y se propaga a
   todo el producto. No dupliques estos valores en las páginas.
   Valores idénticos a los que ya usaba la app (migración sin cambio
   visual). Las mejoras de contraste/escala vendrán en fases posteriores.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  /* ── Marca ─────────────────────────────────────────────────────── */
  --gold:#F5A623;                    /* dorado primario (acción, marca) */
  --gold-d:#d4890a;                  /* dorado oscuro (texto sobre claro) */
  --gold-pale:rgba(245,166,35,.10);  /* fondo suave dorado */
  --gold-ring:rgba(245,166,35,.22);  /* borde/realce dorado */
  --blue:#1E35D4;                    /* azul secundario */
  --blue-d:#1829ae;                  /* azul oscuro */
  --blue-pale:rgba(30,53,212,.10);   /* fondo suave azul */

  /* ── Neutros y superficies ─────────────────────────────────────── */
  --ink:#010101;                     /* texto principal */
  --canvas:#fffcfc;                  /* fondo de página */
  --surface:#ffffff;                 /* tarjetas / superficies elevadas */
  --surface2:#f7f6f3;                /* superficie secundaria / hover */
  --rule:rgba(1,1,1,.08);            /* líneas y bordes sutiles */
  --muted:#787774;                   /* texto secundario */
  --faint:#b5b3af;                   /* texto terciario / placeholders */

  /* ── Estado: error / éxito / aviso ─────────────────────────────── */
  --err:#b91c1c;        --err-bg:#fef2f2;   --err-border:rgba(185,28,28,.2);
  --suc:#15803d;        --suc-bg:#f0fdf4;   --suc-border:rgba(21,128,61,.2);
  --warn:#92400e;       --warn-bg:#fffbeb;  --warn-border:rgba(146,64,14,.2);

  /* ── Tipografía ────────────────────────────────────────────────── */
  --serif:'Newsreader',Georgia,serif;
  --sans:'Figtree','Helvetica Neue',sans-serif;

  /* ── Movimiento ────────────────────────────────────────────────── */
  --ease:cubic-bezier(.16,1,.3,1);

  /* ── Radios (escala extraída de login) ─────────────────────────── */
  --radius-xs:6px;      /* botones, chips compactos */
  --radius-sm:8px;      /* inputs, controles */
  --radius-md:12px;     /* contenedores medianos, logos */
  --radius-lg:14px;     /* tarjetas */
  --radius-pill:999px;  /* píldoras / toggles segmentados */

  /* ── Elevación (sombras suaves de login) ───────────────────────── */
  --shadow-xs:0 1px 3px rgba(1,1,1,.06);     /* realce sutil (logo, chip activo) */
  --shadow-sm:0 1px 4px rgba(1,1,1,.07);     /* control activo / hover ligero */
  --shadow-card:0 2px 32px rgba(1,1,1,.05);  /* tarjeta — halo amplio, casi transparente */
  --shadow-lg:0 12px 40px rgba(1,1,1,.08);   /* elevado / hover de tarjeta */
  --shadow-focus:0 0 0 3px var(--gold-ring); /* anillo de foco dorado */

  /* ── Layout ────────────────────────────────────────────────────── */
  --sidebar-w:240px;                 /* ancho de barra lateral (escritorio) */
}