/* Water Districts page and interactive map. Shared shell/fonts come from the theme. */
.bh-water-page { width: 100%; font-family: var(--wp--preset--font-family--source-sans-3); }
:where(.bh-water-page) * { box-sizing:border-box }
:where(.bh-water-page) .map-section button { font:600 14px var(--wp--preset--font-family--source-sans-3);color:var(--bh-slate);cursor:pointer }
:where(.bh-water-page) .map-section button:disabled { opacity:.45;cursor:default }
.bh-water-page button:focus-visible,
.bh-water-page a:focus-visible { outline:3px solid #2d5c79;outline-offset:4px }
:where(.bh-water-page) .map-section { border:1px solid var(--bh-border);border-radius:4px;overflow:hidden;background:#fff }
:where(.bh-water-page) .map-toolbar { display:flex;justify-content:space-between;gap:20px;align-items:center;padding:15px 20px;border-bottom:1px solid var(--bh-border) }
:where(.bh-water-page) .map-toolbar strong { display:block;font-size:16px }
:where(.bh-water-page) .map-tools { display:flex;gap:6px;flex-shrink:0 }
:where(.bh-water-page) .map-tools button { min-width:44px;height:44px;background:#fff;border:1px solid #c8c9c6;border-radius:4px;padding:0 13px }
:where(.bh-water-page) .map-tools button:hover:not(:disabled) { background:var(--bh-field-white);border-color:var(--bh-slate) }
:where(.bh-water-page) #zoom-in,
:where(.bh-water-page) #zoom-out { font-size:24px;padding:0;width:44px }
:where(.bh-water-page) .map-stage { position:relative }
:where(.bh-water-page) .map-stage,
:where(.bh-water-page) #district-map { height:640px }
:where(.bh-water-page) .leaflet-container { background:#eeefeb!important;font-family:var(--wp--preset--font-family--source-sans-3)!important }
:where(.bh-water-page) .leaflet-pane.leaflet-roads-pane,
:where(.bh-water-page) .leaflet-pane.leaflet-roadLabels-pane,
:where(.bh-water-page) .leaflet-pane.leaflet-landmarks-pane,
:where(.bh-water-page) .leaflet-pane.leaflet-water-pane { pointer-events:none }
:where(.bh-water-page) .map-loading { position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);margin:0;padding:16px 24px;background:white;border:1px solid var(--bh-border);border-radius:4px;width:max-content;max-width:85%;z-index:700 }
:where(.bh-water-page) .map-loading[hidden] { display:none }
:where(.bh-water-page) .north-arrow { position:absolute;right:20px;top:20px;z-index:650;display:flex;align-items:center;flex-direction:column;gap:2px;pointer-events:none }
:where(.bh-water-page) .north-arrow span { font:600 12px var(--wp--preset--font-family--public-sans) }
:where(.bh-water-page) .north-arrow svg { width:20px;height:30px }
:where(.bh-water-page) .leaflet-control-attribution { font-size:10px!important;background:rgba(255,255,255,.92)!important;padding:3px 7px!important }
:where(.bh-water-page) .leaflet-control-scale { margin:0 0 13px 18px!important }
:where(.bh-water-page) .leaflet-control-scale-line { background:#ffffffde!important;color:var(--bh-slate)!important;font-size:11px!important;border-color:#636c6b!important }
:where(.bh-water-page) .district-path { cursor:pointer!important;transition:fill-opacity .14s,stroke-width .14s;outline:none }
:where(.bh-water-page) .district-path:focus-visible { stroke:#243d4a!important;stroke-width:4!important;fill-opacity:.55!important }
:where(.bh-water-page) .district-marker { background:none!important;border:0!important }
:where(.bh-water-page) .district-label { display:flex;align-items:center;justify-content:center;min-height:38px;white-space:nowrap;text-decoration:none!important;background:#fffffff0;border:1px solid #ffffff;border-left:5px solid var(--district-color);border-radius:3px;padding:5px 9px;color:#303d40!important;font:600 13px var(--wp--preset--font-family--public-sans);box-shadow:0 1px 3px #26363814;transform:translate(-50%,-50%);width:max-content;line-height:1.2 }
:where(.bh-water-page) .district-label:hover,
:where(.bh-water-page) .district-label.is-highlighted { background:#fff;outline:2px solid #364a51;outline-offset:1px }
:where(.bh-water-page) .district-label .external { font-size:12px;color:#697578;margin-left:5px }
:where(.bh-water-page) .district-tooltip { color:#34464b;font-family:var(--wp--preset--font-family--source-sans-3);font-size:13px;padding:6px 10px;border:1px solid #c3c9c9;border-radius:3px;box-shadow:none }
:where(.bh-water-page) .road-label { pointer-events:none!important;white-space:nowrap;color:#626b68;font:600 11px var(--wp--preset--font-family--source-sans-3);text-shadow:-2px -2px 2px #f9faf6,2px -2px 2px #f9faf6,-2px 2px 2px #f9faf6,2px 2px 2px #f9faf6;transform:translate(-50%,-50%);width:max-content;text-align:center }
:where(.bh-water-page) .road-label.minor { font-weight:400;font-size:10px }
:where(.bh-water-page) .landmark-label { pointer-events:none!important;max-width:110px;text-align:center;line-height:1.16;color:#69736c;font:11px var(--wp--preset--font-family--source-sans-3);text-shadow:0 1px 2px white,0 -1px 2px white;transform:translate(-50%,-50%);width:max-content }
:where(.bh-water-page) .landmark-label .landmark-dot { display:block;font-size:13px;margin-bottom:2px;color:#5b7062 }
:where(.bh-water-page) .district-directory { padding:25px 0 0 }
:where(.bh-water-page) .directory-heading { display:flex;align-items:baseline;gap:20px;margin-bottom:14px }
:where(.bh-water-page) .directory-heading p { margin:0;font-size:14px;color:#746d68 }
:where(.bh-water-page) .district-list { list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px }
:where(.bh-water-page) .district-link { display:flex;align-items:flex-start;gap:12px;min-height:112px;border:1px solid var(--bh-border);border-radius:4px;padding:15px 12px;text-decoration:none;transition:background .14s,border-color .14s }
:where(.bh-water-page) .district-link:hover,
:where(.bh-water-page) .district-link.is-highlighted { background:#f5f6f3;border-color:#768380 }
:where(.bh-water-page) .swatch { width:12px;height:12px;border-radius:2px;background:var(--district-color);border:1px solid #00000015;flex-shrink:0;margin-top:5px }
:where(.bh-water-page) .district-family { display:block;font-size:12px;line-height:1.2;color:#706a66;margin-bottom:5px }
:where(.bh-water-page) .district-link strong { display:block;font-size:17px;color:var(--bh-slate);line-height:1.3;white-space:nowrap }
:where(.bh-water-page) .link-label { display:block;font-size:12px;color:#655c52;margin-top:7px;text-decoration:underline;text-underline-offset:3px }
:where(.bh-water-page) .reference-note { background:var(--bh-field-white);border-left:3px solid var(--bh-bronze);padding:15px 18px;margin:23px 0 18px;font-size:14px;color:#625b55 }
:where(.bh-water-page) .sr-only { position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap }
:where(.bh-water-page) .map-section.is-expanded { position:fixed;inset:16px;z-index:1000;display:flex;flex-direction:column;box-shadow:0 0 0 100vw #222a30b3 }
:where(.bh-water-page) .map-section.is-expanded .map-stage { flex:1;min-height:0;height:auto }
:where(.bh-water-page) .map-section.is-expanded #district-map { height:100% }
body.bh-water-map-expanded { overflow:hidden }
@media(max-width:1000px){
:where(.bh-water-page) .district-list { grid-template-columns:repeat(3,minmax(0,1fr)) }
:where(.bh-water-page) .district-link { min-height:105px }
:where(.bh-water-page) .map-stage,
:where(.bh-water-page) #district-map { height:610px }
:where(.bh-water-page) .map-toolbar { padding:13px 16px }
:where(.bh-water-page) .map-tools { gap:5px }
}
@media(max-width:640px){
:where(.bh-water-page) .map-toolbar { align-items:flex-start;flex-direction:column;gap:12px;padding:13px }
:where(.bh-water-page) .map-tools { width:100%;gap:5px }
:where(.bh-water-page) .map-tools button { padding:0 9px;font-size:12px }
:where(.bh-water-page) #zoom-in,
:where(.bh-water-page) #zoom-out { font-size:24px }
:where(.bh-water-page) .map-stage,
:where(.bh-water-page) #district-map { height:535px }
:where(.bh-water-page) .district-list { grid-template-columns:repeat(2,minmax(0,1fr));gap:8px }
:where(.bh-water-page) .district-link { padding:13px;min-height:104px }
:where(.bh-water-page) .directory-heading { display:block }
:where(.bh-water-page) .directory-heading p { margin-top:5px }
:where(.bh-water-page) .district-directory { padding-top:22px }
:where(.bh-water-page) .reference-note { font-size:13px;padding:12px 14px }
:where(.bh-water-page) .district-label { font-size:11px;min-height:32px;padding:4px 6px;border-left-width:4px }
:where(.bh-water-page) .district-label .external { display:none }
:where(.bh-water-page) .north-arrow { right:12px;top:12px }
:where(.bh-water-page) .map-section.is-expanded { inset:7px }
:where(.bh-water-page) .map-section.is-expanded .map-toolbar { flex-direction:row;flex-wrap:wrap }
:where(.bh-water-page) .leaflet-control-scale { margin-left:10px!important }
:where(.bh-water-page) .road-label { font-size:10px }
}
@media(prefers-reduced-motion:reduce){
:where(.bh-water-page) * { transition:none!important;scroll-behavior:auto!important }
}
:where(.bh-water-page) .district-label { pointer-events:auto;gap:4px }
:where(.bh-water-page) .district-label .external { margin-left:0 }
:where(.bh-water-page) .map-warning { top:auto;bottom:36px;transform:translateX(-50%);font-size:13px;padding:8px 14px }
@media(max-width:640px){
:where(.bh-water-page) .district-label { flex-wrap:wrap;width:44px;min-height:44px;gap:0;padding:4px 3px }
:where(.bh-water-page) .district-label .label-type { width:100%;text-align:center;font-size:9px;font-weight:500 }
:where(.bh-water-page) .district-label .label-code { width:100%;text-align:center;font-size:14px;font-weight:600;line-height:1.2 }
}
:where(.bh-water-page) .zoom-buttons { display:flex }
:where(.bh-water-page) .zoom-buttons #zoom-in { border-radius:4px 0 0 4px }
:where(.bh-water-page) .zoom-buttons #zoom-out { border-radius:0 4px 4px 0;border-left:0 }
:where(.bh-water-page) .map-tools { gap:8px }
:where(.bh-water-page) .map-section.is-touch-inline #district-map { touch-action:pan-y!important }
@media(max-width:640px){
:where(.bh-water-page) .map-tools { gap:8px }
:where(.bh-water-page) .map-tools #expand-map { margin-left:auto }
}

/* Approved page layout. */
:where(.bh-water-page) a { color: var(--bh-slate); }
:where(.bh-water-page) a:hover,
:where(.bh-water-page) a:focus { color: var(--bh-bronze); }
:where(.bh-water-page) h1,
:where(.bh-water-page) h2,
:where(.bh-water-page) h3,
:where(.bh-water-page) h4 { font-family: var(--wp--preset--font-family--public-sans); color: var(--bh-slate); line-height: 1.3; }
:where(.bh-water-page) .rail { width: var(--bh-rail); margin-inline: auto; }
.bh-water-page h1 { font-size: 42px; line-height: 1.2; letter-spacing: -.025em; margin: 0 0 14px; }
.bh-water-page h2 { font-size: 26px; line-height: 1.3; margin: 0; }
.bh-water-page h3 { font-size: 20px; margin: 0; }
.bh-water-page .bh-page-header { padding-block: 34px 28px; }
:where(.bh-water-page) .bh-page-header p { margin: 0; }
:where(.bh-water-page) .water-map-content { padding-block: 24px 36px; }
.bh-water-page .reference-note { margin: 18px 0 0; font-size: 15px; }
.bh-water-page .district-directory { padding-top: 32px; }
.bh-water-page .directory-heading { margin-bottom: 18px; }
:where(.bh-water-page) .district-card { border: 1px solid var(--bh-border); border-radius: 4px; overflow: hidden; background: var(--bh-white); }
.bh-water-page .bh-card-system .district-card { padding: 0; }
:where(.bh-water-page) .district-card .district-link { border: 0; border-radius: 0; padding: 20px 16px 8px; min-height: 0; }
:where(.bh-water-page) .district-card:has(.district-link.is-highlighted),
:where(.bh-water-page) .district-card:hover { border-color: #768380; }
:where(.bh-water-page) .district-family { font-size: 14px; }
:where(.bh-water-page) .district-link strong { font-size: 19px; }
:where(.bh-water-page) .district-link .link-label { font-size: 14px; margin-top: 10px; }
:where(.bh-water-page) .district-contact { display: block; padding: 4px 16px 20px 40px; font-size: 14px; }
:where(.bh-water-page) .district-abbreviations { margin: 15px 0 0; color: var(--bh-muted-taupe); font-size: 14px; }
:where(.bh-water-page) .water-meetings { padding-block: 40px; }
:where(.bh-water-page) .meeting-intro { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 24px; }
:where(.bh-water-page) .meeting-intro p { margin: 12px 0 0; max-width: 480px; color: var(--bh-muted-taupe); font-size: 17px; }
:where(.bh-water-page) .meeting-location { border-left: 3px solid var(--bh-bronze); padding-left: 22px; }
:where(.bh-water-page) .meeting-location h3 { font-size: 17px; }
:where(.bh-water-page) .meeting-location address { font-style: normal; margin-top: 6px; }
:where(.bh-water-page) .meeting-location a { display: inline-block; font-size: 15px; margin-top: 5px; }
:where(.bh-water-page) .meeting-days { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 28px; }
:where(.bh-water-page) .meeting-day { background: var(--bh-white); border: 1px solid var(--bh-border); border-radius: 4px; padding: 24px; min-width: 0; }
:where(.bh-water-page) .meeting-day h3 { margin-bottom: 16px; }
:where(.bh-water-page) .meeting-day table { border-collapse: collapse; width: 100%; font-size: 16px; }
:where(.bh-water-page) .meeting-day thead th { font-weight: 400; font-size: 14px; color: var(--bh-muted-taupe); text-align: left; border-bottom: 1px solid var(--bh-border); padding: 0 0 9px; }
:where(.bh-water-page) .meeting-day tbody th { font-weight: 600; text-align: left; }
:where(.bh-water-page) .meeting-day tbody th,
:where(.bh-water-page) .meeting-day tbody td { border-bottom: 1px solid #e8e7e4; padding: 14px 8px 14px 0; }
:where(.bh-water-page) .meeting-day tbody tr:last-child > * { border-bottom: 0; padding-bottom: 0; }
:where(.bh-water-page) .meeting-day td { white-space: nowrap; }
:where(.bh-water-page) .meeting-day td:last-child { text-align: right; padding-right: 0; font-size: 14px; }
:where(.bh-water-page) .meeting-district { display: flex; gap: 10px; align-items: baseline; }
:where(.bh-water-page) .meeting-district .swatch { width: 10px; height: 10px; }
:where(.bh-water-page) .meeting-note { margin: 19px 0 0; color: var(--bh-text-86); font-size: 15px; }
.bh-water-page [id] { scroll-margin-top: 20px; }
@media (max-width: 1000px) {
:where(.bh-water-page) .meeting-intro { grid-template-columns: 1fr; }
:where(.bh-water-page) .meeting-days { grid-template-columns: 1fr; gap: 18px; }
:where(.bh-water-page) .meeting-day tbody th { width: 55%; }
}
@media (max-width: 640px) {
.bh-water-page h1 { font-size: 34px; }
.bh-water-page h2 { font-size: 24px; }
.bh-water-page .bh-page-header { padding-block: 28px 24px; }
:where(.bh-water-page) .bh-page-header p { font-size: 17px; line-height: 1.55; }
:where(.bh-water-page) .water-map-content { padding-block: 26px 30px; }
:where(.bh-water-page) .district-card .district-link { padding: 16px 12px 6px; gap: 9px; }
:where(.bh-water-page) .district-contact { padding: 5px 12px 16px 33px; }
:where(.bh-water-page) .district-link strong { font-size: 18px; }
:where(.bh-water-page) .district-link .link-label,
:where(.bh-water-page) .district-contact { font-size: 13px; }
:where(.bh-water-page) .district-abbreviations { font-size: 13px; }
:where(.bh-water-page) .water-meetings { padding-block: 30px; }
:where(.bh-water-page) .meeting-location { padding-left: 14px; }
:where(.bh-water-page) .meeting-intro p { font-size: 16px; }
:where(.bh-water-page) .meeting-days { margin-top: 24px; }
:where(.bh-water-page) .meeting-day { padding: 20px 16px; }
:where(.bh-water-page) .meeting-day table { font-size: 14px; }
:where(.bh-water-page) .meeting-day tbody th { width: auto; }
:where(.bh-water-page) .meeting-day td:last-child { font-size: 13px; }
:where(.bh-water-page) .meeting-district { gap: 7px; }
:where(.bh-water-page) .meeting-district .swatch { display: none; }
}
.bh-water-page .map-toolbar { padding: 12px 18px; gap: 12px; }
.bh-water-page .map-toolbar h2 { font-size: 22px; margin: 0; }
.bh-water-page .bh-ntb-support h2 { color: var(--bh-white); font-size: 28px; line-height: 1.29; }
.bh-water-page .bh-ntb-support p { margin-bottom: 0; }
.bh-water-page .bh-ntb-button--quiet { color: var(--bh-white); }
.bh-water-page .bh-ntb-button--quiet:hover { background: #ffffff14; }
.bh-water-page .bh-ntb-support a:focus-visible { outline-color: var(--bh-white); }
.bh-water-page .leaflet-control-attribution { font-size: 11px!important; color: var(--bh-slate); padding: 3px 6px!important; }
.bh-water-page .leaflet-control-attribution a { color: var(--bh-slate); }
@media(max-width:640px) {
.bh-water-page .map-toolbar { padding: 12px; }
.bh-water-page .map-toolbar h2 { font-size: 20px; }
}

/* Keep decorative arrows as text glyphs, outside WordPress emoji replacement. */
:where(.bh-water-page) .external-icon::after,
:where(.bh-water-page) .district-label .external::after { content: "\2197"; }
