/* ===== North Coast incidents map (full-bleed) ===== */
html, body.incidents { height: 100%; margin: 0; }
body.incidents { overflow: hidden; background: #0b1620; }
#imap { position: absolute; inset: 0; width: 100%; height: 100%; background: #0d1f2d; z-index: 1; }

.inc-panel {
  position: absolute; top: 18px; left: 18px; z-index: 10; max-width: 380px;
  background: rgba(11, 22, 32, 0.9); border: 1px solid var(--line);
  border-radius: 12px; padding: 14px 16px; box-shadow: 0 8px 30px rgba(0,0,0,.5);
  backdrop-filter: blur(3px);
}
.inc-panel h1 { font-size: 18px; margin: 0; letter-spacing: .2px; }
.inc-sub { margin: 3px 0 10px; color: var(--muted); font-size: 12.5px; }
.inc-legend { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--muted); margin-bottom: 10px; }
.inc-legend .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: middle; }
.inc-legend .dot.ferry { background: #37c0d6; } .inc-legend .dot.tug { background: #ff6b6b; }
.inc-legend .dot.cargo { background: #ff9d4d; } .inc-legend .dot.fishing { background: #6fcf97; }
.inc-legend .dot.ctx { background: #8fa9bd; opacity: .6; }
#inc-toggle { margin: 0 0 10px; }
.inc-lead { font-size: 13px; color: var(--ink); margin: 0 0 8px; line-height: 1.5; }
.inc-sizekey { font-size: 11px; color: var(--muted); margin: 0 0 8px; display: flex; align-items: center; gap: 3px; }
.inc-sizekey .szdot { display: inline-block; border-radius: 50%; background: #8fa9bd; margin-right: 2px; }
.inc-sizekey .sz-s { width: 6px; height: 6px; } .inc-sizekey .sz-m { width: 11px; height: 11px; } .inc-sizekey .sz-l { width: 17px; height: 17px; margin-right: 6px; }
.inc-stats { font-size: 11.5px; color: var(--accent); margin: 0 0 10px; font-weight: 600; }
.inc-pop .pop-meta { color: var(--muted2); font-size: 11px; margin-bottom: 5px; }
.pop-type.eng { background: #3a2410; color: #ffce88; }
.inc-note { font-size: 11px; color: var(--muted2); line-height: 1.5; border-top: 1px dashed var(--line); padding-top: 9px; margin: 0 0 8px; }
.inc-caveat { border-top-style: dotted; opacity: .92; }
.inc-back { margin: 0; font-size: 12px; }
.inc-back a { color: var(--accent); text-decoration: none; } .inc-back a:hover { text-decoration: underline; }

/* boundary + labels */
.bnd-lbl { color: #cfe1ec; font-size: 10.5px; font-weight: 600; letter-spacing: .5px;
  text-shadow: 0 0 3px #0b1620, 0 0 3px #0b1620; white-space: nowrap; pointer-events: none; }
.inc-ctx { stroke-dasharray: 3 3; }

/* popups */
.inc-popup .leaflet-popup-content-wrapper { background: #0e2130; color: var(--ink); border: 1px solid #24445c; border-radius: 10px; }
.inc-popup .leaflet-popup-tip { background: #0e2130; border: 1px solid #24445c; }
.inc-pop { font-size: 12.5px; line-height: 1.5; }
.inc-pop .pop-h { font-size: 14px; font-weight: 700; margin-bottom: 3px; }
.inc-pop .pop-yr { color: var(--muted); font-weight: 500; margin: 0 4px; }
.inc-pop .pop-type { font-size: 10px; padding: 1px 6px; border-radius: 999px; font-weight: 600; }
.pop-type.ferry { background: #10323c; color: #7fe0ef; } .pop-type.tug { background: #3a1414; color: #ff9d9d; }
.pop-type.cargo { background: #3a2410; color: #ffce88; } .pop-type.ctx { background: #1b2c39; color: #9fb6c8; }
.inc-pop .pop-title { color: var(--accent); font-weight: 600; margin-bottom: 6px; }
.inc-pop .pop-cond { color: var(--muted); }
.inc-pop .pop-src { display: inline-block; margin-top: 4px; color: #8fb8cf; font-size: 11.5px; }

@media (max-width: 620px){ .inc-panel { max-width: none; right: 18px; } }

/* day/night toggle sits in the top-right corner of the top-left panel */
.theme-toggle.inc-theme { position: absolute; top: 10px; right: 10px; margin: 0; }
.inc-panel h1 { padding-right: 92px; }

/* ---- light (day) mode ---- */
body.incidents.light { background: #e9f1f7; }
body.light #imap { background: #cfe0ec; }
body.light .inc-panel { background: rgba(255, 255, 255, 0.92); box-shadow: 0 8px 30px rgba(30,60,82,.25); }
body.light .bnd-lbl { color: #2a4356; text-shadow: 0 0 3px #fff, 0 0 3px #fff; }
body.light .inc-popup .leaflet-popup-content-wrapper { background: #fff; border-color: #b8cddc; }
body.light .inc-popup .leaflet-popup-tip { background: #fff; border-color: #b8cddc; }
body.light .pop-type.eng { background: #faeed8; color: #8a5a10; }
body.light .pop-type.ferry { background: #dcf0f5; color: #0b5e74; }
body.light .pop-type.tug { background: #fbe4e4; color: #b23030; }
body.light .pop-type.cargo { background: #faeed8; color: #9a5312; }
body.light .pop-type.ctx { background: #e5edf3; color: #4c667a; }
body.light .inc-pop .pop-src { color: #2a6f8e; }