/* Area navigation, personal selection and incident communication. */
.area-navigation,.feed-links,.preview-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:18px 0 }
.area-navigation a { display:inline-block; padding:8px 13px; border:1px solid var(--border); border-radius:999px; background:var(--surface,#fff); font-size:13px }
.area-navigation a[aria-current="page"] { background:var(--brand); border-color:var(--brand); color:#fff }
.feed-links { padding:18px 0; gap:12px 24px; font-size:13px }
.preview-toolbar { background:var(--surface,#fff); padding:12px 16px; border:1px solid var(--border); border-radius:12px }
.preview-toolbar select { width:auto; max-width:100%; margin:0 }
.incident-list { display:grid; gap:12px; margin:20px 0 }
.incident-card { border-left:4px solid var(--brand); padding:18px 22px }
.incident-card summary { cursor:pointer; font-weight:600 }
.incident-update { padding:8px 0; border-top:1px solid var(--border) }
.incident-update p { margin:6px 0; overflow-wrap:anywhere }
.service-help { padding:12px 22px; border-top:1px solid var(--border); font-size:13px; overflow-wrap:anywhere }
.service-help p { margin:6px 0 }
.preference-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:24px; align-items:start }
.selection-form div[id^="id_"] { max-height:340px; overflow:auto; border:1px solid var(--border); padding:8px 14px; border-radius:12px; margin-bottom:24px }
.selection-form div[id^="id_"] label { display:flex; align-items:center; gap:10px; padding:8px 0; margin:0 }
.selection-form input[type="checkbox"] { width:18px; height:18px; flex-shrink:0; margin:0 }
@media(max-width:760px) { .preference-grid { grid-template-columns:1fr } .preview-toolbar select { width:100% } }
.form-field{margin-bottom:1.2rem}.form-field[hidden]{display:none}.form-field .helptext{display:block;margin-top:.35rem}

/* Contextual alert classes; semantic text remains visible independently of color. */
.incident-alert{--alert-bg:#cff4fc;--alert-fg:#055160;--alert-border:#9eeaf9;background:var(--alert-bg);color:var(--alert-fg);border-color:var(--alert-border)}
.incident-alert.alert-primary{--alert-bg:#cfe2ff;--alert-fg:#084298;--alert-border:#9ec5fe}
.incident-alert.alert-secondary{--alert-bg:#e2e3e5;--alert-fg:#41464b;--alert-border:#c4c8cb}
.incident-alert.alert-success{--alert-bg:#d1e7dd;--alert-fg:#0f5132;--alert-border:#a3cfbb}
.incident-alert.alert-danger{--alert-bg:#f8d7da;--alert-fg:#842029;--alert-border:#f1aeb5}
.incident-alert.alert-warning{--alert-bg:#fff3cd;--alert-fg:#664d03;--alert-border:#ffe69c}
.incident-alert.alert-info{--alert-bg:#cff4fc;--alert-fg:#055160;--alert-border:#9eeaf9}
.incident-alert.alert-light{--alert-bg:#fefefe;--alert-fg:#495057;--alert-border:#dee2e6}
.incident-alert.alert-dark{--alert-bg:#d3d3d4;--alert-fg:#141619;--alert-border:#bcbebf}
.incident-alert h2,.incident-alert p,.incident-alert summary,.incident-alert a:not(.button){color:inherit}
.incident-alert .incident-update{border-color:var(--alert-border)}
.incident-kind{display:inline-block;font-size:.8em;border:1px solid currentColor;border-radius:5px;padding:2px 6px;margin-right:6px}
.incident-preview{border:1px solid var(--alert-border);border-left-width:4px;border-radius:12px;padding:16px 20px;margin:20px 0}
.incident-preview p{margin:6px 0 0}