/* Tokens del sitio de NeoCapita.
 *
 * GENERADO DESDE design.md — no se edita aqui. Si hay que cambiar un valor,
 * se cambia en design.md (raiz del proyecto) y se vuelve a extraer, o los dos
 * se van de las manos y nadie sabe cual manda.
 *
 * El verde de acento sale de lib/core/app_theme.dart: es la marca de la app,
 * no una eleccion de la web. Si cambia alli, cambia aqui.
 *
 * OJO con --color-accent: NUNCA lleva texto blanco encima (3,39:1, por debajo
 * del minimo). El relleno de los botones es --color-accent-deep (5,35:1).
 */
:root {
  --color-paper:       oklch(97.0% 0.003 264.5);
  --color-paper-2:     oklch(99.4% 0.002 264.5);
  --color-paper-3:     oklch(95.3% 0.020 164.6);
  --color-ink:         oklch(20.8% 0.015 261.6);
  --color-ink-2:       oklch(53.3% 0.021 261.3);
  --color-rule:        oklch(94.8% 0.005 258.3);
  --color-accent:      oklch(62.2% 0.133 162.3);
  --color-accent-deep: oklch(51.4% 0.109 162.5);
  --color-accent-ink:  oklch(47.8% 0.100 163.5);
  --color-focus:       oklch(47.8% 0.100 163.5);
  --color-on-accent:   oklch(99.4% 0.002 264.5);
  --color-danger:      oklch(50.0% 0.190  25.0);
  --color-sombra:      oklch(20.8% 0.015 261.6 / 0.14);

  --font-display: "Space Grotesk", system-ui, sans-serif;
  --font-body:    "Inter", system-ui, sans-serif;
  --font-mono:    ui-monospace, SFMono-Regular, Menlo, monospace;

  --space-3xs: 0.25rem; --space-2xs: 0.5rem;  --space-xs:  0.75rem;
  --space-sm:  1rem;    --space-md:  1.5rem;  --space-lg:  2rem;
  --space-xl:  3rem;    --space-2xl: 4.5rem;  --space-3xl: 7rem;

  --text-xs: 0.75rem;  --text-sm: 0.875rem; --text-md: 1.125rem;
  --text-lg: 1.375rem; --text-xl: 1.75rem;  --text-2xl: 2.25rem;
  --text-display: clamp(2.25rem, 6vw, 3.75rem);

  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-short: 180ms;
  --dur-mid:   260ms;

  /* Relleno de controles. Existen como tokens porque la puerta 24 prohibe
     pixeles sueltos y la 48 prohibe improvisar valores a mitad de render. */
  --pad-btn:      12px 20px;
  --pad-btn-lg:   14px;
  --pad-input:    12px 13px;
  --pad-chip:     7px 11px;
  --pad-opt:      11px 8px;

  --radius-card:  20px;
  --radius-input: 12px;
  --radius-pill:  99px;
  --rule: 1px;
}