/* DISEÑO CORPORATIVO ASRN para ContaNik central — 2026-10-20.
   Se carga al final del <head> de base.html y login.html y solo redefine estilos: no cambia lógica,
   rutas, datos ni permisos. Todo va limitado a body:not(.asrn-app) para no afectar a ASRN SCANNER /
   ASRN VERIFICADOR (que reutilizan estas plantillas con su propia hoja de marca).
   Naranja #FF7900 (hover #E06A00) · Negro #111318 · Fondo #F3F4F6 · Blanco · Poppins 400-700.
   Verde/rojo/ámbar se mantienen: indican estados (OK, error, aviso) e importes positivos/negativos. */

@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fuentes/poppins-latin-ext-400-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fuentes/poppins-latin-400-normal.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; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(/static/fuentes/poppins-latin-ext-500-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(/static/fuentes/poppins-latin-500-normal.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; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(/static/fuentes/poppins-latin-ext-600-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(/static/fuentes/poppins-latin-600-normal.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; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(/static/fuentes/poppins-latin-ext-700-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(/static/fuentes/poppins-latin-700-normal.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; }

/* ── Paleta: se cambian las variables originales de base.html (origen de casi todos los colores) ── */
body:not(.asrn-app) {
    --brand: #111318; --brand-h: #1C1F27;
    --accent: #FF7900; --accent-bg: rgba(255,121,0,.16); --accent-dim: rgba(255,121,0,.08);
    --asrn-or-h: #E06A00; --asrn-ring: rgba(255,121,0,.20);
    --bg: #F3F4F6; --surface: #FFFFFF; --border: #E5E7EB; --border-mid: #D1D5DB;
    --text-1: #111318; --text-2: #4B5563; --text-3: #8A929C;
    --r-sm: 8px; --r: 12px; --r-lg: 16px;
    --asrn-sombra: 0 1px 2px rgba(17,19,24,.04), 0 4px 14px rgba(17,19,24,.05);
    background: var(--bg);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

/* ── Poppins en toda la interfaz ── */
body:not(.asrn-app), body:not(.asrn-app) :is(button, input, select, textarea, .btn, .chip, table, th, td) {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif !important;
}
body:not(.asrn-app) :is(h1, h2, .sb-logo-name, #topbar-title) { font-weight: 700; letter-spacing: -.01em; }
body:not(.asrn-app) :is(.stat .num, .stat-value, .num) { font-variant-numeric: tabular-nums; }

/* ── Menú lateral oscuro: iconos claros, selección naranja ── */
body:not(.asrn-app) #sidebar { background: #111318; border-right: 1px solid rgba(255,255,255,.05); }
body:not(.asrn-app) .sb-logo { border-bottom: 1px solid rgba(255,121,0,.35); }
/* !important: la plantilla pone un color fijo por rol (p. ej. #6366f1 en el jefe) */
body:not(.asrn-app) .sb-logo-mark { background: #FF7900 !important; color: #FFFFFF; border-radius: 9px; }
body:not(.asrn-app) .sb-group-label { color: rgba(255,255,255,.38); }
body:not(.asrn-app) .sb-item { color: rgba(255,255,255,.74); border-radius: 9px; }
body:not(.asrn-app) .sb-item .sb-ic { color: rgba(255,255,255,.85); opacity: .9; }
body:not(.asrn-app) .sb-item:hover { background: rgba(255,255,255,.07); color: #FFFFFF; }
body:not(.asrn-app) .sb-item.active { background: rgba(255,121,0,.16); color: #FFFFFF; box-shadow: inset 3px 0 0 #FF7900; }
body:not(.asrn-app) .sb-item.active .sb-ic { color: #FF7900; opacity: 1; }
body:not(.asrn-app) .sb-footer { border-top-color: rgba(255,255,255,.07); }
body:not(.asrn-app) .sb-avatar { background: #FF7900 !important; color: #FFFFFF; }
@media (max-width: 768px) {
    body:not(.asrn-app) #topbar { background: #111318; border-bottom: 3px solid #FF7900; }
}
body:not(.asrn-app) #mob-tabs { box-shadow: 0 -2px 10px rgba(17,19,24,.06); }
body:not(.asrn-app) .mob-tab.active { color: #FF7900; border-top-color: #FF7900; }

/* ── Tarjetas y estadísticas: blancas, bordes suaves, sombra discreta ── */
body:not(.asrn-app) :is(.card, .stat) { background: #FFFFFF; border-color: var(--border); border-radius: var(--r); box-shadow: var(--asrn-sombra); }
body:not(.asrn-app) .stat .label, body:not(.asrn-app) .stat-label { color: var(--text-3); }

/* ── Botones principales naranjas con texto blanco ── */
body:not(.asrn-app) :is(.btn-primary, .btn-accent) { background: #FF7900; color: #FFFFFF; }
body:not(.asrn-app) :is(.btn-primary, .btn-accent):hover { background: #E06A00; filter: none; }
body:not(.asrn-app) .btn { border-radius: var(--r-sm); }
body:not(.asrn-app) .btn-ghost:hover { border-color: #FF7900; color: #111318; }
/* Botones con color fijo en la plantilla (subir Excel, importar mayorista): mismo naranja */
body:not(.asrn-app) button[style*="background:#1d9e75"] { background: #FF7900 !important; }
body:not(.asrn-app) button[style*="background:#1d9e75"]:hover { background: #E06A00 !important; }
body:not(.asrn-app) .chip.active, body:not(.asrn-app) .chip.activo { background: #FF7900; border-color: #FF7900; color: #FFFFFF; }
body:not(.asrn-app) .chip:hover:not(.active):not(.activo) { border-color: #FF7900; }

/* ── Campos: blancos, bordes suaves, resaltado naranja al enfocar ── */
body:not(.asrn-app) :is(.input, input[type="text"], input[type="date"], input[type="number"], input[type="password"], input[type="search"], select, textarea) {
    background: #FFFFFF; border-color: var(--border); border-radius: var(--r-sm);
}
body:not(.asrn-app) :is(.input, input, select, textarea):focus {
    border-color: #FF7900 !important; box-shadow: 0 0 0 3px var(--asrn-ring); outline: none;
}
body:not(.asrn-app) :is(button, a, input, select, textarea):focus-visible { outline: 2px solid #FF7900; outline-offset: 2px; }

/* ── Tablas ── */
body:not(.asrn-app) :is(thead th, th) { color: var(--text-3); border-bottom-color: var(--border); }
body:not(.asrn-app) td { border-bottom-color: #EEF0F3; }
body:not(.asrn-app) tbody tr:hover td { background: #FFF8F2; }

/* ── Pantalla de acceso (login.html, sin menú) ── */
body:not(.asrn-app):has(.login-box) { background: #111318; }
body:not(.asrn-app) .login-box { border-top: 5px solid #FF7900; border-radius: 16px; }
body:not(.asrn-app) .login-box .logo h1 { color: #111318; font-weight: 700; }
body:not(.asrn-app) .login-box .logo p { color: #6B7280; }
body:not(.asrn-app) .login-box input { background: #FFFFFF; border-color: #E5E7EB; }
body:not(.asrn-app) .login-box button { background: #FF7900; font-weight: 600; }
body:not(.asrn-app) .login-box button:hover { background: #E06A00; }

/* ── Monitores grandes (34" ultrawide / 4K) ── */
@media (min-width: 1800px) { body:not(.asrn-app) .container { max-width: 1560px; } }
@media (min-width: 2400px) { body:not(.asrn-app) .container { max-width: 1700px; zoom: 1.15; } }
