/* SISTEM - CSS REFACTORIZADO PARA PWA, ANDROID E iOS */

:root{
  --azul:#2563eb;
  --azul-oscuro:#132a63;
  --azul-scada:#052a79;
  --azul-scada-2:#0645aa;
  --verde:#16a34a;
  --verde-texto:#158b25;
  --rojo:#dc2626;
  --rojo-claro:#f27676;
  --texto:#0f172a;
  --texto-secundario:#64748b;
  --borde:#dbe4f0;
  --fondo-suave:#f8fafc;
  --blanco:#ffffff;
  --sombra:0 4px 12px rgba(15,23,42,.05);
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  font-size:12px;
  background:var(--blanco);
  -webkit-text-size-adjust:100%;
}

body{
  min-height:100vh;
  font-family:Arial,Helvetica,sans-serif;
  background:var(--blanco);
  color:var(--texto);
  padding:0
    env(safe-area-inset-right)
    calc(58px + env(safe-area-inset-bottom))
    env(safe-area-inset-left);
  overflow-x:hidden;
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  -webkit-tap-highlight-color:transparent;
}

a{
  color:inherit;
}

body.rol-admin .login-panel{
  display:none !important;
}

.panel-configuracion{
  margin-bottom:10px;
  padding:14px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:14px;
  box-shadow:var(--sombra);
}


.usuarioCard{
  margin-bottom:10px;
  padding:12px;
  background:var(--fondo-suave);
  border:1px solid var(--borde);
  border-radius:12px;
}

.usuarioCard b{
  color:var(--texto);
  font-size:12px;
}

.usuarioCard select{
  width:100%;
  margin-top:8px;
  padding:9px;
  background:var(--blanco);
  border:1px solid #cbd5e1;
  border-radius:8px;
  font-size:12px;
  font-weight:800;
}

.app-shell{
  margin-top:0;
  padding:0 10px 10px;
}

.section-title{
  margin-bottom:8px;
}

.section-title h2{
  margin-bottom:2px;
  font-size:22px;
  font-weight:900;
}

.section-title p{
  color:var(--texto-secundario);
  font-size:11px;
}

.login-panel{
  display:grid;
  grid-template-columns:1fr 1fr 100px 140px 100px;
  gap:8px;
  margin-bottom:8px;
  padding:10px;
  background:var(--blanco);
  border-radius:12px;
  box-shadow:0 4px 10px rgba(15,23,42,.05);
}

.login-panel input{
  min-width:0;
  padding:8px 10px;
  border:1px solid var(--borde);
  border-radius:8px;
  font-size:11px;
}

.login-panel input:focus{
  outline:0;
  border-color:var(--azul);
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

.login-panel button{
  border:0;
  border-radius:8px;
  color:var(--blanco);
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}

#loginBtn{
  background:var(--verde);
}

#pushBtn{
  background:var(--azul);
}


.contadorAvisos{
  display:flex;
  flex-direction:column;
  width:100%;
  gap:10px;
  margin:14px 0 12px;
}

.contador{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  min-width:0;
  min-height:86px;
  padding:8px 12px;
  overflow:hidden;
  border-radius:16px;
  box-shadow:0 8px 18px rgba(15,23,42,.12);
}

.contador.grave{
  min-height:86px;
  color:#111827;
  background:linear-gradient(135deg,#ffd9d9 0%,#ffc6c6 55%,#ffbcbc 100%);
  border:1px solid #ff9d9d;
}

.contador.normal{
  justify-content:flex-start;
  color:#111827;
  background:linear-gradient(120deg,#eceff3 0%,#e3e8ef 50%,#d8dee7 100%);
  border:1px solid #cfd7e2;
}

.contador.grave .contador-icon{
  color:#ff1f2d;
}

.contador.normal .contador-icon{
  color:#8b94a3;
}

.contador-left{
  display:flex;
  align-items:center;
  flex-shrink:0;
  min-width:0;
  gap:10px;
}

.contador-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 48px;
  width:48px;
  height:48px;
  background:var(--blanco);
  border-radius:50%;
  box-shadow:0 4px 12px rgba(15,23,42,.08);
  font-size:28px;
  line-height:1;
  font-weight:900;
}

.contador-info{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:88px;
}

.contador-label{
  font-size:13px;
  line-height:1.05;
  font-weight:900;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.contador-subtitulo{
  margin-top:3px;
  font-size:8px;
  line-height:1.1;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.contador-num{
  margin-top:5px;
  font-size:30px;
  line-height:.85;
  font-weight:900;
}

.contador-prioridad{
  display:flex;
  flex:1;
  flex-direction:column;
  align-self:stretch;
  justify-content:center;
  min-width:0;
  max-width:100%;
  margin-left:8px;
  padding-left:8px;
  overflow:hidden;
  border-left:2px solid rgba(255,255,255,.95);
}

.contador-prioridad .titulo{
  margin-bottom:10px;
  text-align:center;
  font-size:12px;
  line-height:1.1;
  font-weight:900;
  overflow-wrap:anywhere;
}

.contador-prioridad .fila{
  display:grid;
  grid-template-columns:minmax(0,1fr) 2px minmax(0,1fr);
  align-items:center;
  width:100%;
  min-width:0;
  gap:7px;
}

.prioridad-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:0;
  text-align:center;
  font-size:8px;
  line-height:1.15;
  font-weight:900;
  white-space:nowrap;
}

.prioridad-cabecera{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:0;
  color:#000;
  font-size:9px;
  line-height:1;
  font-weight:900;
  text-align:center;
  white-space:nowrap;
}

.prioridad-cabecera span:last-child{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#000;
  font-weight:900;
  line-height:1;
}

.flecha-prioridad,
.flecha-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  height:auto;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  font-family:Arial,Helvetica,sans-serif;
  font-size:24px;
  line-height:1;
  font-weight:900;
  transform:none;
}

.flecha-prioridad.flecha-alta,
.flecha-badge.flecha-alta{
  color:#ff6a00;
}

.flecha-prioridad.flecha-baja,
.flecha-badge.flecha-baja{
  color:#f2b900;
}

.contador-num-sec{
  margin-top:7px;
  color:#050505;
  font-size:22px;
  line-height:.9;
  font-weight:900;
}

.separador-prioridad{
  width:2px;
  height:40px;
  min-height:40px;
  background:rgba(255,255,255,.95);
}

.tab-content{
  display:none;
}

.tab-content.active{
  display:block;
}

.msg{
  margin-bottom:10px;
  padding:8px;
  background:#f8fbff;
  border:1px solid #dbeafe;
  border-radius:14px;
}

.msg-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:4px 8px 8px;
}

.msg-equipo{
  color:var(--azul);
  font-size:15px;
  font-weight:900;
}

.msg-badge{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 !important;
  background:transparent !important;
  border:0;
  border-radius:0;
  box-shadow:none;
  color:#000;
  font-size:13px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}

.msg-badge > span:not(.flecha-badge){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#000;
  font-weight:900;
  line-height:1;
}

.msg-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:0;
  padding:4px 16px;
  background:var(--blanco);
  border:1px solid #eef2f7;
  border-radius:12px;
}

.msg-item{
  display:flex;
  gap:10px;
  padding:9px 0;
  border-bottom:1px solid #e5e7eb;
}

.msg-item:nth-child(1),
.msg-item:nth-child(3){
  padding-right:16px;
  border-right:1px solid #e5e7eb;
}

.msg-item:nth-child(2),
.msg-item:nth-child(4){
  padding-left:16px;
}

.msg-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:34px;
  height:34px;
  background:#f1f5ff;
  border-radius:8px;
  color:var(--azul);
  font-size:17px;
}

.msg-label{
  margin-bottom:3px;
  color:var(--texto-secundario);
  font-size:9px;
  font-weight:900;
}

.msg-value{
  color:var(--texto);
  font-size:11px;
  font-weight:900;
  line-height:1.35;
  overflow-wrap:anywhere;
}

.cruce-card,
.equipo-card,
.importante-card{
  margin-bottom:10px;
  padding:14px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:12px;
  box-shadow:0 4px 10px rgba(15,23,42,.05);
}

.cruce-actualizado,
.equipo-actualizado,
.importante-fecha{
  margin-bottom:18px;
  color:var(--texto);
  font-size:13px;
  font-weight:900;
  line-height:1.4;
}

.cruce-asunto,
.equipo-asunto,
.importante-asunto,
.importante-titulo{
  margin-bottom:18px;
  color:#1d4ed8;
  font-size:15px;
  font-weight:900;
  line-height:1.5;
}


.equipo-actions,
.importante-actions{
  display:flex;
  gap:10px;
  margin-top:14px;
}

.equipo-btn,
.importante-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  background:var(--azul);
  border-radius:10px;
  color:var(--blanco);
  font-size:11px;
  font-weight:900;
  text-decoration:none;
}

.equipo-btn.descargar,
.importante-btn.descargar{
  background:var(--verde);
}

.equipo-btn:hover,
.importante-btn:hover{
  opacity:.92;
}

.importante-card{
  box-shadow:none;
}

.correo-importante-label{
  margin-bottom:18px;
  color:#1d4ed8;
  font-size:13px;
  font-weight:900;
  text-align:center;
  text-decoration:underline;
}

.importante-cuerpo{
  padding:0;
  background:var(--blanco);
  border:0;
  border-radius:10px;
  box-shadow:none;
  color:var(--texto);
  font-size:15px;
  font-weight:900;
  text-align:center;
}

.btn-borrar-incidencia{
  margin-top:10px;
  padding:7px 10px;
  background:#ef4444;
  border:0;
  border-radius:8px;
  color:var(--blanco);
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}

.btn-borrar-importante{
  width:100%;
  margin-top:20px;
  padding:12px;
  background:var(--rojo);
  border:0;
  border-radius:10px;
  color:var(--blanco);
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}

.btn-borrar-incidencia:active,
.btn-borrar-importante:active{
  transform:scale(.98);
}

.lecturas-admin{
  margin-top:12px;
  padding:10px 12px;
  background:var(--fondo-suave);
  border:1px solid var(--borde);
  border-radius:10px;
  box-shadow:0 4px 10px rgba(15,23,42,.04);
  font-size:12px;
}

.lecturas-admin .msg-label{
  margin-bottom:6px;
  color:#334155;
  font-size:10px;
  font-weight:900;
}

.lectura-ok{
  margin-top:4px;
  color:#15803d;
  font-size:12px;
  font-weight:900;
}

.lectura-pendiente{
  margin-top:4px;
  color:#b45309;
  font-size:12px;
  font-weight:900;
}


.section-title-avisos{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  width:100%;
}

.section-title-texto{
  flex:1;
  min-width:0;
}

.filtro-equipo-wrap{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  flex-shrink:0;
  gap:4px;
}

.filtro-equipo-wrap label{
  color:var(--texto-secundario);
  font-size:9px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
}

#filtroEquipo{
  width:115px;
  height:34px;
  padding:0 28px 0 10px;
  background:var(--blanco);
  border:1px solid #cbd5e1;
  border-radius:9px;
  color:var(--texto);
  font-family:Arial,Helvetica,sans-serif;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
}

#filtroEquipo:focus{
  outline:0;
  border-color:var(--azul);
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

#filtroEquipo:disabled{
  opacity:.7;
  cursor:not-allowed;
}

.scada-panel{
  width:100%;
  margin:0 auto 14px;
  padding:12px;
  overflow:hidden;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:14px;
  box-shadow:0 4px 12px rgba(15,23,42,.04);
}

.scada-cargando{
  width:100%;
  padding:18px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:12px;
  color:var(--texto);
  font-size:12px;
  font-weight:900;
  text-align:center;
}

.scada-actualizacion{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  width:100%;
  margin:0;
  padding:3px 5px 12px;
  color:#000;
  font-size:12px;
  line-height:1.3;
}

.scada-actualizacion strong,
.scada-actualizacion span{
  color:#000;
}

.scada-separador-principal{
  width:100%;
  height:1px;
  margin:0 0 14px;
  background:var(--borde);
}

.scada-titulo-principal{
  display:block;
  width:100%;
  margin:0 0 16px;
  padding:0 5px;
  color:#1764d8;
  font-size:18px;
  line-height:1.25;
  font-weight:900;
  text-align:center;
  text-transform:uppercase;
}

.scada-listado{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
}

.scada-grupo{
  width:100%;
  min-width:0;
  overflow:hidden;
  background:var(--fondo-suave);
  border:1px solid var(--borde);
  border-radius:12px;
  box-shadow:0 3px 10px rgba(15,23,42,.04);
}

.scada-grupo-cabecera{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  min-height:44px;
  padding:8px 12px;
  background:linear-gradient(90deg,var(--azul-scada) 0%,var(--azul-scada-2) 52%,var(--azul-scada) 100%);
  border:0;
  border-radius:0;
  color:var(--blanco);
  font-family:Arial,Helvetica,sans-serif;
  text-align:left;
  cursor:pointer;
}

.scada-grupo-titulo{
  flex:1;
  min-width:0;
  color:var(--blanco);
  font-size:14px;
  line-height:1.15;
  font-weight:900;
  letter-spacing:.15px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.scada-grupo-resumen{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-shrink:0;
  gap:7px;
}


.scada-grupo-flecha{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  margin-left:1px;
  color:var(--blanco);
  font-size:24px;
  line-height:1;
  font-weight:400;
  transform:rotate(90deg);
  transition:transform .2s ease;
}

.scada-grupo-contenido{
  display:block;
  width:100%;
  padding:9px;
  background:var(--fondo-suave);
}

.scada-equipos-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:8px;
  width:100%;
}

.scada-equipo-card{
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
  min-height:82px;
  padding:7px;
  border:1px solid;
  border-radius:10px;
  box-shadow:none;
  overflow:hidden;
}

.scada-equipo-correcto{
  background:linear-gradient(135deg,#f7fff7 0%,#eaf8eb 100%);
  border-color:#72c77e;
}

.scada-equipo-alarma{
  background:linear-gradient(135deg,#fff8f8 0%,#ffe4e4 100%);
  border-color:var(--rojo-claro);
}

.scada-equipo-nombre{
  display:block;
  width:100%;
  min-height:13px;
  color:var(--texto);
  font-size:8.5px;
  line-height:1.2;
  font-weight:900;
  text-align:left;
  overflow-wrap:anywhere;
}

.scada-equipo-pk{
  display:block;
  width:100%;
  min-height:11px;
  margin-top:3px;
  color:#475569;
  font-size:7.5px;
  line-height:1.2;
  font-weight:700;
  text-align:left;
  overflow-wrap:anywhere;
}

.scada-equipo-separador{
  width:100%;
  height:1px;
  margin:5px 0 4px;
  background:rgba(22,145,38,.20);
}

.scada-equipo-alarma .scada-equipo-separador{
  background:rgba(220,38,38,.20);
}

.scada-equipo-estado{
  display:block;
  width:100%;
  margin-top:auto;
  font-size:7.5px;
  line-height:1.1;
  font-weight:900;
  text-align:left;
  text-transform:uppercase;
  overflow-wrap:anywhere;
}

.scada-estado-ok{
  color:var(--verde-texto);
}

.scada-estado-error{
  color:var(--rojo);
}

.scada-equipo-superior,
.scada-equipo-datos{
  display:contents;
}

.pendiente-panel{
  width:100%;
  padding:14px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:14px;
  box-shadow:0 4px 12px rgba(15,23,42,.04);
}

.pendiente-actualizado{
  margin-bottom:16px;
  color:var(--texto);
  font-size:12px;
  line-height:1.3;
  font-weight:900;
}

.pendiente-asunto{
  width:100%;
  margin:8px 0 20px;
  color:var(--azul);
  font-size:20px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.4px;
  text-align:center;
  text-transform:uppercase;
}

.pendiente-asunto::after{
  content:"";
  display:block;
  width:40px;
  height:3px;
  margin:9px auto 0;
  background:var(--azul);
  border-radius:999px;
}

.pendiente-listado{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.pendiente-item{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  align-items:start;
  gap:11px;
  width:100%;
  padding:12px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:12px;
  box-shadow:0 3px 8px rgba(15,23,42,.05),0 1px 2px rgba(15,23,42,.03);
}

.pendiente-numero{
  display:flex;
  align-items:center;
  justify-content:center;
  width:46px;
  min-height:46px;
  padding:6px 3px;
  color:#1764d8;
  background:linear-gradient(145deg,#f2f6ff 0%,#e5edff 100%);
  border:1px solid #dbe6ff;
  border-radius:9px;
  font-size:17px;
  line-height:1;
  font-weight:900;
  text-align:center;
}

.pendiente-contenido{
  min-width:0;
}

.pendiente-titulo-item,
.pendiente-descripcion{
  color:var(--texto);
  font-size:13px;
  line-height:1.4;
  font-weight:900;
  overflow-wrap:anywhere;
}


.pendiente-categorias{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px 16px;
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid #e2e8f0;
}

.pendiente-categoria{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  font-size:10px;
  line-height:1.2;
  font-weight:900;
  white-space:nowrap;
}

.pendiente-categoria + .pendiente-categoria::before{
  content:"•";
  margin-right:7px;
  color:#94a3b8;
  font-size:10px;
}

.pendiente-categoria-icono{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  height:auto;
  font-size:13px;
  line-height:1;
}

.categoria-comunicaciones,
.categoria-comunicaciones .pendiente-categoria-icono{
  color:#ea580c !important;
}

.categoria-mantenimiento,
.categoria-mantenimiento .pendiente-categoria-icono{
  color:var(--azul) !important;
}

.categoria-afeccion-terceros,
.categoria-afeccion-terceros .pendiente-categoria-icono{
  color:#7c3aed !important;
}

.categoria-ajeno-mantenimiento,
.categoria-ajeno-mantenimiento .pendiente-categoria-icono{
  color:var(--texto-secundario) !important;
}

.pendiente-panel .file-card{
  padding:12px;
  background:var(--fondo-suave);
  border:1px solid var(--borde);
  border-radius:10px;
  color:#475569;
  font-size:11px;
  font-weight:800;
  text-align:center;
}

.pendiente-error{
  margin-bottom:10px;
  padding:12px 14px;
  background:#fff1f2;
  border:1px solid #fecaca;
  border-radius:10px;
  color:var(--rojo);
  font-size:11px;
  line-height:1.4;
  font-weight:900;
}

@media (max-width:900px){
.login-panel{
  grid-template-columns:1fr;
}

.equipo-actions,
  .importante-actions{
  flex-direction:column;
}

#pushBtn{
  width:100%;
  margin:10px 0 12px;
  padding:10px 14px;
  border:0;
  border-radius:10px;
  background:var(--azul);
  color:var(--blanco);
  font-size:12px;
  font-weight:900;
  text-align:center;
  cursor:pointer;
  box-shadow:0 4px 10px rgba(37,99,235,.25);
}

#pushBtn:active{
  transform:scale(.98);
}
}

@media (max-width:700px){
.scada-panel{
  padding:8px;
  border-radius:12px;
}

.scada-actualizacion{
  padding:3px 3px 10px;
  font-size:10px;
}

.scada-separador-principal{
  margin-bottom:12px;
}

.scada-titulo-principal{
  margin-bottom:13px;
  padding:0 3px;
  font-size:14px;
}

.scada-listado{
  gap:9px;
}

.scada-grupo{
  border-radius:10px;
}

.scada-grupo-cabecera{
  min-height:39px;
  padding:7px 9px;
  gap:5px;
}

.scada-grupo-titulo{
  font-size:11px;
}

.scada-grupo-resumen{
  gap:4px;
}


.scada-grupo-flecha{
  width:14px;
  height:14px;
  font-size:20px;
}

.scada-grupo-contenido{
  padding:7px;
}

.scada-equipos-grid{
  gap:4px;
}

.scada-equipo-card{
  min-height:68px;
  padding:5px;
  border-radius:8px;
}

.scada-equipo-nombre{
  min-height:11px;
  font-size:7px;
}

.scada-equipo-pk{
  min-height:9px;
  margin-top:2px;
  font-size:6.2px;
}

.scada-equipo-separador{
  margin:4px 0 3px;
}

.scada-equipo-estado{
  font-size:6.2px;
}
}

@media (max-width:600px){
.pendiente-panel{
  padding:10px;
  border-radius:13px;
}

.pendiente-actualizado{
  margin-bottom:13px;
  font-size:10px;
}

.pendiente-asunto{
  margin:6px 0 16px;
  font-size:17px;
}

.pendiente-asunto::after{
  width:32px;
  height:2px;
  margin-top:8px;
}

.pendiente-listado{
  gap:8px;
}

.pendiente-item{
  grid-template-columns:40px minmax(0,1fr);
  gap:9px;
  padding:10px;
  border-radius:10px;
}

.pendiente-numero{
  width:38px;
  min-height:42px;
  padding:5px 2px;
  border-radius:8px;
  font-size:15px;
}

.pendiente-titulo-item,
  .pendiente-descripcion{
  font-size:11px;
}


.pendiente-categorias{
  gap:6px 11px;
  margin-top:8px;
  padding-top:7px;
}

.pendiente-categoria{
  gap:4px;
  font-size:8px;
}

.pendiente-categoria + .pendiente-categoria::before{
  margin-right:5px;
  font-size:8px;
}

.pendiente-categoria-icono{
  font-size:11px;
}
}

@media (max-width:500px){
.section-title-avisos{
  align-items:center;
  gap:8px;
}

.section-title-avisos h2{
  font-size:20px;
}

.section-title-avisos p{
  font-size:10px;
}

.filtro-equipo-wrap{
  gap:3px;
}

.filtro-equipo-wrap label{
  font-size:8px;
}

#filtroEquipo{
  width:105px;
  height:32px;
  padding-left:8px;
  font-size:10px;
}

.contadorAvisos{
  gap:8px;
  margin-top:10px;
  margin-bottom:10px;
}

.contador{
  min-height:78px;
  padding:7px 9px;
  border-radius:14px;
}

.contador.grave{
  min-height:76px;
}

.contador-left{
  gap:8px;
}

.contador-icon{
  flex-basis:44px;
  width:44px;
  height:44px;
  font-size:25px;
}

.contador-info{
  min-width:82px;
}

.contador-label{
  font-size:12px;
}

.contador-subtitulo{
  margin-top:2px;
  font-size:7px;
}

.contador-num{
  margin-top:4px;
  font-size:27px;
}

.contador-prioridad{
  margin-left:6px;
  padding-left:6px;
}

.contador-prioridad .titulo{
  margin-bottom:6px;
  font-size:10px;
}

.contador-prioridad .fila{
  gap:4px;
}

.prioridad-cabecera{
  gap:6px;
  font-size:11px;
}

.flecha-prioridad{
  font-size:18px;
}

.contador-num-sec{
  margin-top:4px;
  font-size:20px;
}

.separador-prioridad{
  height:32px;
  min-height:32px;
}

.scada-panel{
  padding:6px;
}

.scada-actualizacion{
  font-size:9px;
}

.scada-titulo-principal{
  margin-bottom:11px;
  font-size:12px;
}

.scada-grupo-cabecera{
  min-height:36px;
  padding:6px 7px;
}

.scada-grupo-titulo{
  font-size:9px;
}


.scada-grupo-flecha{
  width:12px;
  font-size:17px;
}

.scada-grupo-contenido{
  padding:4px;
}

.scada-equipos-grid{
  gap:3px;
}

.scada-equipo-card{
  min-height:58px;
  padding:4px;
  border-radius:7px;
}

.scada-equipo-nombre{
  min-height:9px;
  font-size:5.9px;
}

.scada-equipo-pk{
  min-height:8px;
  margin-top:1px;
  font-size:5.1px;
}

.scada-equipo-separador{
  margin:3px 0 2px;
}

.scada-equipo-estado{
  font-size:5.2px;
}
}

@media (max-width:380px){
.section-title-avisos{
  gap:6px;
}

.section-title-avisos h2{
  font-size:18px;
}

.section-title-avisos p{
  font-size:9px;
}

#filtroEquipo{
  width:96px;
  height:30px;
  font-size:9px;
}

.contador{
  min-height:74px;
  padding:6px 7px;
}

.contador.grave{
  min-height:72px;
}

.contador-icon{
  flex-basis:40px;
  width:40px;
  height:40px;
  font-size:23px;
}

.contador-info{
  min-width:74px;
}

.contador-label{
  font-size:11px;
}

.contador-subtitulo{
  font-size:6px;
}

.contador-num{
  font-size:25px;
}

.contador-prioridad{
  margin-left:4px;
  padding-left:4px;
}

.contador-prioridad .titulo{
  margin-bottom:5px;
  font-size:9px;
}

.prioridad-cabecera{
  gap:2px;
  font-size:10px;
}

.flecha-prioridad{
  font-size:16px;
}

.contador-num-sec{
  font-size:18px;
}

.separador-prioridad{
  height:29px;
  min-height:29px;
}

.scada-panel{
  padding:5px;
}

.scada-titulo-principal{
  font-size:11px;
}

.scada-grupo-cabecera{
  padding:5px 6px;
}

.scada-grupo-titulo{
  font-size:8px;
}


.scada-equipos-grid{
  gap:2px;
}

.scada-equipo-card{
  min-height:52px;
  padding:3px;
}

.scada-equipo-nombre{
  font-size:5.4px;
}

.scada-equipo-pk{
  font-size:4.7px;
}

.scada-equipo-estado{
  font-size:4.9px;
}

.pendiente-panel{
  padding:7px;
}

.pendiente-asunto{
  font-size:15px;
}

.pendiente-item{
  grid-template-columns:34px minmax(0,1fr);
  gap:7px;
  padding:8px;
}

.pendiente-numero{
  width:32px;
  min-height:38px;
  font-size:13px;
}

.pendiente-titulo-item,
  .pendiente-descripcion{
  font-size:10px;
}

.pendiente-categoria{
  white-space:normal;
  font-size:7px;
}

.pendiente-categoria-icono{
  font-size:10px;
}
}

body.android-app .flecha-prioridad,
body.android-app .flecha-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-size:19px !important;
  line-height:1 !important;
}

body.android-app .flecha-prioridad.flecha-alta,
body.android-app .flecha-badge.flecha-alta{
  color:#ff6a00 !important;
}

body.android-app .flecha-prioridad.flecha-baja,
body.android-app .flecha-badge.flecha-baja{
  color:#f2b900 !important;
}

body.android-app .contador-prioridad .prioridad-cabecera > span:last-child{
  color:#000 !important;
  font-size:10px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

body.android-app .prioridad-cabecera,
body.android-app .msg-badge{
  gap:6px !important;
}

body.android-app .prioridad-cabecera span:last-child,
body.android-app .msg-badge > span:not(.flecha-badge){
  margin-left:0 !important;
}

#crucesContent{
  width:100%;
  min-width:0;
}

.scada-panel{
  width:100%;
  margin:0 auto 14px;
  padding:10px;
  overflow:hidden;
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:14px;
  box-shadow:0 4px 12px rgba(15,23,42,.04);
}

.scada-actualizacion{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  width:100%;
  margin:0;
  padding:3px 5px 11px;
  color:#000000;
  font-size:11px;
  line-height:1.3;
}

.scada-actualizacion strong,
.scada-actualizacion span{
  color:#000000;
}

.scada-actualizacion strong{
  font-weight:900;
}

.scada-separador-principal{
  width:100%;
  height:1px;
  margin:0 0 14px;
  background:#dbe4f0;
}

.scada-titulo-principal{
  display:block;
  width:100%;
  margin:0 0 14px;
  padding:0 5px;
  color:#1764d8;
  font-size:15px;
  line-height:1.2;
  font-weight:900;
  text-align:center;
  text-transform:uppercase;
}

.scada-listado{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
}

.scada-grupo{
  width:100%;
  min-width:0;
  overflow:hidden;
  background:#ffffff;
  border:1px solid #dbe4f0;
  border-radius:10px;
  box-shadow:0 3px 10px rgba(15,23,42,.04);
}

.scada-grupo-cabecera{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  width:100%;
  min-height:38px;
  padding:7px 10px;
  background:linear-gradient(
    90deg,
    #dce9ff 0%,
    #edf4ff 52%,
    #dce9ff 100%
  );
  border:0;
  border-bottom:1px solid #bfd3f4;
  border-radius:0;
  color:#0b2b63;
  font-family:Arial,Helvetica,sans-serif;
  text-align:left;
  cursor:pointer;
}

.scada-grupo-titulo{
  flex:1;
  min-width:0;
  color:#0b2b63;
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:.1px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}


.scada-grupo-resumen{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-shrink:0;
  margin-left:auto;
  gap:0;
}

.scada-grupo-flecha{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  margin-left:auto;
  color:#0b2b63;
  font-size:19px;
  line-height:1;
  font-weight:400;
  transform:rotate(90deg);
  transition:transform .2s ease;
}

.scada-cabecera-cerrada .scada-grupo-flecha{
  transform:rotate(-90deg);
}

.scada-grupo-contenido{
  display:block;
  width:100%;
  padding:7px;
  background:#ffffff;
}

.scada-grupo-contenido.scada-grupo-cerrado,
.scada-grupo-cerrado{
  display:none;
}

.scada-equipos-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:6px;
  width:100%;
}

.scada-equipo-card{
  display:grid !important;
  grid-template-rows:auto auto !important;
  align-content:start !important;
  width:100%;
  min-width:0;
  min-height:0 !important;
  height:auto !important;
  padding:0 !important;
  overflow:hidden;
  border:1px solid;
  border-radius:7px;
  box-shadow:none;
}

.scada-equipo-correcto{
  background:linear-gradient(135deg,#ffffff 0%,#f6fff6 100%);
  border-color:#8acb91;
}

.scada-equipo-alarma{
  background:linear-gradient(135deg,#ffffff 0%,#fff0f0 100%);
  border-color:#ef8f8f;
}

.scada-equipo-superior{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100%;
  min-width:0;
  min-height:38px;
  margin:0 !important;
  padding:6px 5px 4px !important;
}

.scada-equipo-nombre{
  display:block;
  width:100%;
  min-height:0 !important;
  margin:0 !important;
  color:#0f234f;
  font-size:9px !important;
  line-height:1.1 !important;
  font-weight:900;
  text-align:center !important;
  white-space:normal;
  overflow-wrap:anywhere;
}

.scada-equipo-pk{
  display:block;
  width:100%;
  min-height:0 !important;
  margin:2px 0 0 !important;
  color:#5f6f8f;
  font-size:8px !important;
  line-height:1.05 !important;
  font-weight:700;
  text-align:center !important;
  white-space:normal;
  overflow-wrap:anywhere;
}

.scada-equipo-inferior{
  display:flex !important;
  flex-direction:column !important;
  width:100%;
  min-width:0;
  margin:0 !important;
  padding:0 5px 4px !important;
}

.scada-equipo-separador{
  flex:none !important;
  width:100% !important;
  height:1px !important;
  min-height:1px !important;
  margin:0 0 3px !important;
  padding:0 !important;
  background:rgba(22,145,38,.22) !important;
  border:0 !important;
}

.scada-equipo-alarma .scada-equipo-separador{
  background:rgba(220,38,38,.22) !important;
}

.scada-equipo-estado{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:14px !important;
  margin:0 !important;
  padding:0 !important;
  font-size:8.5px !important;
  line-height:1 !important;
  font-weight:900;
  text-align:center !important;
  text-transform:uppercase;
  overflow-wrap:anywhere;
}

.scada-estado-ok{
  color:#158b25;
}

.scada-estado-error{
  color:#dc2626;
}


@media (max-width:500px){
.scada-panel{
  padding:7px;
}

.scada-actualizacion{
  font-size:10px;
}

.scada-titulo-principal{
  margin-bottom:12px;
  font-size:13px;
}

.scada-listado{
  gap:9px;
}

.scada-grupo-cabecera{
  min-height:36px;
  padding:6px 8px;
}

.scada-grupo-titulo{
  font-size:11px;
}

.scada-grupo-flecha{
  width:13px;
  height:13px;
  font-size:18px;
}

.scada-grupo-contenido{
  padding:6px;
}

.scada-equipos-grid{
  gap:5px;
}

.scada-equipo-superior{
  min-height:35px;
  padding:5px 4px 3px !important;
}

.scada-equipo-nombre{
  font-size:8.5px !important;
}

.scada-equipo-pk{
  margin-top:2px !important;
  font-size:7.5px !important;
}

.scada-equipo-inferior{
  padding:0 4px 3px !important;
}

.scada-equipo-separador{
  margin-bottom:2px !important;
}

.scada-equipo-estado{
  min-height:13px !important;
  font-size:8px !important;
}
}

@media (max-width:380px){
.scada-grupo-contenido{
  padding:5px;
}

.scada-equipos-grid{
  gap:4px;
}

.scada-equipo-superior{
  min-height:33px;
  padding:4px 3px 3px !important;
}

.scada-equipo-nombre{
  font-size:8px !important;
}

.scada-equipo-pk{
  font-size:7px !important;
}

.scada-equipo-inferior{
  padding:0 3px 3px !important;
}

.scada-equipo-estado{
  font-size:7.5px !important;
}
}

.scada-actualizacion,
.scada-actualizacion strong,
.scada-actualizacion span{
  color:#000000 !important;
  font-weight:900 !important;
}

.importante-card{
  width:100%;
  margin:0 0 10px;
  padding:12px 14px;
  background:#ffffff;
  border:1px solid var(--borde);
  border-radius:12px;
  box-shadow:none;
}

.importante-fecha{
  width:100%;
  margin:0 0 12px;
  color:var(--texto);
  font-size:12px;
  line-height:1.3;
  font-weight:900;
  text-align:left;
}

.importante-asunto,
.importante-titulo,
.importante-cuerpo{
  width:100%;
  margin:0 auto 12px;
  padding:0;
  color:#1d4ed8;
  background:transparent;
  border:0;
  box-shadow:none;
  font-size:14px;
  line-height:1.3;
  font-weight:900;
  text-align:center;
  overflow-wrap:anywhere;
}

.importante-cuerpo{
  color:var(--texto);
}

.correo-importante-label{
  width:100%;
  margin:0 auto 12px;
  color:#1d4ed8;
  font-size:12px;
  line-height:1.25;
  font-weight:900;
  text-align:center;
  text-decoration:underline;
}

.importante-actions{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  gap:7px;
  margin:0 0 7px;
}

.importante-btn,
.btn-borrar-importante{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:min(100%,360px);
  min-width:0;
  height:36px;
  min-height:36px;
  margin:0 auto;
  padding:0 12px;
  border:0;
  border-radius:10px;
  color:#ffffff;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  box-shadow:none;
}

.importante-btn{
  background:var(--azul);
}

.importante-btn.descargar{
  background:var(--verde);
}

.btn-borrar-importante{
  background:var(--rojo);
}

.importante-btn:active,
.btn-borrar-importante:active{
  transform:scale(.98);
}

@media (max-width:500px){
.importante-card{
  padding:10px 11px;
  border-radius:11px;
}

.importante-fecha{
  margin-bottom:10px;
  font-size:11px;
}

.importante-asunto,
  .importante-titulo,
  .importante-cuerpo{
  margin-bottom:10px;
  font-size:13px;
  line-height:1.25;
}

.correo-importante-label{
  margin-bottom:10px;
  font-size:11px;
}

.importante-actions{
  gap:6px;
  margin-bottom:6px;
}

.importante-btn,
  .btn-borrar-importante{
  width:100%;
  border-radius:9px;
  font-size:10px;
}
}

#equiposContent{
  width:100%;
  min-width:0;
}

.equipo-card{
  width:100%;
  margin:0 0 10px;
  padding:12px 14px;
  background:#ffffff;
  border:1px solid var(--borde);
  border-radius:12px;
  box-shadow:none;
}

.equipo-actualizado{
  width:100%;
  margin:0 0 11px;
  color:var(--texto);
  font-size:12px;
  line-height:1.25;
  font-weight:900;
  text-align:left;
}

.equipo-asunto{
  width:100%;
  margin:0 auto 12px;
  padding:0;
  color:#1d4ed8;
  font-size:14px;
  line-height:1.3;
  font-weight:900;
  text-align:center;
  overflow-wrap:anywhere;
}

.equipo-actions{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  width:100%;
  gap:7px;
  margin:0;
}

.equipo-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:min(100%,360px);
  min-width:0;
  height:36px;
  min-height:36px;
  margin:0 auto;
  padding:0 12px;
  border:0;
  border-radius:10px;
  color:#ffffff;
  font-size:11px;
  line-height:1;
  font-weight:900;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  box-shadow:none;
}

.equipo-btn{
  background:var(--azul);
}

.equipo-btn.descargar{
  background:var(--verde);
}

.equipo-btn:active{
  transform:scale(.98);
}

@media (max-width:500px){
.equipo-card{
  padding:10px 11px;
  border-radius:11px;
}

.equipo-actualizado{
  margin-bottom:10px;
  font-size:11px;
}

.equipo-asunto{
  margin-bottom:10px;
  font-size:13px;
  line-height:1.25;
}

.equipo-actions{
  gap:6px;
}

.equipo-btn{
  width:100%;
  border-radius:9px;
  font-size:10px;
}
}

#chat{
  width:100%;
  min-width:0;
}

.msg{
  width:100%;
  margin:0 0 9px;
  padding:7px;
  background:#ffffff;
  border:1px solid var(--borde);
  border-radius:12px;
  box-shadow:none;
}

.msg-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:2px 5px 6px;
}

.msg-equipo{
  min-width:0;
  color:var(--azul);
  font-size:13px;
  line-height:1.1;
  font-weight:900;
  overflow-wrap:anywhere;
}

.msg-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-shrink:0;
  min-width:54px;
  min-height:24px;
  padding:0 9px !important;
  background:#fff2dc !important;
  border:1px solid #f2c37d !important;
  border-radius:999px !important;
  color:#9a5200 !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center;
  white-space:nowrap;
  box-shadow:none !important;
}

.msg-badge > span:not(.flecha-badge){
  color:inherit !important;
  font-size:inherit !important;
  font-weight:900 !important;
}

.msg-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  width:100%;
  padding:2px 10px;
  background:#ffffff;
  border:1px solid #eef2f7;
  border-radius:10px;
}

.msg-item{
  display:flex;
  align-items:center;
  min-width:0;
  gap:7px;
  padding:7px 0;
  border-bottom:1px solid #e5e7eb;
}

.msg-item:nth-child(1),
.msg-item:nth-child(3){
  padding-right:10px;
  border-right:1px solid #e5e7eb;
}

.msg-item:nth-child(2),
.msg-item:nth-child(4){
  padding-left:10px;
}

.msg-item.full{
  grid-column:1 / -1;
}

.msg-item:last-child{
  border-bottom:0;
}

.msg-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 28px;
  width:28px;
  height:28px;
  background:#f1f5ff;
  border-radius:7px;
  color:var(--azul);
  font-size:14px;
}

.msg-label{
  margin:0 0 2px;
  color:var(--texto-secundario);
  font-size:8px;
  line-height:1;
  font-weight:900;
}

.msg-value{
  color:var(--texto);
  font-size:10px;
  line-height:1.25;
  font-weight:900;
  overflow-wrap:anywhere;
}

.lecturas-admin{
  margin-top:8px;
  padding:8px 10px;
  border-radius:9px;
  font-size:10px;
}

.lecturas-admin .msg-label{
  margin-bottom:4px;
  font-size:9px;
}

.lectura-ok,
.lectura-pendiente{
  margin-top:3px;
  font-size:10px;
}

.btn-borrar-incidencia{
  width:min(100%,360px);
  min-height:34px;
  margin:8px auto 0;
  padding:0 12px;
  border-radius:9px;
  font-size:10px;
}

@media (max-width:500px){
.msg{
  margin-bottom:8px;
  padding:6px;
  border-radius:11px;
}

.msg-top{
  padding:2px 4px 5px;
}

.msg-equipo{
  font-size:12px;
}

.msg-badge{
  min-width:50px;
  min-height:22px;
  padding:0 8px !important;
  font-size:9px !important;
}

.msg-grid{
  padding:2px 8px;
  border-radius:9px;
}

.msg-item{
  gap:6px;
  padding:6px 0;
}

.msg-item:nth-child(1),
  .msg-item:nth-child(3){
  padding-right:8px;
}

.msg-item:nth-child(2),
  .msg-item:nth-child(4){
  padding-left:8px;
}

.msg-icon{
  flex-basis:25px;
  width:25px;
  height:25px;
  border-radius:6px;
  font-size:12px;
}

.msg-label{
  font-size:7px;
}

.msg-value{
  font-size:9px;
  line-height:1.2;
}

.lecturas-admin{
  margin-top:7px;
  padding:7px 8px;
  font-size:9px;
}

.lectura-ok,
  .lectura-pendiente{
  font-size:9px;
}

.btn-borrar-incidencia{
  min-height:32px;
  margin-top:7px;
  font-size:9px;
}
}

@media (max-width:380px){
.msg-grid{
  padding:2px 6px;
}

.msg-item{
  gap:5px;
}

.msg-item:nth-child(1),
  .msg-item:nth-child(3){
  padding-right:6px;
}

.msg-item:nth-child(2),
  .msg-item:nth-child(4){
  padding-left:6px;
}

.msg-icon{
  flex-basis:23px;
  width:23px;
  height:23px;
  font-size:11px;
}

.msg-label{
  font-size:6.5px;
}

.msg-value{
  font-size:8.3px;
}
}

.msg-badge{
  background:#fff2dc !important;
  border:1px solid #f59e0b !important;
  color:#b45309 !important;
}

.msg-badge.prioridad-baja,
.msg-badge[data-prioridad="BAJA"]{
  background:#fff9d6 !important;
  border-color:#eab308 !important;
  color:#a16207 !important;
}

.msg-badge.prioridad-alta,
.msg-badge[data-prioridad="ALTA"]{
  background:#fff2dc !important;
  border-color:#f59e0b !important;
  color:#b45309 !important;
}

.msg-badge.prioridad-urgente,
.msg-badge[data-prioridad="URGENTE"]{
  background:#ffe5e5 !important;
  border-color:#ef4444 !important;
  color:#b91c1c !important;
}

.msg-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  min-width:68px !important;
  min-height:24px !important;
  padding:0 10px !important;
  border-width:1px !important;
  border-style:solid !important;
  border-radius:999px !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}

.msg-badge::before{
  content:"";
  display:inline-block;
  flex:0 0 8px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 0 2px rgba(255,255,255,.7);
}

.msg-badge .flecha-badge{
  display:none !important;
}

.msg-badge.prioridad-baja,
.msg-badge[data-prioridad="BAJA"]{
  background:#fff9d6 !important;
  border-color:#e5bd12 !important;
  color:#8a6a00 !important;
}

.msg-badge.prioridad-baja::before,
.msg-badge[data-prioridad="BAJA"]::before{
  background:#facc15 !important;
}

.msg-badge.prioridad-alta,
.msg-badge[data-prioridad="ALTA"]{
  background:#fff1e6 !important;
  border-color:#f59e0b !important;
  color:#a94f00 !important;
}

.msg-badge.prioridad-alta::before,
.msg-badge[data-prioridad="ALTA"]::before{
  background:#f97316 !important;
}

.msg-badge.prioridad-urgente,
.msg-badge[data-prioridad="URGENTE"]{
  background:#ffe8e8 !important;
  border-color:#ef4444 !important;
  color:#b91c1c !important;
}

.msg-badge.prioridad-urgente::before,
.msg-badge[data-prioridad="URGENTE"]::before{
  background:#ef4444 !important;
}

@media (max-width:500px){
.msg-badge{
  min-width:62px !important;
  min-height:22px !important;
  padding:0 8px !important;
  gap:5px !important;
  font-size:9px !important;
}

.msg-badge::before{
  flex-basis:7px;
  width:7px;
  height:7px;
}
}

#pushBtn{
  width:100% !important;
  min-height:42px !important;
  margin:8px 0 10px !important;
  padding:0 14px !important;
  border-radius:11px !important;
  font-size:13px !important;
  font-weight:900 !important;
  box-shadow:0 4px 10px rgba(37,99,235,.18) !important;
}

.section-title-avisos{
  align-items:center !important;
  gap:10px !important;
  margin-bottom:8px !important;
}

.section-title-avisos h2{
  margin:0 0 2px !important;
  font-size:20px !important;
  line-height:1.05 !important;
}

.section-title-avisos p{
  font-size:10px !important;
}

.filtro-equipo-wrap{
  gap:3px !important;
}

.filtro-equipo-wrap label{
  font-size:8px !important;
}

#filtroEquipo{
  width:104px !important;
  height:32px !important;
  padding:0 26px 0 9px !important;
  border-radius:9px !important;
  font-size:10px !important;
}

.contador{
  min-height:72px !important;
  padding:7px 10px !important;
  border-radius:14px !important;
  box-shadow:0 5px 12px rgba(15,23,42,.10) !important;
}

.contador.normal{
  min-height:72px !important;
}

.contador-left{
  gap:8px !important;
}

.contador-icon{
  flex-basis:42px !important;
  width:42px !important;
  height:42px !important;
  font-size:24px !important;
}

.contador-info{
  min-width:78px !important;
}

.contador-label{
  font-size:11px !important;
}

.contador-subtitulo{
  margin-top:2px !important;
  font-size:7px !important;
}

.contador-num{
  margin-top:3px !important;
  font-size:25px !important;
}

.contador-prioridad{
  margin-left:6px !important;
  padding-left:7px !important;
}

.contador-prioridad .titulo{
  margin-bottom:5px !important;
  font-size:9px !important;
}

.prioridad-item{
  font-size:7px !important;
}

.prioridad-cabecera{
  gap:4px !important;
  font-size:9px !important;
}

.flecha-prioridad{
  width:21px !important;
  height:21px !important;
  padding:0 !important;
  border-radius:6px !important;
  font-size:14px !important;
  line-height:1 !important;
}

.flecha-prioridad.flecha-alta{
  color:#ffffff !important;
  background:#f59e0b !important;
}

.flecha-prioridad.flecha-baja{
  color:#7a5d00 !important;
  background:#facc15 !important;
}

.contador-num-sec{
  margin-top:3px !important;
  font-size:18px !important;
}

.separador-prioridad{
  height:30px !important;
  min-height:30px !important;
}

.contador.grave{
  min-height:68px !important;
  padding:7px 10px !important;
  border-radius:14px !important;
  background:linear-gradient(
    135deg,
    #ffe8e8 0%,
    #ffcfcf 55%,
    #ffbcbc 100%
  ) !important;
  border:1px solid #ff8f8f !important;
}

.contador.grave .contador-icon{
  color:#ef1f2f !important;
}

.contador.grave .contador-label{
  font-size:11px !important;
}

.contador.grave .contador-subtitulo{
  font-size:7px !important;
}

.contador.grave .contador-num{
  font-size:25px !important;
}

@media (max-width:500px){

#pushBtn{
  min-height:40px !important;
  font-size:12px !important;
}

.section-title-avisos h2{
  font-size:18px !important;
}

.section-title-avisos p{
  font-size:9px !important;
}

#filtroEquipo{
  width:98px !important;
  height:30px !important;
  font-size:9px !important;
}

.contador{
  min-height:68px !important;
  padding:6px 8px !important;
}

.contador-icon{
  flex-basis:38px !important;
  width:38px !important;
  height:38px !important;
  font-size:22px !important;
}

.contador-info{
  min-width:72px !important;
}

.contador-label{
  font-size:10px !important;
}

.contador-subtitulo{
  font-size:6.5px !important;
}

.contador-num{
  font-size:23px !important;
}

.contador-prioridad .titulo{
  font-size:8px !important;
}

.prioridad-cabecera{
  font-size:8px !important;
}

.flecha-prioridad{
  width:19px !important;
  height:19px !important;
  font-size:12px !important;
}

.contador-num-sec{
  font-size:17px !important;
}

.contador.grave{
  min-height:64px !important;
}
}

.contador-prioridad .prioridad-cabecera{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  min-width:72px !important;
  min-height:24px !important;
  padding:0 10px !important;
  border:1px solid !important;
  border-radius:999px !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
  white-space:nowrap !important;
  box-shadow:none !important;
}

.contador-prioridad .prioridad-cabecera::before{
  content:"";
  display:inline-block;
  flex:0 0 8px;
  width:8px;
  height:8px;
  border-radius:50%;
  box-shadow:0 0 0 2px rgba(255,255,255,.72);
}

.contador-prioridad
.prioridad-item:first-child
.prioridad-cabecera{
  background:#fff1e6 !important;
  border-color:#f59e0b !important;
  color:#a94f00 !important;
}

.contador-prioridad
.prioridad-item:last-child
.prioridad-cabecera{
  background:#fff9d6 !important;
  border-color:#e5bd12 !important;
  color:#8a6a00 !important;
}

.contador-prioridad .prioridad-item{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
}

.contador-prioridad .contador-num-sec{
  margin-top:2px !important;
  color:#050505 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.contador-prioridad .separador-prioridad{
  width:1px !important;
  height:34px !important;
  min-height:34px !important;
  background:rgba(255,255,255,.95) !important;
}

@media (max-width:500px){
.contador-prioridad .prioridad-cabecera{
  min-width:64px !important;
  min-height:22px !important;
  padding:0 8px !important;
  gap:5px !important;
  font-size:9px !important;
}

.contador-prioridad .prioridad-cabecera::before{
  flex-basis:7px;
  width:7px;
  height:7px;
}


.contador-prioridad .separador-prioridad{
  height:31px !important;
  min-height:31px !important;
}
}

#pushBtn{
  display:block;
  width:min(100%,520px) !important;
  min-height:42px !important;
  height:42px !important;
  margin:8px auto 12px !important;
  padding:0 16px !important;
  background:#2563eb !important;
  border:0 !important;
  border-radius:13px !important;
  color:#ffffff !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
  box-shadow:0 4px 10px rgba(37,99,235,.18) !important;
}

#pushBtn:active{
  transform:scale(.98);
}

.contador.normal{
  min-height:76px !important;
  padding:8px 10px !important;
  background:linear-gradient(
    105deg,
    #eef3f8 0%,
    #f6f1e7 52%,
    #fff9df 100%
  ) !important;
  border:1px solid #d6dde7 !important;
  border-radius:15px !important;
}

.contador.normal .contador-icon{
  flex:0 0 44px !important;
  width:44px !important;
  height:44px !important;
  background:#ffffff !important;
  color:#8b94a3 !important;
  border-radius:50% !important;
  font-size:25px !important;
  line-height:1 !important;
}

.contador-prioridad{
  margin-left:7px !important;
  padding-left:8px !important;
  border-left:1px solid rgba(148,163,184,.35) !important;
}

.contador-prioridad .titulo{
  margin-bottom:6px !important;
  color:#111827 !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.contador-prioridad .fila{
  grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr) !important;
  gap:6px !important;
}

.contador-prioridad .prioridad-item{
  min-height:50px !important;
  padding:5px 4px !important;
  border:1px solid !important;
  border-radius:11px !important;
}

.contador-prioridad .prioridad-item:first-child{
  background:#fff1e6 !important;
  border-color:#f59e0b !important;
}

.contador-prioridad .prioridad-item:last-child{
  background:#fff9d6 !important;
  border-color:#e5bd12 !important;
}

.contador-prioridad .prioridad-cabecera{
  min-width:0 !important;
  min-height:auto !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-size:9px !important;
}

.contador-prioridad
.prioridad-item:first-child
.prioridad-cabecera{
  color:#a94f00 !important;
}

.contador-prioridad
.prioridad-item:first-child
.prioridad-cabecera::before{
  background:#f97316 !important;
}

.contador-prioridad
.prioridad-item:last-child
.prioridad-cabecera{
  color:#8a6a00 !important;
}

.contador-prioridad
.prioridad-item:last-child
.prioridad-cabecera::before{
  background:#facc15 !important;
}

.contador-prioridad .prioridad-cabecera::before{
  flex:0 0 7px !important;
  width:7px !important;
  height:7px !important;
  box-shadow:0 0 0 2px rgba(255,255,255,.72) !important;
}

.contador-prioridad .contador-num-sec{
  margin-top:4px !important;
  color:#111827 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.contador-prioridad .separador-prioridad{
  width:1px !important;
  height:38px !important;
  min-height:38px !important;
  background:rgba(148,163,184,.35) !important;
}

.contador.grave{
  min-height:76px !important;
  padding:8px 10px !important;
  background:linear-gradient(
    105deg,
    #fff0f0 0%,
    #ffd6d6 58%,
    #ffc2c2 100%
  ) !important;
  border:1px solid #ff8585 !important;
  border-radius:15px !important;
}

.contador.grave .contador-icon{
  flex:0 0 44px !important;
  width:44px !important;
  height:44px !important;
  background:#ffffff !important;
  color:#ef1f2f !important;
  border-radius:50% !important;
  font-size:25px !important;
  line-height:1 !important;
}

.contador.normal .contador-label,
.contador.grave .contador-label{
  font-size:11px !important;
}

.contador.normal .contador-subtitulo,
.contador.grave .contador-subtitulo{
  font-size:7px !important;
}

.contador.normal .contador-num,
.contador.grave .contador-num{
  font-size:25px !important;
}

@media (max-width:500px){
#pushBtn{
  width:min(100%,420px) !important;
  min-height:38px !important;
  height:38px !important;
  margin:7px auto 10px !important;
  padding:0 13px !important;
  border-radius:12px !important;
  font-size:11px !important;
}

.contador.normal,
  .contador.grave{
  min-height:70px !important;
  padding:7px 8px !important;
}

.contador.normal .contador-icon,
  .contador.grave .contador-icon{
  flex-basis:40px !important;
  width:40px !important;
  height:40px !important;
  font-size:23px !important;
}

.contador-prioridad{
  margin-left:6px !important;
  padding-left:6px !important;
}

.contador-prioridad .prioridad-item{
  min-height:46px !important;
  padding:4px 3px !important;
  border-radius:10px !important;
}


.contador-prioridad .contador-num-sec{
  font-size:17px !important;
}

.contador-prioridad .separador-prioridad{
  height:34px !important;
  min-height:34px !important;
}
}

.contadorAvisos{
  gap:6px !important;
  margin:7px 0 9px !important;
}

.contador{
  min-height:58px !important;
  padding:5px 8px !important;
  border-radius:12px !important;
  box-shadow:0 3px 8px rgba(15,23,42,.08) !important;
}

.contador.normal,
.contador.grave{
  min-height:58px !important;
  height:auto !important;
  padding:5px 8px !important;
}

.contador.normal .contador-icon,
.contador.grave .contador-icon{
  flex:0 0 34px !important;
  width:34px !important;
  height:34px !important;
  font-size:20px !important;
  box-shadow:0 2px 6px rgba(15,23,42,.07) !important;
}

.contador-left{
  gap:6px !important;
}

.contador-info{
  min-width:66px !important;
}

.contador-label{
  font-size:9.5px !important;
  line-height:1 !important;
}

.contador-subtitulo{
  margin-top:1px !important;
  font-size:6px !important;
  line-height:1 !important;
}

.contador-num{
  margin-top:2px !important;
  font-size:21px !important;
  line-height:.9 !important;
}

.contador-prioridad{
  margin-left:5px !important;
  padding-left:6px !important;
}

.contador-prioridad .titulo{
  margin-bottom:3px !important;
  font-size:8px !important;
  line-height:1 !important;
}

.contador-prioridad .fila{
  gap:4px !important;
}

.contador-prioridad .prioridad-item{
  min-height:38px !important;
  padding:3px !important;
  border-radius:9px !important;
}

.contador-prioridad .prioridad-cabecera{
  gap:4px !important;
  font-size:7.5px !important;
}

.contador-prioridad .prioridad-cabecera::before{
  flex-basis:6px !important;
  width:6px !important;
  height:6px !important;
}

.contador-prioridad .contador-num-sec{
  margin-top:2px !important;
  font-size:15px !important;
  line-height:1 !important;
}

.contador-prioridad .separador-prioridad{
  height:28px !important;
  min-height:28px !important;
}

@media (max-width:500px){
.contadorAvisos{
  gap:5px !important;
  margin:6px 0 8px !important;
}

.contador,
  .contador.normal,
  .contador.grave{
  min-height:54px !important;
  padding:4px 7px !important;
  border-radius:11px !important;
}

.contador.normal .contador-icon,
  .contador.grave .contador-icon{
  flex-basis:32px !important;
  width:32px !important;
  height:32px !important;
  font-size:18px !important;
}

.contador-info{
  min-width:61px !important;
}


.contador-num{
  font-size:19px !important;
}

.contador-prioridad{
  margin-left:4px !important;
  padding-left:5px !important;
}

.contador-prioridad .titulo{
  margin-bottom:2px !important;
  font-size:7px !important;
}

.contador-prioridad .prioridad-item{
  min-height:35px !important;
  padding:2px 3px !important;
  border-radius:8px !important;
}

.contador-prioridad .prioridad-cabecera{
  gap:3px !important;
  font-size:7px !important;
}

.contador-prioridad .prioridad-cabecera::before{
  flex-basis:5px !important;
  width:5px !important;
  height:5px !important;
}

.contador-prioridad .contador-num-sec{
  font-size:14px !important;
}

.contador-prioridad .separador-prioridad{
  height:25px !important;
  min-height:25px !important;
}
}

.contadorAvisos{
  gap:7px !important;
  margin:8px 0 10px !important;
}

.contador{
  min-height:64px !important;
  padding:8px 10px !important;
  border-radius:14px !important;
  box-shadow:0 3px 9px rgba(15,23,42,.08) !important;
}

.contador.normal{
  background:#f5f7fa !important;
  border:1px solid #d7dee8 !important;
}

.contador.grave{
  min-height:58px !important;
  background:linear-gradient(105deg,#fff2f2 0%,#ffdede 100%) !important;
  border:1px solid #ff8c8c !important;
}

.contador.normal .contador-icon,
.contador.grave .contador-icon{
  flex:0 0 36px !important;
  width:36px !important;
  height:36px !important;
  border-radius:50% !important;
  font-size:21px !important;
  box-shadow:0 2px 6px rgba(15,23,42,.07) !important;
}

.contador-left{
  gap:7px !important;
}

.contador-info{
  min-width:74px !important;
}

.contador-label{
  font-size:10px !important;
  line-height:1 !important;
}

.contador-subtitulo{
  margin-top:2px !important;
  font-size:6px !important;
  line-height:1 !important;
}

.contador-num{
  margin-top:2px !important;
  font-size:22px !important;
  line-height:.9 !important;
}

.contador-prioridad{
  margin-left:7px !important;
  padding-left:8px !important;
  border-left:1px solid #d6dce5 !important;
}

.contador-prioridad .titulo{
  margin-bottom:5px !important;
  color:#334155 !important;
  font-size:8px !important;
  line-height:1 !important;
}

.contador-prioridad .fila{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:14px !important;
}

.contador-prioridad .prioridad-item{
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
}

.contador-prioridad .prioridad-cabecera{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.contador-prioridad .prioridad-cabecera::before{
  content:"";
  display:inline-block;
  flex:0 0 7px !important;
  width:7px !important;
  height:7px !important;
  border-radius:50%;
  box-shadow:none !important;
}

.contador-prioridad .prioridad-item:first-child .prioridad-cabecera{
  color:#b45309 !important;
}

.contador-prioridad .prioridad-item:last-child .prioridad-cabecera{
  color:#8a6a00 !important;
}

.contador-prioridad .contador-num-sec{
  margin-top:4px !important;
  color:#111827 !important;
  font-size:17px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.contador.grave .contador-info{
  min-width:0 !important;
}

.contador.grave .contador-label{
  color:#111827 !important;
}

.contador.grave .contador-num{
  color:#111827 !important;
}

@media (max-width:500px){
.contador{
  min-height:60px !important;
  padding:7px 8px !important;
}

.contador.grave{
  min-height:56px !important;
}


.contador-info{
  min-width:68px !important;
}

.contador-label{
  font-size:9px !important;
}

.contador-subtitulo{
  font-size:5.5px !important;
}

.contador-num{
  font-size:20px !important;
}

.contador-prioridad{
  margin-left:5px !important;
  padding-left:6px !important;
}

.contador-prioridad .titulo{
  margin-bottom:4px !important;
  font-size:7px !important;
}

.contador-prioridad .fila{
  gap:10px !important;
}

.contador-prioridad .prioridad-cabecera{
  gap:4px !important;
  font-size:8px !important;
}

.contador-prioridad .prioridad-cabecera::before{
  flex-basis:6px !important;
  width:6px !important;
  height:6px !important;
}

.contador-prioridad .contador-num-sec{
  margin-top:3px !important;
  font-size:15px !important;
}
}

.contador-prioridad .fila{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
}

.prioridad-item{
  flex:1;
  background:#ffffff;
  border:1px solid #d7dee8;
  border-radius:12px;
  padding:8px 6px;
  box-shadow:0 1px 4px rgba(0,0,0,.04);
}

.prioridad-item.alta{
  border-left:4px solid #ff7a00;
}

.prioridad-item.baja{
  border-left:4px solid #f2c300;
}

.prioridad-cabecera{
  font-size:13px;
  font-weight:900;
  margin-bottom:4px;
}

.contador-num-sec{
  font-size:26px;
  font-weight:900;
  margin-top:2px;
}

.contador-prioridad .fila{
  display:flex;
  gap:12px;
  justify-content:space-between;
}

.prioridad-item{
  flex:1;
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
}

.prioridad-item .prioridad-cabecera{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:7px 18px;
  border-radius:999px;
  border:2px solid;
  background:#fff;
  font-size:13px;
  font-weight:900;
  margin:0 auto 6px;
}

.prioridad-item.alta .prioridad-cabecera{
  color:#c96a00;
  border-color:#ff9800;
}

.prioridad-item.alta .prioridad-cabecera::before{
  content:"";
  width:11px;
  height:11px;
  border-radius:50%;
  background:#ff7a00;
  display:inline-block;
}

.prioridad-item.baja .prioridad-cabecera{
  color:#b38a00;
  border-color:#f2c300;
}

.prioridad-item.baja .prioridad-cabecera::before{
  content:"";
  width:11px;
  height:11px;
  border-radius:50%;
  background:#ffd400;
  display:inline-block;
}

.contador-num-sec{
  text-align:center;
  font-size:28px;
  font-weight:900;
  color:#111827;
}

.separador-prioridad{
  display:none;
}

.contador-prioridad .fila{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:center !important;
  gap:10px !important;
}

.contador-prioridad .separador-prioridad{
  display:none !important;
}

.contador-prioridad .prioridad-item{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.contador-prioridad .prioridad-cabecera{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  min-width:76px !important;
  min-height:26px !important;
  margin:0 auto 4px !important;
  padding:0 12px !important;
  background:#ffffff !important;
  border:1.5px solid !important;
  border-radius:999px !important;
  box-shadow:none !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

.contador-prioridad .flecha-prioridad{
  display:none !important;
}

.contador-prioridad .prioridad-cabecera::before{
  content:"";
  display:inline-block !important;
  flex:0 0 8px !important;
  width:8px !important;
  height:8px !important;
  border-radius:50% !important;
  box-shadow:0 0 0 2px rgba(255,255,255,.75) !important;
}

.contador-prioridad .prioridad-item:first-child .prioridad-cabecera{
  color:#b45309 !important;
  border-color:#f59e0b !important;
}

.contador-prioridad .prioridad-item:first-child .prioridad-cabecera::before{
  background:#f97316 !important;
}

.contador-prioridad .prioridad-item:last-child .prioridad-cabecera{
  color:#8a6a00 !important;
  border-color:#e5bd12 !important;
}

.contador-prioridad .prioridad-item:last-child .prioridad-cabecera::before{
  background:#facc15 !important;
}

.contador-prioridad .contador-num-sec{
  margin:0 !important;
  color:#111827 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
}

body.android-app .contador-prioridad .flecha-prioridad{
  display:none !important;
}

body.android-app .contador-prioridad .prioridad-cabecera{
  gap:6px !important;
}

@media (max-width:500px){
.contador-prioridad .fila{
  gap:8px !important;
}

.contador-prioridad .prioridad-cabecera{
  min-width:68px !important;
  min-height:24px !important;
  padding:0 10px !important;
  font-size:9px !important;
}

.contador-prioridad .prioridad-cabecera::before{
  flex-basis:7px !important;
  width:7px !important;
  height:7px !important;
}

.contador-prioridad .contador-num-sec{
  font-size:16px !important;
}
}

.contadorAvisos{
  gap:8px !important;
  margin:8px 0 10px !important;
}

.contador.normal{
  display:grid !important;
  grid-template-columns:minmax(0,35%) minmax(0,65%) !important;
  align-items:stretch !important;
  gap:8px !important;
  width:100% !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.contador.normal .contador-left{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  width:100% !important;
  min-width:0 !important;
  min-height:68px !important;
  padding:8px 10px !important;
  background:linear-gradient(120deg,#eef2f7 0%,#e3e8ef 100%) !important;
  border:1px solid #cfd7e2 !important;
  border-radius:14px !important;
  box-shadow:0 3px 9px rgba(15,23,42,.08) !important;
}

.contador.normal .contador-prioridad{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  min-height:68px !important;
  margin:0 !important;
  padding:7px 10px !important;
  background:#ffffff !important;
  border:1px solid #d7dee8 !important;
  border-radius:14px !important;
  box-shadow:0 3px 9px rgba(15,23,42,.08) !important;
  overflow:hidden !important;
}

.contador.normal .contador-prioridad{
  border-left:1px solid #d7dee8 !important;
}

.contador.normal .contador-prioridad .titulo{
  margin:0 0 5px !important;
  color:#334155 !important;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
  text-transform:uppercase !important;
}

.contador.normal .contador-prioridad .fila{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:center !important;
  gap:8px !important;
  width:100% !important;
}

.contador.normal .prioridad-item{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.contador.normal .prioridad-cabecera{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  min-width:72px !important;
  min-height:24px !important;
  margin:0 auto 3px !important;
  padding:0 10px !important;
  background:#ffffff !important;
  border:1.5px solid !important;
  border-radius:999px !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

.contador.normal .prioridad-item:first-child .prioridad-cabecera{
  color:#b45309 !important;
  border-color:#f59e0b !important;
}

.contador.normal .prioridad-item:first-child .prioridad-cabecera::before{
  background:#f97316 !important;
}

.contador.normal .prioridad-item:last-child .prioridad-cabecera{
  color:#8a6a00 !important;
  border-color:#e5bd12 !important;
}

.contador.normal .prioridad-item:last-child .prioridad-cabecera::before{
  background:#facc15 !important;
}

.contador.normal .contador-num-sec{
  margin:0 !important;
  color:#111827 !important;
  font-size:17px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
}

.contador.normal .contador-icon{
  flex:0 0 36px !important;
  width:36px !important;
  height:36px !important;
  font-size:21px !important;
}

.contador.normal .contador-info{
  min-width:0 !important;
}

.contador.normal .contador-label{
  font-size:10px !important;
}

.contador.normal .contador-subtitulo{
  font-size:6px !important;
}

.contador.normal .contador-num{
  margin-top:2px !important;
  font-size:22px !important;
}

.contador.grave{
  min-height:68px !important;
  padding:8px 10px !important;
  border-radius:14px !important;
}

.contador.grave .contador-icon{
  flex:0 0 36px !important;
  width:36px !important;
  height:36px !important;
  font-size:21px !important;
}

.contador.grave .contador-subtitulo{
  font-size:6px !important;
}

.contador.grave .contador-num{
  margin-top:2px !important;
  font-size:22px !important;
}

@media (max-width:500px){
.contador.normal{
  grid-template-columns:minmax(0,34%) minmax(0,66%) !important;
  gap:6px !important;
}

.contador.normal .contador-left,
  .contador.normal .contador-prioridad,
  .contador.grave{
  min-height:64px !important;
}

.contador.normal .contador-left{
  padding:6px 7px !important;
  gap:5px !important;
}

.contador.normal .contador-prioridad{
  padding:6px 7px !important;
}

.contador.normal .contador-icon,
  .contador.grave .contador-icon{
  flex-basis:32px !important;
  width:32px !important;
  height:32px !important;
  font-size:19px !important;
}


.contador.normal .prioridad-cabecera{
  min-width:62px !important;
  min-height:22px !important;
  padding:0 8px !important;
  font-size:8px !important;
}


}

.contador.normal{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  align-items:stretch !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
}

.contador.normal .contador-left{
  display:flex;
  align-items:center;
  background:linear-gradient(180deg,#f2f5f8,#e8edf3) !important;
  border:1px solid #cfd8e3 !important;
  border-radius:14px !important;
  padding:10px 12px !important;
}

.contador.normal .contador-prioridad{
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:linear-gradient(180deg,#faf8f3,#f2ede2) !important;
  border:1px solid #ddd4bf !important;
  border-radius:14px !important;
  margin:0 !important;
  padding:10px 12px !important;
  border-left:none !important;
}

@media (max-width:500px){
.contador.normal{
  gap:8px !important;
}
}

.contadorAvisos{
  gap:9px !important;
  margin:9px 0 11px !important;
}

.contador.normal{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:stretch !important;
  gap:10px !important;
  width:100% !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.contador.normal .contador-left{
  position:relative;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:9px !important;
  width:100% !important;
  min-width:0 !important;
  min-height:72px !important;
  padding:10px 12px !important;
  background:linear-gradient(145deg,#f8fafc 0%,#e9eef5 100%) !important;
  border:1px solid #d6dee9 !important;
  border-radius:16px !important;
  box-shadow:0 6px 18px rgba(15,23,42,.07),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
  overflow:hidden !important;
}

.contador.normal .contador-left::after{
  content:"";
  position:absolute;
  inset:auto -18px -22px auto;
  width:66px;
  height:66px;
  border-radius:50%;
  background:rgba(148,163,184,.10);
}

.contador.normal .contador-prioridad{
  position:relative;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  min-height:72px !important;
  margin:0 !important;
  padding:9px 11px !important;
  background:linear-gradient(145deg,#fffdf8 0%,#f7f1e5 100%) !important;
  border:1px solid #e5dcc9 !important;
  border-radius:16px !important;
  box-shadow:0 6px 18px rgba(120,82,24,.07),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  overflow:hidden !important;
}

.contador.normal .contador-prioridad::after{
  content:"";
  position:absolute;
  inset:auto -20px -24px auto;
  width:72px;
  height:72px;
  border-radius:50%;
  background:rgba(245,158,11,.08);
}

.contador.normal .contador-prioridad .titulo{
  position:relative;
  z-index:1;
  margin:0 0 6px !important;
  color:#5f513c !important;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:.35px !important;
  text-align:center !important;
  text-transform:uppercase !important;
}

.contador.normal .contador-prioridad .fila{
  position:relative;
  z-index:1;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  width:100% !important;
}

.contador.normal .separador-prioridad{
  display:none !important;
}

.contador.normal .prioridad-item{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.contador.normal .prioridad-cabecera{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  min-width:72px !important;
  min-height:24px !important;
  margin:0 auto 4px !important;
  padding:0 10px !important;
  background:rgba(255,255,255,.82) !important;
  border:1px solid !important;
  border-radius:999px !important;
  backdrop-filter:blur(3px);
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

.contador.normal .flecha-prioridad{
  display:none !important;
}

.contador.normal .prioridad-cabecera::before{
  content:"";
  display:inline-block !important;
  flex:0 0 7px !important;
  width:7px !important;
  height:7px !important;
  border-radius:50% !important;
}

.contador.normal .prioridad-item:first-child .prioridad-cabecera{
  color:#b45309 !important;
  border-color:#f3a53b !important;
  box-shadow:0 2px 7px rgba(249,115,22,.10) !important;
}

.contador.normal .prioridad-item:first-child .prioridad-cabecera::before{
  background:#f97316 !important;
  box-shadow:0 0 0 3px rgba(249,115,22,.12) !important;
}

.contador.normal .prioridad-item:last-child .prioridad-cabecera{
  color:#8a6a00 !important;
  border-color:#dec44b !important;
  box-shadow:0 2px 7px rgba(250,204,21,.10) !important;
}

.contador.normal .prioridad-item:last-child .prioridad-cabecera::before{
  background:#facc15 !important;
  box-shadow:0 0 0 3px rgba(250,204,21,.14) !important;
}

.contador.normal .contador-num-sec{
  margin:0 !important;
  color:#111827 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
}

.contador.normal .contador-icon{
  position:relative;
  z-index:1;
  flex:0 0 38px !important;
  width:38px !important;
  height:38px !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(203,213,225,.8) !important;
  border-radius:50% !important;
  color:#7c8798 !important;
  font-size:22px !important;
  box-shadow:0 4px 10px rgba(15,23,42,.08) !important;
}

.contador.normal .contador-info{
  position:relative;
  z-index:1;
  min-width:0 !important;
}

.contador.normal .contador-label{
  font-size:10px !important;
  letter-spacing:.15px !important;
}

.contador.normal .contador-subtitulo{
  margin-top:2px !important;
  font-size:6px !important;
}

.contador.normal .contador-num{
  margin-top:3px !important;
  font-size:23px !important;
}

.contador.grave{
  position:relative;
  min-height:72px !important;
  padding:10px 12px !important;
  background:linear-gradient(145deg,#fff5f5 0%,#ffd9d9 100%) !important;
  border:1px solid #f59a9a !important;
  border-radius:16px !important;
  box-shadow:0 6px 18px rgba(220,38,38,.08),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
  overflow:hidden !important;
}

.contador.grave::after{
  content:"";
  position:absolute;
  inset:auto -22px -28px auto;
  width:82px;
  height:82px;
  border-radius:50%;
  background:rgba(220,38,38,.07);
}

.contador.grave .contador-icon{
  position:relative;
  z-index:1;
  flex:0 0 38px !important;
  width:38px !important;
  height:38px !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid rgba(248,113,113,.35) !important;
  color:#ef233c !important;
  font-size:22px !important;
  box-shadow:0 4px 10px rgba(220,38,38,.10) !important;
}

.contador.grave .contador-info{
  position:relative;
  z-index:1;
}

.contador.grave .contador-label{
  font-size:10px !important;
}

.contador.grave .contador-subtitulo{
  margin-top:2px !important;
  font-size:6px !important;
}

.contador.grave .contador-num{
  margin-top:3px !important;
  font-size:23px !important;
}

body.android-app .contador.normal .flecha-prioridad{
  display:none !important;
}

@media (max-width:500px){
.contador.normal{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:7px !important;
}

.contador.normal .contador-left,
  .contador.normal .contador-prioridad,
  .contador.grave{
  min-height:66px !important;
}

.contador.normal .contador-left{
  padding:8px 9px !important;
  gap:6px !important;
}

.contador.normal .contador-prioridad{
  padding:7px 8px !important;
}

.contador.normal .contador-icon,
  .contador.grave .contador-icon{
  flex-basis:34px !important;
  width:34px !important;
  height:34px !important;
  font-size:20px !important;
}

.contador.normal .contador-label,
  .contador.grave .contador-label{
  font-size:9px !important;
}

.contador.normal .contador-subtitulo,
  .contador.grave .contador-subtitulo{
  font-size:5.5px !important;
}

.contador.normal .contador-num,
  .contador.grave .contador-num{
  font-size:20px !important;
}

.contador.normal .contador-prioridad .titulo{
  margin-bottom:4px !important;
  font-size:7px !important;
}

.contador.normal .prioridad-cabecera{
  min-width:60px !important;
  min-height:22px !important;
  padding:0 7px !important;
  gap:4px !important;
  font-size:8px !important;
}

.contador.normal .prioridad-cabecera::before{
  flex-basis:6px !important;
  width:6px !important;
  height:6px !important;
}

.contador.normal .contador-num-sec{
  font-size:15px !important;
}
}

#pushBtn{
  display:block !important;
  width:min(72%,420px) !important;
  min-height:34px !important;
  height:34px !important;
  margin:7px auto 10px !important;
  padding:0 14px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
  line-height:1 !important;
  box-shadow:0 3px 8px rgba(37,99,235,.16) !important;
}

@media (max-width:500px){

#pushBtn{
  width:min(76%,360px) !important;
  min-height:32px !important;
  height:32px !important;
  margin:6px auto 9px !important;
  padding:0 11px !important;
  font-size:9.5px !important;
}
}


#pushBtn{
  width:min(72%,420px) !important;
  min-height:34px !important;
  height:34px !important;
  margin:7px auto 9px !important;
  padding:0 14px !important;
  border-radius:10px !important;
  font-size:10.5px !important;
  line-height:1 !important;
  box-shadow:0 3px 8px rgba(37,99,235,.16) !important;
}

#pushBtn[style*="display: none"]{
  display:none !important;
}

@media (max-width:500px){

#pushBtn{
  width:min(76%,360px) !important;
  min-height:32px !important;
  height:32px !important;
  margin:6px auto 8px !important;
  padding:0 11px !important;
  font-size:9.5px !important;
}
}

@media (max-width:380px){

#pushBtn{
  width:82% !important;
}
}

#pushBtn{
  display:none !important;
}

body.sesion-iniciada #pushBtn[style*="display: inline-block"],
body.sesion-iniciada #pushBtn[style*="display:inline-block"],
body.sesion-iniciada #pushBtn[style*="display: block"],
body.sesion-iniciada #pushBtn[style*="display:block"]{
  display:block !important;
}

#pushBtn[style*="display: none"],
#pushBtn[style*="display:none"]{
  display:none !important;
}

body{
  padding-bottom:calc(64px + env(safe-area-inset-bottom));
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid rgba(37,99,235,.35);
  outline-offset:2px;
}

@media (prefers-reduced-motion:reduce){
*,
  *::before,
  *::after{
  scroll-behavior:auto !important;
  transition-duration:.01ms !important;
  animation-duration:.01ms !important;
  animation-iteration-count:1 !important;
}
}


.equipos-adicionales-estado.guardado{
  color:var(--verde);
}

.equipos-adicionales-estado.error{
  color:var(--rojo);
}

.equipos-adicionales-vacio,
.config-error{
  grid-column:1 / -1;
  padding:9px;
  color:var(--texto-secundario);
  font-size:10px;
  font-weight:800;
  text-align:center;
}


/* =========================================================
   ZONAS SEGURAS UNIVERSALES
   PWA, navegador móvil, iOS y Android/Capacitor
========================================================= */

:root{
  --safe-top:env(safe-area-inset-top,0px);
  --safe-right:env(safe-area-inset-right,0px);
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --safe-left:env(safe-area-inset-left,0px);
  --alto-menu-inferior:54px;
  --separacion-superior:8px;
}

html{
  width:100%;
  min-height:100%;
  background:var(--blanco,#fff);
}

body,
body.android-app{
  width:100%;
  min-height:100vh;
  min-height:100dvh;
  margin:0;
  padding:
    0
    var(--safe-right)
    calc(var(--alto-menu-inferior) + var(--safe-bottom) + 4px)
    var(--safe-left) !important;
  overflow-x:hidden;
}

.app-shell,
body.android-app .app-shell{
  padding-right:max(10px,var(--safe-right)) !important;
  padding-left:max(10px,var(--safe-left)) !important;
}

@media(display-mode:standalone){
  body{
    min-height:100dvh;
  }
}

@supports not (padding-top:env(safe-area-inset-top)){
  :root{
    --safe-top:0px;
    --safe-right:0px;
    --safe-bottom:0px;
    --safe-left:0px;
  }
}

/* =========================================================
   CABECERA SISTEM ÚNICA v810
   - 8 px de ritmo vertical.
   - Cerrar sesión alineado con "Notificaciones ITS Valladolid".
   - Cerrar sesión / Actualizar / Centro Control: mismo tamaño.
   ========================================================= */

:root{
  --sistem-espacio-app:8px;
  --sistem-header-action-size:11px;
}

.app-header{
  width:100%;
  margin:0 0 var(--sistem-espacio-app) !important;
  padding:
    calc(env(safe-area-inset-top) + var(--sistem-espacio-app))
    10px
    0 !important;
  background:#fff;
  border:0;
  box-shadow:none;
}

/* Primera fila: marca + cerrar sesión. */
.header-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  column-gap:12px;
  width:100%;
  min-height:32px;
}

.brand{
  display:flex;
  align-items:center;
  min-width:0;
  min-height:32px !important;
  margin:0 !important;
  padding:0 !important;
}

.brand-left{
  display:flex;
  align-items:center;
  min-width:0;
  gap:8px;
}

.logo{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 32px !important;
  width:32px !important;
  height:32px !important;
  margin:0 !important;
  background:#2f66e0;
  border-radius:10px !important;
  color:#fff;
  box-shadow:0 4px 10px rgba(47,102,224,.18);
  font-size:16px !important;
  line-height:1;
  font-weight:900;
}

.brand-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}

.brand-copy h1{
  margin:0 0 1px !important;
  color:#0f172a;
  font-size:14px !important;
  line-height:1 !important;
  font-weight:900;
}

.brand-copy p{
  margin:0 !important;
  color:#64748b;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:700;
}

/*
 * Un único estilo para los tres botones superiores.
 * Así Cerrar sesión tiene exactamente el mismo tamaño que
 * Actualizar y Centro Control.
 */
.header-action{
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:0 !important;
  height:18px !important;
  min-height:18px !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-size:var(--sistem-header-action-size) !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap;
}

/* En la primera fila se apoya en la línea del subtítulo. */
body.sesion-iniciada #cerrarSesionBtn{
  display:flex !important;
  align-self:end;
  margin-bottom:0 !important;
  color:#dc2626 !important;
}

.header-action .boton-icono{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-right:4px !important;
  font-size:var(--sistem-header-action-size) !important;
  line-height:1 !important;
}

/* Segunda fila: Equipo | Actualizar | Centro Control */
.equipo-bar{
  display:none;
}

body.sesion-iniciada .equipo-bar{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center !important;
  column-gap:var(--sistem-espacio-app) !important;
  width:100%;
  height:18px !important;
  min-height:18px !important;
  margin:var(--sistem-espacio-app) 0 0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.sesion-iniciada #equipoActual{
  display:flex !important;
  align-items:center !important;
  height:18px !important;
  min-height:18px !important;
  margin:0 !important;
  padding:0 2px !important;
  color:#2f66e0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:900 !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

body.sesion-iniciada #actualizarBtn{
  display:flex !important;
  color:#2563eb !important;
}

body.sesion-iniciada #configuracionBtn{
  display:flex !important;
  color:#0f172a !important;
}

/* Responsable y normal: sin controles de administración. */
body.sesion-iniciada.rol-normal .equipo-bar,
body.sesion-iniciada.rol-responsable .equipo-bar{
  grid-template-columns:minmax(0,1fr) !important;
}

body.sesion-iniciada.rol-normal #actualizarBtn,
body.sesion-iniciada.rol-normal #configuracionBtn,
body.sesion-iniciada.rol-responsable #actualizarBtn,
body.sesion-iniciada.rol-responsable #configuracionBtn{
  display:none !important;
}

/* Antes de autenticar no existe visualmente ningún control de sesión. */
body:not(.sesion-iniciada) #cerrarSesionBtn,
body:not(.sesion-iniciada) .equipo-bar,
body:not(.sesion-iniciada) #actualizarBtn,
body:not(.sesion-iniciada) #configuracionBtn{
  display:none !important;
}

@media (max-width:420px){
  .header-top{
    column-gap:8px;
  }

  .brand-left{
    padding-right:0;
  }

  .header-action{
    font-size:var(--sistem-header-action-size) !important;
  }
}

/* =========================================================
   DOCUMENTACIÓN SISTEM 1.0 + BARRA INFERIOR DE 6 PESTAÑAS
   Orden: Avisos · Cruces · Equipos · Pendientes · Documentación · Importante
========================================================= */

.documentacion-cabecera{
  margin:4px 0 12px;
}

.documentacion-cabecera h2{
  margin:0 0 3px;
  color:var(--texto);
  font-size:22px;
  font-weight:900;
}

.documentacion-cabecera p{
  color:var(--texto-secundario);
  font-size:11px;
  font-weight:700;
}

.documentacion-busqueda input{
  width:100%;
  height:40px;
  padding:0 12px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:11px;
  color:var(--texto);
  font-size:12px;
  font-weight:700;
}

.documentacion-categorias{
  display:flex;
  gap:6px;
  margin:9px 0 12px;
  padding-bottom:2px;
  overflow-x:auto;
  scrollbar-width:none;
}

.documentacion-categorias::-webkit-scrollbar{
  display:none;
}

.documentacion-chip{
  flex:0 0 auto;
  min-height:30px;
  padding:0 10px;
  background:var(--blanco);
  border:1px solid var(--borde);
  border-radius:999px;
  color:var(--texto-secundario);
  font-size:9px;
  font-weight:900;
}

.documentacion-chip.active{
  background:#eff6ff;
  border-color:#93c5fd;
  color:var(--azul);
}

.documentacion-admin{
  margin:0 0 12px;
  padding:12px;
  background:#f8fafc;
  border:1px solid var(--borde);
  border-radius:12px;
}

.documentacion-admin h3{
  margin:0 0 9px;
  color:var(--texto);
  font-size:13px;
  font-weight:900;
}

.documentacion-admin-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr 1.2fr 72px;
  gap:7px;
}

.documentacion-admin-grid input,
.documentacion-admin-grid select,
.documentacion-admin-grid button{
  min-width:0;
  min-height:36px;
  padding:7px 9px;
  border:1px solid #cbd5e1;
  border-radius:9px;
  background:var(--blanco);
  color:var(--texto);
  font-size:10px;
  font-weight:800;
}

.documentacion-admin-grid button{
  background:var(--azul);
  border-color:var(--azul);
  color:#fff;
  cursor:pointer;
}

.documentacion-admin-grid button:disabled{
  opacity:.6;
  cursor:wait;
}

.documentacion-estado{
  min-height:14px;
  margin-top:7px;
  color:var(--texto-secundario);
  font-size:9px;
  font-weight:800;
}

.documentacion-listado{
  display:flex;
  flex-direction:column;
  gap:9px;
}


.documentacion-acciones{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:5px;
  max-width:190px;
}

.documentacion-btn{
  min-height:30px;
  padding:0 9px;
  border:0;
  border-radius:8px;
  background:var(--azul);
  color:#fff;
  font-size:8.5px;
  font-weight:900;
  cursor:pointer;
}

.documentacion-btn.descargar{
  background:var(--verde);
}

.documentacion-btn.sustituir{
  background:#475569;
}

.documentacion-btn.eliminar{
  background:var(--rojo);
}


.documentacion-vacio.error{
  color:var(--rojo);
}


@media (max-width:700px){
  .documentacion-admin-grid{
    grid-template-columns:1fr 1fr;
  }


  .documentacion-acciones{
    grid-column:1 / -1;
    justify-content:flex-start;
    max-width:none;
  }
}

@media (max-width:420px){
  .documentacion-admin-grid{
    grid-template-columns:1fr;
  }


}

/* =========================================================
   DOCUMENTOS v819 - AJUSTE PREVIO A CARGA JS
   El diseño final se completa desde app.js.
   Mantiene el menú inferior con tamaños iguales.
   ========================================================= */

/* =========================================================
   MENÚ INFERIOR v820
   Corrige la regla antigua que reducía específicamente
   "Documentos". Icono y nombre quedan EXACTAMENTE al mismo
   tamaño que el resto en escritorio y móvil.
   ========================================================= */

/* =========================================================
   DOCUMENTOS v821 - BOTONES TIPO IMPORTANTE
   Ver = azul, Descargar = verde, Eliminar = rojo.
   Apilados, ancho completo, mismo estilo en escritorio y móvil.
   ========================================================= */

#tab-documentacion .documentacion-documento-card {
  display: block !important;
}

#tab-documentacion .documentacion-documento-info {
  width: 100% !important;
  margin-bottom: 12px !important;
}

#tab-documentacion .documentacion-documento-acciones {
  display: grid !important;
  grid-template-columns: 1fr !important;
  width: 100% !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

#tab-documentacion .documentacion-documento-acciones .documentacion-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 11px 14px !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

/* VER */
#tab-documentacion .documentacion-documento-acciones
.documentacion-btn:not(.descargar):not(.documentacion-btn-eliminar) {
  background: #2563eb !important;
  color: #ffffff !important;
}

/* DESCARGAR */


/* ELIMINAR */


/* Pulsación/hover discreto */
#tab-documentacion .documentacion-documento-acciones
.documentacion-btn:hover {
  opacity: .94 !important;
}

#tab-documentacion .documentacion-documento-acciones
.documentacion-btn:active {
  transform: scale(.99) !important;
}

/* Escritorio: conserva también el aspecto apilado de Importante */
@media (min-width: 701px) {
  #tab-documentacion .documentacion-documento-acciones {
    grid-template-columns: 1fr !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    min-height: 42px !important;
    font-size: 12px !important;
  }
}

/* Móvil: mismo diseño, botones cómodos y a todo el ancho */
@media (max-width: 700px) {
  #tab-documentacion .documentacion-documento-acciones {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    min-height: 44px !important;
    font-size: 12px !important;
  }
}

/* =========================================================
   DOCUMENTOS v822 - TRES BOTONES EN LA MISMA FILA
   Más compactos que en v821.
   ========================================================= */

#tab-documentacion .documentacion-documento-acciones {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
  margin-top: 10px !important;
}

#tab-documentacion .documentacion-documento-acciones .documentacion-btn {
  min-width: 0 !important;
  min-height: 36px !important;
  padding: 8px 6px !important;
  border-radius: 9px !important;
  font-size: 10px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (max-width: 700px) {
  #tab-documentacion .documentacion-documento-acciones {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    min-height: 36px !important;
    padding: 7px 4px !important;
    font-size: 9px !important;
  }
}


/* DOCUMENTOS ZIP/RAR: mantienen la fila de 3 botones,
   pero el primer hueco indica que no existe visor interno. */


/* =========================================================
   DOCUMENTOS v824 - BOTONES COMPACTOS TIPO IMPORTANTE
   Tres botones en una sola línea, con iconos.
   Igual comportamiento en escritorio y móvil.
   ========================================================= */

#tab-documentacion .documentacion-documento-acciones {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  margin-top: 10px !important;
}

#tab-documentacion .documentacion-documento-acciones .documentacion-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 34px !important;
  padding: 7px 5px !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Ver */


/* Descargar */


/* Eliminar */


/* ZIP/RAR: no hay visor interno */


@media (max-width: 700px) {
  #tab-documentacion .documentacion-documento-acciones {
    gap: 5px !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    min-height: 34px !important;
    padding: 7px 3px !important;
    font-size: 9px !important;
  }
}

@media (max-width: 360px) {
  #tab-documentacion .documentacion-documento-acciones {
    gap: 4px !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    padding: 7px 2px !important;
    font-size: 8px !important;
  }
}

/* =========================================================
   DOCUMENTOS v825 - AJUSTE FINAL EXACTO
   - 3 botones SIEMPRE en una sola línea
   - Más pequeños
   - Menos separación entre fecha y botones
   - Iconos visibles
   ========================================================= */

#tab-documentacion .documentacion-documento-card {
  display: block !important;
  padding: 10px !important;
}

#tab-documentacion .documentacion-documento-info {
  width: 100% !important;
  margin: 0 !important;
}

#tab-documentacion .documentacion-documento-etiquetas {
  margin-bottom: 4px !important;
}

#tab-documentacion .documentacion-documento-nombre {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
}

#tab-documentacion .documentacion-documento-archivo {
  margin-top: 2px !important;
}

#tab-documentacion .documentacion-documento-fecha {
  margin-top: 3px !important;
  margin-bottom: 0 !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

#tab-documentacion .documentacion-documento-acciones {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 5px !important;
  width: 100% !important;
  margin: 6px 0 0 !important;
  padding: 0 !important;
}

#tab-documentacion .documentacion-documento-acciones .documentacion-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 0 4px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 7px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  box-shadow: none !important;
}

/* Ver */
#tab-documentacion .documentacion-documento-acciones
.documentacion-btn:not(.descargar):not(.documentacion-btn-eliminar):not(.documentacion-btn-sin-visor) {
  background: #2563eb !important;
  color: #ffffff !important;
}

/* Descargar */
#tab-documentacion .documentacion-documento-acciones
.documentacion-btn.descargar {
  background: #2f7d3f !important;
  color: #ffffff !important;
}

/* Eliminar */
#tab-documentacion .documentacion-documento-acciones
.documentacion-btn-eliminar {
  background: #dc2626 !important;
  color: #ffffff !important;
}

/* ZIP/RAR */
#tab-documentacion .documentacion-documento-acciones
.documentacion-btn-sin-visor {
  background: #e5e7eb !important;
  color: #64748b !important;
  cursor: default !important;
  pointer-events: none !important;
}

/* Móvil: mantener exactamente la misma fila de 3 */
@media (max-width: 700px) {
  #tab-documentacion .documentacion-documento-card {
    padding: 9px !important;
  }

  #tab-documentacion .documentacion-documento-acciones {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin-top: 5px !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    min-height: 29px !important;
    height: 29px !important;
    padding: 0 2px !important;
    font-size: 8.5px !important;
    border-radius: 6px !important;
  }
}

@media (max-width: 360px) {
  #tab-documentacion .documentacion-documento-acciones {
    gap: 3px !important;
  }

  #tab-documentacion .documentacion-documento-acciones .documentacion-btn {
    font-size: 8px !important;
    padding: 0 1px !important;
  }
}

/* =========================================================
   SISTEM - BARRA INFERIOR FINAL v856
   Estilo cápsula sin separadores
   PWA · iPhone · Android · escritorio
   ========================================================= */

:root{
  --sistem-nav-icono:24px;
  --sistem-nav-texto:10px;
  --sistem-nav-badge:17px;
  --sistem-nav-alto:56px;
  --sistem-nav-fondo:rgba(255,255,255,.98);
  --sistem-nav-borde:#e2e8f0;
  --sistem-nav-texto-color:#52627c;
}

body{
  padding-bottom:
    calc(
      var(--sistem-nav-alto) +
      18px +
      env(safe-area-inset-bottom, 0px)
    ) !important;
}

.bottom-nav{
  position:fixed !important;
  z-index:9999 !important;
  left:10px !important;
  right:10px !important;
  bottom:8px !important;

  display:none !important;
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  align-items:center !important;

  width:auto !important;
  height:var(--sistem-nav-alto) !important;
  min-height:var(--sistem-nav-alto) !important;
  margin:0 !important;
  padding:3px 5px !important;

  background:var(--sistem-nav-fondo) !important;
  border:1px solid var(--sistem-nav-borde) !important;
  border-radius:999px !important;
  box-shadow:
    0 5px 16px rgba(15,23,42,.11),
    0 1px 2px rgba(15,23,42,.05) !important;

  -webkit-backdrop-filter:blur(12px) !important;
  backdrop-filter:blur(12px) !important;
  overflow:visible !important;
  transform:translate3d(0, 0, 0) !important;
  transition:transform .23s ease, opacity .23s ease !important;
}

.bottom-nav.bottom-nav-oculta{
  transform:translate3d(0, calc(100% + 24px + env(safe-area-inset-bottom, 0px)), 0) !important;
  opacity:0 !important;
  pointer-events:none !important;
}

@media (prefers-reduced-motion:reduce){
  .bottom-nav{transition:none !important;}
}

.bottom-nav .bottom-tab{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;

  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:48px !important;
  min-height:48px !important;

  gap:1px !important;
  margin:0 !important;
  padding:2px 1px !important;

  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;

  color:var(--sistem-nav-texto-color) !important;
  text-align:center !important;
  overflow:visible !important;
  transform:none !important;
}


.bottom-nav .bottom-tab.active{
  background:#e8f0ff !important;
  border-radius:999px !important;
  color:#2563eb !important;
}

.bottom-nav .bottom-tab:active{
  opacity:.68 !important;
  transform:scale(.98) !important;
}

.bottom-nav .bottom-tab > .bottom-tab-icon{
  position:relative !important;
  z-index:2 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  flex:0 0 27px !important;
  width:31px !important;
  height:27px !important;
  margin:0 auto !important;
  padding:0 !important;

  font-family:
    "Apple Color Emoji",
    "Segoe UI Emoji",
    "Noto Color Emoji",
    sans-serif !important;

  font-size:var(--sistem-nav-icono) !important;
  line-height:27px !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  overflow:visible !important;
}

.bottom-nav .bottom-tab > .bottom-tab-label{
  position:relative !important;
  z-index:2 !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;

  margin:0 !important;
  padding:0 !important;

  font-family:Arial,Helvetica,sans-serif !important;
  font-size:var(--sistem-nav-texto) !important;
  line-height:12px !important;
  font-weight:800 !important;
  letter-spacing:-.08px !important;

  color:inherit !important;
  text-align:center !important;
  white-space:nowrap !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

.bottom-nav .bottom-tab > .bottom-tab-badge{
  position:absolute !important;
  z-index:30 !important;
  top:-1px !important;
  left:calc(50% + 8px) !important;
  right:auto !important;
  bottom:auto !important;

  display:flex;
  align-items:center !important;
  justify-content:center !important;

  min-width:var(--sistem-nav-badge) !important;
  width:auto !important;
  height:var(--sistem-nav-badge) !important;

  margin:0 !important;
  padding:0 4px !important;

  background:#dc2626 !important;
  border:2px solid #ffffff !important;
  border-radius:999px !important;
  box-shadow:0 2px 5px rgba(220,38,38,.28) !important;

  color:#ffffff !important;
  font-family:Arial,Helvetica,sans-serif !important;
  font-size:7.5px !important;
  line-height:1 !important;
  font-weight:900 !important;
  text-align:center !important;
  white-space:nowrap !important;
  pointer-events:none !important;
}

@supports (-webkit-touch-callout:none){
  .bottom-nav{
    bottom:
      max(
        3px,
        calc(env(safe-area-inset-bottom, 0px) - 22px)
      ) !important;
  }

  body{
    padding-bottom:
      calc(
        var(--sistem-nav-alto) +
        max(
          8px,
          calc(env(safe-area-inset-bottom, 0px) - 17px)
        )
      ) !important;
  }
}

body.android-app{
  padding-bottom:72px !important;
}

body.android-app .bottom-nav{
  left:9px !important;
  right:9px !important;
  bottom:10px !important;
}

@media (min-width:900px){
  :root{
    --sistem-nav-icono:24px;
    --sistem-nav-texto:10px;
    --sistem-nav-alto:56px;
  }

  .bottom-nav{
    left:50% !important;
    right:auto !important;
    width:min(980px, calc(100% - 40px)) !important;
    transform:translate3d(-50%, 0, 0) !important;
    bottom:12px !important;
    border-radius:34px !important;
  }

  .bottom-nav.bottom-nav-oculta{
    transform:translate3d(-50%, calc(100% + 36px), 0) !important;
  }

  .bottom-nav .bottom-tab{
    height:48px !important;
    min-height:48px !important;
  }
}

@media (max-width:390px){
  :root{
    --sistem-nav-icono:24px;
    --sistem-nav-texto:9px;
    --sistem-nav-badge:16px;
    --sistem-nav-alto:56px;
  }

  .bottom-nav{
    left:6px !important;
    right:6px !important;
    padding-left:2px !important;
    padding-right:2px !important;
  }

  .bottom-nav .bottom-tab{
    height:48px !important;
    min-height:48px !important;
  }

  .bottom-nav .bottom-tab > .bottom-tab-label{
    letter-spacing:-.18px !important;
  }

  .bottom-nav .bottom-tab > .bottom-tab-badge{
    left:calc(50% + 7px) !important;
    font-size:7px !important;
  }
}

/* Menú: mismo sistema de badges que las pestañas, sin divisores. */
.sistem-menu-panel[hidden], .sistem-menu-badge[hidden] { display:none !important; }
body:not(.sesion-iniciada) .sistem-menu-panel { display:none !important; }
.sistem-menu-panel {
  position:fixed;
  z-index:10000;
  box-sizing:border-box;
  right:14px;
  left:auto;
  bottom:calc(72px + env(safe-area-inset-bottom, 0px));
  width:max-content;
  min-width:154px;
  max-width:calc(100vw - 28px);
  margin:0;
  padding:3px 13px;
  background:#fff;
  border:1px solid #dbe4f0;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(15,23,42,.16);
}
.sistem-menu-panel::after {
  content:"";
  position:absolute;
  right:27px;
  bottom:-8px;
  width:14px;
  height:14px;
  background:#fff;
  border-right:1px solid #dbe4f0;
  border-bottom:1px solid #dbe4f0;
  transform:rotate(45deg);
}
.sistem-menu-opcion {
  display:grid;
  box-sizing:border-box;
  grid-template-columns:20px max-content;
  align-items:center;
  justify-content:center;
  column-gap:7px;
  width:100%;
  height:35px;
  min-height:35px;
  margin:0;
  padding:2px 5px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#0f172a;
  text-align:left;
  font:700 12px/1.2 Arial,Helvetica,sans-serif;
  white-space:nowrap;
  cursor:pointer;
}
.sistem-menu-panel:has(.sistem-menu-badge:not([hidden])) .sistem-menu-opcion {
  grid-template-columns:20px max-content auto;
}
.sistem-menu-panel:has(.sistem-menu-badge:not([hidden])) .sistem-menu-opcion .sistem-menu-badge[hidden] {
  display:none !important;
}
.sistem-menu-opcion > span:first-child {
  display:flex;
  align-items:center;
  justify-content:center;
  width:20px;
  font-size:18px;
  line-height:1;
}
.sistem-menu-opcion > span:nth-child(2) { justify-self:start; }
.sistem-menu-badge {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  justify-self:center;
  box-sizing:border-box;
  min-width:var(--sistem-nav-badge);
  height:var(--sistem-nav-badge);
  padding:0 4px;
  border:2px solid #fff;
  border-radius:999px;
  background:#dc2626;
  box-shadow:0 2px 5px rgba(220,38,38,.28);
  color:#fff;
  font:900 9px/1 Arial,Helvetica,sans-serif;
  text-align:center;
  white-space:nowrap;
}
.bottom-nav .bottom-tab > .sistem-menu-icon {
  width:31px !important;
  height:27px !important;
  flex:0 0 27px !important;
  font-size:0 !important;
  line-height:0 !important;
}
.bottom-nav .sistem-menu-icon::before {
  content:"";
  display:block;
  width:24px;
  height:20px;
  margin:auto;
  background:linear-gradient(to bottom,
    currentColor 0 3px,transparent 3px 8.5px,
    currentColor 8.5px 11.5px,transparent 11.5px 17px,
    currentColor 17px 20px);
  border-radius:1px;
}
@media (min-width:900px) {
  .sistem-menu-panel {
    right:max(24px,calc((100vw - min(980px, 100vw - 40px))/2 + 10px));
    bottom:76px;
  }
}

/* =========================================================
   CENTRO DE CONTROL SISTEM v857
   Solo administrador · PWA · iPhone · Android · escritorio
   ========================================================= */

body:not(.rol-admin) #panelConfiguracion{
  display:none !important;
}

#panelConfiguracion.centro-control{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.centro-control-cabecera,
.centro-bloque{
  background:#ffffff;
  border:1px solid #dbe5f1;
  border-radius:16px;
  box-shadow:0 3px 12px rgba(15,23,42,.045);
}

.centro-control-cabecera{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:0;
  padding:14px 16px;
}

.centro-control-cabecera > div:first-child{
  min-width:0;
}

.centro-control-cabecera h2{
  margin:0;
  color:#0f172a;
  font-size:22px;
  line-height:1.08;
  white-space:nowrap;
}

.centro-control-cabecera p{
  margin:4px 0 0;
  color:#64748b;
  font-size:11px;
  line-height:1.2;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.centro-control-estado{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:150px;
  padding:8px 10px;
  background:#f8fafc;
  border-left:1px solid #dbe5f1;
  border-top:0;
  border-right:0;
  border-bottom:0;
  border-radius:0;
}

.centro-control-estado span:last-child{
  display:flex;
  flex-direction:column;
  gap:1px;
  min-width:0;
}

.centro-control-estado strong{
  color:#0f172a;
  font-size:11px;
  line-height:1.1;
  white-space:nowrap;
}

.centro-control-estado small{
  color:#64748b;
  font-size:9px;
  line-height:1.1;
  white-space:nowrap;
}

.centro-punto{
  display:inline-block;
  width:11px;
  height:11px;
  flex:0 0 11px;
  border-radius:50%;
}

.centro-punto-ok{ background:#22c55e; }
.centro-punto-aviso{ background:#f59e0b; }
.centro-punto-error{ background:#ef4444; }
.centro-punto-neutro{ background:#94a3b8; }

.centro-bloque{
  padding:13px;
}

.centro-titulo-fila{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.centro-titulo-fila h3{
  margin:0;
  color:#0f172a;
  font-size:15px;
  line-height:1.2;
}

.centro-titulo-fila p{
  margin:3px 0 0;
  color:#64748b;
  font-size:11px;
}


.centro-equipos{
  margin-bottom:12px;
}

.centro-equipos-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
}

.centro-equipo-card{
  min-width:0;
  padding:10px;
  background:#f8fafc;
  border:1px solid #dbe5f1;
  border-radius:12px;
}

.centro-equipo-nombre{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:5px;
  color:#0f172a;
  font-size:13px;
  font-weight:900;
}

.centro-equipo-estado{
  margin-bottom:5px;
  font-size:11px;
  font-weight:800;
}

.centro-equipo-estado.ok{ color:#15803d; }
.centro-equipo-estado.aviso{ color:#a16207; }
.centro-equipo-estado.error{ color:#dc2626; }
.centro-equipo-estado.neutro{ color:#64748b; }

.centro-equipo-meta{
  color:#64748b;
  font-size:10px;
  line-height:1.45;
  word-break:break-word;
}


.centro-fila-dato{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:7px 0;
  border-bottom:1px solid #edf2f7;
  color:#475569;
  font-size:11px;
}

.centro-fila-dato:last-child{
  border-bottom:0;
}

.centro-fila-dato strong{
  color:#0f172a;
  font-size:12px;
}


.centro-alertas{
  margin-bottom:12px;
}

.centro-alerta{
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px 0;
  border-bottom:1px solid #edf2f7;
  color:#475569;
  font-size:11px;
}

.centro-alerta:last-child{
  border-bottom:0;
}

.centro-alerta-texto{
  min-width:0;
  flex:1 1 auto;
}


/* Aprovecha las tarjetas de usuarios ya existentes */
.centro-admin-detalle .usuarioCard{
  margin-bottom:10px;
}

/* Tablet */
@media (max-width:900px){
  .centro-equipos-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }


}

/* Móvil / PWA / Android */
@media (max-width:700px){

  .centro-control-cabecera{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    padding:11px 12px;
  }

  .centro-control-cabecera h2{
    font-size:16px;
    line-height:1.08;
    text-align:left;
    white-space:nowrap;
  }

  .centro-control-cabecera p{
    margin-top:3px;
    font-size:8.5px;
    line-height:1.15;
    text-align:left;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .centro-control-estado{
    width:auto;
    min-width:112px;
    margin-top:0;
    padding:6px 0 6px 9px;
    gap:6px;
    box-sizing:border-box;
  }

  .centro-control-estado strong{
    font-size:9px;
  }

  .centro-control-estado small{
    font-size:7.5px;
  }

  .centro-control-estado .centro-punto{
    width:9px;
    height:9px;
    flex-basis:9px;
  }

  .centro-bloque{
    padding:10px;
  }

  .centro-equipos-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
  }


  .centro-equipo-card{
    padding:9px;
  }

  .centro-titulo-fila h3{
    font-size:13px;
  }


}

@media (max-width:420px){


  .centro-equipos-grid{
    grid-template-columns:1fr 1fr;
  }
}

/* Estado Excel Centro de control */
#centroExcelEstado .centro-fila-dato strong{
  display:flex;
  align-items:flex-end;
  flex-direction:column;
  gap:1px;
}

#centroExcelEstado .centro-fila-dato strong small{
  color:#64748b;
  font-size:9px;
  font-weight:700;
}

#centroExcelEstado .centro-excel-ok{
  color:#15803d;
}

#centroExcelEstado .centro-excel-aviso{
  color:#a16207;
}

#centroExcelEstado .centro-excel-error{
  color:#dc2626;
}

#centroExcelEstado .centro-excel-neutro{
  color:#64748b;
}

/* UI SISTEM v863: Estado Excel real en Centro de control. */

/* =========================================================
   CENTRO v864 - ADMINISTRACIÓN INTEGRADA EN ESTADO EQUIPOS
   ========================================================= */

.centro-equipos .centro-titulo-fila p{
  margin:3px 0 0;
  color:#64748b;
  font-size:10px;
}

button.centro-equipo-card{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  text-align:left;
  font:inherit;
  cursor:pointer;
  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease,
    transform .15s ease;
}

button.centro-equipo-card:active{
  transform:scale(.985);
}


.centro-equipo-gestion{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid #dbe5f1;
}

.centro-equipo-gestion[hidden]{
  display:none !important;
}


.centro-equipo-gestion .usuarioCard{
  margin-bottom:10px;
}

.centro-equipo-gestion .usuarioCard[hidden]{
  display:none !important;
}

.centro-gestion-sin-usuarios{
  padding:12px;
  border-radius:10px;
  background:#f8fafc;
  color:#64748b;
  font-size:11px;
  text-align:center;
}

@media (max-width:700px){
  .centro-equipo-gestion{
    margin-left:-2px;
    margin-right:-2px;
  }


}

/* UI SISTEM v864 */

/* =========================================================
   CENTRO v867 - RESUMEN EQUIPOS + DISPOSITIVOS LIMPIO
   ========================================================= */


.centro-dispositivos-selector{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-bottom:10px;
}

.centro-dispositivos-tab{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#475569;
  padding:9px 10px;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}

.centro-dispositivos-tab.activo{
  border-color:#93c5fd;
  background:#eff6ff;
  color:#2563eb;
}

/* UI SISTEM v867 */

/* CENTRO v868 - Dispositivos sin duplicar administración de roles/equipos */
.centro-dispositivos-bloque .usuario-campo-label,
.centro-dispositivos-bloque .usuario-rol-select,
.centro-dispositivos-bloque .equipos-adicionales-panel{
  display:none !important;
}

.centro-dispositivos-bloque .centro-equipo-gestion{
  border-top:0;
  padding-top:6px;
  margin-top:4px;
}

.centro-dispositivos-bloque .centro-equipo-gestion-cabecera{
  margin-top:4px;
}

/* =========================================================
   CENTRO v869 - ROL Y EQUIPOS ADICIONALES EN ESTADO EQUIPOS
   ========================================================= */

button.centro-equipo-card{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  text-align:left;
  font:inherit;
  cursor:pointer;
}

button.centro-equipo-card.activo{
  border-color:#60a5fa;
  background:#eff6ff;
  box-shadow:0 0 0 2px rgba(37,99,235,.10);
}


/* UI SISTEM v869 */

/* =========================================================
   CENTRO v871 - ESTADO EQUIPOS CLÁSICO + DATOS ACTUALES
   ========================================================= */

.centro-equipos-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.centro-equipo-card-clasica{
  min-width:0;
  padding:10px;
  background:#f8fafc;
  border:1px solid #dbe5f1;
  border-radius:12px;
  text-align:left;
}

.centro-equipo-card-clasica .centro-equipo-nombre{
  margin-bottom:5px;
}

.centro-equipo-card-clasica .centro-equipo-estado{
  margin-bottom:5px;
  font-size:11px;
  font-weight:900;
}

.centro-equipo-card-clasica .centro-equipo-meta{
  min-height:31px;
  color:#64748b;
  font-size:10px;
  line-height:1.45;
  word-break:normal;
  overflow-wrap:anywhere;
}

.centro-equipo-extra{
  display:grid;
  gap:0;
  margin-top:7px;
  border-top:1px solid #e2e8f0;
}

.centro-equipo-extra > div{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  padding:6px 0;
  border-bottom:1px solid #e2e8f0;
}

.centro-equipo-extra > div:last-child{
  border-bottom:0;
  padding-bottom:0;
}

.centro-equipo-extra span{
  color:#64748b;
  font-size:9px;
  font-weight:700;
}

.centro-equipo-extra strong{
  max-width:58%;
  color:#0f172a;
  font-size:9px;
  font-weight:900;
  text-align:right;
  overflow-wrap:anywhere;
}

@media (max-width:520px){
  .centro-equipos-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* UI SISTEM v871 */

/* =========================================================
   CENTRO v874 - DISPOSITIVOS: USUARIO / DISPOSITIVO / ACCIONES
   ========================================================= */

.centro-dispositivos-bloque{
  margin-top:12px;
}

.centro-dispositivos-bloque .centro-titulo-fila p{
  margin:3px 0 0;
  color:#64748b;
  font-size:10px;
}

.centro-dispositivos-bloque .centro-equipo-gestion{
  margin-top:10px;
  padding-top:0;
  border-top:0;
}

.centro-dispositivos-bloque #centroDispositivosResumen{
  display:none;
}

.centro-dispositivos-selector{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  margin:10px 0 8px;
  border:1px solid #bfdbfe;
  border-radius:10px;
  overflow:hidden;
  background:#f8fafc;
}

.centro-dispositivos-tab{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  border-radius:0;
  background:transparent;
  color:#0f172a;
  padding:9px 8px;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
}

.centro-dispositivos-tab.activo{
  background:#2563eb;
  color:#fff;
}

.centro-dispositivos-bloque .usuarioCard{
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.centro-dispositivo-cabecera,
.centro-dispositivo-fila{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr) minmax(92px,.85fr);
  align-items:center;
  gap:7px;
}

.centro-dispositivo-cabecera{
  padding:7px 8px;
  border-radius:8px 8px 0 0;
  background:#f1f5f9;
  color:#64748b;
  font-size:9px;
  font-weight:900;
}

.centro-dispositivo-fila{
  padding:8px;
  border-bottom:1px solid #e2e8f0;
  background:#fff;
}

.centro-dispositivo-fila:last-child{
  border-bottom:0;
}

.centro-dispositivo-usuario{
  min-width:0;
  color:#0f172a;
  font-size:10px;
  font-weight:900;
  overflow-wrap:anywhere;
}

.centro-dispositivo-nombre{
  min-width:0;
  color:#334155;
  font-size:10px;
  overflow-wrap:anywhere;
}

.centro-dispositivo-acciones{
  display:flex;
  justify-content:flex-end;
  gap:5px;
  flex-wrap:wrap;
}

.centro-btn-eliminar-dispositivo,
.centro-btn-rechazar-dispositivo,
.centro-btn-autorizar-dispositivo{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:0;
  padding:6px 8px;
  border:0;
  border-radius:7px;
  color:#fff;
  font-size:9px;
  line-height:1.1;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:none;
}

.centro-btn-eliminar-dispositivo,
.centro-btn-rechazar-dispositivo{
  background:var(--rojo);
}

.centro-btn-autorizar-dispositivo{
  background:var(--verde);
}

.centro-btn-eliminar-dispositivo:active,
.centro-btn-rechazar-dispositivo:active,
.centro-btn-autorizar-dispositivo:active{
  transform:scale(.98);
}

.centro-dispositivos-autorizados-contenido[hidden],
.centro-dispositivos-pendientes-contenido[hidden]{
  display:none !important;
}

.estado-dispositivos-admin:empty{
  display:none;
}

@media (max-width:520px){
  .centro-dispositivo-cabecera,
  .centro-dispositivo-fila{
    grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(82px,.9fr);
    gap:5px;
  }

  .centro-dispositivo-cabecera{
    padding-left:6px;
    padding-right:6px;
  }

  .centro-dispositivo-fila{
    padding:7px 6px;
  }

  .centro-btn-eliminar-dispositivo,
  .centro-btn-rechazar-dispositivo,
  .centro-btn-autorizar-dispositivo{
    width:100%;
    padding:0 5px;
    font-size:8px;
  }
}

/* UI SISTEM v874 */

/* =========================================================
   CENTRO v893 - ESTILOS CONSOLIDADOS
   Sin parches acumulados v876-v892.
   ========================================================= */

/* ---------------------------------------------------------
   CABECERA CENTRO
   --------------------------------------------------------- */

/* Estado integrado en blanco, sin sombreado ni caja */
.centro-control-estado{
  background:#fff;
  border:0;
  box-shadow:none;
  border-radius:0;
}

/* Ajuste extra para pantallas muy estrechas */
@media (max-width:390px){
  .centro-control-cabecera{
    grid-template-columns:minmax(0,1fr) 106px;
    gap:6px;
    padding:10px;
  }

  .centro-control-cabecera h2{
    font-size:15px;
  }

  .centro-control-cabecera p{
    font-size:8px;
  }

  .centro-control-estado{
    min-width:106px;
    padding-left:7px;
  }

  .centro-control-estado strong{
    font-size:8.5px;
  }

  .centro-control-estado small{
    font-size:7px;
  }
}

/* ---------------------------------------------------------
   ESPACIADO Y BLOQUES DEL CENTRO
   Unificado globalmente a 8 px.
   --------------------------------------------------------- */

.centro-excel-bloque{
  width:100%;
}

/* ---------------------------------------------------------
   ESTADO DE EQUIPOS: PLATAFORMA + PUSH
   --------------------------------------------------------- */

.centro-equipo-push{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:7px;
  margin-top:4px;
  padding-top:4px;
  border-top:1px solid #e2e8f0;
}

.centro-equipo-push span{
  color:#64748b;
  font-size:9px;
  font-weight:700;
}

.centro-equipo-push strong{
  max-width:58%;
  color:#0f172a;
  font-size:9px;
  font-weight:900;
  text-align:right;
  overflow-wrap:anywhere;
}

.centro-equipo-push strong.ok{
  color:#15803d;
}

.centro-equipo-push strong.neutro{
  color:#64748b;
}

/* ---------------------------------------------------------
   DISPOSITIVOS
   --------------------------------------------------------- */

.centro-dispositivos-bloque .centro-dispositivo-fila{
  border-bottom:0;
}

.centro-dispositivo-cabecera > div{
  text-align:center;
}

.centro-dispositivo-usuario,
.centro-dispositivo-nombre{
  text-align:center;
}

.centro-dispositivo-acciones{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  text-align:center;
}

/* ---------------------------------------------------------
   GESTIÓN DE ROLES
   --------------------------------------------------------- */

.centro-roles-gestion .centro-titulo-fila{
  text-align:left;
}

.centro-roles-gestion .centro-titulo-fila p{
  margin:3px 0 0;
  color:#64748b;
  font-size:10px;
}

#centroRolesTabla{
  margin-top:10px;
  overflow:hidden;
  border:1px solid #e2e8f0;
  border-radius:10px;
}

.centro-roles-cabecera,
.centro-roles-fila{
  display:grid;
  grid-template-columns:
    minmax(70px,.9fr)
    minmax(80px,.9fr)
    minmax(120px,1.2fr)
    minmax(90px,.8fr);
  align-items:center;
  gap:6px;
}

.centro-roles-cabecera{
  padding:8px;
  background:#f1f5f9;
  color:#64748b;
  font-size:9px;
  font-weight:900;
}

.centro-roles-cabecera > div{
  text-align:center;
}

.centro-roles-fila{
  padding:8px;
  border-top:1px solid #e2e8f0;
  background:#fff;
}

.centro-roles-usuario,
.centro-roles-actual,
.centro-roles-nuevo,
.centro-roles-acciones{
  min-width:0;
  text-align:center;
}

.centro-roles-usuario{
  color:#0f172a;
  font-size:10px;
  font-weight:900;
  overflow-wrap:anywhere;
}

.centro-roles-actual{
  color:#334155;
  font-size:10px;
  font-weight:700;
}

.centro-roles-nuevo,
.centro-roles-acciones{
  display:flex;
  align-items:center;
  justify-content:center;
}

.centro-roles-mensaje{
  min-height:0;
  padding:0 8px;
  color:#64748b;
  font-size:9px;
  font-weight:800;
  text-align:center;
}

.centro-roles-mensaje:not(:empty){
  padding-top:7px;
  padding-bottom:7px;
  border-top:1px solid #e2e8f0;
}

/* ---------------------------------------------------------
   GESTIÓN DE EQUIPOS ADICIONALES
   --------------------------------------------------------- */

#centroAdicionalesTabla{
  margin-top:10px;
  overflow:hidden;
  border:1px solid #e2e8f0;
  border-radius:10px;
}

.centro-adicionales-cabecera,
.centro-adicionales-fila{
  display:grid;
  grid-template-columns:
    minmax(70px,.8fr)
    minmax(70px,.8fr)
    minmax(115px,1.35fr)
    minmax(90px,.8fr);
  align-items:center;
  gap:6px;
}

.centro-adicionales-cabecera{
  padding:8px;
  background:#f1f5f9;
  color:#64748b;
  font-size:9px;
  font-weight:900;
}

.centro-adicionales-cabecera > div{
  text-align:center;
}

.centro-adicionales-fila{
  padding:8px;
  border-top:1px solid #e2e8f0;
  background:#fff;
}

.centro-adicionales-usuario{
  color:#0f172a;
  font-size:10px;
  font-weight:900;
  overflow-wrap:anywhere;
  text-align:center;
}

.centro-adicionales-principal,
.centro-adicionales-equipo{
  min-width:0;
  color:#334155;
  font-size:10px;
  overflow-wrap:anywhere;
  text-align:center;
}

.centro-adicionales-equipo,
.centro-adicionales-acciones{
  display:flex;
  align-items:center;
  justify-content:center;
}

.centro-adicionales-acciones{
  gap:4px;
  text-align:center;
}

.centro-adicionales-mensaje{
  min-height:0;
  padding:0 8px;
  color:#64748b;
  font-size:9px;
  font-weight:800;
}

.centro-adicionales-mensaje:not(:empty){
  padding-top:7px;
  padding-bottom:7px;
  border-top:1px solid #e2e8f0;
}

/* ---------------------------------------------------------
   SELECTS Y BOTONES ADMINISTRATIVOS
   Una sola definición final.
   --------------------------------------------------------- */

/* Nuevo rol y Equipo adicional = mismo tamaño que los botones */
.centro-roles-select,
.centro-adicionales-select-fila{
  width:64px;
  min-width:64px;
  max-width:64px;
  height:26px;
  min-height:26px;
  max-height:26px;
  padding:0 16px 0 6px;
  background:#fff;
  border:1px solid #cbd5e1;
  border-radius:7px;
  color:#0f172a;
  font-size:8px;
  line-height:1;
  font-weight:800;
  text-align:center;
  text-align-last:center;
  box-shadow:none;
}

/* Guardar / Autorizar / Eliminar / Rechazar = mismo tamaño */
.centro-roles-guardar,
.centro-adicionales-autorizar-fila,
.centro-adicionales-eliminar,
.centro-btn-eliminar-dispositivo,
.centro-btn-rechazar-dispositivo,
.centro-btn-autorizar-dispositivo{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:64px;
  min-width:64px;
  max-width:64px;
  height:26px;
  min-height:26px;
  max-height:26px;
  padding:0 5px;
  border:0;
  border-radius:7px;
  color:#fff;
  font-size:8px;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
  box-shadow:none;
  cursor:pointer;
}

.centro-roles-guardar,
.centro-roles-guardar:disabled{
  background:var(--azul);
  color:#fff;
  opacity:1;
}

.centro-adicionales-autorizar-fila,
.centro-adicionales-autorizar-fila:disabled,
.centro-btn-autorizar-dispositivo,
.centro-btn-autorizar-dispositivo:disabled{
  background:var(--verde);
  color:#fff;
  opacity:1;
}

.centro-adicionales-eliminar,
.centro-btn-eliminar-dispositivo,
.centro-btn-rechazar-dispositivo{
  background:var(--rojo);
  color:#fff;
}

.centro-roles-guardar:active,
.centro-adicionales-autorizar-fila:active,
.centro-adicionales-eliminar:active,
.centro-btn-eliminar-dispositivo:active,
.centro-btn-rechazar-dispositivo:active,
.centro-btn-autorizar-dispositivo:active{
  transform:scale(.98);
}

/* ---------------------------------------------------------
   RESPONSIVE TABLAS
   --------------------------------------------------------- */

@media (max-width:520px){
  .centro-roles-cabecera,
  .centro-roles-fila{
    grid-template-columns:
      minmax(55px,.7fr)
      minmax(64px,.75fr)
      minmax(76px,.9fr)
      minmax(70px,.7fr);
    gap:4px;
    padding-left:6px;
    padding-right:6px;
  }

  .centro-adicionales-cabecera,
  .centro-adicionales-fila{
    grid-template-columns:
      minmax(54px,.65fr)
      minmax(54px,.65fr)
      minmax(76px,.9fr)
      minmax(70px,.7fr);
    gap:4px;
    padding-left:6px;
    padding-right:6px;
  }

  .centro-roles-cabecera,
  .centro-adicionales-cabecera{
    font-size:8px;
  }

  .centro-roles-usuario,
  .centro-roles-actual,
  .centro-adicionales-usuario,
  .centro-adicionales-principal,
  .centro-adicionales-equipo{
    font-size:9px;
  }
}

/* =========================================================
   SISTEM - RITMO GLOBAL 8 PX v810
   Todas las pestañas y todos los usuarios.
   ========================================================= */

body.sesion-iniciada .bottom-nav{
  display:grid !important;
}

.app-shell{
  padding-top:0 !important;
}

/* AVISOS */
#tab-avisos{
  padding-top:0 !important;
}

.avisos-subtabs{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  width:100%;
  margin:0 0 var(--sistem-espacio-app) !important;
  padding:3px;
  gap:0;
  background:#f3f6fb;
  border:1px solid #dbe4f0;
  border-radius:14px;
  box-shadow:0 1px 3px rgba(15,23,42,.04);
  overflow:hidden;
}

.avisos-subtab{
  min-width:0;
  min-height:30px;
  margin:0 !important;
  padding:5px 4px;
  background:transparent;
  border:0;
  border-right:1px solid #dbe4f0;
  border-radius:0;
  color:#52627a;
  box-shadow:none;
  font-size:9px;
  line-height:1.05;
  font-weight:900;
  text-align:center;
  white-space:nowrap;
  cursor:pointer;
}

.avisos-subtab:last-child{
  border-right:0;
}

.avisos-subtab.active{
  position:relative;
  z-index:1;
  background:var(--azul);
  border-right-color:transparent;
  border-radius:11px;
  color:#fff;
  box-shadow:0 3px 8px rgba(37,99,235,.20);
}

.section-title-avisos{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end !important;
  gap:12px;
  width:100%;
  margin:0 0 var(--sistem-espacio-app) !important;
}

.section-title-avisos .section-title-texto{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
}

.section-title-avisos h2{
  margin:0 0 2px !important;
}

.section-title-avisos p{
  margin:0 !important;
}

.section-title-avisos .filtro-equipo-wrap{
  align-self:end !important;
  justify-self:end;
  margin:0 !important;
  padding:0 !important;
}

.section-title-avisos .filtro-equipo-wrap label{
  margin:0 0 4px !important;
}

#filtroEquipo{
  margin:0 !important;
}

.contadorAvisos{
  margin:0 0 var(--sistem-espacio-app) !important;
  gap:var(--sistem-espacio-app) !important;
}

#chat{
  margin:0 !important;
  padding:0 !important;
}

#chat > .msg{
  margin:0 0 var(--sistem-espacio-app) !important;
}

#chat > .msg:last-child{
  margin-bottom:0 !important;
}

.msg{
  margin-left:0 !important;
  margin-right:0 !important;
}

.contador.normal.contador-fuente-excel{
  display:block !important;
  width:100% !important;
  grid-template-columns:none !important;
  gap:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.contador.normal.contador-fuente-excel .contador-left{
  width:100% !important;
  max-width:none !important;
}

/* CRUCES / EQUIPOS / PENDIENTES / IMPORTANTE */
#tab-cruces,
#tab-equipos,
#tab-pendientes,
#tab-documentacion,
#tab-importante{
  padding-top:0 !important;
}

#tab-cruces .cards-grid,
#tab-equipos .cards-grid,
#tab-pendientes .cards-grid,
#tab-importante .cards-grid{
  display:grid;
  gap:var(--sistem-espacio-app) !important;
}

#tab-cruces .cards-grid > *,
#tab-equipos .cards-grid > *,
#tab-pendientes .cards-grid > *,
#tab-importante .cards-grid > *{
  margin-bottom:0 !important;
}

#tab-pendientes .pendiente-panel,
#tab-pendientes .file-card{
  margin-bottom:var(--sistem-espacio-app) !important;
}

/* DOCUMENTOS */
#tab-documentacion{
  display:none;
}

#tab-documentacion.active{
  display:block;
}

#tab-documentacion > .documentacion-cabecera,
#tab-documentacion > .documentacion-busqueda,
#tab-documentacion > .documentacion-categorias,
#tab-documentacion > .documentacion-subcategorias,
#tab-documentacion > .documentacion-admin,
#tab-documentacion > .documentacion-listado,
#tab-documentacion > .documentacion-visor{
  margin-top:0 !important;
  margin-bottom:var(--sistem-espacio-app) !important;
}

#tab-documentacion > *:last-child{
  margin-bottom:0 !important;
}

#tab-documentacion .documentacion-listado{
  display:grid;
  gap:var(--sistem-espacio-app) !important;
}

#tab-documentacion .documentacion-card{
  margin-bottom:0 !important;
}

/* CENTRO / LOGIN — ESPACIADO DEFINITIVO 8 PX */
#panelConfiguracion.centro-control{
  /*
   * NO se fuerza display aquí.
   * - HTML arranca con display:none.
   * - app.js abre con display:flex y cierra con display:none.
   */
  flex-direction:column !important;
  gap:8px !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 8px !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Todas las ventanas principales del Centro usan solo el gap de 8 px. */
#panelConfiguracion.centro-control > .centro-control-cabecera,
#panelConfiguracion.centro-control > .centro-bloque{
  flex:0 0 auto;
  margin:0 !important;
}

/* Sin márgenes históricos añadidos entre ventanas. */
#panelConfiguracion.centro-control > .centro-control-cabecera + .centro-bloque,
#panelConfiguracion.centro-control > .centro-bloque + .centro-bloque{
  margin-top:0 !important;
}

.centro-alertas,
.centro-equipos,
.centro-dispositivos-bloque,
.centro-roles-gestion,
.centro-equipos-adicionales-gestion,
.centro-excel-bloque{
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/*
 * Última ventana del Centro -> primera ventana/pestaña principal:
 * exactamente 8 px.
 */
#panelConfiguracion.centro-control{
  margin-bottom:8px !important;
}

#centroRolesTabla,
#centroAdicionalesTabla,
#centroExcelEstado{
  margin-bottom:0 !important;
}

.login-panel{
  margin-bottom:8px !important;
}
@media (max-width:480px){
  .avisos-subtabs{
    margin-bottom:var(--sistem-espacio-app) !important;
    padding:3px;
    border-radius:13px;
  }

  .avisos-subtab{
    min-height:28px;
    padding:4px 3px;
    font-size:8px;
  }

  .avisos-subtab.active{
    border-radius:10px;
  }

  .section-title-avisos,
  .contadorAvisos{
    margin-bottom:var(--sistem-espacio-app) !important;
  }
}

/* =========================================================
   SESIÓN CERRADA FINAL v808
   ========================================================= */
body:not(.sesion-iniciada) #cerrarSesionBtn,
body:not(.sesion-iniciada) #actualizarBtn,
body:not(.sesion-iniciada) #configuracionBtn,
body:not(.sesion-iniciada) .equipo-bar,
body:not(.sesion-iniciada) .bottom-nav,
body:not(.sesion-iniciada) .tab-content,
body:not(.sesion-iniciada) .avisos-subtabs,
body:not(.sesion-iniciada) #cabeceraAvisos,
body:not(.sesion-iniciada) #contadorAvisos,
body:not(.sesion-iniciada) #chat{
  display:none !important;
}

/* =========================================================
   SISTEM v887 - CENTRO CONTROL
   Protege visualmente el dispositivo desde el que administra el usuario.
========================================================= */
.centro-dispositivo-actual{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 9px;
  border:1px solid #bfdbfe;
  border-radius:8px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:10px;
  line-height:1.15;
  font-weight:900;
  text-align:center;
  white-space:nowrap;
}


/* Estilos originales de Documentos, trasladados desde JS para evitar estilos dinámicos. */

    /* =========================================================
       DOCUMENTOS - DISEÑO COMPACTO ESCRITORIO + MÓVIL
       - 9 categorías en 2 filas (5 + 4)
       - Subcategorías compactas
       - Administración sin ocupar media pantalla
       - Menú inferior idéntico en todos los dispositivos
       ========================================================= */

    #tab-documentacion {
      --doc-gap: 8px;
      --doc-radio: 12px;
    }

    #tab-documentacion .documentacion-cabecera {
      margin: 4px 0 10px;
    }

    #tab-documentacion .documentacion-cabecera h2 {
      font-size: 21px;
      line-height: 1.1;
    }

    #tab-documentacion .documentacion-cabecera p {
      margin-top: 3px;
      font-size: 10px;
    }

    #tab-documentacion .documentacion-busqueda input {
      height: 38px;
      font-size: 11px;
    }

    #tab-documentacion .documentacion-categorias-grid {
      display: grid !important;
      grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
      gap: 7px !important;
      margin: 10px 0 12px !important;
      padding: 0 !important;
      overflow: visible !important;
    }

    #tab-documentacion .documentacion-chip {
      width: 100% !important;
      min-width: 0 !important;
      min-height: 30px !important;
      height: auto !important;
      padding: 6px 5px !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 0 !important;
      background: #fff !important;
      border: 1px solid #dbe4f0 !important;
      border-radius: 12px !important;
      color: #64748b !important;
      box-shadow: none !important;
      text-align: center !important;
      white-space: normal !important;
    }

    #tab-documentacion .documentacion-chip.active {
      background: #eff6ff !important;
      border-color: #93c5fd !important;
      color: #2563eb !important;
      box-shadow: inset 0 0 0 1px rgba(37,99,235,.06) !important;
    }

    #tab-documentacion .documentacion-categoria-nombre {
      display: block !important;
      width: auto !important;
      max-width: 100% !important;
      overflow: hidden !important;
      font-size: 10px !important;
      line-height: 1.05 !important;
      font-weight: 800 !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    #tab-documentacion .documentacion-subcategorias {
      margin: 0 0 10px !important;
      padding: 9px 10px !important;
      background: #f8fbff !important;
      border: 1px solid #dbeafe !important;
      border-radius: 11px !important;
    }

    #tab-documentacion .documentacion-subcategorias-cabecera h3 {
      margin: 0 0 7px !important;
      font-size: 11px !important;
      line-height: 1.2 !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-subcategorias-lista {
      display: flex !important;
      flex-wrap: wrap !important;
      gap: 6px !important;
    }

    #tab-documentacion .documentacion-subcategoria-chip {
      min-height: 28px !important;
      padding: 5px 9px !important;
      background: #fff !important;
      border: 1px solid #bfdbfe !important;
      border-radius: 999px !important;
      color: #334155 !important;
      font-size: 9px !important;
      line-height: 1 !important;
      font-weight: 800 !important;
      cursor: pointer !important;
    }

    #tab-documentacion .documentacion-subcategoria-chip.active {
      background: #2563eb !important;
      border-color: #2563eb !important;
      color: #fff !important;
    }

    #tab-documentacion .documentacion-subcategoria-vacia {
      color: #64748b !important;
      font-size: 9px !important;
      font-weight: 700 !important;
    }

    #tab-documentacion .documentacion-admin {
      margin: 0 0 10px !important;
      padding: 10px !important;
      background: #f8fafc !important;
      border: 1px solid #dbe4f0 !important;
      border-radius: 11px !important;
    }

    #tab-documentacion .documentacion-admin > h3,
    #tab-documentacion .documentacion-admin-subcategorias h3 {
      margin: 0 0 8px !important;
      font-size: 11px !important;
      line-height: 1.2 !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-carpetas {
      margin: 0 0 10px !important;
      padding: 8px 9px !important;
      background: #f8fafc !important;
      border: 1px solid #e2e8f0 !important;
      border-radius: 10px !important;
    }

    #tab-documentacion .documentacion-admin-toggle {
      width: 100% !important;
      min-height: 34px !important;
      padding: 7px 9px !important;
      border: 1px solid #cbd5e1 !important;
      border-radius: 8px !important;
      background: #ffffff !important;
      color: #334155 !important;
      font-size: 10px !important;
      font-weight: 900 !important;
      text-align: left !important;
      cursor: pointer !important;
    }

    #tab-documentacion #documentacionAdminContenido {
      margin-top: 10px !important;
    }

    #tab-documentacion .documentacion-carpetas-admin-grid {
      display: grid !important;
      grid-template-columns: 110px 140px minmax(0, 1fr) 110px !important;
      gap: 7px !important;
      align-items: center !important;
    }

    #tab-documentacion .documentacion-carpetas-admin-grid > * {
      width: 100% !important;
      min-width: 0 !important;
      min-height: 32px !important;
      height: 32px !important;
      padding: 5px 8px !important;
      border: 1px solid #cbd5e1 !important;
      border-radius: 8px !important;
      font-size: 9px !important;
    }

    #tab-documentacion #documentacionCrearCarpetaBtn {
      background: #e8f0fe !important;
      border-color: #bfdbfe !important;
      color: #1d4ed8 !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-admin-grid {
      display: grid !important;
      grid-template-columns: minmax(0, 1.2fr) 105px 125px 125px !important;
      gap: 7px !important;
      align-items: center !important;
    }

    #tab-documentacion .documentacion-admin-grid > * {
      grid-column: auto !important;
      width: 100% !important;
      min-width: 0 !important;
      min-height: 34px !important;
      height: 34px !important;
      padding: 6px 8px !important;
      border-radius: 8px !important;
      font-size: 9px !important;
    }

    #tab-documentacion .documentacion-admin-grid #documentacionArchivo {
      grid-column: 1 / -1 !important;
      padding: 5px !important;
    }

    #tab-documentacion .documentacion-admin-grid #documentacionSubirBtn {
      grid-column: 1 / -1 !important;
      background: #2563eb !important;
      color: #fff !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-estado {
      min-height: 0 !important;
      margin-top: 6px !important;
      font-size: 8.5px !important;
    }

    #tab-documentacion .documentacion-admin-subcategorias {
      margin-top: 10px !important;
      padding-top: 9px !important;
      border-top: 1px solid #e2e8f0 !important;
    }

    #tab-documentacion .documentacion-subcategorias-admin-grid {
      display: grid !important;
      grid-template-columns: 120px minmax(0, 1fr) 125px !important;
      gap: 7px !important;
      align-items: center !important;
    }

    #tab-documentacion .documentacion-subcategorias-admin-grid > * {
      width: 100% !important;
      min-width: 0 !important;
      min-height: 32px !important;
      height: 32px !important;
      padding: 5px 8px !important;
      border: 1px solid #cbd5e1 !important;
      border-radius: 8px !important;
      font-size: 9px !important;
    }

    #tab-documentacion #documentacionCrearSubcategoriaBtn {
      background: #e8f0fe !important;
      border-color: #bfdbfe !important;
      color: #1d4ed8 !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-subcategorias-admin-lista {
      display: flex !important;
      flex-wrap: wrap !important;
      gap: 6px !important;
      margin-top: 8px !important;
    }

    #tab-documentacion .documentacion-subcategoria-admin-item {
      display: inline-flex !important;
      align-items: center !important;
      gap: 7px !important;
      width: auto !important;
      padding: 5px 6px 5px 9px !important;
      background: #fff !important;
      border: 1px solid #e2e8f0 !important;
      border-radius: 999px !important;
      font-size: 9px !important;
      font-weight: 800 !important;
    }

    #tab-documentacion .documentacion-subcategoria-admin-item button {
      min-height: 23px !important;
      padding: 3px 7px !important;
      background: #fff1f2 !important;
      border: 1px solid #fecdd3 !important;
      border-radius: 999px !important;
      color: #b91c1c !important;
      font-size: 8px !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-listado {
      display: grid !important;
      gap: 8px !important;
      margin-top: 10px !important;
    }

    #tab-documentacion .documentacion-documento-card {
      display: block !important;
      padding: 9px 10px !important;
      background: #fff !important;
      border: 1px solid #e2e8f0 !important;
      border-radius: 11px !important;
      box-shadow: none !important;
    }

    #tab-documentacion .documentacion-documento-info {
      min-width: 0 !important;
    }

    #tab-documentacion .documentacion-documento-etiquetas {
      display: flex !important;
      flex-wrap: wrap !important;
      gap: 5px !important;
      margin-bottom: 5px !important;
    }

    #tab-documentacion .documentacion-documento-categoria,
    #tab-documentacion .documentacion-documento-subcategoria,
    #tab-documentacion .documentacion-documento-carpeta {
      display: inline-flex !important;
      padding: 3px 7px !important;
      border-radius: 999px !important;
      font-size: 8px !important;
      line-height: 1.1 !important;
      font-weight: 900 !important;
    }

    #tab-documentacion .documentacion-documento-categoria {
      background: #e8f0fe !important;
      color: #1e3a8a !important;
    }

    #tab-documentacion .documentacion-documento-subcategoria {
      background: #ecfdf5 !important;
      color: #166534 !important;
    }

    #tab-documentacion .documentacion-documento-carpeta {
      background: #fff7ed !important;
      color: #9a3412 !important;
    }

    #tab-documentacion .documentacion-documento-nombre {
      font-size: 12px !important;
      line-height: 1.2 !important;
      font-weight: 900 !important;
      overflow-wrap: anywhere !important;
    }

    #tab-documentacion .documentacion-documento-archivo,
    #tab-documentacion .documentacion-documento-fecha {
      margin-top: 2px !important;
      margin-bottom: 0 !important;
      color: #64748b !important;
      font-size: 8.5px !important;
      line-height: 1.15 !important;
      opacity: 1 !important;
      overflow-wrap: anywhere !important;
    }

    #tab-documentacion .documentacion-documento-acciones {
      display: flex !important;
      flex-wrap: nowrap !important;
      width: 100% !important;
      gap: 4px !important;
      margin-top: 5px !important;
      padding: 0 !important;
    }

    #tab-documentacion .documentacion-btn {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      flex: 1 1 0 !important;
      min-width: 0 !important;
      width: auto !important;
      min-height: 27px !important;
      height: 27px !important;
      padding: 0 3px !important;
      margin: 0 !important;
      border: 0 !important;
      border-radius: 6px !important;
      background: #2563eb !important;
      color: #ffffff !important;
      font-size: 8px !important;
      line-height: 1 !important;
      font-weight: 900 !important;
      text-align: center !important;
      text-decoration: none !important;
      white-space: nowrap !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
    }

    #tab-documentacion .documentacion-btn.descargar {
      background: #2f7d3f !important;
      color: #ffffff !important;
    }

    #tab-documentacion .documentacion-btn-eliminar {
      background: #dc2626 !important;
      color: #ffffff !important;
    }
    @media (max-width: 700px) {
      #tab-documentacion .documentacion-categorias-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 5px !important;
      }

      #tab-documentacion .documentacion-chip {
        min-height: 28px !important;
        padding: 5px 2px !important;
      }

      #tab-documentacion .documentacion-categoria-nombre {
        font-size: 8.5px !important;
      }

      #tab-documentacion .documentacion-admin-grid {
        grid-template-columns: 1fr 1fr !important;
      }

      #tab-documentacion .documentacion-admin-grid #documentacionNombre {
        grid-column: 1 / -1 !important;
      }

      #tab-documentacion .documentacion-admin-grid #documentacionCategoria,
      #tab-documentacion .documentacion-admin-grid #documentacionSubcategoria,
      #tab-documentacion .documentacion-admin-grid #documentacionCarpeta {
        grid-column: auto !important;
      }

      #tab-documentacion .documentacion-admin-grid #documentacionArchivo {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
      }

      #tab-documentacion .documentacion-admin-grid #documentacionSubirBtn {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
      }

      #tab-documentacion .documentacion-subcategorias-admin-grid {
        grid-template-columns: 92px minmax(0, 1fr) 100px !important;
      }

      #tab-documentacion .documentacion-carpetas-admin-grid {
        grid-template-columns: 1fr 1fr !important;
      }

      #tab-documentacion #documentacionNuevaCarpeta,
      #tab-documentacion #documentacionCrearCarpetaBtn {
        grid-column: 1 / -1 !important;
      }

      #tab-documentacion .documentacion-subcategorias-admin-grid > * {
        font-size: 8.5px !important;
      }

      #tab-documentacion .documentacion-documento-card {
        display: block !important;
        padding: 8px 9px !important;
      }

      #tab-documentacion .documentacion-documento-acciones {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        gap: 4px !important;
        margin-top: 4px !important;
      }

      #tab-documentacion .documentacion-btn {
        flex: 1 1 0 !important;
        width: auto !important;
        min-height: 26px !important;
        height: 26px !important;
        padding: 0 2px !important;
        font-size: 7.5px !important;
      }

    }

    @media (max-width: 390px) {
      #tab-documentacion .documentacion-categorias-grid {
        gap: 4px !important;
      }
      #tab-documentacion .documentacion-chip {
        min-height: 27px !important;
      }
      #tab-documentacion .documentacion-categoria-nombre {
        font-size: 8px !important;
      }
      #tab-documentacion .documentacion-subcategorias-admin-grid {
        grid-template-columns: 1fr 1fr !important;
      }
      #tab-documentacion #documentacionSubcategoriaCategoria {
        grid-column: 1 / 2 !important;
      }
      #tab-documentacion #documentacionNuevaSubcategoria {
        grid-column: 2 / 3 !important;
      }
      #tab-documentacion #documentacionCrearSubcategoriaBtn {
        grid-column: 1 / -1 !important;
      }
    }
  

/* Administración de Documentos: única definición compacta, sin estilos en JS. */
#tab-documentacion .documentacion-admin{padding:9px 10px;margin:8px 0 12px;background:#f8fafc;border:1px solid var(--borde);border-radius:12px}
#tab-documentacion .documentacion-admin-toggle{display:block;width:100%;padding:6px 3px;text-align:left;border:0;background:transparent;color:var(--texto);font-size:11px;font-weight:900;cursor:pointer}
#tab-documentacion #documentacionAdminContenido{padding-top:6px}
#tab-documentacion .doc-admin-paso{padding:9px 0;border-top:1px solid var(--borde)}
#tab-documentacion .doc-admin-paso h3{display:flex;align-items:center;gap:7px;margin:0;font-size:11px;font-weight:900}
#tab-documentacion .doc-admin-numero{display:inline-grid;place-items:center;width:18px;height:18px;flex:none;background:var(--azul);color:#fff;border-radius:50%;font-size:10px}
#tab-documentacion .doc-admin-ruta{min-height:29px;padding:7px 8px;background:#fff;border:1px solid #dbe4f0;border-radius:8px;color:#334155;font-size:10px;font-weight:800;overflow-wrap:anywhere}
#tab-documentacion .doc-admin-volver{margin:0;padding:5px 2px;border:0;background:none;color:var(--azul);font-size:10px;font-weight:900;cursor:pointer}
#tab-documentacion .doc-admin-carpetas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:7px}
#tab-documentacion .doc-admin-carpeta{display:flex;align-items:center;justify-content:space-between;gap:4px;min-width:0;min-height:33px;padding:7px 8px;text-align:left;background:#fff;border:1px solid var(--borde);border-radius:9px;color:var(--texto);font-size:10px;font-weight:800;cursor:pointer;overflow-wrap:anywhere}
#tab-documentacion .doc-admin-carpeta:active{background:#eff6ff;border-color:var(--azul)}
#tab-documentacion .doc-admin-carpeta span:last-child{color:var(--azul);font-size:14px;flex:none}
#tab-documentacion .doc-admin-vacio{grid-column:1/-1;padding:7px;color:var(--texto-secundario);font-size:10px}
#tab-documentacion .doc-admin-label{display:block;margin-bottom:5px;color:#475569;font-size:10px;font-weight:800}
#tab-documentacion .doc-admin-control{display:block;width:100%;min-width:0;min-height:34px;padding:7px 9px;background:#fff;border:1px solid #cbd5e1;border-radius:9px;color:var(--texto);font-size:11px;font-weight:700}
#tab-documentacion .doc-admin-formulario{display:grid;gap:7px;margin-top:8px}
#tab-documentacion .doc-admin-formulario[hidden],#tab-documentacion .doc-admin-volver[hidden]{display:none}
#tab-documentacion .doc-admin-ayuda{color:var(--texto-secundario);font-size:10px;line-height:1.4}
#tab-documentacion .doc-admin-ejecutar{min-height:34px;padding:7px 10px;border:0;border-radius:9px;background:var(--azul);color:#fff;font-size:11px;font-weight:900;cursor:pointer}
#tab-documentacion .doc-admin-ejecutar.peligro{background:var(--rojo)}
#tab-documentacion .doc-admin-ejecutar:disabled{opacity:.55;cursor:wait}
@media(max-width:340px){#tab-documentacion .doc-admin-carpetas{grid-template-columns:1fr}}

#tab-documentacion .doc-admin-paso-cabecera{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;width:100%}
#tab-documentacion .doc-admin-paso-cabecera h3{margin:0;flex:1;min-width:0}
#tab-documentacion .doc-admin-paso-cabecera .doc-admin-volver{margin:0;padding:5px 2px;flex:none;white-space:nowrap}

/* Visor de documentos: estilos originales trasladados desde JS. */
    #sistem-documentos-visor-limpio {
      position: fixed;
      inset: 0;
      z-index: 2147483647;
      display: flex;
      flex-direction: column;
      background: #eef1f5;
    }

    #sistem-documentos-visor-limpio .documentos-visor-cabecera {
      flex: 0 0 auto;
      min-height: 50px;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      column-gap: 8px;
      padding: max(7px, env(safe-area-inset-top)) 10px 7px;
      box-sizing: border-box;
      background: #fff;
      border-bottom: 1px solid #dde2e8;
    }

    #sistem-documentos-visor-limpio .documentos-visor-cerrar {
      appearance: none;
      -webkit-appearance: none;
      justify-self: start;
      border: 1px solid #cfd5dd;
      border-radius: 9px;
      background: #fff;
      color: #111827;
      padding: 6px 9px;
      font: inherit;
      font-size: 12px;
      line-height: 1;
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
    }

    #sistem-documentos-visor-limpio .documentos-visor-titulo {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: center;
      justify-self: stretch;
      color: #111827;
      font-size: 12px;
      line-height: 1.2;
      font-weight: 700;
    }

    #sistem-documentos-visor-limpio .documentos-visor-contenido {
      position: relative;
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: auto;
      overflow-x: hidden;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
      background: #eef1f5;
    }

    #sistem-documentos-visor-limpio .documentos-visor-estado {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      text-align: center;
      color: #4b5563;
      font-size: 14px;
      font-weight: 700;
      box-sizing: border-box;
    }

    #sistem-documentos-visor-limpio .documentos-pdf-paginas {
      width: 100%;
      box-sizing: border-box;
      padding: 14px 10px 74px;
    }

    #sistem-documentos-visor-limpio .documentos-pdf-pagina {
      width: 100%;
      display: flex;
      justify-content: center;
      margin: 0 0 12px;
      box-sizing: border-box;
    }

    #sistem-documentos-visor-limpio .documentos-pdf-canvas {
      display: block;
      max-width: 100%;
      height: auto;
      background: #fff;
      box-shadow: 0 1px 8px rgba(0,0,0,.12);
    }

    #sistem-documentos-visor-limpio .documentos-pdf-contador {
      position: fixed;
      left: 50%;
      bottom: max(12px, calc(env(safe-area-inset-bottom) + 7px));
      transform: translateX(-50%);
      z-index: 4;
      padding: 7px 12px;
      border-radius: 999px;
      background: rgba(20,20,20,.72);
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      pointer-events: none;
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
    }

    #sistem-documentos-visor-limpio .documentos-excel-contenedor {
      width: 100%;
      min-height: 100%;
      padding: 10px;
      box-sizing: border-box;
      background: #eef1f5;
    }

    #sistem-documentos-visor-limpio .documentos-excel-hoja-selector {
      position: sticky;
      top: 0;
      z-index: 3;
      display: block;
      width: min(100%, 420px);
      margin: 0 auto 10px;
      padding: 8px 10px;
      border: 1px solid #cfd8e3;
      border-radius: 8px;
      background: #fff;
      font-size: 13px;
    }

    #sistem-documentos-visor-limpio .documentos-excel-tabla-wrap {
      width: 100%;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      background: #fff;
      border-radius: 8px;
      box-shadow: 0 1px 8px rgba(0,0,0,.10);
    }

    #sistem-documentos-visor-limpio .documentos-excel-lienzo {
      width: max-content;
      min-width: 100%;
      padding: 8px;
      box-sizing: border-box;
      background: #fff;
    }

    #sistem-documentos-visor-limpio .documentos-excel-lienzo table {
      border-collapse: collapse;
      background: #fff;
    }

    #sistem-documentos-visor-limpio .documentos-excel-lienzo td,
    #sistem-documentos-visor-limpio .documentos-excel-lienzo th {
      border: 1px solid #d7dde5;
      padding: 3px 5px;
      white-space: nowrap;
    }

    #sistem-documentos-visor-limpio .documentos-word-wrap,
    #sistem-documentos-visor-limpio .documentos-txt-wrap {
      width: 100%;
      box-sizing: border-box;
      padding: 14px 10px 40px;
      background: #eef1f5;
    }

    #sistem-documentos-visor-limpio .documentos-word-hoja,
    #sistem-documentos-visor-limpio .documentos-txt-hoja {
      width: min(100%, 860px);
      margin: 0 auto;
      box-sizing: border-box;
      background: #fff;
      box-shadow: 0 1px 8px rgba(0,0,0,.12);
      color: #111827;
    }

    #sistem-documentos-visor-limpio .documentos-word-hoja {
      padding: 22px 18px;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      font-size: 14px;
      line-height: 1.5;
      overflow-wrap: anywhere;
    }

    #sistem-documentos-visor-limpio .documentos-word-hoja img {
      max-width: 100%;
      height: auto;
    }

    #sistem-documentos-visor-limpio .documentos-word-hoja table {
      max-width: 100%;
      border-collapse: collapse;
    }

    #sistem-documentos-visor-limpio .documentos-word-hoja td,
    #sistem-documentos-visor-limpio .documentos-word-hoja th {
      border: 1px solid #d9dee5;
      padding: 4px 6px;
      vertical-align: top;
    }

    #sistem-documentos-visor-limpio .documentos-txt-hoja {
      padding: 18px;
    }

    #sistem-documentos-visor-limpio .documentos-txt-texto {
      margin: 0;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: 13px;
      line-height: 1.5;
      color: #111827;
    }

    @media (min-width: 700px) {
      #sistem-documentos-visor-limpio .documentos-pdf-paginas {
        max-width: 1000px;
        margin: 0 auto;
        padding-left: 20px;
        padding-right: 20px;
      }
    }

/* Cabecera Drive: sin estilos en línea ni copia de estilos computados. */
#tab-documentacion .documentacion-cabecera-secundaria{display:flex;align-items:baseline;justify-content:space-between;gap:10px;width:100%;margin:0}
#tab-documentacion .documentacion-cabecera-secundaria p{margin:0;min-width:0;flex:1 1 auto}
#tab-documentacion #documentacionSincronizarDriveBtn{
  display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;align-self:baseline;min-width:0;
  height:18px;min-height:18px;margin:0;padding:0;
  border:0;border-radius:0;background:transparent;box-shadow:none;
  color:#f59e0b;font-family:Arial,Helvetica,sans-serif;
  font-size:var(--sistem-header-action-size);font-weight:900;line-height:1;
  letter-spacing:normal;white-space:nowrap;cursor:pointer;
}
#tab-documentacion #documentacionSincronizarDriveBtn:disabled{opacity:.65;cursor:wait}

/* Vista previa de formatos adicionales: estilos integrados del visor Documentos. */
#sistem-documentos-visor-limpio .documentos-visor-multimedia {
  display: block;
  max-width: calc(100% - 20px);
  max-height: calc(100% - 20px);
  width: auto;
  height: auto;
  margin: 10px auto;
  object-fit: contain;
}
#sistem-documentos-visor-limpio audio.documentos-visor-multimedia { width: calc(100% - 20px); margin-top: 24px; }
#sistem-documentos-visor-limpio .documentos-visor-alternativa {
  display: flex;
  min-height: 180px;
  padding: 20px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 14px;
  color: #334155;
  text-align: center;
  font-size: 12px;
}

/* Navegación de carpetas: Volver alineado con el título. */
#documentacionCarpetasPanel .documentacion-subcategorias-cabecera {display:flex;align-items:center;justify-content:space-between;gap:8px}
#documentacionCarpetasVolver {flex:0 0 auto;padding:3px 8px;border:0;background:transparent;color:var(--azul);font-size:11px;font-weight:800;cursor:pointer}
#documentacionCarpetasVolver[hidden] {display:none}