/* ── ADMIN PANEL (Súper Admin, Admin de empresa) ── */
.topbar{background:var(--primary);padding:0.9rem 1.2rem;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(27,62,111,0.2);}
.tb-logo{font-size:1.1rem;font-weight:800;color:white;letter-spacing:-0.01em;display:flex;align-items:center;}
.tb-logo span{color:var(--accent2);}
.tb-logo-img{height:26px;width:26px;object-fit:contain;border-radius:6px;margin-right:8px;background:white;}
.tb-right{display:flex;align-items:center;gap:0.5rem;}
.tb-role{font-size:0.65rem;font-weight:600;padding:3px 8px;border-radius:6px;background:rgba(139,92,246,0.2);color:#c4b5fd;letter-spacing:0.04em;text-transform:uppercase;}
.tb-logout{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);color:rgba(255,255,255,0.7);border-radius:8px;padding:4px 10px;font-size:0.72rem;font-weight:600;cursor:pointer;transition:all 0.2s;font-family:'Plus Jakarta Sans',sans-serif;}
.tb-logout:hover{background:rgba(220,38,38,0.2);border-color:rgba(220,38,38,0.3);color:#fca5a5;}

/* Responsive: en celular, una sola columna angosta (como antes). A partir
   de tablet/escritorio el contenido usa más ancho de la pantalla — sin
   estirarlo tanto que los formularios y checklists (que se leen de arriba
   hacia abajo) se vuelvan incómodos de leer en un monitor grande. */
.content{flex:1;overflow-y:auto;padding:1rem;max-width:640px;margin:0 auto;width:100%;}
@media (min-width:768px){
  .content{max-width:760px;padding:1.5rem;}
}
@media (min-width:1100px){
  .content{max-width:1040px;padding:2rem;}
}

.card{background:white;border:1px solid var(--border);border-radius:16px;padding:1.2rem;margin-bottom:0.8rem;box-shadow:var(--shadow);}
.card-title{font-size:0.82rem;font-weight:700;color:var(--text);margin-bottom:1rem;text-transform:uppercase;letter-spacing:0.06em;}

.emp-card{background:white;border:1px solid var(--border);border-radius:14px;padding:1rem;margin-bottom:0.6rem;box-shadow:var(--shadow);}
.emp-card-click{cursor:pointer;transition:border-color 0.2s,box-shadow 0.2s;}
.emp-card-click:hover{border-color:var(--primary3);box-shadow:var(--shadow-lg);}
.emp-name{font-weight:700;font-size:0.92rem;color:var(--text);margin-bottom:2px;}
.emp-nit{font-size:0.72rem;color:var(--text3);}
.emp-empty{font-size:0.85rem;color:var(--text3);text-align:center;padding:1.5rem 0;}

.emp-volver{background:none;border:none;color:var(--primary3);font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:0.82rem;cursor:pointer;padding:0;margin-bottom:0.9rem;}

/* ── FILAS DE EXTINTORES (Inspector) ── */
.ext-row{display:flex;align-items:center;gap:0.8rem;padding:0.85rem;border-radius:12px;background:white;border:1px solid var(--border);margin-bottom:0.5rem;cursor:pointer;transition:all 0.2s;}
.ext-row:hover{border-color:var(--primary3);box-shadow:var(--shadow);}
.ext-ico{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:800;font-size:0.9rem;}
.eig{background:var(--green-bg);color:var(--green);}
.eiy{background:var(--yellow-bg);color:var(--yellow);}
.eir{background:var(--red-bg);color:var(--red);}
.ext-info{flex:1;}
.ext-name{font-weight:700;font-size:0.85rem;color:var(--text);}
.ext-det{font-size:0.72rem;color:var(--text3);margin-top:2px;}

/* ── PROGRESO ── */
.prog-wrap{margin-bottom:1rem;}
.prog-top{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--text3);margin-bottom:5px;font-weight:600;}
.prog-bar{height:5px;background:var(--border);border-radius:100px;overflow:hidden;}
.prog-fill{height:100%;background:var(--primary3);border-radius:100px;transition:width 0.4s;}

/* ── ENCUESTA SST: una categoría a la vez ──
   Píldoras de categoría (saltar directo a cualquiera, ✓ cuando ya está
   completa), título de la categoría actual, y los botones de navegación al
   final de cada una ("‹ Categoría anterior" / "Siguiente categoría ›"). */
/* Antes no había ningún indicio de que esta fila de pastillas se puede
   deslizar horizontalmente cuando hay más categorías de las que caben en
   pantalla (sobre todo en celular) — parecía que la lista terminaba ahí.
   El degradado en los bordes (mask-image, sin JS) insinúa que sigue algo
   más hacia los lados. */
.sst-pasos{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:0.9rem;-webkit-overflow-scrolling:touch;mask-image:linear-gradient(to right,transparent,black 16px,black calc(100% - 16px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 16px,black calc(100% - 16px),transparent);}
.sst-paso{flex:none;background:var(--off-white);border:1px solid var(--border);border-radius:100px;padding:6px 14px;font-size:0.74rem;font-weight:600;color:var(--text2);cursor:pointer;white-space:nowrap;font-family:'Plus Jakarta Sans',sans-serif;}
.sst-paso:hover{border-color:var(--primary3);color:var(--primary3);}
.sst-paso.completo{color:var(--green);border-color:var(--green-border);background:var(--green-bg);}
.sst-paso.activo{background:var(--primary);border-color:var(--primary);color:white;}
.sst-cat-titulo{font-weight:700;font-size:0.95rem;margin:0 0 0.7rem;color:var(--text);}
.sst-nav{display:flex;gap:8px;margin-top:0.9rem;}
.sst-nav .btn-secondary-sm{flex:none;padding:0.75rem 1.1rem;}
.sst-nav .btn-primary{flex:1;margin-top:0;}
/* Llama la atención sobre el ítem que le falta contestar/firmar cuando se
   avisa que no puede avanzar/guardar/finalizar (se quita sola a los 1.8s).
   Se usa en los 5 módulos (Encuesta SST, Extintores, Botiquín, Vehículos,
   EPP) — ver resaltarElemento() en inspector/panel.js. */
.check-item.campo-resaltado, canvas.campo-resaltado{animation:campoResaltar 1.8s ease;}
@keyframes campoResaltar{
  0%, 100% { box-shadow: none; border-color: var(--border); }
  15%, 55% { box-shadow: 0 0 0 3px rgba(217,119,6,0.35); border-color: var(--yellow); }
}

/* ── CHECKLIST ── */
.check-item{border-radius:12px;margin-bottom:0.5rem;border:1px solid var(--border);background:white;overflow:hidden;transition:border-color 0.2s;}
.check-header{display:flex;align-items:center;padding:0.75rem;gap:0.6rem;}
.check-text{flex:1;}
.check-label{font-size:0.84rem;font-weight:600;color:var(--text);}
.check-btns{display:flex;gap:4px;}
.chk{width:34px;height:34px;border-radius:8px;border:1px solid var(--border);background:var(--off-white);cursor:pointer;font-size:0.68rem;font-weight:700;color:var(--text3);transition:all 0.15s;font-family:'Plus Jakarta Sans',sans-serif;}
.chk:hover{border-color:var(--primary);color:var(--primary);}
/* Relleno sólido (no el fondito pastel de los badges) para que se note de
   una cuál botón quedó seleccionado, incluso de reojo en el celular — pedido
   explícito: colores más intensos, y que N/A también se note (antes se veía
   igual que un botón sin seleccionar, con el mismo gris de fondo). */
.chk.ok{background:var(--green);border-color:var(--green);color:#fff;}
.chk.warn{background:var(--yellow);border-color:var(--yellow);color:#fff;}
.chk.bad{background:var(--red);border-color:var(--red);color:#fff;}
.chk.na{background:var(--text2);border-color:var(--text2);color:#fff;}
.check-item.eok{border-left:3px solid #0D7A4E;}
.check-item.ewarn{border-left:3px solid #D97706;}
.check-item.ebad{border-left:3px solid #B91C1C;}
.det-btn{font-size:0.68rem;color:var(--primary3);background:var(--off-white);border:1px solid var(--border);border-radius:6px;padding:3px 8px;cursor:pointer;white-space:nowrap;font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;}
.check-expand{display:none;padding:0 0.75rem 0.75rem;border-top:1px solid var(--border);background:#FAFCFF;}
.check-expand.open{display:block;}
.obs-input{width:100%;background:white;border:1px solid var(--border);border-radius:9px;padding:0.6rem 0.8rem;color:var(--text);font-size:0.82rem;font-family:'Plus Jakarta Sans',sans-serif;outline:none;resize:vertical;min-height:3.2rem;margin-top:0.6rem;box-sizing:border-box;}
.obs-input:focus{border-color:var(--primary3);}

.btn-submit{width:100%;padding:0.9rem;background:var(--green);border:none;border-radius:12px;color:white;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:0.9rem;cursor:pointer;transition:all 0.2s;margin-top:0.8rem;box-shadow:0 4px 16px rgba(13,122,78,0.25);}
.btn-submit:disabled{background:var(--border);color:var(--text3);cursor:not-allowed;box-shadow:none;}
.emp-modulo-fila{display:flex;align-items:center;gap:0.6rem;padding:0.6rem 0;border-bottom:1px solid var(--border);font-size:0.86rem;color:var(--text);cursor:pointer;}
.emp-modulo-fila:last-child{border-bottom:none;}
.emp-modulo-fila input{width:18px;height:18px;accent-color:var(--primary);cursor:pointer;}

.btn-borrar-check{background:var(--off-white);border:1px solid var(--border);color:var(--red);border-radius:8px;width:36px;height:36px;cursor:pointer;font-size:0.85rem;flex-shrink:0;}
.btn-borrar-check:hover{background:var(--red-bg);border-color:var(--red-border);}

.btn-primary{width:100%;padding:0.85rem;background:var(--primary);border:none;border-radius:12px;color:white;font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:0.9rem;cursor:pointer;transition:all 0.2s;margin-top:0.5rem;}
.btn-primary:hover{background:var(--primary2);}
.btn-sec{background:var(--off-white);color:var(--text3);border:1px solid var(--border);}
.btn-sec:hover{background:var(--border);}

.form-sel{width:100%;background:white;border:1px solid var(--border);border-radius:10px;padding:0.65rem 0.9rem;color:var(--text);font-size:0.88rem;font-family:'Plus Jakarta Sans',sans-serif;outline:none;}

/* ── TABS (tomado del mockup) ── */
.mod-tabs{display:flex;gap:0.4rem;margin-bottom:1rem;background:white;padding:0.4rem;border-radius:12px;border:1px solid var(--border);}
.mod-tab{flex:1;padding:0.55rem;background:transparent;border:none;border-radius:9px;color:var(--text3);font-size:0.75rem;font-weight:600;cursor:pointer;text-align:center;transition:all 0.2s;font-family:'Plus Jakarta Sans',sans-serif;}
.mod-tab.active{background:var(--primary);color:white;box-shadow:0 2px 8px rgba(27,62,111,0.25);}
.page{display:none;}
.page.active{display:block;animation:fi 0.2s ease;}
@keyframes fi{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* ── ESTADÍSTICAS ── */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;margin-bottom:0.8rem;}
.stat-card{background:white;border:1px solid var(--border);border-radius:14px;padding:1rem;text-align:center;box-shadow:var(--shadow);}
.stat-num{font-size:1.8rem;font-weight:800;color:var(--primary);}
.stat-lbl{font-size:0.68rem;color:var(--text3);margin-top:3px;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;}
.sc-g .stat-num{color:var(--green);}
.sc-y .stat-num{color:#D97706;}
.sc-r .stat-num{color:var(--red);}

/* ── BADGES ── */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:6px;font-size:0.7rem;font-weight:700;letter-spacing:0.02em;}
.b-green{background:var(--green-bg);color:var(--green);border:1px solid var(--green-border);}
.b-yellow{background:var(--yellow-bg);color:var(--yellow);border:1px solid var(--yellow-border);}
.b-red{background:var(--red-bg);color:var(--red);border:1px solid var(--red-border);}
.b-blue{background:#EFF6FF;color:#1D4ED8;border:1px solid #BFDBFE;}
.b-gray{background:var(--off-white);color:var(--text3);border:1px solid var(--border);}

/* ── SELECT INLINE (tipo de respuesta, dentro de una .doc-row) ── */
.form-sel-inline{width:auto;background:white;border:1px solid var(--border);border-radius:8px;padding:4px 8px;font-size:0.72rem;color:var(--text);font-family:'Plus Jakarta Sans',sans-serif;outline:none;}

/* ── FILAS DE DATOS ── */
.doc-row{display:flex;justify-content:space-between;align-items:center;padding:0.75rem 0;border-bottom:1px solid var(--border);}
.doc-row:last-child{border-bottom:none;}
.doc-label{font-size:0.85rem;font-weight:600;color:var(--text);}
.doc-sub{font-size:0.72rem;color:var(--text3);margin-top:2px;}

/* ── CONTROLES DE UNA PREGUNTA DE CHECKLIST (tipo de respuesta, Crítica, borrar) ──
   Todos del mismo alto (36px) y con el mismo estilo; "Crítica" es un botón
   tipo etiqueta que se pinta de rojo al marcarse. En celular la pregunta
   ocupa toda la fila y los controles pasan debajo. */
.doc-row-check{gap:0.75rem;}
.doc-row-check > div:first-child{flex:1 1 220px;min-width:0;}
.check-controles{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;justify-content:flex-end;}
.check-controles .form-sel-inline,
#s-admin-empresa form .form-sel-inline{height:36px;padding:0 0.6rem;font-size:0.8rem;border-radius:8px;background:var(--off-white);max-width:100%;}
.chk-critica{display:inline-flex;align-items:center;gap:0.4rem;height:36px;padding:0 0.7rem;border:1px solid var(--border);border-radius:8px;background:var(--off-white);font-size:0.8rem;font-weight:700;color:var(--text);white-space:nowrap;cursor:pointer;user-select:none;transition:all 0.15s;}
.chk-critica input{margin:0;accent-color:var(--red);width:16px;height:16px;cursor:pointer;}
.chk-critica:has(input:checked){background:var(--red-bg);border-color:var(--red-border);color:var(--red);}
/* En los formularios de "nueva pregunta" los campos miden 40px. */
#s-admin-empresa form .chk-critica{height:40px;}
@media (max-width:640px){
  .doc-row-check{flex-direction:column;align-items:stretch;gap:0.55rem;}
  .doc-row-check > div:first-child{flex:0 0 auto;}
  .check-controles{justify-content:flex-start;}
  .check-controles .form-sel-inline[data-resp-critica]{flex:1 1 100%;}
}

/* ── FILAS DE ELEMENTOS (genérico: extintores, botiquines, usuarios, etc.) ──
   Mismo lenguaje visual que .ext-row del Inspector, para que las listas del
   panel Admin no se vean como texto plano sin jerarquía. */
/* flex-wrap:wrap es una defensa contra badges largos (ej. Vehículos con dos
   documentos por vencer): si no cabe todo en una sola línea, el badge pasa
   a su propia línea abajo en vez de aplastar el texto de .item-info hasta
   partirlo letra por letra. */
.item-row{display:flex;flex-wrap:wrap;align-items:center;gap:0.8rem;padding:0.85rem;border-radius:12px;background:white;border:1px solid var(--border);margin-bottom:0.5rem;transition:all 0.2s;}
.item-row.clickable{cursor:pointer;}
.item-row.clickable:hover{border-color:var(--primary3);box-shadow:var(--shadow);transform:translateY(-1px);}
.item-ico{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.15rem;background:var(--off-white);border:1px solid var(--border);}
.item-ico.ig{background:var(--green-bg);color:var(--green);border-color:var(--green-border);}
.item-ico.iy{background:var(--yellow-bg);color:var(--yellow);border-color:var(--yellow-border);}
.item-ico.ir{background:var(--red-bg);color:var(--red);border-color:var(--red-border);}
.item-info{flex:1;min-width:0;}
.item-actions{display:flex;align-items:center;gap:0.5rem;flex-shrink:0;}

/* Avatar circular con inicial — usado en la lista de usuarios. */
.avatar-circle{width:38px;height:38px;border-radius:50%;background:var(--primary);color:white;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:0.85rem;flex-shrink:0;}

.btn-icon{background:var(--off-white);border:1px solid var(--border);color:var(--primary3);border-radius:8px;width:40px;height:40px;cursor:pointer;font-size:0.9rem;flex-shrink:0;transition:all 0.15s;}
.btn-icon:hover{background:var(--primary);border-color:var(--primary);color:white;}

/* ── SELECTOR DE MÓDULOS (pantalla de inicio del Inspector) ── */
.selector-row{display:flex;align-items:center;gap:0.9rem;padding:1rem;border-radius:14px;background:white;border:1px solid var(--border);margin-bottom:0.6rem;cursor:pointer;transition:all 0.2s;}
.selector-row:hover{border-color:var(--primary3);box-shadow:var(--shadow-lg);transform:translateY(-2px);}
.selector-ico{width:48px;height:48px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.5rem;background:linear-gradient(135deg,var(--primary3),var(--accent));box-shadow:0 4px 12px rgba(27,62,111,0.25);}
.selector-info{flex:1;}
.selector-name{font-weight:700;font-size:0.95rem;color:var(--text);}
.selector-sub{font-size:0.72rem;color:var(--text3);margin-top:2px;}
.selector-arrow{color:var(--primary3);font-size:1.2rem;font-weight:700;}

/* Íconos de pestaña (mod-tab) — refuerzan de un vistazo qué módulo es cada una. */
.mod-tab .mt-ico{margin-right:4px;}

/* ── COMBOBOX BUSCABLE (selects con miles de opciones: Cliente/Zona/Líder/Sector) ── */
.combo-wrap{position:relative;}
.combo-lista{position:absolute;top:100%;left:0;right:0;background:white;border:1px solid var(--border);border-radius:10px;margin-top:4px;max-height:220px;overflow-y:auto;box-shadow:var(--shadow-lg);z-index:30;display:none;}
.combo-lista.open{display:block;}
.combo-opt{padding:0.65rem 0.9rem;font-size:0.85rem;color:var(--text);cursor:pointer;border-bottom:1px solid var(--border);}
.combo-opt:last-child{border-bottom:none;}
.combo-opt:hover{background:var(--off-white);}
.combo-empty{padding:0.65rem 0.9rem;font-size:0.8rem;color:var(--text3);}
.combo-opt-nuevo{color:var(--primary3);font-weight:600;border-top:1px dashed var(--border);}
.combo-hint{padding:0.4rem 0.9rem;font-size:0.68rem;color:var(--text3);border-top:1px solid var(--border);}

/* ── LISTAS DE TARJETAS RESPONSIVAS ──
   Extintores, botiquines, vehículos, usuarios e historial de encuestas (todo
   lo que se pinta como .item-row en Admin o .ext-row en Inspector) pasa de
   apilarse una debajo de otra a acomodarse en columnas según el ancho de
   pantalla disponible. Los formularios y checklists NO entran en esta
   regla — esos se quedan en una sola columna a propósito (más fáciles de
   leer y llenar de arriba hacia abajo, incluso en un monitor grande). */
@media (min-width:768px){
  #adm-usuarios-lista, #adm-ext-lista, #adm-bot-lista, #adm-veh-lista,
  #adm-sst-historial, #insp-ext-lista, #insp-bot-lista, #insp-veh-lista{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
    gap:0.6rem;
  }
  #adm-usuarios-lista .item-row, #adm-ext-lista .item-row, #adm-bot-lista .item-row,
  #adm-veh-lista .item-row, #adm-sst-historial .item-row,
  #insp-ext-lista .ext-row, #insp-bot-lista .ext-row, #insp-veh-lista .ext-row{
    margin-bottom:0;
  }
  #insp-selector-lista{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
    gap:0.6rem;
  }
  #insp-selector-lista .selector-row{margin-bottom:0;}
}

/* ── TARJETAS DE UNA MISMA PANTALLA, UNA AL LADO DE LA OTRA ──
   Hasta acá lo responsive solo ensanchaba .content y acomodaba en columnas
   listas de elementos repetidos (extintores, botiquines, etc.), pero las
   tarjetas de una misma pantalla (ej. "Módulos contratados" + "Estado de
   la empresa" en el Panel; "Vehículos registrados" + "Checklist por tipo"
   en PESV) seguían apilándose una debajo de otra sin importar el ancho.
   `.page-grid` acomoda esas tarjetas en columnas a partir de escritorio,
   dejando que el navegador decida cuántas caben. Un `<button>` de acción
   suelto (ej. "Registrar vehículo") ocupa el ancho completo de su fila en
   vez de flotar solo junto a una tarjeta. */
@media (min-width:1100px){
  /* Ojo: .page-grid y .page tienen la misma especificidad que .page{display:none},
     así que si esta regla no exige también .active, una página con .page-grid
     (ej. #adm-panel, #adm-usuarios) queda SIEMPRE visible sin importar la pestaña
     activa — bug real detectado el 27 sep. Por eso se exige .active aquí. */
  .page.active.page-grid,
  .page-grid:not(.page){
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(380px,1fr));
    align-items:start;
    gap:1rem;
  }
  .page-grid > .card, .page-grid > .stat-grid{margin-bottom:0;}
  .page-grid > .btn-primary,
  .page-grid > .u-flex{grid-column:1 / -1;}
}

/* ── DETALLE DE ELEMENTO (Extintor/Botiquín/Vehículo): QR a la izquierda,
   historial/insumos a la derecha, en vez de todo apilado ── */
@media (min-width:900px){
  .detalle-grid{
    display:grid;
    grid-template-columns:260px 1fr;
    gap:1.5rem;
    align-items:start;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   REDISEÑO "APP WEB" DE ADMIN DE EMPRESA — MUESTRA (rama visual/responsive-consistencia)
   Todo lo de aquí en adelante está deliberadamente restringido a
   #s-admin-empresa: Inspector (#s-inspector) y Súper Admin (#s-superadmin,
   pendiente de una segunda pasada) no cambian ni de tipografía ni de
   estructura. Misma paleta de colores de siempre (variables de
   design-system.css) — lo que cambia es tipografía, esqueleto de
   navegación y densidad, no el color.
   ═══════════════════════════════════════════════════════════════════ */

/* Tipografía: se probó Space Grotesk/Inter y no gustó — Admin se queda
   con Plus Jakarta Sans/DM Mono de siempre (heredado de body en
   design-system.css). Nada que declarar acá. */

/* ── ESQUELETO: menú lateral fijo + contenido, en vez de topbar+pestañas
   horizontales. `.screen.active` (design-system.css) ya pone
   display:flex — solo hay que cambiar la dirección para esta pantalla. ── */
#s-admin-empresa.screen.active,
#s-superadmin.screen.active{flex-direction:row;align-items:stretch;}

.admin-sidebar{
  width:230px;flex-shrink:0;background:var(--primary);
  display:flex;flex-direction:column;
  padding:1.2rem 0.8rem;gap:0.3rem;
}
.sidebar-brand{
  font-size:1.1rem;font-weight:700;color:white;letter-spacing:-0.01em;
  display:flex;align-items:center;padding:0 0.4rem 0.9rem;
}
.sidebar-brand span{color:var(--accent2);}
.sidebar-role{
  font-size:0.68rem;font-weight:600;color:rgba(255,255,255,0.55);
  text-transform:uppercase;letter-spacing:0.06em;
  padding:0 0.4rem 1rem;border-bottom:1px solid rgba(255,255,255,0.1);
  margin-bottom:0.6rem;
}
.sidebar-nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto;}
.sidebar-logout{
  background:none;border:none;color:rgba(255,255,255,0.6);
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:0.8rem;
  text-align:left;padding:0.6rem 0.4rem 0;cursor:pointer;
  border-top:1px solid rgba(255,255,255,0.1);margin-top:0.6rem;
}
.sidebar-logout:hover{color:#fca5a5;}

/* Reutiliza .mod-tab (misma clase, mismo JS de cambiarPagina) pero como
   fila vertical de menú en vez de píldora horizontal — el fondo del
   sidebar es oscuro, así que el estado normal/activo se invierte. */
.sidebar-nav.mod-tabs{background:none;border:none;padding:0;}
.sidebar-nav .mod-tab{
  flex:none;text-align:left;padding:0.55rem 0.7rem;
  border-radius:8px;color:rgba(255,255,255,0.65);
  display:flex;align-items:center;font-size:0.82rem;
  border-left:3px solid transparent;
}
.sidebar-nav .mod-tab:hover{background:rgba(255,255,255,0.06);color:white;}
.sidebar-nav .mod-tab.active{
  background:rgba(255,255,255,0.1);color:white;box-shadow:none;
  border-left:3px solid var(--accent2);
}
.sidebar-nav .mod-tab .mt-ico{margin-right:8px;}

.admin-main{flex:1;min-width:0;overflow-y:auto;}
#s-admin-empresa .content{max-width:none;margin:0;padding:1.5rem;}
@media (min-width:1100px){
  #s-admin-empresa .content{padding:2rem 2.5rem;}
}

/* En pantalla angosta el sidebar deja de ser una barra que se desliza
   horizontalmente (no gustó, se sentía igual que las pestañas de antes
   pero peor) y pasa a ser un menú de cajón: una barra angosta arriba con
   el logo y un botón de hamburguesa, que abre el mismo sidebar como un
   panel que entra desde la izquierda por encima del contenido. */
.admin-mobile-bar{display:none;}
.admin-sidebar-overlay{display:none;}
@media (max-width:899px){
  #s-admin-empresa.screen.active,
  #s-superadmin.screen.active{flex-direction:column;}

  .admin-mobile-bar{
    display:flex;align-items:center;gap:0.8rem;
    background:var(--primary);padding:0.8rem 1rem;
    position:sticky;top:0;z-index:60;
  }
  .admin-menu-btn{
    background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.15);
    color:white;border-radius:8px;width:34px;height:34px;font-size:1rem;
    cursor:pointer;flex-shrink:0;
  }
  .mobile-bar-brand{color:white;font-weight:800;letter-spacing:-0.01em;}
  .mobile-bar-brand span{color:var(--accent2);}

  .admin-sidebar{
    position:fixed;top:0;left:0;bottom:0;width:250px;z-index:80;
    transform:translateX(-100%);transition:transform 0.25s ease,box-shadow 0.25s ease;
    box-shadow:none;
  }
  .admin-sidebar.open{transform:translateX(0);box-shadow:var(--shadow-lg);}
  .sidebar-nav{overflow-y:auto;}

  .admin-sidebar-overlay{
    display:block;position:fixed;inset:0;background:rgba(10,20,40,0.45);
    z-index:70;opacity:0;pointer-events:none;transition:opacity 0.2s ease;
  }
  .admin-sidebar-overlay.open{opacity:1;pointer-events:auto;}
}

/* ── Tarjetas y KPI: menos "burbuja de app de celular", más "documento de
   auditoría" — radio más chico, sombra más discreta, y el número del KPI
   con más peso tipográfico y un acento de color a la izquierda en vez de
   flotar suelto. ── */
#s-admin-empresa .card{border-radius:10px;box-shadow:none;}
#s-admin-empresa .stat-card{
  border-radius:10px;box-shadow:none;text-align:left;
  border-left:3px solid var(--border);padding:1rem 1.1rem;
}
#s-admin-empresa .stat-card.sc-g{border-left-color:var(--green);}
#s-admin-empresa .stat-card.sc-y{border-left-color:#D97706;}
#s-admin-empresa .stat-card.sc-r{border-left-color:var(--red);}
#s-admin-empresa .stat-num{font-size:2rem;line-height:1.1;}

/* ── Listas de elementos (Extintores/Botiquín/Vehículos/Usuarios): en
   escritorio se acomodan en filas de tabla real en vez de tarjetas
   flotantes — mismo HTML/JS de siempre (.item-row generado por
   pintarListaBuscable), solo cambia cómo se ve a partir de cierto ancho. ── */
@media (min-width:1100px){
  #s-admin-empresa .item-row{
    display:grid;grid-template-columns:44px 1fr auto;align-items:center;
    border-radius:0;border:none;border-bottom:1px solid var(--border);
    margin-bottom:0;padding:0.6rem 0.4rem;
  }
  #s-admin-empresa .item-row.clickable:hover{
    box-shadow:none;transform:none;background:var(--off-white);
  }
  #s-admin-empresa .item-row:first-child{border-top:1px solid var(--border);}
}
#s-admin-empresa .item-row{border-radius:10px;}

/* ── BOTONES: menos "botón de app con brillo", más control de un
   formulario serio — radio más chico, sin el resplandor de color debajo,
   sin el "levantarse" al pasar el mouse. ── */
#s-admin-empresa .btn-primary,
#s-admin-empresa .btn-submit,
#s-admin-empresa .btn-secondary-sm,
#s-admin-empresa .btn-icon{border-radius:8px;}
#s-admin-empresa .btn-submit{box-shadow:none;}
#s-admin-empresa .selector-row:hover,
#s-admin-empresa .emp-card-click:hover{transform:none;}

/* ── FORMULARIOS: mismo radio que botones/tarjetas (8-10px), consistente
   en toda la pantalla en vez de que cada input traiga el suyo. ── */
#s-admin-empresa .form-inp,
#s-admin-empresa .form-sel,
#s-admin-empresa .obs-input{border-radius:8px;}

/* ── FILAS DE DATOS (.doc-row): una línea más de aire y la etiqueta un
   punto menos pesada, para que no compita con el valor. ── */
#s-admin-empresa .doc-label{font-weight:600;}

/* ── DETALLE DE INSPECCIÓN (.check-item, usado en el historial de Admin
   dentro de un <summary> — no confundir con el checklist que llena el
   Inspector, que no se toca): mismo radio de 10px, borde más discreto. ── */
#s-admin-empresa .check-item{border-radius:10px;}
#s-admin-empresa .check-header{padding:0.7rem 0.85rem;}

/* ── TARJETAS "SELECTOR" (usadas en Usuarios/listas simples) y EMP-CARD:
   mismo radio de 10px para que todo en Admin comparta una sola esquina. ── */
#s-admin-empresa .selector-row,
#s-admin-empresa .selector-ico,
#s-admin-empresa .emp-card{border-radius:10px;}

/* ═══════════════════════════════════════════════════════════════════
   GIRO VISUAL POR MÓDULO — cada uno se apoya en su propio dato real
   (no es decoración: la barra de Botiquín usa cantidadActual/cantidadMinima
   que ya existían, el manómetro de Extintores usa fechaVencimiento, las
   fichas de Vehículos usan fechaVencimientoSoat/Tecnomecanica).
   ═══════════════════════════════════════════════════════════════════ */

/* ── EXTINTORES: manómetro de ciclo de recarga (365 días) en el detalle,
   con las mismas 3 franjas de color del semáforo del resto de la app. ── */
.ext-gauge{margin:0.8rem 0 1.2rem;}
.ext-gauge-valor{font-size:0.95rem;color:var(--text);font-weight:700;margin-bottom:0.5rem;}
.ext-gauge-track{
  height:10px;border-radius:6px;position:relative;
  background:linear-gradient(90deg,
    var(--red) 0%, var(--red) 8%,
    var(--yellow) 8%, var(--yellow) 20%,
    var(--green) 20%, var(--green) 100%);
}
.ext-gauge-marker{
  position:absolute;top:-4px;width:4px;height:18px;
  background:var(--text);border-radius:2px;transform:translateX(-50%);
  box-shadow:0 0 0 2px white,0 1px 3px rgba(0,0,0,0.3);
}
/* Las etiquetas de los extremos van SEPARADAS del valor (antes las tres
   competían por el mismo renglón angosto y en celular se encimaban —
   confuso, según feedback). Ahora el valor tiene su propio renglón
   arriba, y aquí solo quedan las dos etiquetas cortas de los extremos. */
.ext-gauge-caption{
  display:flex;justify-content:space-between;
  margin-top:0.5rem;font-size:0.64rem;color:var(--text3);
  text-transform:uppercase;letter-spacing:0.03em;
}
.ext-gauge-vacio{margin:0.8rem 0 1.2rem;}

/* ── BOTIQUÍN: cada insumo como fila de inventario con barra de nivel de
   existencias, no solo un badge de vencido/no vencido. ── */
.insumo-row{padding:0.75rem 0;border-bottom:1px solid var(--border);}
.insumo-row:last-child{border-bottom:none;}
.insumo-stock-track{height:6px;border-radius:4px;background:var(--border);margin-top:0.5rem;overflow:hidden;}
.insumo-stock-fill{height:100%;border-radius:4px;transition:width 0.3s;}
.insumo-stock-fill.insumo-stock-ok{background:var(--green);}
.insumo-stock-fill.insumo-stock-warn{background:#D97706;}
.insumo-stock-fill.insumo-stock-bad{background:var(--red);}
.insumo-stock-label{font-size:0.68rem;color:var(--text3);margin-top:3px;}

/* ── VEHÍCULOS: SOAT y Tecnomecánica como dos fichas de documento
   independientes, cada una con su propio semáforo — un vehículo puede
   tener una vencida y la otra al día, y antes eso se perdía en un solo
   texto largo. ── */
.veh-docs{display:flex;gap:0.7rem;flex-wrap:wrap;margin:0.9rem 0 1.2rem;}
.veh-doc-card{
  flex:1 1 160px;border-radius:10px;padding:0.8rem 0.9rem;
  border:1px solid var(--border);border-top:3px solid var(--border);
  background:var(--off-white);
}
.veh-doc-etiqueta{font-size:0.68rem;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:0.05em;}
.veh-doc-fecha{font-size:0.95rem;font-weight:700;color:var(--text);margin-top:0.3rem;}
.veh-doc-estado{font-size:0.75rem;color:var(--text3);margin-top:0.15rem;}
.veh-doc-card.veh-doc-green{border-top-color:var(--green);background:var(--green-bg);}
.veh-doc-card.veh-doc-green .veh-doc-estado{color:var(--green);}
.veh-doc-card.veh-doc-yellow{border-top-color:var(--yellow);background:var(--yellow-bg);}
.veh-doc-card.veh-doc-yellow .veh-doc-estado{color:var(--yellow);}
.veh-doc-card.veh-doc-red{border-top-color:var(--red);background:var(--red-bg);}
.veh-doc-card.veh-doc-red .veh-doc-estado{color:var(--red);}
.veh-doc-card.veh-doc-gray .veh-doc-estado{color:var(--text3);}

/* ── EPP: cada categoría (Cabeza, Manos, Pies...) como su propio bloque —
   un chaleco de EPP se revisa por zona del cuerpo, no como una lista
   plana de preguntas sueltas. ── */
.epp-cat-group{border:1px solid var(--border);border-radius:10px;margin-bottom:0.7rem;overflow:hidden;}
.epp-cat-titulo{
  background:var(--off-white);padding:0.55rem 0.85rem;
  font-size:0.72rem;font-weight:700;color:var(--primary2);
  text-transform:uppercase;letter-spacing:0.05em;
  border-bottom:1px solid var(--border);
}
.epp-cat-group .doc-row{padding:0.65rem 0.85rem;}
.epp-fila-critica{background:var(--red-bg);}

/* ── ALERTAS: línea de tiempo agrupada por urgencia (vencidos primero),
   en vez de una sola lista continua donde lo vencido y lo próximo se
   mezclaban visualmente. ── */
.alerta-grupo-titulo{
  font-size:0.72rem;font-weight:800;text-transform:uppercase;letter-spacing:0.05em;
  padding:0.4rem 0.2rem;margin-top:0.6rem;
}
.alerta-grupo-titulo:first-child{margin-top:0;}
.alerta-grupo-red{color:var(--red);}
.alerta-grupo-yellow{color:var(--yellow);}

/* ── SÚPER ADMIN: mismo lenguaje visual que Admin de empresa (radio de
   10px, sin sombra pesada, KPI con acento de color) — es la vista de
   "todos los clientes del SaaS", así que las 4 tarjetas de arriba
   (empresas totales/activas/suspendidas/en mora) son lo primero que
   importa, antes que la lista completa. ── */
#s-superadmin .card,
#s-superadmin .emp-card{border-radius:10px;box-shadow:none;}
#s-superadmin .stat-card{border-radius:10px;box-shadow:none;text-align:left;border-left:3px solid var(--border);padding:1rem 1.1rem;}
#s-superadmin .stat-card.sc-g{border-left-color:var(--green);}
#s-superadmin .stat-card.sc-r{border-left-color:var(--red);}
#s-superadmin .stat-num{font-size:1.8rem;}
#s-superadmin .btn-primary{border-radius:8px;}

/* ── ESCALA DE ESPACIADO (utilidades) ──
   Cada pantalla improvisaba su propio margen/gap para el mismo propósito
   (0.4, 0.7, 0.9, 1.2rem... todos usados sueltos como estilo en línea).
   Estas clases fijan una sola escala de 5 pasos para que la densidad se
   sienta igual en todos los módulos. Reemplazan estilos en línea que solo
   contenían separación — nunca color, tamaño ni texto. */
.u-mt-0{margin-top:0;}
.u-mt-xs{margin-top:0.4rem;}
.u-mt-sm{margin-top:0.6rem;}
.u-mt-md{margin-top:0.8rem;}
.u-mt-lg{margin-top:1rem;}
.u-mt-xl{margin-top:1.5rem;}
.u-mb-0{margin-bottom:0;}
.u-mb-sm{margin-bottom:0.6rem;}
.u-mb-md{margin-bottom:0.8rem;}
.u-mb-lg{margin-bottom:1rem;}
.u-gap-xs{gap:0.4rem;}
.u-gap-sm{gap:0.6rem;}
.u-gap-lg{gap:1rem;}
.u-flex{display:flex;}
.u-items-center{align-items:center;}
.u-justify-between{justify-content:space-between;}
.u-wrap{flex-wrap:wrap;}

/* ── BOTONES SECUNDARIOS PEQUEÑOS ──
   Antes cada módulo lograba un "botón chico" a punta de estilos en línea
   distintos entre sí (con o sin margen, con o sin salto de línea). Ahora
   es una sola clase reusable, igual en Extintores/Botiquín/Vehículos/
   Encuesta SST/EPP. */
.btn-inline{width:auto;white-space:nowrap;margin-top:0;}
.btn-secondary-sm{background:var(--off-white);border:1px solid var(--border);color:var(--primary3);border-radius:8px;width:auto;padding:4px 10px;font-size:0.8rem;font-weight:700;cursor:pointer;white-space:nowrap;font-family:'Plus Jakarta Sans',sans-serif;transition:all 0.15s;}
.btn-secondary-sm:hover{background:var(--primary);border-color:var(--primary);color:white;}
.btn-download{width:auto;margin-top:0.6rem;}

/* ── ENCABEZADO DE <summary> PLEGABLE (catálogos de Encuesta SST) ── */
.summary-header{padding:0.75rem;cursor:pointer;font-size:0.84rem;font-weight:700;color:var(--text);}

/* ── "RESUMEN" (adm-panel): grid tipo bento ──
   Antes todas las tarjetas del Resumen pesaban lo mismo en la cuadrícula
   genérica de .page-grid. Aquí el tamaño de cada una refleja su importancia
   (hallazgos críticos = la más grande) y cambia en 3 pasos: celular apilado
   (heredado de .page, sin tocar), tablet en 2 columnas, escritorio en un
   grid de 4 columnas con tarjetas de 1, 2 o 4 columnas de ancho. */
@media (min-width:700px) and (max-width:1099px){
  #s-admin-empresa #adm-panel.page.active.page-grid{grid-template-columns:repeat(2,1fr);}
  #s-admin-empresa #adm-panel .stat-grid,
  #s-admin-empresa #adm-panel .bento-wide{grid-column:1 / -1;}
}
@media (min-width:1100px){
  #s-admin-empresa #adm-panel.page.active.page-grid{grid-template-columns:repeat(4,1fr);}
  #s-admin-empresa #adm-panel .stat-grid,
  #s-admin-empresa #adm-panel .bento-wide{grid-column:1 / -1;}
  #s-admin-empresa #adm-panel .bento-sm{grid-column:span 1;}
  #s-admin-empresa #adm-panel .bento-md{grid-column:span 2;}
  #s-admin-empresa #adm-panel .bento-hero{grid-column:span 2;grid-row:span 2;}
}
#s-admin-empresa #adm-panel .bento-hero{border-left:3px solid var(--red);}
#s-admin-empresa #adm-panel .bento-hero #adm-panel-hallazgos-criticos{max-height:420px;overflow-y:auto;}

/* ── TENDENCIA DE HALLAZGOS CRÍTICOS POR MÓDULO ──
   Antes era una sola barra por semana sumando todos los módulos — no se
   podía saber SI el que está creciendo es Extintores o Botiquín. Ahora es
   un mini-gráfico por módulo (small multiples), todos con el mismo eje de
   tiempo para poder compararlos entre sí de un vistazo. Un solo color
   (rojo, el mismo de los badges de hallazgo crítico en toda la app) porque
   la identidad del módulo ya la da la posición/etiqueta, no el color. */
.tendencia-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0.75rem;}
.tendencia-modulo{background:var(--off-white);border:1px solid var(--border);border-radius:10px;padding:0.7rem 0.8rem;}
.tendencia-modulo-header{display:flex;justify-content:space-between;align-items:center;font-size:0.78rem;font-weight:700;color:var(--text);margin-bottom:0.6rem;}
.tendencia-total{background:var(--red);color:#fff;border-radius:999px;padding:0.05rem 0.5rem;font-size:0.72rem;font-family:'DM Mono',monospace;}
.tendencia-barras{display:flex;align-items:flex-end;gap:3px;height:56px;}
.tendencia-barra{flex:1;min-width:4px;background:var(--red);border-radius:4px 4px 0 0;}
.tendencia-barra.vacia{background:var(--border);}

/* ── RANKING DE HALLAZGOS POR MÓDULO: barras horizontales ──
   Reemplaza la lista plana de "módulo + badge" por barras que además de
   contar, muestran la magnitud relativa entre módulos de un vistazo. */
.ranking-fila{display:grid;grid-template-columns:minmax(90px,auto) 1fr 2ch;align-items:center;gap:0.6rem;margin-bottom:0.55rem;font-size:0.82rem;}
.ranking-modulo{color:var(--text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ranking-track{background:var(--border);border-radius:999px;height:8px;overflow:hidden;}
.ranking-fill{background:var(--red);height:100%;border-radius:999px;}
.ranking-num{text-align:right;font-family:'DM Mono',monospace;color:var(--text3);}

/* ── SELECTOR DE PERIODO (30/60/90 días) ──
   Filtra en memoria los datos que ya se trajeron una sola vez (siempre al
   máximo, 90 días) — cambiar de periodo nunca dispara una consulta nueva a
   Firestore, por eso el cambio se ve al instante. */
.card-title-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.9rem;}
.card-title-row .card-title{margin-bottom:0;}
.periodo-selector{display:flex;gap:4px;background:var(--off-white);border:1px solid var(--border);border-radius:999px;padding:2px;}
.periodo-btn{border:none;background:transparent;color:var(--text3);font-size:0.72rem;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;padding:0.3rem 0.65rem;border-radius:999px;cursor:pointer;transition:all 0.15s;}
.periodo-btn:hover{color:var(--text);}
.periodo-btn.active{background:var(--primary);color:#fff;}

/* ── INSPECCIONES POR MÓDULO: ESTE MES VS. ANTERIOR ── */
.comparativo-fila{display:grid;grid-template-columns:minmax(90px,auto) 1fr auto;align-items:center;gap:0.6rem;margin-bottom:0.5rem;font-size:0.82rem;}
.comparativo-modulo{color:var(--text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.comparativo-valores{font-family:'DM Mono',monospace;color:var(--text3);text-align:center;}
.comparativo-variacion{text-align:right;white-space:nowrap;font-size:0.78rem;}

/* ── ÚLTIMAS INSPECCIONES (todos los módulos) ── */
#adm-panel-ultimas{max-height:420px;overflow-y:auto;}
.ultima-insp-fila{display:flex;align-items:center;gap:0.8rem;padding:0.7rem 0.85rem;margin-bottom:0.45rem;border:1px solid var(--border);border-radius:10px;background:white;}

/* ── PANELES PERSONALIZABLES DEL RESUMEN: arrastrar, subir/bajar, ocultar ──
   Cada tarjeta de #adm-panel es un "widget" con drag & drop nativo (sin
   ninguna librería) + flechas ▲▼ como alternativa para celular, donde el
   drag & drop de HTML5 no funciona por tacto. El orden y los ocultos se
   guardan en localStorage, por usuario (ver `initPanelWidgets` en panel.js). */
.widget-panel{cursor:default;}
.widget-drag{cursor:grab;margin-right:0.4rem;color:var(--text3);}
.widget-panel.widget-arrastrando{opacity:0.4;}
.widget-panel.widget-hover-arriba{box-shadow:inset 0 3px 0 var(--primary);}
.widget-panel.widget-hover-abajo{box-shadow:inset 0 -3px 0 var(--primary);}
.widget-controls{display:flex;gap:2px;}
.widget-btn{border:none;background:var(--off-white);border:1px solid var(--border);color:var(--text3);width:30px;height:30px;border-radius:6px;cursor:pointer;font-size:0.75rem;line-height:1;}
.widget-btn:hover{background:var(--border);color:var(--text);}
.widget-btn-hide:hover{background:var(--red);border-color:var(--red);color:#fff;}
#adm-panel-ocultos-lista .doc-row:last-child{margin-bottom:0;}

/* ── Fotos de evidencia (Bloque 5) ── */
.fotos-fila{display:flex;gap:0.5rem;flex-wrap:wrap;margin:0.35rem 0 0.5rem 0;}
.foto-mini{width:72px;height:72px;border-radius:10px;border:1px solid var(--border);background:var(--off-white);padding:0;overflow:hidden;cursor:pointer;position:relative;display:inline-flex;align-items:center;justify-content:center;color:var(--text3);font-size:0.8rem;}
.foto-mini img{width:100%;height:100%;object-fit:cover;display:block;}
.foto-mini.subiendo{opacity:0.6;cursor:progress;}
.foto-mini.error{border-color:var(--red);color:var(--red);}
.foto-mini-quitar{position:absolute;top:0;right:0;width:28px;height:28px;border-radius:50%;border:none;background:rgba(0,0,0,0.65);color:white;font-size:0.8rem;cursor:pointer;line-height:1;padding:0;}
.foto-estado{font-size:0.7rem;color:var(--text2);margin:0 0 0.4rem 0;}
.foto-estado.error{color:var(--red);}
.visor-foto{position:fixed;inset:0;background:rgba(0,0,0,0.88);z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem;}
.visor-foto img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px;}
.visor-foto-msg{position:absolute;color:white;font-size:0.85rem;}
.visor-foto-cerrar{position:absolute;top:0.8rem;right:0.8rem;width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,255,255,0.2);color:white;font-size:1.1rem;cursor:pointer;}

/* ── Ventana emergente de avisos (guardado sin conexión, etc.) ── */
.aviso-modal{position:fixed;inset:0;background:rgba(10,20,40,0.6);z-index:10000;display:flex;align-items:center;justify-content:center;padding:1.2rem;}
.aviso-modal-caja{background:white;border-radius:16px;padding:1.3rem 1.2rem 1.1rem;max-width:380px;width:100%;box-shadow:0 12px 40px rgba(0,0,0,0.3);border-top:5px solid var(--primary3);}
.aviso-modal-caja.aviso{border-top-color:var(--yellow);}
.aviso-modal-caja.error{border-top-color:var(--red);}
.aviso-modal-titulo{font-size:1.05rem;font-weight:800;margin-bottom:0.6rem;color:var(--text);}
.aviso-modal-texto{font-size:0.88rem;line-height:1.5;color:var(--text2);margin-bottom:1.1rem;}
.aviso-modal-caja .btn-submit{width:100%;margin:0;}

/* Checklists con botón de foto (Extintores, Botiquín, Vehículos y EPP) en
   pantallas angostas: la pregunta ocupa su propia línea y los botones
   (respuesta, 📷, Obs.) van debajo. Así el texto no se aprieta ni se corta.
   (Extintores se agregó: tenía el mismo problema pero no el mismo arreglo.) */
@media (max-width:520px){
  #insp-checklist .check-header,
  #insp-bot-checklist .check-header,
  #insp-veh-checklist .check-header,
  #insp-epp-checklist .check-header{flex-wrap:wrap;row-gap:0.5rem;}
  #insp-checklist .check-header .check-text,
  #insp-bot-checklist .check-header .check-text,
  #insp-veh-checklist .check-header .check-text,
  #insp-epp-checklist .check-header .check-text{flex:1 1 100%;min-width:0;overflow-wrap:anywhere;}
  #insp-checklist .check-header > :last-child,
  #insp-bot-checklist .check-header > :last-child,
  #insp-veh-checklist .check-header > :last-child,
  #insp-epp-checklist .check-header > :last-child{margin-left:auto;}

  /* Botones de calificación y de detalle (📷/Obs.) más grandes para el dedo
     — hallazgo de la auditoría UX: 34px/28px quedaban por debajo del tamaño
     táctil cómodo recomendado (~44px). */
  .chk{width:42px;height:42px;font-size:0.72rem;}
  .det-btn{padding:7px 10px;font-size:0.72rem;}
}

/* ── TABLERO DE CUMPLIMIENTO DIARIO (PESV) ── */
.cumpl-kpis{display:grid;grid-template-columns:1fr 1fr;gap:0.7rem;margin-bottom:0.9rem;}
.cumpl-kpi{background:var(--off-white);border:1px solid var(--border);border-left:4px solid var(--border);border-radius:12px;padding:0.85rem 1rem;min-width:0;}
.cumpl-kpi-green{border-left-color:var(--green);}
.cumpl-kpi-yellow{border-left-color:#D97706;}
.cumpl-kpi-red{border-left-color:var(--red);}
.cumpl-kpi-titulo{font-size:0.68rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--text3);}
.cumpl-kpi-num{font-size:2rem;font-weight:800;line-height:1.15;color:var(--text);margin:0.15rem 0 0.45rem;}
.cumpl-kpi-green .cumpl-kpi-num{color:var(--green);}
.cumpl-kpi-yellow .cumpl-kpi-num{color:#D97706;}
.cumpl-kpi-red .cumpl-kpi-num{color:var(--red);}
.cumpl-kpi-track{height:6px;border-radius:999px;background:var(--border);overflow:hidden;}
.cumpl-kpi-fill{height:100%;border-radius:999px;}
.cumpl-kpi-sub{font-size:0.72rem;color:var(--text3);margin-top:0.45rem;line-height:1.35;}
.cumpl-green{background:var(--green);}
.cumpl-yellow{background:#D97706;}
.cumpl-red{background:var(--red);}
.cumpl-gray{background:var(--border);}
.cumpl-semana{display:grid;grid-template-columns:repeat(7,1fr);gap:0.35rem;background:var(--off-white);border:1px solid var(--border);border-radius:12px;padding:0.8rem 0.6rem 0.6rem;margin-bottom:1rem;}
.cumpl-dia{text-align:center;min-width:0;border-radius:8px;padding:0.2rem 0 0.3rem;}
.cumpl-hoy{background:white;box-shadow:0 0 0 1px var(--primary3);}
.cumpl-carril{height:64px;display:flex;align-items:flex-end;justify-content:center;margin:0 auto 0.35rem;width:62%;max-width:34px;background:white;border:1px solid var(--border);border-radius:6px;overflow:hidden;}
.cumpl-hoy .cumpl-carril{background:var(--off-white);}
.cumpl-barra{width:100%;border-radius:4px 4px 0 0;}
.cumpl-dia-nombre{font-size:0.66rem;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:0.03em;}
.cumpl-dia-num{font-size:0.8rem;font-weight:800;color:var(--text);}
.cumpl-dia-pct{font-family:'DM Mono',monospace;font-size:0.64rem;color:var(--text3);margin-top:1px;}
@media (max-width:340px){
  .cumpl-kpis{grid-template-columns:1fr;}
  .cumpl-semana{padding:0.7rem 0.3rem 0.5rem;gap:0.15rem;}
  .cumpl-dia-pct{font-size:0.58rem;}
}

/* ── BOTONES SECUNDARIOS GRANDES (Descargar plantilla, Subir Excel, Cancelar) ──
   Antes se veían deshabilitados (texto gris sobre fondo gris). */
.btn-primary.btn-sec{color:var(--primary3);border-color:var(--border);background:white;font-weight:700;}
.btn-primary.btn-sec:hover{background:var(--off-white);border-color:var(--primary3);color:var(--primary);}

/* Formularios de "nueva pregunta": en celular cada campo ocupa su línea. */
@media (max-width:640px){
  #s-admin-empresa form.u-flex.u-wrap > .form-sel{max-width:none !important;flex:1 1 160px !important;}
  #s-admin-empresa form.u-flex.u-wrap > .btn-primary.btn-inline{flex:1 1 100%;}
}

/* Texto de ayuda bajo el título de una tarjeta: un poco más grande y con más contraste. */
#s-admin-empresa .card > .emp-nit{font-size:0.78rem;color:var(--text2);line-height:1.45;margin-bottom:0.9rem;}
/* Los botones sueltos de una página (Registrar..., Excel) no se pegan a lo que sigue. */
.page-grid > .u-flex{margin-bottom:0.8rem;}
@media (min-width:1100px){ .page-grid > .u-flex{margin-bottom:0;} }
#s-admin-empresa form.u-flex.u-wrap > .form-sel{min-width:190px;}

/* Filas de lista: el texto tiene un mínimo de ancho y, si no cabe junto a la
   etiqueta de estado, esta baja a su propia línea (en vez de aplastar el texto). */
.item-info{flex:1 1 150px;}
.item-row .badge{white-space:nowrap;}
@media (max-width:480px){
  .cumpl-kpi{padding:0.75rem 0.8rem;}
  .cumpl-kpi-num{font-size:1.7rem;}
}

/* Paneles del Resumen: el título puede partirse en varias líneas, pero los
   botones de mover/ocultar se quedan siempre arriba a la derecha. */
.widget-panel .card-title-row{align-items:flex-start;}
.widget-panel .card-title-row .card-title{flex:1 1 120px;min-width:0;line-height:1.35;}
.widget-controls{margin-left:auto;flex-shrink:0;gap:3px;}
.widget-btn{width:26px;height:26px;font-size:0.68rem;border-radius:6px;}

/* ── RESULTADO EN VIVO DE LA INSPECCIÓN DE VEHÍCULO (Apto / Apto con observaciones / No apto) ── */
.resultado-box{margin-top:0.9rem;padding:0.85rem 1rem;border:1px solid var(--border);border-left:4px solid var(--border);border-radius:12px;background:var(--off-white);font-size:0.82rem;color:var(--text3);line-height:1.45;}
.resultado-titulo{font-size:1rem;font-weight:800;}
.resultado-motivos{margin:0.4rem 0 0 1.1rem;padding:0;color:var(--text2);}
.resultado-apto{background:var(--green-bg);border-color:var(--green-border);border-left-color:var(--green);color:var(--green);}
.resultado-apto_con_observaciones{background:var(--yellow-bg);border-color:var(--yellow-border);border-left-color:#D97706;color:var(--yellow);}
.resultado-no_apto{background:var(--red-bg);border-color:var(--red-border);border-left-color:var(--red);color:var(--red);}

/* ── RESUMEN: mismas piezas del tablero de cumplimiento ── */
.cumpl-kpi-de{font-size:1rem;font-weight:700;color:var(--text3);}
.cumpl-kpi-yellow .cumpl-kpi-num{color:#D97706;}
/* Cobertura por módulo */
.cob-fila{padding:0.75rem 0.9rem;margin-bottom:0.55rem;background:var(--off-white);border:1px solid var(--border);border-left:4px solid var(--border);border-radius:10px;}
.cob-green{border-left-color:var(--green);}
.cob-yellow{border-left-color:#D97706;}
.cob-red{border-left-color:var(--red);}
.cob-top{display:flex;justify-content:space-between;align-items:baseline;gap:0.5rem;margin-bottom:0.4rem;}
.cob-nombre{font-size:0.85rem;font-weight:700;color:var(--text);}
.cob-pct{font-size:1.25rem;font-weight:800;color:var(--text);}
.cob-green .cob-pct{color:var(--green);}
.cob-yellow .cob-pct{color:#D97706;}
.cob-red .cob-pct{color:var(--red);}
/* Módulos contratados */
.modulos-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0.5rem;}
.modulo-chip{display:flex;align-items:center;gap:0.55rem;padding:0.6rem 0.75rem;border:1px solid var(--border);border-left:4px solid var(--border);border-radius:10px;background:var(--off-white);min-width:0;}
.modulo-chip-on{border-left-color:var(--green);background:var(--green-bg);border-color:var(--green-border);border-left-color:var(--green);}
.modulo-chip-off{opacity:0.75;}
.modulo-chip-ico{font-size:1.1rem;flex-shrink:0;}
.modulo-chip-nombre{flex:1;min-width:0;font-size:0.8rem;font-weight:700;color:var(--text);line-height:1.25;}
.modulo-chip-estado{font-size:0.66rem;font-weight:800;text-transform:uppercase;letter-spacing:0.04em;color:var(--green);}
.modulo-chip-off .modulo-chip-estado{color:var(--text3);}
/* Filas internas de los paneles (Estado de la empresa, etc.) */
.widget-panel .doc-row{padding:0.65rem 0.85rem;margin-bottom:0.45rem;border:1px solid var(--border);border-radius:10px;background:var(--off-white);}
.widget-panel .doc-row:last-child{border-bottom:1px solid var(--border);margin-bottom:0;}
/* Ranking y tendencia: pistas más gruesas y suaves, como las barras del tablero */
.ranking-track{height:10px;background:var(--off-white);border:1px solid var(--border);}
.tendencia-modulo{background:var(--off-white);border-radius:12px;}
@media (min-width:640px){ #adm-panel-ultimas .ultima-insp-fila{padding:0.75rem 1rem;} }

/* ── Súper Admin: filtros de empresas y tarjetas de números ── */
.sup-filtros{display:flex;flex-wrap:wrap;gap:0.4rem;margin-bottom:0.9rem;}
.sup-filtro{border:1px solid var(--border);background:white;color:var(--text2);border-radius:999px;padding:0.35rem 0.85rem;font:inherit;font-size:0.76rem;font-weight:700;cursor:pointer;}
.sup-filtro.on{background:var(--primary);border-color:var(--primary);color:white;}
#s-superadmin .cumpl-kpis{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));}
#s-superadmin .item-ico{font-size:0.8rem;font-weight:800;}

/* ── Aviso de vigencia del servicio ── */
.aviso-vigencia{display:flex;flex-direction:column;gap:2px;padding:0.75rem 1rem;border-radius:12px;border:1px solid var(--border);border-left:4px solid var(--border);font-size:0.82rem;line-height:1.4;margin-bottom:0.2rem;}
.aviso-vigencia strong{font-size:0.86rem;}
.aviso-vigencia-info{background:var(--off-white);border-left-color:var(--primary);}
.aviso-vigencia-warn{background:var(--yellow-bg);border-color:var(--yellow-border);border-left-color:#D97706;}
.aviso-vigencia-error{background:var(--red-bg);border-color:var(--red-border);border-left-color:var(--red);}
.vig-accion{display:flex;gap:0.5rem;margin-top:0.6rem;}
.vig-accion .form-sel,.vig-accion .form-inp{flex:1;min-width:0;}
.vig-accion .btn-primary{flex:0 0 auto;width:auto;white-space:nowrap;}
.zona-peligro{border:1px solid var(--red-border);background:var(--red-bg);border-radius:12px;padding:0.9rem 1rem;display:flex;flex-direction:column;gap:0.6rem;font-size:0.82rem;color:var(--text2);line-height:1.4;}
.zona-peligro .btn-primary{width:100%;}
.btn-peligro{background:var(--red)!important;border-color:var(--red)!important;color:white!important;}

/* ── Pulido inspector: selector de módulos, filas y insumos del botiquín ── */
.selector-row{border-radius:12px;padding:0.85rem;gap:0.8rem;}
.selector-row:hover{transform:none;box-shadow:var(--shadow);}
.selector-ico{width:42px;height:42px;border-radius:11px;font-size:1.25rem;background:var(--off-white);border:1px solid var(--border);box-shadow:none;}
.selector-name{font-size:0.88rem;}
.ext-ico{width:42px;height:42px;border-radius:11px;border:1px solid var(--border);}
.eig{border-color:var(--green-border);}
.eiy{border-color:var(--yellow-border);}
.eir{border-color:var(--red-border);}
.ext-info{min-width:0;}
.ins-btns{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem;}
.ins-btns .chk{width:auto;height:42px;font-size:0.82rem;}
.ins-campos{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;}
.ins-campo{display:flex;flex-direction:column;gap:3px;min-width:0;}
.ins-lbl{font-size:0.66rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--text3);}
.ins-campos .form-inp{min-width:0;width:100%;}

/* Lista del widget "Vencimientos activos": compacta para que no se aplaste */
.venc-fila{padding:0.65rem 0.75rem;gap:0.65rem;flex-wrap:nowrap;}
.venc-fila .item-ico{width:36px;height:36px;font-size:1rem;}
.venc-fila .item-info{flex:1 1 0;min-width:0;}
.venc-fila .doc-label{overflow-wrap:anywhere;}
.venc-fila .badge{flex-shrink:0;}

/* Formularios de "nueva encuesta/inspección" del inspector en PC: 2 columnas */
@media (min-width:900px){
  #insp-sst-nueva-form, #insp-epp-nueva-form{display:grid;grid-template-columns:1fr 1fr;column-gap:1rem;}
  #insp-sst-nueva-form > .btn-primary, #insp-epp-nueva-form > .btn-primary,
  #insp-sst-nueva-form > button[type=submit], #insp-epp-nueva-form > button[type=submit]{grid-column:1 / -1;}
}

/* Cabecera de cada inspección en el historial del admin */
.summary-header .sum-fecha{display:block;font-size:0.86rem;font-weight:800;color:var(--text);}
.summary-header .sum-sub{display:block;font-size:0.76rem;font-weight:500;color:var(--text2);margin:2px 0 6px;}
.summary-header .sum-badges{display:flex;flex-wrap:wrap;gap:4px;}
/* Botones de la cabecera de los detalles: que bajen de línea en el celular */
#s-admin-empresa [id$="-detalle"] > .u-flex.u-justify-between{flex-wrap:wrap;gap:0.5rem;}
#s-admin-empresa [id$="-detalle"] > .u-flex.u-justify-between > .u-flex{flex-wrap:wrap;}
.summary-header:has(.sum-fecha){list-style:none;}
.summary-header:has(.sum-fecha)::-webkit-details-marker{display:none;}
.summary-header .sum-fecha::before{content:"▸";display:inline-block;width:1.1em;color:var(--primary3);}
details[open] > .summary-header .sum-fecha::before{content:"▾";}

/* ── Espaciado de los "agregar nuevo …" en los módulos del admin ── */
/* Botón principal + Excel: no pegados entre sí ni a la tarjeta anterior */
#s-admin-empresa .page > .btn-primary{margin-top:1rem;margin-bottom:0.7rem;}
#s-admin-empresa .page > .u-flex.u-wrap{gap:0.7rem;margin-bottom:1rem;}
#s-admin-empresa .page > .u-flex.u-wrap > .btn-primary{margin-top:0;}
/* Formulario "agregar pregunta al checklist": separado de la lista con una línea */
#s-admin-empresa form[id$="-check-form"]{margin-top:1.1rem;padding-top:1.1rem;border-top:1px solid var(--border);row-gap:0.7rem;}
#s-admin-empresa form[id$="-check-form"] .btn-primary{margin-top:0;}
@media (max-width:640px){
  #s-admin-empresa form[id$="-check-form"] > .btn-primary{width:100%;flex:1 1 100%;}
}
/* Formulario de conductor dentro de su tarjeta: recuadro propio */
#adm-cond-form-wrap{padding:1rem;border:1px solid var(--border);border-radius:12px;background:var(--off-white);margin-top:1rem;}
#adm-cond-btn-nuevo{margin-top:1rem;}
#adm-cond-form .u-flex{gap:0.7rem;}
#adm-cond-form .u-flex > .btn-primary{flex:1;width:auto;margin-top:0.6rem;}
/* Botones Cancelar / Registrar de los formularios: mismo ancho y separados del último campo */
#s-admin-empresa form .u-flex.u-gap-sm > .btn-primary{flex:1;}
#s-admin-empresa form .u-flex.u-gap-sm{margin-top:0.4rem;}
#adm-cond-form > .u-flex > .u-flex{flex:1 1 100%;}
#adm-cond-form .doc-sub{margin-top:0.35rem;line-height:1.4;}

/* ── Encabezado del detalle (Encuesta SST / EPP): botones iguales y con aire ── */
#adm-sst-detalle > .u-flex.u-justify-between,
#adm-epp-detalle > .u-flex.u-justify-between{align-items:center;margin-bottom:1rem;}
#adm-sst-detalle .btn-download,
#adm-epp-detalle .btn-download,
#adm-sst-detalle #adm-sst-eliminar,
#adm-epp-detalle #adm-epp-eliminar{
  margin-top:0;height:38px;padding:0 0.9rem;font-size:0.8rem;font-weight:700;
  border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:0.3rem;
}
#adm-sst-detalle .card-title,#adm-epp-detalle .card-title{margin-top:0.2rem;}
#adm-sst-det-respuestas > .doc-sub{
  margin:1.1rem 0 0.4rem !important;padding:0.35rem 0.7rem;background:var(--off-white);
  border-radius:8px;color:var(--primary3);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;
}
@media (max-width:640px){
  #adm-sst-detalle > .u-flex.u-justify-between > .u-flex,
  #adm-epp-detalle > .u-flex.u-justify-between > .u-flex{width:100%;}
  #adm-sst-detalle > .u-flex.u-justify-between > .u-flex > button,
  #adm-epp-detalle > .u-flex.u-justify-between > .u-flex > button{flex:1;}
}

/* ── Fallas de vehículos (PESV) ── */
.falla-grupo{border:1px solid var(--border);border-radius:12px;padding:0.2rem 0.75rem 0.75rem;margin-bottom:0.7rem;background:white;}
#s-admin-empresa .falla-grupo .item-row{border:none;border-radius:0;background:transparent;box-shadow:none;margin:0;padding:0.6rem 0 0;}
.falla-badges{display:flex;flex-direction:column;align-items:flex-end;gap:0.3rem;flex-shrink:0;}
.falla-obs{font-style:italic;margin-top:0.2rem;}
.falla-acciones{display:flex;flex-wrap:wrap;gap:0.5rem;justify-content:flex-end;margin-top:0.5rem;}
.falla-acciones .btn-secondary-sm{padding:0.5rem 0.85rem;}
.falla-acciones .falla-btn-ok{color:var(--green);}
.falla-kpis{grid-template-columns:repeat(4,1fr);}
.veh-det-fallas{margin:1rem 0 1.4rem;}
@media (max-width:640px){
  .falla-kpis{grid-template-columns:1fr 1fr;}
  .falla-acciones .btn-secondary-sm{flex:1 1 auto;}
  .falla-badges{flex-direction:row;flex-wrap:wrap;justify-content:flex-end;}
}

/* ── Bloqueo, autorización de salida y estado operativo (PESV) ── */
.veh-aviso{border:1px solid var(--border);border-left:4px solid var(--border);border-radius:12px;padding:0.75rem 0.9rem;margin:0.7rem 0;font-size:0.85rem;line-height:1.45;color:var(--text);background:var(--off-white);}
.veh-aviso strong{display:block;margin-bottom:0.2rem;}
.veh-aviso-rojo{border-left-color:var(--red);background:#fdecea;}
.veh-aviso-amarillo{border-left-color:#D97706;background:#fff7e6;}
.veh-aviso-gris{border-left-color:var(--text3);}
.veh-aviso-motivos{font-weight:600;color:var(--red);margin:0.15rem 0 0.3rem;}
.veh-aviso-amarillo .veh-aviso-motivos{color:#92400E;}
.veh-aviso-sub{font-size:0.78rem;color:var(--text3);}
.veh-aviso-lista{margin:0.3rem 0 0.3rem 1.1rem;padding:0;}
.veh-aviso-acciones{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:0.6rem;}
.veh-aviso-acciones .btn-secondary-sm{padding:0.5rem 0.85rem;}
.veh-aviso-rojo #adm-veh-autorizar{color:var(--red);border-color:#f5c2bd;background:white;}
.veh-estado-panel{margin:0.8rem 0 0.4rem;}
.veh-estado-op{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0.6rem;border:1px solid var(--border);border-radius:12px;padding:0.7rem 0.9rem;}
.veh-estado-op .veh-aviso-acciones{margin-top:0;}
.veh-estado-op .doc-sub{display:inline;margin-left:0.4rem;}
.veh-insp-etiquetas{display:flex;flex-wrap:wrap;gap:0.3rem;margin-top:0.35rem;}
@media (max-width:640px){
  .veh-estado-op .veh-aviso-acciones .btn-secondary-sm{flex:1 1 auto;}
}

/* ── Mantenimiento de vehículos (PESV) ── */
.veh-det-mant{margin:1.2rem 0 1rem;}
.veh-det-mant-cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0.6rem;margin-bottom:0.5rem;}
.veh-det-mant-cab .btn-secondary-sm{padding:0.5rem 0.85rem;}
.mant-form-wrap{border:1px solid var(--border);border-radius:12px;background:var(--off-white);padding:1rem;margin:0.8rem 0;}
.mant-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 0.9rem;}
.mant-chips{display:flex;flex-wrap:wrap;gap:0.45rem;}
.mant-chip{display:inline-flex;align-items:center;gap:0.35rem;border:1px solid var(--border);border-radius:999px;padding:0.4rem 0.75rem;background:white;font-size:0.82rem;cursor:pointer;}
.mant-chip input{margin:0;}
.mant-checks{display:flex;flex-direction:column;gap:0.4rem;}
.mant-check{display:flex;align-items:center;gap:0.45rem;font-size:0.85rem;border:1px solid var(--border);border-radius:10px;padding:0.5rem 0.7rem;background:white;}
.mant-rutina-form{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border);}
.mant-rutina-cada{display:grid;grid-template-columns:1fr 1fr;gap:0 0.9rem;}
#adm-mant-programados .falla-grupo:first-child,#adm-mant-lista .falla-grupo:first-child{margin-top:0.2rem;}
@media (max-width:640px){
  .mant-form-grid{grid-template-columns:1fr;}
  .veh-det-mant-cab .u-flex{width:100%;}
  .veh-det-mant-cab .btn-secondary-sm{flex:1 1 auto;}
}

/* ── Gestión PESV (siniestros y comparendos) ── */
#s-admin-empresa #adm-pesv .bento-wide{grid-column:1 / -1;}
.sin-personas{display:grid;grid-template-columns:repeat(3,1fr);gap:0 0.7rem;}
#adm-pesv .mant-form-wrap{margin-top:1rem;}
#adm-pesv .pesv-form-btns{flex:1 1 260px;justify-content:flex-end;}
#adm-pesv .pesv-form-btns .btn-primary{flex:1;width:auto;margin-top:0;}
#adm-pesv .cumpl-kpi-num{font-size:1.6rem;}
@media (max-width:640px){
  .sin-personas{grid-template-columns:repeat(3,1fr);}
}
.sin-personas{align-items:end;}
#adm-pesv form > .u-flex.u-justify-between{align-items:center;}

/* ── Capacitaciones PESV ── */
.cap-asistente-form{border:1px dashed var(--border);border-radius:12px;padding:0.8rem;background:white;}
.cap-firma-canvas{display:block;width:100%;max-width:520px;height:150px;border:1px solid var(--border);border-radius:10px;background:white;touch-action:none;}
.cap-asist-row{display:flex;align-items:center;gap:0.7rem;padding:0.5rem 0;border-bottom:1px solid var(--border);}
.cap-asist-row:last-child{border-bottom:none;}
.cap-asist-row .item-info{flex:1;min-width:0;}
.cap-asist-row .firma-mini img{max-width:110px !important;max-height:44px !important;}
.cap-asist-row .btn-secondary-sm{padding:0.35rem 0.6rem;}

/* ── Centro de reporte PESV ── */
.rep-filtros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:0 0.8rem;align-items:end;}
.rep-filtros .btn-primary{margin-top:0;margin-bottom:1rem;width:auto;padding-left:1.6rem;padding-right:1.6rem;}
.rep-config{border:1px solid var(--border);border-radius:12px;padding:0.7rem 0.9rem;margin-bottom:1rem;background:var(--off-white);}
.rep-config .form-inp{margin:0;}
.rep-grupo{margin-top:1rem;}
.rep-grupo-titulo{font-size:0.72rem;font-weight:800;letter-spacing:0.06em;text-transform:uppercase;color:var(--primary3);margin-bottom:0.3rem;}
.rep-fila{display:flex;justify-content:space-between;gap:1rem;padding:0.5rem 0;border-bottom:1px solid var(--border);font-size:0.86rem;}
.rep-fila:last-child{border-bottom:none;}
.rep-fila .rep-valor{font-weight:800;white-space:nowrap;font-family:'DM Mono',monospace;}
.rep-fila .rep-nota{display:block;font-size:0.74rem;color:var(--text3);}
.rep-tabla-wrap{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem;}
@media (max-width:900px){ .rep-tabla-wrap{grid-template-columns:1fr;} }
@media (max-width:640px){
  .rep-filtros{grid-template-columns:1fr 1fr;}
  .rep-filtros .btn-primary{grid-column:1 / -1;width:100%;}
}
.cap-firmar-wrap{border:2px solid var(--primary3);border-radius:12px;padding:0.8rem;background:white;margin:0.5rem 0 0.8rem;}
.cap-aviso-firmas{font-size:0.8rem;font-weight:600;color:#92400E;background:#fff7e6;border-radius:8px;padding:0.45rem 0.7rem;margin-bottom:0.4rem;}
.cap-aviso-firmas.cap-aviso-ok{color:var(--green);background:#eaf7ef;}
.cap-btn-firmar{color:var(--primary3);font-weight:700;}
.cap-pend-app{font-size:0.72rem;font-weight:700;color:#92400E;background:#fff7e6;border-radius:999px;padding:0.2rem 0.55rem;white-space:nowrap;}

/* ── Aviso de firmas pendientes (inspector / conductor) ── */
#insp-firmas-banner{margin-bottom:0.9rem;}
.insp-firmas-aviso{display:flex;align-items:center;gap:0.8rem;width:100%;text-align:left;border:1px solid #f3d38a;background:#fff7e6;color:#7a4a00;border-radius:14px;padding:0.85rem 1rem;cursor:pointer;font-family:inherit;font-size:0.9rem;}
.insp-firmas-aviso > span:last-child{margin-left:auto;font-size:1.4rem;font-weight:700;}
.insp-firmas-ico{width:40px;height:40px;border-radius:10px;background:white;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;}
.insp-firmas-sub{display:block;font-size:0.78rem;font-weight:500;opacity:0.85;}
#insp-firmas-lista .ext-row{cursor:pointer;}

/* ── PESV: evidencias, investigación del siniestro, gráfica y pruebas ── */
.sin-evidencia{background:var(--off-white);border:1px dashed var(--border);border-radius:12px;padding:0.6rem 0.7rem;}
.sin-evid-btn{display:inline-flex;align-items:center;gap:0.5rem;cursor:pointer;font-size:0.82rem;font-weight:700;color:var(--primary3);}
.sin-evid-btn .det-btn{font-size:1rem;min-width:44px;min-height:40px;border-radius:10px;background:white;}
.sin-evid-btn .det-btn:disabled{opacity:0.5;cursor:not-allowed;}
.sin-evidencia .fotos-fila{margin-bottom:0;}
.sin-inv-head{display:flex;align-items:center;justify-content:space-between;gap:0.6rem;flex-wrap:wrap;margin-bottom:0.35rem;}
.sin-inv-head .form-lbl{margin:0;}
.sin-accion{border:1px solid var(--border);border-left:4px solid #D97706;border-radius:12px;padding:0.65rem 0.7rem;margin-bottom:0.6rem;background:white;}
.sin-accion.cumplida{border-left-color:var(--green);}
.sin-accion.vencida{border-left-color:var(--red);background:#FEF2F2;}
.sin-accion-top{display:flex;gap:0.5rem;align-items:center;}
.sin-accion-top .form-inp{flex:1;margin:0;}
.sin-accion-quitar{flex-shrink:0;width:36px;height:36px;border-radius:10px;border:1px solid var(--border);background:white;color:var(--text3);cursor:pointer;font-size:0.85rem;}
.sin-accion-quitar:hover{color:var(--red);border-color:var(--red);}
.sin-accion-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem 0.7rem;margin-top:0.55rem;align-items:end;}
.sin-accion-campo{display:flex;flex-direction:column;gap:0.2rem;font-size:0.7rem;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:0.04em;}
.sin-accion-campo .form-inp{margin:0;text-transform:none;letter-spacing:0;font-weight:500;}
.sin-accion-check{display:inline-flex;align-items:center;gap:0.4rem;font-size:0.85rem;font-weight:700;color:var(--text);min-height:40px;cursor:pointer;}
.sin-accion-check input{width:18px;height:18px;margin:0;}
.sin-accion-aviso{font-size:0.75rem;color:var(--red);font-weight:700;margin-top:0.45rem;}

.sin-graf-card{border:1px solid var(--border);border-radius:14px;padding:0.8rem 0.8rem 0.7rem;margin-bottom:1rem;background:white;}
.sin-graf-head{display:flex;align-items:center;justify-content:space-between;gap:0.6rem;margin-bottom:0.6rem;}
.sin-graf-head .form-lbl{margin:0;}
.sin-graf-anio{max-width:110px;margin:0;}
.sin-graf{display:grid;grid-template-columns:repeat(12,1fr);gap:0.3rem;align-items:end;}
.sin-graf-mes{text-align:center;min-width:0;border-radius:8px;padding:0.15rem 0;outline:none;}
.sin-graf-mes:hover,.sin-graf-mes:focus-visible{background:var(--off-white);}
.sin-graf-mes.futuro{opacity:0.45;}
.sin-graf-num{font-family:'DM Mono',monospace;font-size:0.7rem;font-weight:600;color:var(--text);height:1rem;}
.sin-graf-carril{height:96px;width:70%;max-width:26px;margin:0 auto 0.3rem;display:flex;flex-direction:column-reverse;gap:2px;justify-content:flex-start;border-bottom:1px solid var(--border);}
.sin-graf-seg{display:block;width:100%;min-height:3px;}
.sin-graf-seg:last-child{border-radius:4px 4px 0 0;}
.sin-graf-lbl{font-size:0.64rem;font-weight:700;color:var(--text3);text-transform:uppercase;}
.sin-graf-leyenda{display:flex;flex-wrap:wrap;gap:0.4rem 0.9rem;margin-top:0.6rem;font-size:0.72rem;color:var(--text2, #4A5568);}
.sin-graf-ley{display:inline-flex;align-items:center;gap:0.35rem;}
.sin-graf-ley i{width:10px;height:10px;border-radius:3px;display:inline-block;}
.sin-conteos{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0.9rem;margin-top:0.9rem;padding-top:0.8rem;border-top:1px solid var(--border);}
.sin-conteo-titulo{font-size:0.68rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--text3);margin-bottom:0.4rem;}
.sin-conteo-fila{display:grid;grid-template-columns:minmax(0,1.7fr) 1fr 1.6rem;gap:0.5rem;align-items:center;font-size:0.76rem;margin-bottom:0.3rem;}
.sin-conteo-txt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);}
.sin-conteo-carril{height:8px;background:var(--off-white);border-radius:999px;overflow:hidden;}
.sin-conteo-barra{display:block;height:100%;background:var(--primary3);border-radius:999px;}
.sin-conteo-num{font-family:'DM Mono',monospace;font-weight:600;text-align:right;color:var(--text);}

.cond-prueba{display:flex;align-items:center;gap:0.6rem;border:1px solid var(--border);border-radius:12px;padding:0.55rem 0.65rem;margin-bottom:0.5rem;background:white;}
.cond-prueba-info{flex:1;min-width:0;}
.cond-prueba-nueva{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem;background:var(--off-white);border:1px dashed var(--border);border-radius:12px;padding:0.6rem;}
.cond-prueba-nueva .form-inp,.cond-prueba-nueva .form-sel{margin:0;}
.cond-prueba-nueva #adm-cond-p-tipo,.cond-prueba-nueva #adm-cond-p-evaluador,.cond-prueba-nueva .cond-prueba-obs{grid-column:1 / -1;}
.cond-prueba-nueva .btn-secondary-sm{grid-column:1 / -1;justify-self:start;}
@media (max-width:640px){
  .sin-accion-grid{grid-template-columns:1fr;}
  .sin-conteos{grid-template-columns:1fr;}
  .cond-prueba-nueva > *{grid-column:1 / -1;}
  .sin-graf{gap:0.12rem;}
  .sin-graf-lbl{font-size:0.56rem;}
}

/* Combos de comparendo (infracción y municipio) */
.mant-span2{grid-column:1 / -1;}
.combo-opt-sub{font-size:0.72rem;color:var(--text3);margin-top:2px;}

/* Cuadros de texto: crecen solos (shared/textarea-auto.js) y se pueden estirar. */
textarea.form-inp{resize:vertical;min-height:4.2rem;line-height:1.45;}

/* ── Acceso a la app del conductor ── */
.usr-cond-grupo{background:var(--off-white);border:1px dashed var(--border);border-radius:12px;padding:0.75rem;margin-bottom:1rem;}
.cond-acceso{border:1px solid var(--border);border-radius:12px;padding:0.75rem;background:white;}
.cond-acceso .emp-modulo-fila{margin-bottom:0;}
.cond-acceso-campos{margin-top:0.7rem;padding-top:0.7rem;border-top:1px dashed var(--border);}
.cond-acceso-ok{display:flex;align-items:center;justify-content:space-between;gap:0.6rem;flex-wrap:wrap;background:#ECFDF5;border:1px solid #A7F3D0;border-radius:10px;padding:0.6rem 0.7rem;}
.cond-acceso-ok.inactivo{background:var(--off-white);border-color:var(--border);}
.cond-radio{display:flex;align-items:center;gap:0.5rem;font-size:0.85rem;color:var(--text);padding:0.35rem 0;cursor:pointer;min-height:36px;}
.cond-radio input{width:18px;height:18px;margin:0;flex-shrink:0;}
.cond-llave{flex-shrink:0;}

/* ── Reportes del PESV ── */
.rpesv-periodo{display:flex;flex-wrap:wrap;gap:0.6rem 0.8rem;align-items:flex-end;}
.rpesv-periodo .form-group{flex:1 1 170px;margin-bottom:0;}
.rpesv-btn-ver{flex:0 0 auto;width:auto;padding-left:1.4rem;padding-right:1.4rem;}
#adm-rpesv-estado{margin-top:0.6rem;}
.rpesv-destacados{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0.8rem;margin-bottom:1.1rem;}
.rpesv-dest{display:flex;flex-wrap:wrap;align-items:center;gap:0.7rem;border:1px solid var(--border);border-radius:14px;padding:0.85rem;background:linear-gradient(180deg,#fff,var(--off-white));}
.rpesv-dest-ico{font-size:1.5rem;width:44px;height:44px;border-radius:12px;background:white;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.rpesv-dest-txt{flex:1 1 180px;min-width:0;}
.rpesv-dest .btn-primary{flex:1 1 100%;}
.rpesv-grupo{margin-bottom:1rem;}
.rpesv-grupo-titulo{font-size:0.72rem;font-weight:800;letter-spacing:0.06em;text-transform:uppercase;color:var(--text3);margin:0 0 0.45rem;}
.rpesv-fila{display:flex;align-items:center;gap:0.8rem;border:1px solid var(--border);border-radius:12px;padding:0.65rem 0.75rem;margin-bottom:0.5rem;background:white;}
.rpesv-fila-txt{flex:1;min-width:0;}
.rpesv-fila-acc{display:flex;align-items:center;gap:0.5rem;flex-shrink:0;}
.rpesv-conteo{font-family:'DM Mono',monospace;font-size:0.72rem;font-weight:600;color:var(--primary3);background:var(--off-white);border:1px solid var(--border);border-radius:999px;padding:0.15rem 0.55rem;white-space:nowrap;}
.rpesv-conteo.vacio{color:var(--text3);}
.rpesv-conteo.cargando{color:var(--text3);}
.rpesv-hoy{display:inline-block;font-size:0.62rem;font-weight:800;letter-spacing:0.05em;text-transform:uppercase;color:#0F766E;background:#CCFBF1;border-radius:999px;padding:0.05rem 0.45rem;vertical-align:middle;margin-left:0.25rem;}
@media (max-width:640px){
  .rpesv-fila{flex-direction:column;align-items:stretch;gap:0.5rem;}
  .rpesv-fila-acc{justify-content:space-between;}
  .rpesv-btn-ver{flex:1 1 100%;}
}

/* ── Asistente de arranque del PESV ── */
.arranque{border:1px solid #BFD3F2;background:linear-gradient(180deg,#F5F9FF,#fff);}
.arranque-head{display:flex;align-items:flex-start;justify-content:space-between;gap:0.8rem;}
.arranque-barra{height:8px;border-radius:999px;background:var(--off-white);border:1px solid var(--border);overflow:hidden;margin:0.8rem 0 0.9rem;}
.arranque-barra div{height:100%;background:var(--primary3);border-radius:999px;transition:width .3s;}
.arranque-pasos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0.45rem;}
.arranque-paso{display:flex;align-items:center;gap:0.65rem;border:1px solid var(--border);border-radius:12px;padding:0.6rem 0.7rem;background:white;}
.arranque-paso.hecho{background:var(--off-white);opacity:0.75;}
.arranque-paso.hecho .doc-label{text-decoration:line-through;color:var(--text3);}
.arranque-paso.siguiente{border-color:var(--primary3);box-shadow:0 0 0 2px rgba(45,101,184,0.12);}
.arranque-num{flex-shrink:0;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:800;background:var(--off-white);color:var(--text3);border:1px solid var(--border);}
.arranque-paso.hecho .arranque-num{background:var(--green);color:white;border-color:var(--green);}
.arranque-paso.siguiente .arranque-num{background:var(--primary3);color:white;border-color:var(--primary3);}
.arranque-txt{flex:1;min-width:0;}
.arranque-ir{flex-shrink:0;width:auto;white-space:nowrap;padding:0.45rem 0.8rem;font-size:0.8rem;}
.arranque-resaltar{outline:3px solid var(--primary3);outline-offset:4px;border-radius:12px;transition:outline-color .4s;}
@media (max-width:640px){
  .arranque-paso{flex-wrap:wrap;}
  .arranque-ir{flex:1 1 100%;}
}

/* Casilla de empresa de demostración (Súper Admin) */
.emp-demo-fila{background:#EFF6FF;border:1px solid #BFDBFE;border-radius:12px;padding:0.7rem 0.8rem;margin-bottom:0.8rem;}
.emp-demo-fila span{font-weight:600;color:#1E3A8A;}

/* ── Vehículos (PESV) en PC: dos columnas que crecen cada una por su lado ──
   Antes las tarjetas iban en una cuadrícula automática: cada fila tomaba el
   alto de la tarjeta más alta y dejaba huecos grandes al lado de las bajitas.
   Ahora la izquierda es el día a día (revisiones, fallas, mantenimiento), la
   derecha la flota (vehículos y conductores) y cada columna apila sus
   tarjetas sin depender de la otra. La configuración del preoperacional
   (tipos y checklist) va abajo a todo el ancho. En celular todo sigue
   apilado igual que antes. */
.veh-seccion-titulo{font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--text3);margin:1.4rem 0 0.6rem 0.2rem;}
@media (min-width:1100px){
  .veh-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:start;}
  .veh-col,.veh-config{display:flex;flex-direction:column;gap:1rem;min-width:0;}
  .veh-col > .card,.veh-config > .card{margin-bottom:0;}
  .veh-config{grid-column:1 / -1;}
  .veh-seccion-titulo{margin:0.8rem 0 -0.3rem 0.2rem;}
  /* Los tipos de vehículo se reparten en columnas en vez de una lista larga */
  #adm-veh-tipos-base{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));column-gap:1.2rem;}
  /* Listas que pueden crecer mucho: se desplazan por dentro para que una
     flota de 80 vehículos no empuje todo lo demás hacia abajo */
  #adm-veh-lista,#adm-cond-lista,#adm-veh-fallas-lista,#adm-veh-check-lista{max-height:540px;overflow-y:auto;padding-right:0.3rem;scrollbar-width:thin;}
}

/* ── Gestión PESV en PC ──
   El texto de introducción deja de ser una tarjeta casi vacía y pasa a ser el
   encabezado de la página. Siniestros y Comparendos quedan del mismo alto,
   con su botón "Registrar" alineado abajo, y cuando se abre el formulario de
   uno de los dos, esa tarjeta toma todo el ancho para que el formulario
   respire (y la otra no quede estirada con un hueco). */
.pesv-intro{padding:0.2rem 0.2rem 0.9rem;}
.pesv-intro-titulo{font-size:1.15rem;font-weight:800;color:var(--text);letter-spacing:-0.01em;margin-bottom:0.2rem;}
@media (min-width:1100px){
  #s-admin-empresa #adm-pesv.page.active.page-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #adm-pesv .pesv-intro{padding-bottom:0;}
  #adm-pesv > #adm-sin-card,#adm-pesv > #adm-comp-card{align-self:stretch;display:flex;flex-direction:column;}
  #adm-sin-btn-nuevo,#adm-comp-btn-nuevo{margin-top:auto;}
  #adm-sin-lista,#adm-comp-lista,#adm-cap-lista{max-height:540px;overflow-y:auto;padding-right:0.3rem;scrollbar-width:thin;}
  #adm-pesv > .pesv-card-abierta,
  #adm-pesv:has(> .pesv-card-abierta) > #adm-sin-card,
  #adm-pesv:has(> .pesv-card-abierta) > #adm-comp-card{grid-column:1 / -1;}
}

/* ── Alertas por correo (Config del admin y Súper Admin) ── */
.alc-aviso{background:var(--off-white);border:1px dashed var(--border);border-radius:10px;padding:0.65rem 0.8rem;font-size:0.8rem;color:var(--text2);margin-bottom:0.6rem;line-height:1.45;}
.alc-opcion{align-items:flex-start;}
.alc-opcion input{margin-top:0.2rem;flex-shrink:0;}
.alc-opcion > span{display:flex;flex-direction:column;gap:0.15rem;}
.alc-opcion strong{font-size:0.86rem;}
.correo-fila{border:1px solid var(--border);border-radius:10px;margin-bottom:0.5rem;background:var(--white);}
.correo-fila > summary{display:flex;align-items:center;justify-content:space-between;gap:0.7rem;padding:0.6rem 0.75rem;cursor:pointer;list-style:none;}
.correo-fila > summary::-webkit-details-marker{display:none;}
.correo-fila-info{min-width:0;flex:1;}
.correo-fila-info .doc-label{overflow-wrap:anywhere;}
.correo-fila > summary .badge{flex-shrink:0;white-space:nowrap;}
.correo-fila-cuerpo{padding:0 0.75rem 0.75rem;}
.correo-vista iframe{width:100%;height:560px;border:1px solid var(--border);border-radius:8px;margin-top:0.5rem;background:#F4F7FC;}
.sup-correos-filtros{display:flex;gap:0.6rem;flex-wrap:wrap;align-items:center;}
.sup-correos-filtros .form-sel{flex:1 1 220px;max-width:360px;}
@media (max-width:640px){
  .correo-fila > summary{flex-direction:column;align-items:flex-start;}
  .correo-vista iframe{height:480px;}
}

/* ── Avisos por tipo, plantilla de correo y ventana de envío ── */
.alc-tipos{display:flex;flex-direction:column;gap:0.15rem;margin:0.1rem 0 0.6rem 1.9rem;}
.alc-tipos:empty{display:none;}
.alc-tipo{display:flex;align-items:flex-start;gap:0.5rem;font-size:0.8rem;color:var(--text2);padding:0.25rem 0;cursor:pointer;}
.alc-tipo input{margin-top:0.15rem;flex-shrink:0;}
.alc-tipos-off{opacity:0.45;}
.alc-vars{display:flex;flex-wrap:wrap;gap:0.35rem;margin-top:0.4rem;}
.alc-var{font-family:'DM Mono',ui-monospace,monospace;font-size:0.72rem;background:var(--off-white);border:1px solid var(--border);color:var(--primary3);border-radius:999px;padding:0.25rem 0.6rem;cursor:pointer;}
.alc-var:hover{border-color:var(--primary3);}
.plt-prev{background:var(--off-white);border:1px solid var(--border);border-radius:10px;padding:0.8rem 0.9rem;margin-top:0.4rem;}
.plt-prev-asunto{font-weight:700;font-size:0.88rem;color:var(--text);margin-bottom:0.45rem;overflow-wrap:anywhere;}
.plt-prev-mensaje{font-size:0.82rem;color:var(--text2);white-space:pre-line;line-height:1.5;overflow-wrap:anywhere;}
.modal-envio-fondo{position:fixed;inset:0;background:rgba(15,15,23,0.45);z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px;}
.modal-envio{max-width:520px;width:100%;max-height:calc(100vh - 32px);overflow-y:auto;box-shadow:0 20px 50px rgba(0,0,0,0.3);margin-bottom:0;}
.modal-envio-resumen{background:var(--off-white);border:1px solid var(--border);border-radius:8px;padding:0.55rem 0.75rem;font-size:0.8rem;color:var(--text2);margin-bottom:0.8rem;line-height:1.5;}
.modal-envio-adjunto{font-size:0.82rem;color:var(--text);margin:0.2rem 0 0.6rem;}
.modal-envio-error{color:var(--red);font-size:0.82rem;margin-top:0.4rem;display:none;}
.modal-envio-botones{display:flex;gap:0.6rem;margin-top:1rem;}
.modal-envio-botones .btn-primary{flex:1;width:auto;margin-top:0;}

/* ── Config del admin en PC ──
   Antes: cuadrícula automática con huecos grandes (la tarjeta de datos muy
   alta al lado del logo bajito). Ahora: datos de la empresa a la izquierda
   (formulario en dos columnas) y logo/asistente/demo apilados a la derecha;
   abajo la sección "Correos" con alertas en tres columnas y la plantilla
   con el editor a la izquierda y la vista previa a la derecha. */
.cfg-seccion-titulo{font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--text3);margin:1.4rem 0 0.6rem 0.2rem;}
.alc-col-dest .form-group:first-child{margin-top:0.6rem;}
@media (min-width:1100px){
  .cfg-empresa{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);gap:1rem;align-items:start;}
  .cfg-col-main > .card,.cfg-col-side > .card{margin-bottom:0;}
  .cfg-col-side{display:flex;flex-direction:column;gap:1rem;}
  #adm-cfg-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1rem;}
  #adm-cfg-form > .btn-primary,
  #adm-cfg-form > .form-group:has(.combo-wrap){grid-column:1 / -1;}
  #adm-cfg-form > .btn-primary{justify-self:end;width:auto;min-width:220px;}
  .cfg-seccion-titulo{margin:1.6rem 0 0.7rem 0.2rem;}
  #adm-alc-card,#adm-plt-card{margin-bottom:1rem;}
  .alc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem;align-items:start;margin-top:0.4rem;}
  .alc-grid .alc-tipos{margin-left:1.9rem;}
  .alc-col-dest{background:var(--off-white);border:1px solid var(--border);border-radius:12px;padding:0.9rem 1rem;}
  .alc-col-dest .form-group:first-child{margin-top:0;}
  .alc-col-dest .btn-primary{width:100%;}
  .plt-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:1.6rem;align-items:start;}
  .plt-grid .plt-prev{margin-top:0;position:sticky;top:1rem;}
  #adm-plt-mensaje{min-height:260px;}
}
@media (min-width:760px) and (max-width:1099px){
  .alc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;}
  .alc-col-dest{grid-column:1 / -1;}
}
@media (min-width:1100px){ .modal-envio{max-width:640px;padding:1.6rem 1.8rem;} .modal-envio textarea{min-height:240px;} }

/* ═══════════════════════════════════════════════════════════════════
   SÚPER ADMIN — menú lateral (mismo esqueleto que Admin de empresa) con
   tres páginas: Empresas, Planes y Correos. Pensado primero para PC.
   ═══════════════════════════════════════════════════════════════════ */
#s-superadmin .content{max-width:1360px;margin:0 auto;padding:1.5rem;}
@media (min-width:1100px){ #s-superadmin .content{padding:2rem 2.5rem;} }
#s-superadmin .card{margin-bottom:1rem;}
.sup-pagina{display:none;}
.sup-pagina.activa{display:block;animation:supEntra 0.18s ease;}
@keyframes supEntra{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.sup-cabecera{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.2rem;flex-wrap:wrap;}
.sup-h1{font-size:1.55rem;font-weight:800;color:var(--text);letter-spacing:-0.02em;line-height:1.2;}
.sup-h1-sub{font-size:0.85rem;color:var(--text3);margin-top:0.25rem;max-width:720px;line-height:1.5;}
.sup-btn-accion{width:auto;margin-top:0;padding:0.7rem 1.3rem;white-space:nowrap;}

/* Cifras de arriba: 4 en fila en PC; se pueden tocar para filtrar */
#s-superadmin .sup-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:0.8rem;margin-bottom:1.2rem;}
@media (min-width:900px){ #s-superadmin .sup-kpis{grid-template-columns:repeat(4,minmax(0,1fr));} }
#s-superadmin .sup-kpis .cumpl-kpi{background:white;}
.sup-kpi-btn{text-align:left;font:inherit;cursor:pointer;transition:box-shadow 0.15s,transform 0.15s;}
.sup-kpi-btn:hover{box-shadow:var(--shadow);transform:translateY(-1px);}
.sup-num-mono{font-family:'DM Mono',monospace;font-size:1.45rem!important;letter-spacing:-0.02em;}

/* Lista de empresas: buscador + filtros arriba; en PC, filas tipo tabla */
.sup-lista-barra{display:flex;flex-direction:column;gap:0.7rem;margin-bottom:0.9rem;}
.sup-lista-barra .sup-filtros{margin-bottom:0;}
@media (min-width:1100px){
  .sup-lista-barra{flex-direction:row;align-items:center;}
  .sup-lista-barra .form-inp{max-width:340px;flex:0 0 340px;}
}
.emp-tabla-cab{display:none;}
.emp-fila .emp-col-plan,.emp-fila .emp-col-vig,.emp-fila .emp-col-mods{flex-basis:100%;margin-left:54px;}
.emp-fila .emp-col-estado{display:flex;gap:0.3rem;flex-wrap:wrap;margin-left:54px;}
.emp-fila:focus-visible{outline:2px solid var(--primary3);outline-offset:2px;}
@media (min-width:1100px){
  .emp-tabla-cab{display:grid;grid-template-columns:44px minmax(0,2.1fr) minmax(0,1.2fr) minmax(0,1.5fr) minmax(0,1.3fr) 230px;gap:0.9rem;padding:0 0.8rem 0.5rem;font-size:0.66rem;font-weight:700;letter-spacing:0.07em;text-transform:uppercase;color:var(--text3);border-bottom:1px solid var(--border);}
  #emp-lista .emp-fila{display:grid;grid-template-columns:44px minmax(0,2.1fr) minmax(0,1.2fr) minmax(0,1.5fr) minmax(0,1.3fr) 230px;gap:0.9rem;align-items:center;border:none;border-bottom:1px solid var(--border);border-radius:0;margin:0;padding:0.75rem 0.8rem;}
  #emp-lista .emp-fila:hover{background:var(--off-white);box-shadow:none;transform:none;}
  .emp-fila .emp-col-plan,.emp-fila .emp-col-vig,.emp-fila .emp-col-mods,.emp-fila .emp-col-estado{margin-left:0;}
  .emp-fila .emp-col-estado{justify-content:flex-end;}
  .emp-fila .doc-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
}

/* Chip del plan (lista, cabecera del detalle, tarjetas de plan) */
.plan-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;font-size:0.72rem;font-weight:700;background:#EEF4FF;color:var(--primary2);border:1px solid #CFDDF5;white-space:nowrap;}
.plan-chip.vacio{background:var(--off-white);color:var(--text3);border-color:var(--border);}
.plan-chip-aj{color:#B45309;font-weight:800;}

/* Formulario de empresa nueva */
.sup-form-nueva{border-left:3px solid var(--primary3);}
.sup-form-grid{display:grid;grid-template-columns:1fr;column-gap:1rem;}
@media (min-width:700px){ .sup-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
.sup-form-botones{display:flex;gap:0.6rem;justify-content:flex-end;margin-top:0.9rem;}
.sup-form-botones .btn-primary{width:auto;min-width:150px;margin-top:0;}

/* ── Detalle de empresa ── */
.sup-det-cabecera{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.2rem 1.4rem;}
.sup-det-avatar{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.15rem;flex-shrink:0;background:var(--off-white);border:1px solid var(--border);color:var(--primary);}
.sup-det-avatar.ig{background:var(--green-bg);color:var(--green);border-color:var(--green-border);}
.sup-det-avatar.iy{background:var(--yellow-bg);color:var(--yellow);border-color:var(--yellow-border);}
.sup-det-avatar.ir{background:var(--red-bg);color:var(--red);border-color:var(--red-border);}
.sup-det-titulos{flex:1 1 260px;min-width:0;}
.sup-det-nombre{font-size:1.3rem;font-weight:800;color:var(--text);letter-spacing:-0.01em;line-height:1.25;}
.sup-det-badges{display:flex;gap:0.35rem;flex-wrap:wrap;align-items:center;}
.sup-det-msg{border-radius:10px;padding:0.7rem 0.9rem;font-size:0.84rem;margin-bottom:1rem;background:var(--off-white);border:1px solid var(--border);color:var(--text2);text-align:left;}
.sup-det-msg.ok{background:var(--green-bg);border-color:var(--green-border);color:var(--green);}
.sup-det-grid{display:block;}
@media (min-width:1100px){
  .sup-det-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(330px,1fr);gap:1rem;align-items:start;}
}
.sup-card-cab{display:flex;align-items:center;justify-content:space-between;gap:0.6rem;margin-bottom:1rem;}
.sup-card-cab .card-title{margin-bottom:0;}
.sup-card-acciones{display:flex;gap:0.6rem;justify-content:flex-end;flex-wrap:wrap;margin-top:1rem;}
.sup-card-acciones .btn-primary{width:auto;min-width:170px;margin-top:0;}
.sup-acceso-grid{display:grid;grid-template-columns:1fr;gap:1.2rem;}
@media (min-width:700px){ .sup-acceso-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
.sup-plegable{margin-top:0.9rem;border-top:1px solid var(--border);padding-top:0.7rem;}
.sup-plegable > summary{cursor:pointer;font-size:0.8rem;font-weight:700;color:var(--primary3);list-style:none;padding:0.2rem 0;}
.sup-plegable > summary::-webkit-details-marker{display:none;}
.sup-plegable > summary::before{content:'▸ ';}
.sup-plegable[open] > summary::before{content:'▾ ';}
.sup-plegable[open] > summary{margin-bottom:0.6rem;}
.sup-historial{max-height:360px;overflow-y:auto;}
.sup-acept{margin-top:2px;color:#B45309;}
.sup-acept.ok{color:var(--green);}
.sup-uso-mini{display:grid;grid-template-columns:1fr;gap:0.5rem;}
@media (min-width:700px){ .sup-uso-mini{grid-template-columns:repeat(2,minmax(0,1fr));} }
.sup-mini{display:flex;align-items:center;gap:0.6rem;background:var(--off-white);border:1px solid var(--border);border-radius:10px;padding:0.6rem 0.8rem;font-size:0.82rem;color:var(--text2);}
.sup-mini-ico{font-size:1rem;}
.sup-mini-t{flex:1;}
.sup-mini strong{color:var(--text);font-family:'DM Mono',monospace;font-weight:500;}

/* Tarjeta "Plan y uso" */
.sup-plan-sel{display:grid;grid-template-columns:1fr;column-gap:1rem;}
@media (min-width:700px){ .sup-plan-sel{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);} }
.plan-aviso-mod{display:flex;align-items:center;gap:0.8rem;flex-wrap:wrap;justify-content:space-between;background:var(--yellow-bg);border:1px solid var(--yellow-border);border-radius:10px;padding:0.65rem 0.85rem;font-size:0.8rem;color:var(--yellow);margin-bottom:0.9rem;}
.plan-aviso-mod span{flex:1 1 300px;line-height:1.45;}
.plan-uso-tabla{border:1px solid var(--border);border-radius:12px;overflow:hidden;}
.plan-uso-cab,.plan-uso-fila{display:grid;grid-template-columns:minmax(0,1.3fr) 90px 140px minmax(0,1.6fr);gap:0.8rem;align-items:center;padding:0.6rem 0.9rem;}
.plan-uso-cab{background:var(--off-white);font-size:0.66rem;font-weight:700;letter-spacing:0.07em;text-transform:uppercase;color:var(--text3);border-bottom:1px solid var(--border);}
.plan-uso-fila{border-bottom:1px solid var(--border);font-size:0.85rem;}
.plan-uso-fila:last-child{border-bottom:none;}
.plan-uso-rec{font-weight:700;color:var(--text);}
.plan-uso-plan{font-family:'DM Mono',monospace;color:var(--text2);font-size:0.82rem;}
.plan-uso-inp{padding:0.45rem 0.6rem;font-size:0.82rem;}
.plan-uso-inp.ajustado{border-color:#F59E0B;background:#FFFBEB;font-weight:700;color:#92400E;}
.plan-uso-inp.invalido{border-color:var(--red);background:var(--red-bg);}
.plan-uso-barra{display:flex;flex-direction:column;gap:0.3rem;min-width:0;}
.plan-uso-num{font-family:'DM Mono',monospace;font-size:0.8rem;color:var(--text2);}
.plan-uso-num.rojo{color:var(--red);font-weight:600;}
@media (max-width:640px){
  .plan-uso-cab{display:none;}
  .plan-uso-fila{grid-template-columns:1fr 1fr;row-gap:0.4rem;}
  .plan-uso-rec{grid-column:1 / -1;}
  .plan-uso-plan::before{content:'Plan: ';font-family:'Plus Jakarta Sans',sans-serif;color:var(--text3);}
  .plan-uso-barra{grid-column:1 / -1;}
}

/* ── Página Planes ── */
.plan-interruptor{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;border-left:4px solid var(--border);}
.plan-interruptor.encendido{border-left-color:var(--green);background:linear-gradient(90deg,var(--green-bg),white 60%);}
.plan-int-titulo{font-weight:800;color:var(--text);font-size:0.95rem;}
.plan-int-sub{font-size:0.82rem;color:var(--text2);margin-top:0.2rem;line-height:1.5;max-width:780px;}
.plan-switch{position:relative;display:inline-block;width:52px;height:30px;flex-shrink:0;cursor:pointer;}
.plan-switch input{opacity:0;width:0;height:0;position:absolute;}
.plan-switch-pista{position:absolute;inset:0;background:var(--border);border-radius:999px;transition:background 0.2s;}
.plan-switch-pista::before{content:'';position:absolute;width:24px;height:24px;left:3px;top:3px;background:white;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,0.2);transition:transform 0.2s;}
.plan-switch input:checked + .plan-switch-pista{background:var(--green);}
.plan-switch input:checked + .plan-switch-pista::before{transform:translateX(22px);}
.plan-switch input:focus-visible + .plan-switch-pista{outline:2px solid var(--primary3);outline-offset:2px;}

.plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1rem;}
.plan-grid > .emp-empty{grid-column:1 / -1;}
.plan-card{background:white;border:1px solid var(--border);border-radius:14px;padding:1.3rem 1.3rem 1.1rem;display:flex;flex-direction:column;gap:0.75rem;position:relative;overflow:hidden;transition:box-shadow 0.15s,border-color 0.15s;}
.plan-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary),var(--accent));}
.plan-card:hover{box-shadow:var(--shadow);border-color:#C9D6EA;}
.plan-card.inactivo{opacity:0.65;}
.plan-card-cab{display:flex;justify-content:space-between;align-items:center;gap:0.5rem;}
.plan-nombre{font-weight:800;font-size:1.05rem;color:var(--text);letter-spacing:-0.01em;}
.plan-precio{font-family:'DM Mono',monospace;font-size:1.6rem;font-weight:500;color:var(--primary);letter-spacing:-0.03em;}
.plan-precio small{font-family:'Plus Jakarta Sans',sans-serif;font-size:0.78rem;color:var(--text3);letter-spacing:0;}
.plan-precio-pend{font-family:'Plus Jakarta Sans',sans-serif;font-size:0.9rem;font-weight:700;color:#B45309;background:var(--yellow-bg);border:1px dashed var(--yellow-border);border-radius:8px;padding:0.2rem 0.6rem;letter-spacing:0;}
.plan-desc{font-size:0.82rem;color:var(--text2);line-height:1.45;}
.plan-mods{display:flex;gap:0.3rem;flex-wrap:wrap;}
.plan-limites{list-style:none;margin:0;padding:0;border-top:1px solid var(--border);}
.plan-limites li{display:flex;justify-content:space-between;align-items:center;padding:0.5rem 0;border-bottom:1px solid var(--border);font-size:0.82rem;color:var(--text2);}
.plan-limites strong{font-family:'DM Mono',monospace;font-weight:500;color:var(--text);}
.plan-pie{display:flex;justify-content:space-between;align-items:center;gap:0.6rem;margin-top:auto;padding-top:0.3rem;}
.plan-uso{font-size:0.76rem;font-weight:700;color:var(--text3);}

/* Ventana de edición de un plan */
.plan-editor{max-width:720px!important;}
.plan-editor-cols{display:grid;grid-template-columns:1fr;gap:1.2rem;margin:0.4rem 0 0.8rem;}
@media (min-width:700px){ .plan-editor-cols{grid-template-columns:repeat(2,minmax(0,1fr));} }
.plan-lim-fila{display:grid;grid-template-columns:1fr 120px;gap:0.6rem;align-items:center;padding:0.35rem 0;font-size:0.85rem;color:var(--text);}
.plan-lim-fila .form-inp{padding:0.45rem 0.6rem;}
.plan-editor-botones{display:flex;justify-content:space-between;align-items:center;gap:0.6rem;flex-wrap:wrap;margin-top:1rem;}
.plan-editor-botones .btn-primary{width:auto;margin-top:0;min-width:120px;}
.plan-eliminar{color:var(--red)!important;}
#s-superadmin .vig-accion{align-items:stretch;}
#s-superadmin .vig-accion .btn-primary{margin-top:0;}
.emp-tabla-cab span:last-child{text-align:right;}

/* Paneles del Resumen de módulos que la empresa no tiene */
#adm-panel .widget-panel.no-aplica{display:none!important;}

/* Gestión PESV: tablero y pendientes */
#adm-tpesv-card .card-title-row{align-items:baseline;}
.tpesv-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
@media (min-width:900px){ .tpesv-kpis{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (min-width:1400px){ .tpesv-kpis{grid-template-columns:repeat(6,minmax(0,1fr));} }
.tpesv-kpis .cumpl-kpi-num{font-size:1.7rem;}
.tpesv-kpis .cumpl-kpi-gray{border-left-color:var(--border);}
#adm-ppesv-lista{display:grid;grid-template-columns:1fr;gap:0.5rem;}
@media (min-width:1100px){ #adm-ppesv-lista{grid-template-columns:repeat(2,minmax(0,1fr));} #adm-ppesv-lista > .emp-empty,#adm-ppesv-lista > .doc-sub{grid-column:1 / -1;} }
#adm-ppesv-lista .item-row{margin-bottom:0;flex-wrap:nowrap;}
#adm-ppesv-lista .item-info{flex:1;min-width:0;}
.ppesv-ir{font-size:0.78rem;font-weight:700;color:var(--primary3);white-space:nowrap;}

/* ── Formularios en ventana emergente (src/shared/ventanas.js) ── */
body.ventana-abierta{overflow:hidden;}
.ventana-fondo{position:fixed;inset:0;z-index:9000;background:rgba(10,20,40,0.5);display:flex;align-items:center;justify-content:center;padding:24px;animation:ventanaFondo 0.15s ease;}
@keyframes ventanaFondo{from{opacity:0}to{opacity:1}}
.ventana-panel{position:relative;width:100%;max-width:820px;max-height:calc(100vh - 48px);overflow-y:auto;overscroll-behavior:contain;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.3);background:white;animation:ventanaEntra 0.2s ease;}
@keyframes ventanaEntra{from{opacity:0;transform:translateY(12px) scale(0.98)}to{opacity:1;transform:none}}
.ventana-panel > .card,
.ventana-panel > div{margin:0!important;border:none!important;box-shadow:none!important;border-radius:16px;padding:1.4rem 1.5rem 1.5rem;background:white;}
.ventana-panel .card-title,
.ventana-panel > div > .form-lbl:first-child{padding-right:2.5rem;font-size:0.9rem;}
.ventana-x{position:sticky;top:10px;float:right;margin:10px 10px -46px 0;z-index:2;width:36px;height:36px;border-radius:10px;border:1px solid var(--border);background:white;color:var(--text2);font-size:1.4rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.ventana-x:hover{background:var(--off-white);color:var(--text);}
@media (max-width:640px){
  .ventana-fondo{align-items:flex-end;padding:0;}
  .ventana-panel{max-width:none;max-height:92vh;border-radius:18px 18px 0 0;animation:ventanaSube 0.22s ease;padding-bottom:env(safe-area-inset-bottom);}
  @keyframes ventanaSube{from{transform:translateY(40px);opacity:0.6}to{transform:none;opacity:1}}
  .ventana-panel > .card,.ventana-panel > div{padding:1.2rem 1rem 1.4rem;border-radius:18px 18px 0 0;}
}

/* ── PESV paso 24: comunicados y reportes de seguridad vial ── */
.com-mensaje-caja{white-space:pre-wrap;word-break:break-word;font-size:0.88rem;line-height:1.5;color:var(--text);background:var(--off-white);border:1px solid var(--border);border-left:4px solid var(--primary3);border-radius:10px;padding:0.75rem 0.9rem;}
.com-dest-fila{display:flex;align-items:center;justify-content:space-between;gap:0.6rem;padding:0.45rem 0.1rem;border-bottom:1px solid var(--border);font-size:0.85rem;}
.com-dest-fila:last-child{border-bottom:none;}
.com-dest-nombre{min-width:0;overflow-wrap:anywhere;}
.mant-check.com-sin-app{opacity:0.55;}
.rsv-det-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0.5rem 1rem;margin-bottom:0.6rem;}
.rsv-det-dato{font-size:0.85rem;color:var(--text);}
.rsv-det-dato .doc-sub{display:block;}
.insp-rsv-resp{margin-top:0.45rem;font-size:0.82rem;background:var(--green-bg);border:1px solid var(--green-border);border-radius:8px;padding:0.45rem 0.6rem;color:var(--text);white-space:pre-wrap;word-break:break-word;}
.insp-rsv-boton{width:100%;margin-bottom:0.9rem;}
/* Seguimiento visual del reporte: Recibido → En trámite → Cerrado */
.rsv-pasos{display:flex;align-items:flex-start;margin:0.55rem 0 0.15rem;}
.rsv-paso{flex:1;display:flex;flex-direction:column;align-items:center;gap:0.25rem;position:relative;font-size:0.7rem;font-weight:600;color:var(--text3);text-align:center;}
.rsv-paso::before{content:"";position:absolute;top:10px;right:50%;width:100%;height:3px;background:var(--border);z-index:0;}
.rsv-paso:first-child::before{display:none;}
.rsv-paso-punto{width:22px;height:22px;border-radius:50%;background:white;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:0.7rem;position:relative;z-index:1;}
.rsv-paso.hecho{color:var(--text);}
.rsv-paso.hecho::before{background:var(--green);}
.rsv-paso.hecho .rsv-paso-punto{background:var(--green);border-color:var(--green);color:white;}
.rsv-paso.actual .rsv-paso-punto{box-shadow:0 0 0 4px var(--green-bg);}
.rsv-paso.actual.en-tramite .rsv-paso-punto{background:var(--yellow);border-color:var(--yellow);box-shadow:0 0 0 4px var(--yellow-bg);}
.rsv-paso.actual.recibido .rsv-paso-punto{background:var(--primary3);border-color:var(--primary3);box-shadow:0 0 0 4px var(--off-white);}
.rsv-estados{display:grid;grid-template-columns:repeat(3,1fr);gap:0.5rem;}
.rsv-estado-btn{display:flex;flex-direction:column;align-items:center;gap:0.2rem;padding:0.7rem 0.4rem;border:2px solid var(--border);border-radius:12px;background:white;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;font-size:0.8rem;font-weight:700;color:var(--text2);transition:all 0.15s;}
.rsv-estado-btn .rsv-estado-ico{font-size:1.2rem;}
.rsv-estado-btn .rsv-estado-sub{font-size:0.68rem;font-weight:500;color:var(--text3);}
.rsv-estado-btn:hover{border-color:var(--primary3);}
.rsv-estado-btn.sel.abierto{border-color:var(--primary3);background:var(--off-white);color:var(--primary);}
.rsv-estado-btn.sel.en_gestion{border-color:var(--yellow-border);background:var(--yellow-bg);color:var(--yellow);}
.rsv-estado-btn.sel.cerrado{border-color:var(--green-border);background:var(--green-bg);color:var(--green);}
.rsv-paso.actual::before{background:var(--green);}

/* Firmas guardadas de la empresa (Config) y firma del facilitador */
.firma-emp-fila{display:flex;align-items:center;gap:0.8rem;flex-wrap:wrap;padding:0.75rem 0;border-bottom:1px solid var(--border);}
.firma-emp-fila:last-child{border-bottom:none;}
.firma-emp-info{flex:1 1 160px;min-width:0;}
.firma-emp-img{flex:0 0 auto;min-width:120px;min-height:52px;display:flex;align-items:center;justify-content:center;border:1px dashed var(--border);border-radius:8px;background:white;padding:2px;}
.firma-emp-img .firma-mini img{max-width:150px !important;max-height:56px !important;border:none !important;}
.firma-emp-vacia{font-size:0.75rem;color:var(--text3);padding:0 0.6rem;}
.firma-emp-acc{display:flex;gap:0.4rem;flex-wrap:wrap;}
.cfg-check{display:flex;align-items:center;gap:0.5rem;font-size:0.85rem;font-weight:600;color:var(--text1,var(--text));cursor:pointer;}
.cfg-check input{width:18px;height:18px;accent-color:var(--primary);}
/* Evidencia de una acción cumplida del plan del siniestro */
.sin-accion-evid{margin-top:0.6rem;padding:0.6rem;border:1px dashed var(--green,#16a34a);border-radius:10px;background:rgba(22,163,74,0.05);}
.sin-accion-evid-lbl{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;color:var(--green,#16a34a);margin-bottom:0.4rem;}
.sin-accion-evid-lbl span{font-weight:500;text-transform:none;letter-spacing:0;color:var(--text3);}


/* ── Acceso rápido: "＋ Nuevo" y atajos del Resumen ── */
.btn-nuevo-rapido{
  background:var(--accent);color:white;border:none;border-radius:100px;
  padding:0.5rem 1rem;font:800 0.82rem 'Plus Jakarta Sans',sans-serif;cursor:pointer;
  box-shadow:0 2px 10px rgba(14,165,233,0.35);white-space:nowrap;
}
.btn-nuevo-rapido:hover{background:#0b94d0;}
.admin-mobile-bar .btn-nuevo-rapido{margin-left:auto;padding:0.42rem 0.85rem;}
.admin-desk-bar{
  position:sticky;top:0;z-index:40;display:flex;justify-content:flex-end;
  padding:0.7rem 2.5rem;background:rgba(244,247,252,0.92);backdrop-filter:blur(6px);
  border-bottom:1px solid var(--border);
}
@media (max-width:899px){ .admin-desk-bar{display:none !important;} }
.nuevo-menu{
  position:fixed;z-index:200;min-width:230px;background:white;border:1px solid var(--border);
  border-radius:14px;box-shadow:var(--shadow-lg);padding:6px;
}
.nuevo-menu button{
  display:flex;align-items:center;gap:0.65rem;width:100%;text-align:left;border:none;background:none;
  padding:0.6rem 0.7rem;border-radius:10px;font:700 0.85rem 'Plus Jakarta Sans',sans-serif;color:var(--text);cursor:pointer;
}
.nuevo-menu button:hover{background:var(--off-white);}
.atajo-ico{width:34px;height:34px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0;}
.atajo-rojo{background:var(--red-bg);}
.atajo-amarillo{background:var(--yellow-bg);}
.atajo-verde{background:var(--green-bg);}
.atajo-azul{background:#E7F3FC;}
.atajos-titulo{font-size:0.72rem;font-weight:800;letter-spacing:0.07em;text-transform:uppercase;color:var(--text3);margin:0 0.2rem 0.5rem;}
.atajos-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0.7rem;}
.atajo-tile{
  display:flex;align-items:center;gap:0.75rem;text-align:left;background:white;border:1px solid var(--border);
  border-radius:14px;padding:0.8rem 0.9rem;box-shadow:var(--shadow);cursor:pointer;font-family:inherit;color:var(--text);
  transition:transform .12s,box-shadow .12s,border-color .12s;
}
.atajo-tile:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--accent);}
.atajo-tile .atajo-ico{width:42px;height:42px;font-size:1.3rem;border-radius:12px;}
.atajo-txt{display:flex;flex-direction:column;min-width:0;}
.atajo-txt b{font-size:0.88rem;}
.atajo-txt span{font-size:0.72rem;color:var(--text3);font-weight:600;}
@media (max-width:1100px){ .atajos-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:520px){
  .atajo-tile{flex-direction:column;align-items:flex-start;gap:0.45rem;}
}
.atajos{margin-bottom:0.3rem;}


/* ── Estados por pasos y filtro Sin cerrar / Cerrados / Todos ── */
.filtro-cierre{display:flex;gap:0.4rem;flex-wrap:wrap;margin:0 0 0.8rem;}
.filtro-cierre-btn{
  border:1px solid var(--border);background:white;color:var(--text2);border-radius:100px;
  padding:0.38rem 0.85rem;font:700 0.78rem 'Plus Jakarta Sans',sans-serif;cursor:pointer;
}
.filtro-cierre-btn span{margin-left:0.25rem;font-family:'DM Mono',monospace;font-weight:500;color:var(--text3);}
.filtro-cierre-btn.activo{background:var(--primary);border-color:var(--primary);color:white;}
.filtro-cierre-btn.activo span{color:rgba(255,255,255,0.75);}
.pasos-linea{display:flex;align-items:center;flex-wrap:wrap;gap:0.15rem 0.5rem;margin-top:0.4rem;font-size:0.72rem;}
.pasos{display:inline-flex;align-items:center;}
.paso-punto{width:10px;height:10px;border-radius:50%;border:2px solid var(--border);background:white;box-sizing:border-box;}
.paso-union{width:14px;height:2px;background:var(--border);}
.paso-punto.hecho{background:var(--green);border-color:var(--green);}
.paso-punto.actual.paso-yellow{background:#D97706;border-color:#D97706;}
.paso-punto.actual.paso-red{background:var(--red);border-color:var(--red);}
.paso-punto.actual.paso-green{background:var(--green);border-color:var(--green);}
.paso-punto.actual.paso-gray{background:var(--text3);border-color:var(--text3);}
.pasos-actual-txt{font-weight:800;}
.pasos-yellow{color:var(--yellow);}.pasos-red{color:var(--red);}.pasos-green{color:var(--green);}.pasos-gray{color:var(--text2);}
.pasos-aviso{color:var(--text3);font-weight:600;}
.pasos-form{margin:-0.2rem 0 0.8rem;}

.page-grid > .resumen-lista{grid-column:1 / -1;}
.resumen-lista .cumpl-kpis{margin-bottom:0.2rem;}
.cumpl-kpi-gray{border-left-color:var(--text3);}
.dias-venc{font-size:0.72rem;font-weight:700;}
.dias-red{color:var(--red);}.dias-yellow{color:var(--yellow);}
.cumpl-kpis.kpis-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:520px){
  .cumpl-kpis.kpis-3{gap:0.45rem;}
  .kpis-3 .cumpl-kpi{padding:0.6rem 0.65rem;}
  .kpis-3 .cumpl-kpi-titulo{font-size:0.6rem;}
  .kpis-3 .cumpl-kpi-sub{font-size:0.62rem;}
}

/* ── Extintores según la norma: ficha, 3 relojes y servicios ── */
.ext-relojes{margin:0.8rem 0 1rem;}
.ext-ficha{display:grid;grid-template-columns:repeat(4,1fr);gap:0.5rem 1rem;background:var(--off-white);border:1px solid var(--border);border-radius:12px;padding:0.7rem 0.9rem;margin-bottom:0.7rem;}
.ext-ficha span{display:block;font-size:0.66rem;font-weight:800;letter-spacing:0.05em;text-transform:uppercase;color:var(--text3);}
.ext-ficha b{font-size:0.86rem;}
.ext-relojes-lista{display:grid;grid-template-columns:repeat(3,1fr);gap:0.6rem;}
.ext-reloj{background:white;border:1px solid var(--border);border-radius:12px;padding:0.7rem 0.8rem;box-shadow:var(--shadow);}
.ext-reloj-top{display:flex;justify-content:space-between;align-items:flex-start;gap:0.5rem;font-size:0.84rem;}
.ext-reloj-barra{height:7px;border-radius:100px;margin:0.55rem 0 0.4rem;position:relative;
  background:linear-gradient(90deg,var(--red-border) 0 20%,var(--yellow-border) 20% 40%,var(--green-border) 40% 100%);}
.ext-reloj-barra i{position:absolute;top:-3px;width:4px;height:13px;margin-left:-2px;background:var(--text);border-radius:2px;}
.ext-tec-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 0.8rem;}
.ext-tecnicos{margin-bottom:0.9rem;}
.ext-serv-sum{display:flex;justify-content:space-between;gap:0.6rem;flex-wrap:wrap;}
.ext-btn-servicio{background:var(--primary);color:white;border-color:var(--primary);}
@media (max-width:899px){
  .ext-relojes-lista{grid-template-columns:1fr;}
  .ext-ficha{grid-template-columns:1fr 1fr;}
}
@media (max-width:520px){ .ext-tec-grid{grid-template-columns:1fr;} }

/* ── Extintores bloque C ── */
.ext-resumen-fila{display:flex;justify-content:space-between;align-items:flex-start;gap:0.8rem;flex-wrap:wrap;margin:0.6rem 0 0.2rem;}
.ext-aviso-fab{flex:1 1 320px;background:#E7F3FC;border:1px solid #BAD9F0;border-radius:12px;padding:0.6rem 0.8rem;font-size:0.8rem;color:var(--text);}
.ext-informe-btns{display:flex;gap:0.4rem;margin-left:auto;}
.btn-link{background:none;border:none;padding:0;color:var(--primary3);font:inherit;font-weight:800;text-decoration:underline;cursor:pointer;}
.ext-sin-insp{font-size:0.72rem;color:var(--text3);font-weight:600;}

/* ── Contratistas (doc 38): filas de documentos con fecha y semáforo ── */
.ctr-docs{display:flex;flex-direction:column;gap:0.45rem;}
.ctr-doc{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr) 10.5rem;gap:0.5rem;align-items:center;padding:0.55rem 0.7rem;border:1px solid var(--border);border-radius:12px;background:var(--off-white);}
.ctr-doc-nombre{font-size:0.8rem;font-weight:700;color:var(--text);min-width:0;}
.ctr-doc-nombre .doc-sub{font-weight:500;}
.ctr-doc .form-inp{margin:0;}
.ctr-doc-lbl{display:none;font-size:0.68rem;font-weight:700;color:var(--text3);margin-bottom:2px;}
.ctr-doc-estado{display:flex;justify-content:flex-end;align-items:center;gap:0.3rem;}
.ctr-doc-quitar{background:none;border:none;color:var(--text3);font-size:1rem;cursor:pointer;padding:0 0.2rem;}
.ctr-doc-quitar:hover{color:var(--red);}
.ctr-baja-aviso{background:var(--red-bg);border:1px solid var(--red-border);color:var(--red);border-radius:10px;padding:0.55rem 0.75rem;font-size:0.8rem;margin-bottom:0.7rem;}
@media (max-width:640px){
  .ctr-doc{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);}
  .ctr-doc-nombre{grid-column:1 / -1;display:flex;justify-content:space-between;gap:0.5rem;align-items:flex-start;}
  .ctr-doc-lbl{display:block;}
  .ctr-doc-estado{justify-content:flex-start;grid-column:1 / -1;}
}

/* ── Documentos del PESV (repositorio documental, doc 39) ── */
.cumpl-kpi-blue{border-left-color:var(--primary3);}
.cumpl-kpi-blue .cumpl-kpi-num{color:var(--primary3);}
.dpe-avance{display:flex;align-items:baseline;gap:0.5rem;flex-wrap:wrap;margin-bottom:0.35rem;}
.dpe-avance-num{font-size:1.9rem;font-weight:800;color:var(--primary);line-height:1;}
.dpe-avance-pct{margin-left:auto;font-family:"DM Mono",monospace;font-weight:600;color:var(--primary2);}
.dpe-barra{height:10px;border-radius:99px;background:var(--border);overflow:hidden;margin-bottom:0.9rem;}
.dpe-barra > i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--primary3),var(--accent));}
.dpe-filtros{display:flex;gap:0.4rem;flex-wrap:wrap;margin:0.9rem 0 0.7rem;}
.dpe-chip{font:inherit;font-size:0.78rem;font-weight:600;padding:0.4rem 0.8rem;border-radius:99px;border:1px solid var(--border);background:white;color:var(--text2);cursor:pointer;}
.dpe-chip.activo{background:var(--primary);border-color:var(--primary);color:white;}
.dpe-fase{display:flex;justify-content:space-between;font-size:0.8rem;font-weight:800;color:var(--primary);margin:0.9rem 0.15rem 0.4rem;}
.dpe-fase span{color:var(--text3);font-weight:600;}
.dpe-lista{border:1px solid var(--border);border-radius:12px;overflow:hidden;background:white;}
.dpe-lista .item-row{border-radius:0;border:none;border-bottom:1px solid var(--border);margin:0;}
.dpe-lista .item-row:last-child{border-bottom:none;}
.dpe-num{width:30px;height:30px;border-radius:9px;background:#EEF4FD;color:var(--primary2);font-weight:800;font-size:0.78rem;display:flex;align-items:center;justify-content:center;flex:none;}
.dpe-ayuda{font-size:0.82rem;color:var(--text2);background:#F7F9FD;border:1px dashed #C9DAF3;border-radius:12px;padding:0.65rem 0.8rem;line-height:1.5;margin-bottom:0.8rem;}
.dpe-auto{border:1px solid #C9DAF3;background:#F4F8FE;border-radius:12px;padding:0.65rem 0.8rem;margin-bottom:0.8rem;display:flex;align-items:center;gap:0.6rem;flex-wrap:wrap;font-size:0.82rem;}
.dpe-auto b{color:var(--primary);}
.dpe-doc{border:1px solid var(--border);border-radius:12px;padding:0.8rem;margin-bottom:0.7rem;background:white;}
.dpe-doc-head{display:flex;gap:0.7rem;align-items:flex-start;}
.dpe-tipo{width:42px;height:50px;border-radius:8px;flex:none;display:flex;align-items:flex-end;justify-content:center;padding-bottom:5px;font-size:0.62rem;font-weight:800;border:1px solid;}
.dpe-tipo-PDF{background:var(--red-bg);border-color:var(--red-border);color:var(--red);}
.dpe-tipo-Word{background:#EEF4FD;border-color:#C9DAF3;color:var(--primary2);}
.dpe-tipo-Excel{background:var(--green-bg);border-color:var(--green-border);color:var(--green);}
.dpe-tipo-Foto,.dpe-tipo-Archivo{background:var(--off-white);border-color:var(--border);color:var(--text2);}
.dpe-doc-info{flex:1;min-width:0;}
.dpe-doc-btns{display:flex;gap:0.4rem;flex-wrap:wrap;margin-top:0.7rem;}
.dpe-versiones{margin-top:0.6rem;font-size:0.8rem;}
.dpe-versiones summary{cursor:pointer;color:var(--primary3);font-weight:600;}
.dpe-ver{display:flex;justify-content:space-between;align-items:center;gap:0.5rem;padding:0.45rem 0;border-bottom:1px dashed var(--border);}
.dpe-ver:last-child{border-bottom:none;}
.dpe-vacio{font-size:0.85rem;color:var(--text2);border:1px dashed var(--border);border-radius:12px;padding:0.8rem;margin-bottom:0.7rem;text-align:center;}
.dpe-archivo{display:flex;align-items:center;gap:0.7rem;border:2px dashed #9DB8E0;border-radius:14px;padding:0.8rem;background:#F7FAFF;cursor:pointer;}
.dpe-archivo:hover{background:#EEF4FD;}
.dpe-archivo-ico{font-size:1.5rem;flex:none;}
.dpe-archivo-info{display:flex;flex-direction:column;min-width:0;}
.dpe-archivo-info .doc-label{overflow-wrap:anywhere;}
.dpe-file-oculto{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none;}
.dpe-form-btns{display:flex;gap:0.5rem;justify-content:flex-end;flex-wrap:wrap;margin-top:0.5rem;}
.dpe-form-btns .btn-primary{width:auto;flex:1 1 140px;margin-top:0;}
#adm-dpe-paso-wrap .btn-primary{width:auto;margin-top:0;}
.dpe-doc-titulo{display:flex;align-items:flex-start;justify-content:space-between;gap:0.5rem;flex-wrap:wrap;margin-bottom:0.15rem;}
.dpe-acciones{display:flex;gap:0.5rem;flex-wrap:wrap;margin-top:0.9rem;}
.dpe-divulgado{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;margin-top:0.6rem;font-size:0.8rem;color:var(--text2);background:var(--off-white);border-radius:10px;padding:0.5rem 0.6rem;}
.dpe-divulgado .btn-secondary-sm{margin-left:auto;}
#insp-firma-pend-doc{display:inline-flex;text-decoration:none;}