/* School Holiday Map v2.1 - approved Coastal Summer site-wide palette and header. */
:root{
  --bg:#f4fbfa;
  --card:#fff;
  --ink:#17324d;
  --muted:#51687a;
  --line:#dbe6e8;
  --line-strong:#b5cdd1;
  --violet:#176b68;
  --violet-deep:#176b68;
  --violet-light:#71d0c4;
  --violet-wash:#e8f6f4;
  --none:#fffaf2;
  --accent:#ff7268;
  --shadow:0 9px 28px rgba(23,50,77,.08)
}

/* Replace legacy purple literals that are not token-driven in the shared WP4 CSS. */
button:focus-visible,input:focus-visible,a:focus-visible,.feature:focus-visible,.datePrecision summary:focus-visible{outline-color:#168d86}
body>header:not(.mountainHeader){background:#fffaf2}
.ghost:hover{background:#f2faf8}
#mapSvg{background:linear-gradient(180deg,#f8fcfc,#edf7f5)}
#mapLayer{filter:drop-shadow(0 4px 3.5px rgba(23,50,77,.16))}
.feature{stroke:#17324d}
.status-ALL{fill:#168d86}
.status-SOME{fill:#71d0c4}
.status-MAPCONTEXT{fill:#dce9e9}
.mapGestureHint{background:rgba(23,50,77,.80)}
.tooltip{background:#17324d}
.swatch{border-color:#567276}
.swatch.all{background:#168d86}
.swatch.some{background:#71d0c4}
.statusPill.ALL{background:#176b68;color:#fff}
.statusPill.SOME{background:#bfe8e2;color:#17324d}
.statusPill.NEUTRAL{background:#f7fbfc}
.statusPill.INFORMATIONAL,.statusPill.CONTEXT{background:#e8f1f1;color:#405a67}
.limitation,.reasonBox,.boundaryBox,.scopeBox{border-left-color:#78999a;background:#f2f8f7}
.reasonBox{border-left-color:#168d86;background:#e8f6f4}
.scopeBox{border-left-color:#ff7268;background:#fff2ef}
.boundaryBox{border-left-color:#7aa6a4;background:#f6fbfa}
.daily td,.daily th,.summaryCountryList li{border-bottom-color:#e3eeee}
.sourceGroup+.sourceGroup{border-top-color:#e3eeee}
.summaryDialog::backdrop{background:rgba(23,50,77,.48)}
.summaryDialogPanel{box-shadow:0 20px 55px rgba(23,50,77,.22)}
.summaryDialogEmpty{background:#f2f8f7}
.areaLink.selected{background:#fff0ef}

header.mountainHeader{
  --mountain-ink:#17324d;
  --mountain-deep:#245d68;
  --mountain-front:#168d86;
  --mountain-mid:#71d0c4;
  --mountain-back:#ccecf0;
  --mountain-coral:#ff7268;
  --mountain-paper:#fffaf2;
  --mountain-line:#dbe6e8;
  position:relative;
  isolation:isolate;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  gap:20px;
  min-height:154px;
  overflow:hidden;
  padding:14px max(24px,calc((100vw - 1400px)/2));
  border-top:4px solid var(--mountain-front);
  border-bottom:1px solid var(--mountain-line);
  background:var(--mountain-paper);
}
.mountainHeader .brandBlock{position:relative;z-index:5;min-width:0;max-width:720px}
.mountainHeader .brandLink{display:block;margin:0;color:var(--mountain-ink);font-size:38px;line-height:1.04;font-weight:750;letter-spacing:-.04em;text-decoration:none}
.mountainHeadline{margin:6px 0 0;color:var(--mountain-deep);font-size:15px;line-height:1.25;font-weight:700}
.mountainSupport{margin:3px 0 0;color:#51687a;font-size:12px;line-height:1.3}
.mountainScene{position:absolute;z-index:1;inset:0;overflow:hidden;pointer-events:none}
.mountainSun{position:absolute;z-index:4;top:13px;right:max(54px,calc((100vw - 1290px)/2));width:46px;height:46px;border-radius:50%;background:var(--mountain-coral);box-shadow:0 0 0 7px rgba(255,114,104,.09)}
.mountainLayer{position:absolute;right:0;bottom:0;left:0}
.mountainBack{z-index:1;height:88px;background:var(--mountain-back);clip-path:polygon(0 64%,9% 31%,20% 54%,31% 42%,43% 69%,56% 26%,66% 49%,78% 18%,89% 45%,100% 29%,100% 100%,0 100%)}
.mountainMid{z-index:2;height:70px;background:var(--mountain-mid);clip-path:polygon(0 66%,12% 39%,23% 54%,34% 25%,48% 61%,61% 36%,72% 55%,84% 21%,100% 59%,100% 100%,0 100%)}
.mountainFront{z-index:3;height:52px;background:var(--mountain-front);clip-path:polygon(0 63%,11% 34%,22% 68%,36% 43%,48% 72%,63% 31%,75% 57%,88% 27%,100% 60%,100% 100%,0 100%)}
.mountainHeader .badge{position:absolute;z-index:6;right:max(24px,calc((100vw - 1352px)/2));bottom:9px;display:block;align-self:auto;white-space:nowrap;background:rgba(255,250,242,.94);color:#176b68;box-shadow:0 2px 10px rgba(23,50,77,.12)}

@media(max-width:900px){
  header.mountainHeader{min-height:150px;padding:13px 16px}
  .mountainHeader .brandBlock{max-width:620px}
  .mountainHeader .brandLink{font-size:34px}
  .mountainSun{right:24px;width:42px;height:42px}
  .mountainHeader .badge{right:16px}
}

@media(max-width:520px){
  header.mountainHeader{display:block;min-height:150px;padding:11px 14px}
  .mountainHeader .brandBlock{max-width:calc(100% - 44px)}
  .mountainHeader .brandLink{font-size:29px;line-height:1.06;white-space:nowrap}
  .mountainHeadline{margin-top:5px;font-size:12px;line-height:1.22}
  .mountainSupport{margin-top:3px;font-size:10.5px;line-height:1.24}
  .mountainSun{top:10px;right:15px;width:32px;height:32px;box-shadow:0 0 0 5px rgba(255,114,104,.09)}
  .mountainBack{height:68px;clip-path:polygon(0 64%,16% 24%,30% 51%,43% 34%,58% 67%,72% 24%,86% 48%,100% 29%,100% 100%,0 100%)}
  .mountainMid{height:53px;clip-path:polygon(0 67%,18% 36%,34% 58%,50% 27%,68% 63%,83% 26%,100% 60%,100% 100%,0 100%)}
  .mountainFront{height:39px;clip-path:polygon(0 65%,17% 35%,34% 70%,51% 39%,69% 67%,85% 31%,100% 61%,100% 100%,0 100%)}
  .mountainHeader .badge{right:12px;bottom:6px;padding:5px 8px;font-size:10px;line-height:1}
  #mapLayer{filter:drop-shadow(0 3px 3px rgba(23,50,77,.14))}
}

@media(max-width:370px){
  .mountainHeader .brandLink{font-size:27px}
  .mountainHeadline{font-size:11px}
  .mountainSupport{font-size:10px}
}

@media(forced-colors:active){
  .mountainScene{display:none}
  header.mountainHeader{min-height:auto}
  .mountainHeader .badge{position:static;margin-top:8px;width:max-content}
}