:root{
  --bg:#121212;--panel:#1e1e1e;--input:#2d2d2d;--border:#404040;
  --text:#e5e5e5;--muted:#aaa;--blue:#3b82f6;--green:#10b981;
  --red:#ef4444;--yellow:#f59e0b;--purple:#8b5cf6;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:Segoe UI,Arial,sans-serif;height:100vh;overflow:hidden;display:flex;flex-direction:column}
.hidden{display:none!important}.flex{display:flex}.gap{gap:8px}.mt{margin-top:10px}.mb{margin-bottom:10px}.wrap{flex-wrap:wrap}
button,input,select,textarea{background:var(--input);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:8px}
button{cursor:pointer}button:hover{filter:brightness(1.12)}
button.primary{background:var(--blue);border-color:var(--blue)}button.danger{background:var(--red);border-color:var(--red)}
button.warning{background:var(--yellow);border-color:var(--yellow);color:#000}button.sm{padding:4px 8px;font-size:.8rem}
input,select,textarea{width:100%}textarea{min-height:80px}
header{height:50px;background:var(--panel);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 1rem;flex-shrink:0}
nav button{margin-right:6px;background:none;font-weight:bold}
main{flex:1;overflow:hidden}
section{display:none;height:100%;overflow:auto;padding:1rem}section.active{display:block}
#login-screen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center}
.login-box{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:2rem;width:350px;text-align:center}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:1rem}
.command-bar{margin-bottom:10px}
.command-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1.3fr auto;gap:8px;align-items:end}
.cad-layout{display:grid;grid-template-columns:340px 1fr;gap:10px;height:calc(100% - 76px)}
.unit-item,.incident-card{background:var(--input);padding:10px;margin-bottom:8px;border-left:4px solid var(--green);border-radius:4px}
.unit-busy{border-left-color:var(--red)}.unit-onscene{border-left-color:var(--yellow)}
.incident-card{border-left-color:var(--yellow)}.incident-card.selected-call{outline:2px solid var(--blue);box-shadow:0 0 0 2px rgba(59,130,246,.25)}.closed{opacity:.75;border-left-color:#777}
.log-entry{font-family:Consolas,monospace;font-size:.78rem;border-bottom:1px solid #333;padding:4px 0}
#toast-container{position:fixed;right:20px;bottom:20px;z-index:10000}
.toast{background:var(--panel);border-left:4px solid var(--blue);padding:12px;margin-top:8px;min-width:250px;box-shadow:0 4px 12px rgba(0,0,0,.5)}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:5000;display:flex;align-items:center;justify-content:center}
.modal{background:var(--panel);border:1px solid var(--border);border-radius:8px;width:720px;max-height:90vh;overflow:auto;padding:20px}
table{width:100%;border-collapse:collapse;margin-top:1rem}th,td{border-bottom:1px solid var(--border);padding:8px;text-align:left;vertical-align:top}th{background:#252525;color:var(--muted)}
.action-btns button{margin-right:4px}
details.unit-group{background:#171717;border:1px solid #333;border-radius:6px;margin-bottom:8px;padding:6px}
details.unit-type{background:#202020;border:1px solid #333;border-radius:6px;margin:6px 0;padding:6px}
summary{cursor:pointer;font-weight:bold;color:var(--text)}
.timer{font-family:Consolas,monospace;font-size:1rem;color:var(--green);font-weight:bold}.timer.alarm{color:var(--red);animation:blink .8s infinite}
@keyframes blink{50%{opacity:.25}}
.call-columns{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.status-Available{border-left-color:#10b981!important}
.status-En\ Route{border-left-color:#3b82f6!important}
.status-On\ Scene,.status-Traffic\ Stop{border-left-color:#ef4444!important}
.status-Busy{border-left-color:#f59e0b!important}
.status-Out\ of\ Service{border-left-color:#6b7280!important}
.priority-P1{box-shadow:0 0 10px rgba(239,68,68,.7)}
.priority-P2{box-shadow:0 0 8px rgba(245,158,11,.6)}
.priority-P3{box-shadow:0 0 6px rgba(59,130,246,.5)}

@media(max-width:900px){.command-grid,.cad-layout,.call-columns{grid-template-columns:1fr}.cad-layout{height:auto}.command-bar{position:static}}
@media print{
  body{background:white;color:black;height:auto;overflow:visible}
  header,main,#toast-container,#login-screen,.modal-overlay{display:none!important}
  #print-area{display:block!important;color:black;background:white;padding:20px;font-family:Arial,sans-serif}
}
#print-area{display:none}

.emergency-banner{
position:fixed;
top:0;
left:0;
right:0;
background:#b91c1c;
color:white;
padding:10px;
font-weight:bold;
text-align:center;
z-index:20000;
animation:blinkEmergency 1s infinite;
}
.unit-emergency{
border-left:6px solid #ff0000!important;
animation:blinkEmergency 1s infinite;
}
@keyframes blinkEmergency{
50%{opacity:.5}
}


#cad-map{
height:500px;
border:1px solid #404040;
border-radius:6px;
margin-bottom:10px;
z-index:1;
}


.calendar-grid{
display:grid;
grid-template-columns:repeat(7,minmax(140px,1fr));
gap:6px;
margin-top:10px;
}
.calendar-day{
background:var(--input);
border:1px solid var(--border);
border-radius:6px;
padding:8px;
min-height:100px;
}
.calendar-day h4{
margin-bottom:6px;
font-size:.85rem;
}
.shift-entry{
background:#2563eb;
padding:4px;
border-radius:4px;
margin-bottom:4px;
font-size:.8rem;
}


.alert-card{background:var(--input);border-left:5px solid var(--red);padding:10px;margin-bottom:8px;border-radius:4px}
.alert-card.warning{border-left-color:var(--yellow)}
.alert-card.info{border-left-color:var(--blue)}
.alert-pill{display:inline-block;padding:2px 6px;border-radius:999px;background:#7f1d1d;color:#fff;font-size:.75rem;margin-right:4px}


.sim-console-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
}
.sim-call{
background:var(--input);
border-left:5px solid var(--yellow);
padding:10px;
border-radius:5px;
margin-bottom:8px;
}
.sim-call.p1{border-left-color:var(--red)}
.sim-call.p2{border-left-color:var(--yellow)}
.sim-call.p3{border-left-color:var(--blue)}
.sim-score-box{
font-size:1.6rem;
font-weight:bold;
color:var(--green);
}


header{
  min-height:50px;
  height:auto!important;
  flex-wrap:wrap;
  gap:8px;
  padding:8px 1rem!important;
}
#main-nav{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
#main-nav button{
  margin-right:0!important;
}


header{
  position:relative;
  z-index:3000;
  min-height:56px!important;
  height:auto!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
header > div:last-child{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}
#main-nav{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  max-width:82vw;
}
#main-nav button{
  position:relative;
  z-index:3001;
}


.user-menu-wrap{
  position:relative;
  display:flex;
  align-items:center;
}
.user-menu-button{
  background:none;
  border:1px solid var(--border);
  padding:6px 10px;
  white-space:nowrap;
  font-weight:bold;
}
.user-dropdown{
  position:absolute;
  right:0;
  top:38px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:6px;
  padding:6px;
  min-width:170px;
  z-index:50000;
  box-shadow:0 8px 20px rgba(0,0,0,.55);
}
.user-dropdown button{
  width:100%;
  display:block;
  margin-bottom:5px;
  text-align:left;
}
.user-dropdown button:last-child{
  margin-bottom:0;
}


.calendar-weekday{
background:#111827;
border:1px solid var(--border);
border-radius:6px;
padding:8px;
text-align:center;
font-weight:bold;
color:var(--text);
}

.small{font-size:.85rem;color:var(--muted)}

.notification-badge{display:inline-block;min-width:18px;height:18px;line-height:18px;border-radius:999px;background:var(--red);color:white;font-size:.75rem;text-align:center;margin-left:4px}
.notification-item{border-left:4px solid var(--blue);background:var(--panel);border:1px solid var(--border);padding:10px;border-radius:6px;margin-bottom:8px}
.notification-item.unread{border-left-color:var(--yellow);background:#1f2937}


.shift-time-group{
  border:1px solid var(--border);
  border-radius:6px;
  padding:6px;
  margin:6px 0;
  background:rgba(255,255,255,.03);
}
.shift-time-header{
  font-weight:bold;
  color:var(--yellow);
  margin-bottom:4px;
  border-bottom:1px solid var(--border);
  padding-bottom:3px;
}


.leave-card,.swap-card{
  border:1px solid var(--border);
  border-radius:6px;
  padding:5px;
  margin:5px 0;
  font-size:.85rem;
}
.leave-card{border-left:4px solid var(--blue);background:rgba(59,130,246,.10)}
.swap-card{border-left:4px solid var(--yellow);background:rgba(234,179,8,.10)}
.print-only-title{display:none}
@media print{
  header,#main-nav,.no-print,button{display:none!important}
  .print-only-title{display:block!important;color:#000}
  body{background:#fff!important;color:#000!important}
  .panel,.calendar-day,.shift-time-group,.shift-card,.leave-card,.swap-card{
    background:#fff!important;
    color:#000!important;
    border-color:#000!important;
  }
}


.sort-toolbar{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:8px;
}


.archive-badge{
  display:inline-block;
  padding:2px 6px;
  border-radius:999px;
  background:var(--muted);
  color:white;
  font-size:.75rem;
  margin-left:5px;
}
.retention-card{
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px;
  margin-bottom:8px;
  background:rgba(255,255,255,.03);
}


.silver-card{
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px;
  margin-bottom:10px;
  background:rgba(255,255,255,.03);
}
.silver-status{
  display:inline-block;
  padding:3px 8px;
  border-radius:999px;
  font-size:.8rem;
  background:var(--muted);
}
.silver-status.active{background:var(--green);color:white}
.silver-status.pending{background:var(--yellow);color:#111}
.silver-status.inactive{background:var(--red);color:white}


.notice-type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px;margin:8px 0 14px}
.notice-type-option{border:1px solid var(--border);border-radius:6px;padding:8px;background:rgba(255,255,255,.03)}
.notice-type-option label{display:block;font-weight:bold}
.notice-type-option small{display:block;margin-top:4px;color:var(--muted)}
.cad-notice-card{border:1px solid var(--border);border-radius:8px;padding:10px;margin-bottom:10px;background:rgba(255,255,255,.03)}


.position-card{
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px;
  margin-bottom:8px;
  background:rgba(255,255,255,.03);
}

/* index_fixed_ipad_nav_marker */

@media(max-width:900px){
  body{
    height:auto!important;
    min-height:100vh!important;
    overflow:auto!important;
  }
  main{
    overflow:visible!important;
  }
  header{
    align-items:flex-start!important;
  }
  #main-nav{
    max-width:100%!important;
    overflow:visible!important;
  }
  #main-nav button{
    font-size:.85rem;
    padding:6px 8px;
  }
}