body.px-activo #vista-panel,
body.px-activo #vista-acceso,
body.px-activo #franja-prueba { display: none !important; }
body.px-activo main.envoltura { padding: 0 !important; margin: 0 !important; min-height: 0 !important; max-width: none !important; }
body.px-activo #campana-lista { display: none !important; }
body.px-activo #px-cabecera .cc-topbar__correo { display: none; }
@media (max-width: 767px) {
body.px-activo #ch-burbuja { display: none; }
body.px-activo .ch-panel { bottom: calc(76px + env(safe-area-inset-bottom)); }
}
#pxc-casos-revisar-vacio.cc-vacio { max-width: none; }
body.px-activo .v2-en-vivo.pv-caido { color: var(--u-critico); }
body.px-activo .v2-en-vivo.pv-caido::before { background: var(--u-critico); border-radius: 2px; animation: none; }
body.px-activo .lf-mapa-caja, body.px-activo .lf-mapa-lienzo { overflow: hidden; }
body.px-activo {
--vd-base: #e4e7ea;
--vd-luz: rgba(255, 255, 255, .95); --vd-luz2: rgba(255, 255, 255, .85);
--vd-gris: rgba(150, 156, 163, .46); --vd-gris2: rgba(142, 148, 155, .40);
--vd-caja: rgba(255, 255, 255, .66); --vd-caja-borde: rgba(255, 255, 255, .9);
--vd-sombra: 0 2px 5px rgba(16, 24, 32, .06), 0 10px 26px rgba(16, 24, 32, .10);
--vd-sub: #eef0f2; --vd-sub-borde: rgba(16, 24, 32, .11);
--vd-cab: #e8eaed; --vd-alt: rgba(16, 24, 32, .035);
--vd-pista: #dfe3e7;
}
html[data-tema="oscuro"] body.px-activo {
--vd-base: #0e1113; --vd-luz: rgba(255, 255, 255, .06); --vd-luz2: rgba(255, 255, 255, .045);
--vd-gris: rgba(130, 138, 146, .16); --vd-gris2: rgba(130, 138, 146, .12);
--vd-caja: rgba(40, 45, 50, .82); --vd-caja-borde: rgba(255, 255, 255, .1);
--vd-sombra: 0 2px 5px rgba(0, 0, 0, .5), 0 10px 26px rgba(0, 0, 0, .35);
--vd-sub: rgba(255, 255, 255, .08); --vd-sub-borde: rgba(255, 255, 255, .1);
--vd-cab: rgba(255, 255, 255, .11); --vd-alt: rgba(255, 255, 255, .035); --vd-pista: rgba(255, 255, 255, .16);
}
@media (prefers-color-scheme: dark) {
html:not([data-tema="claro"]) body.px-activo {
--vd-base: #0e1113; --vd-luz: rgba(255, 255, 255, .06); --vd-luz2: rgba(255, 255, 255, .045);
--vd-gris: rgba(130, 138, 146, .16); --vd-gris2: rgba(130, 138, 146, .12);
--vd-caja: rgba(40, 45, 50, .82); --vd-caja-borde: rgba(255, 255, 255, .1);
--vd-sombra: 0 2px 5px rgba(0, 0, 0, .5), 0 10px 26px rgba(0, 0, 0, .35);
--vd-sub: rgba(255, 255, 255, .08); --vd-sub-borde: rgba(255, 255, 255, .1);
--vd-cab: rgba(255, 255, 255, .11); --vd-alt: rgba(255, 255, 255, .035); --vd-pista: rgba(255, 255, 255, .16);
}
}
body.px-activo .px-cuerpo { background-color: var(--vd-base); }
body.px-activo #px-main {
background:
radial-gradient(560px 380px at 8% 6%, var(--vd-luz), transparent 70%),
radial-gradient(620px 420px at 88% 20%, var(--vd-gris), transparent 70%),
radial-gradient(640px 440px at 50% 55%, var(--vd-luz2), transparent 70%),
radial-gradient(560px 400px at 12% 75%, var(--vd-gris2), transparent 70%),
radial-gradient(600px 420px at 85% 92%, var(--vd-gris), transparent 70%),
var(--vd-base);
min-height: calc(100vh - 56px);
}
body.px-activo #px-main :is(.px-cab, .px-cuadre, .px-tabla, .px-avisos, section.bloque.cc-card,
.v2g-panel.dos > .v2g, .v2g-tira, details.v2g-pl, .vx-sec, .px-vacias, .px-g.px-g4,
.lf-enlace, .lf-tabla, .lf-panel,
.dp-bloque, details.dp-g, .dp-sinavisos, .dp-cambiar-menu, .dp-hoja-caja) {
background: var(--vd-caja);
-webkit-backdrop-filter: blur(28px) saturate(100%); backdrop-filter: blur(28px) saturate(100%);
border: 1px solid var(--vd-caja-borde);
box-shadow: var(--vd-sombra);
border-radius: 16px;
}
body.px-activo #px-main .v2g-panel.dos > .v2g { padding: 16px 18px; }
body.px-activo #px-main .v2g-panel.dos { border-bottom: 0; gap: 16px; }
body.px-activo #px-main .v2g-panel.dos > .v2g:last-child:nth-child(odd) { grid-column: 1 / -1; }
body.px-activo #px-main .px-g.px-g4 > .px-card:hover,
body.px-activo #px-main .dp-r:hover { background: var(--vd-sub); }
body.px-activo #px-main :is(.px-g2, .px-g3) > .px-card,
body.px-activo #px-main .px-tile, body.px-activo #px-main .px-area-card {
background: var(--vd-caja); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
border-color: var(--vd-caja-borde); box-shadow: var(--vd-sombra); border-radius: 14px;
}
body.px-activo #px-main section.bloque.cc-card > h2.seccion.cc-card__titulo { background: var(--vd-cab); border-bottom-color: var(--vd-sub-borde); border-radius: 16px 16px 0 0; }
body.px-activo #px-main details.dp-g > summary { background: var(--vd-cab); border-radius: 16px 16px 0 0; min-height: 48px; }
body.px-activo #px-main details.dp-g[open] > summary { border-bottom: 1px solid var(--vd-sub-borde); }
body.px-activo #px-main details.v2g-pl > summary { background: var(--vd-cab); border-color: var(--vd-sub-borde); }
body.px-activo #px-main :is(.v2g-area-graf > .v2g, .kpi.cc-card, section.bloque .v2g) {
background: var(--vd-sub); border: 1px solid var(--vd-sub-borde); border-radius: 14px; box-shadow: none; padding: 14px 16px; -webkit-backdrop-filter: none; backdrop-filter: none;
}
body.px-activo #px-main .kpi.cc-card { padding: 0; overflow: hidden; }
body.px-activo #px-main .kpi-fila-cabeza { background: var(--vd-cab); border-bottom-color: var(--vd-sub-borde); }
body.px-activo #px-main .v2t-rec { display: flex; flex-wrap: wrap; gap: 8px; border: 0; margin: 12px 0; }
body.px-activo #px-main .v2t-rec-t { flex: 1 1 100%; padding: 0 2px; }
body.px-activo #px-main .v2t-rec :is(button, div.fijo),
body.px-activo #px-main .v2t-rec :is(button, div.fijo).cero {
flex: 1 1 140px; min-height: 64px; padding: 10px 14px; border: 1px solid var(--vd-sub-borde); border-radius: 12px; background: var(--vd-sub);
}
body.px-activo #px-main .v2t-rec :is(button, div.fijo).cero .k { font-size: 20px; }
body.px-activo #px-main .v2t-rec button.act { background: var(--vd-cab); }
body.px-activo #px-main :is(.v2g-cifras, .dp-cifras) { display: flex; flex-wrap: wrap; gap: 8px; border: 0 !important; }
body.px-activo #px-main :is(.v2g-cifra, .dp-cifra) { flex: 1 1 180px; min-width: 0; margin: 0 !important; padding: 12px 14px; border: 1px solid var(--vd-sub-borde) !important; border-radius: 12px; background: var(--vd-sub); }
body.px-activo #px-main .kpi-fila-cuerpo { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px; }
body.px-activo #px-main .kpi-fila-cuerpo > .kpi-dato { flex: 1 1 160px; margin: 0; border: 1px solid var(--vd-sub-borde); border-radius: 12px; background: var(--vd-caja); }
body.px-activo #px-main .v2g-leyenda.fila { gap: 6px; }
body.px-activo #px-main .v2g-leyenda.fila > li { flex: 1 1 auto; }
body.px-activo #px-main .v2g-leyenda.fila button { background: var(--vd-sub); border: 1px solid var(--vd-sub-borde); border-radius: 10px; white-space: nowrap; }
body.px-activo #px-main .dp-ficha:not(.act) { background: var(--vd-sub); border-color: var(--vd-sub-borde); }
body.px-activo #px-main { --vd-col-n: 170px; --vd-col-v: 128px; }
body.px-activo #px-main .v2g-barras,
body.px-activo #px-main .v2g-medidor { grid-template-columns: var(--vd-col-n) minmax(0, 1fr) var(--vd-col-v); }
body.px-activo #px-main :is(.v2g-barra, .v2g-medidor, .dp-barra) .p { height: 10px; border-radius: 99px; background: var(--vd-pista); }
body.px-activo #px-main :is(.v2g-barra, .v2g-medidor, .dp-barra) .p i { border-radius: 99px; }
body.px-activo #px-main :is(.v2g-barra, .v2g-medidor) .v { justify-self: end; text-align: right; align-items: flex-end; }
body.px-activo #px-main .v2g-barra.cero .p { background: var(--vd-pista); opacity: .5; }
body.px-activo #px-main .v2g-apilada { border-radius: 99px; overflow: hidden; }
body.px-activo #px-main .dp-pbarra { background: var(--vd-pista); }
body.px-activo #px-main :is(table.v2t, .lf-tabla, .px-tabla) { background: var(--vd-caja); border-color: var(--vd-sub-borde); -webkit-backdrop-filter: blur(28px); backdrop-filter: blur(28px); }
body.px-activo #px-main :is(table.v2t th, .lf-tabla th, .px-tabla th) { background: var(--vd-cab); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
body.px-activo #px-main table.v2t tbody tr:nth-child(even) td { background: var(--vd-alt); }
body.px-activo #px-main :is(table.v2t, .lf-tabla, .px-tabla) td { border-bottom-color: var(--vd-sub-borde); }
body.px-activo #px-main table.v2t tbody tr.v2t-grupo td { background: var(--vd-cab); }
body.px-activo #px-main .v2t-tarjetas table.v2t tbody tr { background: var(--vd-caja); }
body.px-activo #px-main .v2i-ph .v2i-fila { background: var(--vd-caja); border: 1px solid var(--vd-caja-borde); box-shadow: var(--vd-sombra); }
@media (max-width: 767px) {
body.px-activo #px-main { --vd-col-n: 104px; --vd-col-v: 92px; }
body.px-activo #px-main .v2g-panel.dos > .v2g { padding: 14px; }
}
body.px-activo #px-main .pv-drill { cursor: pointer; }
body.px-activo #px-main .v2r-m.pv-drill:hover { border-color: var(--cc-primario, #0f4c5c); box-shadow: inset 0 0 0 1px var(--cc-primario, #0f4c5c); }
body.px-activo #px-main .v2r-m.pv-drill > span::after, body.px-activo #px-main .v2r-pri.pv-drill .rot::after { content: ' ›'; color: var(--cc-primario, #0f4c5c); }
body.px-activo #px-main .v2r-pri.pv-drill:hover .cif { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }
body.px-activo #px-main .pv-drill:focus-visible { outline: 2px solid var(--cc-primario, #0f4c5c); outline-offset: 2px; }
body.px-activo #px-main .pv-pulsado { cursor: progress; opacity: .72; }
body.px-activo #pv-volver-sa { display: flex; align-items: center; gap: 12px; padding: 6px 16px; background: #fff7e0; border-bottom: 2px solid var(--u-alerta, #b46e00); }
body.px-activo #pv-volver-sa[hidden] { display: none; }
body.px-activo .pv-volver-sa-b { flex: 0 0 auto; width: auto; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 16px; border: 0; border-radius: 10px;
background: var(--cc-teal-700, #0b4f5c); color: #fff; font: inherit; font-weight: 700; font-size: 15px; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
body.px-activo .pv-volver-sa-b:hover { filter: brightness(1.12); }
body.px-activo .pv-volver-sa-b:focus-visible { outline: 3px solid var(--u-alerta, #b46e00); outline-offset: 2px; }
body.px-activo .pv-volver-sa-b.pv-pulsado { cursor: progress; opacity: .75; }
body.px-activo .pv-volver-sa-donde { font-size: 13.5px; color: #5a4300; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.px-activo.pv-volver-visible .dp-franja .dp-fr-volver { display: none; }
body.px-activo #ch-panel.ch-panel--anclada { z-index: auto; }
@media (max-width: 767px) {
body.px-activo #pv-volver-sa { padding: 6px 12px; }
body.px-activo .pv-volver-sa-b { flex: 1 1 auto; justify-content: center; font-size: 14px; }
body.px-activo .pv-volver-sa-donde { display: none; }
}
@keyframes pv-casa-latido { 0%, 100% { box-shadow: 0 0 0 2px rgba(255, 214, 102, .95), 0 0 6px 2px rgba(255, 214, 102, .35); } 50% { box-shadow: 0 0 0 3px rgba(255, 214, 102, 1), 0 0 18px 7px rgba(255, 214, 102, .75); } }
body.px-activo.pv-casa-brilla #dm-barra .dm-casa .dm-b { animation: pv-casa-latido 1.6s ease-in-out infinite; border-radius: 8px; position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
body.px-activo.pv-casa-brilla #dm-barra .dm-casa .dm-b { animation: none; box-shadow: 0 0 0 3px rgba(255, 214, 102, 1); }
}