/* Status page. Fonts come from the site; colors from Outage Alerts settings. */
.pbn-status { --pbn-st-border: #e3e6e8; --pbn-st-muted: #5f6b73; --pbn-st-ok: var(--pbn-resolved, #1f7a3d); max-width: 920px; margin: 0 auto; padding: 40px 16px 56px; box-sizing: border-box; color: inherit; text-align: left; }
.pbn-status .pbn-st-title { margin: 0 0 4px; }
.pbn-status .pbn-st-sub { margin: 0 0 20px; color: var(--pbn-st-muted); font-size: 14px; }
.pbn-st-icon { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.pbn-st-overall { display: flex; gap: 14px; align-items: center; padding: 18px 20px; border-radius: 12px; color: #fff; margin-bottom: 28px; }
.pbn-st-overall .pbn-st-icon { width: 34px; height: 34px; }
.pbn-st-overall.is-ok { background: var(--pbn-st-ok); }
.pbn-st-overall.is-down { background: var(--pbn-outage, #b42318); }
.pbn-st-overall.is-maint { background: var(--pbn-maint, #8a5a00); }
.pbn-st-overall-title { font-size: 20px; font-weight: 700; line-height: 1.3; }
.pbn-st-overall-sub { font-size: 14px; opacity: .92; margin-top: 2px; }

.pbn-st-section { margin: 0 0 28px; }
.pbn-st-section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; border-bottom: 2px solid var(--pbn-st-border); padding-bottom: 8px; margin-bottom: 12px; }
.pbn-status .pbn-st-h { margin: 0; font-size: 18px; text-transform: none; letter-spacing: 0; }
.pbn-st-count { font-size: 13px; color: var(--pbn-st-muted); }

.pbn-st-card { border: 1px solid var(--pbn-st-border); border-left: 5px solid var(--pbn-info, #1d5fa8); border-radius: 0 10px 10px 0; padding: 14px 16px; margin-bottom: 12px; background: #fff; }
.pbn-st-card.pbn-st-outage { border-left-color: var(--pbn-outage, #b42318); }
.pbn-st-card.pbn-st-maintenance, .pbn-st-card.pbn-st-upcoming { border-left-color: var(--pbn-maint, #8a5a00); }
.pbn-st-card-top { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.pbn-st-card .pbn-st-icon { width: 20px; height: 20px; }
.pbn-st-outage .pbn-st-card-top .pbn-st-icon { color: var(--pbn-outage, #b42318); }
.pbn-st-maintenance .pbn-st-card-top .pbn-st-icon, .pbn-st-upcoming .pbn-st-card-top .pbn-st-icon { color: var(--pbn-maint, #8a5a00); }
.pbn-st-card-title { font-weight: 700; font-size: 16px; flex: 1; min-width: 200px; }
.pbn-st-pill { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: #fdecea; color: var(--pbn-outage, #b42318); white-space: nowrap; }
.pbn-st-maintenance .pbn-st-pill { background: #fdf3e1; color: var(--pbn-maint, #8a5a00); }
.pbn-st-info .pbn-st-pill { background: #e8f0fa; color: var(--pbn-info, #1d5fa8); }
.pbn-status .pbn-st-msg { margin: 8px 0 0 30px; font-size: 15px; line-height: 1.55; }
.pbn-st-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 10px 0 0 30px; font-size: 13px; color: var(--pbn-st-muted); }
.pbn-st-eta { color: inherit; }
.pbn-st-eta strong { color: #1d2327; }

.pbn-status .pbn-st-history { list-style: none; margin: 0; padding: 0; }
.pbn-status .pbn-st-row { display: grid; grid-template-columns: 70px minmax(0, 1fr) auto; gap: 12px; padding: 11px 4px; border-bottom: 1px solid var(--pbn-st-border); font-size: 14px; line-height: 1.45; margin: 0; }
.pbn-status .pbn-st-row::before { content: none; }
.pbn-st-row:last-child { border-bottom: 0; }
.pbn-st-date { color: var(--pbn-st-muted); }
.pbn-st-dur { color: var(--pbn-st-muted); white-space: nowrap; text-align: right; }
.pbn-st-row-maintenance .pbn-st-dur { font-style: italic; }
.pbn-status .pbn-st-empty { margin: 0; color: var(--pbn-st-muted); }

.pbn-st-help { background: #f4f6f7; border-radius: 10px; padding: 14px 16px; font-size: 15px; line-height: 1.55; }
.pbn-st-help a { font-weight: 600; }
.pbn-st-call { white-space: nowrap; }
.pbn-st-call-icon { width: 16px !important; height: 16px !important; vertical-align: -3px; margin-right: 3px; }

@media (max-width: 600px) {
	.pbn-st-overall { padding: 14px 16px; }
	.pbn-st-overall-title { font-size: 17px; }
	.pbn-status .pbn-st-msg, .pbn-st-meta { margin-left: 0; }
	.pbn-status .pbn-st-row { grid-template-columns: 56px minmax(0, 1fr); }
	.pbn-st-dur { grid-column: 2; text-align: left; }
}

.pbn-st-area { border: 1px solid var(--pbn-st-border); border-radius: 12px; padding: 16px 18px; margin: -12px 0 28px; background: #fff; }
.pbn-status .pbn-st-area-label { display: block; font-weight: 700; font-size: 17px; margin: 0; }
.pbn-st-area-help { font-size: 14px; color: var(--pbn-st-muted); margin: 2px 0 10px; }
.pbn-status .pbn-st-town { min-width: 240px; max-width: 100%; padding: 8px 10px; font-size: 15px; border: 1px solid #c3c4c7; border-radius: 6px; background: #fff; }
.pbn-st-area-res { display: flex; gap: 12px; align-items: flex-start; border-radius: 10px; padding: 12px 14px; margin-top: 12px; }
.pbn-st-area-res.is-down { background: #fdecea; color: var(--pbn-outage, #b42318); }
.pbn-st-area-res.is-maint { background: #fdf3e1; color: var(--pbn-maint, #8a5a00); }
.pbn-st-area-res.is-ok { background: #e9f5ed; color: var(--pbn-resolved, #1f7a3d); }
.pbn-st-area-title { font-weight: 700; font-size: 16px; }
.pbn-st-area-text { font-size: 14px; margin-top: 2px; color: #1d2327; }
@media (max-width: 600px) { .pbn-status .pbn-st-town { width: 100%; } }

/* Keep the town picker a sensible width on wide screens (themes often stretch selects to 100%). */
.pbn-status select.pbn-st-town { width: auto !important; min-width: 300px; max-width: 380px !important; }
@media (max-width: 600px) { .pbn-status select.pbn-st-town { width: 100% !important; max-width: 100% !important; min-width: 0; } }

/* Themes (OceanWP) give selects a fixed height that clips the text; size it to the text instead. */
.pbn-status select.pbn-st-town {
	height: auto !important; min-height: 46px !important; line-height: 1.4 !important;
	padding: 10px 40px 10px 14px !important; font-size: 15px !important;
	border: 1px solid #c3c4c7 !important; border-radius: 8px !important; background-color: #fff !important;
	box-sizing: border-box !important; vertical-align: middle;
}
.pbn-status select.pbn-st-town:focus { outline: 2px solid var(--pbn-info, #1d5fa8); outline-offset: 1px; }
.pbn-st-area-help { margin-bottom: 12px !important; }

.pbn-st-svc { font-size: 12px; font-weight: 600; padding: 2px 9px; border-radius: 999px; background: #eef2f6; color: #3c434a; white-space: nowrap; }
.pbn-st-mapsec { margin-top: -8px; }
.pbn-st-card-areas { flex-basis: 100%; order: 9; font-size: 13px; color: #646970; margin-top: 2px; }

.pbn-st-soon { font-size: 12px; font-weight: 600; color: #1d5fa8; background: #eef4fb; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }

/* Announcements strip under the status box */
.pbn-st-notes { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; margin: -18px 0 24px; }
.pbn-st-notes > * { min-width: 0; }
.pbn-st-note { display: flex; gap: 10px; align-items: flex-start; background: #f2f7fc; border: 1px solid #d3e3f3; border-left: 4px solid #1d5fa8; border-radius: 8px; padding: 9px 14px; }
.pbn-st-note > svg, .pbn-st-note > .pbn-st-icon { flex: none; margin-top: 2px; color: #1d5fa8; width: 18px; height: 18px; }
.pbn-st-note-tx { flex: 1; min-width: 0; }
.pbn-st-note-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; }
.pbn-st-note-head strong { font-size: 15px; }
.pbn-st-note-msg { font-size: 14px; line-height: 1.45; color: #344054; margin-top: 2px; }
.pbn-st-note-msg.is-short { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pbn-st .pbn-st-note-more, .pbn-st-note-more { background: none !important; border: 0 !important; padding: 0 !important; margin: 2px 0 0 !important; color: #1d5fa8 !important; font: inherit !important; font-size: 13px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; cursor: pointer; box-shadow: none !important; min-height: 0 !important; width: auto !important; }
.pbn-st-note-more[hidden] { display: none !important; }