/* QUIPU 3.0 · estilos de cada pantalla, sacados de sus vistas (VIS-004).
   Generado por tools/extraer-estilos.py: cada bloque va encerrado con
   :where(body[data-vista="…"]) y sus grises usan las variables --q3-* de quipu3-ui.css. */

/* ── home (core/app/view/home-view.php) ──────────────────────────────────────────────────────── */
:where(body[data-vista="home"]) .pi {--pi-azul:#1e3a8a;--pi-azul2:#2563eb;--pi-texto:#0f172a;--pi-suave:#64748b;--pi-tenue:#94a3b8;--pi-borde:#e2e8f0;--pi-linea:#f1f5f9;--pi-fondo:#ffffff;--pi-gris:#f8fafc;
    --pi-ok:#15803d;--pi-warn:#f59e0b;--pi-bad:#dc2626;--pi-naranja:#ea580c;--pi-barra:#93c5fd;
    max-width:1400px;margin:0 auto;padding:4px 4px 24px;color:var(--pi-texto);display:grid;gap:16px}
:where(body[data-vista="home"].dark-mode) .pi {--pi-texto:#e2e8f0;--pi-suave:#94a3b8;--pi-tenue:#64748b;--pi-borde:#334155;--pi-linea:#263044;--pi-fondo:#1c2333;--pi-gris:#0f172a;--pi-barra:#3b5fa8}

/* Cabecera */
:where(body[data-vista="home"]) .pi-cab {display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
:where(body[data-vista="home"]) .pi-cab__tit {display:flex;align-items:center;gap:14px;min-width:0}
:where(body[data-vista="home"]) .pi-cab__ico {width:52px;height:52px;border-radius:12px;background:var(--pi-azul);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--q3-fs-3xl);flex:none}
:where(body[data-vista="home"]) .pi-cab h2 {margin:0;font-size:var(--q3-fs-3xl);font-weight:800;letter-spacing:.01em;text-transform:uppercase}
:where(body[data-vista="home"]) .pi-cab p {margin:2px 0 0;color:var(--pi-suave)}
:where(body[data-vista="home"]) .pi-chip {display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:2px 10px;border-radius:20px;font-size:var(--q3-fs-sm);font-weight:600;text-decoration:none;background:#f0fdf4;border:1px solid #bbf7d0;color:var(--pi-ok)}
:where(body[data-vista="home"]) .pi-chip:hover {color:var(--pi-ok);border-color:var(--pi-ok)}
:where(body[data-vista="home"].dark-mode) .pi-chip {background:transparent}
:where(body[data-vista="home"]) .pi-acc {display:flex;gap:8px;flex-wrap:wrap}
:where(body[data-vista="home"]) .pi-btn {display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:9px;border:1px solid var(--pi-borde);background:var(--pi-fondo);color:var(--pi-texto);font-weight:600;font-size:var(--q3-fs-lg);text-decoration:none;white-space:nowrap}
:where(body[data-vista="home"]) .pi-btn:hover {border-color:var(--pi-azul2);color:var(--pi-azul2)}
:where(body[data-vista="home"]) .pi-btn--pri {background:var(--pi-azul2);border-color:var(--pi-azul2);color:#fff}
:where(body[data-vista="home"]) .pi-btn--pri:hover {background:var(--pi-azul);color:#fff}
:where(body[data-vista="home"]) .pi-btn--s {padding:5px 11px;font-size:var(--q3-fs-md)}

/* 1 · Tarjetas */
:where(body[data-vista="home"]) .pi-kpis {display:grid;grid-template-columns:repeat(var(--pi-n),minmax(0,1fr));gap:12px}
:where(body[data-vista="home"]) .pi-kpi {position:relative;border-radius:12px;padding:16px 18px;min-height:118px;overflow:hidden;border:1px solid var(--pi-borde)}
:where(body[data-vista="home"]) .pi-kpi__t {display:flex;align-items:center;gap:10px;font-size:var(--q3-fs-sm);font-weight:600;text-transform:uppercase;letter-spacing:.03em}
:where(body[data-vista="home"]) .pi-kpi__t em {font-size:var(--q3-fs-2xl)}
:where(body[data-vista="home"]) .pi-kpi__v {font-size:var(--q3-fs-4xl);font-weight:800;margin-top:6px;font-variant-numeric:tabular-nums;line-height:1.15}
:where(body[data-vista="home"]) .pi-kpi__s {font-size:var(--q3-fs-md);color:var(--pi-suave);position:relative;z-index:1;padding-right:44px}
:where(body[data-vista="home"]) .pi-kpi__bg {position:absolute;right:14px;bottom:12px;font-size:var(--q3-fs-5xl);opacity:.28}
:where(body[data-vista="home"]) .pi-kpi--azul {background:#eff6ff}:where(body[data-vista="home"]) .pi-kpi--azul .pi-kpi__t em, :where(body[data-vista="home"]) .pi-kpi--azul .pi-kpi__bg {color:#2563eb}:where(body[data-vista="home"]) .pi-kpi--azul .pi-kpi__v {color:#1d4ed8}
:where(body[data-vista="home"]) .pi-kpi--verde {background:#f0fdf4}:where(body[data-vista="home"]) .pi-kpi--verde .pi-kpi__t em, :where(body[data-vista="home"]) .pi-kpi--verde .pi-kpi__bg {color:#16a34a}:where(body[data-vista="home"]) .pi-kpi--verde .pi-kpi__v {color:#15803d}
:where(body[data-vista="home"]) .pi-kpi--ambar {background:#fffbeb}:where(body[data-vista="home"]) .pi-kpi--ambar .pi-kpi__t em, :where(body[data-vista="home"]) .pi-kpi--ambar .pi-kpi__bg {color:#d97706}:where(body[data-vista="home"]) .pi-kpi--ambar.hay .pi-kpi__v {color:#b45309}
:where(body[data-vista="home"]) .pi-kpi--mes {background:var(--pi-fondo)}:where(body[data-vista="home"]) .pi-kpi--mes .pi-kpi__t em, :where(body[data-vista="home"]) .pi-kpi--mes .pi-kpi__bg {color:var(--pi-azul)}
:where(body[data-vista="home"].dark-mode) .pi-kpi {background:var(--pi-fondo)}
:where(body[data-vista="home"]) .pi-mezcla {display:flex;height:6px;border-radius:4px;overflow:hidden;margin-top:8px;background:var(--pi-gris);position:relative;z-index:1;margin-right:44px}
:where(body[data-vista="home"]) .pi-mezcla span {display:block;height:100%}
:where(body[data-vista="home"]) .sube {color:#15803d;font-weight:700}
:where(body[data-vista="home"]) .baja {color:#b91c1c;font-weight:700}

/* Tarjetas de contenido */
:where(body[data-vista="home"]) .pi-g2 {display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px}
:where(body[data-vista="home"]) .pi-card {background:var(--pi-fondo);border:1px solid var(--pi-borde);border-radius:12px;padding:16px;min-width:0}
:where(body[data-vista="home"]) .pi-card__cab {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}
:where(body[data-vista="home"]) .pi-card__cab h3 {margin:0;font-size:var(--q3-fs-xl);font-weight:700;display:flex;align-items:center;gap:8px}
:where(body[data-vista="home"]) .pi-card__cab h3 em {color:var(--pi-azul)}
:where(body[data-vista="home"]) .pi-card__cab small {font-size:var(--q3-fs-md);color:var(--pi-suave)}
:where(body[data-vista="home"]) .pi-cuenta {font-size:var(--q3-fs-sm);font-weight:800;padding:1px 9px;border-radius:20px;background:#fee2e2;color:#991b1b}

/* 2 · Por resolver */
:where(body[data-vista="home"]) .pi-sunat {display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;padding:10px 16px;border-radius:12px;font-size:var(--q3-fs-md);border:1px solid}
:where(body[data-vista="home"]) .pi-sunat--amarillo {background:#fffbeb;border-color:#fde68a}
:where(body[data-vista="home"]) .pi-sunat--rojo {background:#fef2f2;border-color:#fecaca}
:where(body[data-vista="home"].dark-mode) .pi-sunat {background:var(--pi-fondo)}
:where(body[data-vista="home"]) .pi-sunat__punto {width:12px;height:12px;border-radius:50%;flex:0 0 12px}
:where(body[data-vista="home"]) .pi-sunat--amarillo .pi-sunat__punto {background:var(--pi-warn)}
:where(body[data-vista="home"]) .pi-sunat--rojo .pi-sunat__punto {background:var(--pi-bad)}
:where(body[data-vista="home"]) .pi-sunat b {font-size:var(--q3-fs-lg)}
:where(body[data-vista="home"]) .pi-sunat span {color:var(--pi-suave)}
:where(body[data-vista="home"]) .pi-sunat .pi-btn {margin-left:auto}
:where(body[data-vista="home"]) .pi-tarea {display:grid;grid-template-columns:4px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--pi-linea)}
:where(body[data-vista="home"]) .pi-tarea:first-of-type {border-top:0;padding-top:2px}
:where(body[data-vista="home"]) .pi-tarea__barra {align-self:stretch;border-radius:3px}
:where(body[data-vista="home"]) .pi-tarea--rojo .pi-tarea__barra {background:var(--pi-bad)}
:where(body[data-vista="home"]) .pi-tarea--ambar .pi-tarea__barra {background:var(--pi-warn)}
:where(body[data-vista="home"]) .pi-tarea__txt strong {display:block;font-size:var(--q3-fs-lg)}
:where(body[data-vista="home"]) .pi-tarea__txt small {display:block;font-size:var(--q3-fs-md);color:var(--pi-suave);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:where(body[data-vista="home"]) .pi-tarea__monto {font-weight:800;font-size:var(--q3-fs-lg);white-space:nowrap;font-variant-numeric:tabular-nums}
:where(body[data-vista="home"]) .pi-aldia {display:flex;align-items:center;gap:10px;padding:14px 4px;color:var(--pi-ok);font-weight:700}
:where(body[data-vista="home"]) .pi-aldia em {font-size:var(--q3-fs-3xl)}

/* Medios de cobro */
:where(body[data-vista="home"]) .pi-medios {display:grid;gap:12px}
:where(body[data-vista="home"]) .pi-medio {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto;gap:10px;align-items:center;font-size:var(--q3-fs-lg)}
:where(body[data-vista="home"]) .pi-medio__n {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:where(body[data-vista="home"]) .pi-medio__b {height:10px;border-radius:6px;background:var(--pi-gris);overflow:hidden}
:where(body[data-vista="home"]) .pi-medio__b i {display:block;height:100%;border-radius:6px}
:where(body[data-vista="home"]) .pi-medio__v {font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
:where(body[data-vista="home"]) .pi-medio__v span {color:var(--pi-tenue);font-weight:500;font-size:var(--q3-fs-sm);margin-left:4px}

/* 3 · El mes */
:where(body[data-vista="home"]) .pi-mes {display:flex;flex-wrap:wrap;gap:8px 28px;margin-bottom:4px}
:where(body[data-vista="home"]) .pi-mes div {font-size:var(--q3-fs-md);color:var(--pi-suave)}
:where(body[data-vista="home"]) .pi-mes b {display:block;color:var(--pi-texto);font-size:var(--q3-fs-xl);font-variant-numeric:tabular-nums}
:where(body[data-vista="home"]) .pi-mes b.baja {color:#b91c1c}
:where(body[data-vista="home"]) .pi-ley {display:flex;gap:14px;flex-wrap:wrap;font-size:var(--q3-fs-sm);color:var(--pi-suave)}
:where(body[data-vista="home"]) .pi-ley i {display:inline-block;width:14px;height:3px;border-radius:2px;vertical-align:middle;margin-right:5px}
:where(body[data-vista="home"]) .pi-graf {width:100%;height:auto;display:block}
:where(body[data-vista="home"]) .pi-graf text {fill:var(--pi-tenue);font-size:var(--q3-fs-xs)}
:where(body[data-vista="home"]) .pi-graf__tit {margin:6px 0 2px;font-size:var(--q3-fs-sm);color:var(--pi-suave)}
:where(body[data-vista="home"]) .pi-graf .fin {fill:var(--pi-texto);font-weight:700;font-size:var(--q3-fs-sm)}

/* 4 · Ranking */
:where(body[data-vista="home"]) .pi-seg {display:inline-flex;border:1px solid var(--pi-borde);border-radius:9px;overflow:hidden}
:where(body[data-vista="home"]) .pi-seg button {font-size:var(--q3-fs-md);font-weight:600;border:0;background:var(--pi-fondo);color:var(--pi-suave);padding:5px 12px;cursor:pointer}
:where(body[data-vista="home"]) .pi-seg button.on {background:var(--pi-azul);color:#fff}
:where(body[data-vista="home"]) .pi-top {display:grid;gap:12px}
:where(body[data-vista="home"]) .pi-top__f {display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:var(--q3-fs-lg)}
:where(body[data-vista="home"]) .pi-top__p {width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eff6ff;color:var(--pi-azul2);font-size:var(--q3-fs-sm);font-weight:800}
:where(body[data-vista="home"].dark-mode) .pi-top__p {background:var(--pi-gris)}
:where(body[data-vista="home"]) .pi-top__n {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:where(body[data-vista="home"]) .pi-top__b {height:6px;border-radius:4px;background:var(--pi-gris);margin-top:5px;overflow:hidden}
:where(body[data-vista="home"]) .pi-top__b i {display:block;height:100%;background:var(--pi-azul2);border-radius:4px}
:where(body[data-vista="home"]) .pi-top__v {text-align:right;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
:where(body[data-vista="home"]) .pi-top__v small {display:block;font-weight:500;color:var(--pi-tenue);font-size:var(--q3-fs-sm)}
:where(body[data-vista="home"]) .pi-top[hidden] {display:none}
:where(body[data-vista="home"]) .pi-vacio {color:var(--pi-suave);font-size:var(--q3-fs-md);padding:14px 4px;text-align:center}

@media (max-width:1200px){:where(body[data-vista="home"]) .pi-kpis {grid-template-columns:repeat(2,minmax(0,1fr))}:where(body[data-vista="home"]) .pi-g2 {grid-template-columns:1fr}}
@media (max-width:700px){
  :where(body[data-vista="home"]) .pi-kpis {grid-template-columns:1fr}
  :where(body[data-vista="home"]) .pi-graf text {font-size:var(--q3-fs-2xl)}:where(body[data-vista="home"]) .pi-graf .fin {font-size:var(--q3-fs-3xl)}
  :where(body[data-vista="home"]) .pi-acc {width:100%}:where(body[data-vista="home"]) .pi-acc .pi-btn {flex:1 1 auto;justify-content:center}
  :where(body[data-vista="home"]) .pi-tarea {grid-template-columns:4px minmax(0,1fr)}:where(body[data-vista="home"]) .pi-tarea__monto, :where(body[data-vista="home"]) .pi-tarea .pi-btn {grid-column:2;justify-self:start}
}

/* ── sales (core/app/view/sales-view.php) ─────────────────────────────────────────────────────── */
/* Ventas · columna Acciones: iconos en grid de 4 por fila (4 arriba, resto debajo) */
    :where(body[data-vista="sales"]) .q-acc-main { display: grid; grid-template-columns: repeat(4, max-content); gap: 4px; justify-content: start; align-items: center; }
    :where(body[data-vista="sales"]) .q-acc-main .q-btn { margin: 0 !important; }

    /* VTA-ACC-001 · acciones de la fila (Ventas, Cotizaciones, Guías, Compras, Productos, SUNAT): ver, imprimir con botón partido (el formato de la
       empresa en un clic, la flecha ofrece el otro), lo pendiente y «⋯». Los menús flotan (position: fixed, el
       script los ubica junto a su botón) y usan los tokens del tema: se ven bien en claro y en oscuro. */
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-acc { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; justify-content: center; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-split { display: inline-flex; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-split .vt-imp-main { display: inline-flex; align-items: center; gap: 4px; background: #15803D !important; border-color: #15803D !important; color: #fff !important; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; font-weight: 700; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-split .vt-imp-flecha { background: #15803D !important; border-color: #15803D !important; color: #fff !important; border-left: 1px solid rgba(255,255,255,.4) !important; border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; padding-left: 6px !important; padding-right: 6px !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-split :is(.vt-imp-main, .vt-imp-flecha):hover { background: #166534 !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-btn-mas { background: #475569 !important; border-color: #475569 !important; color: #fff !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-btn-mas:hover { background: #334155 !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) :is(.vt-btn-mas, .vt-imp-flecha).vt-abierto { box-shadow: 0 0 0 3px var(--q-focus-ring, rgba(37,99,235,.35)) !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-imp-flecha .bi { transition: transform .15s; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-imp-flecha.vt-abierto .bi { transform: rotate(180deg); }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-menu { position: fixed; z-index: 1060; min-width: 230px; max-width: 300px; padding: 6px; display: grid; gap: 1px; text-align: left;
        background: var(--q-surface, #fff) !important; color: var(--q-text-1, #1E293B) !important; border: 1px solid var(--q-border, #CBD5E1) !important;
        border-radius: 10px; box-shadow: 0 12px 32px rgba(15,23,42,.22); }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-menu[hidden] { display: none !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-menu__lbl { font-size: var(--q3-fs-2xs); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--q-text-2, #94A3B8) !important; padding: 5px 9px 2px; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-menu__sep { height: 1px; background: var(--q-border, #E2E8F0); margin: 4px 2px; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-menu__sep:last-child { display: none; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border-radius: 7px; font-size: var(--q3-fs-sm); font-weight: 600; color: var(--q-text-1, #1E293B) !important; text-decoration: none !important; cursor: pointer; white-space: normal; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi:hover, :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi:focus-visible { background: var(--q-surface-2, #F1F5F9) !important; outline: none; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi small { display: block; font-size: var(--q3-fs-2xs); font-weight: 500; color: var(--q-text-2, #64748B) !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi__ic { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; color: #fff !important; font-size: var(--q3-fs-md); font-weight: 800; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi__def { margin-left: auto; font-size: 9.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: #15803D !important; background: #DCFCE7 !important; border-radius: 999px; padding: 2px 7px; white-space: nowrap; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi--peligro { color: #B91C1C !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi--apagado { cursor: not-allowed; opacity: .75; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-mi--apagado:hover { background: none !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-a4 { background: #166534 !important; } :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-ticket { background: #15803D !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-nc { background: #534AB7 !important; } :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-nd { background: #0F6E56 !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-sunat { background: #0891B2 !important; } :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-guia { background: #16A34A !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-anular { background: #EF4444 !important; } :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .q3-ic-aviso { background: #94A3B8 !important; }
    body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"]) .vt-mi--peligro { color: #FCA5A5 !important; }
    body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"]) .vt-mi__def { color: #86EFAC !important; background: rgba(22,163,74,.22) !important; }
    :where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) tr.vt-fila-abierta > td { background: var(--q-surface-2, #F7F7FE) !important; }
    :where(body[data-vista="sales"]) .vt-tdoc { display: inline-block; padding: 2px 6px; border-radius: 6px; border: 1px solid; font-size: var(--q3-fs-2xs); font-weight: 700; line-height: 1.3; }
    :where(body[data-vista="sales"]) .vt-barra .rv-resumen__linea.vt-res-nc .rv-resumen__rotulo, :where(body[data-vista="sales"]) .vt-barra .rv-resumen__linea.vt-res-nc .rv-resumen__cifra { color: #534AB7; }
    :where(body[data-vista="sales"]) .vt-barra .rv-resumen__linea.vt-res-nd .rv-resumen__rotulo, :where(body[data-vista="sales"]) .vt-barra .rv-resumen__linea.vt-res-nd .rv-resumen__cifra { color: #0F6E56; }

    /* VTA-TAB-001 · la tabla entra en el ancho de la pantalla, sin barra horizontal: letra y botones un 10 %
       más chicos, celdas con menos relleno y Tipo doc. / Método pago / cabeceras que parten en dos líneas. */
    :where(body[data-vista="sales"]) .vt-tabla { font-size: var(--q3-fs-sm); }
    :where(body[data-vista="sales"]) table.q-table.vt-tabla > thead > tr > th { padding: 6px 5px !important; font-size: var(--q3-fs-2xs); letter-spacing: 0; white-space: normal !important; }
    :where(body[data-vista="sales"]) table.q-table.vt-tabla > tbody > tr > td { padding: 6px 5px !important; white-space: normal !important; }
    :where(body[data-vista="sales"]) .vt-tabla .q-btn--s { height: 24px; min-width: 24px; font-size: var(--q3-fs-xs); padding: 0 6px; }
    :where(body[data-vista="sales"]) .vt-tabla .q-acc-main { gap: 3px; }
    :where(body[data-vista="sales"]) .vt-tabla .vp-chip { white-space: normal; font-size: var(--q3-fs-2xs); padding: 2px 6px; }
    :where(body[data-vista="sales"]) .vt-tabla .q-badge { font-size: var(--q3-fs-2xs); }

    /* Botones a la izquierda, resumen a la derecha, pegados a los filtros. */
    :where(body[data-vista="sales"]) .vt-barra { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 10px 0 12px; }
    :where(body[data-vista="sales"]) .vt-izq > .q-toolbar__actions { margin-left: 0; justify-content: flex-start; }
    :where(body[data-vista="sales"]) .vt-barra > .rv-resumen { margin: 0; flex: 0 1 420px; }

    /* VTA-FIL-001 · filtros recogidos. Lo filtrado se sigue viendo en una linea de
       etiquetas: ocultar el panel sin decir que hay filtros hace creer que la lista
       esta completa. */
    :where(body[data-vista="sales"]) .vt-filtros { display: none; }
    :where(body[data-vista="sales"]) .vt-filtros.abierto { display: flex; padding-bottom: 12px; margin-bottom: 4px; border-bottom: 1px solid var(--q3-borde-2, #e5e7eb); }
    :where(body[data-vista="sales"]) .vt-izq { display: flex; flex-direction: column; gap: 12px; flex: 1 1 480px; min-width: 0; }
    :where(body[data-vista="sales"]) .vt-aplicados { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
    :where(body[data-vista="sales"]) .vt-nfiltros { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; margin-left: 6px; border-radius: 10px; background: rgba(255,255,255,.9); color: #b45309; font-size: var(--q3-fs-sm); font-weight: 800; }
    :where(body[data-vista="sales"]) .vt-nfiltros:empty { display: none; }

    /* El ancho del filtro Cliente ya NO se calcula aquí: usa `q-toolbar__field--half`,
       la clase compartida del Design System, para que mida lo mismo que en la bandeja
       de Cotizaciones —son la misma pregunta en dos pantallas y se veían distintas—.

       Lo que había era `flex: 0 1 calc((100% - 60px) / 7 * 2 + 10px)`: el ancho de dos
       columnas de la fila de arriba, para quedar alineado con el final de «Fecha Fin».
       La idea era buena, pero se ató a un número que caducó: la fila tenía 7 campos
       cuando se escribió y hoy tiene 8 —se añadió «Estado SUNAT»—, así que dividía
       entre 7 una rejilla de 8 y hacía tiempo que no alineaba con nada. */

:where(body[data-vista="sales"]) .vt-ubi { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:6px; } @media (max-width:575px){ :where(body[data-vista="sales"]) .vt-ubi { grid-template-columns:1fr; } }

/* VTA-ANU-VIS-001 · un anulado se ve en la bandeja, en rojo y tachado, para que nadie lo
   confunda con una venta válida ni crea que falta un número del correlativo. Las etiquetas
   y los botones no se tachan: son cajas, y la línea no los atraviesa. */
:where(body[data-vista="sales"]) table.datatable tr.vt-anulado > td { color: #b91c1c !important; text-decoration: line-through; text-decoration-color: rgba(185, 28, 28, .65); }
:where(body[data-vista="sales"]) table.datatable tr.vt-anulado > td:last-child { text-decoration: none; }

:where(body[data-vista="sales"]) .vp-pendiente>td {background:#fef2f2!important}
:where(body[data-vista="sales"]) .vp-pendiente>td:first-child {box-shadow:inset 4px 0 0 #dc2626}
:where(body[data-vista="sales"]) .vp-chip {display:inline-block;padding:3px 8px;border-radius:999px;background:#fee2e2;color:#991b1b;font-size:var(--q3-fs-xs);font-weight:700;white-space:nowrap}
:where(body[data-vista="sales"]) .vp-aviso {display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:10px 16px;border:1px solid #fca5a5;border-radius:10px;background:#fef2f2;color:#991b1b;font-size:var(--q3-fs-lg);text-decoration:none}
:where(body[data-vista="sales"]) .vp-aviso:hover {background:#fee2e2;color:#7f1d1d}
:where(body[data-vista="sales"]) .vp-aviso__ir {margin-left:auto;font-weight:700;white-space:nowrap}
:where(body[data-vista="sales"]) .vp-btn-pagar {background:#16a34a!important;color:#fff!important;width:auto!important;padding:0 10px!important;font-weight:600}
:where(body[data-vista="sales"].dark-mode) .vp-pendiente>td {background:#3b1215!important}

/* ── newsale (core/app/view/newsale-view.php) ───────────────────────────────────────────────────── */
/* Mismo ancho que el popup del maestro de Clientes: cuatro campos por fila. */
		:where(body[data-vista="newsale"]) #exampleModal .modal-dialog { width: 1100px !important; max-width: 96vw !important; }
		:where(body[data-vista="newsale"]) #modalcliente #nombre, :where(body[data-vista="newsale"]) #modalcliente #direccion, :where(body[data-vista="newsale"]) #modalcliente #notas { text-transform: uppercase; }

/* ── newqsale (core/app/view/newqsale-view.php) ──────────────────────────────────────────────────── */
/* Mismo ancho que el popup del maestro de Clientes: cuatro campos por fila. */
		:where(body[data-vista="newqsale"]) #exampleModal .modal-dialog { width: 1100px !important; max-width: 96vw !important; }
		:where(body[data-vista="newqsale"]) #modalcliente #nombre, :where(body[data-vista="newqsale"]) #modalcliente #direccion, :where(body[data-vista="newqsale"]) #modalcliente #notas { text-transform: uppercase; }

/* ── clients (core/app/view/clients-view.php) ───────────────────────────────────────────────────── */
/* Estándar de captura (#9): pista visual de MAYÚSCULAS en campos descriptivos.
	   La conversión real y garantizada la hace el servidor (Texto::mayusculas). */
	:where(body[data-vista="clients"]) #nombre, :where(body[data-vista="clients"]) #direccion, :where(body[data-vista="clients"]) #notas, :where(body[data-vista="clients"]) #editNombre, :where(body[data-vista="clients"]) #editDireccion, :where(body[data-vista="clients"]) #editNotas { text-transform: uppercase; }
	/* Popups de cliente (Registrar/Editar). Eran 600px, luego 720. Ahora 1100, porque
	   la ficha pasó a CUATRO campos por fila: en 720 el cuarto se descuelga -es lo que
	   ya paso una vez y por lo que el ancho de columna estaba topado a col-md-4-. El
	   `max-width` en vh evita que en un portátil de 1366 el popup se salga de la
	   pantalla; por debajo de eso Bootstrap lo baja a una columna igualmente. */
	:where(body[data-vista="clients"]) #exampleModal .modal-dialog, :where(body[data-vista="clients"]) #modalEditar .modal-dialog { width: 1100px !important; max-width: 96vw !important; }
	/* El de sedes NO necesita los 1100 de la ficha: son seis columnas de tabla y un
	   formulario de tres. Con 900 la tabla respira y los dos botones caben en la
	   misma linea, que es lo que no pasaba con los 800 de un modal-lg. */
	:where(body[data-vista="clients"]) #modalSedes .modal-dialog { width: 900px !important; max-width: 96vw !important; }

/* ── products (core/app/view/products-view.php) ──────────────────────────────────────────────────── */
/* Encabezados a 2 líneas + columna al ancho del texto. Se anula table-nowrap SOLO
   en estos th (el resto de la tabla sigue en una línea). width pequeño + !important
   para que DataTables (autoWidth) no los reexpanda; la columna no baja del ancho
   de la palabra más larga del título. */
:where(body[data-vista="products"]) #tblProductos thead th.th-2l { white-space:normal !important; width:1px !important; vertical-align:middle; line-height:1.15; }
/* Cabeceras centradas (anula los text-align:right inline de las columnas numéricas) */
:where(body[data-vista="products"]) #tblProductos thead th { text-align:center !important; vertical-align:middle; }
/* Pack / Carga Masiva / Descargar reubicados junto a "Buscar:" (fila de controles
   de DataTables). Al salir del form #products, se les re-fuerza el ancho-texto
   (si no, modern.css los volveria iconos de 42px). */
:where(body[data-vista="products"]) #prodExtraBtns { display:inline-flex; align-items:center; gap:6px; vertical-align:middle; }
:where(body[data-vista="products"]) #prodExtraBtns .btn:not(.btn-sm) { width:auto !important; min-width:0 !important; height:34px !important; padding:6px 12px !important; border-radius:6px !important; display:inline-flex !important; align-items:center; gap:6px; margin:0 !important; }
/* "Buscar:" y los botones reubicados, alineados en una sola línea (centrados, a la derecha) */
/* "Mostrar 10 registros" en una sola línea (el <select>.form-control venía como
   display:block y apilaba el texto en 3 líneas -> bloque alto y botones pegados arriba). */
:where(body[data-vista="products"]) #tblProductos_wrapper .dataTables_length select { display:inline-block !important; width:auto !important; vertical-align:middle; margin:0 4px; }
/* Fila de controles centrada verticalmente y con aire (no pegada al toolbar). */
:where(body[data-vista="products"]) #tblProductos_wrapper > .row:first-child { display:flex; align-items:center; margin-top:6px; margin-bottom:10px; }
:where(body[data-vista="products"]) .prod-ctrl-row { display:flex !important; align-items:center; justify-content:flex-end; gap:12px; flex-wrap:wrap; }
:where(body[data-vista="products"]) .prod-ctrl-row .dataTables_filter { margin:0; }
:where(body[data-vista="products"]) .prod-ctrl-row .dataTables_filter label { margin:0; display:inline-flex; align-items:center; gap:6px; }
:where(body[data-vista="products"]) #tblProductos_wrapper .dataTables_filter { display:inline-block; vertical-align:middle; }
/* Columna ACCIONES compacta: font-size:0 (¡important!) colapsa el espacio en blanco
   entre botones; el ícono lleva tamaño propio. Menos padding de celda. */
:where(body[data-vista="products"]) #tblProductos tbody td:last-child { white-space:nowrap; text-align:center; font-size:0 !important; padding:4px 4px !important; }
:where(body[data-vista="products"]) #tblProductos tbody td:last-child a.btn-sm { margin:0 1px 0 0 !important; padding:2px 5px !important; }
:where(body[data-vista="products"]) #tblProductos tbody td:last-child a.btn-sm .bi { font-size:var(--q3-fs-md) !important; }
/* OPT-PROD-SS: alineación de columnas (server-side arma las celdas sin estilo inline). */
:where(body[data-vista="products"]) #tblProductos tbody td.dt-right { text-align:right; }
:where(body[data-vista="products"]) #tblProductos tbody td.dt-left { text-align:left; }

/* PRD-FICHA-001 · acciones en 2 filas de 3 */
		:where(body[data-vista="products"]) #tblProductos .pr-acc { display:inline-grid; grid-template-columns:repeat(3, 30px); gap:4px; }
		:where(body[data-vista="products"]) #tblProductos .pr-acc .btn { width:30px; height:28px; padding:0; display:inline-flex; align-items:center; justify-content:center; margin:0; }
		:where(body[data-vista="products"]) #tblProductos .pr-acc .pr-btn-eq, :where(body[data-vista="products"]) #tblProductos .pr-acc .pr-btn-eq:hover { background:#6366f1 !important; border-color:#6366f1 !important; color:#fff !important; }
		:where(body[data-vista="products"]) .swal2-popup.fr-popup .fr-acciones { gap:8px; }
		:where(body[data-vista="products"]) .swal2-popup.fr-popup { width:min(900px, 96vw) !important; max-width:96vw !important; }

/* ── accountsreceivables (core/app/view/accountsreceivables-view.php) ───────────────────────────────────────── */
/* Cuentas por Cobrar: cabeceras de la tabla principal centradas y en negrita. */
:where(body[data-vista="accountsreceivables"]) .axr-table thead th { text-align:center !important; font-weight:700 !important; }
/* VTA-CRE-012 · la columna de deuda vencida. El importe en rojo lo pone el badge
   del sistema; esto es solo la letra pequeña de debajo y el «al día», que tiene
   que estar presente sin competir: si todo pesara igual, no se distinguiría de un
   vistazo quién es el problema, que es justo lo que la columna viene a resolver. */
:where(body[data-vista="accountsreceivables"]) .axr-table .axr-venc-det { font-size:var(--q3-fs-xs); color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); margin-top:2px; white-space:nowrap; }
:where(body[data-vista="accountsreceivables"]) .axr-table .axr-aldia { font-size:var(--q3-fs-sm); color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); }
/* CXC-CON-001 · resumen de la cartera y marca del contado pendiente. */
:where(body[data-vista="accountsreceivables"]) .axr-resumen { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:4px 0 14px; }
:where(body[data-vista="accountsreceivables"]) .axr-resumen > div { border:1px solid var(--q-border,var(--q3-borde, #E2E8F0)); border-left-width:5px; border-radius:10px; padding:10px 14px; background:var(--q-surface,var(--q3-fondo, #fff)); }
:where(body[data-vista="accountsreceivables"]) .axr-resumen span { display:block; font-size:var(--q3-fs-xs); font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--q-text-3,var(--q3-texto-4, #64748B)); }
:where(body[data-vista="accountsreceivables"]) .axr-resumen b { font-size:var(--q3-fs-2xl); font-variant-numeric:tabular-nums; }
:where(body[data-vista="accountsreceivables"]) .axr-resumen small { display:block; font-size:var(--q3-fs-xs); color:var(--q-text-3,var(--q3-texto-4, #64748B)); }
:where(body[data-vista="accountsreceivables"]) .axr-resumen .axr-r-cre { border-left-color:#2563EB; }
:where(body[data-vista="accountsreceivables"]) .axr-resumen .axr-r-con { border-left-color:#DC2626; } :where(body[data-vista="accountsreceivables"]) .axr-resumen .axr-r-con b { color:#DC2626; }
:where(body[data-vista="accountsreceivables"]) .axr-resumen .axr-r-tot { border-left-color:#0F172A; background:var(--q-surface-2,var(--q3-fondo-3, #F1F5F9)); }
:where(body[data-vista="accountsreceivables"]) .axr-table .axr-con-det { font-size:var(--q3-fs-xs); color:#DC2626; font-weight:700; margin-top:2px; white-space:nowrap; }
@media (max-width:576px) { :where(body[data-vista="accountsreceivables"]) .axr-resumen { grid-template-columns:1fr; } }
/* CXC-UI-002 · ventana de pagos del comprobante, igual que la de Cuentas por Pagar. */
:where(body[data-vista="accountsreceivables"]) .axr-md-tabla thead th, :where(body[data-vista="accountsreceivables"]) .axr-md-tabla tbody td { text-align:center !important; vertical-align:middle; }
:where(body[data-vista="accountsreceivables"]) .axr-md-tabla thead th { font-weight:700 !important; }
:where(body[data-vista="accountsreceivables"]) .axr-md-cli { color:var(--q-text-2,var(--q3-texto-3, #475569)); font-size:var(--q3-fs-md); margin:-4px 0 12px; text-align:center; }
:where(body[data-vista="accountsreceivables"]) .axr-md-resumen { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }
:where(body[data-vista="accountsreceivables"]) .axr-md-resumen > div { background:var(--q-surface-2,var(--q3-fondo-3, #F1F5F9)); border-radius:10px; padding:10px 8px; text-align:center; }
:where(body[data-vista="accountsreceivables"]) .axr-md-resumen span { display:block; font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.04em; color:var(--q-text-3,var(--q3-texto-4, #64748B)); }
:where(body[data-vista="accountsreceivables"]) .axr-md-resumen b { font-size:var(--q3-fs-2xl); }
:where(body[data-vista="accountsreceivables"]) .axr-md-resumen .axr-md-debe b { color:#DC2626; }
:where(body[data-vista="accountsreceivables"]) .axr-md-resumen .axr-md-ok b { color:#16A34A; }
:where(body[data-vista="accountsreceivables"]) .axr-md-sub { font-weight:700; margin:6px 0 8px; text-align:center; }
:where(body[data-vista="accountsreceivables"]) .axr-md-vacio { text-align:center; color:var(--q-text-3,var(--q3-texto-4, #64748B)); margin:4px 0 14px; }
:where(body[data-vista="accountsreceivables"]) .axr-md-nc { color:#DC2626; }
@media (max-width:576px) { :where(body[data-vista="accountsreceivables"]) .axr-md-resumen { grid-template-columns:repeat(2,1fr); } }

/* ── stocks (core/app/view/stocks-view.php) ────────────────────────────────────────────────────── */
/* Mismo lenguaje visual que Control de vencimientos (rptvencimientos). */
:where(body[data-vista="stocks"]) .rv-semaforo {display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
:where(body[data-vista="stocks"]) .rv-luz {all:unset;box-sizing:border-box;cursor:pointer;flex:1 1 180px;border-radius:6px;padding:12px 16px;border-left:6px solid #999;background:#fafafa;text-align:left;transition:box-shadow .15s}
:where(body[data-vista="stocks"]) .rv-luz:hover {box-shadow:0 4px 14px rgba(15,23,42,.10)}
:where(body[data-vista="stocks"]) .rv-luz:focus-visible {outline:2px solid #1d4ed8;outline-offset:2px}
:where(body[data-vista="stocks"]) .rv-luz.activo {box-shadow:0 0 0 2px currentColor inset}
:where(body[data-vista="stocks"]) .rv-luz--azul {border-left-color:#1d4ed8;background:#eef4ff;color:#1d4ed8}
:where(body[data-vista="stocks"]) .rv-luz--rojo {border-left-color:#b3261e;background:#fdecea;color:#b3261e}
:where(body[data-vista="stocks"]) .rv-luz--amarillo {border-left-color:#8a5a08;background:#fdf5e2;color:#8a5a08}
:where(body[data-vista="stocks"]) .rv-luz--naranja {border-left-color:#c2410c;background:#fff1e6;color:#c2410c}
/* En oscuro, cada luz conserva su color en un tinte oscuro (antes quedaba la tarjeta clara con letra blanca). */
:where(body[data-vista="stocks"].dark-mode) .rv-luz { background:var(--q-surface-2); }
:where(body[data-vista="stocks"].dark-mode) .rv-luz--azul { background:rgba(59,130,246,.15); color:#93C5FD; }
:where(body[data-vista="stocks"].dark-mode) .rv-luz--rojo { background:rgba(239,68,68,.15); color:#FCA5A5; }
:where(body[data-vista="stocks"].dark-mode) .rv-luz--amarillo { background:rgba(245,158,11,.14); color:#FCD34D; }
:where(body[data-vista="stocks"].dark-mode) .rv-luz--naranja { background:rgba(249,115,22,.15); color:#FDBA74; }
:where(body[data-vista="stocks"]) .rv-luz__t {display:block;font-size:var(--q3-fs-xs);letter-spacing:.06em;text-transform:uppercase;color:#5a5a5a;font-weight:700}
:where(body[data-vista="stocks"]) .rv-luz__n {display:block;font-size:var(--q3-fs-3xl);font-weight:700;line-height:1.2;font-family:var(--q-font-family);font-variant-numeric:tabular-nums;color:#1f2937}
:where(body[data-vista="stocks"]) .rv-luz__v {display:block;font-size:var(--q3-fs-sm);color:#5a5a5a;font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="stocks"]) .rv-filtros {display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:10px}
:where(body[data-vista="stocks"]) .rv-f {display:flex;flex-direction:column;min-width:160px}
:where(body[data-vista="stocks"]) .rv-f--ancho {flex:1 1 260px}
:where(body[data-vista="stocks"]) .rv-f--btn {flex-direction:row;gap:6px;align-items:flex-end}
:where(body[data-vista="stocks"]) .rv-f label {font-size:var(--q3-fs-xs);letter-spacing:.05em;text-transform:uppercase;color:#666;margin-bottom:2px;font-weight:700}
:where(body[data-vista="stocks"]) .rv-punto {display:inline-block;width:12px;height:12px;border-radius:50%;background:#bbb;vertical-align:middle}
:where(body[data-vista="stocks"]) .rv-punto--rojo {background:#b3261e}
:where(body[data-vista="stocks"]) .rv-punto--amarillo {background:#e0a80a}
:where(body[data-vista="stocks"]) .rv-punto--verde {background:#1c7a4a}
/* Bootstrap 5.3 pinta la celda con una sombra interior que tapa el fondo: el color va por ahi. */
:where(body[data-vista="stocks"]) #tblStocks tr.rv-fila--rojo > td {box-shadow:inset 0 0 0 9999px #fdecea !important}
:where(body[data-vista="stocks"]) #tblStocks tr.rv-fila--amarillo > td {box-shadow:inset 0 0 0 9999px #fdf7e8 !important}
:where(body[data-vista="stocks"]) .rv-mono {font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="stocks"]) .rv-pie {margin-top:12px;font-size:var(--q3-fs-sm);color:#666;line-height:1.9}
:where(body[data-vista="stocks"]) .rv-f--btn .btn {white-space:nowrap}
:where(body[data-vista="stocks"]) .stk-chip {margin-bottom:8px;display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:20px;background:#eef4ff;color:#1d4ed8;font-size:var(--q3-fs-sm);font-weight:700}
:where(body[data-vista="stocks"]) .stk-chip button {all:unset;cursor:pointer;font-size:var(--q3-fs-lg);line-height:1}
:where(body[data-vista="stocks"]) form#stocks .btn.stk-mas {display:none !important}
/* Tabla: todo centrado (preferencia del usuario), cifras en monoespaciada. */
:where(body[data-vista="stocks"]) #tblStocks {width:100% !important}
:where(body[data-vista="stocks"]) #tblStocks thead th, :where(body[data-vista="stocks"]) #tblStocks tbody td {text-align:center !important;vertical-align:middle}
:where(body[data-vista="stocks"]) #tblStocks td:nth-child(3), :where(body[data-vista="stocks"]) #tblStocks td:nth-child(4) {white-space:nowrap}
:where(body[data-vista="stocks"]) #tblStocks td:nth-child(3), :where(body[data-vista="stocks"]) #tblStocks td:nth-child(5), :where(body[data-vista="stocks"]) #tblStocks td:nth-child(6) {font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="stocks"]) .stk-nom {font-weight:600;color:var(--q3-texto, #0f172a)}
:where(body[data-vista="stocks"]) .stk-meta {font-size:var(--q3-fs-xs);color:var(--q3-texto-4, #64748b);margin-top:2px;font-family:inherit}
:where(body[data-vista="stocks"]) .stk-meta--sin {color:#b3261e;font-weight:700}:where(body[data-vista="stocks"]) .stk-meta--bajo {color:#8a5a08;font-weight:700}
:where(body[data-vista="stocks"]) .stk-lotes {margin-top:3px}
:where(body[data-vista="stocks"]) .stk-lote {display:inline-block;margin:2px 3px 0;padding:1px 8px;border-radius:10px;font-size:var(--q3-fs-xs);font-family:var(--q-font-family);font-variant-numeric:tabular-nums;background:#eef3f7;border:1px solid #cfe0ec;color:#2c5871}
:where(body[data-vista="stocks"]) .stk-lote--pronto {background:#fdf5e2;border-color:#e0a80a;color:#8a5a08}
:where(body[data-vista="stocks"]) .stk-lote--vencido {background:#fdecea;border-color:#e8a19c;color:#b3261e;text-decoration:line-through}
/* INV-LOT-001 · lote corregible (lápiz) y lote bloqueado (candado, el motivo en el title) */
:where(body[data-vista="stocks"]) button.stk-lote--edit {cursor:pointer;line-height:inherit}
:where(body[data-vista="stocks"]) button.stk-lote--edit:hover, :where(body[data-vista="stocks"]) button.stk-lote--edit:focus-visible {border-color:#2563eb;color:#1d4ed8;outline:none;box-shadow:0 0 0 2px rgba(37,99,235,.2)}
:where(body[data-vista="stocks"]) .stk-lote .bi-pencil {font-size:var(--q3-fs-2xs);margin-left:2px}
:where(body[data-vista="stocks"]) .stk-lote__candado {font-size:var(--q3-fs-2xs);opacity:.55;margin-left:2px}
:where(body[data-vista="stocks"]) #modalHist .mh-prod {font-size:var(--q3-fs-lg);font-weight:700;color:var(--q3-texto, #0f172a);margin-bottom:10px}
:where(body[data-vista="stocks"]) #modalHist .mh-tabla th, :where(body[data-vista="stocks"]) #modalHist .mh-tabla td {text-align:center;vertical-align:middle;font-size:var(--q3-fs-md)}
:where(body[data-vista="stocks"]) #modalHist .mh-antes {color:var(--q3-texto-5, #94a3b8);text-decoration:line-through}
:where(body[data-vista="stocks"]) #modalHist .mh-motivo {min-width:180px}
:where(body[data-vista="stocks"]) #modalHist .mh-vacio {color:var(--q3-texto-4, #64748b);margin:0}
:where(body[data-vista="stocks"].dark-mode) #modalHist .mh-prod {color:#e2e8f0}
:where(body[data-vista="stocks"]) #modalLote .ml-prod {margin-bottom:10px;font-size:var(--q3-fs-md);color:var(--q3-texto-4, #64748b)}
:where(body[data-vista="stocks"]) #modalLote .ml-prod b {display:block;font-size:var(--q3-fs-lg);color:var(--q3-texto, #0f172a)}
:where(body[data-vista="stocks"]) #modalLote .ml-mono, :where(body[data-vista="stocks"]) #modalLote .ml-antes {font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="stocks"]) #modalLote .ml-antes {background:var(--q3-fondo-2, #f8fafc);color:var(--q3-texto-5, #94a3b8);text-decoration:line-through}
:where(body[data-vista="stocks"]) #modalLote .ml-aviso {display:flex;gap:8px;align-items:flex-start;padding:8px 12px;border-radius:9px;font-size:var(--q3-fs-md);margin:6px 0 10px;border:1px solid}
:where(body[data-vista="stocks"]) #modalLote .ml-aviso--ok {background:#f0fdf4;border-color:#bbf7d0;color:#15803d;font-weight:600}
:where(body[data-vista="stocks"]) #modalLote .ml-aviso--no {background:#fef2f2;border-color:#fecaca;color:#b91c1c}
:where(body[data-vista="stocks"]) #modalLote .ml-aviso--une {background:#fffbeb;border-color:#fde68a;color:#92400e;margin-top:10px}
:where(body[data-vista="stocks"].dark-mode) #modalLote .ml-prod b {color:#e2e8f0}
:where(body[data-vista="stocks"].dark-mode) #modalLote .ml-antes {background:transparent}
:where(body[data-vista="stocks"]) .stk-cant {font-size:var(--q3-fs-lg);font-weight:800;font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="stocks"]) .stk-cant--ok {color:#1c7a4a}:where(body[data-vista="stocks"]) .stk-cant--bajo {color:#8a5a08}:where(body[data-vista="stocks"]) .stk-cant--sin {color:#b3261e}
:where(body[data-vista="stocks"]) #tblStocks_wrapper {min-height:430px}
@media (max-width:767px){
  :where(body[data-vista="stocks"]) form#stocks .btn.stk-mas {display:inline-flex !important;align-items:center;gap:6px}
  :where(body[data-vista="stocks"]) .rv-semaforo {gap:8px}
  :where(body[data-vista="stocks"]) .rv-luz {flex:1 1 calc(50% - 4px);padding:10px 12px}
  :where(body[data-vista="stocks"]) .rv-luz__n {font-size:var(--q3-fs-2xl)}
  :where(body[data-vista="stocks"]) .rv-filtros .stk-extra {display:none;width:100%}
  :where(body[data-vista="stocks"]) .rv-filtros.abierto .stk-extra {display:flex}
  :where(body[data-vista="stocks"]) .rv-f {min-width:0;width:100%}
  :where(body[data-vista="stocks"]) .rv-f--btn {width:auto}
  :where(body[data-vista="stocks"]) .rv-f--btn {flex-wrap:wrap}
  :where(body[data-vista="stocks"]) #tblStocks thead {display:none}
  :where(body[data-vista="stocks"]) #tblStocks, :where(body[data-vista="stocks"]) #tblStocks tbody {display:block}
  :where(body[data-vista="stocks"]) #tblStocks tbody tr {display:grid;grid-template-columns:18px 1fr auto;gap:4px 10px;padding:12px;margin-bottom:10px;border:1px solid var(--q3-borde-2, #e5e7eb);border-radius:10px}
  :where(body[data-vista="stocks"]) #tblStocks tbody td {display:block;border:none !important;padding:0 !important;text-align:left !important;background:transparent !important;box-shadow:none !important}
  :where(body[data-vista="stocks"]) #tblStocks tbody tr.rv-fila--rojo {background:#fdecea}
  :where(body[data-vista="stocks"]) #tblStocks tbody tr.rv-fila--amarillo {background:#fdf7e8}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(1) {grid-column:1;grid-row:1}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(2) {grid-column:2;grid-row:1 / span 2}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(5) {grid-column:3;grid-row:1;text-align:right !important}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(7) {grid-column:3;grid-row:2;text-align:right !important}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(3), :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(4), :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(6) {grid-column:2 / span 2;font-size:var(--q3-fs-sm);color:var(--q3-texto-4, #64748b)}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(4)::before {content:"Unidad: "}
  :where(body[data-vista="stocks"]) #tblStocks tbody td:nth-child(6)::before {content:"Valor S/ "}
}

/* ── product-stock (core/app/view/product-stock-view.php) ─────────────────────────────────────────────── */
:where(body[data-vista="product-stock"]) #tblReposicion th, :where(body[data-vista="product-stock"]) #tblReposicion td { text-align: center !important; vertical-align: middle !important; white-space: normal !important; }
				    :where(body[data-vista="product-stock"]) #tblReposicion thead th { line-height: 1.2; }
				    :where(body[data-vista="product-stock"]) #tblReposicion thead tr.rv-grupos th { font-size: var(--q3-fs-xs); letter-spacing: .3px; }
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-g-per { background: #eff6ff !important; color: #1e3a8a !important; }
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-g-stk { background: var(--q3-fondo-2, #f8fafc) !important; color: var(--q3-texto-2, #334155) !important; }
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-g-vie { background: #fff7ed !important; color: #9a3412 !important; }
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-g-cla { background: var(--q3-fondo-3, #f1f5f9) !important; color: var(--q3-texto-3, #475569) !important; }
				    :where(body[data-vista="product-stock"]) #tblReposicion td.rv-comprar { font-weight: 800; font-size: var(--q3-fs-lg); color: #9a3412; background: #fff7ed; }
				    :where(body[data-vista="product-stock"]) .rv-var { font-size: var(--q3-fs-xs); font-weight: 700; border-radius: 999px; padding: 1px 6px; white-space: nowrap; }
				    :where(body[data-vista="product-stock"]) .rv-var--up { background: #dcfce7; color: #15803d; } :where(body[data-vista="product-stock"]) .rv-var--down { background: #fee2e2; color: #b91c1c; }
				    :where(body[data-vista="product-stock"]) #tblReposicion td.rv-tcel[data-curva] { cursor: zoom-in; }
				    :where(body[data-vista="product-stock"]) #tblReposicion td.rv-tcel[data-curva]:hover { background: #fff7ed !important; box-shadow: inset 0 0 0 2px #fdba74; }
				    :where(body[data-vista="product-stock"]) .swal2-popup.rvc-pop { width: min(680px, 94vw) !important; max-width: 94vw !important; padding-bottom: .4rem !important; }
				    :where(body[data-vista="product-stock"]) .swal2-popup.rvc-pop .swal2-html-container { margin: .6rem 1rem 0 !important; }
				    :where(body[data-vista="product-stock"]) .swal2-popup.rvc-pop .swal2-actions { margin-top: .5rem !important; }
				    :where(body[data-vista="product-stock"]) .rvc-graf { width: 100%; height: auto; display: block; }
				    :where(body[data-vista="product-stock"]) .rvc-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 2px 0 8px; }
				    :where(body[data-vista="product-stock"]) .rvc-kpis div { border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 8px; padding: 4px 4px; text-align: center; background: var(--q3-fondo-2, #f8fafc); }
				    :where(body[data-vista="product-stock"]) .rvc-kpis small { display: block; font-size: var(--q3-fs-2xs); font-weight: 700; color: var(--q3-texto-4, #64748b); text-transform: uppercase; line-height: 1.2; }
				    :where(body[data-vista="product-stock"]) .rvc-kpis b { font-size: var(--q3-fs-md); color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock"]) .rvc-ley { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; font-size: var(--q3-fs-sm); color: var(--q3-texto-3, #475569); margin-top: 6px; }
				    :where(body[data-vista="product-stock"]) .rvc-ley i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -1px; margin-right: 4px; }
				    :where(body[data-vista="product-stock"]) .rv-tmp { display: inline-block; white-space: nowrap; font-size: var(--q3-fs-2xs); font-weight: 800; border-radius: 999px; padding: 1px 7px; margin-bottom: 3px; }
				    :where(body[data-vista="product-stock"]) .rv-tmp--alta { background: #f97316; color: #fff; } :where(body[data-vista="product-stock"]) .rv-tmp--baja { background: #e2e8f0; color: var(--q3-texto-3, #475569); }
				    :where(body[data-vista="product-stock"]) .rv-base { display: block; font-size: var(--q3-fs-2xs); color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock"]) .rv-agota { color: #b91c1c; font-weight: 700; }
				    /* REPO-COH-001 · fechas de cada bloque */
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-g-fec { display: block; font-size: var(--q3-fs-2xs); font-weight: 500; letter-spacing: 0; text-transform: none; opacity: .85; margin-top: 2px; line-height: 1.35; }
				    :where(body[data-vista="product-stock"]) .rv-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: #fffbeb; border: 1px solid #fde68a; color: #78350f; font-size: var(--q3-fs-md); margin: 10px 0; }
				    :where(body[data-vista="product-stock"]) .rv-ayuda { font-size: var(--q3-fs-sm); color: var(--q3-texto-3, #475569); margin-top: 8px; }
				    :where(body[data-vista="product-stock"]) .rv-ayuda b { color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock"]) .rv-clasica.is-oculta { display: none; }
				    /* «Ver clásica» solo cambia columnas: va junto al buscador de la tabla */
				    :where(body[data-vista="product-stock"]) #tblReposicion_filter { display: flex; justify-content: flex-end; align-items: center; gap: 10px; }
				    :where(body[data-vista="product-stock"]) #btnClasica { white-space: nowrap; }
				    :where(body[data-vista="product-stock"]) #tblReposicion td.rv-sel, :where(body[data-vista="product-stock"]) #tblReposicion th.rv-sel { width: 34px; }
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-chk { width: 18px; height: 18px; cursor: pointer; }
				    :where(body[data-vista="product-stock"]) #tblReposicion tr.rv-on > td { background: #eff6ff !important; }
				    :where(body[data-vista="product-stock"]) #tblReposicion .rv-pedir { width: 76px; margin: 0 auto; text-align: center; font-weight: 700; padding: 2px 4px; }
				    :where(body[data-vista="product-stock"]) #tblReposicion tr.rv-on .rv-pedir { border-color: #2563eb; color: #1e3a8a; }
				    :where(body[data-vista="product-stock"]) .rv-barra { position: sticky; bottom: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
				                margin-top: 10px; padding: 10px 14px; border-radius: 12px; background: #1e3a8a; color: #fff; box-shadow: 0 -4px 14px rgba(15,23,42,.18); }
				    :where(body[data-vista="product-stock"]) .rv-barra.is-vacia { background: var(--q3-fondo-3, #f1f5f9); color: var(--q3-texto-3, #475569); box-shadow: none; }
				    :where(body[data-vista="product-stock"]) .rv-barra b { font-size: var(--q3-fs-lg); } :where(body[data-vista="product-stock"]) .rv-barra small { opacity: .85; }
				    :where(body[data-vista="product-stock"]) .rv-barra .q-btn { white-space: nowrap; }
				    :where(body[data-vista="product-stock"]) #mdlOC .oc-lin { max-height: 260px; overflow: auto; border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 8px; }
				    :where(body[data-vista="product-stock"]) #mdlOC .oc-lin table { width: 100%; font-size: var(--q3-fs-sm); margin: 0; }
				    :where(body[data-vista="product-stock"]) #mdlOC .oc-lin th, :where(body[data-vista="product-stock"]) #mdlOC .oc-lin td { text-align: center; padding: 4px 6px; border-bottom: 1px solid #f1f5f9; }
				    :where(body[data-vista="product-stock"]) #mdlOC .oc-lin th { position: sticky; top: 0; background: var(--q3-fondo-2, #f8fafc); }
				    :where(body[data-vista="product-stock"]) #mdlOC .oc-aviso { font-size: var(--q3-fs-sm); color: #92400e; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: 6px 10px; margin-top: 8px; }
				    :where(body[data-vista="product-stock"]) #mdlOC .oc-tot { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; font-weight: 700; margin-top: 8px; }
				    /* REPO-UX-001 · tres preguntas, el resultado en una frase y la cuenta que lo explica */
				    :where(body[data-vista="product-stock"]) .rx-titulo { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
				    :where(body[data-vista="product-stock"]) .rx-titulo > em { font-size: var(--q3-fs-4xl); color: #1e3a8a; }
				    :where(body[data-vista="product-stock"]) .rx-titulo h2 { font-size: var(--q3-fs-2xl); font-weight: 800; margin: 0; color: #1e3a8a; }
				    :where(body[data-vista="product-stock"]) .rx-titulo p { margin: 0; color: var(--q3-texto-4, #64748b); font-size: var(--q3-fs-md); }
				    :where(body[data-vista="product-stock"]) .rx-pasos { display: grid; grid-template-columns: 1.2fr 1fr; gap: 12px; }
				    :where(body[data-vista="product-stock"]) .rx-pasos.con-paso4 { grid-template-columns: 1.2fr 1fr .8fr; }
				    @media (max-width: 1100px) { :where(body[data-vista="product-stock"]) .rx-pasos, :where(body[data-vista="product-stock"]) .rx-pasos.con-paso4 { grid-template-columns: 1fr; } }
				    /* Sombra fija, sin animaciones ni efectos al pasar el mouse */
				    :where(body[data-vista="product-stock"]) .rx-paso { background: var(--q3-fondo, #fff); border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 14px; padding: 14px; margin: 0; box-shadow: 0 1px 3px rgba(15, 23, 42, .10), 0 1px 2px rgba(15, 23, 42, .06); }
				    :where(body[data-vista="product-stock"]) .rx-paso--calc { border-color: #86efac; background: #f0fdf4; display: flex; flex-direction: column; }
				    :where(body[data-vista="product-stock"]) .rx-paso--calc[hidden] { display: none; }
				    :where(body[data-vista="product-stock"]) .rx-paso--calc .btn { font-weight: 800; margin-top: auto; }
				    :where(body[data-vista="product-stock"]) .rx-num--calc { background: #16a34a; }
				    :where(body[data-vista="product-stock"]) .rx-cambios { list-style: none; padding: 0; margin: -4px 0 12px 32px; font-size: var(--q3-fs-md); color: #14532d; }
				    :where(body[data-vista="product-stock"]) .rx-cambios li { padding: 2px 0; } :where(body[data-vista="product-stock"]) .rx-cambios li::before { content: "• "; color: #16a34a; font-weight: 800; }
				    @media (max-width: 1100px) { :where(body[data-vista="product-stock"]) .rx-paso--calc { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 1040; box-shadow: 0 4px 16px rgba(15, 23, 42, .25); } :where(body[data-vista="product-stock"]) .rx-paso--calc .rx-ayuda, :where(body[data-vista="product-stock"]) .rx-paso--calc .rx-cambios { margin-left: 0; } }
				    :where(body[data-vista="product-stock"]) .rx-paso--calc #btnCalcular { font-size: var(--q3-fs-xl) !important; padding: 10px 12px !important; }
				    /* Deshacer: naranja como todo «Cancelar», pero en contorno para que Calcular sea lo principal */
				    :where(body[data-vista="product-stock"]) .rx-paso--calc #btnDeshacer { background: #fff !important; color: #c2410c !important; border: 1.5px solid #f97316 !important; box-shadow: none !important; }
				    :where(body[data-vista="product-stock"]) .rx-paso h3 { font-size: var(--q3-fs-lg); font-weight: 800; margin: 0 0 2px; display: flex; gap: 8px; align-items: center; color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock"]) .rx-paso label { font-size: var(--q3-fs-sm); font-weight: 700; color: var(--q3-texto-3, #475569); margin-bottom: 3px; }
				    :where(body[data-vista="product-stock"]) .rx-num { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #1e3a8a; color: #fff; font-size: var(--q3-fs-md); flex: none; }
				    :where(body[data-vista="product-stock"]) .rx-ayuda { font-size: var(--q3-fs-sm); color: var(--q3-texto-4, #64748b); margin: 0 0 10px 32px; }
				    :where(body[data-vista="product-stock"]) .rx-seg { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
				    :where(body[data-vista="product-stock"]) .rx-seg label { margin: 0; cursor: pointer; }
				    :where(body[data-vista="product-stock"]) .rx-seg input { position: absolute; opacity: 0; pointer-events: none; }
				    :where(body[data-vista="product-stock"]) .rx-seg span { display: block; border: 1.5px solid var(--q3-borde-3, #cbd5e1); background: var(--q3-fondo, #fff); border-radius: 10px; padding: 8px 4px; font-weight: 800; color: var(--q3-texto-2, #334155); line-height: 1.1; text-align: center; }
				    :where(body[data-vista="product-stock"]) .rx-seg small { display: block; font-weight: 500; font-size: var(--q3-fs-xs); color: var(--q3-texto-4, #64748b); margin-top: 2px; }
				    :where(body[data-vista="product-stock"]) .rx-seg label:hover span { border-color: #1e3a8a; }
				    :where(body[data-vista="product-stock"]) .rx-seg input:checked + span { background: #1e3a8a; border-color: #1e3a8a; color: #fff; } :where(body[data-vista="product-stock"]) .rx-seg input:checked + span small { color: #c7d2fe; }
				    :where(body[data-vista="product-stock"]) .rx-seg input:focus-visible + span { outline: 2px solid #2563eb; outline-offset: 2px; }
				    :where(body[data-vista="product-stock"]) .rx-cubre { margin-top: 10px; font-size: var(--q3-fs-md); background: #eff6ff; color: #1e3a8a; border-radius: 8px; padding: 6px 10px; }
				    :where(body[data-vista="product-stock"]) .rx-pendiente .rx-resultado, :where(body[data-vista="product-stock"]) .rx-pendiente .rx-tabla { opacity: .45; }
				    :where(body[data-vista="product-stock"]) .rx-resultado { background: var(--q3-fondo, #fff); border: 1px solid #fdba74; border-left: 6px solid #f97316; border-radius: 14px; padding: 16px; margin: 14px 0 10px; }
				    :where(body[data-vista="product-stock"]) .rx-frase { font-size: var(--q3-fs-2xl); margin: 0 0 12px; } :where(body[data-vista="product-stock"]) .rx-frase b { color: #9a3412; } :where(body[data-vista="product-stock"]) .rx-gris { color: var(--q3-texto-4, #64748b); font-size: var(--q3-fs-lg); }
				    :where(body[data-vista="product-stock"]) .rx-cuenta { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; }
				    :where(body[data-vista="product-stock"]) .rx-c { flex: 1 1 150px; border-radius: 12px; padding: 10px; text-align: center; background: var(--q3-fondo-2, #f8fafc); border: 1px solid var(--q3-borde, #e2e8f0); }
				    :where(body[data-vista="product-stock"]) .rx-c small { display: block; font-size: var(--q3-fs-xs); font-weight: 700; color: var(--q3-texto-4, #64748b); text-transform: uppercase; }
				    :where(body[data-vista="product-stock"]) .rx-c b { display: block; font-size: var(--q3-fs-3xl); } :where(body[data-vista="product-stock"]) .rx-c span { font-size: var(--q3-fs-sm); color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock"]) .rx-c--dem b { color: #1e3a8a; } :where(body[data-vista="product-stock"]) .rx-c--fin { background: #fff7ed; border-color: #fdba74; } :where(body[data-vista="product-stock"]) .rx-c--fin b { color: #9a3412; font-size: var(--q3-fs-4xl); }
				    :where(body[data-vista="product-stock"]) .rx-op { display: grid; place-items: center; font-size: var(--q3-fs-3xl); font-weight: 800; color: var(--q3-texto-5, #94a3b8); }
				    @media (max-width: 576px) { :where(body[data-vista="product-stock"]) .rx-op { flex: 1 1 100%; line-height: 1; } :where(body[data-vista="product-stock"]) .rx-op em { display: inline-block; transform: rotate(90deg); } }
				    :where(body[data-vista="product-stock"]) .rx-alertas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
				    :where(body[data-vista="product-stock"]) .rx-alerta { display: flex; align-items: center; gap: 8px; border-radius: 10px; padding: 8px 12px; font-size: var(--q3-fs-md); border: 1px solid; text-decoration: none; }
				    :where(body[data-vista="product-stock"]) .rx-alerta--agota { border-color: #dc2626; background: #fef2f2; color: #991b1b; }
				    :where(body[data-vista="product-stock"]) .rx-alerta--alta { border-color: #eab308; background: #fefce8; color: #854d0e; }
				    :where(body[data-vista="product-stock"]) .rx-alerta { cursor: pointer; font-family: inherit; } :where(body[data-vista="product-stock"]) .rx-alerta u { font-weight: 700; }
				    /* REPO-UX-004 · pestañas sobre la tabla, una sola forma de marcar, tabla corta */
				    /* REPO-UX-005 · la lista va en su propia tarjeta: título, pestañas grandes y una franja con lo que
				       suma la pestaña y sus acciones. Antes las pestañas eran una línea de texto y se perdían. */
				    :where(body[data-vista="product-stock"]) .rx-tabla { background: var(--q3-fondo, #fff); border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 14px; padding: 14px; margin: 14px 0 10px; box-shadow: 0 1px 3px rgba(15, 23, 42, .10), 0 1px 2px rgba(15, 23, 42, .06); }
				    :where(body[data-vista="product-stock"]) .rx-tabla__tit { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: var(--q3-fs-xl); font-weight: 800; color: var(--q3-texto, #0f172a); margin: 0 0 10px; }
				    :where(body[data-vista="product-stock"]) .rx-tabla__tit em { color: #1e3a8a; } :where(body[data-vista="product-stock"]) .rx-tabla__tit small { font-size: var(--q3-fs-sm); font-weight: 500; color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock"]) .rx-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
				    @media (max-width: 768px) { :where(body[data-vista="product-stock"]) .rx-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } :where(body[data-vista="product-stock"]) .rx-tab { grid-template-columns: auto 1fr; padding: 8px 10px; } :where(body[data-vista="product-stock"]) .rx-tab > small { display: none; } :where(body[data-vista="product-stock"]) .rx-tab > b { grid-row: auto; grid-column: 2; font-size: var(--q3-fs-xl); } }
				    :where(body[data-vista="product-stock"]) .rx-tab { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2px 8px; text-align: left; border: 1.5px solid var(--q3-borde-3, #cbd5e1); background: var(--q3-fondo, #fff); border-radius: 12px; padding: 9px 12px; color: var(--q3-texto-2, #334155); font-family: inherit; }
				    :where(body[data-vista="product-stock"]) .rx-tab > em { grid-row: span 2; font-size: var(--q3-fs-2xl); color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock"]) .rx-tab > span { font-weight: 800; font-size: var(--q3-fs-lg); line-height: 1.2; }
				    :where(body[data-vista="product-stock"]) .rx-tab > b { grid-row: span 2; font-size: var(--q3-fs-2xl); font-weight: 800; color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock"]) .rx-tab > small { grid-column: 2; font-size: var(--q3-fs-xs); color: var(--q3-texto-4, #64748b); line-height: 1.2; }
				    :where(body[data-vista="product-stock"]) .rx-tab:hover { border-color: #f97316; }
				    :where(body[data-vista="product-stock"]) .rx-tab.is-on { background: #fff7ed; border-color: #f97316; color: #9a3412; }
				    :where(body[data-vista="product-stock"]) .rx-tab.is-on > em, :where(body[data-vista="product-stock"]) .rx-tab.is-on > b { color: #c2410c; } :where(body[data-vista="product-stock"]) .rx-tab.is-on > small { color: #9a3412; }
				    :where(body[data-vista="product-stock"]) .rx-tab-res { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; margin: 10px 0 4px; padding: 8px 12px; border-radius: 10px; background: #fff7ed; border: 1px solid #fed7aa; font-size: var(--q3-fs-lg); color: var(--q3-texto-3, #475569); }
				    :where(body[data-vista="product-stock"]) .rx-tab-res b { color: #9a3412; }
				    :where(body[data-vista="product-stock"]) .rx-tabs-acc { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
				    :where(body[data-vista="product-stock"]) .rx-anterior { display: block; text-align: right; font-size: var(--q3-fs-sm); color: var(--q3-texto-4, #64748b); margin-top: 6px; }
				    :where(body[data-vista="product-stock"]) #tblReposicion td small, :where(body[data-vista="product-stock"]) #tblReposicion td .rv-base { display: block; font-size: var(--q3-fs-xs); color: var(--q3-texto-4, #64748b); font-weight: 500; line-height: 1.3; }
				    :where(body[data-vista="product-stock"]) #tblReposicion td.rx-prod b { font-weight: 700; color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock"]) .rx-datos { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: var(--q3-fs-sm); color: var(--q3-texto-3, #475569); margin: 0 0 10px; }
				    :where(body[data-vista="product-stock"]) .rx-ok { color: #15803d; } :where(body[data-vista="product-stock"]) .rx-ojo { color: #92400e; }
				    :where(body[data-vista="product-stock"]) .rx-fue { background: var(--q3-fondo, #fff); border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 12px; padding: 10px 14px; margin: 0 0 10px; }
				    :where(body[data-vista="product-stock"]) .rx-fue summary { font-weight: 800; color: #1e3a8a; cursor: pointer; } :where(body[data-vista="product-stock"]) .rx-fue summary small { font-weight: 500; color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock"]) .rx-fue__form { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin-top: 10px; }
				    :where(body[data-vista="product-stock"]) .rx-fue__form label { display: block; font-size: var(--q3-fs-sm); font-weight: 700; color: var(--q3-texto-3, #475569); margin-bottom: 3px; }
				    :where(body[data-vista="product-stock"]) .rx-fue__form .form-control { width: 130px; }
				    :where(body[data-vista="product-stock"]) .rx-fue__nota { font-size: var(--q3-fs-md); color: var(--q3-texto-3, #475569); margin: 8px 0 0; }
				    :where(body[data-vista="product-stock"]) #tblReposicion.rx-sinper .rv-per { display: none; }
				    :where(body[data-vista="product-stock"].dark-mode) .rx-paso, :where(body[data-vista="product-stock"].dark-mode) .rx-resultado, :where(body[data-vista="product-stock"].dark-mode) .rx-fue, :where(body[data-vista="product-stock"].dark-mode) .rx-seg span, :where(body[data-vista="product-stock"].dark-mode) .rx-tab, :where(body[data-vista="product-stock"].dark-mode) .rx-tabla { background: transparent; color: inherit; }

/* ── guiasremision (core/app/view/guiasremision-view.php) ─────────────────────────────────────────────── */
/* EXP-DES-001 F2-B6 — estilos namespaced del popup de GRE (evitan choque con Bootstrap).
   Secciones, preview de solo lectura del comprobante origen. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview { background:var(--q-surface-2,#f8fafc); border:1px solid var(--q-border,#e2e8f0); border-radius:8px; padding:10px 12px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__cli { font-size:13px; margin-bottom:8px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__badge { display:inline-block; background:var(--q-primary,#4f46e5); color:#fff; font-size:10px; font-weight:700; letter-spacing:.5px; padding:2px 7px; border-radius:10px; vertical-align:middle; margin-right:6px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__dir { color:var(--q-text-2,#64748b); margin-top:3px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__tbl { margin-bottom:6px; font-size:12.5px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__tbl th { font-size:11px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__note { color:var(--q-text-2,#64748b); font-size:11.5px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-preview__warn { background:#fdecea; border:1px solid #f5c6cb; color:#a5232f; font-size:12px; font-weight:600; padding:7px 10px; border-radius:6px; margin-bottom:8px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-body .q-campo, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-body .q-campo { margin-bottom:6px; }
/* Clearfix: las columnas col-md-* flotan dentro de .form-group (sin .row), y al expandirse
   una caja [+ Nuevo] los floats no se cerraban -> el modal-body colapsaba y el footer/secciones
   se encimaban sobre los botones (clic real interceptado). Forzamos el cierre de floats.

   VTA-GRE-019d · la guia libre heredo el mismo HTML y volvio a caer en lo mismo en cuanto
   estreno sus cajas [+ Nuevo]: los campos se dibujaban pero el pie del modal, que pinta
   despues, se les ponia encima y se comia el clic. Se veian y no se podian usar. */
/* RETIRADO al migrar a Bootstrap 5, a proposito. `.row` es ahora
   `display:flex`, de modo que las columnas no flotan y el colapso que esta
   guarda evitaba no puede producirse. Reponerla seria peor que no tenerla:
   dentro de un contenedor flex, `::before` y `::after` cuentan como
   elementos flex, asi que cada fila estrenaria dos cajas fantasma. */
/* GRE-VAL-001 · motivo del rechazo en la lista y aviso de dato inválido en el catálogo */
:where(body[data-vista="guiasremision"]) .gre-motivo-rechazo { margin-top:4px; max-width:260px; font-size:var(--q3-fs-xs); line-height:1.3; color:#b91c1c; text-align:left; white-space:normal; }
:where(body[data-vista="guiasremision"]) .gre-anulada { color:#b91c1c; font-weight:700; text-decoration:line-through; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-dato-malo, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-dato-malo { display:block; margin-top:3px; font-size:var(--q3-fs-xs); color:#b91c1c; font-weight:600; }
/* GRE-CRED-001 · alta de conductor en filas con etiqueta: cinco casillas sin rótulo en media
   fila no dejaban escribir, y el segundo apellido acabó en la casilla de la licencia. */
:where(body[data-vista="guiasremision"]) .gre-cond { display:flex; flex-direction:column; gap:8px; }
:where(body[data-vista="guiasremision"]) .gre-cond__fila { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
:where(body[data-vista="guiasremision"]) .gre-cond__fila--doc { grid-template-columns:110px 1fr auto; align-items:end; }
:where(body[data-vista="guiasremision"]) .gre-cond__fila:last-of-type { grid-template-columns:1fr; }
:where(body[data-vista="guiasremision"]) .gre-cond__campo { display:flex; flex-direction:column; gap:3px; margin:0; font-weight:400; }
:where(body[data-vista="guiasremision"]) .gre-cond__campo > span { font-size:var(--q3-fs-xs); font-weight:600; color:var(--q-text-2,var(--q3-texto-4, #64748b)); }
:where(body[data-vista="guiasremision"]) .gre-cond__fila--doc .gre-consultar-dni { height:36px; white-space:nowrap; }
:where(body[data-vista="guiasremision"]) .gre-cond__nota { font-size:var(--q3-fs-xs); color:var(--q-text-2,var(--q3-texto-4, #64748b)); min-height:14px; }
@media (max-width:576px){ :where(body[data-vista="guiasremision"]) .gre-cond__fila, :where(body[data-vista="guiasremision"]) .gre-cond__fila--doc { grid-template-columns:1fr; } }
/* Catálogos [+ Nuevo] (Fase B) */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-hint, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-hint { display:block; color:var(--q-text-2,var(--q3-texto-4, #64748b)); font-size:var(--q3-fs-xs); margin-top:3px; min-height:14px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox { margin-top:6px; padding:10px; background:var(--q-surface-2,var(--q3-fondo-2, #f8fafc)); border:1px dashed var(--q-border,var(--q3-borde-3, #cbd5e1)); border-radius:8px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__grid, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__grid { display:grid; grid-template-columns:1fr 1fr 2fr; gap:6px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__grid--5, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__grid--5 { grid-template-columns:1.1fr 1fr 1.2fr 1.2fr 1fr; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__grid--3, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__grid--3 { grid-template-columns:1fr 1fr 1fr; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__act, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__act { margin-top:8px; display:flex; gap:8px; justify-content:flex-end; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-check { display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:var(--q3-fs-md); cursor:pointer; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-check input { width:auto; margin:0; }
/* Botón de cierre (X) visible y cómodo sobre el header azul. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header { position:relative; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header .close, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header .close {
    position:absolute; top:50%; right:14px; transform:translateY(-50%);
    width:34px; height:34px; margin:0; padding:0;
    display:flex; align-items:center; justify-content:center;
    font-size:var(--q3-fs-4xl); line-height:1; font-weight:400;
    color:#fff; opacity:.95; text-shadow:none;
    background:rgba(255,255,255,.18); border:0; border-radius:50%;
    cursor:pointer; transition:background .15s ease, transform .15s ease; z-index:5;
}
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header .close:hover, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header .close:hover, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header .close:focus, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header .close:focus { color:#fff; opacity:1; background:rgba(255,255,255,.34); outline:none; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header .close:active, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header .close:active { transform:translateY(-50%) scale(.92); }
/* Modal alto: header y footer FIJOS, solo el cuerpo se desplaza -> la X y "Generar" siempre accesibles.
   OJO: el <form> envuelve body+footer, por eso también debe ser contenedor flex.

   VTA-GRE-019 · la guía libre es aún más alta que ésta y nació sin nada de esto: el
   encabezado se salía por arriba de la pantalla y el pie quedaba al final de un
   formulario larguísimo. Comparten las reglas porque son el mismo popup con distinto
   contenido, no dos diseños. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-dialog, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-dialog { transform:none !important; margin:24px auto !important; }
/* GRE-CRED-002 · 800 px (modal-lg) quedaba angosto para la tabla de productos y las altas
   rápidas en dos columnas. Más ancho, sin pasarse de la pantalla. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-dialog, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-dialog { max-width:min(1100px, calc(100vw - 32px)); }   /* anula el centrado por transform que sacaba el header de pantalla */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-content, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-content { max-height:92vh; display:flex; flex-direction:column; overflow:hidden; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-content > form, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-content > form { display:flex; flex-direction:column; flex:1 1 auto; min-height:0; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-footer, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-footer { flex:0 0 auto; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-body, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-body { flex:1 1 auto; overflow-y:auto; min-height:0; }   /* min-height:0 permite que el cuerpo se encoja y haga scroll interno */
@media (max-width:640px){ :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__grid, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__grid--5, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-newbox__grid--3, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__grid, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__grid--5, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-newbox__grid--3 { grid-template-columns:1fr; } }
/* GRE-UX-001 · rediseño del popup. El formulario se lee como cuatro pasos: cada sección
   es una tarjeta con su número y una línea que dice para qué sirve, sobre un fondo gris
   que las separa. Los rótulos sin « :», el obligatorio con asterisco rojo, las acciones
   de cada catálogo como botones pequeños a la derecha de su rótulo, y el pie con el
   aviso de SUNAT al lado del botón que emite. Sólo colores del sistema (modo oscuro). */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-body, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-body { background:var(--q-bg,var(--q3-fondo-3, #f1f5f9)); padding:16px 18px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card { background:var(--q-surface,var(--q3-fondo, #fff)); border:1.5px solid var(--q3-borde-3, #cbd5e1); border-left-width:5px; transition:border-color .15s ease, box-shadow .15s ease; border-radius:var(--q-radius-lg,12px); padding:14px 16px 8px; margin-bottom:14px; box-shadow:var(--q-shadow-sm,0 1px 2px rgba(15,23,42,.05)); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card:last-child, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card:last-child { margin-bottom:0; }
/* GRE-UX-002 · cada tarjeta dice cómo va: la que se está llenando, en azul; la completa,
   con borde y número verdes; la que tiene pendientes, en ámbar y con lo que falta. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card--ok, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card--ok { border-color:#86efac; border-left-color:#16a34a; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card--ok .gre-sec__n, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card--ok .gre-sec__n { background:#16a34a; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card--falta, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card--falta { border-left-color:#f59e0b; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card:focus-within, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card:focus-within { border-color:var(--q-primary,#1d4ed8); box-shadow:0 0 0 3px rgba(29,78,216,.14); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-sec__estado, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-sec__estado { margin-left:auto; align-self:center; font-size:var(--q3-fs-sm); font-weight:600; padding:2px 10px; border-radius:var(--q-radius-pill,999px); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card--ok .gre-sec__estado, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card--ok .gre-sec__estado { color:#15803d; background:#dcfce7; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card--falta .gre-sec__estado, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card--falta .gre-sec__estado { color:#b45309; background:#fef3c7; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-sec, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-sec { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; margin:0 0 12px; padding:0 0 10px; border-bottom:1px solid var(--q-border,var(--q3-borde, #e2e8f0)); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-sec__n, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-sec__n { align-self:center; flex:0 0 26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:var(--q-primary,#1d4ed8); color:var(--q-color-on-primary,#fff); font-weight:700; font-size:var(--q3-fs-md); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-sec__t, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-sec__t { font-size:var(--q3-fs-lg); font-weight:700; letter-spacing:0; text-transform:none; color:var(--q-text-1,var(--q3-texto, #0f172a)); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-sec__d, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-sec__d { font-size:var(--q3-fs-sm); color:var(--q-text-2,var(--q3-texto-4, #64748b)); }
/* Rótulo: texto a la izquierda, acciones del catálogo a la derecha. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .q-label, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .q-label { display:flex; align-items:center; flex-wrap:wrap; gap:4px; font-size:var(--q3-fs-sm); font-weight:600; color:var(--q-text-1,var(--q3-texto-2, #334155)); margin-bottom:5px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-req, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-req { color:var(--q-color-danger,#dc2626); font-weight:700; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .q-label .gre-add, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .q-label .gre-add { margin-left:auto; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-add, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-add, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op {
    display:inline-flex; align-items:center; gap:4px; margin-left:4px; padding:2px 9px; border-radius:var(--q-radius-pill,999px);
    font-size:var(--q3-fs-xs); font-weight:600; line-height:1.6; text-decoration:none; white-space:nowrap;
    border:1px solid var(--q-border,var(--q3-borde-3, #cbd5e1)); background:var(--q-surface,var(--q3-fondo, #fff)); color:var(--q-text-2,var(--q3-texto-3, #475569));
    transition:background .15s ease, border-color .15s ease, color .15s ease; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-add, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-add { border-color:var(--q-primary,#1d4ed8); color:var(--q-primary,#1d4ed8); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-add:hover, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-add:hover { background:var(--q-primary,#1d4ed8); color:var(--q-color-on-primary,#fff); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op:hover, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op:hover { background:var(--q-surface-2,var(--q3-fondo-3, #f1f5f9)); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op--on, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op--on { border-color:#d97706; color:#b45309; background:#fffbeb; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op[data-op="quitar"], :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op[data-op="quitar"] { color:var(--q-color-danger,#b91c1c); border-color:#fecaca; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op[data-op="quitar"]:hover, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op[data-op="quitar"]:hover { background:#fef2f2; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op.gre-cat-op--off, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op.gre-cat-op--off { color:var(--q-text-3,var(--q3-texto-5, #94a3b8)) !important; border-color:var(--q-border,var(--q3-borde, #e2e8f0)); background:transparent; cursor:not-allowed; }
/* El marcado se ve marcado aunque no haya nada que hacer con él. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-cat-op.gre-cat-op--on.gre-cat-op--off, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-cat-op.gre-cat-op--on.gre-cat-op--off { color:#b45309 !important; border-color:#fcd34d; background:#fffbeb; cursor:default; }
/* Encabezado: título a la izquierda, cerrar a la derecha (en la guía libre la X venía primero). */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header { display:flex; align-items:center; gap:12px; padding:14px 18px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-title, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-title { order:0; margin:0; font-size:var(--q3-fs-xl); font-weight:700; color:#fff; display:flex; align-items:center; gap:8px; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-header .btn-close, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-header .btn-close { order:1; margin:0 0 0 auto; }
/* Campos: todos de la misma altura y con foco visible. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .q-input, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .q-select, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .q-input, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .q-select { min-height:38px; border-radius:var(--q-radius-md,8px); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .q-input:focus, :where(body[data-vista="guiasremision"]) #modalGenerarGuia .q-select:focus, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .q-input:focus, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .q-select:focus { box-shadow:var(--q-focus-shadow,0 0 0 3px rgba(29,78,216,.18)); }
:where(body[data-vista="guiasremision"]) #modalGuiaLibre #tblGuiaLibre thead th { font-size:var(--q3-fs-xs); letter-spacing:.04em; text-transform:uppercase; color:var(--q-text-2,var(--q3-texto-4, #64748b)); }
:where(body[data-vista="guiasremision"]) #modalGuiaLibre #tblGuiaLibre td { vertical-align:top; }
:where(body[data-vista="guiasremision"]) #modalGuiaLibre #tblGuiaLibre .gre-hint { color:#0f766e; font-weight:600; }
/* Pie: el aviso de SUNAT a la izquierda, los dos botones a la derecha. */
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-footer, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-footer { display:flex; align-items:center; gap:10px; padding:12px 18px; background:var(--q-surface,var(--q3-fondo, #fff)); border-top:1px solid var(--q-border,var(--q3-borde, #e2e8f0)); }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-pie__nota, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-pie__nota { margin-right:auto; display:inline-flex; align-items:center; gap:6px; font-size:var(--q3-fs-sm); color:#b45309; }
:where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-emitir, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-emitir { min-width:190px; font-weight:700; }
@media (max-width:640px){
  :where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-body, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-body { padding:12px; }
  :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-card, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-card { padding:12px 12px 6px; }
  :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-sec__d, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-sec__d { flex-basis:100%; margin-left:36px; }
  :where(body[data-vista="guiasremision"]) #modalGenerarGuia .modal-footer, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .modal-footer { flex-wrap:wrap; }
  :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-pie__nota, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-pie__nota { flex-basis:100%; }
  :where(body[data-vista="guiasremision"]) #modalGenerarGuia .gre-emitir, :where(body[data-vista="guiasremision"]) #modalGuiaLibre .gre-emitir { flex:1 1 auto; min-width:0; }
}
/* Anchos de la bandeja GRE — override del autoWidth de DataTables (!important vence al width inline). */
:where(body[data-vista="guiasremision"]) #tblGre thead th { text-align:center !important; }                 /* todos los títulos centrados */
:where(body[data-vista="guiasremision"]) #tblGre th:nth-child(1), :where(body[data-vista="guiasremision"]) #tblGre td:nth-child(1), :where(body[data-vista="guiasremision"]) /* Serie: mínimo (TTD1-16) */
#tblGre th:nth-child(5), :where(body[data-vista="guiasremision"]) #tblGre td:nth-child(5) { width:1% !important; white-space:nowrap !important; }   /* Estado SUNAT: mínimo */
:where(body[data-vista="guiasremision"]) #tblGre th:nth-child(3), :where(body[data-vista="guiasremision"]) #tblGre td:nth-child(3) { min-width:240px !important; }   /* Cliente ampliado */
:where(body[data-vista="guiasremision"]) #tblGre th:nth-child(4), :where(body[data-vista="guiasremision"]) #tblGre td:nth-child(4) { width:1% !important; white-space:nowrap !important; }   /* Doc. Origen al mínimo (2 líneas) */
:where(body[data-vista="guiasremision"]) #tblGre th:nth-child(12), :where(body[data-vista="guiasremision"]) #tblGre td:nth-child(12) { width:1% !important; white-space:nowrap !important; text-align:center !important; }  /* Acciones */
/* Semáforo de Estado SUNAT — se fuerza el color (la regla .skin-peru td{color!important} lo apagaba). */
:where(body[data-vista="guiasremision"]) #tblGre .q-badge { display:inline-block; padding:2px 9px; border-radius:11px; font-weight:700; font-size:var(--q3-fs-xs); line-height:1.4; }
:where(body[data-vista="guiasremision"]) .nota-entregas { background:#DDECEE; border-left:3px solid #0F6E7A; padding:8px 12px; border-radius:0 4px 4px 0; font-size:var(--q3-fs-md); }
:where(body[data-vista="guiasremision"]) #tblGre .q-badge--ok {   color:#15803d !important; background:#dcfce7 !important; }
:where(body[data-vista="guiasremision"]) #tblGre .q-badge--err {  color:#b91c1c !important; background:#fee2e2 !important; }
:where(body[data-vista="guiasremision"]) #tblGre .q-badge--warn { color:#b45309 !important; background:#fef3c7 !important; }
:where(body[data-vista="guiasremision"]) #tblGre .q-badge--muted {color:var(--q3-texto-3, #475569) !important; background:#e2e8f0 !important; }

/* ── newoc (core/app/view/newoc-view.php) ─────────────────────────────────────────────────────── */
/* Fila de captura de la compra en UNA sola línea (flex, solo layout — sin colores).
   Producto absorbe el sobrante; los demás campos con ancho fijo; Observación flexible.
   Reemplaza el layout de grid Bootstrap (que partía la fila en 2). Wrappea en pantallas angostas. */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px; margin-left:0; margin-right:0; }
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div { float:none !important; width:auto; padding:0 !important; margin:0 !important; }
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(1) { flex:2 1 220px; min-width:200px; }   /* Producto */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(2) { flex:0 0 110px; }                    /* Unidad Almacen */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(3) { flex:0 0 130px; }                    /* Unidad Compra */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(4) { flex:0 0 90px; }                     /* Cantidad */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(5) { flex:0 0 80px; }                     /* Bonificación (CMP-COS-001) */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(6) { flex:0 0 110px; }                    /* Costo Unitario */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(7) { flex:0 0 120px; }                    /* IGV de la línea (CMP-IGV-003) */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(8) { flex:0 0 120px; }                    /* Lote (oculto por defecto) */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(9) { flex:0 0 140px; }                    /* Vencimiento (oculto) */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(10) { flex:1 1 150px; }                   /* Observación */
:where(body[data-vista="newoc"]) #panel4Content .oc-capture > div:nth-child(11) { flex:0 0 auto; padding-top:0; }     /* Agregar */

/* ── sunat (core/app/view/sunat-view.php) ─────────────────────────────────────────────────────── */
:where(body[data-vista="sunat"]) .sb-barra { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--q-border, var(--q3-borde, #e2e8f0)); }
                        :where(body[data-vista="sunat"]) .sb-estados { display:flex; flex-wrap:wrap; gap:6px; }
                        :where(body[data-vista="sunat"]) .sb-chip { display:inline-flex; align-items:center; gap:7px; padding:6px 12px; border:1px solid var(--q-border, var(--q3-borde, #e2e8f0)); border-radius:999px; background:var(--q-surface, var(--q3-fondo, #fff)); color:var(--q-text-1, var(--q3-texto-1, #1e293b)); font-size:var(--q3-fs-md); font-weight:600; cursor:pointer; line-height:1.2; }
                        :where(body[data-vista="sunat"]) .sb-chip:hover { background:var(--q-surface-2, var(--q3-fondo-3, #f1f5f9)); }
                        :where(body[data-vista="sunat"]) .sb-chip b { min-width:22px; padding:1px 7px; border-radius:999px; background:var(--q-surface-2, var(--q3-fondo-3, #f1f5f9)); font-size:var(--q3-fs-sm); text-align:center; }
                        :where(body[data-vista="sunat"]) .sb-chip.is-alerta b { background:#fee2e2; color:#b91c1c; }
                        :where(body[data-vista="sunat"]) .sb-chip.is-activo { background:#1e3a8a; border-color:#1e3a8a; color:#fff; }
                        :where(body[data-vista="sunat"]) .sb-chip.is-activo b { background:rgba(255,255,255,.22); color:#fff; }
                        :where(body[data-vista="sunat"]) .sb-dot { width:8px; height:8px; border-radius:50%; display:inline-block; }
                        :where(body[data-vista="sunat"]) .sb-acciones { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:6px 8px; margin-left:auto; }
                        :where(body[data-vista="sunat"]) .sb-acciones .q-btn { white-space:nowrap; }   /* SUN-BAJA-002: los tres botones en una fila */                        /* SUN-BAJA-004: estados y botones en UNA fila en pantallas anchas; el bloque de botones se ajusta y la línea del envío automático queda debajo de ellos. */                        @media (min-width: 1200px){ :where(body[data-vista="sunat"]) .sb-barra { flex-wrap:nowrap; padding-bottom:26px; } :where(body[data-vista="sunat"]) .sb-estados { flex-wrap:nowrap; flex-shrink:0; } :where(body[data-vista="sunat"]) .sb-acciones { flex:0 0 auto; position:relative; } :where(body[data-vista="sunat"]) .sb-auto { position:absolute; right:0; top:100%; margin-top:6px; white-space:nowrap; } }
                        :where(body[data-vista="sunat"]) .sb-auto { flex:1 0 100%; text-align:right; font-size:var(--q3-fs-xs); color:var(--q-text-3, var(--q3-texto-4, #64748b)); }
                        :where(body[data-vista="sunat"]) #btnLimpiar { color:var(--q-text-1, var(--q3-texto-1, #1e293b)) !important; background:var(--q-surface, var(--q3-fondo, #fff)) !important; border:1px solid var(--q-border, var(--q3-borde, #e2e8f0)) !important; }
                        :where(body[data-vista="sunat"]) #btnLimpiar:hover { background:var(--q-surface-2, var(--q3-fondo-3, #f1f5f9)) !important; }
                        @media (max-width: 767px){ :where(body[data-vista="sunat"]) .sb-acciones { max-width:none; justify-content:flex-start; } :where(body[data-vista="sunat"]) .sb-auto { text-align:left; } }

/* SUN-BAJA-001 · anulado: rojo y tachado; etiquetas y botones no se tachan. */
                            :where(body[data-vista="sunat"]) tr.sb-anulado > td { color: #b91c1c !important; text-decoration: line-through; text-decoration-color: rgba(185, 28, 28, .65); }
                            :where(body[data-vista="sunat"]) tr.sb-anulado > td:last-child { text-decoration: none; }
                            /* Tablas centradas: cabecera y datos, todas las columnas. */
                            :where(body[data-vista="sunat"]) table.sb-centro th, :where(body[data-vista="sunat"]) table.sb-centro td { text-align: center !important; }
                            :where(body[data-vista="sunat"]) .swal2-popup.sf-popup { width: min(860px, 96vw) !important; max-width: 96vw !important; }
                            :where(body[data-vista="sunat"]) table.sb-centro td:last-child > div { justify-content: center !important; }

/* ── trays (core/app/view/trays-view.php) ─────────────────────────────────────────────────────── */
/* Popup de detalle de entrega: distribución fija + fuente 1pt menor + celdas que envuelven (responsivo, sin scroll horizontal). */
	    /* Supera el tope de design-system-modals.css (.modal-dialog:not(.modal-sm):not(.modal-lg){max-width:720px!important}). */
	    :where(body[data-vista="trays"]) .detalle-entrega-modal .modal-dialog:not(.modal-sm):not(.modal-lg) { width: 95% !important; max-width: 1050px !important; }
	    :where(body[data-vista="trays"]) .detalle-entrega-tabla { width: 100%; table-layout: fixed; font-size: var(--q3-fs-sm); border-collapse: collapse; }
	    :where(body[data-vista="trays"]) .detalle-entrega-tabla th, :where(body[data-vista="trays"]) .detalle-entrega-tabla td { white-space: normal; word-break: break-word; vertical-align: top; }
	    /* Celdas envuelven, así que no hace falta scroll horizontal (evita la barra residual). */
	    :where(body[data-vista="trays"]) .detalle-entrega-modal .table-responsive { overflow-x: hidden; }
	    @media (max-width: 575px){ :where(body[data-vista="trays"]) .detalle-entrega-tabla { font-size: var(--q3-fs-xs); } }

/* VTA-GRE-014 · la columna Guia del modal de entregas. */
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .axr-guia-num { font-size: var(--q3-fs-sm); font-weight: 600; margin-bottom: 2px; }
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .tray-guia-sel { font-weight: 400; font-size: var(--q3-fs-sm); color: var(--q-text-2,var(--q3-texto-4, #64748B)); cursor: pointer; margin: 0; display: inline-flex; align-items: center; gap: 5px; }
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .q-badge { display: inline-block; padding: 1px 7px; border-radius: 10px; font-size: var(--q3-fs-2xs); font-weight: 700; }
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .q-badge--ok { color:#15803d; background:#dcfce7; }
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .q-badge--err { color:#b91c1c; background:#fee2e2; }
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .q-badge--warn { color:#b45309; background:#fef3c7; }
	:where(body[data-vista="trays"]) .detalle-entrega-tabla .q-badge--muted { color:var(--q3-texto-3, #475569); background:#e2e8f0; }

/* ── guiacomponentes (core/app/view/guiacomponentes-view.php) · VIS-005 ─────────── */
:where(body[data-vista="guiacomponentes"]) .gc-cuerpo { display: grid; gap: 12px; max-width: 1100px; }
:where(body[data-vista="guiacomponentes"]) .gc-demo-panel { max-width: 520px; margin: 0; box-shadow: var(--q-shadow-card); }
:where(body[data-vista="guiacomponentes"]) .gc-lead { font-size: var(--q3-fs-lg); color: var(--q-text-1); max-width: 85ch; }
:where(body[data-vista="guiacomponentes"]) .gc-titulo { font-size: var(--q3-fs-xl); font-weight: 700; margin: 18px 0 0; color: var(--q-text-1); }
:where(body[data-vista="guiacomponentes"]) .gc-nota { font-size: var(--q3-fs-md); color: var(--q-text-2); margin: 0; max-width: 85ch; }
:where(body[data-vista="guiacomponentes"]) .gc-fila { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
:where(body[data-vista="guiacomponentes"]) .gc-tabla th, :where(body[data-vista="guiacomponentes"]) .gc-tabla td { text-align: center; vertical-align: middle; }
:where(body[data-vista="guiacomponentes"]) .rv-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px; border: 1px solid #fde68a; background: #fffbeb; color: #78350f; border-radius: 10px; }
:where(body[data-vista="guiacomponentes"]) .gc-codigo { margin: 0; padding: 10px 12px; border-radius: 8px; background: var(--q-surface-2); color: var(--q-text-1); border: 1px solid var(--q-border); font-size: var(--q3-fs-sm); white-space: pre-wrap; overflow-x: auto; }
:where(body[data-vista="guiacomponentes"]) .gc-bloqueo { padding: 12px 16px; border: 1px solid #fecaca; background: #fef2f2; color: #7f1d1d; border-radius: 10px; }
:where(body[data-vista="guiacomponentes"]) .gc-muestras { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
:where(body[data-vista="guiacomponentes"]) .gc-muestra { display: grid; grid-template-columns: 36px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 8px; border: 1px solid var(--q-border); border-radius: 8px; background: var(--q-surface); }
:where(body[data-vista="guiacomponentes"]) .gc-muestra small { grid-column: 2; color: var(--q-text-2); }
:where(body[data-vista="guiacomponentes"]) .gc-color { grid-row: 1 / span 2; width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--q-border); }
:where(body[data-vista="guiacomponentes"]) .gc-c-surface { background: var(--q-surface); }
:where(body[data-vista="guiacomponentes"]) .gc-c-surface-2 { background: var(--q-surface-2); }
:where(body[data-vista="guiacomponentes"]) .gc-c-text-1 { background: var(--q-text-1); }
:where(body[data-vista="guiacomponentes"]) .gc-c-text-2 { background: var(--q-text-2); }
:where(body[data-vista="guiacomponentes"]) .gc-c-border { background: var(--q-border); }
:where(body[data-vista="guiacomponentes"]) .gc-c-primary { background: var(--q-color-primary); }
:where(body[data-vista="guiacomponentes"]) .gc-reglas { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: var(--q3-fs-md); color: var(--q-text-1); }
body.dark-mode .gc-bloqueo { background: rgba(239,68,68,.15); border-color: #7f1d1d; color: #fecaca; }

/* ── accountspayables (core/app/view/accountspayables-view.php) ──────────────────────────────────────────── */
/* CXP-UI-001 · Cuentas por Pagar: TODAS las columnas centradas, cabecera y datos, en el
   resumen, el detalle y el historial de pagos. !important porque cada celda trae su
   propio text-align en linea. */
:where(body[data-vista="accountspayables"]) .cxp-table thead th, :where(body[data-vista="accountspayables"]) .cxp-table tbody td { text-align:center !important; vertical-align:middle; }
:where(body[data-vista="accountspayables"]) .cxp-table thead th { font-weight:700 !important; }
/* CXP-UI-002 · ventana de pagos de una compra. */
:where(body[data-vista="accountspayables"]) .cxp-md-prov { color:var(--q-text-2,var(--q3-texto-3, #475569)); font-size:var(--q3-fs-md); margin:-4px 0 12px; text-align:center; }
:where(body[data-vista="accountspayables"]) .cxp-md-resumen { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }
:where(body[data-vista="accountspayables"]) .cxp-md-resumen > div { background:var(--q-surface-2,var(--q3-fondo-3, #F1F5F9)); border-radius:10px; padding:10px 8px; text-align:center; }
:where(body[data-vista="accountspayables"]) .cxp-md-resumen span { display:block; font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.04em; color:var(--q-text-3,var(--q3-texto-4, #64748B)); }
:where(body[data-vista="accountspayables"]) .cxp-md-resumen b { font-size:var(--q3-fs-2xl); }
:where(body[data-vista="accountspayables"]) .cxp-md-resumen .cxp-md-debe b { color:#DC2626; }
:where(body[data-vista="accountspayables"]) .cxp-md-resumen .cxp-md-ok b { color:#16A34A; }
:where(body[data-vista="accountspayables"]) .cxp-md-sub { font-weight:700; margin:6px 0 8px; text-align:center; }
:where(body[data-vista="accountspayables"]) .cxp-md-vacio { text-align:center; color:var(--q-text-3,var(--q3-texto-4, #64748B)); margin:4px 0 14px; }
:where(body[data-vista="accountspayables"]) .cxp-md-nc { color:#DC2626; }
@media (max-width:576px) { :where(body[data-vista="accountspayables"]) .cxp-md-resumen { grid-template-columns:repeat(2,1fr); } }

:where(body[data-vista="accountspayables"]) .cxp-sf {display:flex;gap:12px;align-items:flex-start;background:#ecfdf5;border:1px solid #a7f3d0;border-left:6px solid #16a34a;border-radius:8px;padding:10px 14px;margin:6px 0 12px;font-size:var(--q3-fs-md);color:#14532d}
            		:where(body[data-vista="accountspayables"]) .cxp-sf > .bi {font-size:var(--q3-fs-3xl);color:#16a34a}
            		:where(body[data-vista="accountspayables"]) .cxp-sf ul {margin:6px 0 0;padding-left:18px}
            		:where(body[data-vista="accountspayables"]) .cxp-sf a {font-weight:700}

/* ── bajasunat (core/app/view/bajasunat-view.php) ─────────────────────────────────────────────────── */
:where(body[data-vista="bajasunat"]) .sb-tabla td { vertical-align: middle; }
    :where(body[data-vista="bajasunat"]) .sb-tabla .sb-1l { white-space: nowrap; }
    :where(body[data-vista="bajasunat"]) .sb-tabla td.sb-msg { white-space: normal !important; min-width: 240px; max-width: 380px; word-break: break-word; }
    :where(body[data-vista="bajasunat"]) .sb-tabla td.sb-1l { white-space: nowrap !important; }

/* ── barcodes (core/app/view/barcodes-view.php) ──────────────────────────────────────────────────── */
/* ── Pantalla ── */
:where(body[data-vista="barcodes"]) .etq-wrap { font-family:var(--q-font-family); color:#14182b; display:flex; flex-direction:column; gap:16px; }
:where(body[data-vista="barcodes"]) .etq-top { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; background:#16246e; color:#fff; border-radius:12px; padding:12px 18px; }
:where(body[data-vista="barcodes"]) .etq-top h3 { margin:0; font-family:var(--q-font-family); font-weight:800; font-size:var(--q3-fs-4xl); letter-spacing:.02em; }
:where(body[data-vista="barcodes"]) .etq-pasos { margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:8px; font-size:var(--q3-fs-lg); font-weight:600; }
:where(body[data-vista="barcodes"]) .etq-pasos li { background:rgba(255,255,255,.16); border-radius:999px; padding:5px 14px; }
:where(body[data-vista="barcodes"]) .etq-grid { display:flex; flex-wrap:wrap; gap:16px; align-items:flex-start; }
:where(body[data-vista="barcodes"]) .etq-main { flex:999 1 620px; min-width:0; display:flex; flex-direction:column; gap:16px; }
:where(body[data-vista="barcodes"]) .etq-side { flex:1 1 380px; min-width:0; position:sticky; top:72px; }
:where(body[data-vista="barcodes"]) .etq-card { background:var(--q3-fondo, #fff); border-radius:14px; padding:16px 18px; box-shadow:0 1px 3px rgba(20,24,43,.08); display:flex; flex-direction:column; gap:12px; }
:where(body[data-vista="barcodes"]) .etq-card h4 { margin:0; font-size:var(--q3-fs-2xl); font-weight:700; }
:where(body[data-vista="barcodes"]) .etq-fila { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; }
:where(body[data-vista="barcodes"]) .etq-campo { display:flex; flex-direction:column; gap:4px; }
:where(body[data-vista="barcodes"]) .etq-campo > label { font-size:var(--q3-fs-md); font-weight:600; color:#3a4060; margin:0; }
:where(body[data-vista="barcodes"]) #bcBuscar { height:44px; border:2px solid #16246e; border-radius:10px; padding:0 14px; font-size:var(--q3-fs-xl); }
:where(body[data-vista="barcodes"]) .etq-chip { height:38px; border:1px solid #b6bdd6; border-radius:999px; padding:0 16px; background:#fff; color:#16246e; font-weight:600; font-size:var(--q3-fs-lg); display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
:where(body[data-vista="barcodes"]) .etq-chip b { background:#16246e; color:#fff; border-radius:999px; padding:1px 8px; font-size:var(--q3-fs-sm); }
:where(body[data-vista="barcodes"]) .etq-chip:hover { background:#eef0f8; }
:where(body[data-vista="barcodes"]) .etq-aviso { margin:0; padding:10px 14px; border-radius:8px; background:#eff6ff; border:1px solid #93c5fd; color:#1e3a8a; font-size:var(--q3-fs-lg); }
:where(body[data-vista="barcodes"]) .etq-res { border:1px solid #e3e6ee; border-radius:10px; max-height:300px; overflow:auto; }
:where(body[data-vista="barcodes"]) .etq-res-fila { display:flex; align-items:center; gap:12px; padding:9px 14px; border-top:1px solid #e3e6ee; }
:where(body[data-vista="barcodes"]) .etq-res-fila:first-child { border-top:0; }
:where(body[data-vista="barcodes"]) .etq-res-fila .etq-res-txt { flex:1 1 0; min-width:0; }
:where(body[data-vista="barcodes"]) .etq-res-fila .etq-res-txt b { font-size:var(--q3-fs-lg); }
:where(body[data-vista="barcodes"]) .etq-res-fila .etq-res-txt div { font-size:var(--q3-fs-sm); color:#4a5070; }
:where(body[data-vista="barcodes"]) .etq-enlista { background:#e6f4ec; color:#0b5e2f; border-radius:999px; padding:3px 10px; font-size:var(--q3-fs-sm); font-weight:700; white-space:nowrap; }
:where(body[data-vista="barcodes"]) .etq-pie { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
:where(body[data-vista="barcodes"]) .etq-pie .etq-total { font-weight:700; margin-right:auto; }
:where(body[data-vista="barcodes"]) .bc-tabla th, :where(body[data-vista="barcodes"]) .bc-tabla td { text-align:center !important; vertical-align:middle !important; }
:where(body[data-vista="barcodes"]) .bc-num-in { width:84px !important; display:inline-block !important; text-align:center; }
:where(body[data-vista="barcodes"]) .etq-cant { display:inline-flex; align-items:center; gap:4px; }
:where(body[data-vista="barcodes"]) .etq-cant button { width:30px; height:30px; border:1px solid #c9cdd9; border-radius:8px; background:var(--q3-fondo, #fff); font-weight:700; font-size:var(--q3-fs-xl); line-height:1; }
:where(body[data-vista="barcodes"]) .etq-cant input { width:52px !important; height:30px; text-align:center; border:1px solid #c9cdd9; border-radius:8px; }
:where(body[data-vista="barcodes"]) .etq-sinprecio { display:block; font-size:var(--q3-fs-sm); font-weight:600; color:#a3161a; }
:where(body[data-vista="barcodes"]) .etq-formatos { display:flex; flex-direction:column; gap:8px; }
:where(body[data-vista="barcodes"]) .etq-formato { display:flex; align-items:center; gap:10px; border:1px solid #c9cdd9; border-radius:10px; padding:9px 12px; cursor:pointer; margin:0; font-weight:500; }
:where(body[data-vista="barcodes"]) .etq-formato.sel { border:2px solid #16246e; background:#f5f6fb; }
:where(body[data-vista="barcodes"].dark-mode) .etq-formato.sel { border-color: #7C8CE0; background: rgba(99,115,214,.20); }
:where(body[data-vista="barcodes"]) .etq-formato span b { font-size:var(--q3-fs-lg); }
:where(body[data-vista="barcodes"]) .etq-formato span small { display:block; font-size:var(--q3-fs-sm); color:#4a5070; }
:where(body[data-vista="barcodes"]) .etq-opc { display:flex; flex-wrap:wrap; gap:6px 16px; font-size:var(--q3-fs-lg); }
:where(body[data-vista="barcodes"]) .etq-opc label { margin:0; font-weight:500; display:inline-flex; align-items:center; gap:6px; }
:where(body[data-vista="barcodes"]) .etq-opc select, :where(body[data-vista="barcodes"]) .etq-opc input[type=date] { height:32px; border:1px solid #c9cdd9; border-radius:8px; padding:0 8px; }
:where(body[data-vista="barcodes"]) .etq-vista-cab { display:flex; justify-content:space-between; font-size:var(--q3-fs-md); font-weight:700; color:#3a4060; }
:where(body[data-vista="barcodes"]) #bcPreview { background:#e9ebf1; border-radius:10px; padding:12px; max-height:520px; overflow:auto; display:flex; justify-content:center; align-items:flex-start; }
:where(body[data-vista="barcodes"]) .bc-hint { color:#64708a; font-size:var(--q3-fs-lg); padding:30px 12px; text-align:center; }
:where(body[data-vista="barcodes"]) #bcBtnImprimir { width:100%; height:52px; font-size:var(--q3-fs-xl) !important; justify-content:center; }

/* ── Hojas (medidas reales en mm: lo que se ve es lo que se imprime) ── */
:where(body[data-vista="barcodes"]) .etq-sheet { --etq-color:#16246e; display:flex; flex-direction:column; gap:14px; align-items:center; }
/* medio milímetro menos que el papel: si la hoja mide justo la página, el redondeo
   del navegador la parte en dos y salen páginas en blanco */
:where(body[data-vista="barcodes"]) .etq-page { background:#fff; box-sizing:border-box; box-shadow:0 2px 8px rgba(20,24,43,.18); overflow:hidden; flex-shrink:0; }   /* sin esto la vista aplastaba las hojas para que cupieran */
:where(body[data-vista="barcodes"]) .etq-a4 { width:210mm; height:296.5mm; display:grid; align-content:start; }
/* Ticketera: rollo continuo, un ticket debajo de otro con línea de corte. No se fija el alto
   de página: cada ticketera tiene el suyo y, si es más bajo que el ticket, lo corta arriba. */
:where(body[data-vista="barcodes"]) .etq-roll { width:80mm; padding:1.5mm 4mm; border-bottom:.3mm dashed #000; display:flex; justify-content:center; break-inside:avoid; page-break-inside:avoid; }
:where(body[data-vista="barcodes"]) .etq-sheet.es-rollo { gap:0; }
:where(body[data-vista="barcodes"]) .etq-lbl { box-sizing:border-box; overflow:hidden; position:relative; font-family:Barlow,'Source Sans Pro',sans-serif; color:#14182b; background:#fff;
          -webkit-print-color-adjust:exact; print-color-adjust:exact; }
:where(body[data-vista="barcodes"]) .etq-marca { font-size:2.6mm; font-weight:700; letter-spacing:.12em; color:var(--etq-color); text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex-shrink:0; }
:where(body[data-vista="barcodes"]) .etq-nombre { font-family:var(--q-font-family); font-weight:700; line-height:1.05; text-transform:uppercase; overflow:hidden; flex-shrink:0; }
:where(body[data-vista="barcodes"]) .etq-barra { display:flex; flex-direction:column; gap:.3mm; }
:where(body[data-vista="barcodes"]) .etq-barra svg { display:block; width:100%; flex:1 1 auto; }
:where(body[data-vista="barcodes"]) .etq-dig { font-size:2.3mm; font-weight:600; letter-spacing:.12em; text-align:center; line-height:1; }
:where(body[data-vista="barcodes"]) .etq-precio { display:flex; align-items:flex-start; font-family:var(--q-font-family); font-weight:800; line-height:.8; color:var(--etq-color); white-space:nowrap; }
:where(body[data-vista="barcodes"]) .etq-precio .s { font-size:3.6mm; margin:1.1mm .5mm 0 0; }
:where(body[data-vista="barcodes"]) .etq-precio .d { font-size:.42em; margin-top:.07em; }
:where(body[data-vista="barcodes"]) .etq-antes { font-size:2.9mm; font-weight:700; color:#3a4060; text-decoration:line-through; text-decoration-thickness:.45mm; white-space:nowrap; }
:where(body[data-vista="barcodes"]) .etq-may { font-size:2.5mm; font-weight:700; color:#3a4060; white-space:nowrap; }
:where(body[data-vista="barcodes"]) .etq-tag { background:#c81e1e; color:#fff; font-size:2.5mm; font-weight:700; letter-spacing:.1em; border-radius:1mm; padding:.2mm 1.6mm; }
:where(body[data-vista="barcodes"]) .etq-of .etq-precio { color:#c81e1e; }
:where(body[data-vista="barcodes"]) .etq-sheet.sin-digitos .etq-dig { display:none; }
/* Guías de corte: una escuadra de 3 mm en cada esquina de la etiqueta. La tira C lleva la
   línea completa (se corta con guillotina); el ticket no lleva (lo corta la ticketera). */
:where(body[data-vista="barcodes"]) .etq-sheet.con-guias .etq-lbl:not(.etq-C):not(.etq-E)::after { content:""; position:absolute; inset:0; pointer-events:none;
    --g:#8a90a6; --l:3mm; --t:.25mm;
    background:
        linear-gradient(var(--g),var(--g)) left top / var(--l) var(--t) no-repeat,
        linear-gradient(var(--g),var(--g)) left top / var(--t) var(--l) no-repeat,
        linear-gradient(var(--g),var(--g)) right top / var(--l) var(--t) no-repeat,
        linear-gradient(var(--g),var(--g)) right top / var(--t) var(--l) no-repeat,
        linear-gradient(var(--g),var(--g)) left bottom / var(--l) var(--t) no-repeat,
        linear-gradient(var(--g),var(--g)) left bottom / var(--t) var(--l) no-repeat,
        linear-gradient(var(--g),var(--g)) right bottom / var(--l) var(--t) no-repeat,
        linear-gradient(var(--g),var(--g)) right bottom / var(--t) var(--l) no-repeat; }
:where(body[data-vista="barcodes"]) .etq-sheet.con-guias .etq-C { outline:.2mm dashed #8a90a6; outline-offset:-.1mm; }
:where(body[data-vista="barcodes"]) .etq-sheet.sin-marca .etq-marca { visibility:hidden; }

/* A · Clásica 63,5 × 38,1 */
:where(body[data-vista="barcodes"]) .etq-A { padding:2mm 2.5mm; display:flex; flex-direction:column; gap:.6mm; }
:where(body[data-vista="barcodes"]) .etq-A .etq-cab { display:flex; justify-content:space-between; align-items:center; gap:2mm; }
:where(body[data-vista="barcodes"]) .etq-A .etq-nombre { font-size:4.3mm; max-height:9.2mm; }
:where(body[data-vista="barcodes"]) .etq-A .etq-pie { flex:1 1 auto; min-height:0; display:flex; align-items:stretch; gap:2mm; margin-top:.6mm; }
:where(body[data-vista="barcodes"]) .etq-A .etq-barra { width:29mm; min-height:10mm; }
:where(body[data-vista="barcodes"]) .etq-A .etq-der { margin-left:auto; align-self:center; display:flex; flex-direction:column; align-items:flex-end; gap:.4mm; }
:where(body[data-vista="barcodes"]) .etq-A.etq-np .etq-nombre { font-size:5mm; max-height:16mm; }
:where(body[data-vista="barcodes"]) .etq-A.etq-np .etq-barra { width:42mm; flex:1 1 auto; min-height:10mm; margin:.6mm auto 0; }

/* B · Horizontal 99,1 × 38,1 */
:where(body[data-vista="barcodes"]) .etq-B { display:flex; }
:where(body[data-vista="barcodes"]) .etq-B .etq-izq { flex:1 1 0; min-width:0; padding:2.2mm 2.5mm; display:flex; flex-direction:column; gap:.6mm; }
:where(body[data-vista="barcodes"]) .etq-B .etq-nombre { font-size:4.6mm; max-height:9.8mm; }
:where(body[data-vista="barcodes"]) .etq-B .etq-barra { width:100%; flex:1 1 auto; min-height:9mm; margin-top:.6mm; }
/* El panel no toca el borde: si la hoja se corre al imprimir no sale una franja de color
   en la etiqueta vecina, y las guías de corte de las esquinas se ven sobre blanco. */
:where(body[data-vista="barcodes"]) .etq-B .etq-panel { width:33mm; margin:1.6mm 1.6mm 1.6mm 0; border-radius:1.2mm; background:var(--etq-color); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.8mm; }
:where(body[data-vista="barcodes"]) .etq-B .etq-panel .etq-precio, :where(body[data-vista="barcodes"]) .etq-B .etq-panel .etq-antes, :where(body[data-vista="barcodes"]) .etq-B .etq-panel .etq-may { color:#fff; }
:where(body[data-vista="barcodes"]) .etq-B .etq-plbl { font-size:2.6mm; font-weight:700; letter-spacing:.16em; }
:where(body[data-vista="barcodes"]) .etq-B.etq-of .etq-panel { background:#c81e1e; }
:where(body[data-vista="barcodes"]) .etq-B.etq-np .etq-nombre { font-size:5.6mm; max-height:22mm; }
:where(body[data-vista="barcodes"]) .etq-B .etq-barra-np { width:40mm; padding:0 3mm 0 0; display:flex; flex-direction:column; justify-content:center; }
:where(body[data-vista="barcodes"]) .etq-B .etq-barra-np .etq-barra { width:100%; flex:0 0 auto; height:24mm; margin:0; }

/* C · Tira de góndola 100 × 30 (se corta con guillotina) */
:where(body[data-vista="barcodes"]) .etq-C { display:flex; }
:where(body[data-vista="barcodes"]) .etq-C .etq-franja { width:1.6mm; background:var(--etq-color); }
:where(body[data-vista="barcodes"]) .etq-C.etq-of .etq-franja { width:5.5mm; background:#c81e1e; color:#fff; display:flex; align-items:center; justify-content:center; }
:where(body[data-vista="barcodes"]) .etq-C.etq-of .etq-franja span { transform:rotate(-90deg); font-size:2.6mm; font-weight:800; letter-spacing:.16em; white-space:nowrap; }
:where(body[data-vista="barcodes"]) .etq-C .etq-izq { flex:1 1 0; min-width:0; padding:1.8mm 2.5mm; display:flex; flex-direction:column; gap:.4mm; }
:where(body[data-vista="barcodes"]) .etq-C .etq-nombre { font-size:4.3mm; max-height:9.1mm; }
:where(body[data-vista="barcodes"]) .etq-C .etq-barra { width:100%; flex:1 1 auto; min-height:6mm; margin-top:.4mm; }
:where(body[data-vista="barcodes"]) .etq-C .etq-der { width:34.5mm; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.6mm; }
:where(body[data-vista="barcodes"]) .etq-C.etq-np .etq-nombre { font-size:5.2mm; max-height:22mm; }
:where(body[data-vista="barcodes"]) .etq-C .etq-barra-np { width:37mm; padding-right:2.5mm; display:flex; flex-direction:column; justify-content:center; }
:where(body[data-vista="barcodes"]) .etq-C .etq-barra-np .etq-barra { width:100%; flex:0 0 auto; height:19mm; margin:0; }

/* D · Cartel de oferta 99,1 × 67,7 */
:where(body[data-vista="barcodes"]) .etq-D { background:#ffd60a; display:flex; flex-direction:column; }
:where(body[data-vista="barcodes"]) .etq-D .etq-banda { background:#c81e1e; color:#fff; padding:1.5mm 3.5mm; display:flex; justify-content:space-between; align-items:center; }
:where(body[data-vista="barcodes"]) .etq-D:not(.etq-of) .etq-banda { background:var(--etq-color); }
:where(body[data-vista="barcodes"]) .etq-D .etq-banda b { font-family:'Barlow Condensed','Arial Narrow',sans-serif; font-weight:800; font-size:8.5mm; line-height:1; letter-spacing:.04em; }
:where(body[data-vista="barcodes"]) .etq-D .etq-banda span { font-size:3.2mm; font-weight:700; }
:where(body[data-vista="barcodes"]) .etq-D .etq-cuerpo { flex:1 1 auto; padding:2mm 3.5mm 2.5mm; display:flex; flex-direction:column; gap:1mm; }
:where(body[data-vista="barcodes"]) .etq-D .etq-marca { color:#14182b; }
:where(body[data-vista="barcodes"]) .etq-D .etq-nombre { font-size:6.4mm; max-height:20.5mm; }
:where(body[data-vista="barcodes"]) .etq-D .etq-pie { margin-top:auto; display:flex; align-items:flex-end; justify-content:space-between; gap:2mm; }
:where(body[data-vista="barcodes"]) .etq-D .etq-ahorro { background:#14182b; color:#ffd60a; font-size:3.4mm; font-weight:700; border-radius:1mm; padding:.6mm 2mm; align-self:flex-start; }
:where(body[data-vista="barcodes"]) .etq-D .etq-antes { font-size:3.8mm; color:#14182b; }
:where(body[data-vista="barcodes"]) .etq-D .etq-precio .s { font-size:5mm; margin-top:2mm; }
/* En el cartel la barra va sobre blanco: el amarillo baja el contraste (y en una impresora
   en blanco y negro sale gris) y las pistolas no la leían. */
:where(body[data-vista="barcodes"]) .etq-D .etq-barra { width:50mm; height:17mm; background:#fff; border-radius:.8mm; padding:1mm 0 .6mm; box-sizing:border-box; }
:where(body[data-vista="barcodes"]) .etq-D .etq-pct { font-family:'Barlow Condensed','Arial Narrow',sans-serif; font-weight:800; font-size:15mm; line-height:.9; color:#c81e1e; }
:where(body[data-vista="barcodes"]) .etq-D.etq-np .etq-nombre { font-size:7.5mm; max-height:24mm; }
:where(body[data-vista="barcodes"]) .etq-D.etq-np .etq-barra { width:66mm; height:auto; flex:1 1 auto; min-height:22mm; margin:1mm auto 0; }

/* E · Ticketera 72 × 40, blanco y negro */
:where(body[data-vista="barcodes"]) .etq-E { padding:1.6mm 2mm; display:flex; flex-direction:column; gap:.6mm; color:#000; }
:where(body[data-vista="barcodes"]) .etq-E .etq-cab { display:flex; justify-content:space-between; align-items:center; border-bottom:.5mm solid #000; padding-bottom:.6mm; }
:where(body[data-vista="barcodes"]) .etq-E .etq-marca { color:#000; font-weight:800; font-size:2.8mm; }
:where(body[data-vista="barcodes"]) .etq-E .etq-tag { background:none; color:#000; border:.5mm solid #000; border-radius:0; }
:where(body[data-vista="barcodes"]) .etq-E .etq-nombre { font-size:4.4mm; max-height:9.3mm; }
:where(body[data-vista="barcodes"]) .etq-E .etq-pie { flex:1 1 auto; min-height:0; display:flex; align-items:stretch; gap:2mm; margin-top:.6mm; }
:where(body[data-vista="barcodes"]) .etq-E .etq-barra { width:40mm; min-height:9mm; }
:where(body[data-vista="barcodes"]) .etq-E .etq-der { margin-left:auto; align-self:center; display:flex; flex-direction:column; align-items:flex-end; gap:.4mm; }
:where(body[data-vista="barcodes"]) .etq-E .etq-precio, :where(body[data-vista="barcodes"]) .etq-E.etq-of .etq-precio, :where(body[data-vista="barcodes"]) .etq-E .etq-antes, :where(body[data-vista="barcodes"]) .etq-E .etq-may { color:#000; }
:where(body[data-vista="barcodes"]) .etq-E.etq-np .etq-nombre { font-size:5mm; max-height:16mm; }
:where(body[data-vista="barcodes"]) .etq-E.etq-np .etq-barra { width:46mm; flex:1 1 auto; min-height:10mm; margin:.6mm auto 0; }

/* ── Impresión: solo las hojas, a tamaño real ──
   Al imprimir, la hoja se copia a #bcPrintArea, hijo directo de <body>, y todo lo demás
   se quita del flujo: así la hoja empieza en la esquina del papel (el menú y los
   paneles corrían las etiquetas) y no salen páginas en blanco de más. */
:where(body[data-vista="barcodes"]) #bcPrintArea { display:none; }
@media print {
    :where(body[data-vista="barcodes"]), :where(body[data-vista="barcodes"]) { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; margin:0 !important; padding:0 !important; }
    :where(body[data-vista="barcodes"]) > *:not(#bcPrintArea) { display:none !important; }
    :where(body[data-vista="barcodes"]) #bcPrintArea { display:block !important; }
    :where(body[data-vista="barcodes"]) #bcPrintArea .etq-sheet { zoom:1 !important; gap:0 !important; display:block !important; }
    :where(body[data-vista="barcodes"]) .etq-page { box-shadow:none !important; break-after:page; page-break-after:always; }
    :where(body[data-vista="barcodes"]) .etq-page:last-child { break-after:auto; page-break-after:auto; }
    :where(body[data-vista="barcodes"]) #bcPrintArea .etq-roll { break-after:auto !important; page-break-after:auto !important; }
}

@page { size:A4; margin:0; }

/* ── boxs (core/app/view/boxs-view.php) ──────────────────────────────────────────────────────── */
/* Cajas (UX): todas las columnas centradas + acciones compactas ("solo lo necesario"). */
							:where(body[data-vista="boxs"]) #tablaCajas th, :where(body[data-vista="boxs"]) #tablaCajas td { text-align:center !important; vertical-align:middle !important; }
							:where(body[data-vista="boxs"]) #tablaCajas td .q-btn--s { height:26px; min-width:0; padding:0 9px; font-size:var(--q3-fs-xs); gap:5px; border-radius:6px; margin:2px 3px; }
							:where(body[data-vista="boxs"]) #tablaCajas td .q-btn--s .bi { margin:0; }
							/* Distribución de anchos: Acciones -30% de su ancho, repartido a las demás columnas. */
							:where(body[data-vista="boxs"]) #tablaCajas { table-layout:fixed; width:100%; }
							:where(body[data-vista="boxs"]) #tablaCajas th:nth-child(1), :where(body[data-vista="boxs"]) #tablaCajas td:nth-child(1) { width:13.7%; }
							:where(body[data-vista="boxs"]) #tablaCajas th:nth-child(2), :where(body[data-vista="boxs"]) #tablaCajas td:nth-child(2) { width:12.2%; }
							:where(body[data-vista="boxs"]) #tablaCajas th:nth-child(3), :where(body[data-vista="boxs"]) #tablaCajas td:nth-child(3) { width:17.2%; }
							:where(body[data-vista="boxs"]) #tablaCajas th:nth-child(4), :where(body[data-vista="boxs"]) #tablaCajas td:nth-child(4) { width:19.1%; }
							:where(body[data-vista="boxs"]) #tablaCajas th:nth-child(5), :where(body[data-vista="boxs"]) #tablaCajas td:nth-child(5) { width:37.8%; white-space:normal !important; }

/* ── changepassword (core/app/view/changepassword-view.php) ────────────────────────────────────────────── */
:where(body[data-vista="changepassword"]) .cp-panel { max-width:620px; margin:0 auto; }
				:where(body[data-vista="changepassword"]) .cp-aviso { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border-radius:10px; background:#fffbeb; border:1px solid #fde68a; color:#78350f; font-size:var(--q3-fs-md); margin-bottom:14px; }
				:where(body[data-vista="changepassword"]) .cp-aviso > em { font-size:var(--q3-fs-2xl); color:#b45309; }
				:where(body[data-vista="changepassword"]) .cp-aviso--info { background:#eff6ff; border-color:#bfdbfe; color:#1e3a8a; } :where(body[data-vista="changepassword"]) .cp-aviso--info > em { color:#1d4ed8; }
				:where(body[data-vista="changepassword"]) .cp-quien { display:flex; gap:10px; align-items:center; margin-bottom:14px; }
				:where(body[data-vista="changepassword"]) .cp-av { width:38px; height:38px; border-radius:50%; background:#1e3a8a; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; }
				:where(body[data-vista="changepassword"]) .cp-quien small { display:block; color:var(--q3-texto-4, #64748b); }
				:where(body[data-vista="changepassword"]) .cp-campos { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
				:where(body[data-vista="changepassword"]) .cp-in { position:relative; } :where(body[data-vista="changepassword"]) .cp-in .q-input { padding-right:38px; }
				:where(body[data-vista="changepassword"]) .cp-ver { position:absolute; right:6px; top:50%; transform:translateY(-50%); border:0; background:none; color:var(--q3-texto-4, #64748b); }
				:where(body[data-vista="changepassword"]) .cp-reglas { list-style:none; padding:0; margin:12px 0 4px; display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); }
				:where(body[data-vista="changepassword"]) .cp-reglas li::before { content:"○ "; } :where(body[data-vista="changepassword"]) .cp-reglas li.is-ok { color:#15803d; font-weight:600; } :where(body[data-vista="changepassword"]) .cp-reglas li.is-ok::before { content:"✓ "; }
				:where(body[data-vista="changepassword"]) .cp-tip { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); margin:6px 0 0; }
				:where(body[data-vista="changepassword"]) .cp-acc { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
				@media (max-width: 575px){ :where(body[data-vista="changepassword"]) .cp-campos, :where(body[data-vista="changepassword"]) .cp-reglas { grid-template-columns:1fr; } }

/* ── cierrealquiler (core/app/view/cierrealquiler-view.php) ────────────────────────────────────────────── */
:where(body[data-vista="cierrealquiler"]) .ci { padding:18px 22px 36px; background:#F7F9FC; }
:where(body[data-vista="cierrealquiler"]) .ci-card { background:var(--q3-fondo, #fff); border:1px solid #EDF2F7; border-radius:16px; box-shadow:0 6px 18px rgba(15,23,42,.05); padding:20px; max-width:720px; margin:0 auto 16px; }
:where(body[data-vista="cierrealquiler"]) .ci-q { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748B); margin-bottom:4px; }
:where(body[data-vista="cierrealquiler"]) .ci-h { font-size:var(--q3-fs-2xl); font-weight:800; color:var(--q3-texto-1, #1E293B); margin-bottom:4px; }
:where(body[data-vista="cierrealquiler"]) .ci-sub { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748B); margin-bottom:16px; }
:where(body[data-vista="cierrealquiler"]) .ci-progress { display:flex; gap:6px; margin-bottom:18px; }
:where(body[data-vista="cierrealquiler"]) .ci-progress .dot { flex:1; height:6px; border-radius:99px; background:#E2E8F0; }
:where(body[data-vista="cierrealquiler"]) .ci-progress .dot.on { background:#0D9488; }
:where(body[data-vista="cierrealquiler"]) .ci-step { display:none; }
:where(body[data-vista="cierrealquiler"]) .ci-step.active { display:block; }
:where(body[data-vista="cierrealquiler"]) .ci-ask { font-size:var(--q3-fs-xl); font-weight:800; color:var(--q3-texto-1, #1E293B); margin:6px 0 12px; }
:where(body[data-vista="cierrealquiler"]) .ci-radio label { font-size:var(--q3-fs-lg); font-weight:600; color:var(--q3-texto-2, #334155); margin-right:20px; cursor:pointer; }
:where(body[data-vista="cierrealquiler"]) .ci-extra { margin-top:14px; padding:14px; background:var(--q3-fondo-2, #F8FAFC); border:1px solid #EDF2F7; border-radius:10px; }
:where(body[data-vista="cierrealquiler"]) .ci-input { height:36px; border:1px solid var(--q3-borde, #E2E8F0); border-radius:8px; padding:0 10px; font-size:var(--q3-fs-md); }
:where(body[data-vista="cierrealquiler"]) .ci-table { width:100%; border-collapse:collapse; }
:where(body[data-vista="cierrealquiler"]) .ci-table th { font-size:var(--q3-fs-2xs); text-transform:uppercase; color:var(--q3-texto-5, #94A3B8); text-align:left; padding:7px; border-bottom:1px solid #F1F5F9; }
:where(body[data-vista="cierrealquiler"]) .ci-table td { font-size:var(--q3-fs-sm); padding:7px; border-bottom:1px solid #F5F7FA; vertical-align:top; }
:where(body[data-vista="cierrealquiler"]) .ci-nr { margin-top:8px; padding:10px; background:#FFF7ED; border:1px solid #FED7AA; border-radius:8px; display:none; }
:where(body[data-vista="cierrealquiler"]) .ci-nr.show { display:block; }
:where(body[data-vista="cierrealquiler"]) .ci-nr .ct { font-size:var(--q3-fs-xs); font-weight:800; color:#C2410C; text-transform:uppercase; margin-bottom:6px; }
:where(body[data-vista="cierrealquiler"]) .ci-sum { margin-top:8px; }
:where(body[data-vista="cierrealquiler"]) .ci-row { display:flex; justify-content:space-between; font-size:var(--q3-fs-md); padding:6px 0; }
:where(body[data-vista="cierrealquiler"]) .ci-row.t { font-size:var(--q3-fs-2xl); font-weight:800; color:var(--q3-texto-1, #1E293B); border-top:1px dashed var(--q3-borde, #E2E8F0); margin-top:6px; padding-top:10px; }
:where(body[data-vista="cierrealquiler"]) .ci-row .red { color:#DC2626; font-weight:800; }
:where(body[data-vista="cierrealquiler"]) .ci-cobro { margin-top:14px; padding-top:12px; border-top:1px solid #F1F5F9; }
:where(body[data-vista="cierrealquiler"]) .ci-actions { display:flex; justify-content:space-between; margin-top:20px; }
:where(body[data-vista="cierrealquiler"]) .ci-btn { padding:12px 22px; border-radius:12px; font-weight:800; border:none; cursor:pointer; font-size:var(--q3-fs-lg); }
:where(body[data-vista="cierrealquiler"]) .ci-btn--main { background:linear-gradient(135deg,#0D9488,#0F766E); color:#fff; }
:where(body[data-vista="cierrealquiler"]) .ci-btn--ghost { background:var(--q3-fondo, #fff); border:1px solid var(--q3-borde, #E2E8F0); color:var(--q3-texto-4, #64748B); text-decoration:none; }

/* ── clienthistory (core/app/view/clienthistory-view.php) ─────────────────────────────────────────────── */
/* Estilos locales de la Ficha 360 (BLG-24). Complementan el design system q-*, no lo reemplazan. */
:where(body[data-vista="clienthistory"]) .f360-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; }
:where(body[data-vista="clienthistory"]) .f360-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin-top:4px; align-items:stretch; }
/* Tarjetas con relieve (sombra), contenido centrado y alineado (igual altura + centrado vertical). */
:where(body[data-vista="clienthistory"]) .f360-kpi { background:var(--q-surface,var(--q3-fondo, #fff)); border:1px solid var(--q-border,#e3e7ee); border-radius:10px; padding:14px 16px; text-align:center; box-shadow:0 2px 6px rgba(0,0,0,.10); transition:box-shadow .15s ease, transform .15s ease; display:flex; flex-direction:column; justify-content:center; align-items:center; }
:where(body[data-vista="clienthistory"]) .f360-kpi:hover { box-shadow:0 4px 12px rgba(0,0,0,.14); transform:translateY(-1px); }
/* Títulos en negrita; números en peso normal. */
:where(body[data-vista="clienthistory"]) .f360-kpi .lbl { font-size:var(--q3-fs-sm); text-transform:uppercase; letter-spacing:.03em; color:var(--q-muted,#7a8699); font-weight:700; }
:where(body[data-vista="clienthistory"]) .f360-kpi .val { font-size:var(--q3-fs-3xl); font-weight:400; margin-top:4px; color:var(--q-text,#243244); }
:where(body[data-vista="clienthistory"]) .f360-kpi.f360-alert .val { color:#c0392b; }
/* Color según importancia, en tonos suaves (categoría, no alarma). */
:where(body[data-vista="clienthistory"]) .f360-kpi--info { background:#eef4fd; border-color:#cfe0fa; }
:where(body[data-vista="clienthistory"]) .f360-kpi--ok { background:#eefaf1; border-color:#c7ead4; }
:where(body[data-vista="clienthistory"]) .f360-kpi--warn { background:#fff7e6; border-color:#ffe1a6; }
:where(body[data-vista="clienthistory"]) .f360-kpi--danger { background:#fdecea; border-color:#f6c9c3; }
/* Campos de identidad centrados y en negrita. */
:where(body[data-vista="clienthistory"]) .f360-id-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px 24px; }
:where(body[data-vista="clienthistory"]) .f360-id-grid .cell { text-align:center; }
:where(body[data-vista="clienthistory"]) .f360-id-grid .cell .k { font-size:var(--q3-fs-sm); color:var(--q-muted,#7a8699); text-transform:uppercase; font-weight:700; }
:where(body[data-vista="clienthistory"]) .f360-id-grid .cell .v { font-size:var(--q3-fs-lg); font-weight:700; color:var(--q-text,#243244); }
:where(body[data-vista="clienthistory"]) .f360-signo-pos { color:#1e7e34; font-weight:700; }
:where(body[data-vista="clienthistory"]) .f360-signo-neg { color:#c0392b; font-weight:700; }
:where(body[data-vista="clienthistory"]) .f360-badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:var(--q3-fs-xs); font-weight:700; }
:where(body[data-vista="clienthistory"]) .f360-badge.ok { background:#e6f4ea; color:#1e7e34; }
:where(body[data-vista="clienthistory"]) .f360-badge.warn { background:#fdecea; color:#c0392b; }
:where(body[data-vista="clienthistory"]) .f360-badge.mut { background:#eef1f5; color:#7a8699; }
:where(body[data-vista="clienthistory"]) .f360-section-title { margin:0 0 2px; font-size:var(--q3-fs-sm); text-transform:uppercase; letter-spacing:.04em; color:#7a8699; }
/* Tablas de la Ficha 360: columnas centradas; cabeceras en negrita, contenido en peso normal. */
:where(body[data-vista="clienthistory"]) .f360-table th, :where(body[data-vista="clienthistory"]) .f360-table td { text-align:center !important; vertical-align:middle; }
:where(body[data-vista="clienthistory"]) .f360-table th { font-weight:700 !important; }
:where(body[data-vista="clienthistory"]) .f360-table td { font-weight:400 !important; }
/* Los badges de estado conservan su énfasis propio aunque la celda sea de peso normal. */
:where(body[data-vista="clienthistory"]) .f360-table td .f360-badge { font-weight:700 !important; }

/* ── consignacion (core/app/view/consignacion-view.php) ──────────────────────────────────────────────── */
:where(body[data-vista="consignacion"]) .csa {max-width:960px;margin:0 auto}
:where(body[data-vista="consignacion"]) .csa-barra {display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
:where(body[data-vista="consignacion"]) .csa-barra .csa-esp {flex:1}
:where(body[data-vista="consignacion"]) .csa-hoja {background:var(--q3-fondo, #fff);border:1px solid var(--q3-borde, #e2e8f0);border-radius:12px;box-shadow:0 4px 18px rgba(15,23,42,.07);padding:32px 36px;color:var(--q3-texto-1, #1e293b)}
:where(body[data-vista="consignacion"]) .csa-cab {display:grid;grid-template-columns:1fr 250px;gap:24px;align-items:center;padding-bottom:20px;border-bottom:3px solid #1f3b73}
:where(body[data-vista="consignacion"]) .csa-emp {display:flex;gap:16px;align-items:center}
:where(body[data-vista="consignacion"]) .csa-emp img {max-width:130px;max-height:70px;object-fit:contain}
:where(body[data-vista="consignacion"]) .csa-emp__rs {font-size:var(--q3-fs-xl);font-weight:800;color:var(--q3-texto, #0f172a);line-height:1.25}
:where(body[data-vista="consignacion"]) .csa-emp__dat {font-size:var(--q3-fs-sm);color:var(--q3-texto-3, #475569);line-height:1.5;margin-top:3px}
:where(body[data-vista="consignacion"]) .csa-num {border:2px solid #1f3b73;border-radius:10px;text-align:center;overflow:hidden}
:where(body[data-vista="consignacion"]) .csa-num__t {background:#1f3b73;color:#fff;font-size:var(--q3-fs-xs);font-weight:700;letter-spacing:.06em;padding:7px 8px;text-transform:uppercase}
:where(body[data-vista="consignacion"]) .csa-num__n {font-size:var(--q3-fs-2xl);font-weight:800;color:#1f3b73;padding:9px 8px 2px;font-variant-numeric:tabular-nums}
:where(body[data-vista="consignacion"]) .csa-num__f {font-size:var(--q3-fs-sm);color:var(--q3-texto-3, #475569);padding-bottom:9px}
:where(body[data-vista="consignacion"]) .csa-info {display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}
:where(body[data-vista="consignacion"]) .csa-box {border:1px solid var(--q3-borde, #e2e8f0);border-radius:10px;padding:12px 16px;background:var(--q3-fondo-2, #f8fafc)}
:where(body[data-vista="consignacion"]) .csa-box__t {font-size:var(--q3-fs-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#1f3b73;margin-bottom:8px}
:where(body[data-vista="consignacion"]) .csa-fila {display:flex;gap:10px;font-size:var(--q3-fs-md);padding:3px 0}
:where(body[data-vista="consignacion"]) .csa-fila b {min-width:105px;color:var(--q3-texto-4, #64748b);font-weight:600}
:where(body[data-vista="consignacion"]) .csa-fila span {color:var(--q3-texto, #0f172a);font-weight:600}
:where(body[data-vista="consignacion"]) .csa-chip {display:inline-block;margin-left:6px;padding:1px 9px;border-radius:999px;font-size:var(--q3-fs-xs);font-weight:700}
:where(body[data-vista="consignacion"]) .csa-chip--ok {background:#dcfce7;color:#15803d}:where(body[data-vista="consignacion"]) .csa-chip--warn {background:#fef3c7;color:#b45309}:where(body[data-vista="consignacion"]) .csa-chip--err {background:#fee2e2;color:#b91c1c}
:where(body[data-vista="consignacion"]) .csa-tabla {width:100%;border-collapse:separate;border-spacing:0;font-size:var(--q3-fs-md);border:1px solid var(--q3-borde-3, #cbd5e1);border-radius:10px;overflow:hidden}
:where(body[data-vista="consignacion"]) .csa-tabla th {background:#1f3b73;color:#fff;font-size:var(--q3-fs-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:9px 8px;text-align:center}
:where(body[data-vista="consignacion"]) .csa-tabla td {padding:8px;text-align:center;border-top:1px solid var(--q3-borde, #e2e8f0);vertical-align:middle}
:where(body[data-vista="consignacion"]) .csa-tabla tbody tr:nth-child(even) td {background:var(--q3-fondo-2, #f8fafc)}
:where(body[data-vista="consignacion"]) .csa-tabla td.csa-prod {font-weight:600;color:var(--q3-texto, #0f172a)}
:where(body[data-vista="consignacion"]) .csa-tabla .csa-mono {font-variant-numeric:tabular-nums;font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="consignacion"]) .csa-tabla tfoot td {background:#e8eef8;font-weight:800;color:#1f3b73;border-top:2px solid #1f3b73}
:where(body[data-vista="consignacion"]) .csa-cond {margin-top:20px;border-left:4px solid #1f3b73;background:var(--q3-fondo-2, #f8fafc);border-radius:0 10px 10px 0;padding:12px 16px;font-size:var(--q3-fs-sm);color:var(--q3-texto-2, #334155)}
:where(body[data-vista="consignacion"]) .csa-cond__t {font-weight:700;color:#1f3b73;margin-bottom:6px;text-transform:uppercase;font-size:var(--q3-fs-xs);letter-spacing:.08em}
:where(body[data-vista="consignacion"]) .csa-cond ol {margin:0;padding-left:18px;line-height:1.6}
:where(body[data-vista="consignacion"]) .csa-firmas {display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:70px}
:where(body[data-vista="consignacion"]) .csa-firma {text-align:center;font-size:var(--q3-fs-sm);color:var(--q3-texto-2, #334155)}
:where(body[data-vista="consignacion"]) .csa-firma__l {border-top:1.5px solid #0f172a;margin-bottom:6px}
:where(body[data-vista="consignacion"]) .csa-firma__r {font-weight:700;color:var(--q3-texto, #0f172a);text-transform:uppercase;font-size:var(--q3-fs-xs);letter-spacing:.05em}
:where(body[data-vista="consignacion"]) .csa-pie {margin-top:28px;text-align:center;font-size:var(--q3-fs-xs);color:var(--q3-texto-5, #94a3b8)}
@media (max-width:720px){
  :where(body[data-vista="consignacion"]) .csa-hoja {padding:18px}
  :where(body[data-vista="consignacion"]) .csa-cab, :where(body[data-vista="consignacion"]) .csa-info, :where(body[data-vista="consignacion"]) .csa-firmas {grid-template-columns:1fr}
  :where(body[data-vista="consignacion"]) .csa-firmas {gap:50px}
  :where(body[data-vista="consignacion"]) .csa-tabla {display:block;overflow-x:auto}
}
@media print{
  @page{size:A4;margin:12mm}
  /* Sólo el acta: lo demás se quita del todo (no sólo se oculta, o deja una hoja en blanco),
     y los contenedores del menú pierden su margen para que la hoja no se corra. */
  :where(body[data-vista="consignacion"]) body[class], :where(body[data-vista="consignacion"]) body[class] .wrapper .content-wrapper.content-wrapper {background:var(--q3-fondo, #fff)!important;margin:0!important;border:0!important;padding:0!important}
  :where(body[data-vista="consignacion"]) *:not(:has(.csa-hoja)):not(.csa-hoja):not(.csa-hoja *) {display:none!important}
  :where(body[data-vista="consignacion"]) *:has(.csa-hoja) {position:static!important;transform:none!important;margin:0!important;padding:0!important;background:var(--q3-fondo, #fff)!important;min-height:0!important;max-width:none!important;box-shadow:none!important;border:0!important}
  :where(body[data-vista="consignacion"]) .csa-hoja {border:0;box-shadow:none;padding:0}
  :where(body[data-vista="consignacion"]) .csa-tabla th, :where(body[data-vista="consignacion"]) .csa-num__t, :where(body[data-vista="consignacion"]) .csa-tabla tfoot td, :where(body[data-vista="consignacion"]) .csa-box, :where(body[data-vista="consignacion"]) .csa-cond, :where(body[data-vista="consignacion"]) .csa-chip {-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ── consignaciones (core/app/view/consignaciones-view.php) ────────────────────────────────────────────── */
:where(body[data-vista="consignaciones"]) .csd {--cs-azul:#1e3a8a;--cs-azul2:#2563eb;--cs-texto:#0f172a;--cs-suave:#64748b;--cs-borde:#e2e8f0;--cs-fondo:#ffffff;--cs-gris:#f8fafc;
     --cs-ok:#16a34a;--cs-warn:#f59e0b;--cs-bad:#dc2626;--cs-off:#94a3b8;color:var(--cs-texto);display:grid;gap:16px}
:where(body[data-vista="consignaciones"].dark-mode) .csd {--cs-texto:#e2e8f0;--cs-suave:#94a3b8;--cs-borde:#334155;--cs-fondo:#1c2333;--cs-gris:#0f172a}
:where(body[data-vista="consignaciones"]) .csd-cab {display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
:where(body[data-vista="consignaciones"]) .csd-cab__tit {display:flex;align-items:center;gap:14px}
:where(body[data-vista="consignaciones"]) .csd-cab__ico {width:52px;height:52px;border-radius:12px;background:var(--cs-azul);color:#fff;display:flex;align-items:center;justify-content:center;font-size:var(--q3-fs-3xl);flex:none}
:where(body[data-vista="consignaciones"]) .csd-cab h2 {margin:0;font-size:var(--q3-fs-3xl);font-weight:800;letter-spacing:.01em;text-transform:uppercase}
:where(body[data-vista="consignaciones"]) .csd-cab p {margin:2px 0 0;color:var(--cs-suave)}
:where(body[data-vista="consignaciones"]) .csd-acc {display:flex;gap:8px;flex-wrap:wrap}
:where(body[data-vista="consignaciones"]) .csd-btn {display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:9px;border:1px solid var(--cs-borde);background:var(--cs-fondo);color:var(--cs-texto);font-weight:600;font-size:var(--q3-fs-lg);text-decoration:none;cursor:pointer}
:where(body[data-vista="consignaciones"]) .csd-btn:hover {border-color:var(--cs-azul2);color:var(--cs-azul2)}
:where(body[data-vista="consignaciones"]) .csd-btn--pri {background:var(--cs-azul2);border-color:var(--cs-azul2);color:#fff}
:where(body[data-vista="consignaciones"]) .csd-btn--pri:hover {background:var(--cs-azul);color:#fff}
:where(body[data-vista="consignaciones"]) .csd-kpis {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
@media (max-width:1200px){:where(body[data-vista="consignaciones"]) .csd-kpis {grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){:where(body[data-vista="consignaciones"]) .csd-kpis {grid-template-columns:1fr}}
:where(body[data-vista="consignaciones"]) .csd-kpi {position:relative;border-radius:12px;padding:16px 18px;min-height:112px;overflow:hidden;border:1px solid var(--cs-borde)}
:where(body[data-vista="consignaciones"]) .csd-kpi__t {display:flex;align-items:center;gap:10px;font-size:var(--q3-fs-sm);font-weight:600;text-transform:uppercase;letter-spacing:.03em}
:where(body[data-vista="consignaciones"]) .csd-kpi__t em {font-size:var(--q3-fs-2xl)}
:where(body[data-vista="consignaciones"]) .csd-kpi__v {font-size:var(--q3-fs-4xl);font-weight:800;margin-top:6px;font-variant-numeric:tabular-nums}
:where(body[data-vista="consignaciones"]) .csd-kpi__s {font-size:var(--q3-fs-md);color:var(--cs-suave)}
:where(body[data-vista="consignaciones"]) .csd-kpi__bg {position:absolute;right:14px;bottom:12px;font-size:var(--q3-fs-5xl);opacity:.28}
:where(body[data-vista="consignaciones"]) .csd-kpi--azul {background:#eff6ff}:where(body[data-vista="consignaciones"]) .csd-kpi--azul .csd-kpi__t em, :where(body[data-vista="consignaciones"]) .csd-kpi--azul .csd-kpi__bg {color:#2563eb}
:where(body[data-vista="consignaciones"]) .csd-kpi--ambar {background:#fffbeb}:where(body[data-vista="consignaciones"]) .csd-kpi--ambar .csd-kpi__t em, :where(body[data-vista="consignaciones"]) .csd-kpi--ambar .csd-kpi__bg {color:#d97706}
:where(body[data-vista="consignaciones"]) .csd-kpi--verde {background:#f0fdf4}:where(body[data-vista="consignaciones"]) .csd-kpi--verde .csd-kpi__t em, :where(body[data-vista="consignaciones"]) .csd-kpi--verde .csd-kpi__bg {color:#16a34a}:where(body[data-vista="consignaciones"]) .csd-kpi--verde .csd-kpi__v {color:#15803d}
:where(body[data-vista="consignaciones"]) .csd-kpi--cel {background:#eff6ff}:where(body[data-vista="consignaciones"]) .csd-kpi--cel .csd-kpi__t em, :where(body[data-vista="consignaciones"]) .csd-kpi--cel .csd-kpi__bg {color:#1d4ed8}:where(body[data-vista="consignaciones"]) .csd-kpi--cel .csd-kpi__v {color:#1e3a8a}
:where(body[data-vista="consignaciones"]) .csd-kpi--rojo {background:#fef2f2}:where(body[data-vista="consignaciones"]) .csd-kpi--rojo .csd-kpi__t em, :where(body[data-vista="consignaciones"]) .csd-kpi--rojo .csd-kpi__bg {color:#dc2626}:where(body[data-vista="consignaciones"]) .csd-kpi--rojo .csd-kpi__v {color:#b91c1c}
:where(body[data-vista="consignaciones"].dark-mode) .csd-kpi {background:var(--cs-fondo)}
:where(body[data-vista="consignaciones"]) .csd-sube {color:#16a34a;font-weight:600}
:where(body[data-vista="consignaciones"]) .csd-margen {color:#1d4ed8;font-weight:600}
:where(body[data-vista="consignaciones"]) .csd-venc {color:#b91c1c;font-weight:700}
:where(body[data-vista="consignaciones"]) .csd-tabs {display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:var(--cs-fondo);border:1px solid var(--cs-borde);border-radius:12px;padding:6px}
:where(body[data-vista="consignaciones"]) .csd-tabs__l {display:flex;gap:4px;flex-wrap:wrap}
:where(body[data-vista="consignaciones"]) .csd-tab {display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:9px;color:var(--cs-texto);font-weight:600;text-decoration:none}
:where(body[data-vista="consignaciones"]) .csd-tab:hover {background:var(--cs-gris);color:var(--cs-azul2)}
:where(body[data-vista="consignaciones"]) .csd-tab.on {background:var(--cs-azul);color:#fff}
:where(body[data-vista="consignaciones"]) .csd-rango {position:relative}
:where(body[data-vista="consignaciones"]) .csd-rango__pop {position:absolute;right:0;top:calc(100% + 6px);z-index:30;background:var(--cs-fondo);border:1px solid var(--cs-borde);border-radius:10px;box-shadow:0 10px 30px rgba(15,23,42,.18);padding:12px;display:none;gap:8px;min-width:260px}
:where(body[data-vista="consignaciones"]) .csd-rango__pop.on {display:grid}
:where(body[data-vista="consignaciones"]) .csd-card {background:var(--cs-fondo);border:1px solid var(--cs-borde);border-radius:12px;padding:16px;min-width:0}
:where(body[data-vista="consignaciones"]) .csd-card__cab {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
:where(body[data-vista="consignaciones"]) .csd-card__cab h3 {margin:0;font-size:var(--q3-fs-xl);font-weight:700;display:flex;align-items:center;gap:8px}
:where(body[data-vista="consignaciones"]) .csd-card__cab h3 em {color:var(--cs-azul)}
:where(body[data-vista="consignaciones"]) .csd-card__cab a {font-size:var(--q3-fs-md);font-weight:600;text-decoration:none}
:where(body[data-vista="consignaciones"]) .csd-g3 {display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);gap:16px}
:where(body[data-vista="consignaciones"]) .csd-g2 {display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px}
@media (max-width:1200px){:where(body[data-vista="consignaciones"]) .csd-g3 {grid-template-columns:1fr}}
@media (max-width:1400px){:where(body[data-vista="consignaciones"]) .csd-g2 {grid-template-columns:1fr}}
:where(body[data-vista="consignaciones"]) .csd-dona {display:flex;align-items:center;gap:18px}
:where(body[data-vista="consignaciones"]) .csd-dona__c {position:relative;width:170px;height:170px;flex:none}
:where(body[data-vista="consignaciones"]) .csd-dona__n {position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
:where(body[data-vista="consignaciones"]) .csd-dona__n b {font-size:var(--q3-fs-4xl)}:where(body[data-vista="consignaciones"]) .csd-dona__n span {font-size:var(--q3-fs-md);color:var(--cs-suave)}
:where(body[data-vista="consignaciones"]) .csd-ley {list-style:none;margin:0;padding:0;display:grid;gap:12px;flex:1;min-width:0}
:where(body[data-vista="consignaciones"]) .csd-ley li {display:flex;align-items:center;gap:8px;font-size:var(--q3-fs-lg)}
:where(body[data-vista="consignaciones"]) .csd-ley li b {margin-left:auto;font-variant-numeric:tabular-nums}
:where(body[data-vista="consignaciones"]) .cs-dot {display:inline-flex;align-items:center;gap:6px;font-size:var(--q3-fs-md);white-space:nowrap}
:where(body[data-vista="consignaciones"]) .cs-dot::before {content:"";width:9px;height:9px;border-radius:50%;background:currentColor}
:where(body[data-vista="consignaciones"]) .cs-dot--ok {color:var(--cs-ok)}:where(body[data-vista="consignaciones"]) .cs-dot--warn {color:var(--cs-warn)}:where(body[data-vista="consignaciones"]) .cs-dot--bad {color:var(--cs-bad)}:where(body[data-vista="consignaciones"]) .cs-dot--off {color:var(--cs-off)}
:where(body[data-vista="consignaciones"]) .cs-dot span {color:var(--cs-texto)}
:where(body[data-vista="consignaciones"]) .csd-top {display:grid;gap:14px;margin-top:6px}
:where(body[data-vista="consignaciones"]) .csd-top__f {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) auto;gap:10px;align-items:center;font-size:var(--q3-fs-lg)}
:where(body[data-vista="consignaciones"]) .csd-top__n {white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:where(body[data-vista="consignaciones"]) .csd-top__b {height:10px;border-radius:6px;background:var(--cs-gris);overflow:hidden}
:where(body[data-vista="consignaciones"]) .csd-top__b i {display:block;height:100%;border-radius:6px;background:var(--cs-azul2)}
:where(body[data-vista="consignaciones"]) .csd-top__v {font-variant-numeric:tabular-nums;font-weight:600}
:where(body[data-vista="consignaciones"]) .csd-tabla {overflow-x:auto}
:where(body[data-vista="consignaciones"]) .csd-tabla table {width:100%;border-collapse:collapse;font-size:var(--q3-fs-lg);min-width:640px}
:where(body[data-vista="consignaciones"]) .csd-tabla th {background:var(--cs-gris);color:var(--cs-suave);font-weight:600;font-size:var(--q3-fs-md);text-align:left;padding:9px 10px;white-space:nowrap}
:where(body[data-vista="consignaciones"]) .csd-tabla td {padding:9px 10px;border-bottom:1px solid var(--cs-borde);vertical-align:middle}
:where(body[data-vista="consignaciones"]) .csd-tabla tr:last-child td {border-bottom:none}
:where(body[data-vista="consignaciones"]) .csd-tabla .n {text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
:where(body[data-vista="consignaciones"]) .csd-tabla a.cli {font-weight:600;text-decoration:none;color:var(--cs-azul2)}
:where(body[data-vista="consignaciones"]) .csd-tabla table.csd-compacta {min-width:0!important}
:where(body[data-vista="consignaciones"]) .csd-compacta td:first-child {max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:where(body[data-vista="consignaciones"]) .csd-compacta td, :where(body[data-vista="consignaciones"]) .csd-compacta th {padding-left:7px;padding-right:7px}
:where(body[data-vista="consignaciones"]) .csd-vacio {color:var(--cs-suave);padding:16px 4px}
:where(body[data-vista="consignaciones"]) .cs-pill {display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:7px;font-size:var(--q3-fs-sm);font-weight:600;white-space:nowrap}
:where(body[data-vista="consignaciones"]) .cs-pill--ok {background:#dcfce7;color:#166534}:where(body[data-vista="consignaciones"]) .cs-pill--warn {background:#fef3c7;color:#92400e}:where(body[data-vista="consignaciones"]) .cs-pill--bad {background:#fee2e2;color:#991b1b}:where(body[data-vista="consignaciones"]) .cs-pill--info {background:#e0f2fe;color:#075985}
:where(body[data-vista="consignaciones"]) .csd-dias {font-variant-numeric:tabular-nums;font-weight:600}:where(body[data-vista="consignaciones"]) .csd-dias.neg {color:var(--cs-bad)}
:where(body[data-vista="consignaciones"]) .csd-acc-f {display:flex;gap:6px;justify-content:flex-end;align-items:center}
:where(body[data-vista="consignaciones"]) .csd-mini {display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:62px;height:30px;padding:0 10px;border-radius:7px;border:1px solid var(--cs-borde);background:var(--cs-fondo);color:var(--cs-texto);font-size:var(--q3-fs-md);font-weight:600;text-decoration:none}
:where(body[data-vista="consignaciones"]) .csd-mini:hover {border-color:var(--cs-azul2);color:var(--cs-azul2)}
:where(body[data-vista="consignaciones"]) .csd-mini--k {min-width:30px;padding:0}
:where(body[data-vista="consignaciones"]) .csd-mini--pri {background:var(--cs-azul2);border-color:var(--cs-azul2);color:#fff}
:where(body[data-vista="consignaciones"]) .csd .dropdown-menu {font-size:var(--q3-fs-lg)}
@media print{:where(body[data-vista="consignaciones"]) .csd-acc, :where(body[data-vista="consignaciones"]) .csd-tabs, :where(body[data-vista="consignaciones"]) .csd-acc-f, :where(body[data-vista="consignaciones"]) .main-sidebar, :where(body[data-vista="consignaciones"]) .main-header, :where(body[data-vista="consignaciones"]) .topbar, :where(body[data-vista="consignaciones"]) #q2-topnav {display:none!important}}

/* ── cuadreliq (core/app/view/cuadreliq-view.php) ─────────────────────────────────────────────────── */
/* Catorce columnas: la cabecera necesita partirse en dos líneas o la tabla se va
       de ancho antes de mostrar la primera fila. */
    :where(body[data-vista="cuadreliq"]) #tblLiq th { white-space: normal !important; vertical-align: middle; }
    :where(body[data-vista="cuadreliq"]) #tblLiq td { vertical-align: middle; }
    :where(body[data-vista="cuadreliq"]) .q-liq-num { text-align: right; white-space: nowrap; }
    :where(body[data-vista="cuadreliq"]) .q-liq-sello { display: inline-block; padding: 2px 8px; border-radius: 999px;
                   font-size: var(--q3-fs-xs); font-weight: 700; white-space: nowrap; }
    :where(body[data-vista="cuadreliq"]) .q-liq-sello--pend { background: #fffbeb; color: #92400e; }
    :where(body[data-vista="cuadreliq"]) .q-liq-sello--dev { background: #fef2f2; color: #991b1b; }
    /* ENTREGADO va en verde oscuro pleno con texto blanco: es el estado "listo" y se
       busca de un vistazo entre veinte filas. Los otros tres sellos siguen en tono
       claro a proposito, para que el pleno destaque.
       El verde es MAS OSCURO que el del cuadro del cuadre (#16a34a) porque el sello
       es texto de 11 px: sobre aquel el blanco da 3.30:1 de contraste, por debajo del
       minimo legible de 4.5:1. Este da 5.02:1. El cuadro puede permitirse el verde
       claro porque su texto mide 16 px. */
    :where(body[data-vista="cuadreliq"]) .q-liq-sello--ent { background: #15803d; color: #ffffff; }
    :where(body[data-vista="cuadreliq"]) .q-liq-sello--par { background: #eff6ff; color: #1e3a8a; }
    :where(body[data-vista="cuadreliq"]) #mdLiqResumen { display: flex; justify-content: space-between; gap: 10px;
                    background: var(--q3-fondo-2, #f8fafc); border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 8px;
                    padding: 10px 12px; margin-bottom: 12px; font-size: var(--q3-fs-md); }
    :where(body[data-vista="cuadreliq"]) #mdLiqFalta.q-liq-cuadra { color: #065f46; font-weight: 700; }
    :where(body[data-vista="cuadreliq"]) #mdLiqFalta.q-liq-falta { color: #92400e; font-weight: 700; }
    :where(body[data-vista="cuadreliq"]) #mdLiqFalta.q-liq-sobra { color: #991b1b; font-weight: 700; }

    /* Resumen del cuadre. Ancho acotado y pegado a la izquierda: es una columna de
       cifras que se lee de arriba abajo, no una tabla que deba ocupar la pantalla. */
    :where(body[data-vista="cuadreliq"]) .q-liq-resumen { margin: 16px 0 4px; max-width: 380px; }
    :where(body[data-vista="cuadreliq"]) .q-liq-resumen__tabla { width: 100%; border-collapse: collapse; font-size: var(--q3-fs-md); }
    :where(body[data-vista="cuadreliq"]) .q-liq-resumen__tabla td { padding: 6px 12px; border-bottom: 1px solid var(--q3-borde, #e2e8f0); }
    :where(body[data-vista="cuadreliq"]) .q-liq-resumen__cab td { font-weight: 700; background: var(--q3-fondo-3, #f1f5f9); border-bottom: 1px solid var(--q3-borde-3, #cbd5e1); }
    :where(body[data-vista="cuadreliq"]) .q-liq-resumen__total td { font-weight: 700; border-top: 2px solid var(--q3-borde-3, #cbd5e1); border-bottom: 0; }
    :where(body[data-vista="cuadreliq"]) .q-liq-resumen__vacio { color: var(--q3-texto-4, #64748b); font-style: italic; text-align: center; }
    /* El cuadro final. Es lo unico que se mira de lejos al cerrar el dia, asi que el
       color hace el trabajo y el texto solo lo confirma. */
    :where(body[data-vista="cuadreliq"]) .q-liq-caja { margin-top: 10px; padding: 14px 18px; border-radius: 4px;
                  color: #ffffff; font-weight: 700; font-size: var(--q3-fs-xl);
                  text-align: center; letter-spacing: .4px; }
    :where(body[data-vista="cuadreliq"]) .q-liq-caja--ok { background: #16a34a; }   /* cuadra */
    :where(body[data-vista="cuadreliq"]) .q-liq-caja--sobra { background: #f59e0b; }   /* volvio de mas */
    :where(body[data-vista="cuadreliq"]) .q-liq-caja--falta { background: #dc2626; }   /* falta por liquidar */

    /* ── Filas que reclaman atencion ────────────────────────────────────────────
       Mismo codigo de color que el cuadro final, para que la bandeja y el semaforo
       se lean como una sola cosa: amarillo lo que falta hacer, rojo lo que se hizo
       y no cuadra. Lo que ya esta resuelto (ENTREGADO, DEVUELTO) va en blanco: si
       se resalta todo, no se resalta nada.
       El color va en una BARRA a la izquierda y no en el fondo entero de la fila:
       con catorce columnas, un fondo saturado hace ilegibles las cifras. */
    :where(body[data-vista="cuadreliq"]) #tblLiq tbody tr.q-liq-fila--pend { background: #fffdf5; box-shadow: inset 4px 0 0 #f59e0b; }
    :where(body[data-vista="cuadreliq"]) #tblLiq tbody tr.q-liq-fila--desc { background: #fef7f7; box-shadow: inset 4px 0 0 #dc2626; }
    :where(body[data-vista="cuadreliq"]) #tblLiq tbody tr.q-liq-fila--pend:hover, :where(body[data-vista="cuadreliq"]) #tblLiq tbody tr.q-liq-fila--desc:hover { background: var(--q3-fondo-3, #f1f5f9); }
    /* El sello de estado en negrita cuando la fila esta marcada: el color solo no
       basta para quien no distingue rojo de amarillo. */
    :where(body[data-vista="cuadreliq"]) #tblLiq tbody tr.q-liq-fila--pend .q-liq-sello, :where(body[data-vista="cuadreliq"]) #tblLiq tbody tr.q-liq-fila--desc .q-liq-sello { text-decoration: none; font-weight: 800; }
    /* Cuanto falta en esa fila, al lado del sello. Es el dato que se persigue. */
    :where(body[data-vista="cuadreliq"]) .q-liq-resta { display: block; margin-top: 3px; font-size: var(--q3-fs-xs); font-weight: 700; color: #b91c1c; white-space: nowrap; }
    /* Candado de lo ya cerrado. Discreto: no es una alarma, es un estado. */
    :where(body[data-vista="cuadreliq"]) .q-liq-candado { color: var(--q3-texto-4, #64748b); margin-left: 5px; }
    /* Cierres del periodo, bajo el resumen. */
    :where(body[data-vista="cuadreliq"]) .q-liq-cierres { margin: 18px 0 4px; }
    :where(body[data-vista="cuadreliq"]) .q-liq-cierres__tit { font-size: var(--q3-fs-sm); font-weight: 700; text-transform: uppercase;
                          letter-spacing: .4px; color: var(--q3-texto-4, #64748b); margin: 0 0 6px; }
    :where(body[data-vista="cuadreliq"]) .q-liq-cierres small { color: var(--q3-texto-4, #64748b); }
    :where(body[data-vista="cuadreliq"]) .q-liq-cierre--anulado td { opacity: .55; text-decoration: line-through; }
    :where(body[data-vista="cuadreliq"]) .q-liq-cierre--anulado .q-liq-sello { text-decoration: none; }

/* ── detailstock (core/app/view/detailstock-view.php) ───────────────────────────────────────────────── */
/* DST-UI-001 · una sola fila; los botones no se parten ni se recortan. */
                	:where(body[data-vista="detailstock"]) .dst-fila {display:flex;flex-wrap:nowrap;gap:10px;align-items:flex-end;margin-bottom:12px;width:100%;box-sizing:border-box}
                	:where(body[data-vista="detailstock"]) .dst-f {display:flex;flex-direction:column;flex:0 0 130px;min-width:0}
                	:where(body[data-vista="detailstock"]) .dst-f label {font-weight:600;margin-bottom:4px}
                	:where(body[data-vista="detailstock"]) .dst-f--alm {flex-basis:120px}
                	:where(body[data-vista="detailstock"]) .dst-f--prod {flex:1 1 0;min-width:140px}
                	:where(body[data-vista="detailstock"]) .dst-f--num {flex-basis:110px}
                	:where(body[data-vista="detailstock"]) .dst-f--fec {flex-basis:125px}
                	:where(body[data-vista="detailstock"]) .dst-f--btn {flex:0 0 auto;flex-direction:row;gap:6px}
                	:where(body[data-vista="detailstock"]) .dst-f--btn .btn {white-space:nowrap;width:auto!important;min-width:0!important}
                	:where(body[data-vista="detailstock"]) .dst-f input {text-overflow:ellipsis}
                	@media (max-width:1150px){ :where(body[data-vista="detailstock"]) .dst-fila {flex-wrap:wrap} :where(body[data-vista="detailstock"]) .dst-f--prod {flex:1 1 240px} }
                	@media (max-width:767px){ :where(body[data-vista="detailstock"]) .dst-f, :where(body[data-vista="detailstock"]) .dst-f--prod {flex:1 1 100%} :where(body[data-vista="detailstock"]) .dst-f--btn {flex-wrap:wrap} }

:where(body[data-vista="detailstock"]) .dst-hist {font-size:var(--q3-fs-xl);font-weight:700;margin:18px 0 8px;display:flex;gap:8px;align-items:center}
                	:where(body[data-vista="detailstock"]) .dst-hist em {color:#1e3a8a}
                	:where(body[data-vista="detailstock"]) .dst-hist__tabla th, :where(body[data-vista="detailstock"]) .dst-hist__tabla td {text-align:center;vertical-align:middle}
                	:where(body[data-vista="detailstock"]) .dst-hist__antes {color:var(--q3-texto-5, #94a3b8);text-decoration:line-through}
                	:where(body[data-vista="detailstock"]) .dst-hist__motivo {white-space:normal!important;min-width:220px}
                	:where(body[data-vista="detailstock"]) .dst-hist__vacio {color:var(--q3-texto-4, #64748b);margin:0}

/* ── devcompra (core/app/view/devcompra-view.php) ─────────────────────────────────────────────────── */
:where(body[data-vista="devcompra"]) .sf-cab {display:flex;gap:18px;align-items:center;flex-wrap:wrap;background:#ecfdf5;border:1px solid #a7f3d0;border-left:6px solid #16a34a;border-radius:8px;padding:12px 16px;margin-bottom:12px}
    				:where(body[data-vista="devcompra"]) .sf-cab span {display:block;font-size:var(--q3-fs-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#047857}
    				:where(body[data-vista="devcompra"]) .sf-cab > div b {font-size:var(--q3-fs-3xl);color:#15803d;font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
    				:where(body[data-vista="devcompra"]) .sf-cab p {margin:0;flex:1 1 320px;font-size:var(--q3-fs-md);color:var(--q3-texto-2, #334155)}
    				:where(body[data-vista="devcompra"]) .sf-grid {display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:12px}
    				:where(body[data-vista="devcompra"]) .sf-op {border:1px solid var(--q3-borde-2, #e5e7eb);border-radius:10px;padding:12px 14px;background:var(--q3-fondo, #fff)}
    				:where(body[data-vista="devcompra"]) .sf-op__t {font-weight:800;margin-bottom:8px;color:var(--q3-texto, #0f172a)}
    				:where(body[data-vista="devcompra"]) .sf-fila {display:flex;gap:10px;margin-bottom:8px}
    				:where(body[data-vista="devcompra"]) .sf-fila > div {flex:1;display:flex;flex-direction:column;min-width:0}
    				:where(body[data-vista="devcompra"]) .sf-fila label {font-size:var(--q3-fs-sm);font-weight:600;margin-bottom:3px}
    				:where(body[data-vista="devcompra"]) .sf-vacio {color:var(--q3-texto-4, #64748b);font-size:var(--q3-fs-md);margin:4px 0}
    				:where(body[data-vista="devcompra"]) .sf-tabla th, :where(body[data-vista="devcompra"]) .sf-tabla td {text-align:center !important;vertical-align:middle}
    				@media (max-width:900px){:where(body[data-vista="devcompra"]) .sf-grid {grid-template-columns:1fr}:where(body[data-vista="devcompra"]) .sf-fila {flex-wrap:wrap}}

/* ── devparcial (core/app/view/devparcial-view.php) ────────────────────────────────────────────────── */
/* El aviso es informativo, no un error: ambar y con el texto legible, no el
       cuadro de color pleno que el cuadre de liquidacion usa para su semaforo. */
    :where(body[data-vista="devparcial"]) .dp-aviso { padding: 10px 14px; border-radius: 4px; background: #fef3c7;
                border: 1px solid #f59e0b; color: #78350f; font-weight: 600; }
    :where(body[data-vista="devparcial"]) .dp-todo { display: block; font-size: var(--q3-fs-xs); margin-top: 2px; }
    :where(body[data-vista="devparcial"]) #dpTabla tfoot th { font-size: var(--q3-fs-lg); }

/* ── empresa (core/app/view/empresa-view.php) ───────────────────────────────────────────────────── */
:where(body[data-vista="empresa"]) #frmEmpresa .em-field { margin-bottom:12px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-field > label { display:block; font-weight:600; margin-bottom:4px; color:#333; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-help { font-size:var(--q3-fs-sm); color:#888; margin:3px 0 0; }
    :where(body[data-vista="empresa"]) #frmEmpresa .card-title .bi { margin-right:6px; }
    :where(body[data-vista="empresa"]) #emLogoPrev { max-width:180px; max-height:90px; border:1px solid #e6e0ea; border-radius:6px;
        padding:6px; background:var(--q3-fondo, #fff); display:block; margin-bottom:0; flex:0 0 auto; }
    /* Logo + control de subida uno al costado del otro */
    :where(body[data-vista="empresa"]) #frmEmpresa .em-logo-row { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-logo-upload { flex:1 1 220px; min-width:0; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-logo-upload .em-help { margin-top:6px; }
    /* Botón Guardar: texto SIEMPRE blanco y en negrita para que resalte sobre el verde */
    :where(body[data-vista="empresa"]) #btnGuardarEmpresa { color:#fff !important; font-weight:700 !important; }
    :where(body[data-vista="empresa"]) #btnGuardarEmpresa .bi { color:#fff !important; }
    :where(body[data-vista="empresa"]) #frmEmpresa .btn .bi { margin-right:5px; }
    :where(body[data-vista="empresa"]) .em-sec { margin:18px 0 10px; padding-bottom:6px; border-bottom:2px solid #9a80a6; }
    :where(body[data-vista="empresa"]) .em-sec__t { font-weight:700; font-size:var(--q3-fs-md); text-transform:uppercase; letter-spacing:.4px; color:#5f4b6b; }
    :where(body[data-vista="empresa"]) .em-sec__t .bi { margin-right:6px; }
    :where(body[data-vista="empresa"]) .em-note { background:#fff8e1; border:1px solid #ffe59a; color:#8a6d00; font-size:var(--q3-fs-sm); padding:8px 10px; border-radius:6px; margin-bottom:10px; }
    /* Tabs tipo "chip": todos visibles (fondo tenue + borde); el activo en azul sólido. */
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs { margin-bottom:0; border-bottom:2px solid #1e3a8a; display:flex; flex-wrap:nowrap; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li { margin-bottom:0; float:none; flex:1 1 0; display:flex; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a {
        flex:1 1 auto; display:flex; align-items:center; justify-content:center;
        font-weight:600; color:#1e3a8a !important;
        background-color:#eef2fb !important;
        border:1px solid #b9c5e6 !important;
        border-radius:6px 6px 0 0 !important;
        margin-right:4px; margin-bottom:2px;
        text-align:center; white-space:normal; line-height:1.2; font-size:var(--q3-fs-sm);
        padding:8px 6px; min-height:46px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li:last-child > a { margin-right:0; }
    @media (max-width:767px) {
        :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs { flex-wrap:wrap; }
        :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li { flex:1 1 45%; }
    }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a:hover, :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a:focus {
        background-color:#dbe4f7 !important; color:#1e3a8a !important; border-color:#9db4e6 !important; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a.nav-link.active, :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a.nav-link.active:hover, :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a.nav-link.active:focus {
        color:#fff !important; background-color:#1e3a8a !important; border-color:#1e3a8a !important; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a .bi { margin-right:6px; }
    /* Contenido enmarcado (mismo look que Diseño de Impresión / ticketconfig) */
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabcontent { border:1px solid #e6e0ea; border-top:none; border-radius:0 0 6px 6px; padding:16px; background:#fcfbfd; }
    /* ===== Pestaña Alta (EXP-ALTA-001) ===== */
    :where(body[data-vista="empresa"]) #tab-alta .al-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px;
        background:var(--q3-fondo, #fff); border:1px solid #e6e0ea; border-radius:8px; padding:14px 16px; margin-bottom:14px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-state__lbl { font-size:var(--q3-fs-md); color:#666; margin-right:8px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-badge { display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:var(--q3-fs-lg);
        padding:6px 12px; border-radius:999px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-badge .bi { margin:0; }
    :where(body[data-vista="empresa"]) #tab-alta .al-badge--demo { background:#e8f5e9; color:#2e7d32; border:1px solid #a5d6a7; }
    :where(body[data-vista="empresa"]) #tab-alta .al-badge--prod { background:#e3f2fd; color:#1565c0; border:1px solid #90caf9; }
    /* Switch moderno */
    :where(body[data-vista="empresa"]) #tab-alta .al-switch { display:inline-flex; align-items:center; gap:10px; cursor:pointer; margin:0; user-select:none; }
    :where(body[data-vista="empresa"]) #tab-alta .al-switch input { position:absolute; opacity:0; width:0; height:0; }
    :where(body[data-vista="empresa"]) #tab-alta .al-switch__track { position:relative; width:48px; height:26px; background:#c9c2d1; border-radius:999px; transition:background .2s; }
    :where(body[data-vista="empresa"]) #tab-alta .al-switch__thumb { position:absolute; top:3px; left:3px; width:20px; height:20px; background:var(--q3-fondo, #fff); border-radius:50%;
        box-shadow:0 1px 3px rgba(0,0,0,.3); transition:left .2s; }
    :where(body[data-vista="empresa"]) #tab-alta .al-switch input:checked + .al-switch__track { background:#1565c0; }
    :where(body[data-vista="empresa"]) #tab-alta .al-switch input:checked + .al-switch__track .al-switch__thumb { left:25px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-switch__text { font-weight:600; color:#333; font-size:var(--q3-fs-md); }
    /* EXP-CLI-001 · pestaña Campos adicionales.
       EXP-GEO-002: el bloque estaba acotado a #tab-campos; se amplía al formulario
       para poder reutilizar el interruptor en otras pestañas. El checkbox real es
       opacity:0, así que fuera del alcance del CSS el control se vería INVISIBLE:
       no es cosmético, es lo que hace que el componente funcione. */
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-head { border-bottom:2px solid #efeaf2; padding-bottom:10px; margin-bottom:16px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-head__t { font-weight:800; font-size:var(--q3-fs-lg); color:#5a4a66; letter-spacing:.03em; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-head__t .bi { margin-right:7px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-head__d { font-size:var(--q3-fs-sm); color:#777; line-height:1.5; margin:8px 0 0; max-width:820px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switches { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:12px 18px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch { display:flex; align-items:center; gap:12px; cursor:pointer; margin:0; user-select:none;
        border:1px solid #ece7f0; border-radius:10px; padding:12px 14px; background:var(--q3-fondo, #fff); }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch:hover { border-color:#d9cfe2; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch input { position:absolute; opacity:0; width:0; height:0; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__track { position:relative; width:48px; height:26px; background:#c9c2d1; border-radius:999px; transition:background .2s; flex:0 0 auto; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__thumb { position:absolute; top:3px; left:3px; width:20px; height:20px; background:var(--q3-fondo, #fff); border-radius:50%; box-shadow:0 1px 2px rgba(0,0,0,.3); transition:left .2s; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch input:checked + .cf-switch__track { background:#1565c0; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch input:checked + .cf-switch__track .cf-switch__thumb { left:25px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__meta { display:flex; flex-direction:column; gap:2px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__t { font-weight:700; color:#333; font-size:var(--q3-fs-lg); }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__d { font-size:var(--q3-fs-xs); color:#888; line-height:1.35; }
    /* Avisos */
    :where(body[data-vista="empresa"]) #tab-alta .al-alert { border-radius:8px; padding:12px 14px; font-size:var(--q3-fs-md); margin-bottom:16px; line-height:1.5; }
    :where(body[data-vista="empresa"]) #tab-alta .al-alert .bi { margin-right:6px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-alert--demo { background:#fff8e1; border:1px solid #ffe59a; color:#8a6d00; }
    :where(body[data-vista="empresa"]) #tab-alta .al-alert--prod { background:#e3f2fd; border:1px solid #90caf9; color:#0d47a1; }
    /* Sección */
    :where(body[data-vista="empresa"]) #tab-alta .al-sec { margin:6px 0 4px; padding-bottom:6px; border-bottom:2px solid #9a80a6; }
    :where(body[data-vista="empresa"]) #tab-alta .al-sec__t { font-weight:700; font-size:var(--q3-fs-md); text-transform:uppercase; letter-spacing:.4px; color:#5f4b6b; }
    :where(body[data-vista="empresa"]) #tab-alta .al-sec__t .bi { margin-right:6px; }
    /* Tarjetas */
    :where(body[data-vista="empresa"]) #tab-alta .al-cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(165px, 1fr)); gap:10px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card { background:var(--q3-fondo, #fff); border:1px solid #e6e0ea; border-radius:9px; padding:11px 10px; text-align:center;
        display:flex; flex-direction:column; align-items:center; box-shadow:0 1px 2px rgba(0,0,0,.04); }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__ico { font-size:var(--q3-fs-2xl); color:#9a80a6; margin-bottom:5px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__tit { font-weight:700; font-size:var(--q3-fs-md); color:#333; margin-bottom:3px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__txt { font-size:var(--q3-fs-xs); color:#777; line-height:1.32; margin-bottom:9px; min-height:32px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__btn { border:none; border-radius:6px; padding:6px 12px; font-size:var(--q3-fs-sm); font-weight:700; color:#fff;
        background:#2e3a8c; cursor:pointer; transition:background .15s; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__btn:hover:not(:disabled) { background:#1e2a6c; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__btn:disabled { background:#cfcfcf; cursor:not-allowed; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__btn .bi { margin-right:5px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card--off { opacity:.65; background:#f5f5f5; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card--off .al-card__ico { color:#b0a8ba; }
    :where(body[data-vista="empresa"]) #tab-alta .al-card__lock { font-size:var(--q3-fs-2xs); color:#999; margin-top:6px; font-style:italic; line-height:1.3; }
    /* Verificar: de sólo lectura, y se ve distinto de las tarjetas que borran. */
    :where(body[data-vista="empresa"]) #tab-alta .al-verif { display:flex; align-items:center; gap:14px; justify-content:space-between; flex-wrap:wrap;
        background:#f3f7ff; border:1px solid #cfdcf6; border-left:3px solid #2563EB; border-radius:8px;
        padding:10px 14px; margin:0 0 14px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-verif__txt { font-size:var(--q3-fs-xs); color:#4a5568; line-height:1.4; }
    :where(body[data-vista="empresa"]) #tab-alta .al-verif__txt b { display:block; font-size:var(--q3-fs-sm); color:#1e2a6c; }
    :where(body[data-vista="empresa"]) #tab-alta .al-verificar { background:#2563EB; border:none; color:#fff; border-radius:6px; padding:7px 14px;
        font-size:var(--q3-fs-sm); font-weight:700; cursor:pointer; white-space:nowrap; }
    :where(body[data-vista="empresa"]) #tab-alta .al-verificar:hover { background:#1d4ed8; }
    :where(body[data-vista="empresa"]) #tab-alta .al-verificar .bi { margin-right:5px; }
    /* Informe de depuración dentro del diálogo. */
    :where(body[data-vista="empresa"]) .dp-inf { text-align:left; font-family:var(--q3-font-mono); font-size:var(--q3-fs-sm); line-height:1.55;
        max-height:52vh; overflow:auto; background:#0f1626; color:#dbe3f4; border-radius:7px; padding:12px 14px; }
    :where(body[data-vista="empresa"]) .dp-inf h4 { font-size:var(--q3-fs-2xs); letter-spacing:.11em; text-transform:uppercase; color:#7f8db0;
        margin:12px 0 5px; font-family:inherit; font-weight:600; }
    :where(body[data-vista="empresa"]) .dp-inf h4:first-child { margin-top:0; }
    :where(body[data-vista="empresa"]) .dp-inf .dp-l { display:flex; gap:6px; white-space:pre; }
    :where(body[data-vista="empresa"]) .dp-inf .dp-l i { flex:1 1 auto; border-bottom:1px dotted #33405e; font-style:normal; min-width:0;
        overflow:hidden; text-overflow:ellipsis; }
    :where(body[data-vista="empresa"]) .dp-inf .dp-n { flex:0 0 auto; font-variant-numeric:tabular-nums; color:#fff; }
    :where(body[data-vista="empresa"]) .dp-inf .dp-ok { color:#4ade80; } :where(body[data-vista="empresa"]) .dp-inf .dp-bad { color:#fca5a5; } :where(body[data-vista="empresa"]) .dp-inf .dp-avi { color:#fbbf24; }
    :where(body[data-vista="empresa"]) .dp-inf .dp-obs { color:#93a0bc; padding-left:22px; white-space:normal; }
    :where(body[data-vista="empresa"]) .dp-inf .dp-fin { margin-top:14px; padding-top:10px; border-top:1px solid #33405e; font-weight:700; letter-spacing:.05em; }
    /* EMP-LAY-001 · ficha compacta en TODAS las pestañas: franjas con título, campos de 34 px, ayudas
       cortas o en texto emergente, interruptores en filas bajas. Va al final para pisar el estilo anterior. */
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabs > li > a { min-height:40px; padding:6px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tabcontent { padding:12px 14px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-field { margin-bottom:6px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-field > label { font-size:var(--q3-fs-sm); margin-bottom:3px; color:#4b5563; }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .form-control, :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .form-select { height:34px; padding:4px 10px; font-size:var(--q3-fs-md); }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-sec { margin:12px 0 8px; padding-bottom:4px; border-bottom:1px solid #e6e0ea; }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-sec--first { margin-top:0; }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-sec__t { font-size:var(--q3-fs-sm); }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-help { margin-top:3px; font-size:var(--q3-fs-xs); }
    :where(body[data-vista="empresa"]) #frmEmpresa .tab-pane .em-note { padding:6px 10px; margin-bottom:8px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-tip { color:#9a80a6; cursor:help; font-size:var(--q3-fs-sm); margin-left:2px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-bottom { margin-top:2px; }
    :where(body[data-vista="empresa"]) #tab-empresa .em-logo-row { gap:12px; align-items:center; }
    :where(body[data-vista="empresa"]) #tab-empresa .em-logo-box { width:150px; height:72px; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
        border:1px solid #e6e0ea; border-radius:6px; background:var(--q3-fondo, #fff); overflow:hidden; }
    :where(body[data-vista="empresa"]) #tab-empresa .em-logo-box #emLogoPrev { border:0; max-width:140px; max-height:64px; padding:0; margin:0; }
    :where(body[data-vista="empresa"]) #tab-empresa .em-logo-vacio { font-size:var(--q3-fs-sm); color:#9ca3af; display:flex; flex-direction:column; align-items:center; gap:2px; text-align:center; }
    :where(body[data-vista="empresa"]) #tab-empresa .em-logo-vacio .bi { font-size:var(--q3-fs-2xl); margin:0; }
    :where(body[data-vista="empresa"]) #tab-empresa .em-logo-falta { color:#b45309; font-weight:600; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-opts { display:flex; flex-direction:column; gap:8px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-opt-sel { cursor:default; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-opt-sel__ico { width:40px; text-align:center; font-size:var(--q3-fs-2xl); color:#1565c0; flex:0 0 auto; margin:0; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-opt-sel select { width:170px; margin-left:auto; flex:0 0 auto; }
    :where(body[data-vista="empresa"]) #frmEmpresa .em-sec--pref { margin-top:18px; }   /* EMP-DEF-001 */
    /* Interruptores: filas bajas en Opciones del sistema y en Campos adicionales. */
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switches { gap:8px 12px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch { padding:8px 12px; gap:10px; border-radius:8px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__track { width:40px; height:22px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__thumb { width:16px; height:16px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch input:checked + .cf-switch__track .cf-switch__thumb { left:21px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__t { font-size:var(--q3-fs-md); }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-switch__d { font-size:var(--q3-fs-xs); }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-head { padding-bottom:6px; margin-bottom:10px; }
    :where(body[data-vista="empresa"]) #frmEmpresa .cf-head__d { margin-top:4px; font-size:var(--q3-fs-sm); }
    /* Demostración / Producción */
    :where(body[data-vista="empresa"]) #tab-alta .al-head { padding:10px 14px; margin-bottom:10px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-alert { padding:8px 12px; margin-bottom:10px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-verif { padding:8px 12px; margin-bottom:10px; }
    :where(body[data-vista="empresa"]) #tab-alta .al-cards { gap:8px; }

/* ── grecompra (core/app/view/grecompra-view.php) ─────────────────────────────────────────────────── */
:where(body[data-vista="grecompra"]) .gc-sec { margin:18px 0 8px; padding-bottom:4px; border-bottom:2px solid #1d4ed8; font-weight:700; font-size:var(--q3-fs-md); color:var(--q3-texto-1, #1e293b); text-transform:uppercase; }
    :where(body[data-vista="grecompra"]) .gc-op { font-size:var(--q3-fs-xs); font-weight:600; margin-left:6px; }
    :where(body[data-vista="grecompra"]) .gc-op--quitar { color:#b91c1c; }
    :where(body[data-vista="grecompra"]) .gc-hint { display:block; margin-top:3px; font-size:var(--q3-fs-xs); color:var(--q3-texto-4, #64748b); }
    :where(body[data-vista="grecompra"]) .gc-malo { display:block; margin-top:3px; font-size:var(--q3-fs-xs); color:#b91c1c; font-weight:600; }
    :where(body[data-vista="grecompra"]) .gc-box { margin-top:8px; padding:10px; border:1px dashed #94a3b8; border-radius:6px; background:var(--q3-fondo-2, #f8fafc); }
    :where(body[data-vista="grecompra"]) .gc-box .row > div { margin-bottom:6px; }
    :where(body[data-vista="grecompra"]) .gc-box__act { display:flex; gap:6px; justify-content:flex-end; }

/* ── home-moderno (core/app/view/home-moderno-view.php) ──────────────────────────────────────────────── */
:where(body[data-vista="home-moderno"]) {
  --bg: #f6f8fc;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --border: rgba(15,23,42,.08);
  --shadow: 0 10px 26px rgba(15,23,42,.08);
  --shadow2: 0 6px 18px rgba(15,23,42,.08);

  --sales: #16a34a;
  --profit:#2563eb;
  --margin:#4f46e5;
  --buy:  #dc2626;
  --cxc:  #0891b2;
  --cxcd: #f59e0b;
  --in:   #22c55e;
  --out:  #f97316;
}


/* ===== Equal-height rows (evita huecos) ===== */
:where(body[data-vista="home-moderno"]) .kpi-row-eq { display:flex; flex-wrap:wrap; }
:where(body[data-vista="home-moderno"]) .kpi-row-eq > [class*="col-"] { display:flex; flex-direction:column; }
:where(body[data-vista="home-moderno"]) .kpi-stretch { flex:1 1 auto; }

/* ===== Chart containers (evita height 0 / blanco) ===== */
:where(body[data-vista="home-moderno"]) #chartVentas { height:320px; }
:where(body[data-vista="home-moderno"]) #chartAnuladas { height:170px; }
@media (max-width: 767px){
  :where(body[data-vista="home-moderno"]) #chartVentas { height:260px; }
  :where(body[data-vista="home-moderno"]) #chartAnuladas { height:170px; }
}

/* ===== KPI badges (Hoy vs Promedio) ===== */
:where(body[data-vista="home-moderno"]) .kpi-badge { display:inline-block; padding:2px 8px; border-radius:999px; font-size:var(--q3-fs-xs); font-weight:800; }
:where(body[data-vista="home-moderno"]) .kpi-badge.up { background:rgba(22,163,74,.12); color:#16a34a; }
:where(body[data-vista="home-moderno"]) .kpi-badge.down { background:rgba(239,68,68,.12); color:#ef4444; }

/* ===== KPI HOY (más visible) ===== */
:where(body[data-vista="home-moderno"]) .daykpi-grid { display:flex; gap:12px; flex-wrap:wrap; }
:where(body[data-vista="home-moderno"]) .daykpi { flex:1 1 180px; border-radius:14px; padding:12px 12px; color:#fff; box-shadow: 0 10px 22px rgba(15,23,42,.10); }
:where(body[data-vista="home-moderno"]) .daykpi-toprow { display:flex; align-items:center; justify-content:space-between; gap:8px; }
:where(body[data-vista="home-moderno"]) .daykpi-label { font-size:var(--q3-fs-sm); font-weight:900; letter-spacing:.2px; opacity:.95; }
:where(body[data-vista="home-moderno"]) .daykpi-value { margin-top:6px; font-size:var(--q3-fs-3xl); font-weight:1000; line-height:1.1; }
:where(body[data-vista="home-moderno"]) .daykpi-sub { margin-top:4px; font-size:var(--q3-fs-xs); opacity:.92; }
:where(body[data-vista="home-moderno"]) .daykpi-pill { display:inline-block; padding:2px 10px; border-radius:999px; font-size:var(--q3-fs-xs); font-weight:900; background: rgba(255,255,255,.22); }
:where(body[data-vista="home-moderno"]) .daykpi-pill.up { background: rgba(34,197,94,.22); }
:where(body[data-vista="home-moderno"]) .daykpi-pill.down { background: rgba(239,68,68,.22); }
:where(body[data-vista="home-moderno"]) .daykpi-sales { background: linear-gradient(135deg, #16a34a, #22c55e); }
:where(body[data-vista="home-moderno"]) .daykpi-ops { background: linear-gradient(135deg, #2563eb, #38bdf8); }
:where(body[data-vista="home-moderno"]) .daykpi-ticket { background: linear-gradient(135deg, #f97316, #f59e0b); }
@media (max-width: 575px){
  :where(body[data-vista="home-moderno"]) .daykpi { flex:1 1 100%; }
  :where(body[data-vista="home-moderno"]) .daykpi-value { font-size:var(--q3-fs-3xl); }
}


/* ===== Tabs compactos ===== */
:where(body[data-vista="home-moderno"]) .nav-tabs.kpi-tabs>li>a { padding:6px 10px; font-weight:800; border-radius:10px 10px 0 0; }
:where(body[data-vista="home-moderno"]) .nav-tabs.kpi-tabs { border-bottom:1px solid rgba(15,23,42,.08); }


:where(body[data-vista="home-moderno"]) .kpi-pro-wrap {
  padding: 12px 15px;
  background: var(--bg);
  border-radius: 14px;
  overflow-x: hidden; /* evita scroll horizontal por .row */
}

/* Ajuste de gutters dentro del wrap (evita overflow por márgenes negativos de .row) */
:where(body[data-vista="home-moderno"]) .kpi-pro-wrap .row { margin-left:-7px; margin-right:-7px; }
:where(body[data-vista="home-moderno"]) .kpi-pro-wrap [class*='col-'] { padding-left:7px; padding-right:7px; }
:where(body[data-vista="home-moderno"]) .kpi-header {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:12px; flex-wrap:wrap; gap:10px;
}
:where(body[data-vista="home-moderno"]) .kpi-title {
  font-weight: 800;
  color: var(--text);
  letter-spacing: .2px;
}
:where(body[data-vista="home-moderno"]) .kpi-sub {
  color: var(--muted);
  font-size: var(--q3-fs-sm);
  margin-left: 8px;
}
:where(body[data-vista="home-moderno"]) .range-btns .btn {
  border-radius: 10px;
  margin-left: 6px;
  border: 1px solid rgba(15,23,42,.08);
}
:where(body[data-vista="home-moderno"]) .range-btns .btn.active {
  box-shadow: 0 6px 16px rgba(37,99,235,.16);
}

/* KPI CARD PREMIUM */
:where(body[data-vista="home-moderno"]) .kpi-card {
  position:relative;
  border-radius:16px;
  background: var(--card);
  border:1px solid var(--border);
  box-shadow: var(--shadow2);
  padding: 14px 14px 12px;
  margin-bottom: 14px;
  min-height: 132px;
  overflow:hidden;
  transition: transform .18s ease, box-shadow .18s ease;
}
:where(body[data-vista="home-moderno"]) .kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}
:where(body[data-vista="home-moderno"]) .kpi-top {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
:where(body[data-vista="home-moderno"]) .kpi-label {
  font-weight: 700;
  color: rgba(15,23,42,.92);
  font-size: var(--q3-fs-md);
}
:where(body[data-vista="home-moderno"]) .kpi-metric {
  font-size: var(--q3-fs-4xl);
  line-height: 1.05;
  font-weight: 900;
  color: var(--text);
  margin-top: 3px;
}
:where(body[data-vista="home-moderno"]) .kpi-delta {
  margin-top: 7px;
  color: var(--muted);
  font-size: var(--q3-fs-sm);
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
:where(body[data-vista="home-moderno"]) .chip {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 2px 9px;
  border-radius: 999px;
  font-weight: 800;
  font-size: var(--q3-fs-xs);
  border: 1px solid rgba(15,23,42,.08);
}
:where(body[data-vista="home-moderno"]) .chip-up {
  background: rgba(34,197,94,.10);
  color: #15803d;
}
:where(body[data-vista="home-moderno"]) .chip-down {
  background: rgba(239,68,68,.10);
  color: #b91c1c;
}

:where(body[data-vista="home-moderno"]) .kpi-icon {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size: var(--q3-fs-2xl);
  flex: 0 0 auto;
  box-shadow: 0 14px 24px rgba(2,6,23,.18);
}
:where(body[data-vista="home-moderno"]) .kpi-mini {
  height: 34px;
  margin-top: 8px;
  opacity:.95;
}

/* Soft background spark layer */
:where(body[data-vista="home-moderno"]) .kpi-bg {
  position:absolute;
  right:-24px;
  top:-30px;
  width: 150px;
  height: 150px;
  border-radius: 40px;
  transform: rotate(12deg);
  opacity:.10;
  filter: blur(0.2px);
}
:where(body[data-vista="home-moderno"]) .bg-sales { background: radial-gradient(circle at 30% 30%, var(--sales), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-buy { background: radial-gradient(circle at 30% 30%, var(--buy), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-cxc { background: radial-gradient(circle at 30% 30%, var(--cxc), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-cxcd { background: radial-gradient(circle at 30% 30%, var(--cxcd), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-profit { background: radial-gradient(circle at 30% 30%, var(--profit), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-margin { background: radial-gradient(circle at 30% 30%, var(--margin), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-in { background: radial-gradient(circle at 30% 30%, var(--in), transparent 60%); }
:where(body[data-vista="home-moderno"]) .bg-out { background: radial-gradient(circle at 30% 30%, var(--out), transparent 60%); }

/* Boxes lower */
:where(body[data-vista="home-moderno"]) .box-pro {
  border-radius: 18px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow2);
  overflow:hidden;
  background: var(--q3-fondo, #fff);
}
:where(body[data-vista="home-moderno"]) .box-pro .box-header {
  border-bottom: 1px solid rgba(15,23,42,.06);
  padding: 12px 14px;
  background: linear-gradient(180deg, rgba(255,255,255,1), rgba(248,250,252,1));
}
:where(body[data-vista="home-moderno"]) .panel-title-pro {
  font-size: var(--q3-fs-xl);
  font-weight: 900;
  color: var(--text);
  margin:0;
}
:where(body[data-vista="home-moderno"]) .panel-sub-pro {
  color: var(--muted);
  font-size: var(--q3-fs-sm);
  margin-top: 3px;
}
:where(body[data-vista="home-moderno"]) .box-pro .box-body { padding: 12px 14px; }

:where(body[data-vista="home-moderno"]) .metric-row { display:flex; gap:14px; align-items:flex-end; flex-wrap:wrap; }
:where(body[data-vista="home-moderno"]) .metric-col { flex:1; min-width:140px; border-right:1px solid rgba(15,23,42,.06); padding-right:10px; }
:where(body[data-vista="home-moderno"]) .metric-col:last-child { border-right:none; padding-right:0; }
:where(body[data-vista="home-moderno"]) .metric-big { font-size: var(--q3-fs-3xl); font-weight: 900; color: var(--text); }
:where(body[data-vista="home-moderno"]) .metric-small { font-size: var(--q3-fs-sm); color: var(--muted); }

:where(body[data-vista="home-moderno"]) .alert-list { margin:0; padding-left:18px; }
:where(body[data-vista="home-moderno"]) .alert-list li { margin-bottom:8px; }

:where(body[data-vista="home-moderno"]) .top-client { display:flex; align-items:center; justify-content:space-between; padding:8px 0; border-bottom:1px solid rgba(15,23,42,.06); }
:where(body[data-vista="home-moderno"]) .top-client:last-child { border-bottom:none; }
:where(body[data-vista="home-moderno"]) .top-client .name { font-weight:800; color: var(--text); max-width: calc(100% - 120px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
:where(body[data-vista="home-moderno"]) .top-client .amt {
  font-weight: 900;
  border-radius: 999px;
  padding: 4px 10px;
  color:#fff;
  font-size: var(--q3-fs-sm);
}
:where(body[data-vista="home-moderno"]) .amt-red { background:#ef4444; }
:where(body[data-vista="home-moderno"]) .amt-amber { background:#f59e0b; }
:where(body[data-vista="home-moderno"]) .amt-green { background:#22c55e; }

:where(body[data-vista="home-moderno"]) .kpi-note {
  font-size:var(--q3-fs-sm);
  color: var(--muted);
}

@media(max-width:991px){
  :where(body[data-vista="home-moderno"]) .kpi-metric { font-size:var(--q3-fs-4xl); }
  :where(body[data-vista="home-moderno"]) .kpi-card { min-height: 126px; }
}

@media(max-width:767px){
  :where(body[data-vista="home-moderno"]) .kpi-header { flex-direction:column; align-items:flex-start; }
  :where(body[data-vista="home-moderno"]) .range-btns { width:100%; display:flex; gap:8px; flex-wrap:wrap; }
  :where(body[data-vista="home-moderno"]) .range-btns .btn { margin-left:0; flex:1 1 auto; text-align:center; }
  :where(body[data-vista="home-moderno"]) .metric-col { min-width: 33%; border-right:none; padding-right:0; }
  :where(body[data-vista="home-moderno"]) #chartVentas { height: 260px !important; }
  :where(body[data-vista="home-moderno"]) #chartAnuladas { height: 160px !important; }
}
@media(max-width:575px){
  :where(body[data-vista="home-moderno"]) .kpi-pro-wrap { padding:10px 10px; }
  :where(body[data-vista="home-moderno"]) .kpi-card { min-height: 118px; }
  :where(body[data-vista="home-moderno"]) .kpi-metric { font-size:var(--q3-fs-3xl); }
  :where(body[data-vista="home-moderno"]) .metric-row { gap:10px; }
  :where(body[data-vista="home-moderno"]) .metric-col { min-width: 100%; border-right:none; padding-right:0; }
  :where(body[data-vista="home-moderno"]) #chartVentas { height: 240px !important; }
}

@media(max-width:420px){
  :where(body[data-vista="home-moderno"]) .top-client { flex-direction:column; align-items:flex-start; gap:6px; }
  :where(body[data-vista="home-moderno"]) .top-client .name { max-width:100%; white-space:normal; }
  :where(body[data-vista="home-moderno"]) .top-client .amt { align-self:flex-start; }
  :where(body[data-vista="home-moderno"]) .kpi-metric { font-size:var(--q3-fs-3xl); }
}

/* ── homeapps (core/app/view/homeapps-view.php) ──────────────────────────────────────────────────── */
/* ============ HOMEAPPS v2 — 2 column layout ============ */
:where(body[data-vista="homeapps"]) .homeapps-page {
    display: flex;
    gap: 0;
    align-items: flex-start;
    min-height: calc(100vh - 100px);
    background: var(--q-bg, #F4F7FB);
    padding: 20px 20px 30px;
    box-sizing: border-box;
}
:where(body[data-vista="homeapps"]) .homeapps-main { flex: 1 1 auto; min-width: 0; padding-right: 20px; }
:where(body[data-vista="homeapps"]) .homeapps-right {
    flex: 0 0 272px;
    width: 272px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ── SUNAT alert ── */
:where(body[data-vista="homeapps"]) .sunat-alert {
    display: flex;
    align-items: center;
    gap: 14px;
    background: rgba(245,158,11,.06);
    border: 1px solid rgba(245,158,11,.22);
    border-left: 4px solid #F59E0B;
    border-radius: 12px;
    padding: 13px 16px;
    margin-bottom: 18px;
}
:where(body[data-vista="homeapps"]) .sunat-alert.ok {
    background: rgba(22,163,74,.06);
    border-color: rgba(22,163,74,.2);
    border-left-color: #16A34A;
}
:where(body[data-vista="homeapps"]) .sunat-alert-icon { font-size: var(--q3-fs-2xl); flex-shrink: 0; }
:where(body[data-vista="homeapps"]) .sunat-alert-body strong { font-size: var(--q3-fs-md); font-weight: 700; color: var(--q-text-1,var(--q3-texto-1, #1E293B)); display: block; }
:where(body[data-vista="homeapps"]) .sunat-alert-body span { font-size: var(--q3-fs-xs); color: var(--q-text-2,var(--q3-texto-4, #64748B)); }
:where(body[data-vista="homeapps"]) .sunat-alert-cta {
    margin-left: auto;
    padding: 7px 14px;
    background: #1D4ED8;
    color: #fff !important;
    border-radius: 8px;
    font-size: var(--q3-fs-xs);
    font-weight: 700;
    text-decoration: none !important;
    white-space: nowrap;
    flex-shrink: 0;
    transition: all .2s ease;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
:where(body[data-vista="homeapps"]) .sunat-alert-cta:hover { background:#1E40AF; box-shadow:0 4px 14px rgba(29,78,216,.35); transform:translateY(-1px); color:#fff !important; }

/* ── KPI strip ── */
:where(body[data-vista="homeapps"]) .kpi-row {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 12px;
    margin-bottom: 18px;
}
:where(body[data-vista="homeapps"]) .kpi-card {
    background: var(--q-surface,var(--q3-fondo, #fff));
    border-radius: 14px;
    padding: 16px 16px 13px;
    box-shadow: 0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.04);
    border: 1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    cursor: pointer;
    transition: all .2s ease;
    position: relative;
    overflow: hidden;
}
:where(body[data-vista="homeapps"]) .kpi-card::after {
    content:''; position:absolute; bottom:0;left:0;right:0; height:2px;
    background:var(--kpi-color,#1D4ED8);
    transform:scaleX(0); transition:transform .2s ease;
}
:where(body[data-vista="homeapps"]) .kpi-card:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,.08); }
:where(body[data-vista="homeapps"]) .kpi-card:hover::after { transform:scaleX(1); }
:where(body[data-vista="homeapps"]) .kpi-card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
:where(body[data-vista="homeapps"]) .kpi-card-label { font-size:var(--q3-fs-xs); font-weight:700; color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); text-transform:uppercase; letter-spacing:.06em; }
:where(body[data-vista="homeapps"]) .kpi-icon {
    width:36px; height:36px; border-radius:10px;
    display:flex; align-items:center; justify-content:center;
    background:var(--kpi-bg,rgba(29,78,216,.1));
    font-size:var(--q3-fs-lg);
}
:where(body[data-vista="homeapps"]) .kpi-icon i { color:var(--kpi-color,#1D4ED8); }
:where(body[data-vista="homeapps"]) .kpi-value {
    font-size:var(--q3-fs-3xl); font-weight:800; color:var(--kpi-color,#1D4ED8);
    line-height:1; letter-spacing:-.02em;
    font-family:var(--q-font-family);
}
:where(body[data-vista="homeapps"]) .kpi-sub { font-size:var(--q3-fs-2xs); color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); margin-top:4px; }
:where(body[data-vista="homeapps"]) .kpi-trend {
    display:inline-flex; align-items:center; gap:3px;
    font-size:var(--q3-fs-2xs); font-weight:700; margin-top:4px;
}
:where(body[data-vista="homeapps"]) .kpi-trend.up { color:#16A34A; }
:where(body[data-vista="homeapps"]) .kpi-trend.down { color:#EF4444; }
:where(body[data-vista="homeapps"]) .kpi-trend.neutral { color:var(--q3-texto-5, #94A3B8); }

/* ── Quick access ── */
:where(body[data-vista="homeapps"]) .quick-section {
    background: var(--q-surface,var(--q3-fondo, #fff));
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.04);
    border: 1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    margin-bottom: 18px;
}
:where(body[data-vista="homeapps"]) .section-title {
    font-size: var(--q3-fs-xs); font-weight:800; color:var(--q-text-2,var(--q3-texto-4, #64748B));
    text-transform:uppercase; letter-spacing:.08em;
    margin-bottom: 12px;
    display:flex; align-items:center; gap:7px;
}
:where(body[data-vista="homeapps"]) .quick-btns { display:flex; gap:8px; flex-wrap:wrap; }
:where(body[data-vista="homeapps"]) .quick-btn {
    display:inline-flex; align-items:center; gap:6px;
    padding:7px 14px;
    background: var(--q-surface-2,var(--q3-fondo-2, #F8FAFC));
    border:1.5px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    border-radius:20px;
    font-size:var(--q3-fs-sm); font-weight:600;
    color:var(--q-text-1,var(--q3-texto-1, #1E293B));
    text-decoration:none !important;
    transition:all .18s ease;
    white-space:nowrap;
}
:where(body[data-vista="homeapps"]) .quick-btn:hover {
    background:rgba(29,78,216,.07); border-color:#1D4ED8;
    color:#1D4ED8; box-shadow:0 2px 10px rgba(29,78,216,.12);
    transform:translateY(-1px); text-decoration:none !important;
}
:where(body[data-vista="homeapps"]) .quick-btn i { font-size:var(--q3-fs-sm); }
:where(body[data-vista="homeapps"]) .quick-btn-customize {
    margin-left:auto; padding:7px 12px;
    border-style:dashed; color:var(--q-text-3,var(--q3-texto-5, #94A3B8));
    background:transparent;
}
:where(body[data-vista="homeapps"]) .quick-btn-customize:hover { border-color:#1D4ED8; color:#1D4ED8; background:rgba(29,78,216,.04); }

/* ── Module grid ── */
:where(body[data-vista="homeapps"]) .modules-section { margin-bottom: 18px; }
:where(body[data-vista="homeapps"]) .homeapps-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(110px,1fr));
    gap:10px;
}
:where(body[data-vista="homeapps"]) .app-card {
    background:var(--q-surface,var(--q3-fondo, #fff));
    border-radius:14px;
    padding:18px 10px 13px;
    text-align:center;
    cursor:pointer;
    text-decoration:none !important;
    display:block;
    box-shadow:0 1px 2px rgba(0,0,0,.04),0 4px 10px rgba(0,0,0,.04);
    border:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    transition:all .2s ease;
    position:relative; overflow:hidden;
}
:where(body[data-vista="homeapps"]) .app-card::after {
    content:''; position:absolute; bottom:0;left:0;right:0;height:2px;
    background:var(--app-accent,#1D4ED8);
    transform:scaleX(0); transition:transform .2s ease;
}
:where(body[data-vista="homeapps"]) .app-card:hover { transform:translateY(-3px); box-shadow:0 8px 22px rgba(0,0,0,.1); border-color:var(--app-accent,#1D4ED8); text-decoration:none !important; }
:where(body[data-vista="homeapps"]) .app-card:hover::after { transform:scaleX(1); }
:where(body[data-vista="homeapps"]) .app-card:hover .app-icon-wrap { transform:scale(1.08); }
:where(body[data-vista="homeapps"]) .app-icon-wrap {
    width:52px; height:52px; border-radius:13px;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 10px;
    font-size:var(--q3-fs-2xl);
    transition:transform .2s ease,box-shadow .2s ease;
    box-shadow:0 4px 12px rgba(0,0,0,.18);
}
:where(body[data-vista="homeapps"]) .app-icon-wrap i { color:#fff !important; font-size:var(--q3-fs-2xl); }
:where(body[data-vista="homeapps"]) .app-nombre {
    font-size:var(--q3-fs-xs); font-weight:700;
    color:var(--q-text-1,var(--q3-texto-1, #1E293B));
    line-height:1.3; margin-top:1px;
}

/* ── SUNAT module card: logo image + alert badge ── */
/* Chip blanco (el logo trae sus propios colores rojo/azul); sin borde, misma sombra que el resto.
   Selector descendente (0,2,0) para ganar al !important de homeapps-refresh.css. */
:where(body[data-vista="homeapps"]) .app-card-sunat .app-icon-wrap {
    background:var(--q3-fondo, #fff) !important;
    border:0 !important;
    padding:8px;
    box-sizing:border-box;
    box-shadow:0 6px 14px rgba(15,23,42,.14) !important;
}
:where(body[data-vista="homeapps"]) .app-card-sunat .app-icon-wrap img { width:100%; height:100%; object-fit:contain; display:block; }
:where(body[data-vista="homeapps"]) .app-card-sunat.alerta { border-color:#EF4444; box-shadow:0 1px 2px rgba(0,0,0,.04),0 4px 14px rgba(239,68,68,.16); }
:where(body[data-vista="homeapps"]) .app-card-sunat.alerta:hover { border-color:#DC2626; box-shadow:0 8px 22px rgba(239,68,68,.25); }
:where(body[data-vista="homeapps"]) .app-badge-alert {
    position:absolute; top:8px; right:8px;
    min-width:20px; height:20px; padding:0 6px;
    display:inline-flex; align-items:center; justify-content:center;
    background:#EF4444; color:#fff !important;
    font-size:var(--q3-fs-xs); font-weight:800; line-height:1;
    border-radius:11px; border:2px solid var(--q-surface,#fff);
    box-shadow:0 2px 6px rgba(239,68,68,.45);
    animation:sunatPulse 1.6s ease-in-out infinite;
    z-index:2;
}
@keyframes sunatPulse {
    0%,100% { transform:scale(1);   box-shadow:0 0 0 0 rgba(239,68,68,.5); }
    50%     { transform:scale(1.1); box-shadow:0 0 0 6px rgba(239,68,68,0); }
}
:where(body[data-vista="homeapps"]) .app-status-pill {
    display:inline-flex; align-items:center; gap:4px;
    margin-top:5px; padding:2px 8px; border-radius:10px;
    font-size:var(--q3-fs-2xs); font-weight:800; letter-spacing:.02em;
}
:where(body[data-vista="homeapps"]) .app-status-pill.pend { background:rgba(239,68,68,.12); color:#DC2626; }
:where(body[data-vista="homeapps"]) .app-status-pill.ok { background:rgba(22,163,74,.12); color:#16A34A; }

/* Segunda fila con colores vivos como la primera (evita el aspecto opaco/oscuro de
   USUARIOS navy y REPORTES gris). !important + mayor especificidad para ganar tanto
   al --app-accent inline (PHP) como a las llaves de homeapps-refresh.css. */
:where(body[data-vista="homeapps"]) .app-card[title*="usuario" i] { --app-accent:#22C55E !important; background:#E9FBF0; } /* Usuarios → verde vivo  */
:where(body[data-vista="homeapps"]) .homeapps-grid .app-card[title*="reporte" i] { --app-accent:#6366F1 !important; background:#EEEEFE; } /* Reportes → índigo vivo */
:where(body[data-vista="homeapps"]) .app-card.app-card-sunat { background:#E9F1FB; }                                  /* SUNAT    → azul más presente (chip blanco con logo) */

/* ── Activity + Tasks row ── */
:where(body[data-vista="homeapps"]) .bottom-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:0; }
:where(body[data-vista="homeapps"]) .panel-card {
    background:var(--q-surface,var(--q3-fondo, #fff));
    border-radius:14px;
    border:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    box-shadow:0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.04);
    overflow:hidden;
}
:where(body[data-vista="homeapps"]) .panel-card-head {
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 16px 10px;
    border-bottom:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
}
:where(body[data-vista="homeapps"]) .panel-card-title { font-size:var(--q3-fs-sm); font-weight:800; color:var(--q-text-1,var(--q3-texto-1, #1E293B)); }
:where(body[data-vista="homeapps"]) .panel-card-action { font-size:var(--q3-fs-xs); color:var(--q-primary,#1D4ED8); font-weight:600; text-decoration:none; }
:where(body[data-vista="homeapps"]) .panel-card-action:hover { text-decoration:underline; }

/* Activity list */
:where(body[data-vista="homeapps"]) .activity-list { list-style:none; margin:0; padding:0; }
:where(body[data-vista="homeapps"]) .activity-item {
    display:flex; align-items:center; gap:10px;
    padding:9px 16px; border-bottom:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    font-size:var(--q3-fs-sm);
}
:where(body[data-vista="homeapps"]) .activity-item:last-child { border-bottom:none; }
:where(body[data-vista="homeapps"]) .activity-dot { width:7px;height:7px;border-radius:50%;flex-shrink:0; }
:where(body[data-vista="homeapps"]) .activity-dot.success { background:#16A34A; }
:where(body[data-vista="homeapps"]) .activity-dot.info { background:#1D4ED8; }
:where(body[data-vista="homeapps"]) .activity-dot.warn { background:#F59E0B; }
:where(body[data-vista="homeapps"]) .activity-time { color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); font-size:var(--q3-fs-xs); width:36px; flex-shrink:0; }
:where(body[data-vista="homeapps"]) .activity-desc { flex:1; color:var(--q-text-1,var(--q3-texto-1, #1E293B)); font-weight:500; }
:where(body[data-vista="homeapps"]) .activity-badge {
    font-size:var(--q3-fs-2xs); font-weight:700; padding:2px 8px; border-radius:10px;
    flex-shrink:0;
}
:where(body[data-vista="homeapps"]) .badge-success { background:rgba(22,163,74,.1); color:#16A34A; }
:where(body[data-vista="homeapps"]) .badge-info { background:rgba(29,78,216,.1); color:#1D4ED8; }

/* Tasks list */
:where(body[data-vista="homeapps"]) .tasks-list { list-style:none; margin:0; padding:0; }
:where(body[data-vista="homeapps"]) .task-item {
    display:flex; align-items:center; gap:10px;
    padding:9px 16px; border-bottom:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    font-size:var(--q3-fs-sm);
}
:where(body[data-vista="homeapps"]) .task-item:last-child { border-bottom:none; }
:where(body[data-vista="homeapps"]) .task-checkbox { width:15px;height:15px;border:2px solid var(--q-border,var(--q3-borde-2, #E5E7EB));border-radius:4px;flex-shrink:0; }
:where(body[data-vista="homeapps"]) .task-desc { flex:1; color:var(--q-text-1,var(--q3-texto-1, #1E293B)); font-weight:500; }
:where(body[data-vista="homeapps"]) .task-count {
    font-size:var(--q3-fs-xs); font-weight:800; padding:2px 8px; border-radius:10px;
    flex-shrink:0;
}
:where(body[data-vista="homeapps"]) .task-count.red { background:rgba(239,68,68,.1);  color:#EF4444; }
:where(body[data-vista="homeapps"]) .task-count.amber { background:rgba(245,158,11,.1); color:#D97706; }
:where(body[data-vista="homeapps"]) .task-count.blue { background:rgba(29,78,216,.1);  color:#1D4ED8; }
:where(body[data-vista="homeapps"]) .task-count.green { background:rgba(22,163,74,.1);  color:#16A34A; }

/* ── RIGHT PANEL cards ── */
:where(body[data-vista="homeapps"]) .rp-card {
    background:var(--q-surface,var(--q3-fondo, #fff));
    border-radius:14px;
    border:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    box-shadow:0 1px 3px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.04);
    overflow:hidden;
}
:where(body[data-vista="homeapps"]) .rp-card-head {
    display:flex; align-items:center; gap:8px;
    padding:12px 14px 10px;
    border-bottom:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    font-size:var(--q3-fs-sm); font-weight:800; color:var(--q-text-1,var(--q3-texto-1, #1E293B));
}
:where(body[data-vista="homeapps"]) .rp-card-head i { font-size:var(--q3-fs-md); color:var(--q-primary,#1D4ED8); }
:where(body[data-vista="homeapps"]) .rp-card-head .rp-head-action { margin-left:auto; font-size:var(--q3-fs-2xs); color:var(--q-primary,#1D4ED8); font-weight:600; text-decoration:none; }

/* Shortcuts table */
:where(body[data-vista="homeapps"]) .shortcuts-table { width:100%; }
:where(body[data-vista="homeapps"]) .shortcuts-table tr td { padding:6px 14px; font-size:var(--q3-fs-xs); vertical-align:middle; border:none; background:transparent !important; }
:where(body[data-vista="homeapps"]) .shortcuts-table tr:hover td { background:var(--q-surface-2,var(--q3-fondo-2, #F8FAFC)) !important; }
:where(body[data-vista="homeapps"]) .shortcut-key {
    display:inline-flex; align-items:center; gap:3px;
    background:var(--q-surface-2,var(--q3-fondo-2, #F8FAFC));
    border:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    border-radius:6px; padding:3px 7px;
    font-size:var(--q3-fs-2xs); font-weight:700; font-family:inherit;
    color:var(--q-text-2,var(--q3-texto-4, #64748B)); white-space:nowrap;
}
:where(body[data-vista="homeapps"]) .shortcut-desc { color:var(--q-text-2,var(--q3-texto-4, #64748B)); font-size:var(--q3-fs-xs); }

/* Notifications in right panel */
:where(body[data-vista="homeapps"]) .rp-notif-list { list-style:none; margin:0; padding:0; }
:where(body[data-vista="homeapps"]) .rp-notif-item {
    display:flex; align-items:flex-start; gap:9px;
    padding:9px 14px; border-bottom:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    font-size:var(--q3-fs-xs);
}
:where(body[data-vista="homeapps"]) .rp-notif-item:last-child { border-bottom:none; }
:where(body[data-vista="homeapps"]) .rp-notif-dot { width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:3px; }
:where(body[data-vista="homeapps"]) .rp-notif-dot.red { background:#EF4444; }
:where(body[data-vista="homeapps"]) .rp-notif-dot.amber { background:#F59E0B; }
:where(body[data-vista="homeapps"]) .rp-notif-dot.blue { background:#1D4ED8; }
:where(body[data-vista="homeapps"]) .rp-notif-body { flex:1; }
:where(body[data-vista="homeapps"]) .rp-notif-text { color:var(--q-text-1,var(--q3-texto-1, #1E293B)); font-weight:500; line-height:1.35; }
:where(body[data-vista="homeapps"]) .rp-notif-when { color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); font-size:var(--q3-fs-2xs); margin-top:2px; }

/* Daily tip card */
:where(body[data-vista="homeapps"]) .rp-tip-body {
    padding:12px 14px 14px;
    display:flex; gap:10px; align-items:flex-start;
}
:where(body[data-vista="homeapps"]) .rp-tip-icon { font-size:var(--q3-fs-2xl); flex-shrink:0; }
:where(body[data-vista="homeapps"]) .rp-tip-text { font-size:var(--q3-fs-xs); color:var(--q-text-2,var(--q3-texto-4, #64748B)); line-height:1.55; }
:where(body[data-vista="homeapps"]) .rp-tip-text strong { color:var(--q-text-1,var(--q3-texto-1, #1E293B)); display:block; margin-bottom:3px; }

/* Footer strip */
:where(body[data-vista="homeapps"]) .homeapps-footer {
    text-align:center; padding:16px 0 0;
    color:var(--q-text-3,var(--q3-texto-5, #94A3B8)); font-size:var(--q3-fs-xs);
    border-top:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB)); margin-top:20px;
}
:where(body[data-vista="homeapps"]) .homeapps-footer strong { color:var(--q-primary,#1D4ED8); font-weight:800; }

/* Comfort strip */
:where(body[data-vista="homeapps"]) .comfort-strip {
    display:flex; align-items:center; gap:14px;
    background:var(--q-surface,var(--q3-fondo, #fff));
    border:1px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    border-radius:12px; padding:13px 18px; margin-bottom:18px;
}
:where(body[data-vista="homeapps"]) .comfort-strip-icon { font-size:var(--q3-fs-4xl); flex-shrink:0; }
:where(body[data-vista="homeapps"]) .comfort-strip-text strong { font-size:var(--q3-fs-md); font-weight:700; color:var(--q-text-1,var(--q3-texto-1, #1E293B)); }
:where(body[data-vista="homeapps"]) .comfort-strip-text span { font-size:var(--q3-fs-sm); color:var(--q-text-2,var(--q3-texto-4, #64748B)); display:block; }
:where(body[data-vista="homeapps"]) .comfort-strip-btn {
    margin-left:auto; padding:8px 16px;
    border:1.5px solid var(--q-border,var(--q3-borde-2, #E5E7EB));
    border-radius:8px; font-size:var(--q3-fs-sm); font-weight:700;
    color:var(--q-text-1,var(--q3-texto-1, #1E293B)); background:transparent;
    cursor:pointer; transition:all .18s ease; white-space:nowrap; flex-shrink:0;
    text-decoration:none !important;
}
:where(body[data-vista="homeapps"]) .comfort-strip-btn:hover { background:var(--q-primary,#1D4ED8); color:#fff; border-color:var(--q-primary,#1D4ED8); }

@media(max-width:1100px) { :where(body[data-vista="homeapps"]) .homeapps-right { flex:0 0 230px; width:230px; } }
@media(max-width:900px)  { :where(body[data-vista="homeapps"]) .homeapps-right { display:none; } :where(body[data-vista="homeapps"]) .homeapps-main { padding-right:0; } }
@media(max-width:768px)  { :where(body[data-vista="homeapps"]) .kpi-row { grid-template-columns:repeat(2,1fr); } :where(body[data-vista="homeapps"]) .homeapps-page { padding:14px; } }
@media(max-width:520px)  { :where(body[data-vista="homeapps"]) .bottom-row { grid-template-columns:1fr; } }

/* ── importoc (core/app/view/importoc-view.php) ──────────────────────────────────────────────────── */
/* CLI-RUC-001 · tres colores porque son TRES situaciones, no dos: activo y habido;
   activo pero NO HABIDO —aviso, no bloqueo—; y de baja o suspendido, que no puede
   emitir facturas válidas. A un proveedor no habido se le compra igual, pero el
   crédito fiscal de esa compra es otra conversación: mejor saberlo antes de darlo de alta. */
:where(body[data-vista="importoc"]) .imp-padron { display:block; margin-top:4px; font-size:var(--q3-fs-sm); font-weight:600; }
:where(body[data-vista="importoc"]) .imp-padron--valido { color: var(--q-color-success, #16A34A); }
:where(body[data-vista="importoc"]) .imp-padron--observado { color: #B45309; }
:where(body[data-vista="importoc"]) .imp-padron--invalido { color: var(--q-color-danger, #DC2626); }

/* ── liquidarconsignacion (core/app/view/liquidarconsignacion-view.php) ──────────────────────────────────────── */
:where(body[data-vista="liquidarconsignacion"]) .lq-tabla input {max-width:96px;text-align:right}
:where(body[data-vista="liquidarconsignacion"]) .lq-num {text-align:right;font-variant-numeric:tabular-nums}
:where(body[data-vista="liquidarconsignacion"]) .lq-vendido {font-weight:700}
:where(body[data-vista="liquidarconsignacion"]) .lq-err {color:#b91c1c;font-weight:700}
:where(body[data-vista="liquidarconsignacion"]) .lq-total {font-size:var(--q3-fs-2xl);font-weight:700}
:where(body[data-vista="liquidarconsignacion"]) .lq-modo label {margin-right:18px;font-weight:600}

/* ── modules (core/app/view/modules-view.php) ───────────────────────────────────────────────────── */
/* Botones del panel de visibilidad: escapan la regla de icono-cuadrado
						   de las tablas (modern.css: td .btn-xs => 30px) usando btn-sm + clase propia.
						   Se prefija con #tblVisibilidad para ganar en especificidad a modern.css
						   (.panel-body .btn:not(...) => padding:0 !important). */
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-vis-btn.btn { width:auto !important; min-width:92px;
							height:32px !important; padding:4px 12px !important; white-space:nowrap;
							font-weight:500; font-size:var(--q3-fs-md) !important; border-radius:6px;
							line-height:1.4; display:inline-flex; align-items:center;
							justify-content:center; }
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-vis-btn.btn .bi { margin-right:6px; }
						:where(body[data-vista="modules"]) #tblVisibilidad td { vertical-align:middle; }
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-estado-badge--visible { background:#00a65a; color:#fff; }
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-estado-badge--oculta { background:#d2d6de; color:#444; }
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-estado-badge { display:inline-block; font-size:var(--q3-fs-sm);
							padding:5px 12px; border-radius:12px; }
						/* Switch moderno (Visible / Oculto) */
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch { display:inline-flex; align-items:center; gap:10px; cursor:pointer; user-select:none; margin:0; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch input { position:absolute; opacity:0; width:0; height:0; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch__track { position:relative; width:50px; height:26px; border-radius:999px;
							background:#cbd5e1; transition:background .2s ease; flex:0 0 auto; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch__thumb { position:absolute; top:3px; left:3px; width:20px; height:20px;
							border-radius:50%; background:var(--q3-fondo, #fff); box-shadow:0 1px 3px rgba(0,0,0,.35); transition:left .2s ease; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch input:checked + .q-switch__track { background:#22c55e; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch input:checked + .q-switch__track .q-switch__thumb { left:27px; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch input:disabled + .q-switch__track { opacity:.5; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch__label { font-size:var(--q3-fs-md); font-weight:600; min-width:52px; text-align:left; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch input:checked ~ .q-switch__label { color:#16a34a; }
						:where(body[data-vista="modules"]) #tblVisibilidad .q-switch input:not(:checked) ~ .q-switch__label { color:var(--q3-texto-5, #94a3b8); }
						/* Filtro segmentado Visibles / Todos / Ocultos */
						:where(body[data-vista="modules"]) .q-seg { display:inline-flex; border:1px solid var(--q3-borde-3, #cbd5e1); border-radius:8px; overflow:hidden; background:var(--q3-fondo-3, #f1f5f9); }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn { border:none !important; background:transparent !important; padding:7px 18px !important; margin:0 !important; font-size:var(--q3-fs-md) !important; font-weight:600; color:var(--q3-texto-3, #475569); cursor:pointer; height:auto !important; width:auto !important; border-radius:0 !important; line-height:1.4; }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn + .q-seg__btn { border-left:1px solid var(--q3-borde-3, #cbd5e1) !important; }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn .bi { margin-right:6px; }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn.active { color:#fff !important; }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn--on.active { background:#16a34a !important; }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn--all.active { background:#334155 !important; }
						:where(body[data-vista="modules"]) .q-seg .q-seg__btn--off.active { background:#dc2626 !important; }
						/* Botón IR (acceso directo a la vista) */
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-ir-btn { display:inline-flex; align-items:center; gap:5px; padding:5px 12px; border-radius:6px; background:#1e3a8a; color:#fff !important; font-size:var(--q3-fs-sm); font-weight:600; text-decoration:none !important; }
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-ir-btn:hover { background:#16327a; color:#fff !important; }
						:where(body[data-vista="modules"]) #tblVisibilidad .sec-ir-btn .bi { margin:0 !important; }

/* ── ncexterna (core/app/view/ncexterna-view.php) ─────────────────────────────────────────────────── */
:where(body[data-vista="ncexterna"]) .nx { padding:4px 2px 24px; color:#1f2937; }
:where(body[data-vista="ncexterna"]) .nx-card { background:var(--q3-fondo, #fff); border:1px solid var(--q3-borde-2, #e5e7eb); border-radius:12px; margin-bottom:14px; }
:where(body[data-vista="ncexterna"]) .nx-hd { display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid #eef2f7; flex-wrap:wrap; }
:where(body[data-vista="ncexterna"]) .nx-hd h3 { font-size:var(--q3-fs-xl); font-weight:800; margin:0; color:var(--q3-texto, #0f172a); }
:where(body[data-vista="ncexterna"]) .nx-hd p { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); margin:2px 0 0; }
:where(body[data-vista="ncexterna"]) .nx-hd .nx-sp { margin-left:auto; }
:where(body[data-vista="ncexterna"]) .nx-body { padding:14px 16px; }
:where(body[data-vista="ncexterna"]) .nx-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:10px 14px; }
:where(body[data-vista="ncexterna"]) .nx-fld { display:flex; flex-direction:column; gap:3px; }
:where(body[data-vista="ncexterna"]) .nx-fld label { font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; margin:0; }
:where(body[data-vista="ncexterna"]) .nx-fld input, :where(body[data-vista="ncexterna"]) .nx-fld select, :where(body[data-vista="ncexterna"]) .nx-fld textarea { border:1px solid #d1d5db; border-radius:8px; padding:6px 9px; font-size:var(--q3-fs-lg); height:34px; box-sizing:border-box; }
:where(body[data-vista="ncexterna"]) .nx-fld textarea { height:auto; }
:where(body[data-vista="ncexterna"]) .nx-btn { border:1px solid transparent; border-radius:8px; height:34px; padding:0 12px; font-size:var(--q3-fs-md); font-weight:600; display:inline-flex; align-items:center; gap:6px; cursor:pointer; white-space:nowrap; text-decoration:none; }
:where(body[data-vista="ncexterna"]) .nx-btn--azul { background:#2563eb; color:#fff; }
:where(body[data-vista="ncexterna"]) .nx-btn--verde { background:#16a34a; color:#fff; }
:where(body[data-vista="ncexterna"]) .nx-btn--gris { background:#fff; border-color:#d1d5db; color:#374151; }
:where(body[data-vista="ncexterna"]) .nx-btn--naranja { background:#f97316; color:#fff; }
:where(body[data-vista="ncexterna"]) .nx-btn:hover { filter:brightness(.95); }
:where(body[data-vista="ncexterna"]) .nx-btn--sm { height:28px; padding:0 9px; font-size:var(--q3-fs-sm); }
:where(body[data-vista="ncexterna"]) .nx-tbl { width:100%; border-collapse:collapse; font-size:var(--q3-fs-md); }
:where(body[data-vista="ncexterna"]) .nx-tbl th, :where(body[data-vista="ncexterna"]) .nx-tbl td { padding:8px 12px; border-bottom:1px solid #f1f5f9; text-align:left; vertical-align:middle; }
:where(body[data-vista="ncexterna"]) .nx-tbl th { font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; background:#fafbfc; }
:where(body[data-vista="ncexterna"]) .nx-tbl .r { text-align:right; white-space:nowrap; }
:where(body[data-vista="ncexterna"]) .nx-pill { display:inline-block; padding:2px 8px; border-radius:20px; font-size:var(--q3-fs-xs); font-weight:700; }
:where(body[data-vista="ncexterna"]) .nx-pill--ok { background:#dcfce7; color:#166534; }
:where(body[data-vista="ncexterna"]) .nx-pill--saldo { background:#fef3c7; color:#92400e; }
:where(body[data-vista="ncexterna"]) .nx-aviso { padding:14px 16px; border-radius:10px; background:#fff7ed; border:1px solid #fed7aa; color:#9a3412; }
:where(body[data-vista="ncexterna"]) .nx-nota { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); }
:where(body[data-vista="ncexterna"]) .nx-lineas td { padding:5px 6px; }
:where(body[data-vista="ncexterna"]) .nx-lineas input, :where(body[data-vista="ncexterna"]) .nx-lineas select { width:100%; border:1px solid #d1d5db; border-radius:6px; padding:4px 6px; font-size:var(--q3-fs-md); height:30px; box-sizing:border-box; }
:where(body[data-vista="ncexterna"]) .nx-stock { display:none; }
:where(body[data-vista="ncexterna"]) .nx-lineas.con-stock .nx-stock { display:table-cell; }
:where(body[data-vista="ncexterna"]) .nx-total { font-size:var(--q3-fs-2xl); font-weight:800; color:#1d4ed8; }

/* ── newordencompra (core/app/view/newordencompra-view.php) ────────────────────────────────────────────── */
:where(body[data-vista="newordencompra"]) #tblLineas input.q-input { text-align:right; max-width:120px; }
    :where(body[data-vista="newordencompra"]) .oc-tot { display:flex; justify-content:flex-end; gap:28px; margin-top:10px; font-size:var(--q3-fs-md); }
    :where(body[data-vista="newordencompra"]) .oc-tot b { font-size:var(--q3-fs-lg); }
    :where(body[data-vista="newordencompra"]) .oc-fila { display:flex; gap:6px; align-items:center; }
    :where(body[data-vista="newordencompra"]) .oc-fila__crece { flex:1 1 auto; min-width:0; }
    :where(body[data-vista="newordencompra"]) .oc-fila > .q-btn { white-space:nowrap; }
    :where(body[data-vista="newordencompra"]) .oc-op { font-size:var(--q3-fs-xs); font-weight:600; margin-left:6px; }
    :where(body[data-vista="newordencompra"]) .oc-op--quitar { color:#b91c1c; }
    :where(body[data-vista="newordencompra"]) .oc-box { margin-top:8px; padding:10px; border:1px dashed #94a3b8; border-radius:6px; background:var(--q3-fondo-2, #f8fafc); }
    :where(body[data-vista="newordencompra"]) .oc-box__act { display:flex; gap:6px; justify-content:flex-end; margin-top:8px; }

/* ── newproduct (core/app/view/newproduct-view.php) ────────────────────────────────────────────────── */
/* OPT-PROD-UX: resalte de código duplicado (gana al borde por defecto del input). */
:where(body[data-vista="newproduct"]) #codigo.codigo-dup { border-color:#EF4444 !important; box-shadow:0 0 0 2px rgba(239,68,68,.15) !important; }

/* ── newquote (core/app/view/newquote-view.php) ──────────────────────────────────────────────────── */
/* Mismo ancho que el popup del maestro de Clientes: cuatro campos por fila. */
		:where(body[data-vista="newquote"]) #exampleModal .modal-dialog { width: 1100px !important; max-width: 96vw !important; }
		:where(body[data-vista="newquote"]) #modalcliente #nombre, :where(body[data-vista="newquote"]) #modalcliente #direccion, :where(body[data-vista="newquote"]) #modalcliente #notas { text-transform: uppercase; }

/* ── newrental (core/app/view/newrental-view.php) ─────────────────────────────────────────────────── */
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr { padding:16px 20px 36px; background:#F7F9FC; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-h { font-size:var(--q3-fs-2xl); font-weight:800; color:var(--q3-texto-1, #1E293B); margin-bottom:14px; display:flex; align-items:center; gap:10px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-h .hint { font-size:var(--q3-fs-xs); font-weight:600; color:#16A34A; background:rgba(34,197,94,.1); padding:3px 10px; border-radius:999px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-grid { display:grid; grid-template-columns:300px 1fr 340px; gap:16px; align-items:start; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-card { background:var(--q3-fondo, #fff); border:1px solid #EDF2F7; border-radius:16px; box-shadow:0 6px 18px rgba(15,23,42,.05); padding:16px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-card h4 { margin:0 0 12px; font-size:var(--q3-fs-md); font-weight:800; color:var(--q3-texto-1, #1E293B); }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-label { font-size:var(--q3-fs-xs); font-weight:700; color:var(--q3-texto-3, #475569); margin:10px 0 5px; display:block; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-input, :where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-select { width:100%; height:38px; border:1px solid var(--q3-borde, #E2E8F0); border-radius:8px; padding:0 10px; font-size:var(--q3-fs-md); box-sizing:border-box; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) textarea.nr-input { height:64px; padding:8px 10px; }
:where(body[data-vista="newrental"].dark-mode, body[data-vista="notaalquiler"].dark-mode) #nrPago { color:var(--q-text-1) !important; }
/* Centro: búsqueda POS */
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-search { display:flex; gap:8px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-search input { flex:1; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-go { background:linear-gradient(135deg,#4F46E5,#2563EB); color:#fff; border:none; border-radius:8px; padding:0 16px; font-weight:700; cursor:pointer; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res { margin-top:12px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res table { width:100%; border-collapse:collapse; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res th { font-size:var(--q3-fs-xs); text-transform:uppercase; color:var(--q3-texto-1, #1E293B); font-weight:800; text-align:center; padding:7px 10px; border-bottom:1px solid #F1F5F9; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res td { font-size:var(--q3-fs-sm); padding:7px 10px; border-bottom:1px solid #F5F7FA; text-align:center; vertical-align:middle; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res th:first-child, :where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res td:first-child { text-align:left; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-res .nr-mini { text-align:center; margin:0 auto; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .ok { color:#16A34A; font-weight:800; } :where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .no { color:#DC2626; font-weight:800; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .reg { color:#B45309; font-weight:700; font-size:var(--q3-fs-xs); }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-add { background:#2563EB; color:#fff; border:none; border-radius:7px; padding:5px 11px; font-size:var(--q3-fs-xs); font-weight:700; cursor:pointer; }
/* Derecha: carrito + resumen (sticky) */
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-sum { position:sticky; top:16px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-cart { margin-bottom:10px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-cart table { width:100%; border-collapse:collapse; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-cart td { font-size:var(--q3-fs-sm); padding:6px 4px; border-bottom:1px solid #F5F7FA; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-cart .del { background:#DC2626; color:#fff; border:none; border-radius:6px; padding:2px 7px; cursor:pointer; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-empty { color:var(--q3-texto-5, #94A3B8); font-size:var(--q3-fs-sm); text-align:center; padding:14px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-row { display:flex; justify-content:space-between; font-size:var(--q3-fs-md); padding:5px 0; border-bottom:1px dashed #EEF2F7; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-row.tot { font-size:var(--q3-fs-xl); font-weight:800; color:var(--q3-texto-1, #1E293B); border-bottom:none; margin-top:6px; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-radio { display:flex; gap:10px; margin:4px 0; flex-wrap:wrap; } :where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-radio label { font-size:var(--q3-fs-sm); font-weight:600; color:var(--q3-texto-2, #334155); }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-mini { height:32px; font-size:var(--q3-fs-sm); }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-register { width:100%; margin-top:14px; padding:13px; border:none; border-radius:12px; font-size:var(--q3-fs-lg); font-weight:800;
               background:linear-gradient(135deg,#16A34A,#15803D); color:#fff; cursor:pointer; }
:where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-register:disabled { opacity:.6; cursor:not-allowed; }
@media(max-width:1100px){ :where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-grid { grid-template-columns:1fr; } :where(body[data-vista="newrental"], body[data-vista="notaalquiler"]) .nr-sum { position:static; } }

/* ── newuser (core/app/view/newuser-view.php) ───────────────────────────────────────────────────── */
:where(body[data-vista="newuser"]) .nu-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(360px, 1fr)); gap:16px; }
				:where(body[data-vista="newuser"]) .nu-blq { border:1px solid var(--q-border, var(--q3-borde, #e2e8f0)); border-radius:12px; padding:12px 14px 6px; margin:0; }
				:where(body[data-vista="newuser"]) .nu-blq legend { float:none; width:auto; font-size:var(--q3-fs-md); font-weight:800; color:#1e3a8a; padding:0 6px; margin:0; }
				:where(body[data-vista="newuser"]) .nu-fila { display:grid; grid-template-columns:1fr 1fr; gap:10px 12px; margin-bottom:10px; }
				:where(body[data-vista="newuser"]) .nu-ayuda { display:block; font-size:var(--q3-fs-xs); color:var(--q3-texto-4, #64748b); margin-top:3px; }
				:where(body[data-vista="newuser"]) .nu-ayuda.is-mal { color:#b91c1c; font-weight:600; } :where(body[data-vista="newuser"]) .nu-ayuda.is-ok { color:#15803d; font-weight:600; }
				:where(body[data-vista="newuser"]) .nu-clave { display:flex; gap:8px; align-items:center; font-size:var(--q3-fs-sm); color:var(--q3-texto-3, #475569); background:var(--q3-fondo-2, #f8fafc); border-radius:10px; padding:8px 10px; }
				:where(body[data-vista="newuser"]) .nu-clave > em { font-size:var(--q3-fs-2xl); color:#1e3a8a; }
				:where(body[data-vista="newuser"]) .nu-acc { display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
				:where(body[data-vista="newuser"]) .nu-chip { font-size:var(--q3-fs-sm); font-weight:700; background:rgba(255,255,255,.18); border-radius:999px; padding:2px 10px; margin-left:8px; }
				:where(body[data-vista="newuser"]) .nu-chip--amb { background:#fef3c7; color:#92400e; }
				:where(body[data-vista="newuser"]) .nu-cred { text-align:left; }
				:where(body[data-vista="newuser"]) .nu-cred dl { display:grid; grid-template-columns:110px 1fr; gap:8px 10px; align-items:center; margin:12px 0; }
				:where(body[data-vista="newuser"]) .nu-cred dt { color:var(--q3-texto-4, #64748b); font-weight:600; font-size:var(--q3-fs-md); }
				:where(body[data-vista="newuser"]) .nu-cred dd { margin:0; font-family:var(--q3-font-mono); font-size:var(--q3-fs-2xl); font-weight:800; color:var(--q3-texto, #0f172a); background:var(--q3-fondo-3, #f1f5f9); border-radius:8px; padding:6px 10px; display:flex; justify-content:space-between; align-items:center; gap:8px; }
				:where(body[data-vista="newuser"]) .nu-cred dd button { border:0; background:#1e3a8a; color:#fff; border-radius:6px; font-size:var(--q3-fs-sm); padding:3px 9px; font-family:inherit; }
				:where(body[data-vista="newuser"]) .nu-cred p { font-size:var(--q3-fs-sm); color:#92400e; background:#fffbeb; border:1px solid #fde68a; border-radius:8px; padding:8px 10px; margin:0; }
				:where(body[data-vista="newuser"]) .nu-fila--1 { grid-template-columns:1fr; }
				@media (max-width: 575px){ :where(body[data-vista="newuser"]) .nu-fila { grid-template-columns:1fr; } }

/* ── notaalquiler (core/app/view/notaalquiler-view.php) ──────────────────────────────────────────────── */
:where(body[data-vista="notaalquiler"]) .na { padding:18px 22px 36px; background:#F7F9FC; }
:where(body[data-vista="notaalquiler"]) .na-card { background:var(--q3-fondo, #fff); border:1px solid #EDF2F7; border-radius:16px; box-shadow:0 6px 18px rgba(15,23,42,.05); padding:18px; max-width:880px; margin:0 auto 16px; }
:where(body[data-vista="notaalquiler"]) .na-q { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748B); margin-bottom:10px; }
:where(body[data-vista="notaalquiler"]) .na-h { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
:where(body[data-vista="notaalquiler"]) .na-h .num { font-size:var(--q3-fs-2xl); font-weight:800; color:var(--q3-texto-1, #1E293B); }
:where(body[data-vista="notaalquiler"]) .na-chip { font-size:var(--q3-fs-xs); font-weight:800; padding:3px 12px; border-radius:999px; background:#EEF4FF; color:#2563EB; }
:where(body[data-vista="notaalquiler"]) .na-chip.fin { background:rgba(245,158,11,.12); color:#B45309; }
/* línea de tiempo */
:where(body[data-vista="notaalquiler"]) .na-meta { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; font-size:var(--q3-fs-md); color:var(--q3-texto-2, #334155); margin-bottom:14px; }
:where(body[data-vista="notaalquiler"]) .na-meta b { color:var(--q3-texto-4, #64748B); font-weight:700; display:block; font-size:var(--q3-fs-xs); text-transform:uppercase; }
:where(body[data-vista="notaalquiler"]) .na-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
:where(body[data-vista="notaalquiler"]) .na-table { width:100%; border-collapse:collapse; }
:where(body[data-vista="notaalquiler"]) .na-table th, :where(body[data-vista="notaalquiler"]) .na-table td { white-space:nowrap; }
:where(body[data-vista="notaalquiler"]) .na-table th:first-child, :where(body[data-vista="notaalquiler"]) .na-table td:first-child { white-space:normal; min-width:120px; }
:where(body[data-vista="notaalquiler"]) .na-table th { font-size:var(--q3-fs-2xs); text-transform:uppercase; color:var(--q3-texto-5, #94A3B8); text-align:left; padding:8px; border-bottom:1px solid #F1F5F9; }
:where(body[data-vista="notaalquiler"]) .na-table td { font-size:var(--q3-fs-sm); padding:8px; border-bottom:1px solid #F5F7FA; }
/* cargos adicionales (desglose económico) */
:where(body[data-vista="notaalquiler"]) .na-charges { margin-top:14px; }
:where(body[data-vista="notaalquiler"]) .na-charges .lbl { font-size:var(--q3-fs-xs); font-weight:800; color:var(--q3-texto-5, #94A3B8); text-transform:uppercase; margin-bottom:4px; letter-spacing:.03em; }
:where(body[data-vista="notaalquiler"]) .na-table--charges td { border-bottom:1px dashed #F1F5F9; }
:where(body[data-vista="notaalquiler"]) .na-cg-tipo { font-weight:700; color:var(--q3-texto-2, #334155); }
:where(body[data-vista="notaalquiler"]) .na-cg-desc { color:var(--q3-texto-5, #94A3B8); font-size:var(--q3-fs-xs); margin-left:8px; }
:where(body[data-vista="notaalquiler"]) .na-cg-monto { text-align:right; font-weight:800; white-space:nowrap; }
:where(body[data-vista="notaalquiler"]) .na-cg-monto.pos { color:#B45309; }
:where(body[data-vista="notaalquiler"]) .na-cg-monto.neg { color:#0F766E; }
:where(body[data-vista="notaalquiler"]) .na-tot { display:flex; justify-content:flex-end; gap:24px; margin-top:12px; font-size:var(--q3-fs-lg); }
:where(body[data-vista="notaalquiler"]) .na-tot .t { font-weight:800; }
:where(body[data-vista="notaalquiler"]) .na-block { margin-top:16px; border-top:1px dashed var(--q3-borde, #E2E8F0); padding-top:12px; }
:where(body[data-vista="notaalquiler"]) .na-block .lbl { font-size:var(--q3-fs-sm); font-weight:800; color:var(--q3-texto-4, #64748B); text-transform:uppercase; margin-bottom:8px; }
/* fila en 2 columnas: Documento de Pago | Evidencias */
:where(body[data-vista="notaalquiler"]) .na-split { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
:where(body[data-vista="notaalquiler"]) .na-col { min-width:0; }
:where(body[data-vista="notaalquiler"]) .na-doc-meta { display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; font-size:var(--q3-fs-md); color:var(--q3-texto-2, #334155); margin-bottom:12px; }
:where(body[data-vista="notaalquiler"]) .na-doc-meta > div { display:flex; flex-direction:column; }
:where(body[data-vista="notaalquiler"]) .na-doc-meta .k { color:var(--q3-texto-5, #94A3B8); font-weight:700; font-size:var(--q3-fs-2xs); text-transform:uppercase; margin-bottom:2px; }
:where(body[data-vista="notaalquiler"]) .na-doc-meta .v { font-weight:700; }
/* botón "Abrir documento" resaltado */
:where(body[data-vista="notaalquiler"]) .na-btn--doc { background:linear-gradient(135deg,#2563EB,#1D4ED8); color:#fff; border:none; box-shadow:0 3px 10px rgba(37,99,235,.28);
               transition:transform .2s ease, box-shadow .2s ease, filter .2s ease; }
/* contenido SIEMPRE blanco, incluso como <a> (vence al a:hover legacy) */
:where(body[data-vista="notaalquiler"]) .na-btn--doc, :where(body[data-vista="notaalquiler"]) .na-btn--doc:hover, :where(body[data-vista="notaalquiler"]) .na-btn--doc:focus, :where(body[data-vista="notaalquiler"]) .na-btn--doc:active { color:#fff; }
:where(body[data-vista="notaalquiler"]) .na-btn--doc:hover { transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 8px 18px rgba(37,99,235,.34); }
:where(body[data-vista="notaalquiler"]) .na-btn--doc:active { transform:translateY(1px); box-shadow:0 3px 8px rgba(37,99,235,.30); }
:where(body[data-vista="notaalquiler"]) .na-btn--doc:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(147,197,253,.75), 0 8px 18px rgba(37,99,235,.30); }
:where(body[data-vista="notaalquiler"]) .na-btn--danger { background:#FEF2F2; border:1px solid #FECACA; color:#DC2626; cursor:pointer; }
:where(body[data-vista="notaalquiler"]) .na-btn--danger:hover { background:#FEE2E2; }
/* evidencias */
:where(body[data-vista="notaalquiler"]) .na-evi-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
:where(body[data-vista="notaalquiler"]) .na-btn--evi { background:#EFF6FF; border:1px solid #BFDBFE; color:#2563EB; cursor:pointer; padding:7px 12px; font-size:var(--q3-fs-sm); }
:where(body[data-vista="notaalquiler"]) .na-btn--evi:hover { background:#DBEAFE; }
:where(body[data-vista="notaalquiler"]) .na-evi-empty { font-size:var(--q3-fs-sm); color:var(--q3-texto-5, #94A3B8); line-height:1.6; }
:where(body[data-vista="notaalquiler"]) .na-evi-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:8px; }
:where(body[data-vista="notaalquiler"]) .na-evi-item { position:relative; display:block; border-radius:10px; overflow:hidden; border:1px solid var(--q3-borde, #E2E8F0); aspect-ratio:1/1; background:var(--q3-fondo-3, #F1F5F9); }
:where(body[data-vista="notaalquiler"]) .na-evi-item img { width:100%; height:100%; object-fit:cover; display:block; }
:where(body[data-vista="notaalquiler"]) .na-evi-item { padding:0; cursor:pointer; }
:where(body[data-vista="notaalquiler"]) .na-evi-tag { position:absolute; left:0; right:0; bottom:0; font-size:var(--q3-fs-2xs); font-weight:800; text-transform:uppercase;
              color:#fff; background:linear-gradient(0deg,rgba(15,23,42,.82),rgba(15,23,42,0)); padding:10px 6px 4px; letter-spacing:.02em; text-align:center; }
:where(body[data-vista="notaalquiler"]) .na-evi-dot { position:absolute; top:6px; right:6px; width:12px; height:12px; border-radius:50%; box-shadow:0 0 0 2px #fff; }
/* Lightbox */
:where(body[data-vista="notaalquiler"]) .na-lb { position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center;
         background:rgba(15,23,42,.82); padding:24px; }
:where(body[data-vista="notaalquiler"]) .na-lb.open { display:flex; }
:where(body[data-vista="notaalquiler"]) .na-lb-card { background:var(--q3-fondo, #fff); border-radius:16px; overflow:hidden; max-width:860px; width:100%; max-height:92vh;
              display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,.4); }
:where(body[data-vista="notaalquiler"]) .na-lb-imgwrap { background:#0F172A; display:flex; align-items:center; justify-content:center; min-height:0; }
:where(body[data-vista="notaalquiler"]) .na-lb-imgwrap img { max-width:100%; max-height:64vh; object-fit:contain; display:block; }
:where(body[data-vista="notaalquiler"]) .na-lb-body { padding:16px 20px; display:flex; align-items:flex-start; gap:16px; flex-wrap:wrap; }
:where(body[data-vista="notaalquiler"]) .na-lb-meta { flex:1; min-width:220px; }
:where(body[data-vista="notaalquiler"]) .na-lb-badge { display:inline-flex; align-items:center; gap:7px; font-size:var(--q3-fs-sm); font-weight:800; color:#fff;
               padding:4px 12px; border-radius:999px; text-transform:uppercase; letter-spacing:.02em; }
:where(body[data-vista="notaalquiler"]) .na-lb-fecha { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748B); margin-top:8px; }
:where(body[data-vista="notaalquiler"]) .na-lb-obs { font-size:var(--q3-fs-md); color:var(--q3-texto-2, #334155); margin-top:8px; line-height:1.5; }
:where(body[data-vista="notaalquiler"]) .na-lb-actions { display:flex; gap:8px; align-items:center; }
:where(body[data-vista="notaalquiler"]) .na-lb-close { position:absolute; top:18px; right:22px; background:rgba(255,255,255,.15); color:#fff; border:none;
               width:38px; height:38px; border-radius:50%; font-size:var(--q3-fs-2xl); cursor:pointer; line-height:1; }
:where(body[data-vista="notaalquiler"]) .na-lb-close:hover { background:rgba(255,255,255,.28); }
/* Dropzone (subida) */
:where(body[data-vista="notaalquiler"]) .na-dz { border:2px dashed #BFDBFE; border-radius:12px; padding:22px 16px; text-align:center; cursor:pointer;
         background:#F8FAFF; color:var(--q3-texto-4, #64748B); font-size:var(--q3-fs-md); transition:all .15s; }
:where(body[data-vista="notaalquiler"]) .na-dz.drag { border-color:#2563EB; background:#EFF6FF; color:#2563EB; }
:where(body[data-vista="notaalquiler"]) .na-dz strong { color:#2563EB; }
:where(body[data-vista="notaalquiler"]) .na-dz-preview { margin-top:10px; max-height:120px; border-radius:8px; display:none; }
/* próximo paso */
:where(body[data-vista="notaalquiler"]) .na-next { margin-top:18px; border-top:2px solid #F1F5F9; padding-top:16px; }
:where(body[data-vista="notaalquiler"]) .na-next .lead { font-size:var(--q3-fs-sm); font-weight:700; color:var(--q3-texto-3, #475569); margin-bottom:8px; }
:where(body[data-vista="notaalquiler"]) .na-main-btn { display:inline-flex; align-items:center; gap:8px; padding:13px 26px; border-radius:12px; border:none; cursor:pointer;
               background:linear-gradient(135deg,#0D9488,#0F766E); color:#fff; font-size:var(--q3-fs-lg); font-weight:800;
               box-shadow:0 3px 10px rgba(13,148,136,.30); transition:transform .2s ease, box-shadow .2s ease, filter .2s ease; }
:where(body[data-vista="notaalquiler"]) .na-main-btn:hover { transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 10px 22px rgba(13,148,136,.38); }
:where(body[data-vista="notaalquiler"]) .na-main-btn:active { transform:translateY(1px); box-shadow:0 4px 10px rgba(13,148,136,.32); }
:where(body[data-vista="notaalquiler"]) .na-main-btn:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(94,234,212,.70), 0 8px 18px rgba(13,148,136,.30); }
:where(body[data-vista="notaalquiler"]) .na-sec { margin-top:12px; font-size:var(--q3-fs-sm); }
:where(body[data-vista="notaalquiler"]) .na-sec a { color:#2563EB; font-weight:700; text-decoration:none; cursor:pointer; }
:where(body[data-vista="notaalquiler"]) .na-care { margin-top:14px; padding-top:10px; border-top:1px dashed #FCA5A5; }
:where(body[data-vista="notaalquiler"]) .na-care .ct { font-size:var(--q3-fs-xs); font-weight:800; color:#DC2626; text-transform:uppercase; margin-bottom:6px; }
:where(body[data-vista="notaalquiler"]) .na-care a { color:#DC2626; font-weight:700; text-decoration:none; cursor:pointer; font-size:var(--q3-fs-sm); }
:where(body[data-vista="notaalquiler"]) .na-fin { font-size:var(--q3-fs-md); color:var(--q3-texto-5, #94A3B8); font-weight:700; margin-top:6px; }
:where(body[data-vista="notaalquiler"]) .na-btn { display:inline-block; padding:11px 18px; border-radius:10px; font-weight:700; text-decoration:none; }
:where(body[data-vista="notaalquiler"]) .na-btn--ghost { border:1px solid var(--q3-borde-3, #CBD5E1); color:var(--q3-texto-2, #334155); background:var(--q3-fondo-3, #F1F5F9); cursor:pointer; }
:where(body[data-vista="notaalquiler"]) .na-btn--sec { border:1px solid #BFDBFE; color:#2563EB; background:#EFF6FF; cursor:pointer; }
:where(body[data-vista="notaalquiler"]) .na-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:8px; }
@media (max-width:640px){
  :where(body[data-vista="notaalquiler"]) .na-split { grid-template-columns:1fr; gap:18px; }
  :where(body[data-vista="notaalquiler"]) .na-meta { grid-template-columns:1fr 1fr; }
}

/* ── notacredito (core/app/view/notacredito-view.php) ───────────────────────────────────────────────── */
:where(body[data-vista="notacredito"]) .nc-aviso { padding:10px 14px; border-radius:4px; background:#fef3c7; border:1px solid #f59e0b;
                color:#78350f; font-weight:600; margin-bottom:1em; }
    /* El importe se muestra apagado cuando no es editable, para que se vea que no se
       puede tocar sin tener que intentarlo. */
    :where(body[data-vista="notacredito"]) #ncTabla input[readonly] { background:#f3f4f6; color:#6b7280; }
    :where(body[data-vista="notacredito"]) #ncTabla tfoot th { font-size:var(--q3-fs-lg); }
    /* En su propia fila y en UNA sola linea: dentro de la celda del importe se
       partia en dos y desalineaba el numero respecto de Subtotal e IGV. */
    :where(body[data-vista="notacredito"]) .nc-estimado { font-size:var(--q3-fs-xs); color:#6b7280; font-weight:normal;
                   text-align:right; white-space:nowrap; border-top:0; padding-top:0; }
    :where(body[data-vista="notacredito"]) .nc-deuda { padding:10px 14px; border-radius:4px; background:#e0f2fe; border:1px solid #0284c7;
                color:#075985; margin-bottom:1em; }

/* ── notadebito (core/app/view/notadebito-view.php) ────────────────────────────────────────────────── */
:where(body[data-vista="notadebito"]) .nd-aviso { padding:10px 14px; border-radius:4px; background:#fef3c7; border:1px solid #f59e0b; color:#78350f; font-weight:600; margin-bottom:1em; }
    :where(body[data-vista="notadebito"]) .nd-info { padding:10px 14px; border-radius:4px; background:#e0f2fe; border:1px solid #0284c7; color:#075985; margin-bottom:1em; }
    :where(body[data-vista="notadebito"]) #ndTabla th, :where(body[data-vista="notadebito"]) #ndTabla td { text-align:center; vertical-align:middle; }
    :where(body[data-vista="notadebito"]) #ndTabla tfoot th { font-size:var(--q3-fs-lg); }

/* ── perfilaccesos (core/app/view/perfilaccesos-view.php) ─────────────────────────────────────────────── */
:where(body[data-vista="perfilaccesos"]) .pa-cab { display:flex; align-items:center; gap:12px; }
		:where(body[data-vista="perfilaccesos"]) .pa-sel { border:0; border-radius:8px; padding:3px 8px; font-weight:700; color:#1e3a8a; }
		:where(body[data-vista="perfilaccesos"]) .pa-barra { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:12px; }
		:where(body[data-vista="perfilaccesos"]) .pa-busca { position:relative; flex:0 1 280px; } :where(body[data-vista="perfilaccesos"]) .pa-busca em { position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--q3-texto-5, #94a3b8); } :where(body[data-vista="perfilaccesos"]) .pa-busca .q-input { padding-left:30px; }
		:where(body[data-vista="perfilaccesos"]) .pa-cuenta { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); }
		:where(body[data-vista="perfilaccesos"]) .pa-acc { display:flex; gap:8px; margin-left:auto; align-items:center; } :where(body[data-vista="perfilaccesos"]) .pa-acc .q-select { width:auto; }
		:where(body[data-vista="perfilaccesos"]) .pa-nota { display:flex; gap:8px; font-size:var(--q3-fs-sm); background:#eff6ff; border:1px solid #bfdbfe; color:#1e3a8a; border-radius:10px; padding:8px 12px; margin-bottom:12px; }
		:where(body[data-vista="perfilaccesos"]) .pa-cuerpo { display:grid; grid-template-columns:minmax(0, 1fr) 270px; gap:16px; align-items:start; }
		:where(body[data-vista="perfilaccesos"]) .pa-areas { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:12px; }
		:where(body[data-vista="perfilaccesos"]) .pa-area { border:1px solid var(--q-border, var(--q3-borde, #e2e8f0)); border-radius:12px; overflow:hidden; background:var(--q3-fondo, #fff); }
		:where(body[data-vista="perfilaccesos"]) .pa-area__cab { display:flex; align-items:center; gap:8px; margin:0; padding:9px 12px; background:var(--q3-fondo-2, #f8fafc); border-bottom:1px solid var(--q3-borde, #e2e8f0); cursor:pointer; font-size:var(--q3-fs-md); }
		:where(body[data-vista="perfilaccesos"]) .pa-ico { color:#1e3a8a; } :where(body[data-vista="perfilaccesos"]) .pa-n { margin-left:auto; font-size:var(--q3-fs-xs); color:var(--q3-texto-4, #64748b); background:#e2e8f0; border-radius:999px; padding:0 8px; }
		:where(body[data-vista="perfilaccesos"]) .pa-area.is-full .pa-area__cab { background:#eff6ff; } :where(body[data-vista="perfilaccesos"]) .pa-area.is-full .pa-n { background:#1e3a8a; color:#fff; }
		:where(body[data-vista="perfilaccesos"]) .pa-lista { padding:6px 8px; display:flex; flex-direction:column; }
		:where(body[data-vista="perfilaccesos"]) .pa-it { display:flex; gap:8px; align-items:center; margin:0; padding:4px 6px; border-radius:6px; font-size:var(--q3-fs-md); cursor:pointer; }
		:where(body[data-vista="perfilaccesos"]) .pa-it:hover { background:var(--q3-fondo-3, #f1f5f9); } :where(body[data-vista="perfilaccesos"]) .pa-it.is-oculto { display:none; } :where(body[data-vista="perfilaccesos"]) .pa-it.is-cambio { background:#fef9c3; }
		:where(body[data-vista="perfilaccesos"]) .pa-esp { margin-top:14px; border:1px solid #fde68a; border-radius:12px; background:#fffbeb; padding:10px 12px; }
		:where(body[data-vista="perfilaccesos"]) .pa-esp__tit { font-weight:800; color:#92400e; font-size:var(--q3-fs-md); margin-bottom:6px; }
		:where(body[data-vista="perfilaccesos"]) .pa-esp__it { display:flex; gap:10px; align-items:flex-start; margin:0; padding:6px 4px; cursor:pointer; }
		:where(body[data-vista="perfilaccesos"]) .pa-esp__it b { display:block; font-size:var(--q3-fs-md); } :where(body[data-vista="perfilaccesos"]) .pa-esp__it span { font-size:var(--q3-fs-sm); color:#78350f; }
		:where(body[data-vista="perfilaccesos"]) .pa-esp__it input { margin-top:3px; }
		:where(body[data-vista="perfilaccesos"]) .pa-ini { border:1px solid #bfdbfe; background:#eff6ff; border-radius:12px; padding:10px 12px; margin-bottom:12px; }
		:where(body[data-vista="perfilaccesos"]) .pa-ini small { display:block; font-size:var(--q3-fs-xs); color:var(--q3-texto-3, #475569); margin-top:4px; } :where(body[data-vista="perfilaccesos"]) .pa-ini .q-label em { color:#1d4ed8; }
		:where(body[data-vista="perfilaccesos"]) .pa-ini.is-aviso { border-color:#fca5a5; background:#fef2f2; }
		:where(body[data-vista="perfilaccesos"]) .pa-prev { position:sticky; top:70px; border:1px solid var(--q3-borde, #e2e8f0); border-radius:12px; background:#0f172a; color:#e2e8f0; padding:10px 12px; max-height:75vh; overflow:auto; }
		:where(body[data-vista="perfilaccesos"]) .pa-prev__tit { font-size:var(--q3-fs-sm); font-weight:800; color:var(--q3-texto-5, #94a3b8); text-transform:uppercase; margin-bottom:8px; }
		:where(body[data-vista="perfilaccesos"]) .pa-prev .g { font-weight:800; font-size:var(--q3-fs-sm); margin:8px 0 2px; color:#fff; }
		:where(body[data-vista="perfilaccesos"]) .pa-prev .h { font-size:var(--q3-fs-sm); color:#cbd5e1; padding-left:14px; line-height:1.6; }
		:where(body[data-vista="perfilaccesos"]) .pa-prev .v { font-size:var(--q3-fs-sm); color:var(--q3-texto-5, #94a3b8); }
		@media (max-width: 991px){ :where(body[data-vista="perfilaccesos"]) .pa-cuerpo { grid-template-columns:1fr; } :where(body[data-vista="perfilaccesos"]) .pa-prev { position:static; } }

/* ── pos (core/app/view/pos-view.php) ───────────────────────────────────────────────────────── */
/* Puntos de Venta (UX): columnas centradas + acciones compactas + anchos balanceados. */
							:where(body[data-vista="pos"]) #tablaPos th, :where(body[data-vista="pos"]) #tablaPos td { text-align:center !important; vertical-align:middle !important; }
							:where(body[data-vista="pos"]) #tablaPos td .q-btn--s { height:26px; min-width:0; padding:0 9px; font-size:var(--q3-fs-xs); gap:5px; border-radius:6px; margin:2px 3px; }
							:where(body[data-vista="pos"]) #tablaPos td .q-btn--s .bi { margin:0; }
							:where(body[data-vista="pos"]) #tablaPos { table-layout:fixed; width:100%; }
							:where(body[data-vista="pos"]) #tablaPos th:nth-child(1), :where(body[data-vista="pos"]) #tablaPos td:nth-child(1) { width:18.5%; }
							:where(body[data-vista="pos"]) #tablaPos th:nth-child(2), :where(body[data-vista="pos"]) #tablaPos td:nth-child(2) { width:18.5%; }
							:where(body[data-vista="pos"]) #tablaPos th:nth-child(3), :where(body[data-vista="pos"]) #tablaPos td:nth-child(3) { width:18.5%; }
							:where(body[data-vista="pos"]) #tablaPos th:nth-child(4), :where(body[data-vista="pos"]) #tablaPos td:nth-child(4) { width:18.5%; }
							:where(body[data-vista="pos"]) #tablaPos th:nth-child(5), :where(body[data-vista="pos"]) #tablaPos td:nth-child(5) { width:26%; white-space:normal !important; }

/* ── product-kardex-lote (core/app/view/product-kardex-lote-view.php) ───────────────────────────────────────── */
/* VIS-009 · armado con el sistema de diseño: q-panel, q-toolbar, q-table y q-btn. La cabecera de las
   tablas sigue a la paleta del tema (antes azul y verde pintados a mano) y todo funciona en oscuro.
   EXP-KDX-LOTE-003: el combo Producto va al doble de ancho; los botones, a la derecha. */
:where(body[data-vista="product-kardex-lote"]) #kdxlFiltros { padding-bottom:24px; }
:where(body[data-vista="product-kardex-lote"]) #kdxlFiltros .kdxl-f--prod { flex:2 1 360px; }
:where(body[data-vista="product-kardex-lote"]) #kdxlFiltros .kdxl-f--fec { flex:0 0 150px; min-width:150px; position:relative; }
:where(body[data-vista="product-kardex-lote"]) #kdxlFiltros .kdxl-todas { position:absolute; top:100%; left:0; display:flex; align-items:center; gap:6px; margin:6px 0 0; font-size:var(--q3-fs-sm); font-weight:normal; cursor:pointer; white-space:nowrap; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-producto { margin:4px 0 12px; font-size:var(--q3-fs-xl); font-weight:700; color:var(--q-text-1); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-sec { margin:0 0 12px; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-sec > .q-panel__header { flex-wrap:wrap; justify-content:flex-start; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-nota { font-size:var(--q3-fs-sm); font-weight:400; text-transform:none; letter-spacing:0; color:var(--q-text-2); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-nota::before { content:"· "; }
/* Todas las columnas centradas, cabecera y datos (regla del sistema). */
:where(body[data-vista="product-kardex-lote"]) table.kdxl { margin:0; }
:where(body[data-vista="product-kardex-lote"]) table.kdxl th, :where(body[data-vista="product-kardex-lote"]) table.kdxl td { text-align:center !important; vertical-align:middle; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-num { font-variant-numeric:tabular-nums; white-space:nowrap; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-chip { display:inline-block; padding:2px 9px; border-radius:12px; font-size:var(--q3-fs-sm); font-weight:700; color:#fff; white-space:nowrap; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-doc { font-size:var(--q3-fs-sm); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-muted { color:var(--q-text-2); font-size:var(--q3-fs-sm); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-vacio { color:var(--q-text-2); font-style:italic; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-ant td { background:var(--q-surface-2); font-weight:700; color:var(--q-text-1); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-final td { background:var(--q-color-primary-soft, var(--q-surface-2)); font-weight:800; border-top:1px solid var(--q-border); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-key td { background:rgba(245,158,11,.12); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-star { color:#D97706; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-leyenda { margin:-4px 0 14px; color:var(--q-text-2); font-size:var(--q3-fs-sm); }
:where(body[data-vista="product-kardex-lote"]) .kdxl-in { color:#15803D; font-weight:600; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-out, :where(body[data-vista="product-kardex-lote"]) .kdxl-venc-warn { color:#DC2626; font-weight:700; }
:where(body[data-vista="product-kardex-lote"].dark-mode) .kdxl-in { color:#4ADE80; }
:where(body[data-vista="product-kardex-lote"].dark-mode) .kdxl-out, :where(body[data-vista="product-kardex-lote"].dark-mode) .kdxl-venc-warn { color:#F87171; }
:where(body[data-vista="product-kardex-lote"].dark-mode) .kdxl-star { color:#FBBF24; }
:where(body[data-vista="product-kardex-lote"]) .kdxl-aviso { margin:0; }

/* ── product-kardex (core/app/view/product-kardex-view.php) ────────────────────────────────────────────── */
/* Resumen producto: MISMO AZUL que el Kardex */
:where(body[data-vista="product-kardex"]) .kdx-ficha { margin-bottom:10px; }
:where(body[data-vista="product-kardex"]) .kdx-ficha thead tr {
    background:#4f94c2 !important;
    color:#fff !important;
    text-align:center;
}
:where(body[data-vista="product-kardex"]) .kdx-ficha th, :where(body[data-vista="product-kardex"]) .kdx-ficha td {
    font-size:var(--q3-fs-sm);
    padding:7px 8px;
    vertical-align:middle;
}
:where(body[data-vista="product-kardex"]) .kdx-ficha td {
    background:var(--q3-fondo, #fff);
    white-space:nowrap;
}
:where(body[data-vista="product-kardex"]) .kdx-ficha td.text-end {
    text-align:right;
    font-variant-numeric: tabular-nums;
}

/* KPI centrado */
:where(body[data-vista="product-kardex"]) .kdx-kpi { margin-top:10px; }
:where(body[data-vista="product-kardex"]) .kdx-kpi .badge {
    display:inline-block;
    font-size:var(--q3-fs-sm);
    padding:4px 8px;
}
:where(body[data-vista="product-kardex"]) .kdx-kpi .kpi {
    font-weight:700;
    font-size:var(--q3-fs-lg);
    margin-top:4px;
}

/* ── product-stock-anterior (core/app/view/product-stock-anterior-view.php) ────────────────────────────────────── */
:where(body[data-vista="product-stock-anterior"]) #tblReposicion th, :where(body[data-vista="product-stock-anterior"]) #tblReposicion td { text-align: center !important; vertical-align: middle !important; white-space: normal !important; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion thead th { line-height: 1.2; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion thead tr.rv-grupos th { font-size: var(--q3-fs-xs); letter-spacing: .3px; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-g-per { background: #eff6ff !important; color: #1e3a8a !important; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-g-stk { background: var(--q3-fondo-2, #f8fafc) !important; color: var(--q3-texto-2, #334155) !important; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-g-vie { background: #fff7ed !important; color: #9a3412 !important; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-g-cla { background: var(--q3-fondo-3, #f1f5f9) !important; color: var(--q3-texto-3, #475569) !important; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion td.rv-comprar { font-weight: 800; font-size: var(--q3-fs-lg); color: #9a3412; background: #fff7ed; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-var { font-size: var(--q3-fs-xs); font-weight: 700; border-radius: 999px; padding: 1px 6px; white-space: nowrap; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-var--up { background: #dcfce7; color: #15803d; } :where(body[data-vista="product-stock-anterior"]) .rv-var--down { background: #fee2e2; color: #b91c1c; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion td.rv-tcel[data-curva] { cursor: zoom-in; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion td.rv-tcel[data-curva]:hover { background: #fff7ed !important; box-shadow: inset 0 0 0 2px #fdba74; }
				    :where(body[data-vista="product-stock-anterior"]) .swal2-popup.rvc-pop { width: min(680px, 94vw) !important; max-width: 94vw !important; padding-bottom: .4rem !important; }
				    :where(body[data-vista="product-stock-anterior"]) .swal2-popup.rvc-pop .swal2-html-container { margin: .6rem 1rem 0 !important; }
				    :where(body[data-vista="product-stock-anterior"]) .swal2-popup.rvc-pop .swal2-actions { margin-top: .5rem !important; }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-graf { width: 100%; height: auto; display: block; }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 2px 0 8px; }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-kpis div { border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 8px; padding: 4px 4px; text-align: center; background: var(--q3-fondo-2, #f8fafc); }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-kpis small { display: block; font-size: var(--q3-fs-2xs); font-weight: 700; color: var(--q3-texto-4, #64748b); text-transform: uppercase; line-height: 1.2; }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-kpis b { font-size: var(--q3-fs-md); color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-ley { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; font-size: var(--q3-fs-sm); color: var(--q3-texto-3, #475569); margin-top: 6px; }
				    :where(body[data-vista="product-stock-anterior"]) .rvc-ley i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -1px; margin-right: 4px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-tmp { display: inline-block; white-space: nowrap; font-size: var(--q3-fs-2xs); font-weight: 800; border-radius: 999px; padding: 1px 7px; margin-bottom: 3px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-tmp--alta { background: #f97316; color: #fff; } :where(body[data-vista="product-stock-anterior"]) .rv-tmp--baja { background: #e2e8f0; color: var(--q3-texto-3, #475569); }
				    :where(body[data-vista="product-stock-anterior"]) .rv-base { display: block; font-size: var(--q3-fs-2xs); color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock-anterior"]) .rv-agota { color: #b91c1c; font-weight: 700; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin: 12px 0; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k { border: 1px solid var(--q3-borde, #e2e8f0); border-top-width: 5px; border-radius: 12px; padding: 10px 12px; background: var(--q3-fondo, #fff); text-align: center; }
				    /* Cada tarjeta con su color: comprar (naranja), demanda (azul), temporada (ámbar), se agotan (rojo) */
				    :where(body[data-vista="product-stock-anterior"]) .rv-k--comprar { background: #fff7ed; border-color: #fdba74; border-top-color: #f97316; } :where(body[data-vista="product-stock-anterior"]) .rv-k--comprar b { color: #9a3412; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k--demanda { background: #eff6ff; border-color: #93c5fd; border-top-color: #2563eb; } :where(body[data-vista="product-stock-anterior"]) .rv-k--demanda b { color: #1e3a8a; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k--alta { background: #fefce8; border-color: #fcd34d; border-top-color: #eab308; } :where(body[data-vista="product-stock-anterior"]) .rv-k--alta b { color: #854d0e; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k--agota { background: #fef2f2; border-color: #fca5a5; border-top-color: #dc2626; } :where(body[data-vista="product-stock-anterior"]) .rv-k--agota b { color: #b91c1c; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k small { display: block; font-size: var(--q3-fs-xs); font-weight: 700; color: var(--q3-texto-4, #64748b); text-transform: uppercase; letter-spacing: .3px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k b { display: block; font-size: var(--q3-fs-2xl); margin: 2px 0; } :where(body[data-vista="product-stock-anterior"]) .rv-k span { font-size: var(--q3-fs-sm); color: var(--q3-texto-4, #64748b); }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k--nar { background: #fff7ed; border-color: #fed7aa; } :where(body[data-vista="product-stock-anterior"]) .rv-k--nar b { color: #9a3412; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-k--roj b { color: #b91c1c; }
				    /* REPO-COH-001 · fechas de cada bloque y datos que usa el reporte */
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-g-fec { display: block; font-size: var(--q3-fs-2xs); font-weight: 500; letter-spacing: 0; text-transform: none; opacity: .85; margin-top: 2px; line-height: 1.35; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-datos { display: flex; gap: 10px; align-items: flex-start; padding: 9px 12px; border-radius: 10px; background: var(--q3-fondo-2, #f8fafc); border: 1px solid var(--q3-borde, #e2e8f0); color: var(--q3-texto-2, #334155); font-size: var(--q3-fs-md); margin: 10px 0; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-datos > em { font-size: var(--q3-fs-xl); color: #1e3a8a; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-datos__ojo { color: #92400e; }
				    :where(body[data-vista="product-stock-anterior"].dark-mode) .rv-datos { background: transparent; color: inherit; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: #fffbeb; border: 1px solid #fde68a; color: #78350f; font-size: var(--q3-fs-md); margin: 10px 0; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-ayuda { font-size: var(--q3-fs-sm); color: var(--q3-texto-3, #475569); margin-top: 8px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-ayuda b { color: var(--q3-texto, #0f172a); }
				    :where(body[data-vista="product-stock-anterior"]) .rv-clasica.is-oculta { display: none; }
				    /* Filtros y botones en una sola fila: los campos a la izquierda, las acciones al final, todo alineado abajo */
				    :where(body[data-vista="product-stock-anterior"]) .rv-filtros { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-filtros .rv-f { display: flex; flex-direction: column; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-filtros .rv-f label { margin-bottom: 4px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-f--fecha { width: 110px; } :where(body[data-vista="product-stock-anterior"]) .rv-f--cat { flex: 1 1 150px; min-width: 150px; max-width: 260px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-f--hor { width: 180px; } :where(body[data-vista="product-stock-anterior"]) .rv-f--ver { width: 240px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: auto; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-acciones .btn { white-space: nowrap; padding: .375rem .85rem; }
				    /* «Ver clásica» solo cambia columnas: va junto al buscador de la tabla */
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion_filter { display: flex; justify-content: flex-end; align-items: center; gap: 10px; }
				    :where(body[data-vista="product-stock-anterior"]) #btnClasica { white-space: nowrap; }
				    /* REPO-OC-001 · selección para la orden de compra */
				    :where(body[data-vista="product-stock-anterior"]) .rv-f--mar { flex: 1 1 140px; min-width: 140px; max-width: 200px; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-marcar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 10px 12px; border: 1px solid #bfdbfe; border-left: 5px solid #1e3a8a; border-radius: 10px; margin: 0 0 10px; background: #eff6ff; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-marcar > span { font-size: var(--q3-fs-md); font-weight: 800; color: #1e3a8a; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-marcar .form-select { width: auto; min-width: 250px; height: 34px; padding-top: 2px; padding-bottom: 2px; font-size: var(--q3-fs-md); font-weight: 600; color: #1e3a8a; border: 1.5px solid #2563eb; background-color: #fff; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-marcar .rv-b { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 8px; font-size: var(--q3-fs-sm); font-weight: 700; border: 1.5px solid; cursor: pointer; transition: filter .15s, transform .05s; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-marcar .rv-b:hover { filter: brightness(.95); } :where(body[data-vista="product-stock-anterior"]) .rv-marcar .rv-b:active { transform: translateY(1px); }
				    :where(body[data-vista="product-stock-anterior"]) .rv-b--comprar { background: #ffedd5; border-color: #f97316 !important; color: #9a3412; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-b--alta { background: #fef9c3; border-color: #eab308 !important; color: #854d0e; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-b--agota { background: #fee2e2; border-color: #dc2626 !important; color: #991b1b; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-b--quitar { background: #fff; border-color: #f97316 !important; color: #c2410c; margin-left: auto; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion td.rv-sel, :where(body[data-vista="product-stock-anterior"]) #tblReposicion th.rv-sel { width: 34px; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-chk { width: 18px; height: 18px; cursor: pointer; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion tr.rv-on > td { background: #eff6ff !important; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion .rv-pedir { width: 76px; margin: 0 auto; text-align: center; font-weight: 700; padding: 2px 4px; }
				    :where(body[data-vista="product-stock-anterior"]) #tblReposicion tr.rv-on .rv-pedir { border-color: #2563eb; color: #1e3a8a; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-barra { position: sticky; bottom: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
				                margin-top: 10px; padding: 10px 14px; border-radius: 12px; background: #1e3a8a; color: #fff; box-shadow: 0 -4px 14px rgba(15,23,42,.18); }
				    :where(body[data-vista="product-stock-anterior"]) .rv-barra.is-vacia { background: var(--q3-fondo-3, #f1f5f9); color: var(--q3-texto-3, #475569); box-shadow: none; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-barra b { font-size: var(--q3-fs-lg); } :where(body[data-vista="product-stock-anterior"]) .rv-barra small { opacity: .85; }
				    :where(body[data-vista="product-stock-anterior"]) .rv-barra .q-btn { white-space: nowrap; }
				    :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-lin { max-height: 260px; overflow: auto; border: 1px solid var(--q3-borde, #e2e8f0); border-radius: 8px; }
				    :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-lin table { width: 100%; font-size: var(--q3-fs-sm); margin: 0; }
				    :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-lin th, :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-lin td { text-align: center; padding: 4px 6px; border-bottom: 1px solid #f1f5f9; }
				    :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-lin th { position: sticky; top: 0; background: var(--q3-fondo-2, #f8fafc); }
				    :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-aviso { font-size: var(--q3-fs-sm); color: #92400e; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: 6px 10px; margin-top: 8px; }
				    :where(body[data-vista="product-stock-anterior"]) #mdlOC .oc-tot { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; font-weight: 700; margin-top: 8px; }

/* ── profiles (core/app/view/profiles-view.php) ──────────────────────────────────────────────────── */
/* PERF-002 · botones con texto y columnas centradas */
								:where(body[data-vista="profiles"]) table.pf-tabla th, :where(body[data-vista="profiles"]) table.pf-tabla td { text-align:center !important; vertical-align:middle; }
								:where(body[data-vista="profiles"]) .pf-acc { display:inline-flex; gap:6px; flex-wrap:nowrap; }
								:where(body[data-vista="profiles"]) .pf-acc .q-btn { white-space:nowrap; }

/* ── quotesmap (core/app/view/quotesmap-view.php) ─────────────────────────────────────────────────── */
/* Alto fijo para el mapa: Leaflet necesita que su contenedor tenga altura real
   antes de inicializarse; con altura automática se dibuja de 0 px y no se ve nada. */
:where(body[data-vista="quotesmap"]) .geo-layout { display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; }
:where(body[data-vista="quotesmap"]) .geo-panel { flex: 0 0 340px; max-width: 340px; }
:where(body[data-vista="quotesmap"]) .geo-mapa { flex: 1 1 460px; min-width: 320px; height: 620px; border-radius: 8px; overflow: hidden; border: 1px solid var(--q3-borde, #E2E8F0); }
@media (max-width: 900px) { :where(body[data-vista="quotesmap"]) .geo-panel { flex: 1 1 100%; max-width: none; } :where(body[data-vista="quotesmap"]) .geo-mapa { height: 380px; } }

:where(body[data-vista="quotesmap"]) .geo-kpis { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }

/* MAP-VIS-001 · recoger filtros y pantalla completa. En los dos casos el mapa llena lo
   que queda de la ventana (lo calcula ajustarAlto, abajo). */
:where(body[data-vista="quotesmap"]) .geo-cab { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
:where(body[data-vista="quotesmap"]) .geo-cab__acc { margin-left: auto; display: flex; gap: 6px; }
:where(body[data-vista="quotesmap"]) .geo-cab__btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.35); background: transparent; color: inherit; border-radius: 6px; padding: 4px 10px; font-size: var(--q3-fs-sm); font-weight: 600; cursor: pointer; }
:where(body[data-vista="quotesmap"]) .geo-cab__btn:hover, :where(body[data-vista="quotesmap"]) .geo-cab__btn[aria-pressed="true"], :where(body[data-vista="quotesmap"]) .geo-cab__btn[aria-expanded="false"] { background: rgba(255,255,255,.16); }
:where(body[data-vista="quotesmap"]) .geo-cab__btn:focus-visible { outline: 2px solid #F59E0B; outline-offset: 2px; }
:where(body[data-vista="quotesmap"]) .geo-resumen { display: none; font-size: var(--q3-fs-sm); font-weight: 500; opacity: .85; }
/* MAP-CLI-001 · aro morado hueco: ubicación de la ficha del cliente, no del vendedor */
:where(body[data-vista="quotesmap"]) .geo-dot--cliente { background: var(--q3-fondo, #fff); border: 2px dashed #7C3AED; box-sizing: border-box; }
:where(body[data-vista="quotesmap"]) .geo-item__cli { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 9px; background: #F3E8FF; color: #6D28D9; font-size: var(--q3-fs-2xs); font-weight: 600; }
:where(body[data-vista="quotesmap"]) .geo-recogido #geoFiltros { display: none; }
:where(body[data-vista="quotesmap"]) .geo-recogido .geo-resumen { display: inline; }
:where(body[data-vista="quotesmap"]) .geo-completa { margin: 0; border-radius: 0; overflow: auto; background: var(--q3-fondo, #fff); }
/* respaldo si el navegador niega la pantalla completa real */
:where(body[data-vista="quotesmap"]) .geo-completa:not(:fullscreen) { position: fixed; inset: 0; z-index: 2000; }
:where(body[data-vista="quotesmap"].geo-sin-scroll) { overflow: hidden; }
@media (max-width: 900px) { :where(body[data-vista="quotesmap"]) .geo-cab__btn span { display: none; } }
:where(body[data-vista="quotesmap"]) .geo-kpi { flex: 1 1 150px; border: 1px solid var(--q3-borde, #E2E8F0); border-radius: 8px; padding: 10px 12px; background: var(--q3-fondo, #fff); }
:where(body[data-vista="quotesmap"]) .geo-kpi__n { font-size: var(--q3-fs-3xl); font-weight: 700; line-height: 1.1; }
:where(body[data-vista="quotesmap"]) .geo-kpi__t { font-size: var(--q3-fs-xs); color: var(--q3-texto-4, #64748B); text-transform: uppercase; letter-spacing: .03em; }

:where(body[data-vista="quotesmap"]) .geo-sub { font-size: var(--q3-fs-sm); font-weight: 700; color: var(--q3-texto-2, #334155); text-transform: uppercase; letter-spacing: .03em; margin: 4px 0 6px; }
:where(body[data-vista="quotesmap"]) .geo-vend { width: 100%; border-collapse: collapse; font-size: var(--q3-fs-sm); margin-bottom: 12px; }
:where(body[data-vista="quotesmap"]) .geo-vend th { text-align: left; color: var(--q3-texto-4, #64748B); font-weight: 600; border-bottom: 1px solid var(--q3-borde, #E2E8F0); padding: 4px 6px; }
:where(body[data-vista="quotesmap"]) .geo-vend td { border-bottom: 1px solid #F1F5F9; padding: 5px 6px; }
:where(body[data-vista="quotesmap"]) .geo-vend tr.alerta td { background: #FEF2F2; }

:where(body[data-vista="quotesmap"]) .geo-lista { max-height: 300px; overflow-y: auto; border: 1px solid var(--q3-borde, #E2E8F0); border-radius: 8px; }
:where(body[data-vista="quotesmap"]) .geo-item { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid #F1F5F9; background: var(--q3-fondo, #fff); padding: 8px 10px; cursor: pointer; font-size: var(--q3-fs-sm); }
:where(body[data-vista="quotesmap"]) .geo-item:hover, :where(body[data-vista="quotesmap"]) .geo-item.on { background: #EFF6FF; }
:where(body[data-vista="quotesmap"]) .geo-item__t { font-weight: 700; color: var(--q3-texto-1, #1E293B); }
:where(body[data-vista="quotesmap"]) .geo-item__s { color: var(--q3-texto-4, #64748B); }
:where(body[data-vista="quotesmap"]) .geo-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: middle; }

/* Leaflet pinta TODO enlace suyo de azul (`.leaflet-container a { color:#0078A8 }`) y
   eso teñía el botón "Ver detalle" del popup: quedaba azul sobre ámbar, con un
   contraste de 2.3 — ilegible. No es cuestión de orden de carga: el selector de
   Leaflet tiene especificidad (0,1,1) y `.q-btn--open` sólo (0,1,0), así que gana
   siempre. Se contrarresta con (0,2,1).

   Se restituye el color del Design System (--q-btn-fg), no un blanco suelto: el
   contrato de identidad (Regla N.º 28) fija texto BLANCO en todo botón con fondo de
   color, y tomarlo del token hace que este popup siga cualquier cambio futuro de la
   paleta en vez de quedarse congelado aparte. */
:where(body[data-vista="quotesmap"]) .leaflet-container a.q-btn, :where(body[data-vista="quotesmap"]) .leaflet-container a.q-btn:hover, :where(body[data-vista="quotesmap"]) .leaflet-container a.q-btn:focus, :where(body[data-vista="quotesmap"]) .leaflet-container a.q-btn:active { color: var(--q-btn-fg, #FFFFFF); text-decoration: none; }

:where(body[data-vista="quotesmap"]) .geo-leyenda { display: flex; flex-wrap: wrap; gap: 10px; font-size: var(--q3-fs-xs); color: var(--q3-texto-3, #475569); margin-top: 8px; }
:where(body[data-vista="quotesmap"]) .geo-aviso { border-left: 3px solid #DC2626; background: #FEF2F2; padding: 8px 10px; font-size: var(--q3-fs-sm); border-radius: 4px; margin-bottom: 10px; }
:where(body[data-vista="quotesmap"]) .geo-nota { font-size: var(--q3-fs-xs); color: var(--q3-texto-4, #64748B); margin-top: 8px; line-height: 1.5; }

/* ── rentals (core/app/view/rentals-view.php) ───────────────────────────────────────────────────── */
:where(body[data-vista="rentals"]) .rental-ops { padding: 20px 22px 30px; background:#F7F9FC; }
:where(body[data-vista="rentals"]) .rental-ops .ro-title { font-size:var(--q3-fs-2xl); font-weight:800; color:var(--q3-texto-1, #1E293B); margin:0 0 4px; }
:where(body[data-vista="rentals"]) .rental-ops .ro-sub { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748B); margin-bottom:18px; }

/* KPIs */
:where(body[data-vista="rentals"]) .ro-kpis { display:grid; grid-template-columns:repeat(7,1fr); gap:14px; margin-bottom:18px; }
:where(body[data-vista="rentals"]) .ro-kpi { background:var(--q3-fondo, #fff); border:1px solid #EDF2F7; border-radius:16px; padding:16px; box-shadow:0 6px 18px rgba(15,23,42,.05);
          transition:transform .2s ease, box-shadow .2s ease; position:relative; overflow:hidden; cursor:pointer; }
:where(body[data-vista="rentals"]) .ro-kpi:hover { transform:translateY(-3px); box-shadow:0 12px 28px rgba(15,23,42,.10); }
:where(body[data-vista="rentals"]) .ro-panel.flash { animation: roFlash 1.4s ease; }
@keyframes roFlash {
  0%   { box-shadow:0 0 0 0 rgba(37,99,235,.50); }
  25%  { box-shadow:0 0 0 4px rgba(37,99,235,.40); }
  100% { box-shadow:0 6px 18px rgba(15,23,42,.05); }
}
:where(body[data-vista="rentals"]) .ro-kpi::after { content:''; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--c,#3B82F6); }
:where(body[data-vista="rentals"]) .ro-kpi .ic { width:42px; height:42px; border-radius:12px; background:var(--c,#3B82F6); color:#fff;
              display:flex; align-items:center; justify-content:center; font-size:var(--q3-fs-2xl); margin-bottom:10px; }
:where(body[data-vista="rentals"]) .ro-kpi .v { font-size:var(--q3-fs-3xl); font-weight:800; color:var(--c,#3B82F6); line-height:1; }
:where(body[data-vista="rentals"]) .ro-kpi .l { font-size:var(--q3-fs-xs); font-weight:600; color:var(--q3-texto-4, #64748B); text-transform:uppercase; letter-spacing:.04em; margin-top:6px; }

/* Paneles en grilla de 2 columnas (cada panel a media página) */
:where(body[data-vista="rentals"]) .ro-stack { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
@media(max-width:900px){ :where(body[data-vista="rentals"]) .ro-stack { grid-template-columns:1fr; } }
:where(body[data-vista="rentals"]) .ro-panel { background:var(--q3-fondo, #fff); border:1px solid #EDF2F7; border-radius:16px; box-shadow:0 6px 18px rgba(15,23,42,.05); overflow:hidden; }
:where(body[data-vista="rentals"]) .ro-panel-h { display:flex; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid #F1F5F9; font-weight:800; font-size:var(--q3-fs-md); color:var(--q3-texto-1, #1E293B); cursor:move; user-select:none; }
:where(body[data-vista="rentals"]) .ro-panel-h .pri { display:none; }                 /* números retirados */
:where(body[data-vista="rentals"]) .ro-panel.dragging { opacity:.4; }
:where(body[data-vista="rentals"]) .ro-panel.drag-over { outline:2px dashed #93C5FD; outline-offset:-2px; }
:where(body[data-vista="rentals"]) .ro-panel-h .badge { margin-left:auto; font-size:var(--q3-fs-xs); font-weight:800; padding:2px 10px; border-radius:999px; background:#EEF4FF; color:#2563EB; }
:where(body[data-vista="rentals"]) .ro-panel-h .badge.red { background:rgba(239,68,68,.12); color:#DC2626; }
:where(body[data-vista="rentals"]) .ro-table { width:100%; border-collapse:collapse; }
:where(body[data-vista="rentals"]) .ro-table th { text-align:left; font-size:var(--q3-fs-2xs); text-transform:uppercase; letter-spacing:.04em; color:var(--q3-texto-5, #94A3B8); padding:8px 16px; border-bottom:1px solid #F1F5F9; }
:where(body[data-vista="rentals"]) .ro-table td { font-size:var(--q3-fs-sm); color:var(--q3-texto-1, #1E293B); padding:9px 16px; border-bottom:1px solid #F5F7FA; }
:where(body[data-vista="rentals"]) .ro-table tr:last-child td { border-bottom:none; }
:where(body[data-vista="rentals"]) .ro-empty { padding:18px 16px; color:var(--q3-texto-5, #94A3B8); font-size:var(--q3-fs-sm); text-align:center; }
:where(body[data-vista="rentals"]) .ro-open { display:inline-flex; align-items:center; gap:5px; padding:5px 12px; border-radius:8px; font-size:var(--q3-fs-xs); font-weight:700;
           text-decoration:none !important; color:#fff !important; background:#2563EB; }
:where(body[data-vista="rentals"]) .ro-chip-dias { font-weight:800; color:#DC2626; }
/* Botón primario del módulo Alquileres: compone sobre el componente base .q-btn.
   El contenido (ícono FA + texto) es SIEMPRE blanco (--q-btn-fg heredado por currentColor y
   reafirmado por el guard del DS en hover/focus/active). El hover actúa sobre el FONDO, no sobre
   el contenido: eleva 2px, sube el brillo y refuerza la sombra. Alcance: solo este módulo. */
:where(body[data-vista="rentals"]) .ro-newbtn {
  --q-btn-fg:#fff;
  background:linear-gradient(135deg,#4F46E5,#2563EB);
  border:none; border-radius:12px; font-weight:700; text-decoration:none !important;
  box-shadow:0 2px 8px rgba(37,99,235,.28);
  transition:transform var(--q-duration-base,200ms) var(--q-ease,ease),
             box-shadow var(--q-duration-base,200ms) var(--q-ease,ease),
             filter var(--q-duration-base,200ms) var(--q-ease,ease);
}
:where(body[data-vista="rentals"]) .ro-newbtn:hover { transform:translateY(-2px); filter:brightness(1.07); box-shadow:0 10px 22px rgba(37,99,235,.36); }
:where(body[data-vista="rentals"]) .ro-newbtn:active { transform:translateY(1px); filter:brightness(1); box-shadow:0 4px 10px rgba(37,99,235,.30); }
:where(body[data-vista="rentals"]) .ro-newbtn:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(147,197,253,.75), 0 8px 18px rgba(37,99,235,.30); }
/* Toolbar del Centro: igualar la altura de los botones .q-btn (Dashboard, Nuevo alquiler) al
   buscador (40px) para alineación exacta en la fila. Solo hay q-btn en la cabecera del módulo. */
:where(body[data-vista="rentals"]) .rental-ops .q-btn { height:40px; }

@media(max-width:1200px){ :where(body[data-vista="rentals"]) .ro-kpis { grid-template-columns:repeat(3,1fr);} }
@media(max-width:620px){ :where(body[data-vista="rentals"]) .ro-kpis { grid-template-columns:repeat(2,1fr);} }

/* ── rentalslist (core/app/view/rentalslist-view.php) ───────────────────────────────────────────────── */
:where(body[data-vista="rentalslist"]) .rl-page { padding:20px 22px 30px; background:#F7F9FC; }
/* Primitivas de card/tabla del módulo (mismo lenguaje visual que el Centro) */
:where(body[data-vista="rentalslist"]) .ro-panel { background:var(--q3-fondo, #fff); border:1px solid #EDF2F7; border-radius:16px; box-shadow:0 6px 18px rgba(15,23,42,.05); overflow:hidden; }
:where(body[data-vista="rentalslist"]) .ro-panel-h { display:flex; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid #F1F5F9; font-weight:800; font-size:var(--q3-fs-md); color:var(--q3-texto-1, #1E293B); }
:where(body[data-vista="rentalslist"]) .ro-panel-h .badge { margin-left:auto; font-size:var(--q3-fs-xs); font-weight:800; padding:2px 10px; border-radius:999px; background:#EEF4FF; color:#2563EB; }
:where(body[data-vista="rentalslist"]) .ro-table { width:100%; border-collapse:collapse; }
:where(body[data-vista="rentalslist"]) .ro-table th { text-align:left; font-size:var(--q3-fs-2xs); text-transform:uppercase; letter-spacing:.04em; color:var(--q3-texto-5, #94A3B8); padding:8px 16px; border-bottom:1px solid #F1F5F9; }
:where(body[data-vista="rentalslist"]) .ro-table td { font-size:var(--q3-fs-sm); color:var(--q3-texto-1, #1E293B); padding:9px 16px; border-bottom:1px solid #F5F7FA; }
:where(body[data-vista="rentalslist"]) .ro-table tr:last-child td { border-bottom:none; }
:where(body[data-vista="rentalslist"]) .ro-empty { padding:18px 16px; color:var(--q3-texto-5, #94A3B8); font-size:var(--q3-fs-sm); text-align:center; }
:where(body[data-vista="rentalslist"]) .ro-open { display:inline-flex; align-items:center; gap:5px; padding:5px 12px; border-radius:8px; font-size:var(--q3-fs-xs); font-weight:700;
           text-decoration:none !important; color:#fff !important; background:#2563EB; }
/* ===== Bandeja de Alquileres (idéntica a la original) ===== */
:where(body[data-vista="rentalslist"]) .ba-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; padding:14px 16px; border-bottom:1px solid #F1F5F9; }
:where(body[data-vista="rentalslist"]) .ba-f { display:flex; flex-direction:column; gap:4px; }
:where(body[data-vista="rentalslist"]) .ba-f label { font-size:var(--q3-fs-2xs); font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--q3-texto-5, #94A3B8); }
:where(body[data-vista="rentalslist"]) .ba-f input, :where(body[data-vista="rentalslist"]) .ba-f select { height:40px; border:1px solid var(--q3-borde, #E2E8F0); border-radius:10px; padding:0 12px; font-size:var(--q3-fs-md); background:var(--q3-fondo, #fff); color:var(--q3-texto-1, #1E293B); }
:where(body[data-vista="rentalslist"]) .ba-f--grow { flex:1; min-width:200px; }
:where(body[data-vista="rentalslist"]) .ba-f--grow input { width:100%; }
:where(body[data-vista="rentalslist"]) .ba-f-actions { display:flex; gap:8px; margin-left:auto; align-items:flex-end; }
:where(body[data-vista="rentalslist"]) .ba-tablewrap { overflow-x:auto; }
:where(body[data-vista="rentalslist"]) .ba-table td, :where(body[data-vista="rentalslist"]) .ba-table th { white-space:nowrap; }
:where(body[data-vista="rentalslist"]) .ba-table td:nth-child(5) { white-space:normal; }              /* Cliente puede envolver */
@media (max-width:760px){
  :where(body[data-vista="rentalslist"]) .ba-f-actions { margin-left:0; width:100%; }
  :where(body[data-vista="rentalslist"]) .ba-f-actions .q-btn { flex:1; }
  /* Tabla -> tarjetas (patrón data-label, sin diseño paralelo) */
  :where(body[data-vista="rentalslist"]) .ba-table thead { display:none; }
  :where(body[data-vista="rentalslist"]) .ba-table, :where(body[data-vista="rentalslist"]) .ba-table tbody, :where(body[data-vista="rentalslist"]) .ba-table tr, :where(body[data-vista="rentalslist"]) .ba-table td { display:block; width:100%; }
  :where(body[data-vista="rentalslist"]) .ba-table tr { border:1px solid #EDF2F7; border-radius:12px; margin:10px 12px; padding:4px 0; box-shadow:0 2px 6px rgba(15,23,42,.04); }
  :where(body[data-vista="rentalslist"]) .ba-table td { display:flex; justify-content:space-between; align-items:center; gap:12px; border:none; padding:7px 14px; text-align:right; white-space:normal; }
  :where(body[data-vista="rentalslist"]) .ba-table td::before { content:attr(data-label); font-size:var(--q3-fs-2xs); font-weight:800; text-transform:uppercase; letter-spacing:.03em; color:var(--q3-texto-5, #94A3B8); text-align:left; }
  :where(body[data-vista="rentalslist"]) .ba-table td[data-label=""]::before { content:""; }
}

/* ── rptbox (core/app/view/rptbox-view.php) ────────────────────────────────────────────────────── */
/* ── Cuadre de caja diario (cj) ── */
:where(body[data-vista="rptbox"]) .cj { padding:4px 2px 24px; color:#1f2937; }
:where(body[data-vista="rptbox"]) .cj-card { background:var(--q3-fondo, #fff); border:1px solid var(--q3-borde-2, #e5e7eb); border-radius:12px; }
/* Una sola fila: título | filtros | acciones. Si no cabe, se acomoda en varias. */
:where(body[data-vista="rptbox"]) .cj-bar { display:flex; align-items:flex-end; gap:10px 20px; flex-wrap:wrap; padding:10px 16px; margin-bottom:12px; }
:where(body[data-vista="rptbox"]) .cj-bar__tit { margin-right:auto; align-self:center; }
:where(body[data-vista="rptbox"]) .cj-bar h3 { font-size:var(--q3-fs-xl); font-weight:800; margin:0; color:var(--q3-texto, #0f172a); }
:where(body[data-vista="rptbox"]) .cj-bar p { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); margin:1px 0 0; }

:where(body[data-vista="rptbox"]) .cj-fld { display:flex; flex-direction:column; gap:2px; }
:where(body[data-vista="rptbox"]) .cj-fld label { font-size:var(--q3-fs-2xs); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; }
/* Campos y botones con la misma altura, apoyados en la misma línea. */
:where(body[data-vista="rptbox"]) .cj-fld input, :where(body[data-vista="rptbox"]) .cj-fld select, :where(body[data-vista="rptbox"]) .cj-btn { box-sizing:border-box; height:34px; margin:0; }
:where(body[data-vista="rptbox"]) .cj-fld input, :where(body[data-vista="rptbox"]) .cj-fld select { border:1px solid #d1d5db; border-radius:8px; padding:0 10px; font-size:var(--q3-fs-md); width:112px; background-color:var(--q3-fondo, #fff); }
:where(body[data-vista="rptbox"]) .cj-btn { border:1px solid transparent; border-radius:8px; padding:0 12px; font-size:var(--q3-fs-md); font-weight:600; display:inline-flex; align-items:center; gap:6px; text-decoration:none; cursor:pointer; white-space:nowrap; }
:where(body[data-vista="rptbox"]) .cj-bar__grupo { display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; }
/* Ver y Limpiar van en su propio bloque: design-system-botones.css centra con !important
   todo bloque que contiene #btnBuscar, y eso desalineaba los botones de los campos. */
:where(body[data-vista="rptbox"]) .cj-bar__botones { display:flex; gap:10px; }
:where(body[data-vista="rptbox"]) .cj-bar__acciones { display:flex; gap:10px; }
:where(body[data-vista="rptbox"]) .cj-btn--azul { background:#2563eb; color:#fff; }
:where(body[data-vista="rptbox"]) .cj-btn--naranja { background:#f97316; color:#fff; }
:where(body[data-vista="rptbox"]) .cj-btn--verde { background:#16a34a; color:#fff; }
:where(body[data-vista="rptbox"]) .cj-btn--rojo { background:#dc2626; color:#fff; }
:where(body[data-vista="rptbox"]) .cj-btn:hover { filter:brightness(.95); }

:where(body[data-vista="rptbox"]) .cj-q { display:flex; align-items:baseline; gap:10px; margin:16px 0 8px; font-size:var(--q3-fs-xl); font-weight:800; color:var(--q3-texto, #0f172a); }
:where(body[data-vista="rptbox"]) .cj-q b { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:#0f172a; color:#fff; font-size:var(--q3-fs-md); }
:where(body[data-vista="rptbox"]) .cj-q small { font-size:var(--q3-fs-md); font-weight:500; color:var(--q3-texto-4, #64748b); }

/* 1 · Cuánto hay */
:where(body[data-vista="rptbox"]) .cj-hay { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
:where(body[data-vista="rptbox"]) .cj-hay__box { padding:12px 18px; border-radius:14px; border:1px solid var(--q3-borde-2, #e5e7eb); background:var(--q3-fondo, #fff); text-align:center; }
:where(body[data-vista="rptbox"]) .cj-hay__lbl { font-size:var(--q3-fs-md); font-weight:700; color:var(--q3-texto-3, #475569); display:flex; align-items:center; justify-content:center; gap:8px; }
:where(body[data-vista="rptbox"]) .cj-hay__amt { font-size:var(--q3-fs-4xl); font-weight:800; line-height:1.15; margin:4px 0 2px; color:var(--q3-texto, #0f172a); }
:where(body[data-vista="rptbox"]) .cj-hay__sub { font-size:var(--q3-fs-md); color:var(--q3-texto-4, #64748b); }
:where(body[data-vista="rptbox"]) .cj-hay__box--cajon { border-color:#86efac; background:#f0fdf4; }
:where(body[data-vista="rptbox"]) .cj-hay__box--cajon .cj-hay__amt { color:#15803d; }
:where(body[data-vista="rptbox"]) .cj-hay__box--neg { border-color:#fca5a5; background:#fef2f2; }
:where(body[data-vista="rptbox"]) .cj-hay__box--neg .cj-hay__amt, :where(body[data-vista="rptbox"]) .cj-hay__box--neg .cj-hay__sub { color:#b91c1c; }
:where(body[data-vista="rptbox"]) .cj-hay__box--banco .cj-hay__amt { color:#1d4ed8; }

/* 2 · De dónde vino */
:where(body[data-vista="rptbox"]) .cj-cuenta { width:100%; border-collapse:collapse; font-size:var(--q3-fs-lg); }
:where(body[data-vista="rptbox"]) .cj-cuenta th, :where(body[data-vista="rptbox"]) .cj-cuenta td { padding:11px 18px; border-bottom:1px solid #f1f5f9; text-align:left; }
:where(body[data-vista="rptbox"]) .cj-cuenta th { font-size:var(--q3-fs-sm); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; background:#fafbfc; }
:where(body[data-vista="rptbox"]) .cj-cuenta .r { text-align:right; white-space:nowrap; width:170px; }
:where(body[data-vista="rptbox"]) .cj-cuenta .cero { color:#cbd5e1; }
:where(body[data-vista="rptbox"]) .cj-cuenta .mas { color:#15803d; font-weight:700; }
:where(body[data-vista="rptbox"]) .cj-cuenta .menos { color:#b91c1c; font-weight:700; }
:where(body[data-vista="rptbox"]) .cj-cuenta .anul { color:var(--q3-texto-5, #94a3b8); font-weight:700; }
:where(body[data-vista="rptbox"]) .cj-cuenta .tachado { color:var(--q3-texto-5, #94a3b8); text-decoration:line-through; }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-grp { cursor:pointer; }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-grp:hover td { background:var(--q3-fondo-2, #f8fafc); }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-grp .bi-chevron-right { display:inline-block; transition:transform .15s; color:var(--q3-texto-5, #94a3b8); font-size:var(--q3-fs-sm); }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-grp.abierto .bi-chevron-right { transform:rotate(90deg); }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-det { display:none; }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-det td { font-size:var(--q3-fs-md); color:var(--q3-texto-3, #475569); background:#fcfcfd; padding-top:7px; padding-bottom:7px; }
:where(body[data-vista="rptbox"]) .cj-cuenta tr.cj-det td:first-child { padding-left:46px; }
:where(body[data-vista="rptbox"]) .cj-cuenta tfoot td { font-size:var(--q3-fs-xl); font-weight:800; background:var(--q3-fondo-3, #f1f5f9); border-bottom:0; }

/* 3 · Qué se vendió */
:where(body[data-vista="rptbox"]) .cj-tarjetas { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; margin-bottom:10px; }
:where(body[data-vista="rptbox"]) .cj-tarjeta { text-align:left; border:1px solid var(--q3-borde-2, #e5e7eb); border-radius:12px; background:var(--q3-fondo, #fff); padding:12px 16px; cursor:pointer; }
:where(body[data-vista="rptbox"]) .cj-tarjeta:hover { border-color:#94a3b8; }
:where(body[data-vista="rptbox"]) .cj-tarjeta.on { border:2px solid #2563eb; padding:11px 15px; background:#eff6ff; }
:where(body[data-vista="rptbox"].dark-mode) .cj-tarjeta.on { background:rgba(37,99,235,.18); border-color:#60A5FA; }
:where(body[data-vista="rptbox"].dark-mode) .cj-fld input, :where(body[data-vista="rptbox"].dark-mode) .cj-fld select { color:var(--q-text-1); border-color:var(--q-border); }
:where(body[data-vista="rptbox"]) .cj-tarjeta__lbl { font-size:var(--q3-fs-md); font-weight:700; color:var(--q3-texto-4, #64748b); }
:where(body[data-vista="rptbox"]) .cj-tarjeta__amt { font-size:var(--q3-fs-3xl); font-weight:800; color:var(--q3-texto, #0f172a); margin:2px 0; }
:where(body[data-vista="rptbox"]) .cj-tarjeta__sub { font-size:var(--q3-fs-sm); color:var(--q3-texto-5, #94a3b8); }
:where(body[data-vista="rptbox"]) .cj-tarjeta--anul.hay { border-color:#fca5a5; }
:where(body[data-vista="rptbox"]) .cj-tarjeta--pend.hay { border-color:#fca5a5; background:#fef2f2; }
:where(body[data-vista="rptbox"]) .cj-tarjeta--pend.hay .cj-tarjeta__amt { color:#b91c1c; }
:where(body[data-vista="rptbox"]) tr.cj-pend td:first-child { box-shadow:inset 4px 0 0 #dc2626; }
/* La tarjeta elegida se marca igual aunque tenga color de alerta. */
:where(body[data-vista="rptbox"]) .cj-tarjeta.on.hay { border:2px solid #2563eb; padding:11px 15px; }
:where(body[data-vista="rptbox"]) .cj-tarjeta--anul.hay .cj-tarjeta__amt { color:#b91c1c; }
:where(body[data-vista="rptbox"]) .cj-tbl { width:100%; border-collapse:collapse; font-size:var(--q3-fs-lg); }
:where(body[data-vista="rptbox"]) .cj-tbl th, :where(body[data-vista="rptbox"]) .cj-tbl td { padding:9px 14px; text-align:left; border-bottom:1px solid #f1f5f9; vertical-align:middle; }
:where(body[data-vista="rptbox"]) .cj-tbl th { font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; background:#fafbfc; }
:where(body[data-vista="rptbox"]) .cj-tbl .r { text-align:right; white-space:nowrap; }
:where(body[data-vista="rptbox"]) .cj-tbl tfoot td { font-size:var(--q3-fs-xl); font-weight:800; background:#eff6ff; color:#1d4ed8; border-bottom:0; }
:where(body[data-vista="rptbox"]) .cj-pill { display:inline-block; padding:2px 9px; border-radius:20px; font-size:var(--q3-fs-xs); font-weight:700; white-space:nowrap; }
:where(body[data-vista="rptbox"]) .cj-pill--contado { background:#dcfce7; color:#166534; }
:where(body[data-vista="rptbox"]) .cj-pill--credito { background:#fef3c7; color:#92400e; }
:where(body[data-vista="rptbox"]) .cj-pill--anulada { background:#dc2626; color:#fff; }
:where(body[data-vista="rptbox"]) .cj-pill--nota { background:#f97316; color:#fff; }
:where(body[data-vista="rptbox"]) .cj-pill--alerta { background:#fee2e2; color:#991b1b; }
:where(body[data-vista="rptbox"]) tr.cj-anulada td { background:#fef2f2; color:#991b1b; }
:where(body[data-vista="rptbox"]) tr.cj-anulada td:first-child { box-shadow:inset 4px 0 0 #dc2626; }
:where(body[data-vista="rptbox"]) tr.cj-anulada .cj-monto { text-decoration:line-through; }
:where(body[data-vista="rptbox"]) tr.cj-nota td { background:#fff7ed; color:#9a3412; }
:where(body[data-vista="rptbox"]) tr.cj-nota td:first-child { box-shadow:inset 4px 0 0 #f97316; }
:where(body[data-vista="rptbox"]) tr.cj-alerta td:first-child { box-shadow:inset 4px 0 0 #fca5a5; }
:where(body[data-vista="rptbox"]) .cj-sub { display:block; font-size:var(--q3-fs-sm); color:var(--q3-texto-5, #94a3b8); }
:where(body[data-vista="rptbox"]) .cj-nw { white-space:nowrap; }
/* 3 · tabla de comprobantes: todo centrado */
:where(body[data-vista="rptbox"]) #cjVentas th, :where(body[data-vista="rptbox"]) #cjVentas td { text-align:center; }
:where(body[data-vista="rptbox"]) #cjVentas .cj-pill { margin-top:3px; }
:where(body[data-vista="rptbox"]) #cjVentas .cj-pagar { margin-top:4px; }
:where(body[data-vista="rptbox"]) #cjVentas td.cj-cli { min-width:220px; }
:where(body[data-vista="rptbox"]) #cjVentas td.cj-saldo { min-width:150px; max-width:240px; white-space:normal; }
:where(body[data-vista="rptbox"]) #cjVentas td.cj-saldo .cj-sub { white-space:normal; }
:where(body[data-vista="rptbox"]) #cjVentas tfoot td { white-space:nowrap; }
:where(body[data-vista="rptbox"]) .cj-saldo--ok { color:#15803d; }
:where(body[data-vista="rptbox"]) .cj-saldo--debe { color:#c2410c; }
:where(body[data-vista="rptbox"]) .cj-pill--sunat-aceptado { background:#dcfce7; color:#166534; }
:where(body[data-vista="rptbox"]) .cj-pill--sunat-pendiente { background:#fef3c7; color:#92400e; }
:where(body[data-vista="rptbox"]) .cj-pill--sunat-rechazado { background:#fee2e2; color:#991b1b; }
:where(body[data-vista="rptbox"]) .cj-vacio { padding:24px; text-align:center; color:var(--q3-texto-5, #94a3b8); }
@media (max-width:900px){ :where(body[data-vista="rptbox"]) .cj-hay {grid-template-columns:1fr;} :where(body[data-vista="rptbox"]) .cj-tarjetas {grid-template-columns:repeat(2,1fr);} :where(body[data-vista="rptbox"]) .cj-cuenta .r {width:auto;} }
@media (max-width:600px){ :where(body[data-vista="rptbox"]) .cj-hay__amt {font-size:var(--q3-fs-4xl);} }

/* ── rptcobranzas (core/app/view/rptcobranzas-view.php) ──────────────────────────────────────────────── */
/* Mismo criterio que la bandeja de Ventas: el filtro Cliente ocupa dos columnas
       de la barra, no todo el hueco que dejen los botones. */
    :where(body[data-vista="rptcobranzas"]) .q-toolbar .q-toolbar__field--cliente { flex: 0 1 calc((100% - 60px) / 7 * 2 + 10px); }

/* ── rptgrafic (core/app/view/rptgrafic-view.php) ─────────────────────────────────────────────────── */
/* ── Gráficos: altura fija del contenedor ──
   Los charts usan responsive + maintainAspectRatio:false; sin alto en el
   contenedor crecían hasta ~629px (y vacíos se veían "rotos"). Patrón Chart.js:
   contenedor relativo con alto fijo -> el canvas lo llena. */
:where(body[data-vista="rptgrafic"]) .rv-chart-container { position:relative; height:340px; }
:where(body[data-vista="rptgrafic"]) #fv, :where(body[data-vista="rptgrafic"]) #mp { position:relative; height:286px; }

/* ── rptinventario (core/app/view/rptinventario-view.php) ─────────────────────────────────────────────── */
/* OPT-013 (UX reportes): evita el flash de filas crudas. La tabla queda oculta
   hasta que DataTables la envuelve (.dataTables_wrapper) y la pagina; así no se
   pintan las ~3.250 filas crudas antes del colapso. Sin reservar alto -> sin CLS. */
:where(body[data-vista="rptinventario"]) .rv-table.datatable {display:none}
:where(body[data-vista="rptinventario"]) .dataTables_wrapper .rv-table.datatable {display:table}

/* ── rptsalesdetail (core/app/view/rptsalesdetail-view.php) ────────────────────────────────────────────── */
/* Los dos cuadros de cifras, en fila. Va AQUI y no en politica-comercial.css a
   proposito: esa hoja la comparten `rptsales` y la bandeja de ventas, y el
   segundo cuadro es solo de este reporte. Tocarla cambiaria pantallas que nadie
   ha pedido cambiar -y obligaria a subir al servidor un archivo compartido, que
   es justo lo que este reporte evita-.

   `flex-wrap` para que en una pantalla estrecha el segundo caiga debajo en vez
   de encogerse: son cifras, y una cifra apretada se lee mal. El margen inferior
   lo trae ya `.rv-resumen`, asi que el contenedor no aniade ninguno. */
:where(body[data-vista="rptsalesdetail"]) .rvd-cuadros { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
:where(body[data-vista="rptsalesdetail"]) .rvd-cuadros > .rv-resumen { flex: 1 1 380px; max-width: 460px; }

/* El borde del resultado, en el color del dinero que se gana y no del que entra:
   `--neta` del cuadro de al lado es verde ventas; este es ambar para que de un
   vistazo no se confundan las dos cifras grandes de la pantalla. */
:where(body[data-vista="rptsalesdetail"]) .rvd-rentab .rv-resumen__linea--neta { border-top-color: #B45309; }
:where(body[data-vista="rptsalesdetail"]) .rvd-rentab .rv-resumen__linea--neta .rv-resumen__cifra { color: #B45309; }

/* La linea de conciliacion con la columna GANANCIA. Misma rejilla que las de
   arriba -por eso reutiliza `.rv-resumen__linea`- pero apagada: es un dato de
   apoyo, no una de las tres cifras que se leen de un vistazo. */
:where(body[data-vista="rptsalesdetail"]) .rvd-conigv {
    margin-top: 6px; padding-top: 8px; border-top: 1px dashed #E3E8EF;
    font-size: var(--q3-fs-sm); color: var(--q3-texto-5, #94A3B8);
}
:where(body[data-vista="rptsalesdetail"]) .rvd-conigv .rv-resumen__cifra { font-weight: 600; color: var(--q3-texto-4, #64748B); }

/* RPT-VTD-FIL-001 · todas las columnas centradas, cabecera, datos y pie, también
   los importes: es la regla de las tablas del sistema. `!important` porque las
   celdas traen su alineación en línea desde antes. */
:where(body[data-vista="rptsalesdetail"]) #rvd-tabla th, :where(body[data-vista="rptsalesdetail"]) #rvd-tabla td { text-align: center !important; vertical-align: middle; }
/* Los botones, alineados con los filtros: misma línea de base y misma altura que
   los campos. Antes la columna bajaba los botones con un `padding-top: 25px` fijo
   y quedaban más altos y desplazados respecto de los desplegables. */
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .q-campo { align-items: flex-end !important; }
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .rvd-acciones {
    display: flex !important; flex-wrap: wrap; align-items: flex-end !important;
    gap: 8px !important; padding: 0 !important; width: auto !important;
}
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .rvd-acciones .btn, :where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .rvd-acciones .q-btn {
    height: var(--q-control-h, 38px) !important; min-height: 0 !important;
    margin: 0 !important; transform: none !important;
}
/* Los desplegables a la misma altura que los cuadros de fecha. */
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .select2-container .select2-selection--single { height: var(--q-control-h, 38px) !important; }
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .select2-container .select2-selection--single .select2-selection__rendered { line-height: calc(var(--q-control-h, 38px) - 2px) !important; }
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .select2-container .select2-selection--single .select2-selection__arrow { height: calc(var(--q-control-h, 38px) - 2px) !important; }
:where(body[data-vista="rptsalesdetail"]) #rptsalesdetail .select2-container .select2-selection--multiple { min-height: var(--q-control-h, 38px) !important; }
/* El aviso de que las cifras son sólo de las líneas filtradas. */
:where(body[data-vista="rptsalesdetail"]) .rvd-filtro-nota { margin: -4px 0 12px; font-size: var(--q3-fs-sm); color: var(--q3-texto-4, #64748B); }
:where(body[data-vista="rptsalesdetail"]) .rvd-filtro-nota strong { color: #1F3B73; }

/* ── rptvencimientos (core/app/view/rptvencimientos-view.php) ───────────────────────────────────────────── */
:where(body[data-vista="rptvencimientos"]) .rv-semaforo {display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
:where(body[data-vista="rptvencimientos"]) .rv-luz {flex:1 1 180px;border-radius:6px;padding:12px 16px;border-left:6px solid #999;background:#fafafa}
:where(body[data-vista="rptvencimientos"]) .rv-luz--rojo {border-left-color:#b3261e;background:#fdecea}
:where(body[data-vista="rptvencimientos"]) .rv-luz--amarillo {border-left-color:#8a5a08;background:#fdf5e2}
:where(body[data-vista="rptvencimientos"]) .rv-luz--verde {border-left-color:#1c7a4a;background:#e9f6ef}
:where(body[data-vista="rptvencimientos"]) .rv-luz__t {display:block;font-size:var(--q3-fs-xs);letter-spacing:.06em;text-transform:uppercase;color:#5a5a5a;font-weight:700}
:where(body[data-vista="rptvencimientos"]) .rv-luz__n {display:block;font-size:var(--q3-fs-3xl);font-weight:700;line-height:1.2;font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="rptvencimientos"]) .rv-luz__v {display:block;font-size:var(--q3-fs-sm);color:#5a5a5a;font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="rptvencimientos"]) .rv-filtros {display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:14px}
:where(body[data-vista="rptvencimientos"]) .rv-f {display:flex;flex-direction:column;min-width:150px}
:where(body[data-vista="rptvencimientos"]) .rv-f--ancho {flex:1 1 220px}
:where(body[data-vista="rptvencimientos"]) .rv-f--btn {flex-direction:row;gap:6px;align-items:flex-end}
:where(body[data-vista="rptvencimientos"]) .rv-f label {font-size:var(--q3-fs-xs);letter-spacing:.05em;text-transform:uppercase;color:#666;margin-bottom:2px;font-weight:700}
:where(body[data-vista="rptvencimientos"]) .rv-punto {display:inline-block;width:12px;height:12px;border-radius:50%;background:#bbb}
:where(body[data-vista="rptvencimientos"]) .rv-punto--rojo {background:#b3261e}
:where(body[data-vista="rptvencimientos"]) .rv-punto--amarillo {background:#e0a80a}
:where(body[data-vista="rptvencimientos"]) .rv-punto--verde {background:#1c7a4a}
:where(body[data-vista="rptvencimientos"]) .rv-fila--rojo td {background:#fdecea}
:where(body[data-vista="rptvencimientos"]) .rv-fila--amarillo td {background:#fdf7e8}
:where(body[data-vista="rptvencimientos"]) .rv-mono {font-family:var(--q-font-family);font-variant-numeric:tabular-nums}
:where(body[data-vista="rptvencimientos"]) .rv-pie {margin-top:12px;font-size:var(--q3-fs-sm);color:#666}
/* El boton de merma se recortaba: la columna necesita su ancho y el boton no debe partirse. */
:where(body[data-vista="rptvencimientos"]) #tablaVenc th:last-child, :where(body[data-vista="rptvencimientos"]) #tablaVenc td:last-child {min-width:120px;white-space:nowrap}
/* El tema convierte los .btn del panel en iconos redondos de ancho fijo, y el
   boton de merma quedaba recortado a "Merm". Se le devuelve su ancho natural. */
:where(body[data-vista="rptvencimientos"]) #tablaVenc .rv-merma {width:auto!important;min-width:0!important;height:auto!important;padding:4px 12px!important;border-radius:4px!important;white-space:nowrap;font-size:var(--q3-fs-sm);line-height:1.5}

/* ── rptvendedor (core/app/view/rptvendedor-view.php) ───────────────────────────────────────────────── */
:where(body[data-vista="rptvendedor"]) .rvn-mes { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 14px; padding:14px 18px; margin-bottom:16px;
           border:1px solid #BBF7D0; border-radius:10px; background:#F0FDF4; }
:where(body[data-vista="rptvendedor"]) .rvn-mes__rotulo { font-size:var(--q3-fs-md); color:#166534; text-transform:uppercase; letter-spacing:.3px; }
:where(body[data-vista="rptvendedor"]) .rvn-mes__cifra { font-size:var(--q3-fs-4xl); font-weight:700; color:#15803D; }
:where(body[data-vista="rptvendedor"]) .rvn-mes__nota { font-size:var(--q3-fs-sm); color:#4B5563; }
:where(body[data-vista="rptvendedor"]) .rvn-tabla td, :where(body[data-vista="rptvendedor"]) .rvn-tabla th { white-space:nowrap; vertical-align:middle; }
:where(body[data-vista="rptvendedor"]) .rvn-tabla .rvn-num { text-align:right; }
:where(body[data-vista="rptvendedor"]) .rvn-tabla tr.rvn-nc td.rvn-num { color:#C00000; }
:where(body[data-vista="rptvendedor"]) .rvn-tabla tr.rvn-anulado td { color:#b91c1c; text-decoration:line-through; text-decoration-color:rgba(185,28,28,.65); }   /* VTA-ANU-VIS-001: el mismo rojo tachado que Ventas */
:where(body[data-vista="rptvendedor"]) .rvn-tabla tr.rvn-anulado td.rvn-acc, :where(body[data-vista="rptvendedor"]) .rvn-tabla tr.rvn-anulado td.rvn-est { text-decoration:none; }
:where(body[data-vista="rptvendedor"]) .rvn-origen { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748B); }

/* ── rptvoid (core/app/view/rptvoid-view.php) ───────────────────────────────────────────────────── */
/* CAJ-ANU-001 · Comprobantes anulados. Todo centrado (preferencia del usuario). */
:where(body[data-vista="rptvoid"]) .anu-wrap { padding: 4px 2px 24px; color: #1f2937; }
:where(body[data-vista="rptvoid"]) .anu-card { background:var(--q3-fondo, #fff); border:1px solid var(--q3-borde-2, #e5e7eb); border-radius:12px; box-shadow:0 1px 2px rgba(16,24,40,.04); margin-bottom:16px; }
:where(body[data-vista="rptvoid"]) .anu-bar { display:flex; align-items:flex-end; gap:16px 22px; flex-wrap:wrap; padding:16px 22px; }
:where(body[data-vista="rptvoid"]) .anu-tit { display:flex; align-items:center; gap:14px; align-self:center; }
:where(body[data-vista="rptvoid"]) .anu-tit__ic { width:52px; height:52px; border-radius:12px; background:linear-gradient(135deg,#dc2626,#991b1b); color:#fff; display:flex; align-items:center; justify-content:center; font-size:var(--q3-fs-3xl); }
:where(body[data-vista="rptvoid"]) .anu-tit h3 { font-size:var(--q3-fs-3xl); font-weight:800; margin:0; color:var(--q3-texto, #0f172a); }
:where(body[data-vista="rptvoid"]) .anu-tit p { font-size:var(--q3-fs-md); color:#6b7280; margin:2px 0 0; }
:where(body[data-vista="rptvoid"]) .anu-fil { display:flex; gap:14px; align-items:flex-end; flex-wrap:wrap; }
:where(body[data-vista="rptvoid"]) .anu-fld { display:flex; flex-direction:column; gap:4px; }
:where(body[data-vista="rptvoid"]) .anu-fld label { font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; }
:where(body[data-vista="rptvoid"]) .anu-fld input, :where(body[data-vista="rptvoid"]) .anu-fld select { border:1px solid #d1d5db; border-radius:8px; padding:8px 10px; font-size:var(--q3-fs-lg); min-width:140px; }
:where(body[data-vista="rptvoid"]) .anu-acc { display:flex; gap:10px; margin-left:auto; }
:where(body[data-vista="rptvoid"]) .anu-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:16px; }
:where(body[data-vista="rptvoid"]) .anu-kpi { padding:16px 18px; border-radius:12px; border:1px solid var(--q3-borde-2, #e5e7eb); border-top:4px solid #dc2626; background:var(--q3-fondo, #fff); text-align:center; }
:where(body[data-vista="rptvoid"]) .anu-kpi span { display:block; color:var(--q3-texto-4, #64748b); font-size:var(--q3-fs-sm); font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
:where(body[data-vista="rptvoid"]) .anu-kpi b { display:block; font-size:var(--q3-fs-4xl); font-weight:800; margin:8px 0 4px; color:#b91c1c; }
:where(body[data-vista="rptvoid"]) .anu-kpi small { font-size:var(--q3-fs-sm); color:var(--q3-texto-5, #94a3b8); }
:where(body[data-vista="rptvoid"]) .anu-kpi--amb { border-top-color:#f59e0b; } :where(body[data-vista="rptvoid"]) .anu-kpi--amb b { color:#b45309; }
:where(body[data-vista="rptvoid"]) .anu-kpi--ind { border-top-color:#4f46e5; } :where(body[data-vista="rptvoid"]) .anu-kpi--ind b { color:#4338ca; font-size:var(--q3-fs-2xl); }
:where(body[data-vista="rptvoid"]) .anu-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
:where(body[data-vista="rptvoid"]) .anu-hd { display:flex; align-items:center; justify-content:center; gap:8px; padding:13px 18px; border-bottom:1px solid #eef2f7; font-weight:800; font-size:var(--q3-fs-lg); color:var(--q3-texto, #0f172a); }
:where(body[data-vista="rptvoid"]) .anu-tbl { width:100%; border-collapse:collapse; font-size:var(--q3-fs-lg); }
:where(body[data-vista="rptvoid"]) .anu-tbl th, :where(body[data-vista="rptvoid"]) .anu-tbl td { padding:10px 14px; text-align:center; vertical-align:middle; border-bottom:1px solid #f1f5f9; }
:where(body[data-vista="rptvoid"]) .anu-tbl th { font-size:var(--q3-fs-xs); text-transform:uppercase; letter-spacing:.4px; color:var(--q3-texto-5, #94a3b8); font-weight:700; background:#fafbfc; }
:where(body[data-vista="rptvoid"]) .anu-tbl tfoot td { font-weight:800; background:#fafbfc; }
:where(body[data-vista="rptvoid"]) .anu-tbl .monto { font-weight:700; color:#b91c1c; }
:where(body[data-vista="rptvoid"]) .anu-pill { display:inline-block; padding:2px 10px; border-radius:20px; font-size:var(--q3-fs-xs); font-weight:700; background:#fee2e2; color:#991b1b; }
:where(body[data-vista="rptvoid"]) .anu-pill--amb { background:#fef3c7; color:#92400e; }
:where(body[data-vista="rptvoid"]) .anu-mut { color:var(--q3-texto-5, #94a3b8); font-size:var(--q3-fs-sm); }
:where(body[data-vista="rptvoid"]) .anu-vacio { padding:22px; text-align:center; color:var(--q3-texto-5, #94a3b8); }
@media (max-width:1100px){ :where(body[data-vista="rptvoid"]) .anu-kpis {grid-template-columns:repeat(2,1fr);} :where(body[data-vista="rptvoid"]) .anu-grid {grid-template-columns:1fr;} :where(body[data-vista="rptvoid"]) .anu-acc {margin-left:0;} }
@media (max-width:640px){ :where(body[data-vista="rptvoid"]) .anu-kpis {grid-template-columns:1fr;} }

/* ── rutasentrega (core/app/view/rutasentrega-view.php) ──────────────────────────────────────────────── */
:where(body[data-vista="rutasentrega"]) .re-grid { display: grid; grid-template-columns: 320px minmax(0, 1fr) 320px; gap: 12px; align-items: start; }
:where(body[data-vista="rutasentrega"]) .re-grid > * { min-width: 0; }
@media (max-width: 1200px) { :where(body[data-vista="rutasentrega"]) .re-grid { grid-template-columns: 1fr; } }
:where(body[data-vista="rutasentrega"]) .re-col { border: 1px solid var(--q3-borde, #E2E8F0); border-radius: 8px; background: var(--q3-fondo, #fff); display: flex; flex-direction: column; }
:where(body[data-vista="rutasentrega"]) .re-col__h { padding: 8px 10px; border-bottom: 1px solid var(--q3-borde, #E2E8F0); font-size: var(--q3-fs-sm); font-weight: 700; color: var(--q3-texto-2, #334155); text-transform: uppercase; letter-spacing: .03em; display: flex; justify-content: space-between; align-items: center; gap: 6px; }
:where(body[data-vista="rutasentrega"]) .re-lista { max-height: 520px; overflow-y: auto; }
:where(body[data-vista="rutasentrega"]) .re-venta { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; padding: 8px 10px; border-bottom: 1px solid #F1F5F9; font-size: var(--q3-fs-sm); cursor: pointer; }
:where(body[data-vista="rutasentrega"]) .re-venta:hover { background: var(--q3-fondo-2, #F8FAFC); }
:where(body[data-vista="rutasentrega"]) .re-venta input { margin-top: 2px; }
:where(body[data-vista="rutasentrega"]) .re-venta__n { font-weight: 700; color: var(--q3-texto-1, #1E293B); }
:where(body[data-vista="rutasentrega"]) .re-venta__s { color: var(--q3-texto-4, #64748B); }
:where(body[data-vista="rutasentrega"]) .re-sinpunto { color: #B45309; font-weight: 600; }
:where(body[data-vista="rutasentrega"]) .re-mapa { height: 560px; border: 1px solid var(--q3-borde, #E2E8F0); border-radius: 8px; overflow: hidden; }
:where(body[data-vista="rutasentrega"]) .re-orden { list-style: none; margin: 0; padding: 0; max-height: 300px; overflow-y: auto; }
:where(body[data-vista="rutasentrega"]) .re-orden li { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 6px; align-items: center; padding: 6px 10px; border-bottom: 1px solid #F1F5F9; font-size: var(--q3-fs-sm); }
:where(body[data-vista="rutasentrega"]) .re-num { width: 24px; height: 24px; border-radius: 50%; background: #E8711A; color: #fff; font-weight: 700; font-size: var(--q3-fs-xs); display: grid; place-items: center; }
:where(body[data-vista="rutasentrega"]) .re-num--ENTREGADO { background: #16A34A; } :where(body[data-vista="rutasentrega"]) .re-num--PARCIAL { background: #D97706; } :where(body[data-vista="rutasentrega"]) .re-num--NO_ENTREGADO { background: #DC2626; }
:where(body[data-vista="rutasentrega"]) .re-num--NO_VISITADA { background: #64748B; } :where(body[data-vista="rutasentrega"]) .re-num--PENDIENTE { background: #2563EB; }
:where(body[data-vista="rutasentrega"]) .re-pin { background: transparent; border: 0; }
:where(body[data-vista="rutasentrega"]) .re-pin span { width: 26px; height: 26px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); display: grid; place-items: center; border: 2px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,.35); }
:where(body[data-vista="rutasentrega"]) .re-pin b { transform: rotate(45deg); color: #fff; font: 700 11px system-ui, sans-serif; }
:where(body[data-vista="rutasentrega"]) .re-asignar { padding: 10px; display: grid; gap: 8px; border-top: 1px solid var(--q3-borde, #E2E8F0); }
:where(body[data-vista="rutasentrega"]) .re-resumen { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; padding: 8px 10px; font-size: var(--q3-fs-xs); color: var(--q3-texto-4, #64748B); border-bottom: 1px solid var(--q3-borde, #E2E8F0); }
:where(body[data-vista="rutasentrega"]) .re-resumen b { display: block; font-size: var(--q3-fs-xl); color: var(--q3-texto-1, #1E293B); }
:where(body[data-vista="rutasentrega"]) .re-bar { height: 6px; border-radius: 3px; background: #E2E8F0; overflow: hidden; min-width: 90px; }
:where(body[data-vista="rutasentrega"]) .re-bar i { display: block; height: 100%; background: #16A34A; }
:where(body[data-vista="rutasentrega"]) .re-tl { list-style: none; margin: 0; padding: 8px 10px; max-height: 420px; overflow-y: auto; font-size: var(--q3-fs-sm); }
:where(body[data-vista="rutasentrega"]) .re-tl li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 8px; padding: 4px 0; border-bottom: 1px dashed #F1F5F9; }
:where(body[data-vista="rutasentrega"]) .re-tl .h { color: var(--q3-texto-4, #64748B); font-family:var(--q-font-family);font-variant-numeric:tabular-nums; }
:where(body[data-vista="rutasentrega"]) .re-alerta { color: #DC2626; font-weight: 700; }
:where(body[data-vista="rutasentrega"]) .re-detalle { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 12px; margin-top: 12px; }
:where(body[data-vista="rutasentrega"]) .re-detalle > * { min-width: 0; }
@media (max-width: 1100px) { :where(body[data-vista="rutasentrega"]) .re-detalle { grid-template-columns: 1fr; } }
/* Ocultar / pantalla completa de cada sección (mismo patrón que el Mapa de cotizaciones) */
:where(body[data-vista="rutasentrega"]) .re-cab { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
:where(body[data-vista="rutasentrega"]) .re-cab__acc { margin-left: auto; display: flex; gap: 6px; }
:where(body[data-vista="rutasentrega"]) .re-cab__btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.35); background: transparent; color: inherit; border-radius: 6px; padding: 4px 10px; font-size: var(--q3-fs-sm); font-weight: 600; cursor: pointer; }
:where(body[data-vista="rutasentrega"]) .re-cab__btn:hover, :where(body[data-vista="rutasentrega"]) .re-cab__btn[aria-pressed="true"], :where(body[data-vista="rutasentrega"]) .re-cab__btn[aria-expanded="false"] { background: rgba(255,255,255,.16); }
:where(body[data-vista="rutasentrega"]) .re-cab__btn:focus-visible { outline: 2px solid #F59E0B; outline-offset: 2px; }
:where(body[data-vista="rutasentrega"]) .re-oculto > .q-panel__body { display: none; }
:where(body[data-vista="rutasentrega"]) .re-completa { margin: 0; border-radius: 0; overflow: auto; background: var(--q3-fondo, #fff); }
:where(body[data-vista="rutasentrega"]) .re-completa:not(:fullscreen) { position: fixed; inset: 0; z-index: 2000; }
:where(body[data-vista="rutasentrega"]) .re-completa #reMapa { height: calc(100vh - 110px); }
:where(body[data-vista="rutasentrega"]) .re-completa .re-lista { max-height: calc(100vh - 290px); }
:where(body[data-vista="rutasentrega"]) .re-completa .re-orden { max-height: calc(100vh - 560px); min-height: 160px; }
:where(body[data-vista="rutasentrega"]) .re-completa #reMapaDet { height: calc(100vh - 230px) !important; }
:where(body[data-vista="rutasentrega"]) .re-completa .re-tl { max-height: calc(100vh - 280px); }
:where(body[data-vista="rutasentrega"].re-sin-scroll) { overflow: hidden; }
@media (max-width: 900px) { :where(body[data-vista="rutasentrega"]) .re-cab__btn span { display: none; } }

/* ── stocksv (core/app/view/stocksv-view.php) ───────────────────────────────────────────────────── */
/* ======================================================
   UX-001 · Optimización UI de Stock Valorizado (SOLO interfaz).
   No toca SQL/modelos/controladores/lógica/cálculos/export/DataTables.
   Objetivo: formulario compacto + tabla protagonista + cabecera fija +
   uso del alto de ventana + botones uniformes. Estándar reutilizable.
====================================================== */
:where(body[data-vista="stocksv"]) .sv-panel .card-body { padding:10px 12px; }
:where(body[data-vista="stocksv"]) .card-header.panel-blue { background:#4f94c2 !important; border-color:#4f94c2 !important; color:#fff !important; padding:8px 12px; }
:where(body[data-vista="stocksv"]) .card-header.panel-blue .card-title { font-size:var(--q3-fs-lg); }

/* Barra de filtros compacta EN UNA SOLA LÍNEA (flex): los campos crecen para
   llenar el ancho (sin huecos a la derecha); envuelven solo en pantallas chicas. */
:where(body[data-vista="stocksv"]) .sv-filtros { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px; width:100%; box-sizing:border-box; background:#f7f9fb; border:1px solid #e3e8ee; border-radius:6px; padding:8px 10px; margin-bottom:8px; }
:where(body[data-vista="stocksv"]) .sv-fld { flex:1 1 110px; min-width:88px; }
:where(body[data-vista="stocksv"]) .sv-fld-nom { flex:1.8 1 170px; }       /* Nombre más ancho */
:where(body[data-vista="stocksv"]) .sv-fld-page { flex:0 1 90px; }         /* N° Filas angosto */
:where(body[data-vista="stocksv"]) .sv-fld-actions { flex:0 0 auto; }      /* botones: ancho natural, al final */
:where(body[data-vista="stocksv"]) .sv-filtros label { font-size:var(--q3-fs-xs); font-weight:600; color:#555; margin-bottom:2px; display:block; line-height:1.1; white-space:nowrap; }
:where(body[data-vista="stocksv"]) .sv-filtros .form-control { height:30px; padding:3px 8px; font-size:var(--q3-fs-md); width:100%; }
:where(body[data-vista="stocksv"]) .sv-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
:where(body[data-vista="stocksv"]) .sv-actions .btn { height:30px; padding:4px 12px; font-size:var(--q3-fs-md); line-height:1.2; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
:where(body[data-vista="stocksv"]) .sv-actions .btn, :where(body[data-vista="stocksv"]) .sv-actions .q-btn { white-space:nowrap; }   /* SV-UI-001: Buscar y Limpiar con texto, como en el resto del sistema */
:where(body[data-vista="stocksv"]) .sv-actions > span { display:inline-flex !important; align-items:center; gap:8px; }
:where(body[data-vista="stocksv"]) .sv-actions > span > .q-btn { margin:0 !important; }   /* sin el margen inferior general: los subia 4 px y los separaba de mas */   /* contenedor de Excel/PDF (exportar-reporte): alineado con Buscar/Limpiar */

/* La tabla es el foco: usa el alto de ventana y SIEMPRE ocupa el 100% del ancho
   (responsive, sin recortes). table-layout:fixed reparte el ancho entre columnas
   e ignora el ancho natural del contenido (que antes desbordaba con nowrap). */
:where(body[data-vista="stocksv"]) .sv-table-area { border:1px solid #e3e8ee; border-radius:4px; }
:where(body[data-vista="stocksv"]) #tblStocksVal { width:100% !important; table-layout:fixed; margin-bottom:0; }
:where(body[data-vista="stocksv"]) #tblStocksVal th, :where(body[data-vista="stocksv"]) #tblStocksVal td { padding:4px 6px; font-size:var(--q3-fs-xs); vertical-align:middle; overflow:hidden; text-overflow:ellipsis; }
/* Texto: puede envolver (no recorta nombres). Números: una sola línea, a la derecha. */
:where(body[data-vista="stocksv"]) #tblStocksVal td:nth-child(2), :where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(2), :where(body[data-vista="stocksv"]) #tblStocksVal td:nth-child(3), :where(body[data-vista="stocksv"]) #tblStocksVal td:nth-child(4) { white-space:normal; word-break:break-word; }
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(n+5), :where(body[data-vista="stocksv"]) #tblStocksVal td:nth-child(n+5) { white-space:nowrap; text-align:right; }
/* Reparto de anchos (table-layout:fixed) — suman 100%, todo cabe en pantalla */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(1) { width:8%; }    /* CODIGO     */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(2) { width:13%; }   /* NOMBRE     */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(3) { width:8%; }    /* MARCA      */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(4) { width:8%; }    /* CATEGORIA  */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(5) { width:6%; }    /* COSTO      */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(6) { width:7%; }    /* UTI %      */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(7) { width:6%; }    /* P. VENTA   */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(8) { width:6%; }    /* P. MAY     */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(9) { width:6%; }    /* STOCK      */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(10) { width:8%; }   /* COSTO VAL  */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(11) { width:8%; }   /* VENTA VAL  */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(12) { width:8%; }   /* MAY VAL    */
:where(body[data-vista="stocksv"]) #tblStocksVal th:nth-child(13) { width:8%; }   /* T. UTILIDAD*/
/* Tabla y paginación en flujo natural (sin scroll interno) -> la paginación NO se
   descuadra ni se superpone con el TOTAL. (Cabecera fija se omite: AdminLTE tiene
   un ancestro con overflow que rompe position:sticky a nivel de página; quedaría
   medio-funcional, así que se deja estática para un layout limpio y predecible.) */
:where(body[data-vista="stocksv"]) #tblStocksVal thead th { background:#eaf1f7; box-shadow:inset 0 -1px 0 #cfd9e2; }
:where(body[data-vista="stocksv"]) .tot-row td { font-weight:700; background:#f5f7fa; }
/* Fila TOTAL: números compactos en UNA línea. El tfoot tiene una celda colspan=9
   ("TOTAL"), así que los importes caen en nth-child 2..5 — donde la regla de
   columnas de texto los forzaba a envolver. Se sobrescribe aquí (mayor specificity). */
:where(body[data-vista="stocksv"]) #tblStocksVal tfoot td:nth-child(n+1) { font-size:var(--q3-fs-2xs) !important; padding:4px 5px; }
:where(body[data-vista="stocksv"]) #tblStocksVal tfoot td:nth-child(n+2) { white-space:nowrap; word-break:normal; text-align:right; }
/* Pie: fila superior vacía (length/filter ocultos) eliminada; info + paginación
   centradas verticalmente entre sí (evita el desalineado info vs botones). */
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper { min-height:0; }
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper > .row:first-child { display:none; }
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper > .row:last-child { display:flex; align-items:center; flex-wrap:wrap; margin:0; }
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper .dataTables_info { padding-top:0; font-size:var(--q3-fs-sm); }
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper .dataTables_paginate { padding-top:0; margin:0; }
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper .pagination { margin:0; }
/* Buscador propio de DataTables OCULTO: redundante con los filtros Código/Nombre
   del formulario (server-side) y ocupaba una fila completa. Solo UI (no cambia la
   config de DataTables ni la búsqueda server-side). */
:where(body[data-vista="stocksv"]) #tblStocksVal_wrapper .dataTables_filter { display:none; }

/* ── ticketconfig (core/app/view/ticketconfig-view.php) ──────────────────────────────────────────────── */
:where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-sec-title { font-size:15px; font-weight:700; color:#5b4468;
        border-bottom:2px solid #efe9f2; padding-bottom:6px; margin:0 0 12px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .nav-tabs > li > a { font-weight:600; color:#5b4468 !important; background-color:transparent !important; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .nav-tabs > li > a:hover { background-color:#f2eef5 !important; color:#5b4468 !important; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .nav-tabs > li > a.nav-link.active, :where(body[data-vista="ticketconfig"]) #frmTicketCfg .nav-tabs > li > a.nav-link.active:hover, :where(body[data-vista="ticketconfig"]) #frmTicketCfg .nav-tabs > li > a.nav-link.active:focus {
        color:#fff !important; background-color:#9a80a6 !important; border-color:#9a80a6 #9a80a6 transparent !important; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .nav-tabs > li > a .bi { margin-right:6px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-main { border:1px solid #e6e0ea; border-top:none; border-radius:0 0 6px 6px; padding:16px; background:#fcfbfd; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-tabcontent { padding:16px 2px 4px; min-height:210px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-field { margin-bottom:12px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-field > label { display:block; font-weight:600; margin-bottom:4px; color:#333; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-help { font-size:12px; color:#888; margin:3px 0 0; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-input { max-width:260px; }
    /* Deslizador + caja numérica: los dos escriben el mismo valor (ver tc-range en el script). */
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-slider { display:flex; align-items:center; gap:10px; max-width:300px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-slider .tc-range { flex:1 1 auto; min-width:90px; padding:0; margin:0; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-slider .tc-num { flex:0 0 78px; width:78px; text-align:right; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-grid2 { display:flex; flex-wrap:wrap; gap:10px 18px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-grid2 .tc-field { flex:1 1 44%; min-width:150px; margin-bottom:6px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-radios label { font-weight:600; margin-right:16px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-checks .form-check { margin:5px 0; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-checks label { font-weight:500; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg input[type=text].tc-full { width:100%; max-width:none; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-actions { margin-top:16px; display:flex; flex-wrap:wrap;
        justify-content:center; align-items:stretch; gap:6px; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .btn { width:auto !important; height:auto !important; min-height:32px;
        padding:6px 10px !important; font-size:12px !important; font-weight:600;
        white-space:nowrap; border-radius:6px; display:inline-flex; align-items:center;
        justify-content:center; line-height:1.15; margin:0 !important; }
    :where(body[data-vista="ticketconfig"]) #frmTicketCfg .btn .bi { margin-right:5px; font-size:12px; }
    @media (max-width: 480px) {
        :where(body[data-vista="ticketconfig"]) #frmTicketCfg .tc-actions .btn { flex:1 1 100%; }  /* apilados a todo el ancho en móvil */
    }
    :where(body[data-vista="ticketconfig"]) .tc-prevlabel { font-weight:700; color:#5b4468; }

/* ── usuarioaccesos (core/app/view/usuarioaccesos-view.php) ────────────────────────────────────────────── */
:where(body[data-vista="usuarioaccesos"]) .pa-cab { display:flex; align-items:center; gap:12px; } :where(body[data-vista="usuarioaccesos"]) .ua-chip { font-size:var(--q3-fs-sm); background:rgba(255,255,255,.18); border-radius:999px; padding:2px 10px; }
		:where(body[data-vista="usuarioaccesos"]) .ua-nota { display:flex; gap:10px; font-size:var(--q3-fs-md); background:#eff6ff; border:1px solid #bfdbfe; color:#1e3a8a; border-radius:10px; padding:10px 12px; margin-bottom:12px; }
		:where(body[data-vista="usuarioaccesos"]) .ua-nota > em { font-size:var(--q3-fs-2xl); } :where(body[data-vista="usuarioaccesos"]) .ua-ley { display:block; margin-top:6px; }
		:where(body[data-vista="usuarioaccesos"]) .ua-b { display:inline-block; font-size:var(--q3-fs-xs); font-weight:700; border-radius:999px; padding:1px 8px; background:var(--q3-fondo-3, #f1f5f9); color:var(--q3-texto-3, #475569); margin-right:4px; }
		:where(body[data-vista="usuarioaccesos"]) .ua-b--mas { background:#dcfce7; color:#15803d; } :where(body[data-vista="usuarioaccesos"]) .ua-b--menos { background:#fee2e2; color:#b91c1c; }
		:where(body[data-vista="usuarioaccesos"]) .pa-barra { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:12px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-busca { position:relative; flex:0 1 280px; } :where(body[data-vista="usuarioaccesos"]) .pa-busca em { position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--q3-texto-5, #94a3b8); } :where(body[data-vista="usuarioaccesos"]) .pa-busca .q-input { padding-left:30px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-cuenta { font-size:var(--q3-fs-sm); color:var(--q3-texto-4, #64748b); } :where(body[data-vista="usuarioaccesos"]) .pa-acc { display:flex; gap:8px; margin-left:auto; }
		:where(body[data-vista="usuarioaccesos"]) .pa-cuerpo { display:grid; grid-template-columns:minmax(0, 1fr) 270px; gap:16px; align-items:start; }
		:where(body[data-vista="usuarioaccesos"]) .pa-areas { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:12px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-area { border:1px solid var(--q-border, var(--q3-borde, #e2e8f0)); border-radius:12px; overflow:hidden; background:var(--q3-fondo, #fff); }
		:where(body[data-vista="usuarioaccesos"]) .pa-area__cab { display:flex; align-items:center; gap:8px; margin:0; padding:9px 12px; background:var(--q3-fondo-2, #f8fafc); border-bottom:1px solid var(--q3-borde, #e2e8f0); cursor:pointer; font-size:var(--q3-fs-md); }
		:where(body[data-vista="usuarioaccesos"]) .pa-ico { color:#1e3a8a; } :where(body[data-vista="usuarioaccesos"]) .pa-n { margin-left:auto; font-size:var(--q3-fs-xs); color:var(--q3-texto-4, #64748b); background:#e2e8f0; border-radius:999px; padding:0 8px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-lista { padding:6px 8px; display:flex; flex-direction:column; }
		:where(body[data-vista="usuarioaccesos"]) .pa-it { display:flex; gap:8px; align-items:center; margin:0; padding:4px 6px; border-radius:6px; font-size:var(--q3-fs-md); cursor:pointer; }
		:where(body[data-vista="usuarioaccesos"]) .pa-it:hover { background:var(--q3-fondo-3, #f1f5f9); } :where(body[data-vista="usuarioaccesos"]) .pa-it.is-oculto { display:none; }
		:where(body[data-vista="usuarioaccesos"]) .pa-it.is-mas { background:#f0fdf4; } :where(body[data-vista="usuarioaccesos"]) .pa-it.is-menos { background:#fef2f2; } :where(body[data-vista="usuarioaccesos"]) .pa-it.is-menos > span { text-decoration:line-through; color:#b91c1c; }
		:where(body[data-vista="usuarioaccesos"]) .ua-m { margin-left:auto; font-style:normal; font-size:var(--q3-fs-2xs); font-weight:800; border-radius:999px; padding:0 7px; }
		:where(body[data-vista="usuarioaccesos"]) .is-mas .ua-m { background:#dcfce7; color:#15803d; } :where(body[data-vista="usuarioaccesos"]) .is-menos .ua-m { background:#fee2e2; color:#b91c1c; }
		:where(body[data-vista="usuarioaccesos"]) .pa-esp { margin-top:14px; border:1px solid #fde68a; border-radius:12px; background:#fffbeb; padding:10px 12px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-esp__tit { font-weight:800; color:#92400e; font-size:var(--q3-fs-md); margin-bottom:6px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-esp__it { align-items:flex-start; } :where(body[data-vista="usuarioaccesos"]) .pa-esp__it b { font-size:var(--q3-fs-md); } :where(body[data-vista="usuarioaccesos"]) .pa-esp__it span { display:block; font-size:var(--q3-fs-sm); color:#78350f; } :where(body[data-vista="usuarioaccesos"]) .pa-esp__it input { margin-top:3px; }
		:where(body[data-vista="usuarioaccesos"]) .ua-sp { font-size:var(--q3-fs-sm); color:#92400e; margin:6px 0 0; }
		:where(body[data-vista="usuarioaccesos"]) .pa-prev { position:sticky; top:70px; border-radius:12px; background:#0f172a; color:#e2e8f0; padding:10px 12px; max-height:75vh; overflow:auto; }
		:where(body[data-vista="usuarioaccesos"]) .pa-prev__tit { font-size:var(--q3-fs-sm); font-weight:800; color:var(--q3-texto-5, #94a3b8); text-transform:uppercase; margin-bottom:8px; }
		:where(body[data-vista="usuarioaccesos"]) .pa-prev .g { font-weight:800; font-size:var(--q3-fs-sm); margin:8px 0 2px; color:#fff; } :where(body[data-vista="usuarioaccesos"]) .pa-prev .h { font-size:var(--q3-fs-sm); color:#cbd5e1; padding-left:14px; line-height:1.6; }
		:where(body[data-vista="usuarioaccesos"]) .pa-prev .h.mas { color:#86efac; } :where(body[data-vista="usuarioaccesos"]) .pa-prev .v { font-size:var(--q3-fs-sm); color:var(--q3-texto-5, #94a3b8); }
		@media (max-width: 991px){ :where(body[data-vista="usuarioaccesos"]) .pa-cuerpo { grid-template-columns:1fr; } :where(body[data-vista="usuarioaccesos"]) .pa-prev { position:static; } }

/* ── estilos en línea de las vistas (tools/extraer-estilos-linea.php) · VIS-008 ── */
:where(.q3-e-bf4b908) { background-color:#3c8dbc !important; }
:where(.q3-e-200a92a) { text-align:left !important; }
:where(.q3-e-f6e3d7f) { text-align:right !important; }
:where(.q3-e-50c2da5) { cursor:pointer !important;font-weight:normal !important;margin:6px 0 0 !important; }
:where(.q3-e-13076d9) { text-align:center !important; }
:where(.q3-e-1c38ea5) { margin-top:-6px !important; }
:where(.q3-e-33e9797) { background-color:#9a80a6 !important; }
:where(.q3-e-fa3e1c7) { margin-bottom:12px !important; }
:where(.q3-e-553a645) { margin-top:14px !important; }
:where(.q3-e-bdb5c77) { color:#6b7280 !important;text-align:center !important; }
:where(.q3-e-4a909ea) { margin-top:18px !important; }
:where(.q3-e-9769ce3) { color:#2C7052 !important; }
:where(.q3-e-e248364) { font-weight:bold !important;text-align:right !important; }
:where(.q3-e-1e2cc36) { align-items:center !important; }
:where(.q3-e-4e70156) { align-items:center !important;font-weight:500 !important;gap:6px !important;margin:0 0 0 auto !important; }
:where(.q3-e-d51702b) { margin-bottom:8px !important; }
:where(.q3-e-83e4487) { font-weight:700 !important; }
:where(.q3-e-45a5ab6) { color:#3a4060 !important;font-size:14px !important; }
:where(.q3-e-df74e8d) { overflow-x:auto !important; }
:where(.q3-e-948b84c) { margin:0 !important;min-width:640px !important; }
:where(.q3-e-93dfbb9) { background-color:#9a80a6 !important;color:#ffffff !important; }
:where(.q3-e-45aecbb) { color:#DC2626 !important;font-weight:800 !important; }
:where(.q3-e-57ce1f1) { padding:0 !important; }
:where(.q3-e-7c4c9bc) { align-items:center !important;flex-wrap:wrap !important;gap:8px !important; }
:where(.q3-e-df7d100) { width:160px !important; }
:where(.q3-e-8bc5d05) { margin-top:6px !important;width:100% !important; }
:where(.q3-e-f024231) { color:var(--q3-texto-3, #475569) !important;font-size:var(--q3-fs-sm) !important;font-weight:700 !important; }
:where(.q3-e-296eae1) { margin:4px 0 8px !important;width:100% !important; }
:where(.q3-e-813dd55) { margin-top:4px !important;width:140px !important; }
:where(.q3-e-506a47a) { color:var(--q3-texto-5, #94A3B8) !important;font-size:var(--q3-fs-xs) !important;margin-top:4px !important; }
:where(.q3-e-1f7eb26) { color:var(--q3-texto-3, #475569) !important;font-size:var(--q3-fs-sm) !important;font-weight:700 !important;margin-bottom:6px !important; }
:where(.q3-e-2f01efd) { width:140px !important; }
:where(.q3-e-27641f8) { color:var(--q3-texto-3, #475569) !important;font-size:var(--q3-fs-sm) !important;font-weight:700 !important;margin:10px 0 6px !important; }
:where(.q3-e-3f4a2f9) { color:var(--q3-texto-3, #475569) !important;font-size:var(--q3-fs-sm) !important;font-weight:700 !important;margin:12px 0 6px !important; }
:where(.q3-e-884ad6f) { color:var(--q3-texto-5, #94A3B8) !important;font-size:var(--q3-fs-xs) !important;margin-top:3px !important; }
:where(.q3-e-4d91ec3) { color:#B45309 !important; }
:where(.q3-e-5371db1) { margin-top:10px !important; }
:where(.q3-e-95fcd02) { font-size:var(--q3-fs-md) !important; }
:where(.q3-e-6d56738) { width:100% !important; }
:where(.q3-e-3f7ccb2) { color:#7a8699 !important;text-align:center !important; }
:where(.q3-e-877d6c0) { color:#777 !important; }
:where(.q3-e-f005b88) { margin-top:2px !important; }
:where(.q3-e-9aa76ee) { font-weight:normal !important; }
:where(.q3-e-c4273a2) { align-items:center !important;gap:6px !important; }
:where(.q3-e-3f9f96c) { min-width:0 !important; }
:where(.q3-e-1481a3c) { flex:0 0 auto !important;min-width:0 !important;padding:0 !important;width:40px !important; }
:where(.q3-e-9e3c4cc) { margin-top:6px !important; }
:where(.q3-e-a21bd50) { color:var(--q3-texto-5, #94A3B8) !important;text-align:center !important; }
:where(.q3-e-304cd5c) { gap:8px !important; }
:where(.q3-e-99e1b14) { color:#b91c1c !important;margin:6px 0 0 !important; }
:where(.q3-e-9b54a37) { justify-content:center !important; }
:where(.q3-e-e4c3fa3) { height:220px !important; }
:where(.q3-e-4ee9b1b) { min-width:460px !important; }
:where(.q3-e-aff964e) { background:#2ecc71 !important; }
:where(.q3-e-23899cf) { background:#e74c3c !important; }
:where(.q3-e-0a80578) { background:#3b82f6 !important; }
:where(.q3-e-f162d09) { width:1% !important; }
:where(.q3-e-bea8c22) { font-weight:bold !important;text-align:left !important; }
:where(.q3-e-23f16a1) { margin:26px 0 10px !important; }
:where(.q3-e-2297838) { color:#6c7d89 !important;font-size:var(--q3-fs-md) !important;margin:0 0 12px !important;max-width:78ch !important; }
:where(.q3-e-105bece) { cursor:pointer !important;font-weight:600 !important; }
:where(.q3-e-8f26552) { color:var(--q3-texto-4, #64748b) !important; }
:where(.q3-e-b6cc70f) { color:#6c7d89 !important;margin-right:18px !important; }
:where(.q3-e-13598fc) { flex:2 !important; }
:where(.q3-e-ba17cb1) { color:#6c7d89 !important;font-size:var(--q3-fs-md) !important;margin:0 0 10px !important;max-width:90ch !important; }
:where(.q3-e-5f7abeb) { text-transform:uppercase !important; }
:where(.q3-e-bbe7178) { margin-right:18px !important; }
:where(.q3-e-4523548) { margin:0 0 1em !important; }
:where(.q3-e-d2190dd) { font-weight:normal !important;margin-left:.6em !important; }
:where(.q3-e-21bdfa6) { margin-bottom:1em !important; }
:where(.q3-e-d4c0491) { margin-top:.8em !important; }
:where(.q3-e-c962ba8) { color:#b91c1c !important;font-weight:600 !important; }
:where(.q3-e-b0043ef) { margin-top:16px !important; }
:where(.q3-e-93383cf) { margin:-4px 0 12px !important; }
:where(.q3-e-557a1ea) { align-items:center !important;background:#ecfdf5 !important;border-radius:8px !important;border:1px solid #a7f3d0 !important;flex-wrap:wrap !important;gap:20px !important;margin-bottom:14px !important;padding:12px 16px !important; }
:where(.q3-e-e52d5da) { color:#065f46 !important;font-size:var(--q3-fs-lg) !important;font-weight:700 !important; }
:where(.q3-e-0878023) { color:#064e3b !important;font-size:var(--q3-fs-lg) !important; }
:where(.q3-e-236eb13) { color:#059669 !important;font-size:var(--q3-fs-sm) !important;font-weight:600 !important; }
:where(.q3-e-a04d6bf) { background:#fffbeb !important;border-radius:8px !important;border:1px solid #fde68a !important;color:#92400e !important;font-size:var(--q3-fs-md) !important;margin-bottom:14px !important;padding:12px 16px !important; }
:where(.q3-e-656ee37) { font-size:var(--q3-fs-lg) !important;font-weight:bold !important;text-align:left !important; }
:where(.q3-e-081d38e) { font-size:var(--q3-fs-lg) !important;font-weight:bold !important;text-align:right !important; }
:where(.q3-e-bf88322) { color:#6c7d89 !important;font-size:var(--q3-fs-md) !important;margin:0 0 16px !important;max-width:80ch !important; }
:where(.q3-e-933465c) { margin-left:0 !important; }
:where(.q3-e-4835ef0) { font-size:var(--q3-fs-md) !important;font-weight:600 !important;margin-top:6px !important; }
:where(.q3-e-967f182) { margin:22px 0 10px !important; }
:where(.q3-e-53de4c3) { align-items:flex-start !important;background:#fffbeb !important;border-radius:10px !important;border:1px solid #fde68a !important;color:#78350f !important;font-size:var(--q3-fs-md) !important;gap:10px !important;margin-bottom:12px !important;padding:10px 14px !important; }
:where(.q3-e-2fbc80b) { font-size:var(--q3-fs-2xl) !important; }
:where(.q3-e-fa4778e) { justify-content:flex-start !important; }
:where(.q3-e-a7409f7) { margin-bottom:10px !important; }
:where(.q3-e-6dc469c) { background:#fffbeb !important;border-left-color:#d97706 !important; }
:where(.q3-e-d431697) { margin-top:8px !important; }
:where(.q3-e-807698c) { background:linear-gradient(135deg, var(--sales), #22c55e) !important; }
:where(.q3-e-7f396b0) { background:linear-gradient(135deg, var(--profit), #60a5fa) !important; }
:where(.q3-e-43bf241) { background:linear-gradient(135deg, var(--margin), #818cf8) !important; }
:where(.q3-e-6b8178e) { background:linear-gradient(135deg, var(--buy), #fb7185) !important; }
:where(.q3-e-eca78d5) { background:linear-gradient(135deg, var(--cxc), #22d3ee) !important; }
:where(.q3-e-d568594) { background:linear-gradient(135deg, var(--cxcd), #fbbf24) !important; }
:where(.q3-e-c88872a) { background:linear-gradient(135deg, var(--in), #86efac) !important; }
:where(.q3-e-cbbe668) { background:linear-gradient(135deg, var(--out), #fdba74) !important; }
:where(.q3-e-3d094d4) { height:320px !important; }
:where(.q3-e-44c3696) { color:var(--profit) !important; }
:where(.q3-e-e914be1) { color:var(--sales) !important;font-weight:900 !important; }
:where(.q3-e-ec791eb) { border-top:1px solid rgba(15,23,42,.08) !important;margin:12px 0 !important; }
:where(.q3-e-cd73e1d) { height:170px !important; }
:where(.q3-e-002535c) { margin-top:12px !important; }
:where(.q3-e-c03acd6) { height:60px !important; }
:where(.q3-e-ec50dde) { color:var(--in) !important; }
:where(.q3-e-1b7814a) { color:var(--out) !important; }
:where(.q3-e-c9e3486) { color:#ef4444 !important; }
:where(.q3-e-cbe5dd0) { border-top:1px solid rgba(15,23,42,.08) !important;margin:10px 0 !important; }
:where(.q3-e-83328b7) { color:var(--cxc) !important; }
:where(.q3-e-716b3db) { padding:6px 0 !important; }
:where(.q3-e-4c2b208) { max-width:260px !important;overflow:hidden !important;text-overflow:ellipsis !important; }
:where(.q3-e-cc47d78) { font-weight:900 !important; }
:where(.q3-e-44f7da7) { background:var(--pi-barra) !important; }
:where(.q3-e-6fd4de7) { background:var(--pi-azul) !important; }
:where(.q3-e-d4f2f2a) { background:var(--pi-naranja) !important; }
:where(.q3-e-6e6ff62) { color:#F59E0B !important; }
:where(.q3-e-8f50ea7) { color:#16A34A !important; }
:where(.q3-e-8ee78de) { --kpi-bg:rgba(37,99,235,.1) !important;--kpi-color:#2563EB !important; }
:where(.q3-e-38fd8a0) { --kpi-bg:rgba(8,145,178,.1) !important;--kpi-color:#0891B2 !important; }
:where(.q3-e-d28082b) { --kpi-bg:rgba(22,163,74,.1) !important;--kpi-color:#16A34A !important; }
:where(.q3-e-33bf619) { color:#D97706 !important; }
:where(.q3-e-47483e8) { color:#1D4ED8 !important; }
:where(.q3-e-d4ac970) { color:#059669 !important; }
:where(.q3-e-fadefc3) { color:#0369A1 !important; }
:where(.q3-e-968829b) { color:#7C3AED !important; }
:where(.q3-e-830645c) { color:#1A6B3A !important; }
:where(.q3-e-b1ddf97) { color:#0891B2 !important; }
:where(.q3-e-a06eb3e) { color:var(--q-text-3,var(--q3-texto-5, #94A3B8)) !important; }
:where(.q3-e-57f3b93) { --app-accent:#1D4ED8 !important; }
:where(.q3-e-9b92516) { background:#1D4ED8 !important; }
:where(.q3-e-0698b60) { --app-accent:#1A6B3A !important; }
:where(.q3-e-681b2f8) { background:#1A6B3A !important; }
:where(.q3-e-4449d29) { --app-accent:#7C3AED !important; }
:where(.q3-e-fc9c46a) { background:#7C3AED !important; }
:where(.q3-e-e85484f) { --app-accent:#0F172A !important; }
:where(.q3-e-579c7f9) { background:#0F172A !important; }
:where(.q3-e-8164974) { color:var(--q-text-3,var(--q3-texto-5, #94A3B8)) !important;justify-content:center !important;padding:20px 16px !important; }
:where(.q3-e-487b71a) { margin-right:6px !important; }
:where(.q3-e-aa48f0b) { background:var(--q-primary,#1D4ED8) !important;border-color:transparent !important; }
:where(.q3-e-118f7e7) { align-items:center !important;gap:10px !important;padding:14px 16px !important; }
:where(.q3-e-19a89f8) { color:#fff !important;font-size:var(--q3-fs-sm) !important;font-weight:700 !important; }
:where(.q3-e-9ec18b2) { color:rgba(255,255,255,.65) !important;font-size:var(--q3-fs-xs) !important;margin-top:2px !important; }
:where(.q3-e-c4f60ca) { background:rgba(255,255,255,.2) !important;border-radius:8px !important;border:1.5px solid rgba(255,255,255,.35) !important;color:#fff !important;cursor:pointer !important;font-size:var(--q3-fs-xs) !important;font-weight:700 !important;margin-left:auto !important;padding:7px 14px !important; }
:where(.q3-e-66e69d4) { background:#e8f4ff !important;border-radius:6px !important;border:1px solid #b6dcff !important;color:#134a7c !important;font-size:var(--q3-fs-sm) !important;margin-bottom:10px !important;padding:8px 10px !important; }
:where(.q3-e-c6518c4) { align-items:flex-end !important;flex-wrap:wrap !important;gap:10px !important;margin:0 !important; }
:where(.q3-e-4a93029) { min-width:140px !important; }
:where(.q3-e-d0b00c4) { flex:0 0 190px !important; }
:where(.q3-e-ab0877d) { flex:0 0 120px !important; }
:where(.q3-e-9723784) { flex:0 0 140px !important; }
:where(.q3-e-01551c6) { flex:0 0 auto !important; }
:where(.q3-e-1a1ac7d) { align-items:center !important;gap:10px !important;margin:12px 0 2px !important; }
:where(.q3-e-23f228b) { border-top:1px dashed var(--q3-borde-3, #cbd5e1) !important;border:none !important;margin:0 !important; }
:where(.q3-e-95af2f2) { color:var(--q3-texto-5, #94a3b8) !important;font-size:var(--q3-fs-sm) !important;font-weight:600 !important; }
:where(.q3-e-4694d62) { min-width:220px !important; }
:where(.q3-e-d8b8798) { font-size:var(--q3-fs-md) !important;margin-top:10px !important; }
:where(.q3-e-469f529) { background:#fff8e1 !important;border-radius:6px !important;border:1px solid #ffe59a !important;color:#8a6d00 !important;font-size:var(--q3-fs-sm) !important;margin-bottom:10px !important;padding:8px 10px !important; }
:where(.q3-e-4459f75) { background:#fff1f0 !important;border-radius:6px !important;border:1px solid #f5b2ad !important;color:#8c2f28 !important;font-size:var(--q3-fs-sm) !important;margin-bottom:10px !important;padding:8px 10px !important; }
:where(.q3-e-42b8088) { font-size:var(--q3-fs-sm) !important; }
:where(.q3-e-dd3f457) { margin-top:10px !important;text-align:right !important; }
:where(.q3-e-3607016) { padding:15px !important; }
:where(.q3-e-2e000f1) { align-items:flex-end !important; }
:where(.q3-e-94207a6) { margin:6px 0 10px !important; }
:where(.q3-e-9ab9bec) { margin-bottom:15px !important; }
:where(.q3-e-bcb352c) { color:#666 !important;margin-bottom:12px !important; }
:where(.q3-e-6179637) { margin-bottom:14px !important; }
:where(.q3-e-b897871) { color:var(--q3-texto-3, #475569) !important;font-size:var(--q3-fs-md) !important;font-weight:600 !important;margin-right:10px !important; }
:where(.q3-e-e7ec540) { margin-bottom:0 !important; }
:where(.q3-e-1514343) { color:#cbd5e1 !important;text-align:center !important; }
:where(.q3-e-76828b8) { color:#555 !important;padding-left:34px !important;text-align:left !important; }
:where(.q3-e-0e0b419) { color:#9a80a6 !important; }
:where(.q3-e-a74d27d) { grid-column:span 2 !important; }
:where(.q3-e-a2f08ef) { gap:8px !important;margin-top:12px !important; }
:where(.q3-e-fc379bb) { color:var(--q3-texto-5, #94a3b8) !important;padding:22px !important;text-align:center !important; }
:where(.q3-e-6d24766) { grid-column:span 3 !important; }
:where(.q3-e-e4ae4f6) { align-items:center !important;gap:10px !important;margin:6px 0 !important; }
:where(.q3-e-d8a89b8) { align-items:center !important;gap:6px !important;margin:0 !important; }
:where(.q3-e-8345637) { margin-left:auto !important; }
:where(.q3-e-4937f16) { align-items:end !important;margin-top:12px !important; }
:where(.q3-e-cb7992d) { height:38px !important; }
:where(.q3-e-595f67f) { background:#fff7ed !important;border-radius:8px !important;border:1px solid #fdba74 !important;color:#7c2d12 !important;padding:10px 14px !important; }
:where(.q3-e-baa0f82) { border-left:4px solid #1d4ed8 !important;margin-bottom:16px !important; }
:where(.q3-e-879e4e3) { color:var(--q3-texto-3, #475569) !important;font-size:var(--q3-fs-md) !important;margin:0 0 8px !important; }
:where(.q3-e-2b04dbd) { color:#6c7d89 !important;font-size:var(--q3-fs-xs) !important;margin-top:4px !important; }
:where(.q3-e-5926763) { float:right !important;margin-top:-4px !important; }
:where(.q3-e-3adafda) { align-self:flex-end !important; }
:where(.q3-e-24c422c) { border-radius:4px !important;border:1px solid #e5e5e5 !important;padding:10px 15px !important; }
:where(.q3-e-53896af) { margin-top:0 !important; }
:where(.q3-e-daa81ba) { margin:12px 20px 0 !important; }
:where(.q3-e-6372415) { margin-left:20px !important;margin-right:20px !important;margin-top:20px !important; }
:where(.q3-e-0867ae4) { border:1px solid #9a80a6 !important; }
:where(.q3-e-675a1c0) { align-items:center !important;flex-wrap:nowrap !important;gap:8px !important; }
:where(.q3-e-b434a80) { flex:0 0 150px !important;max-width:150px !important;min-width:150px !important; }
:where(.q3-e-78601c0) { flex:0 0 85px !important;max-width:85px !important;min-width:85px !important; }
:where(.q3-e-05ef6ac) { margin:24px 0 0 !important;padding:8px 12px !important; }
:where(.q3-e-2937bfc) { margin-bottom:6px !important; }
:where(.q3-e-f77025c) { font-variant-numeric:tabular-nums !important; }
:where(.q3-e-ceae0e3) { overflow:auto !important;resize:vertical !important; }
:where(.q3-e-8c92abe) { max-width:120px !important; }
:where(.q3-e-b3277c6) { color:#2563EB !important;font-size:var(--q3-fs-xs) !important;text-decoration:none !important; }
:where(.q3-e-00fdcb5) { color:var(--q3-texto-4, #64748B) !important;font-size:var(--q3-fs-sm) !important;margin:8px 0 0 !important; }
:where(.q3-e-d014114) { border:1.5px solid #1E293B !important; }
:where(.q3-e-351befc) { margin-top:5px !important; }
:where(.q3-e-009b037) { color:var(--q3-texto-1, #1E293B) !important;font-size:var(--q3-fs-md) !important;font-weight:800 !important; }
:where(.q3-e-10940f3) { background:#F0FDF4 !important;border:2px solid #16A34A !important;font-size:var(--q3-fs-lg) !important;font-weight:800 !important;height:38px !important; }
:where(.q3-e-722c52e) { align-items:center !important;background:#fff7ed !important;border-left:5px solid #ea580c !important;border-radius:8px !important;border:1px solid #fdba74 !important;flex-wrap:wrap !important;gap:10px 18px !important;margin:16px 20px 0 !important;padding:12px 16px !important; }
:where(.q3-e-ecf8266) { font-size:var(--q3-fs-lg) !important; }
:where(.q3-e-61380a3) { color:#ea580c !important; }
:where(.q3-e-020dc94) { font-size:var(--q3-fs-xl) !important; }
:where(.q3-e-0692fbd) { color:#7c2d12 !important; }
:where(.q3-e-30e717d) { color:#9a3412 !important;font-size:var(--q3-fs-md) !important;margin-left:auto !important; }
:where(.q3-e-77e8812) { align-items:center !important;background:#fef2f2 !important;border-left:5px solid #b91c1c !important;border-radius:8px !important;border:1px solid #fca5a5 !important;flex-wrap:wrap !important;gap:10px 18px !important;margin:16px 20px 0 !important;padding:12px 16px !important; }
:where(.q3-e-5093eb8) { color:#b91c1c !important;font-size:var(--q3-fs-lg) !important; }
:where(.q3-e-92fb9a5) { color:#7f1d1d !important; }
:where(.q3-e-f48cf19) { font-size:var(--q3-fs-sm) !important;font-weight:bold !important;text-align:left !important; }
:where(.q3-e-fe309f7) { font-size:var(--q3-fs-sm) !important;font-weight:bold !important;text-align:right !important; }
:where(.q3-e-4ffd9e6) { font-size:var(--q3-fs-sm) !important;margin-top:6px !important; }
:where(.q3-e-cb26038) { border-bottom:1px solid #eee !important;gap:12px !important;justify-content:space-between !important;padding:2px 0 !important; }
:where(.q3-e-272d765) { font-size:var(--q3-fs-md) !important;padding:8px 12px !important; }
:where(.q3-e-fd5eba9) { background-color:#0f766e !important; }
:where(.q3-e-a41689f) { margin:6px 0 16px !important; }
:where(.q3-e-853078d) { color:var(--q3-texto-5, #94A3B8) !important;font-size:var(--q3-fs-xs) !important;font-style:italic !important;margin-top:2px !important;text-align:right !important; }
:where(.q3-e-879a0b2) { color:var(--q3-texto-5, #94A3B8) !important;font-size:var(--q3-fs-md) !important; }
:where(.q3-e-2f003e0) { font-weight:600 !important;text-align:right !important; }
:where(.q3-e-9a256f1) { font-weight:normal !important;text-align:right !important; }
:where(.q3-e-822c78d) { border-left:4px solid #d97706 !important;margin-bottom:16px !important; }
:where(.q3-e-413e204) { justify-content:flex-start !important;margin-left:0 !important; }
:where(.q3-e-1f2a9b0) { color:var(--q3-texto-5, #94a3b8) !important;text-align:center !important; }
:where(.q3-e-8b03d49) { table-layout:fixed !important;width:100% !important; }
:where(.q3-e-f95ebd2) { width:70px !important; }
:where(.q3-e-25ccdc3) { width:155px !important; }
:where(.q3-e-1ac3eca) { width:175px !important; }
:where(.q3-e-1a30558) { width:110px !important; }
:where(.q3-e-65e62ea) { width:75px !important; }
:where(.q3-e-8db8d85) { width:80px !important; }
:where(.q3-e-b1b5b4c) { background:#2ecc71 !important;margin:0 4px 4px 0 !important; }
:where(.q3-e-783760a) { background:#e74c3c !important;margin:0 4px 4px 0 !important; }
:where(.q3-e-8b7d803) { background:#3b82f6 !important;margin:0 4px 4px 0 !important; }
:where(.q3-e-e9da44b) { margin:0 4px 4px 0 !important; }
:where(.q3-e-f2dc07c) { background:#4f94c2 !important;color:#fff !important; }
:where(.q3-e-e0b9148) { background:#f5f5f5 !important;font-weight:700 !important; }
:where(.q3-e-defe7d1) { margin-top:-4px !important; }
:where(.q3-e-08f869d) { color:#e6a100 !important; }
:where(.q3-e-d46d66c) { background:#5b8a72 !important;color:#fff !important; }
:where(.q3-e-5c0bf27) { color:#888 !important;text-align:center !important; }
:where(.q3-e-5c3a510) { background:#eef2ff !important;font-weight:800 !important; }
:where(.q3-e-8a37f0d) { margin-top:25px !important; }
:where(.q3-e-6b283c9) { padding:10px !important; }
:where(.q3-e-1386d50) { margin:0 !important; }
:where(.q3-e-b1f0bd2) { background:#4f94c2 !important;color:#fff !important;text-align:center !important; }
:where(.q3-e-0a15253) { font-weight:bold !important; }
:where(.q3-e-81a8620) { color:#9a3412 !important;font-weight:800 !important; }
:where(.q3-e-f41bf6a) { flex-wrap:wrap !important;gap:8px !important; }
:where(.q3-e-c691736) { color:var(--q3-texto-4, #64748b) !important;font-size:var(--q3-fs-sm) !important;margin-top:8px !important;text-align:center !important; }
:where(.q3-e-27dc527) { cursor:not-allowed !important; }
:where(.q3-e-e0acddf) { background:#FBECEA !important;border-radius:20px !important;border:1px solid #E3A9A3 !important;color:#A3231A !important;font-size:var(--q3-fs-2xs) !important;font-weight:700 !important;letter-spacing:.03em !important;margin-left:6px !important;padding:1px 7px !important; }
:where(.q3-e-be3e6d8) { color:var(--q3-texto-2, #334155) !important;font-size:var(--q3-fs-lg) !important;margin-bottom:6px !important; }
:where(.q3-e-32bd2af) { color:var(--q3-texto-5, #94A3B8) !important; }
:where(.q3-e-c7c9784) { color:var(--q3-texto-4, #64748B) !important;font-size:var(--q3-fs-sm) !important;line-height:1.7 !important;max-width:640px !important; }
:where(.q3-e-6218687) { align-items:center !important;flex-wrap:wrap !important;gap:12px !important;margin-bottom:18px !important; }
:where(.q3-e-33fbe9d) { cursor:pointer !important;height:40px !important; }
:where(.q3-e-be25404) { margin-bottom:18px !important; }
:where(.q3-e-bec59c1) { --c:#DC2626 !important; }
:where(.q3-e-07f43d6) { --c:#06B6D4 !important; }
:where(.q3-e-7c17329) { --c:#F59E0B !important; }
:where(.q3-e-a8ef0bb) { --c:#2563EB !important; }
:where(.q3-e-24f86ab) { --c:#8B5CF6 !important; }
:where(.q3-e-022601a) { --c:#B45309 !important; }
:where(.q3-e-bdad528) { --c:#0D9488 !important; }
:where(.q3-e-638ffd4) { color:#3B82F6 !important; }
:where(.q3-e-6777158) { color:#DC2626 !important; }
:where(.q3-e-9f77cb7) { color:#06B6D4 !important; }
:where(.q3-e-649a151) { color:#2563EB !important; }
:where(.q3-e-3090c15) { color:#8B5CF6 !important; }
:where(.q3-e-b7676af) { color:#0D9488 !important; }
:where(.q3-e-b1aca7e) { cursor:default !important; }
:where(.q3-e-57af08c) { height:40px !important; }
:where(.q3-e-886e325) { margin-top:15px !important; }
:where(.q3-e-446a577) { margin:10px 0 0 !important; }
:where(.q3-e-3e3b3e7) { overflow:hidden !important; }
:where(.q3-e-2d9cd3c) { color:var(--q3-texto-5, #94a3b8) !important; }
:where(.q3-e-71ff8b4) { color:#1d4ed8 !important; }
:where(.q3-e-02724d1) { color:#888 !important;font-weight:400 !important; }
:where(.q3-e-1e29eef) { font-weight:500 !important; }
:where(.q3-e-097b8a1) { color:#888 !important;font-size:var(--q3-fs-xs) !important; }
:where(.q3-e-af84fcf) { font-size:var(--q3-fs-xs) !important; }
:where(.q3-e-97d3933) { margin:0 auto !important;max-width:400px !important; }
:where(.q3-e-5ab1184) { max-width:500px !important; }
:where(.q3-e-433dbce) { color:#888 !important; }
:where(.q3-e-6522cc3) { margin:8px 0 0 18px !important;padding:0 !important; }
:where(.q3-e-f3a3ba3) { font-weight:600 !important;text-align:center !important; }
:where(.q3-e-466ebb5) { margin-right:4px !important;vertical-align:middle !important;width:60px !important; }
:where(.q3-e-e634e6d) { font-weight:600 !important; }
:where(.q3-e-35dc55c) { color:#E24B4A !important; }
:where(.q3-e-0ab3ca5) { background:#f0faf5 !important; }
:where(.q3-e-70512a3) { color:#1D9E75 !important;font-weight:600 !important; }
:where(.q3-e-f616e85) { color:#1D9E75 !important; }
:where(.q3-e-939f61e) { color:#E24B4A !important;font-weight:600 !important;text-align:right !important; }
:where(.q3-e-41f3806) { color:#E24B4A !important;text-align:right !important; }
:where(.q3-e-8470a1a) { background:#f8f9fa !important;font-weight:700 !important; }
:where(.q3-e-d4c6cf7) { background:#e9ecef !important;font-weight:700 !important; }
:where(.q3-e-f408f00) { background:#1D9E75 !important; }
:where(.q3-e-b277b9e) { background:#BA7517 !important; }
:where(.q3-e-b183274) { background:#E24B4A !important; }
:where(.q3-e-feaf1ca) { background:#D85A30 !important;border-radius:50% !important; }
:where(.q3-e-132b541) { color:#888 !important;font-variant-numeric:tabular-nums !important; }
:where(.q3-e-c4361ee) { color:#E24B4A !important;font-weight:600 !important;text-align:center !important; }
:where(.q3-e-85f3602) { font-size:var(--q3-fs-xs) !important;max-width:200px !important;overflow:hidden !important;text-overflow:ellipsis !important; }
:where(.q3-e-d9b4a59) { color:#888 !important;padding:10px !important; }
:where(.q3-e-5ebc209) { font-size:var(--q3-fs-lg) !important;font-weight:bold !important; }
:where(.q3-e-31c0fec) { color:#E24B4A !important;font-weight:600 !important; }
:where(.q3-e-a2f002f) { color:#1D9E75 !important;text-align:right !important; }
:where(.q3-e-c270771) { max-width:460px !important; }
:where(.q3-e-45da5a5) { align-items:flex-end !important;flex-wrap:wrap !important;gap:10px !important;margin-bottom:10px !important; }
:where(.q3-e-6ccde11) { color:var(--q3-texto-4, #64748B) !important;font-size:var(--q3-fs-sm) !important; }
:where(.q3-e-306408e) { align-items:center !important;flex-wrap:wrap !important;gap:8px !important;justify-content:space-between !important;margin-top:14px !important; }
:where(.q3-e-3a9f77e) { height:420px !important; }
:where(.q3-e-0d15544) { border-bottom:1px solid var(--q3-borde, #E2E8F0) !important;gap:6px !important;padding:8px 10px !important; }
:where(.q3-e-9f4f63d) { align-items:center !important;font-size:var(--q3-fs-sm) !important;gap:6px !important;margin:0 !important; }
:where(.q3-e-dfc7cc3) { color:var(--q3-texto-4, #64748B) !important;font-size:var(--q3-fs-xs) !important; }
:where(.q3-e-8f64c2c) { flex:3 1 560px !important;max-width:none !important; }
:where(.q3-e-eeae9e9) { color:#c2410c !important;font-weight:600 !important; }
:where(.q3-e-b989fa9) { color:#534AB7 !important; }
:where(.q3-e-16e024e) { color:#0F6E56 !important; }
:where(.q3-e-92371c6) { color:var(--q3-texto-4, #64748b) !important;font-size:var(--q3-fs-md) !important;margin-bottom:12px !important; }
:where(.q3-e-ca7efa9) { font-weight:bold !important;text-align:center !important; }
:where(.q3-e-4a2f2f3) { font-size:var(--q3-fs-sm) !important;margin-top:14px !important; }
:where(.q3-e-ec79f70) { background:#fff !important;border-radius:9px !important;color:#dc2626 !important;font-size:var(--q3-fs-sm) !important;margin-left:4px !important;padding:0 7px !important; }
:where(.q3-e-da5de9d) { background:#fef2f2 !important;border-radius:8px !important;border:1px solid #fca5a5 !important;color:#7f1d1d !important;margin:0 0 10px !important;padding:8px 12px !important; }
:where(.q3-e-b486029) { font-weight:700 !important;margin-left:8px !important; }
:where(.q3-e-307c3df) { min-width:120px !important; }
:where(.q3-e-bd123a7) { min-width:130px !important; }
:where(.q3-e-cc3110c) { align-items:flex-end !important;flex-wrap:nowrap !important;gap:8px !important; }
:where(.q3-e-116e33d) { text-decoration:none !important; }
:where(.q3-e-0b904b1) { gap:4px !important;grid-template-columns:repeat(4, max-content) !important;justify-content:start !important; }
:where(.q3-e-4c7b292) { margin:0 0 8px !important; }
:where(.q3-e-be09ba8) { border-collapse:collapse !important; }
:where(.q3-e-624403e) { color:#888 !important;font-size:12px !important;padding-right:8px !important;text-align:left !important; }
:where(.q3-e-611d2e6) { color:#888 !important;font-size:12px !important;text-align:left !important; }
:where(.q3-e-5e2d51f) { padding:3px 8px 3px 0 !important; }
:where(.q3-e-2b188dd) { font-weight:500 !important;margin:0 !important; }
:where(.q3-e-2dab903) { padding:3px 0 !important; }
:where(.q3-e-a58b070) { margin-bottom:4px !important; }
:where(.q3-e-af4417e) { align-items:center !important;flex-wrap:wrap !important;gap:10px !important; }
:where(.q3-e-8cfe1c0) { max-width:230px !important; }
:where(.q3-e-e98ec93) { color:#888 !important;font-size:11px !important; }
:where(.q3-e-4eb23a8) { color:#fff !important; }
:where(.q3-e-05f547e) { background:#f7f7f7 !important;border-radius:6px !important;border:1px solid #ddd !important;height:640px !important;width:100% !important; }
:where(.q3-e-13ab458) { margin:12px 0 0 !important; }
body.dark-mode :where(.q3-e-f024231) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-1f7eb26) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-27641f8) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-3f4a2f9) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-877d6c0) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-2297838) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-8f26552) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-b6cc70f) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-ba17cb1) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-a04d6bf) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-a04d6bf) { background: rgba(245,158,11,.14) !important; }
body.dark-mode :where(.q3-e-bf88322) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-53de4c3) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-53de4c3) { background: rgba(245,158,11,.14) !important; }
body.dark-mode :where(.q3-e-6dc469c) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-6dc469c) { background: rgba(245,158,11,.14) !important; }
body.dark-mode :where(.q3-e-469f529) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-4459f75) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-bcb352c) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-b897871) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-595f67f) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-595f67f) { background: rgba(245,158,11,.14) !important; }
body.dark-mode :where(.q3-e-879e4e3) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-2b04dbd) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-00fdcb5) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-009b037) { color: var(--q-text-1) !important; }
body.dark-mode :where(.q3-e-10940f3) { background: rgba(34,197,94,.14) !important; }
body.dark-mode :where(.q3-e-722c52e) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-722c52e) { background: rgba(245,158,11,.14) !important; }
body.dark-mode :where(.q3-e-77e8812) { background: rgba(239,68,68,.15) !important; }
body.dark-mode :where(.q3-e-e0b9148) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-5c0bf27) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-c691736) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-be3e6d8) { color: var(--q-text-1) !important; }
body.dark-mode :where(.q3-e-c7c9784) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-02724d1) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-097b8a1) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-433dbce) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-0ab3ca5) { background: rgba(34,197,94,.14) !important; }
body.dark-mode :where(.q3-e-132b541) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-d9b4a59) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-6ccde11) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-dfc7cc3) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-92371c6) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-ec79f70) { background: var(--q-surface-2) !important; }
body.dark-mode :where(.q3-e-da5de9d) { background: rgba(239,68,68,.15) !important; }
body.dark-mode :where(.q3-e-624403e) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-611d2e6) { color: var(--q-text-2) !important; }
body.dark-mode :where(.q3-e-e98ec93) { color: var(--q-text-2) !important; }

/* ── newproduct · VIS-017: imagen para el punto de venta ── */
:where(body[data-vista="newproduct"]) .np-img { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
:where(body[data-vista="newproduct"]) .np-img__vista { width:120px; height:100px; flex:0 0 120px; border-radius:10px; overflow:hidden; border:1px dashed var(--q-border); background:var(--q-surface-2); display:flex; align-items:center; justify-content:center; color:var(--q-text-2); font-size:28px; }
:where(body[data-vista="newproduct"]) .np-img__vista img { width:100%; height:100%; object-fit:cover; }
:where(body[data-vista="newproduct"]) .np-img__acciones { flex:1 1 320px; display:flex; flex-direction:column; gap:4px; }
:where(body[data-vista="newproduct"]) .np-img__ayuda { color:var(--q-text-2); font-size:var(--q3-fs-xs); }
:where(body[data-vista="newproduct"]) .np-img__quitar { display:flex; align-items:center; gap:6px; font-size:var(--q3-fs-sm); font-weight:400; cursor:pointer; }
:where(body[data-vista="newproduct"]) .np-ficha a, :where(body[data-vista="newproduct"]) .np-ficha { flex-direction:column; gap:2px; text-decoration:none; color:var(--q-text-2); }
:where(body[data-vista="newproduct"]) .np-ficha a { display:flex; align-items:center; color:var(--q-color-primary); }
:where(body[data-vista="newproduct"]) .np-ficha span { font-size:var(--q3-fs-xs); font-weight:700; letter-spacing:.04em; }

/* ── retirolote (core/app/view/retirolote-view.php) · OPS-LOT-001 ── */
:where(body[data-vista="retirolote"]) .rl-f--prod { flex: 2 1 360px; }
:where(body[data-vista="retirolote"]) .rl-titulo { margin: 4px 0 12px; font-size: var(--q3-fs-xl); font-weight: 700; color: var(--q-text-1); }
:where(body[data-vista="retirolote"]) .rl-sec { margin: 0 0 12px; }
:where(body[data-vista="retirolote"]) .rl-sec > .q-panel__header { flex-wrap: wrap; }
:where(body[data-vista="retirolote"]) .rl-acciones { display: inline-flex; gap: 8px; text-transform: none; letter-spacing: 0; }
:where(body[data-vista="retirolote"]) .rl-tipo { display: block; color: var(--q-text-2); font-size: var(--q3-fs-xs); }
:where(body[data-vista="retirolote"]) .rl-vacio { color: var(--q-text-2); font-style: italic; }
:where(body[data-vista="retirolote"]) .rl-dev b { color: var(--q3-k-verde, #16A34A); }
:where(body[data-vista="retirolote"]) .rl-anulado td, :where(body[data-vista="retirolote"]) .rl-anulado td a { color: #DC2626 !important; text-decoration: line-through; }
:where(body[data-vista="retirolote"]) .rl-nota { color: var(--q-text-2); font-size: var(--q3-fs-sm); margin: 0; }
@media print { :where(body[data-vista="retirolote"]) :is(#rlForm, .rl-acciones, .rl-nota) { display: none !important; } }

/* VTA-ACC-002 · pendientes de la venta (etapa 2): un chip por lo que falta, que hace esa acción, y el resumen de la
   lista que los cuenta y filtra. Píldora de 10 px en mayúsculas como q-badge; el color dice qué falta. */
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 9px; border-radius: 999px; border: 1px solid; font-size: 10px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; text-decoration: none !important; cursor: pointer; line-height: 1; font-family: inherit; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend .bi { font-size: 11px; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend:hover { filter: brightness(.95); }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend--cobrar { background: #FEF3C7 !important; color: #92400E !important; border-color: #FCD34D !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend--sunat { background: #FEE2E2 !important; color: #991B1B !important; border-color: #FCA5A5 !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend--guia { background: #DBEAFE !important; color: #1E40AF !important; border-color: #93C5FD !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend--cdr { background: #F1F5F9 !important; color: #475569 !important; border-color: #CBD5E1 !important; }
body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"],[data-vista="despachos"]) .vt-pend--cobrar { background: rgba(245,158,11,.18) !important; color: #FCD34D !important; border-color: rgba(252,211,77,.45) !important; }
body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"],[data-vista="despachos"]) .vt-pend--sunat { background: rgba(239,68,68,.18) !important; color: #FCA5A5 !important; border-color: rgba(252,165,165,.45) !important; }
body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"],[data-vista="despachos"]) .vt-pend--guia { background: rgba(59,130,246,.18) !important; color: #93C5FD !important; border-color: rgba(147,197,253,.45) !important; }
body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"],[data-vista="despachos"]) .vt-pend--cdr { background: rgba(148,163,184,.16) !important; color: #CBD5E1 !important; border-color: rgba(203,213,225,.35) !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend--convertir { background: #DCFCE7 !important; color: #166534 !important; border-color: #86EFAC !important; }
body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"],[data-vista="despachos"]) .vt-pend--convertir { background: rgba(34,197,94,.18) !important; color: #86EFAC !important; border-color: rgba(134,239,172,.45) !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pend--cola { background: #E0F2FE !important; color: #075985 !important; border-color: #7DD3FC !important; }
body.dark-mode:where([data-vista="sales"],[data-vista="quotes"],[data-vista="guiasremision"],[data-vista="ocs"],[data-vista="products"],[data-vista="sunat"],[data-vista="despachos"]) .vt-pend--cola { background: rgba(14,165,233,.18) !important; color: #7DD3FC !important; border-color: rgba(125,211,252,.45) !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-resumen { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0 10px; padding: 8px 12px; border: 1px solid var(--q-border, #E2E8F0); border-radius: 10px; background: var(--q-surface-2, #F8FAFC); }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-resumen[hidden] { display: none !important; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-resumen__tit { font-size: var(--q3-fs-xs); font-weight: 700; color: var(--q-text-2, #475569); }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-resumen .vt-pend { height: 26px; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-resumen .vt-pend--on { box-shadow: 0 0 0 2px var(--q-text-1, #1E293B); }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"]) .vt-resumen__todo { border: 0; background: none; color: var(--q-link, #2563EB); font-size: var(--q3-fs-xs); font-weight: 700; cursor: pointer; text-decoration: underline; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pends { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; margin-top: 5px; }
:where(body[data-vista="sales"], body[data-vista="quotes"], body[data-vista="guiasremision"], body[data-vista="ocs"], body[data-vista="products"], body[data-vista="sunat"], body[data-vista="despachos"]) .vt-pends .vt-pend { height: 21px; padding: 0 7px; font-size: 9.5px; }
/* UX-FIL-001 · Cotizaciones: la columna de acciones (pensada para la rejilla de 3) toma el ancho del patrón
   nuevo — ver, imprimir partido y «⋯» en una línea, el chip debajo — y se centra como las demás. */
:where(body[data-vista="quotes"]) .qt-tabla td[data-q3-acciones="propio"] { min-width: 150px; text-align: center !important; }
:where(body[data-vista="quotes"]) .qt-tabla td[data-q3-acciones="propio"] .vt-acc { flex-wrap: nowrap; }
:where(body[data-vista="quotes"]) .qt-tabla th.q-col-acciones { text-align: center !important; }
/* UX-FIL-001 · las opciones del «⋯» también pueden ser <button> (Centro SUNAT): sin el aspecto de botón del navegador. */
:where(body[data-vista="sunat"], body[data-vista="products"], body[data-vista="quotes"], body[data-vista="ocs"]) button.vt-mi { width: 100%; border: 0; background: none; text-align: left; font-family: inherit; }

/* SAN-001 · registrosanitario: las tarjetas son filtros (enlaces). */
:where(body[data-vista="registrosanitario"]) a.rv-kpi { text-decoration: none; color: inherit; }
:where(body[data-vista="registrosanitario"]) a.rv-kpi.rs-kpi--on { outline: 2px solid var(--q-primary, #2563eb); outline-offset: 1px; }
:where(body[data-vista="newproduct"]) .np-rs-ayuda { display: flex; align-items: flex-end; padding-bottom: 6px; color: var(--q3-texto-3, #64748b); }

/* COM-001 · comisiones: metas editables en la fila y barra de avance. */
:where(body[data-vista="comisiones"]) .cm-barra { margin-bottom: 14px; }
:where(body[data-vista="comisiones"]) .cm-in { max-width: 120px; margin: 0 auto; text-align: right; }
:where(body[data-vista="comisiones"]) .cm-in--pct { max-width: 80px; }
:where(body[data-vista="comisiones"]) .cm-avance { min-width: 130px; }
:where(body[data-vista="comisiones"]) .cm-avance__barra { height: 8px; border-radius: 99px; background: var(--q3-fondo-3, #e5e7eb); overflow: hidden; }
:where(body[data-vista="comisiones"]) .cm-avance__barra span { display: block; height: 100%; border-radius: 99px; background: var(--q3-k-ambar, #f59e0b); }
:where(body[data-vista="comisiones"]) .cm-avance--logro .cm-avance__barra span { background: var(--q3-k-verde, #16a34a); }
:where(body[data-vista="comisiones"]) .cm-avance small { font-size: var(--q3-fs-xs, 11px); font-weight: 700; }
:where(body[data-vista="comisiones"]) .cm-sin { color: var(--q3-texto-3, #64748b); font-size: var(--q3-fs-xs, 11px); }
:where(body[data-vista="comisiones"]) .cm-pie { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; color: var(--q3-texto-3, #64748b); }
:where(body[data-vista="comisiones"]) .rv-aviso .q-btn { margin-left: 8px; }
:where(body[data-vista="comisiones"]) .cm-barra .q-toolbar__field { flex: 0 0 240px; max-width: 240px; }

/* FAC-DES-001 · despachos por facturar y nuevo despacho. */
:where(body[data-vista="despachos"]) tr.dp-anulado td { color: var(--q3-k-rojo, #dc2626); text-decoration: line-through; }
:where(body[data-vista="despachos"]) tr.dp-detalle > td { background: var(--q3-fondo-2, #f8fafc); padding: 8px 16px; }
:where(body[data-vista="despachos"]) .dp-lineas { margin: 0; }
:where(body[data-vista="despachos"]) .q-toolbar { margin-bottom: 12px; }
:where(body[data-vista="newdespacho"]) .nd-agregar { display: flex; align-items: flex-end; }
:where(body[data-vista="newdespacho"]) .nd-vacio td { color: var(--q3-texto-3, #64748b); }
:where(body[data-vista="newdespacho"]) .nd-pie { display: flex; gap: 10px; justify-content: center; margin-top: 16px; }
:where(body[data-vista="despachos"]) .q-toolbar__field { flex: 0 0 220px; max-width: 220px; }
:where(body[data-vista="newdespacho"]) .rv-aviso { margin-bottom: 14px; }

/* UX-STK-001 · Stock: «Movimientos» y «Lotes» uno sobre otro, con nombre y descripción corta. */
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-acc { display: inline-grid; gap: 5px; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 8px; align-items: center; width: 158px; padding: 5px 10px; border: 0; border-radius: 8px; color: #fff !important; text-align: left; text-decoration: none !important; font: inherit; cursor: pointer; line-height: 1.15; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn em { grid-row: span 2; font-size: 16px; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn span { font-size: var(--q3-fs-xs, 12px); font-weight: 800; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn small { font-size: 10.5px; font-weight: 500; opacity: .92; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn--mov { background: #D97706; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn--mov:hover { background: #B45309; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn--lote { background: #15803D; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn--lote:hover { background: #166534; }
:where(body[data-vista="stocks"], body[data-vista="stocksv"]) .stk-btn:focus-visible { outline: 3px solid var(--q-primary, #2563eb); outline-offset: 2px; }

/* CXP-RES-001 · Cuentas por pagar: tarjetas que filtran la lista. */
:where(body[data-vista="accountspayables"]) .cxp-kpis { margin: 4px 0 14px; }
:where(body[data-vista="accountspayables"]) .cxp-kpis a.rv-kpi { text-decoration: none; color: inherit; }
:where(body[data-vista="accountspayables"]) .cxp-kpis a.rv-kpi.cxp-kpi--on { outline: 2px solid var(--q-primary, #2563eb); outline-offset: 1px; }
:where(body[data-vista="accountspayables"]) .cxp-kpis a.rv-kpi.cxp-kpi--off { opacity: .75; }

/* VTA-WA-001 · WhatsApp del comprobante: ícono del menú y ventana. */
:where(body[data-vista="sales"]) .q3-ic-wa { background: #16A34A !important; }
:where(body[data-vista="sales"]) #modalWhatsapp .wa-doc { font-weight: 800; margin: 0 0 10px; }
:where(body[data-vista="sales"]) #modalWhatsapp .wa-ayuda { display: block; margin-top: 6px; color: var(--q3-texto-3, #64748b); }
:where(body[data-vista="sales"]) #modalWhatsapp .wa-doc::first-letter { text-transform: uppercase; }

/* GER-001 · Tablero de gerencia (gerencia-view.php) */
:where(body[data-vista="gerencia"]) .ger-barra { margin-bottom: 14px; }
:where(body[data-vista="gerencia"]) .ger-kpis { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
:where(body[data-vista="gerencia"]) .ger-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
@media (max-width: 991px) { :where(body[data-vista="gerencia"]) .ger-grid { grid-template-columns: minmax(0, 1fr); } }
:where(body[data-vista="gerencia"]) .ger-panel { margin: 0; }
:where(body[data-vista="gerencia"]) .ger-panel .q-panel__header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
:where(body[data-vista="gerencia"]) .ger-ir { color: inherit; opacity: .85; font-size: var(--q3-fs-xs); font-weight: 700; text-decoration: none; white-space: nowrap; }
:where(body[data-vista="gerencia"]) .ger-ir:hover { opacity: 1; text-decoration: underline; }
:where(body[data-vista="gerencia"]) .ger-ayuda { margin: 0 0 8px; font-size: var(--q3-fs-xs); color: var(--q-text-2); }
:where(body[data-vista="gerencia"]) .ger-lienzo { position: relative; height: 260px; }
:where(body[data-vista="gerencia"]) .ger-vacio { display: flex; align-items: center; justify-content: center; gap: 8px; height: 100%; color: var(--q-text-2); font-size: var(--q3-fs-sm); text-align: center; padding: 0 16px; }
:where(body[data-vista="gerencia"]) .ger-datos { margin-top: 8px; font-size: var(--q3-fs-xs); }
:where(body[data-vista="gerencia"]) .ger-datos summary { cursor: pointer; color: var(--q-text-2); font-weight: 700; }
:where(body[data-vista="gerencia"]) .ger-tabla { margin-top: 6px; }
:where(body[data-vista="gerencia"]) .ger-barra .q-toolbar__field { flex: 0 0 230px; max-width: 230px; }

/* COB-001 · Gestión de cobranza (cobranza-view.php) */
:where(body[data-vista="cobranza"]) .cb-kpis { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-bottom: 16px; }
:where(body[data-vista="cobranza"]) .cb-filtros { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
:where(body[data-vista="cobranza"]) .cb-filtro { border: 1px solid var(--q-border); background: var(--q-surface); color: var(--q-text-1); border-radius: 999px; padding: 5px 12px; font-size: var(--q3-fs-sm); font-weight: 600; cursor: pointer; }
:where(body[data-vista="cobranza"]) .cb-filtro b { margin-left: 4px; }
:where(body[data-vista="cobranza"]) .cb-filtro.activo { background: var(--q3-k-azul); border-color: var(--q3-k-azul); color: #fff; }
:where(body[data-vista="cobranza"]) .cb-tabla td small { display: block; margin-top: 2px; font-size: var(--q3-fs-xs); color: var(--q-text-2); }
:where(body[data-vista="cobranza"]) .cb-cliente b { display: block; }
:where(body[data-vista="cobranza"]) .cb-rojo { color: #B91C1C; }
:where(body[data-vista="cobranza"]) .cb-tono--rojo { background: #FEE2E2; color: #B91C1C; }
:where(body[data-vista="cobranza"]) .cb-tono--ambar { background: #FEF3C7; color: #B45309; }
:where(body[data-vista="cobranza"]) .cb-tono--verde { background: #DCFCE7; color: #15803D; }
:where(body[data-vista="cobranza"]) .cb-tono--neutro { background: var(--q3-fondo-3, #E5E7EB); color: var(--q-text-2); }
:where(body[data-vista="cobranza"]) .cb-acciones { white-space: nowrap; }
:where(body[data-vista="cobranza"]) .cb-acciones .q-btn { margin: 1px; }
:where(body[data-vista="cobranza"]) .cb-wa:not(:disabled) { background: #16A34A !important; border-color: #16A34A !important; color: #fff !important; }
:where(body[data-vista="cobranza"]) .cb-ficha { margin-bottom: 14px; }
:where(body[data-vista="cobranza"]) .cb-ficha__cab { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; font-size: var(--q3-fs-md); }
:where(body[data-vista="cobranza"]) .cb-ficha__cab span { color: var(--q-text-2); font-size: var(--q3-fs-sm); }
:where(body[data-vista="cobranza"]) .cb-ficha__cifras { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 6px 0 8px; font-size: var(--q3-fs-sm); }
:where(body[data-vista="cobranza"]) .cb-subtitulo { margin: 18px 0 8px; font-size: var(--q3-fs-sm); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--q-text-2); }
:where(body[data-vista="cobranza"]) .cb-historial { display: grid; gap: 8px; }
:where(body[data-vista="cobranza"]) .cb-gestion { border: 1px solid var(--q-border); border-radius: 8px; padding: 8px 10px; font-size: var(--q3-fs-sm); }
:where(body[data-vista="cobranza"]) .cb-gestion__cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; }
:where(body[data-vista="cobranza"]) .cb-gestion__cab span, :where(body[data-vista="cobranza"]) .cb-gestion__prox { color: var(--q-text-2); font-size: var(--q3-fs-xs); }
:where(body[data-vista="cobranza"]) .cb-gestion__nota { margin-top: 4px; white-space: pre-wrap; }
:where(body[data-vista="cobranza"]) .cb-vacio, :where(body[data-vista="cobranza"]) .cb-cargando { color: var(--q-text-2); font-size: var(--q3-fs-sm); }
:where(body[data-vista="cobranza"]) .cb-error { color: #B91C1C; font-weight: 600; }

/* PRV-001 · proveedor habitual en la reposición y precios por proveedor en la orden */
:where(body[data-vista="product-stock"]) .rx-habitual { display: inline-block; padding: 0 6px; border-radius: 999px; background: #DCFCE7; color: #15803D; font-size: var(--q3-fs-2xs); font-weight: 800; text-transform: uppercase; }
:where(body[data-vista="product-stock"]) .oc-de { display: block; font-size: var(--q3-fs-2xs); color: var(--q-text-2); }
:where(body[data-vista="product-stock"]) .oc-grupos { margin-top: 10px; padding: 10px 12px; border: 1px solid #BFDBFE; border-radius: 8px; background: #EFF6FF; color: #1E3A8A; font-size: var(--q3-fs-sm); }
:where(body[data-vista="product-stock"]) .oc-grupos ul { margin: 6px 0 0; padding-left: 18px; }
:where(body[data-vista="brands"]) .mc-prov { min-width: 220px; margin: 0 auto; }
:where(body[data-vista="preciosproveedor"]) .pp-barra { margin-bottom: 14px; flex-wrap: wrap; }
:where(body[data-vista="preciosproveedor"]) .pp-check { align-self: flex-end; padding-bottom: 8px; }
:where(body[data-vista="preciosproveedor"]) .pp-kpis { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-bottom: 14px; }
:where(body[data-vista="preciosproveedor"]) .pp-tabla td small { display: block; margin-top: 2px; font-size: var(--q3-fs-xs); color: var(--q-text-2); }
:where(body[data-vista="preciosproveedor"]) .pp-prod b { display: block; }
:where(body[data-vista="preciosproveedor"]) .pp-lista { min-width: 300px; }
:where(body[data-vista="preciosproveedor"]) .pp-linea { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 10px; padding: 3px 0; border-bottom: 1px dashed var(--q-border); text-align: left; }
:where(body[data-vista="preciosproveedor"]) .pp-linea:last-child { border-bottom: 0; }
:where(body[data-vista="preciosproveedor"]) .pp-linea small { grid-column: 1 / -1; margin-top: 0; }
:where(body[data-vista="preciosproveedor"]) .pp-linea--min b { color: #15803D; }
:where(body[data-vista="preciosproveedor"]) .pp-razon { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:where(body[data-vista="preciosproveedor"]) .pp-ok { background: #DCFCE7; color: #15803D; }
:where(body[data-vista="preciosproveedor"]) .pp-caro { background: #FEE2E2; color: #B91C1C; }
:where(body[data-vista="preciosproveedor"]) .pp-sin { color: var(--q-text-2); }

/* INV-CNT-001 · Inventario físico (conteos-view.php) */
:where(body[data-vista="conteos"]) .q-panel__header { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
:where(body[data-vista="conteos"]) .ci-acciones { display: flex; flex-wrap: wrap; gap: 6px; }
:where(body[data-vista="conteos"]) .ci-kpis { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-bottom: 16px; }
:where(body[data-vista="conteos"]) .ci-avance { height: 8px; min-width: 90px; border-radius: 99px; background: var(--q3-fondo-3, #E5E7EB); overflow: hidden; }
:where(body[data-vista="conteos"]) .ci-avance span { display: block; height: 100%; background: var(--q3-k-verde); }
:where(body[data-vista="conteos"]) td small { display: block; margin-top: 2px; font-size: var(--q3-fs-xs); color: var(--q-text-2); }
:where(body[data-vista="conteos"]) .ci-prod b { display: block; }
:where(body[data-vista="conteos"]) .ci-sin, :where(body[data-vista="conteos"]) .ci-ayuda { color: var(--q-text-2); font-size: var(--q3-fs-xs); }
:where(body[data-vista="conteos"]) .ci-ok { color: #15803D; font-weight: 600; }
:where(body[data-vista="conteos"]) .ci-menos { color: #B91C1C; }
:where(body[data-vista="conteos"]) .ci-mas { color: #15803D; }
:where(body[data-vista="conteos"]) .ci-tono--ambar { background: #FEF3C7; color: #B45309; }
:where(body[data-vista="conteos"]) .ci-tono--verde { background: #DCFCE7; color: #15803D; }
:where(body[data-vista="conteos"]) .ci-tono--neutro { background: var(--q3-fondo-3, #E5E7EB); color: var(--q-text-2); }
:where(body[data-vista="conteos"]) .cb-filtros { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
:where(body[data-vista="conteos"]) .cb-filtro { border: 1px solid var(--q-border); background: var(--q-surface); color: var(--q-text-1); border-radius: 999px; padding: 5px 12px; font-size: var(--q3-fs-sm); font-weight: 600; cursor: pointer; }
:where(body[data-vista="conteos"]) .cb-filtro b { margin-left: 4px; }
:where(body[data-vista="conteos"]) .cb-filtro.activo { background: var(--q3-k-azul); border-color: var(--q3-k-azul); color: #fff; }

/* MSG-001 · Mensajes a clientes (mensajes-view.php) */
:where(body[data-vista="mensajes"]) .ms-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; border-bottom: 2px solid var(--q3-k-azul, #2563EB); }
:where(body[data-vista="mensajes"]) .ms-tabs .nav-link { display: flex; align-items: center; gap: 6px; padding: 9px 14px; border: 1px solid var(--q-border); border-bottom: 0; border-radius: 8px 8px 0 0; background: var(--q-surface-2, #F8FAFC); color: var(--q-text-1); font-weight: 700; font-size: var(--q3-fs-sm); }
:where(body[data-vista="mensajes"]) .ms-tabs .nav-link:hover { background: var(--q3-fondo-3, #E5E7EB); }
:where(body[data-vista="mensajes"]) .ms-tabs .nav-link.active { background: var(--q3-k-azul, #2563EB); border-color: var(--q3-k-azul, #2563EB); color: #fff; }
:where(body[data-vista="mensajes"]) .ms-tabs .nav-link.active .q-badge { background: rgba(255,255,255,.22); color: #fff; }
:where(body[data-vista="mensajes"]) .ms-contenido > .tab-pane > .q-panel { border-top-left-radius: 0; margin-top: 0; }
:where(body[data-vista="mensajes"]) .q-panel { margin-bottom: 16px; }
:where(body[data-vista="mensajes"]) .q-panel__header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
:where(body[data-vista="mensajes"]) .ms-check { display: flex; align-items: center; gap: 8px; margin: 6px 0 10px; font-weight: 600; text-align: left; }
:where(body[data-vista="mensajes"]) .ms-check-col { display: flex; align-items: flex-end; }
:where(body[data-vista="mensajes"]) .ms-form small, :where(body[data-vista="mensajes"]) .ms-campo small, :where(body[data-vista="mensajes"]) .ms-ayuda { display: block; margin-top: 3px; font-size: var(--q3-fs-xs); color: var(--q-text-2); text-align: left; }
:where(body[data-vista="mensajes"]) .ms-ayuda { margin-top: 12px; }
:where(body[data-vista="mensajes"]) .ms-botones { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
:where(body[data-vista="mensajes"]) .ms-prueba { max-width: 240px; }
:where(body[data-vista="mensajes"]) .ms-campo { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--q-border); }
:where(body[data-vista="mensajes"]) .ms-fila { display: flex; gap: 8px; }
:where(body[data-vista="mensajes"]) .ms-sim { margin-top: 12px; padding: 10px 12px; border: 1px solid #BFDBFE; border-radius: 8px; background: #EFF6FF; color: #1E3A8A; font-size: var(--q3-fs-sm); text-align: left; }
:where(body[data-vista="mensajes"]) .ms-sim ul { margin: 6px 0 0; padding-left: 18px; }
:where(body[data-vista="mensajes"]) .ms-plantillas { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 16px; align-items: start; }
:where(body[data-vista="mensajes"]) .ms-plista { display: grid; gap: 6px; }
:where(body[data-vista="mensajes"]) .ms-pboton { display: flex; align-items: center; gap: 8px; width: 100%; padding: 9px 12px; border: 1px solid var(--q-border); border-radius: 8px; background: var(--q-surface); color: var(--q-text-1); font-weight: 600; font-size: var(--q3-fs-sm); text-align: left; cursor: pointer; }
:where(body[data-vista="mensajes"]) .ms-pboton:hover { background: var(--q-surface-2, #F8FAFC); }
:where(body[data-vista="mensajes"]) .ms-pboton.activo { border-color: var(--q3-k-azul, #2563EB); background: #EFF6FF; color: #1E3A8A; }
@media (max-width: 767px) { :where(body[data-vista="mensajes"]) .ms-plantillas { grid-template-columns: minmax(0, 1fr); } :where(body[data-vista="mensajes"]) .ms-plista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
:where(body[data-vista="mensajes"]) .ms-plantilla { border: 1px solid var(--q-border); border-radius: 8px; padding: 10px 12px; text-align: left; }
:where(body[data-vista="mensajes"]) .ms-plantilla legend { float: none; width: auto; padding: 0 6px; margin: 0; font-size: var(--q3-fs-sm); font-weight: 800; }
:where(body[data-vista="mensajes"]) .ms-plantilla textarea { height: auto; min-height: 240px; font-family: inherit; }
:where(body[data-vista="mensajes"]) .ms-tono--verde { background: #DCFCE7; color: #15803D; }
:where(body[data-vista="mensajes"]) .ms-tono--ambar { background: #FEF3C7; color: #B45309; }
:where(body[data-vista="mensajes"]) .ms-tono--rojo { background: #FEE2E2; color: #B91C1C; }
:where(body[data-vista="mensajes"]) .ms-tono--neutro { background: var(--q3-fondo-3, #E5E7EB); color: var(--q-text-2); }
:where(body[data-vista="mensajes"]) #tblMensajes td small { display: block; font-size: var(--q3-fs-2xs); color: #B91C1C; }
:where(body[data-vista="sales"]) .q3-ic-correo { background: #0B6AA5 !important; }
:where(body[data-vista="sales"]) .wa-texto, :where(body[data-vista="sales"]) .cc-cuerpo { height: auto; min-height: 120px; font-family: inherit; }
:where(body[data-vista="sales"]) #modalCorreo .q-label { margin-top: 8px; }
:where(body[data-vista="sales"]) .cc-aviso { padding: 8px 12px; border-radius: 8px; background: #FEF3C7; color: #92400E; font-size: var(--q3-fs-sm); margin-bottom: 6px; }
:where(body[data-vista="cobranza"]) .cb-excluir { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: var(--q3-fs-sm); font-weight: 600; }
:where(body[data-vista="cobranza"]) .cb-correo { display: block; color: var(--q-text-2); font-size: var(--q3-fs-xs); }