/* =====================================================================
   Punto de Venta — tokens de color y tipografia autoalojada
   ---------------------------------------------------------------------
   Razon de ser: una sola fuente de verdad para color y tipo de toda la app
   (panel, POS, login, PWA). Lo cargan views/_head.php y views/login.php.
   Paleta neutra: grafito y grises pizarra, sin marca. Contraste AA comprobado
   (texto >= 4.5:1, bordes de campo >= 3:1). Los nombres --kh-* se conservan
   porque los usan las vistas; ya no son colores de ninguna marca.
   Nada de CDN en tiempo de ejecucion: las fuentes viven en /public/webfonts.
   ===================================================================== */

/* ---- Tipografia (variable, latin + latin-ext; OFL) ---- */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../webfonts/montserrat-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../webfonts/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+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Alias: el codigo heredado (pos-clasica.css, pos-cobro.css, vistas) pide 'Outfit'. Se sirve Montserrat bajo ese nombre. */
@font-face{font-family:'Outfit';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../webfonts/montserrat-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(../webfonts/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+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---- Constantes (no cambian con el tema) ---- */
:root{
  /* superficies decorativas (antes lilas): grises pizarra */
  --kh-lila:#C9CED5;            /* gris medio claro: lineas decorativas, rellenos suaves */
  --kh-lila-profundo:#4B5562;   /* gris pizarra: iconos y acentos (7.4:1 con blanco) */
  --kh-lila-claro:#EEF0F3;      /* gris muy claro: fondos suaves */
  --kh-plata:#C8CCD1;
  --kh-blanco:#FFFFFF;
  --kh-grafito:#22272E;         /* texto principal (15:1 sobre blanco) */

  /* accion: grafito sobrio */
  --kh-accion:#2F3742;          /* 11.6:1 con blanco · botones, nav activa, enlaces */
  --kh-accion-hover:#1D232B;
  --kh-accion-texto:#2F3742;

  --kh-fondo:#F5F6F8;           /* fondo de pagina */
  --kh-linea:#DFE2E7;           /* hairline */
  --kh-linea-fuerte:#8A929C;    /* bordes de campos: 3.3:1 sobre blanco */
  --kh-mut:#5A626D;             /* texto secundario: 6.2:1 sobre blanco */

  /* semanticos */
  --kh-ok:#2E7D5B; --kh-peligro:#B3261E; --kh-aviso:#9A5B00; --kh-info:#3D5A73;

  /* tipografia: una sola familia sin serifas (sin aire de marca) */
  --kh-serif:'Montserrat','Outfit',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --kh-sans:'Montserrat','Outfit',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;

  /* forma */
  --kh-radio:14px; --kh-radio-sm:10px;
  --kh-sombra:0 1px 2px rgba(20,24,30,.05),0 10px 24px -16px rgba(20,24,30,.28);
  --kh-sombra-fuerte:0 24px 54px -22px rgba(20,24,30,.5);
  --kh-foco:0 0 0 3px rgba(75,85,98,.30);

  --kh-bp:900px;   /* bajo este ancho el menu es cajon y todo pasa a "movil primero" */
}

/* ---- Superficies del panel: claro (por defecto) ---- */
body.kh{
  --bg:var(--kh-fondo); --panel:#FFFFFF; --panel2:var(--kh-lila-claro); --bd:var(--kh-linea);
  --tx:var(--kh-grafito); --mut:var(--kh-mut);
  --ac:var(--kh-accion); --ac-fill:var(--kh-accion); --ac-dark:var(--kh-accion-hover); --ac2:var(--kh-lila); --ac-tx:var(--kh-accion-texto);
  --ok:var(--kh-ok); --danger:var(--kh-peligro); --danger-fill:#B3261E; --warn:var(--kh-aviso); --info:var(--kh-info);
  --campo-bd:var(--kh-linea-fuerte);
  --sel-bg:rgba(75,85,98,.22);
  --color-primary:var(--kh-accion); --color-primary-dark:var(--kh-accion-hover);
  color-scheme:light;
}

/* ---- Modo oscuro: grafito casi negro ---- */
body.kh.store-dark{
  --bg:#121417; --panel:#1B1E22; --panel2:#24282D; --bd:#353B42;
  --tx:#ECEEF1; --mut:#A6AEB7;
  /* --ac = acento COMO TEXTO/ICONO (claro sobre oscuro); --ac-fill = relleno de boton (texto blanco encima) */
  --ac:#D3D8DE; --ac-fill:#4A5563; --ac-dark:#5A6574; --ac2:#9AA3AD; --ac-tx:#D3D8DE;
  --ok:#5BC596; --danger:#F29A93; --danger-fill:#B3261E; --warn:#EDB662; --info:#9DB7CC;
  --campo-bd:#5B636D;
  --sel-bg:rgba(211,216,222,.22);
  --color-primary:#4A5563; --color-primary-dark:#5A6574;
  --kh-linea:#353B42; --kh-fondo:#121417; --kh-lila-claro:#24282D; --kh-accion-texto:#D3D8DE;
  --kh-mut:#A6AEB7; --kh-linea-fuerte:#5B636D; --kh-lila-profundo:#B4BCC5; --kh-lila:#4A525C;
  --kh-sombra:0 1px 2px rgba(0,0,0,.3),0 10px 24px -16px rgba(0,0,0,.6);
  color-scheme:dark;
}
