/* ==========================================================================
   tokens.css — Design tokens del formulario de egresados (STEP-07)
   Plan: .agents/plans/2026-09-30-formulario-egresados.md §7

   Paleta oficial (E-21): verde #C7D309, gris #808286.
   Restricciones de contraste documentadas en el plan:
   - #808286 NO alcanza 4.5:1 para texto normal => solo texto grande,
     bordes y elementos decorativos.
   - #C7D309 NUNCA lleva texto blanco (~1.65:1) => CTA verde con texto oscuro.
   Los breakpoints se escriben como valores literales dentro de @media
   (las custom properties no son validas en media queries).
   ========================================================================== */

:root {
  /* Superficies */
  --color-surface: #FFFFFF;
  --color-surface-muted: #F4F6F9;

  /* Texto */
  --color-text: #1F2733;
  --color-text-muted: #808286; /* solo texto grande / decorativo */

  /* Marca */
  --color-primary: #C7D309;
  --color-on-primary: #1F2733;

  /* Bordes */
  --color-border: #808286;
  --color-border-subtle: #D7DEE6;

  /* Semánticos */
  --color-success: #1E7A46;
  --color-danger: #B3261E;
  --color-focus: #1F2733;

  /* Tipografía */
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fs-0: 0.875rem;   /* 14px */
  --fs-1: 1rem;       /* 16px  (inputs, evita zoom en iOS) */
  --fs-2: 1.125rem;   /* 18px */
  --fs-3: 1.25rem;    /* 20px */
  --fs-4: 1.5rem;     /* 24px */
  --fs-5: 2rem;       /* 32px  */
  --lh-tight: 1.2;
  --lh-base: 1.5;

  /* Espaciado (base 4/8) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* Radios y elevación */
  --radius-s: 4px;
  --radius-m: 8px;
  --shadow-1: 0 1px 2px rgba(31, 39, 51, .08);

  /* Movimiento */
  --dur-1: 120ms;
  --dur-2: 200ms;
  --ease: cubic-bezier(.2, 0, 0, 1);

  /* Layout */
  --form-max: 720px;
  --rail-width: 280px;
  --content-max: 1180px;
  --sticky-h: 44px;
  --scroll-offset: 56px;

  /* Derivados anadidos en el pulido (los tokens anteriores NO cambian):
     primary-strong: hover/active del CTA verde (texto oscuro 8.5:1 sobre el);
     danger-surface: fondo de avisos de error (danger 5.7:1 sobre el);
     dur-3: trazo del check de exito (§7 SCREEN-02: 400ms, una vez). */
  --color-primary-strong: #B8C308;
  --color-danger-surface: #FDECEA;
  --dur-3: 400ms;
}
