/* Rúbrica — design tokens · estilo VAST (vast.levant-net.com), tema oscuro.
   Fuente única de verdad; mismos valores que diseno/tokens.json. */
:root {
  color-scheme: dark;

  /* Color · base */
  --c-ink: #F3F4F6;          /* texto principal */
  --c-muted: #A1A8B5;        /* texto secundario (≥ 7:1 sobre surface) */
  --c-subtle: #8C94A3;       /* íconos/etiquetas inactivas */
  --c-ground: #0E1116;       /* fondo de pantalla (como el sitio) */
  --c-raised: #151922;       /* bandas y barras elevadas */
  --c-surface: #1B1F29;      /* tarjetas, hojas */
  --c-field: #10131A;        /* fondo de inputs (más oscuro que la tarjeta, como el sitio) */
  --c-line: #2A303D;         /* bordes de tarjeta */
  --c-line-strong: #353C4B;  /* bordes de input/botón secundario */
  --c-line-control: #646C80; /* borde de campos y pista del interruptor apagado (≥ 3:1 sobre surface y field, WCAG 1.4.11) */
  --c-divider: #252A36;      /* separadores internos de lista */
  --c-skeleton: #2A303D;     /* líneas de relleno sobre fondo oscuro */

  /* Papel (PDF, cédula capturada): siempre claro */
  --c-paper: #FFFFFF;
  --c-paper-line: #E4E7EC;
  --c-paper-head: #8A93A3;
  --c-paper-text: #555D6B;
  --c-ink-signature: #1E2A4A;

  /* Color · marca VAST */
  --c-primary: #0B33FB;        /* azul eléctrico: botón principal, FAB, banda CTA */
  --c-primary-hover: #2D4DFF;
  --c-accent: #7C93F7;         /* lavanda: enlaces, activos, contornos, palabras destacadas */
  --c-accent-hover: #9DB0FA;
  --c-primary-soft: #1F2747;   /* fondo de cajas de ícono / números */
  --c-primary-softer: #1C2650; /* tarjeta seleccionada */
  --c-primary-tint: #2B3768;   /* avatares, pistas de progreso */
  --c-primary-on-dark: #7C93F7;

  /* Color · estados (texto / fondo) */
  --c-danger: #F28B82;  --c-danger-bg: #3A1E22;   /* Te toca firmar / rechazar */
  --c-warn: #E0B04A;    --c-warn-bg: #33281A;     /* Esperando / pendiente (ámbar del sitio) */
  --c-ok: #5FD394;      --c-ok-bg: #15301F;       /* Firmado / completado (verde de los checks) */
  --c-ok-solid: #1E9450;                          /* círculos de éxito con check blanco */
  --c-neutral: #B4BAC6; --c-neutral-bg: #262B36;  /* Borrador */

  /* Color · cámara */
  --c-camera-1: #2A3140;
  --c-camera-2: #12161E;
  --c-camera-3: #0B0E13;
  --c-camera-panel: rgba(27, 31, 41, 0.94);
  --c-camera-text-muted: #C3C9D4;

  /* Tipografía (el sitio usa una grotesca tipo Helvetica Neue) */
  --font-display: 'Plus Jakarta Sans', 'Inter', -apple-system, system-ui, sans-serif;
  --font-ui: 'Inter', -apple-system, system-ui, 'Helvetica Neue', Arial, sans-serif;
  --font-signature: 'Mrs Saint Delafield', cursive;
  --font-template: 'Newsreader', Georgia, serif;
  --font-mono: ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-display: 28px;
  --fs-h1: 24px;
  --fs-h2: 20px;
  --fs-title: 17px;
  --fs-body: 15px;
  --fs-sm: 14px;
  --fs-xs: 13px;
  --fs-caption: 12px;
  --fs-micro: 11px;

  /* Radios */
  --r-xs: 8px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 16px;   /* tarjetas */
  --r-xl: 20px;
  --r-sheet: 24px;
  --r-tabbar: 24px;
  --r-pill: 999px; /* solo chips, barra inferior y avatares */
  --r-btn: 14px;   /* botones: rectángulo redondeado (app de referencia) */
  --r-control: 12px; /* campos, búsqueda, segmentados */

  /* Espaciado */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px;
  --gutter: 20px;

  /* Alturas de control */
  --h-btn: 50px;
  --h-btn-sm: 44px;
  --h-input: 48px;
  --h-chip: 38px;
  --touch-min: 44px;

  /* Sombras (sutiles en oscuro; el relieve lo dan bordes) */
  --sh-card: 0 4px 16px rgba(0, 0, 0, 0.35);
  --sh-float: 0 10px 30px rgba(0, 0, 0, 0.45);
  --sh-hero: 0 18px 40px rgba(0, 0, 0, 0.45);
  --sh-fab: 0 8px 20px rgba(25, 55, 240, 0.45);

  /* Zonas seguras (Capacitor/iOS) */
  /* iOS: env(); Android (Capacitor 8, SystemBars) inyecta --safe-area-inset-* con las barras reales */
  --safe-top: max(var(--safe-area-inset-top, env(safe-area-inset-top)), 20px);
  --safe-bottom: max(var(--safe-area-inset-bottom, env(safe-area-inset-bottom)), 16px);
}