/*
 * Tokens de diseño PERCONSUR (rediseño 1.91: lenguaje visual de Apple — iOS en el teléfono, macOS en la computadora).
 * Paleta: fondo agrupado #F2F2F7 (negro puro en tema oscuro) con superficies blancas sin borde (#1C1C1E en oscuro), como
 * las listas agrupadas de iOS; separadores finos casi transparentes. Un solo color de interacción (--tint): el azul
 * corporativo #2454C6 (#6E9BFF en oscuro) para enlaces, selección, íconos y la navegación. El naranja corporativo
 * (--cta) queda para la acción principal de cada pantalla (texto blanco con contraste 4.5:1, WCAG AA).
 * Tipografía: la del sistema (SF Pro en iPhone, iPad y Mac, con tamaños ópticos); Inter (copia local en vendor/fonts)
 * en Windows y Android. Archivo condensada solo para el logotipo. Tamaños de los estilos de texto de iOS (en la
 * computadora shell.css los compacta) con interletrado según el tamaño (apple.css): negativo en títulos, cero en texto.
 * Esquinas amplias; sombras casi imperceptibles: la jerarquía la dan el fondo, el material translúcido y el tamaño de la
 * letra. Movimiento con curvas de resorte críticamente amortiguado (--spring), con rebote leve solo al soltar un gesto
 * (--spring-b).
 * Motivo gráfico: la banda corrugada azul/naranja de los documentos (puerta de contenedor).
 */
:root{
  --navy:#0B2F80; --blue:#2454C6; --blue-d:#0B2F80; --blue-m:#4A72D6; --blue-t:#E9EFFC; --tint:#2454C6;
  --orange:#F36B21; --orange-d:#D9580F; --orange-t:#FDEFE6;
  --cta:#C4500F; --cta-d:#A8440D; --cta-ink:#B84A0E; --focus:#2454C6;
  --canvas:#F2F2F7; --surface:#FFFFFF; --surface-2:#F7F7FA; --fill:#EDEDF2;
  --ink:#1D1D1F; --ink-2:#3C3C43; --muted:#6C6C70; --line:#E5E5EA; --line-2:#D1D1D6;
  --ok:#1F7A45; --ok-t:#E5F4EA; --warn:#B4441A; --warn-t:#FDF0E8; --danger:#D70015; --danger-t:#FDECEE;
  --wa:#1FAF55; --switch:#34C759;
  /* Relleno translúcido de campos, buscadores y chips (se ve igual sobre el fondo y sobre una tarjeta) y selección
     sólida del menú lateral (texto blanco) */
  --fill-t:rgba(118,118,128,.12); --sel:#2454C6;
  /* Materiales translúcidos (barras, hojas, menús): fondo semitransparente + desenfoque y saturación */
  --mat:rgba(255,255,255,.72); --mat-thick:rgba(250,250,252,.86); --mat-edge:rgba(255,255,255,.65); --mat-blur:saturate(180%) blur(24px);
  --scrim:rgba(0,0,0,.28);
  /* Constantes en ambos temas: texto sobre color sólido y colores de la banda corrugada de la marca */
  --on-color:#FFFFFF; --brand-orange:#F26F22; --brand-orange-d:#D65B15; --brand-orange-m:#F58A4A;
  /* Panel azul del acceso en computadora (degradado del azul corporativo; más oscuro en tema oscuro) */
  --login-grad:linear-gradient(135deg,#0B2F80 0%,#1C46AC 58%,#2454C6 100%);
  /* Elevación: 1 tarjeta (casi nada: la separa el fondo) · 2 flotante (controles, pines del mapa, hojas de papel)
     · 3 superpuesto (hojas, diálogos, ventanas del mapa, avisos) · up hoja inferior que sube desde el borde */
  --shadow-1:0 0 0 .5px rgba(0,0,0,.035),0 1px 2px rgba(0,0,0,.035);
  --shadow-2:0 1px 3px rgba(0,0,0,.08),0 4px 14px rgba(0,0,0,.08);
  --shadow-3:0 2px 8px rgba(0,0,0,.06),0 18px 48px rgba(0,0,0,.16);
  --shadow-up:0 -8px 30px rgba(0,0,0,.12);
  /* Esquinas: 2xs detalles (barras, muestras) · xs insignias y etiquetas · sm controles (botones, campos, íconos)
     · r tarjetas y hojas · pill chips y píldoras. Los círculos usan 50 %. */
  --r-2xs:4px; --r-xs:8px; --r-sm:12px; --r:18px; --r-pill:999px;
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --fs-caption:12px; --fs-footnote:13px; --fs-subhead:15px; --fs-body:17px; --fs-title3:20px; --fs-title2:22px; --fs-title1:28px; --fs-large:34px;
  --font-brand:"Archivo","Arial Narrow",Arial,sans-serif;
  --ease:cubic-bezier(.32,.72,0,1);
  /* Resortes (respuesta 0.4 s): --spring amortiguamiento 1.0 (sin rebote) · --spring-b 0.82 (rebote leve, solo
     cuando el gesto trae impulso). Navegadores sin linear() usan --ease. */
  --spring:var(--ease); --spring-b:var(--ease); --dur-spring:.5s; --dur-b:.44s;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px); --sar:env(safe-area-inset-right,0px);
  /* --tab-h: espacio que reserva la barra inferior flotante del teléfono (barra de 62 px + margen) */
  --tab-h:76px; --bar-h:68px;
  /* Capas de la interfaz (de abajo hacia arriba). Los valores 0–5 dentro de un componente son locales. */
  --z-sticky:100; --z-nav:200; --z-sheet:300; --z-busy:1000; --z-toast:1500; --z-login:1800; --z-intro:1900; --z-splash:2000;
  color-scheme:light;
}
@supports (transition-timing-function:linear(0,1)){
  :root{
    --spring:linear(0,.06,.186,.329,.466,.584,.682,.76,.821,.868,.903,.929,.949,.963,.973,.981,.986,.99,.993,.995,1);
    --spring-b:linear(0,.045,.149,.28,.416,.543,.655,.749,.825,.883,.927,.959,.98,.995,1.004,1.009,1.011,1.011,1.01,1.009,1.008,1.006,1.005,1.004,1);
  }
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --navy:#C9D6FA; --tint:#6E9BFF; --blue-t:#14213F; --orange:#FF7A33; --orange-d:#E8661F; --orange-t:#2E1C12; --cta-ink:#FF8A4A; --focus:#6E9BFF;
    --canvas:#000000; --surface:#1C1C1E; --surface-2:#232326; --fill:#2C2C2E;
    --ink:#F5F5F7; --ink-2:#D1D1D6; --muted:#98989F; --line:#2C2C2E; --line-2:#3A3A3C;
    --ok:#30D158; --ok-t:#0F2A18; --warn:#FF9F0A; --warn-t:#2E1E08; --danger:#FF453A; --danger-t:#33110F; --switch:#30D158; --fill-t:rgba(118,118,128,.24); --sel:#2F62DE;
    --mat:rgba(30,30,32,.72); --mat-thick:rgba(30,30,32,.88); --mat-edge:rgba(255,255,255,.08); --scrim:rgba(0,0,0,.5);
    --shadow-1:none; --shadow-2:0 2px 10px rgba(0,0,0,.6); --shadow-3:0 18px 48px rgba(0,0,0,.6); --shadow-up:0 -8px 30px rgba(0,0,0,.6);
    --login-grad:linear-gradient(135deg,#071A4A 0%,#0F2A6E 58%,#1A3C93 100%);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --navy:#C9D6FA; --tint:#6E9BFF; --blue-t:#14213F; --orange:#FF7A33; --orange-d:#E8661F; --orange-t:#2E1C12; --cta-ink:#FF8A4A; --focus:#6E9BFF;
  --canvas:#000000; --surface:#1C1C1E; --surface-2:#232326; --fill:#2C2C2E;
  --ink:#F5F5F7; --ink-2:#D1D1D6; --muted:#98989F; --line:#2C2C2E; --line-2:#3A3A3C;
  --ok:#30D158; --ok-t:#0F2A18; --warn:#FF9F0A; --warn-t:#2E1E08; --danger:#FF453A; --danger-t:#33110F; --switch:#30D158; --fill-t:rgba(118,118,128,.24); --sel:#2F62DE;
  --mat:rgba(30,30,32,.72); --mat-thick:rgba(30,30,32,.88); --mat-edge:rgba(255,255,255,.08); --scrim:rgba(0,0,0,.5);
  --shadow-1:none; --shadow-2:0 2px 10px rgba(0,0,0,.6); --shadow-3:0 18px 48px rgba(0,0,0,.6); --shadow-up:0 -8px 30px rgba(0,0,0,.6);
  --login-grad:linear-gradient(135deg,#071A4A 0%,#0F2A6E 58%,#1A3C93 100%);
  color-scheme:dark;
}
