/*
 * Portal de Autogestión y Facturación online - modo oscuro.
 * Se activa con <html data-theme="dark"> (botón luna/sol de la barra superior; la elección
 * se recuerda en el navegador). Sólo en pantalla: al imprimir o generar PDF queda claro.
 */
@media screen {
    html[data-theme="dark"] {
        color-scheme: dark;   /* calendarios, listas desplegables y barras de desplazamiento oscuras */
        --bg: #0b1422;
        --surface: #121d2e;
        --text: #e3eaf3;
        --muted: #97a7bb;
        --line: #24344b;
        --navy: #e3eaf3;      /* en el sitio --navy es el color de los títulos */
        --navy-2: #c9d6e6;
        --blue: #4d94ec;
        --blue-soft: rgba(77, 148, 236, .16);
        --green: #2fbf6f;
        --green-soft: rgba(47, 191, 111, .15);
        --red: #f05252;
        --red-soft: rgba(240, 82, 82, .15);
        --amber: #f5a524;
        --grad: linear-gradient(135deg, #164a86 0%, #1d6fd8 100%);
        --shadow-sm: 0 2px 8px rgba(0, 0, 0, .35);
        --shadow: 0 10px 30px rgba(0, 0, 0, .45);
        --shadow-lg: 0 24px 60px rgba(0, 0, 0, .55);
    }

    /* Estructura del portal */
    html[data-theme="dark"] body.portal { background: var(--bg); color: var(--text); }
    html[data-theme="dark"] .p-side { background: #08111d; border-right: 1px solid #1a2739; }
    html[data-theme="dark"] .p-top { background: rgba(18, 29, 46, .92); }
    html[data-theme="dark"] .p-login__form { background: var(--bg); }
    html[data-theme="dark"] .p-foot { color: var(--muted); }

    /* Formularios */
    html[data-theme="dark"] .field input, html[data-theme="dark"] .field textarea, html[data-theme="dark"] .field select,
    html[data-theme="dark"] .p-year select, html[data-theme="dark"] .p-recibo-nav select { background: #0f1a2a; color: var(--text); border-color: var(--line); }
    html[data-theme="dark"] .field input:focus, html[data-theme="dark"] .field textarea:focus, html[data-theme="dark"] .field select:focus { background: #13213a; }
    html[data-theme="dark"] .search input { color: var(--text); background: #0f1a2a; }
    html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: #6f8197; }

    /* Botones, chips y etiquetas */
    html[data-theme="dark"] .btn--ghost:hover { color: #0b2a4a; }
    html[data-theme="dark"] .chip.is-active { background: var(--blue); border-color: var(--blue); color: #fff; }
    html[data-theme="dark"] .badge--ok { color: #6fdca0; }
    html[data-theme="dark"] .badge--warn { background: rgba(245, 165, 36, .16); color: #f7c06b; }
    html[data-theme="dark"] .badge--muted { background: rgba(255, 255, 255, .08); color: #a9b6c6; }
    html[data-theme="dark"] .badge--off { color: #ff9a9a; }
    html[data-theme="dark"] .alert--warn { background: rgba(245, 165, 36, .12); }
    html[data-theme="dark"] .alert--ok { color: var(--text); }
    html[data-theme="dark"] .alert--error { color: var(--text); }
    html[data-theme="dark"] .export-btn--pdf i { color: #ff7a7a; }
    html[data-theme="dark"] .export-btn--xlsx i { color: #4ade80; }

    /* Tablas */
    html[data-theme="dark"] .data-table th { background: #0d2747; color: #fff; }
    html[data-theme="dark"] .data-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, .025); }
    html[data-theme="dark"] .data-table tfoot td { background: #0d2747; color: #fff; }
    html[data-theme="dark"] .data-table td { border-color: var(--line); }

    /* Indicadores del panel */
    html[data-theme="dark"] .p-kpi--amber .p-kpi__icon { background: rgba(245, 165, 36, .16); color: #f7c06b; }
    html[data-theme="dark"] .p-kpi--violet .p-kpi__icon { background: rgba(139, 92, 246, .2); color: #c4b1ff; }
    html[data-theme="dark"] .p-trend.is-up { color: #6fdca0; }

    /* Recibo y comprobantes: el logo tiene letras oscuras, va sobre fondo blanco */
    html[data-theme="dark"] .receipt__brand img, html[data-theme="dark"] .fac-presupuesto__head img { background: #fff; border-radius: 10px; padding: 4px 8px; }
    html[data-theme="dark"] .receipt__head, html[data-theme="dark"] .receipt__foot { border-color: var(--line); }

    /* ---------- Facturación online ---------- */
    html[data-theme="dark"] .fac-info.is-alert { background: rgba(245, 165, 36, .12); }
    html[data-theme="dark"] .fac-zona { --zona-suave: rgba(77, 148, 236, .10); --zona-borde: #2b4a70; }
    html[data-theme="dark"] .fac-zona--practica { --zona-suave: rgba(47, 191, 111, .10); --zona-borde: #245a3c; }
    html[data-theme="dark"] .fac-zona--auditoria { --zona-suave: rgba(139, 92, 246, .14); --zona-borde: #4b3a7a; }
    html[data-theme="dark"] .fac-orden-actual,
    html[data-theme="dark"] .fac-zona--practica .fac-tabla-orden tfoot td,
    html[data-theme="dark"] .fac-consumo,
    html[data-theme="dark"] .fac-prov__total { color: #7fe0a8; }
    html[data-theme="dark"] .fac-consumo.is-alert { color: #ffb4b4; }
    html[data-theme="dark"] .fac-delta.is-sube { color: #6fdca0; }
    html[data-theme="dark"] .fac-delta.is-baja, html[data-theme="dark"] .fac-dif.is-baja { color: #ff8f8f; }
    html[data-theme="dark"] .fac-dif.is-sube { color: #7fb6ff; }
    html[data-theme="dark"] .fac-prov__aviso { color: #f7c06b; }
    html[data-theme="dark"] .fac-chip-n { background: rgba(255, 255, 255, .1); }
    html[data-theme="dark"] .fac-dialogo::backdrop { background: rgba(0, 0, 0, .6); }
    /* La vista previa de las planillas imita el papel: queda blanca */
}

/* Botón luna / sol */
.p-tema { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface);
          color: var(--navy); font-size: 1.15rem; display: grid; place-items: center; cursor: pointer; transition: border-color .2s, color .2s, transform .2s; }
.p-tema:hover { border-color: var(--blue); color: var(--blue); }
.p-tema:active { transform: scale(.94); }
.p-tema:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.p-top .p-tema { margin-left: auto; }
.p-top .p-tema + .p-user { margin-left: 0; }
/* En las páginas sin barra (ingreso): arriba a la derecha */
.p-tema--flotante { position: fixed; top: 14px; right: 14px; z-index: 60; box-shadow: var(--shadow-sm); }
@media print { .p-tema { display: none !important; } }
