
:root{
  --bg:#070b0f;
  --panel:#0d1217;
  --panel-2:#10161c;
  --line:#2d353d;
  --line-soft:#20272e;
  --text:#f4f6f8;
  --muted:#a9b0b8;
  --green:#2bd56f;
  --red:#df4c52;
  --yellow:#f0bd3e;
}

*{box-sizing:border-box}
html{color-scheme:dark}
body{
  margin:0;
  min-width:1180px;
  min-height:100vh;
  background:#05080b;
  color:var(--text);
  font-family:"Segoe UI",Arial,sans-serif;
  font-weight:400;
}
button,input{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}

.app{
  min-height:100vh;
  padding:0 7px 7px;
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:6px;
}

/* Encabezado compacto */
.topbar{
  min-height:88px;
  display:grid;
  grid-template-columns:minmax(370px,1fr) auto minmax(470px,auto);
  align-items:center;
  gap:12px;
  padding:7px 10px;
  background:linear-gradient(180deg,#0b1014,#080c10);
  border:1px solid var(--line);
  border-top:0;
}

.brand{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.fireops-wordmark{
  font-size:24px;
  font-weight:500;
  letter-spacing:-.6px;
  white-space:nowrap;
}
.fireops-wordmark span{color:#ff3b40}
.brand-separator{
  width:1px;
  height:42px;
  background:#3a424a;
}
.brand img{
  width:45px;
  height:45px;
  object-fit:contain;
}
.brand .fireops-personal-header-logo{width:150px;height:64px;object-fit:contain;object-position:left center}.brand .current-institution-logo{width:58px;height:58px;padding:3px;object-fit:contain;border-radius:6px;background:rgba(255,255,255,.035)}.brand .current-institution-logo[hidden]{display:none}.brand.has-institution-logo .brand-copy h1{font-size:16px}.brand.has-institution-logo .brand-copy p{font-size:9px}.fireops-wordmark{display:none}
.brand-copy h1{
  margin:0;
  font-size:17px;
  font-weight:600;
}
.brand-copy p{
  margin:3px 0 0;
  color:#d4d8dc;
  font-size:10px;
}

.vehicles{
  display:flex;
  gap:7px;
}
.vehicle-card{
  width:120px;
  min-height:66px;
  padding:7px 8px 6px;
  text-align:center;
  background:linear-gradient(180deg,#11171d,#0b1015);
  border:1px solid #39424b;
  border-radius:3px;
  box-shadow:inset 0 -3px 0 var(--red);
}
.vehicle-card strong{
  display:block;
  font-size:20px;
  font-weight:500;
  line-height:1;
}
.vehicle-state{
  display:block;
  margin-top:4px;
  color:#ff8084;
  font-size:8px;
  font-weight:700;
}
.vehicle-driver{
  display:block;
  margin-top:5px;
  color:#e5e9ed;
  font-size:7.5px;
  line-height:1.1;
}
.vehicle-card.in-service{
  border-color:#345d43;
  box-shadow:inset 0 -3px 0 var(--green);
}
.vehicle-card.in-service .vehicle-state{color:var(--green)}

.header-summary{
  display:grid;
  grid-template-columns:68px 82px 142px 138px;
  align-items:stretch;
}
.summary-item,
.header-code-form,
.clock{
  min-height:60px;
  padding:4px 10px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-left:1px solid #343b42;
}
.summary-item{
  align-items:center;
  text-align:center;
}
.summary-item strong{
  font-size:20px;
  font-weight:500;
  line-height:1;
}
.summary-item span{
  margin-top:6px;
  color:#d0d5da;
  font-size:8px;
}
.header-code-form label{
  margin-bottom:4px;
  color:#d9dde1;
  font-size:8px;
}
.header-code-form input{
  width:100%;
  height:31px;
  padding:6px 8px;
  color:#fff;
  background:#080c10;
  border:1px solid #414a53;
  border-radius:2px;
  outline:none;
}
.header-code-form input:focus{border-color:#6b7b8b}
.header-code-form small{
  margin-top:3px;
  color:#c4c9cf;
  font-size:7px;
}
.clock{
  align-items:flex-end;
  text-align:right;
}
.clock span{
  color:#d8dce0;
  font-size:9px;
}
.clock strong{
  margin-top:4px;
  font-size:24px;
  font-weight:500;
  line-height:1;
}

/* Panel de personal ajustado a 100% de zoom */
.workspace{
  min-height:405px;
  padding:8px;
  background:linear-gradient(180deg,#0c1116,#090e12);
  border:1px solid var(--line);
  border-radius:3px;
  overflow:hidden;
}

.people-grid{
  display:grid;
  grid-template-columns:repeat(10,minmax(0,1fr));
  grid-template-rows:repeat(2,minmax(0,1fr));
  gap:7px;
  min-height:385px;
}

.person-card,
.person-slot{
  width:100%;
  min-width:0;
  overflow:hidden;
  background:linear-gradient(180deg,#10161c,#0b1015);
  border:1px solid #39424b;
  border-radius:3px;
}

.person-card{
  display:flex;
  flex-direction:column;
}

.person-photo{
  width:100%;
  height:122px;
  display:block;
  object-fit:cover;
  object-position:50% 18%;
  background:#171d23;
}
.person-photo-fallback{
  display:grid;
  place-items:center;
  color:#dce1e6;
  font-size:30px;
  font-weight:500;
}
.person-status{
  width:100%;
  min-height:20px;
  padding:4px 2px;
  border:0;
  color:#061109;
  font-size:8px;
  font-weight:500;
}
.state-disponible .person-status{background:#187f33;color:#fff}
.state-no-disponible .person-status{background:#646b72;color:#fff}
.state-capacitacion .person-status{background:#c59c2f;color:#111}
.state-emergencia .person-status{background:#b53239;color:#fff}

.person-data{
  min-height:61px;
  padding:5px 4px 6px;
  text-align:center;
}
.person-code{
  color:#f2f4f6;
  font-size:9px;
  font-weight:500;
}
.person-role{
  margin-top:2px;
  color:#e3e6e9;
  font-size:7px;
}
.person-name{
  margin-top:4px;
  color:#fff;
  font-size:7.5px;
  line-height:1.15;
  font-weight:600;
  text-transform:uppercase;
}
.driver-tag{display:none!important}

.person-slot{
  min-height:190px;
  background:
    linear-gradient(to bottom,
      transparent 0,
      transparent 122px,
      rgba(70,80,90,.28) 122px,
      rgba(70,80,90,.28) 123px,
      transparent 123px,
      transparent 145px,
      rgba(70,80,90,.18) 145px,
      rgba(70,80,90,.18) 146px,
      transparent 146px
    ),
    linear-gradient(180deg,#0f151a,#0a0f13);
}

.people-grid.compact-mode .person-photo{display:none}
.people-grid.compact-mode .person-card,
.people-grid.compact-mode .person-slot{min-height:90px}
.people-grid.compact-mode .person-data{min-height:68px}

.empty-state{display:none!important}

/* Estructura inferior simple, sin contenido inventado */
.lower-panels{
  display:grid;
  grid-template-columns:1fr 1.08fr 1fr;
  gap:0;
  min-height:155px;
  border:1px solid var(--line);
  border-radius:3px;
  overflow:hidden;
}
.info-panel{
  min-height:155px;
  padding:10px;
  background:linear-gradient(180deg,#0c1116,#090e12);
  border-right:1px solid var(--line);
}
.info-panel:last-child{border-right:0}
.info-panel h3{
  margin:0 0 9px;
  font-size:12px;
  font-weight:600;
}
.placeholder-box{
  min-height:112px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:10px;
  border:1px solid #303942;
  background:#0a0f13;
}
.placeholder-box strong{
  margin-bottom:5px;
  font-size:10px;
  font-weight:500;
}
.placeholder-box span{
  max-width:90%;
  color:#b9c0c7;
  font-size:9px;
  line-height:1.35;
}

/* Modal */
.modal-backdrop{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(0,0,0,.78);
}
.driver-modal{
  width:min(410px,100%);
  padding:18px;
  background:#10161b;
  border:1px solid #3d4650;
  border-radius:3px;
}
.modal-label{color:#aeb6be;font-size:9px}
.driver-modal h2{margin:7px 0 5px;font-size:19px;font-weight:500}
.driver-modal p{margin:0 0 13px;color:#c0c6cc;font-size:11px}
.driver-options{display:grid;gap:7px}
.driver-vehicle-button,.driver-no-button{
  width:100%;
  min-height:40px;
  border-radius:2px;
  font-weight:500;
}
.driver-vehicle-button{
  color:#fff;
  background:#1d813c;
  border:1px solid #3d9d58;
}
.driver-no-button{
  margin-top:7px;
  color:#e2e6ea;
  background:#181e24;
  border:1px solid #39424b;
}

.vehicle-card{cursor:pointer}.vehicle-card:hover{border-color:#78aee8}.vehicle-driver-menu{z-index:5000}.vehicle-driver-candidates{display:grid;gap:8px;margin:14px 0;padding:12px;border:1px solid #34475b;border-radius:10px;background:#0c1621}.vehicle-driver-candidates[hidden]{display:none}.vehicle-driver-candidates strong{margin-bottom:3px}.vehicle-driver-candidates button{padding:12px;border:1px solid #3d7950;border-radius:8px;background:#12251b;color:#fff;font-weight:800;text-align:left}.vehicle-driver-candidates button:hover{border-color:#559aef;background:#142b48}.driver-vehicle-button:disabled{cursor:not-allowed;opacity:.4}
.vehicle-card.central-unavailable{border-color:#d19932!important;background:#302511!important}.vehicle-card.central-unavailable .vehicle-state{color:#ffd171!important}.vehicle-card.central-unavailable .vehicle-driver{color:#e7c98d!important}

.toast{
  position:fixed;
  right:14px;
  bottom:84px;
  z-index:100000;
  max-width:320px;
  padding:9px 12px;
  color:#fff;
  background:#2d7e43;
  border:1px solid #4b9e60;
  border-radius:2px;
  opacity:0;
  transform:translateY(80px);
  transition:.18s ease;
  pointer-events:none;
}
.toast.visible{opacity:1;transform:translateY(0)}
.toast.error{background:#893e43;border-color:#a8575d}

@media(max-width:1250px){
  body{min-width:1024px}
  .topbar{
    grid-template-columns:minmax(320px,1fr) auto minmax(400px,auto);
    gap:8px;
  }
  .fireops-wordmark{font-size:21px}
  .vehicle-card{width:108px}
  .header-summary{grid-template-columns:58px 68px 122px 120px}
}


/* =========================================================
   FIREOPS PERSONAL v0.9.2 · CORRECCIÓN DEFINITIVA
   ========================================================= */

.clock {
  min-width: 150px;
}

.clock span,
.clock strong {
  white-space: nowrap;
}

.clock span {
  font-size: 9px;
}

.clock strong {
  font-size: 23px;
  line-height: 1;
}

.lower-panels {
  display: grid;
  grid-template-columns: 1fr 1.08fr 1fr;
  gap: 0;
  min-height: 155px;
  border: 1px solid var(--line);
  border-radius: 3px;
  overflow: hidden;
}

.info-panel {
  min-height: 155px;
  padding: 10px;
  background: linear-gradient(180deg,#0c1116,#090e12);
  border-right: 1px solid var(--line);
}

.info-panel:last-child {
  border-right: 0;
}

.info-panel h3 {
  margin: 0 0 9px;
  font-size: 12px;
  font-weight: 600;
}

.placeholder-box {
  min-height: 112px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px;
  border: 1px solid #303942;
  background: #0a0f13;
}

.placeholder-box strong {
  margin-bottom: 5px;
  font-size: 10px;
  font-weight: 500;
}

.placeholder-box span {
  max-width: 90%;
  color: #b9c0c7;
  font-size: 9px;
  line-height: 1.35;
}


/* =========================================================
   FIREOPS PERSONAL v0.9.3 · ENCABEZADO AJUSTADO
   ========================================================= */

.topbar {
  grid-template-columns: minmax(350px, .92fr) auto minmax(500px, auto);
  gap: 9px;
}

.brand {
  gap: 8px;
}

.brand-copy {
  padding-right: 4px;
}

.vehicles {
  gap: 9px;
}

.vehicle-card {
  width: 142px;
  min-height: 72px;
  padding: 8px 10px 7px;
}

.vehicle-card strong {
  font-size: 22px;
}

.vehicle-state {
  margin-top: 5px;
  font-size: 8.5px;
}

.vehicle-driver {
  margin-top: 6px;
  font-size: 8px;
  line-height: 1.16;
}

.header-summary {
  grid-template-columns: 68px 82px 142px 154px;
}

.clock {
  min-width: 154px;
  padding-left: 12px;
  padding-right: 12px;
}

.clock span {
  font-size: 10px;
}

.clock strong {
  margin-top: 6px;
  font-size: 29px;
  line-height: 1;
  letter-spacing: .01em;
}

@media(max-width:1250px){
  .topbar{
    grid-template-columns:minmax(300px,.9fr) auto minmax(430px,auto);
    gap:7px;
  }

  .vehicle-card{
    width:128px;
  }

  .header-summary{
    grid-template-columns:58px 68px 122px 138px;
  }

  .clock{
    min-width:138px;
  }

  .clock strong{
    font-size:26px;
  }
}


/* =========================================================
   FIREOPS PERSONAL v0.9.4 · FECHA Y HORA EQUILIBRADAS
   ========================================================= */

.header-summary {
  grid-template-columns: 68px 82px 142px 190px;
}

.clock {
  min-width: 190px;
  min-height: 66px;
  padding: 7px 14px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.clock span {
  display: block;
  max-width: 100%;
  color: #dfe4e9;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.15;
  text-transform: capitalize;
  white-space: normal;
}

.clock strong {
  margin-top: 7px;
  font-size: 31px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .01em;
  white-space: nowrap;
}

/* Ajuste de proporción para que los móviles queden mejor integrados */
.topbar {
  grid-template-columns: minmax(330px, .85fr) auto minmax(520px, auto);
  gap: 8px;
}

.vehicles {
  margin-left: 0;
}

@media(max-width:1250px){
  .topbar{
    grid-template-columns:minmax(285px,.82fr) auto minmax(455px,auto);
  }

  .header-summary{
    grid-template-columns:58px 68px 122px 164px;
  }

  .clock{
    min-width:164px;
    padding-left:10px;
    padding-right:10px;
  }

  .clock span{
    font-size:10px;
  }

  .clock strong{
    font-size:27px;
  }
}


/* =========================================================
   FIREOPS PERSONAL v0.9.5 · RELOJ ALINEADO
   ========================================================= */

.clock {
  min-width: 190px;
  width: 190px;
  min-height: 66px;
  padding: 6px 12px 6px 8px;
  align-items: flex-end;
  justify-content: center;
  text-align: right;
}

.clock span {
  width: 100%;
  text-align: right;
  font-size: 11.5px;
  line-height: 1.1;
  white-space: nowrap;
}

.clock strong {
  width: 100%;
  margin-top: 6px;
  text-align: right;
  font-size: 32px;
  line-height: .95;
  white-space: nowrap;
}

@media(max-width:1250px){
  .clock{
    min-width:164px;
    width:164px;
    padding-right:10px;
  }

  .clock span{
    font-size:10px;
  }

  .clock strong{
    font-size:28px;
  }
}

/* FireOps Personal · Integración Despacho v1.4 */
.dispatch-mini-event,.dispatch-notice{display:flex;flex-direction:column;gap:4px;padding:9px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.03);margin-bottom:6px}
.dispatch-mini-event.active{border-left:4px solid #ed313b;background:rgba(237,49,59,.08)}
.dispatch-mini-event>div{display:flex;justify-content:space-between;gap:8px}.dispatch-mini-event>div span{font-size:9px;font-weight:900;color:#ed313b}
.dispatch-mini-event small,.dispatch-notice small{opacity:.65}.personal-dispatch-map{width:100%;height:180px;border:0;display:block}
.dispatch-map-link{display:block;margin-top:7px;color:#fff;text-decoration:none;font-size:11px;font-weight:800}


/* =========================================================
   FIREOPS PERSONAL v1.5 · ALERTA DE DESPACHO
   ========================================================= */

.dispatch-alert-panel{
  margin:8px 8px 0;
  min-height:190px;
  padding:22px 28px;
  border:2px solid rgba(255,255,255,.78);
  background:#0759b8;
  color:#fff;
  text-align:center;
  box-shadow:0 0 0 3px rgba(0,35,90,.22),0 14px 35px rgba(0,0,0,.28);
}

.dispatch-alert-kicker{
  font-size:11px;
  font-weight:900;
  letter-spacing:3px;
  opacity:.9;
}

.dispatch-alert-code{
  margin-top:7px;
  font-size:54px;
  line-height:1;
  font-weight:950;
  letter-spacing:1px;
}

.dispatch-alert-address{
  margin-top:14px;
  font-size:25px;
  line-height:1.15;
  font-weight:850;
  text-transform:uppercase;
}

.dispatch-alert-label{
  margin-top:16px;
  font-size:10px;
  font-weight:800;
  letter-spacing:2px;
  opacity:.8;
}

.dispatch-alert-vehicles{
  margin-top:4px;
  font-size:24px;
  font-weight:900;
}

body.dispatch-alert-active{
  background:#063f8d!important;
}

body.dispatch-alert-active .app{
  background:#063f8d!important;
}

body.dispatch-alert-active .workspace,
body.dispatch-alert-active .dashboard-lower{
  background:#063f8d!important;
}

body.dispatch-alert-active .topbar{
  background:#042e68!important;
  border-bottom-color:#88bfff!important;
}

.vehicle-card.dispatched{
  background:#d51f2b!important;
  border-color:#ff7b82!important;
  box-shadow:inset 0 -3px 0 #fff,0 0 0 1px rgba(255,255,255,.14)!important;
  color:#fff!important;
}

.vehicle-card.dispatched strong,
.vehicle-card.dispatched .vehicle-state,
.vehicle-card.dispatched .vehicle-driver{
  color:#fff!important;
}

.vehicle-card.dispatched .vehicle-state{
  font-weight:950;
  letter-spacing:.5px;
}

/* Historial y novedades: una sola caja exterior, registros separados por línea. */
#dispatchEmergencyPanel,
#dispatchNoticePanel{
  display:block;
  padding:0!important;
  overflow:hidden;
}

.dispatch-history-row,
.dispatch-notice-row{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:12px 14px;
  margin:0;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.14);
  background:transparent;
}

.dispatch-history-row:last-child,
.dispatch-notice-row:last-child{
  border-bottom:0;
}

.dispatch-history-row.active{
  background:rgba(213,31,43,.09);
}

.dispatch-history-top,
.dispatch-notice-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
}

.dispatch-history-top span{
  color:#ff4650;
  font-size:9px;
  font-weight:900;
}

.dispatch-history-row small,
.dispatch-notice-row small{
  opacity:.62;
}

.dispatch-notice-row>span{
  line-height:1.35;
}

/* Anula las cajas antiguas si algún navegador conserva markup anterior. */
.dispatch-mini-event,
.dispatch-notice{
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.14)!important;
  background:transparent!important;
  margin:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

@media(max-width:800px){
  .dispatch-alert-panel{
    min-height:150px;
    padding:18px 14px;
  }
  .dispatch-alert-code{font-size:42px}
  .dispatch-alert-address{font-size:20px}
  .dispatch-alert-vehicles{font-size:19px}
}


/* =========================================================
   FIREOPS PERSONAL v1.6 · ALERTA TEMPORAL PANTALLA COMPLETA
   ========================================================= */

.dispatch-alert-panel{display:none!important}

.dispatch-fullscreen-alert{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px;
  background:#444bcf;
  color:#fff;
  opacity:0;
  transition:opacity .22s ease;
}

.dispatch-fullscreen-alert[hidden]{display:none!important}
.dispatch-fullscreen-alert.visible{opacity:1}

.dispatch-fullscreen-content{
  width:min(1250px,96vw);
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-transform:uppercase;
  font-family:"Courier New",Consolas,monospace;
  font-weight:900;
  letter-spacing:1px;
}

.dispatch-fullscreen-code{
  font-size:clamp(46px,7vw,100px);
  line-height:.95;
}

.dispatch-fullscreen-description{
  font-size:clamp(30px,5vw,72px);
  line-height:1.02;
  max-width:1150px;
}

.dispatch-fullscreen-description:empty{display:none}

.dispatch-fullscreen-address{
  margin-top:8px;
  font-size:clamp(30px,5vw,70px);
  line-height:1.04;
  max-width:1200px;
}

.dispatch-fullscreen-vehicles{
  margin-top:8px;
  font-size:clamp(34px,5.4vw,78px);
  line-height:1;
}

body.dispatch-alert-active,
body.dispatch-alert-active .app,
body.dispatch-alert-active .workspace,
body.dispatch-alert-active .dashboard-lower,
body.dispatch-alert-active .topbar{
  background:revert!important;
}

@media(max-width:700px){
  .dispatch-fullscreen-alert{padding:16px}
  .dispatch-fullscreen-code{font-size:42px}
  .dispatch-fullscreen-description{font-size:28px}
  .dispatch-fullscreen-address{font-size:27px}
  .dispatch-fullscreen-vehicles{font-size:31px}
}

/* Informes de asistencia disponibles para la ayudantia de cada compania. */
.company-attendance-reports{
  margin-top:26px;
  padding:22px;
  border:1px solid #29445d;
  border-radius:12px;
  background:#0d1c2a;
}
.company-attendance-reports[hidden]{display:none!important}
.attendance-report-heading h3{margin:5px 0 4px;font-size:22px;color:#fff}
.attendance-report-heading p{margin:0;color:#aebdca;font-size:14px}
.attendance-report-filters{
  display:grid;
  grid-template-columns:1fr 170px 170px;
  gap:13px;
  margin-top:20px;
}
.attendance-report-filters label{display:flex;flex-direction:column;gap:7px;color:#dce7ef;font-size:13px;font-weight:800}
.attendance-report-filters label:last-child{grid-column:1/-1}
.attendance-report-filters input,
.attendance-report-filters select{
  min-height:42px;
  padding:0 12px;
  border:1px solid #36536d;
  border-radius:7px;
  background:#08131e;
  color:#fff;
}
.attendance-report-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px}
.attendance-report-actions span{color:#9eb0bf;font-size:13px}
.attendance-report-actions button{min-height:43px;padding:0 22px;border:0;border-radius:7px;background:#c81c27;color:#fff;font-weight:900;cursor:pointer}
@media(max-width:760px){
  .attendance-report-filters{grid-template-columns:1fr}
  .attendance-report-filters label:last-child{grid-column:auto}
  .attendance-report-actions{align-items:stretch;flex-direction:column}
}

/* Gestion de personal por compania */
.manage-firefighters-button{position:fixed;left:18px;bottom:18px;z-index:850;border:1px solid #3b5f82;background:#11283d;color:#fff;border-radius:7px;padding:11px 15px;font-size:10px;font-weight:900;letter-spacing:.6px;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.32)}
.manage-firefighters-button:hover{background:#173a58;border-color:#65a9df}
.current-institution-logo[role="button"]{cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease;outline:none;border:1px solid transparent}
.current-institution-logo[role="button"]:hover,.current-institution-logo[role="button"]:focus-visible{border-color:#3b5f82;background:rgba(59,95,130,.18);transform:translateY(-1px)}
.firefighter-manager-backdrop{position:fixed;inset:0;z-index:95000;background:rgba(1,8,15,.82);display:flex;align-items:center;justify-content:center;padding:22px}
.firefighter-manager-backdrop.hidden{display:none!important}
.firefighter-manager{width:min(1040px,100%);max-height:92vh;overflow:auto;background:#0b1826;border:1px solid #29435c;border-radius:12px;box-shadow:0 24px 80px rgba(0,0,0,.55);padding:24px;color:#fff}
.firefighter-manager>header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding-bottom:18px;border-bottom:1px solid #263b50}
.firefighter-manager>header h2{margin:6px 0;font-size:25px}.firefighter-manager>header p{margin:0;color:#9db0c2}
#closeFirefighterManager{width:42px;height:42px;border:1px solid #3a5065;border-radius:7px;background:#132536;color:#fff;font-size:29px;line-height:1}
.firefighter-manager [hidden]{display:none!important}
.firefighter-manager-login{max-width:680px;margin:24px auto;padding:22px;background:#102337;border:1px solid #31506c;border-radius:9px}.firefighter-manager-login h3{margin:0 0 7px;font-size:20px}.firefighter-manager-login p{margin:0 0 17px;color:#9fb4c7;line-height:1.4}.manager-login-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.firefighter-manager-login label{display:flex;flex-direction:column;gap:6px;color:#bed1e1;font-size:12px;font-weight:800}.firefighter-manager-login input{box-sizing:border-box;width:100%;background:#07131f;border:1px solid #354e66;border-radius:6px;padding:11px;color:#fff}.firefighter-manager-login>button{width:100%;margin-top:16px;border:1px solid #3c82bd;background:#1768a8;color:#fff;border-radius:7px;padding:12px;font-weight:900}.firefighter-manager-login>span{display:block;min-height:18px;margin-top:10px;color:#ff8c93;text-align:center;font-size:12px;font-weight:800}
.firefighter-manager-toolbar{display:flex;gap:12px;margin:18px 0}.firefighter-manager-toolbar input{flex:1;min-width:0;background:#07121d;border:1px solid #344b61;color:#fff;border-radius:7px;padding:12px}.firefighter-manager-toolbar button,.managed-form-actions button{border:1px solid #3c82bd;background:#1768a8;color:#fff;border-radius:7px;padding:11px 15px;font-weight:900}
.managed-firefighter-form{margin-bottom:18px;padding:18px;background:#102337;border:1px solid #31506c;border-radius:9px}.managed-firefighter-form[hidden]{display:none!important}
.managed-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.managed-firefighter-form label{display:flex;flex-direction:column;gap:6px;color:#bad0e2;font-size:12px;font-weight:800}.managed-firefighter-form input{box-sizing:border-box;width:100%;background:#07131f;border:1px solid #354e66;border-radius:6px;padding:10px;color:#fff}.managed-checks{display:flex;gap:24px;margin:16px 0}.managed-checks label{flex-direction:row;align-items:center}.managed-checks input{width:auto}.managed-specialties{margin-bottom:15px}.managed-form-actions{display:flex;gap:10px}.managed-form-actions .secondary{background:#243545;border-color:#44596b}
.managed-authorized-vehicles{margin:0 0 16px;padding:13px 15px;border:1px solid #3b5872;border-radius:7px;background:#0a1927}.managed-authorized-vehicles legend{padding:0 7px;color:#d7e8f5;font-size:12px;font-weight:900}.managed-authorized-vehicles>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.managed-authorized-vehicles label{display:flex;flex-direction:row;align-items:center;gap:8px;padding:9px 10px;border:1px solid #2d4a63;border-radius:6px;background:#0d2234;color:#fff}.managed-authorized-vehicles input{width:auto}.managed-vehicles-empty{grid-column:1/-1;color:#e7bb67;font-size:12px}
.managed-firefighters-list{display:grid;gap:10px}.managed-firefighter-card{display:grid;grid-template-columns:58px 1fr auto;gap:14px;align-items:center;padding:12px 14px;background:#0d1d2d;border:1px solid #253e55;border-radius:8px}.managed-firefighter-card img,.managed-photo-fallback{width:58px;height:58px;border-radius:7px;object-fit:cover;background:#1b3348;display:grid;place-items:center;font-size:22px;font-weight:900}.managed-firefighter-card h3{margin:0 0 3px;font-size:16px}.managed-firefighter-card p{margin:0 0 4px;color:#b8c8d6}.managed-firefighter-card small{color:#7fa0ba}.managed-card-actions{display:flex;gap:7px}.managed-card-actions button{border:1px solid #46647d;background:#17334b;color:#fff;border-radius:6px;padding:8px 10px;font-size:10px;font-weight:900}.managed-card-actions .danger{border-color:#81434a;background:#4a2026}.managed-empty{display:flex;flex-direction:column;gap:6px;text-align:center;padding:35px;border:1px dashed #365069;border-radius:8px;color:#9fb2c3}
@media(max-width:850px){.managed-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.manage-firefighters-button{left:10px;bottom:10px;padding:9px 11px;font-size:9px}.firefighter-manager{padding:16px}}
@media(max-width:580px){.firefighter-manager-backdrop{padding:8px}.manager-login-grid,.managed-form-grid{grid-template-columns:1fr}.firefighter-manager-toolbar{flex-direction:column}.managed-firefighter-card{grid-template-columns:48px 1fr}.managed-firefighter-card img,.managed-photo-fallback{width:48px;height:48px}.managed-card-actions{grid-column:1/-1}.managed-card-actions button{flex:1}.managed-checks{flex-direction:column;gap:10px}}
@media(max-width:850px){.managed-authorized-vehicles>div{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.managed-authorized-vehicles>div{grid-template-columns:1fr}}

#centralOperationalStateBanner{position:fixed;top:0;left:0;right:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;gap:14px;min-height:54px;padding:10px 18px;background:#a3131c;color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.35);text-align:center}
#centralOperationalStateBanner strong{font-size:14px;letter-spacing:.05em}
#centralOperationalStateBanner span{font-size:13px}
#centralOperationalStateBanner small{opacity:.8}
body.central-out-of-service .app{padding-top:54px}
@media(max-width:700px){#centralOperationalStateBanner{flex-direction:column;gap:2px;min-height:72px}body.central-out-of-service .app{padding-top:72px}}


/* FireOps Personal v1.6.1 — autocierre de emergencia reforzado */
@keyframes fireopsDispatchAutoClose{
  0%{opacity:1;visibility:visible}
  92%{opacity:1;visibility:visible}
  100%{opacity:0;visibility:hidden}
}

.dispatch-fullscreen-alert.autoclose{
  animation:fireopsDispatchAutoClose 8s linear forwards!important;
}

.dispatch-fullscreen-alert:not(.visible){
  pointer-events:none;
}


/* =========================================================
   FIREOPS PERSONAL v1.6.2 · ALERTA 8 SEGUNDOS
   ========================================================= */
.dispatch-fullscreen-alert{
  position:fixed!important;
  inset:0!important;
  z-index:2147483647!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100vw!important;
  height:100vh!important;
  padding:28px!important;
  margin:0!important;
  background:#b3121b!important;
  color:#fff!important;
  opacity:1!important;
  visibility:visible!important;
  animation:none!important;
  transition:none!important;
  cursor:pointer;
}

.dispatch-fullscreen-content{
  width:min(1250px,96vw)!important;
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  text-transform:uppercase!important;
  font-family:"Courier New",Consolas,monospace!important;
  font-weight:900!important;
  letter-spacing:1px!important;
}

.dispatch-fullscreen-code{font-size:clamp(46px,7vw,100px)!important;line-height:.95!important}
.dispatch-fullscreen-description{font-size:clamp(30px,5vw,72px)!important;line-height:1.02!important;max-width:1150px!important}
.dispatch-fullscreen-address{margin-top:8px!important;font-size:clamp(30px,5vw,70px)!important;line-height:1.04!important;max-width:1200px!important}
.dispatch-fullscreen-vehicles{margin-top:8px!important;font-size:clamp(34px,5.4vw,78px)!important;line-height:1!important}

@media(max-width:700px){
  .dispatch-fullscreen-alert{padding:16px!important}
  .dispatch-fullscreen-code{font-size:42px!important}
  .dispatch-fullscreen-description{font-size:28px!important}
  .dispatch-fullscreen-address{font-size:27px!important}
  .dispatch-fullscreen-vehicles{font-size:31px!important}
}


/* FireOps Personal v1.6.3 — tipografía más formal para alerta */
.dispatch-fullscreen-content{
  font-family:"Segoe UI",Arial,Helvetica,sans-serif!important;
  font-weight:800!important;
  letter-spacing:.4px!important;
}

.dispatch-fullscreen-code{
  font-weight:900!important;
  letter-spacing:.8px!important;
}

.dispatch-fullscreen-description,
.dispatch-fullscreen-address{
  font-weight:800!important;
}

.dispatch-fullscreen-vehicles{
  font-weight:900!important;
  letter-spacing:.6px!important;
}

/* FireOps Personal v1.7 - alerta roja compacta */
.dispatch-fullscreen-code{font-size:clamp(34px,5vw,70px)!important;line-height:1!important}
.dispatch-fullscreen-description{font-size:clamp(22px,3.3vw,46px)!important;line-height:1.08!important;max-width:1100px!important}
.dispatch-fullscreen-address{font-size:clamp(22px,3.2vw,44px)!important;line-height:1.08!important;max-width:1100px!important}
.dispatch-fullscreen-vehicles{font-size:clamp(25px,3.7vw,52px)!important;line-height:1.05!important}


/* =========================================================
   FIREOPS PERSONAL v1.6.4 · DISEÑO MEJORADO
   ========================================================= */

/* TARJETAS DE BOMBEROS: mismo tamaño general, texto más legible */
.person-card,
.firefighter-card,
.bombero-card{
  overflow:hidden;
}

/* Estado DISPONIBLE / NO DISPONIBLE */
.person-card .status,
.firefighter-card .status,
.bombero-card .status,
.person-card .availability,
.firefighter-card .availability{
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:900!important;
  letter-spacing:.25px!important;
}

/* Datos inferiores de cada tarjeta */
.person-card .person-code,
.person-card .person-rank,
.person-card .person-name,
.firefighter-card .person-code,
.firefighter-card .person-rank,
.firefighter-card .person-name,
.bombero-card .person-code,
.bombero-card .person-rank,
.bombero-card .person-name{
  font-size:11px!important;
  line-height:1.15!important;
  font-weight:800!important;
}

/* Fallback para la estructura real de las tarjetas */
.person-card small,
.firefighter-card small,
.bombero-card small{
  font-size:10.5px!important;
  line-height:1.15!important;
}

.person-card strong,
.firefighter-card strong,
.bombero-card strong{
  font-size:11px!important;
  line-height:1.15!important;
}

.person-company{
  margin-top:4px;
  color:#8fc8ff;
  font-size:10px;
  font-weight:800;
  line-height:1.15;
}

.fireops-headquarters-attendance{
  min-height:40px;
  margin-left:10px;
  padding:0 13px;
  border:1px solid #3c6a92;
  border-radius:6px;
  background:#123a61;
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.25px;
  cursor:pointer;
}

/* Evita que el texto más grande haga crecer la tarjeta */
.person-card,
.firefighter-card,
.bombero-card{
  min-height:0!important;
}

/* PANEL INFERIOR: más compacto */
.dashboard-lower,
.bottom-panels,
.info-panels{
  min-height:0!important;
}

.info-panel{
  padding:9px!important;
}

.info-panel h3{
  margin:0 0 7px!important;
  font-size:13px!important;
  line-height:1.15!important;
}

#dispatchMapPanel,
#dispatchEmergencyPanel,
#dispatchNoticePanel{
  min-height:0!important;
}

/* Mapa algo más bajo */
.personal-dispatch-map{
  height:145px!important;
}

.dispatch-map-link{
  margin-top:4px!important;
  font-size:10.5px!important;
  line-height:1.1!important;
}

/* ÚLTIMAS EMERGENCIAS: 2 filas compactas y texto mayor */
.dispatch-history-row{
  padding:8px 10px!important;
  gap:3px!important;
}

.dispatch-history-top strong{
  font-size:12px!important;
  font-weight:900!important;
}

.dispatch-history-top span{
  font-size:10px!important;
  font-weight:900!important;
}

.dispatch-history-row>b{
  font-size:14px!important;
  line-height:1.15!important;
}

.dispatch-history-row small{
  font-size:10.5px!important;
  line-height:1.2!important;
}

/* NOVEDADES: solo una, ocupando la caja principal sin caja interior */
.dispatch-notice-row{
  padding:10px 12px!important;
  gap:5px!important;
  min-height:86px!important;
  justify-content:center!important;
}

.dispatch-notice-head strong{
  font-size:12px!important;
  font-weight:900!important;
}

.dispatch-notice-head small{
  font-size:10.5px!important;
}

.dispatch-notice-row>span{
  font-size:12px!important;
  line-height:1.3!important;
  text-align:left!important;
}

/* Ajusta el sector inferior para que no robe altura a las tarjetas */
.workspace{
  grid-template-rows:minmax(0,1fr) auto!important;
}

@media(min-width:1000px){
  .dashboard-lower,
  .bottom-panels,
  .info-panels{
    max-height:245px!important;
  }
}

/* FireOps Personal v1.7 - alerta roja y tipografia reducida */
.dispatch-fullscreen-alert{background:#b3121b!important}

.personal-sound-button{border:1px solid #3d4652!important;padding:8px 11px!important;background:#202630!important;color:#fff!important;font-weight:900!important;font-size:11px!important;letter-spacing:.4px!important}
.personal-sound-button.pending{background:#f0a000!important;border-color:#ffc44d!important;color:#161006!important;animation:soundPulse 1.4s infinite}
.personal-sound-button.enabled{background:#16724d!important;border-color:#36b77f!important;color:#fff!important}
.personal-sound-button.disabled{background:#343b45!important;border-color:#596574!important;color:#d8dde4!important;animation:none!important}
.personal-sound-fixed{position:fixed!important;right:18px!important;bottom:18px!important;z-index:90000!important;min-height:52px!important;padding:0 22px!important;border-radius:9px!important;box-shadow:0 10px 30px rgba(0,0,0,.48)!important;font-size:13px!important}
.personal-login-screen:not([hidden])~.personal-sound-fixed{display:none!important}
@keyframes soundPulse{50%{box-shadow:0 0 0 5px rgba(240,160,0,.16)}}
.dispatch-fullscreen-code{font-size:clamp(28px,3.5vw,50px)!important;line-height:1!important}
.dispatch-fullscreen-description{font-size:clamp(18px,2.4vw,34px)!important;line-height:1.12!important;max-width:1050px!important}
.dispatch-fullscreen-address{font-size:clamp(18px,2.3vw,32px)!important;line-height:1.12!important;max-width:1050px!important}
.dispatch-fullscreen-vehicles{font-size:clamp(22px,2.8vw,40px)!important;line-height:1.08!important}

/* Paneles informativos legibles y con uso completo del espacio disponible. */
#dispatchEmergencyPanel,
#dispatchNoticePanel{min-height:145px!important;max-height:145px!important;overflow:auto!important;align-content:stretch!important;align-items:stretch!important;justify-content:flex-start!important;text-align:left!important}
#dispatchEmergencyPanel>strong,
#dispatchEmergencyPanel>span,
#dispatchNoticePanel>strong,
#dispatchNoticePanel>span{display:block!important;width:100%!important;max-width:none!important;box-sizing:border-box!important;text-align:left!important;padding-left:14px!important;padding-right:14px!important}
#dispatchEmergencyPanel>strong,
#dispatchNoticePanel>strong{padding-top:18px!important;margin-bottom:7px!important;font-size:14px!important}
#dispatchEmergencyPanel>span,
#dispatchNoticePanel>span{font-size:13px!important;line-height:1.4!important}
.dispatch-history-row{box-sizing:border-box;width:100%!important;min-height:63px!important;padding:10px 12px!important;justify-content:center!important;align-items:stretch!important;gap:4px!important;text-align:left!important}
.dispatch-history-top{width:100%!important}
.dispatch-history-top strong{font-size:14px!important}.dispatch-history-top span{font-size:11px!important}
.dispatch-history-row>b{display:block!important;width:100%!important;font-size:15px!important;line-height:1.2!important;text-align:left!important}
.dispatch-history-row small{display:block!important;width:100%!important;max-width:none!important;font-size:12px!important;line-height:1.25!important;opacity:.82!important;text-align:left!important}
.dispatch-notice-row{box-sizing:border-box;width:100%!important;min-height:143px!important;padding:14px!important;justify-content:flex-start!important;align-items:stretch!important;text-align:left!important}
.dispatch-notice-head{width:100%!important}
.dispatch-notice-head strong{font-size:14px!important}.dispatch-notice-head small{font-size:11.5px!important;opacity:.8!important}
.dispatch-notice-row>span{display:block!important;width:100%!important;max-width:none!important;font-size:14px!important;line-height:1.4!important;text-align:left!important}

/* Distribución completa de cada caja informativa. */
.dispatch-history-row{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(150px,.9fr)!important;
  grid-template-rows:auto 1fr!important;
  grid-template-areas:"head head" "main meta"!important;
  column-gap:18px!important;
  row-gap:8px!important;
  align-content:stretch!important;
}
.dispatch-history-row:only-child{min-height:143px!important}
.dispatch-history-top{grid-area:head!important}
.dispatch-history-main{grid-area:main;display:flex;flex-direction:column;justify-content:center;gap:7px;min-width:0}
.dispatch-history-main b{font-size:17px!important;line-height:1.2!important;text-align:left!important}
.dispatch-history-main small{font-size:13px!important;line-height:1.35!important;text-align:left!important;opacity:.9!important}
.dispatch-history-meta{grid-area:meta;display:flex;flex-direction:column;justify-content:center;gap:11px;padding-left:14px;border-left:1px solid rgba(255,255,255,.14)}
.dispatch-history-meta small{display:flex!important;flex-direction:column;gap:3px;width:100%!important;font-size:12.5px!important;line-height:1.25!important;text-align:left!important;opacity:.9!important}
.dispatch-history-meta small strong{color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.45px}
.dispatch-notice-row{display:grid!important;grid-template-rows:auto 1fr!important;gap:12px!important;align-content:stretch!important}
.dispatch-notice-content{display:flex;align-items:center;width:100%;font-size:15px;line-height:1.5;text-align:left}
.panel-empty-state{box-sizing:border-box;width:100%;height:143px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:18px 20px;text-align:left}
.panel-empty-state strong{margin-bottom:8px;font-size:15px;font-weight:900}
.panel-empty-state span{width:100%;max-width:none;color:#b9c0c7;font-size:13.5px;line-height:1.45}
@media(max-width:1100px){.dispatch-history-row{grid-template-columns:1fr!important;grid-template-rows:auto auto auto!important;grid-template-areas:"head" "main" "meta"!important}.dispatch-history-meta{padding-left:0;padding-top:7px;border-left:0;border-top:1px solid rgba(255,255,255,.14)}}
@media(max-width:700px){
  .dispatch-fullscreen-code{font-size:28px!important}
  .dispatch-fullscreen-description{font-size:18px!important}
  .dispatch-fullscreen-address{font-size:18px!important}
  .dispatch-fullscreen-vehicles{font-size:22px!important}
}
