/* ============================================================
   Design tokens — Ortopedia Belgrano (molde operativo)
   Fuente unica de verdad del sistema visual. Cambiar un color
   aca lo cambia en TODAS las vistas. Nada de hex sueltos.
   ============================================================ */

/* Fuentes autohosteadas (antes Google Fonts CDN). Cada familia es un
   unico archivo variable (subset latin): Montserrat cubre 600/700/800,
   Open Sans cubre 400/500/600/700 - el navegador interpola el peso
   pedido dentro del mismo archivo, por eso varios @font-face comparten
   el mismo src (asi lo serv­ia tambien Google Fonts). */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600 800;
  font-display: swap;
  src: url('/app/fonts/montserrat-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/app/fonts/open-sans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* --- superficie --- */
  --ob-bg:        #EEF2F6;
  --ob-surface:   #ffffff;
  --ob-surface-2: #FAFBFD;

  /* --- marca --- */
  --ob-navy:        #14457A;  /* primario (texto/acento) */
  --ob-navy-deep:   #0E3460;  /* fondo sidebar */
  --ob-navy-active: #1A5FA0;  /* item activo del sidebar */
  --ob-orange:      #FF7847;  /* acento naranja (barra activa, CTA envio) */

  /* --- texto --- */
  --ob-ink:      #172230;
  /* Contraste medido sobre LAS DOS superficies: la tarjeta blanca Y el fondo
     gris --ob-bg (#EEF2F6). La medicion anterior era solo sobre blanco, y el
     mismo gris que pasaba AA en la tarjeta (#6B7885 = 4.52:1) caia a 4.01:1
     sobre el fondo — justo donde viven los labels de KPI y los metadatos que
     el deposito lee parado, a distancia de mostrador.
     --ob-muted pasa AA en ambas (4.86 sobre bg / 5.47 sobre blanco);
     --ob-muted-2 pasa AA sobre blanco (4.86) y roza sobre bg (4.32): sigue
     siendo para pistas, nunca dato. */
  --ob-muted:    #5C6B7A;  /* 4.86:1 bg · 5.47:1 blanco — AA en ambas */
  --ob-muted-2:  #66737F;  /* 4.86:1 blanco · 4.32:1 bg — solo pistas, nunca dato */
  --ob-side-ink: #CFE0F0;

  /* --- bordes --- */
  --ob-border:       #E3E9F0;
  --ob-border-2:     #DDE5EE;
  --ob-field-border: #C9D8EA;

  /* --- estados (semaforo) --- */
  /* Ojo con --ob-warn: el valor viejo (#B45309) daba 4.43:1 sobre --ob-warn-bg,
     o sea REPROBABA AA sobre su propio fondo — y ese par se usa para el aviso de
     transferencia pendiente, que es dato operativo. #B25209 lo sube a 4.52:1 y
     mejora todos los demas pares (5.12:1 sobre blanco). El corrimiento de tono
     es imperceptible; el que se arregla es el contraste. */
  --ob-ok:        #15803D;  --ob-ok-bg:     #E7F6EC;  --ob-ok-dot:     #16A34A;
  --ob-warn:      #B25209;  --ob-warn-bg:   #FCEFDD;  --ob-warn-dot:   #D97706;
  --ob-danger:    #B91C1C;  --ob-danger-bg: #FBE9E9;  --ob-danger-dot: #DC2626;
  --ob-info:      #1D4ED8;  --ob-info-bg:   #E7F0FE;

  /* --- semaforo: bordes, tintes de superficie y tinta secundaria ---
     La triada (texto/fondo/punto) alcanzaba para una pill, no para una SUPERFICIE
     seleccionable como las tiles de cobro: ahi hacen falta ademas un borde y una
     tinta secundaria. Estaban resueltos con hex sueltos en las vistas, y los tres
     subtitulos reprobaban AA a 11.5px (3.40 a 4.19:1). Estos valores estan medidos
     contra su PROPIO tinte, no contra blanco. */
  --ob-ok-border:   #BCE4C8;  --ob-ok-tint:   #F1FBF4;  --ob-ok-ink-2:   #4E775C; /* 4.82:1 */
  --ob-warn-border: #F3D9C4;  --ob-warn-tint: #FFF8ED;
  /* danger-border vivia como #F1C4C4 suelto en cobros.js (boton Rechazar, x3)
     y lo iba a repetir la vista Verificacion: color repetido -> nace token. */
  --ob-danger-border: #F1C4C4;
  --ob-info-border: #C6D4FA;                            --ob-info-ink-2: #506BAB; /* 4.54:1 */
  --ob-navy-tint:   #F4F8FC;                            --ob-navy-ink-2: #567492; /* 4.57:1 */

  /* --- accion secundaria ---
     Azul de "adjuntar / refrescar": ni --ob-navy (primario) ni --ob-info (estado).
     Vivia como #2A6FB0 repetido en venta.js y cobros.js: usado en dos vistas ya no
     era un descuido, era un color del sistema sin nombre. Blanco encima: 5.25:1. */
  --ob-link: #2A6FB0;

  /* --- legados de base.css, ahora con nombre ---
     DESIGN.md ya los declaraba en su paleta y los marcaba "a migrar, no a imitar";
     seguian como hex sueltos. Un color declarado y sin token es un token pendiente. */
  /* El verde viejo (#2EA88B) dejaba el texto blanco del boton en 2.96:1 —
     ilegible a distancia de mostrador. Este pasa AA (5.33:1 con blanco). */
  --ob-verde-accion:  #17795F;  /* boton de confirmacion positiva */
  --ob-celeste-marca: #CBE3FB;  /* bloque de marca del sidebar */
  --ob-celeste-hover: #BCD9F7;
  --ob-sku-bg:        #EAF1F9;
  --ob-sku-border:    #D5E3F1;
  --ob-ghost-border:  #F0C7B0;  /* borde del boton ghost */

  /* --- forma --- */
  --ob-r-card:  14px;
  --ob-r-field: 8px;
  --ob-r-pill:  999px;
  --ob-shadow:  0 14px 34px -16px rgba(23,34,48,.4);

  /* --- tipografia --- */
  --ob-font:      'Open Sans', system-ui, sans-serif;
  --ob-font-head: 'Montserrat', system-ui, sans-serif;
}