/* TG uk-hazards.css: the UK Flood & hazards page only (app/modules/hazards/uk.php, prefix ukhz-), on top of hazards.css
   (haz-tiles, haz-tl, haz-kit, hz-traits) and uk.css. Built 10/17 from mocks/uk-hazards-exeter.html. Core tokens only. */
:root{--ukhz-r3:#1d4ed8;--ukhz-r2:#60a5fa;--ukhz-r1:#bfdbfe;--ukhz-s3:#c026d3;--ukhz-s2:#e879f9;--ukhz-s1:#f5d0fe;--ukhz-past:#c2410c;--ukhz-wa:#0e7490}
.ukhz-ti{font-size:19px}
a.haz-tile.ukhz-ht{color:inherit;text-decoration:none;display:block;transition:border-color .15s,box-shadow .15s}
a.haz-tile.ukhz-ht:hover{border-color:var(--hc);box-shadow:0 6px 24px rgba(15,22,35,.07)}
.ukhz-tiles{grid-template-columns:repeat(3,1fr)}
.ukhz-not{font-size:13.5px;display:block}
.ukhz-not b{margin-right:4px}
.ukhz-panel{margin-top:22px}
/* flood map */
.ukhz-fmap{position:relative;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#eef1f4}
.ukhz-fmap .ukhz-tiles,.ukhz-rmap .ukhz-tiles{opacity:.6;filter:grayscale(.9)}
.ukhz-sw-eng{filter:hue-rotate(75deg) saturate(1.6)}
.ukhz-fmap .L-rs{opacity:.75}
.ukhz-bua path{fill:none;stroke:var(--ink);stroke-width:2.4;stroke-dasharray:7 5;vector-effect:non-scaling-stroke}
.ukhz-past path{fill:rgba(234,88,12,.28);stroke:var(--ukhz-past);stroke-width:1.2;vector-effect:non-scaling-stroke}
.ukhz-wa path{fill:rgba(14,116,144,.12);stroke:var(--ukhz-wa);stroke-width:2;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}
.ukhz-fmap.off-rs .L-rs,.ukhz-fmap.off-sw .L-sw,.ukhz-fmap.off-past .L-past,.ukhz-fmap.off-wa .L-wa{display:none}
.ukhz-lyr{position:absolute;top:10px;left:10px;z-index:2;display:flex;flex-wrap:wrap;gap:6px}
.ukhz-lyr button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.92);font:600 13px var(--sans);color:var(--muted);cursor:pointer}
.ukhz-lyr button.on{color:var(--ink);border-color:var(--ink);box-shadow:0 2px 8px rgba(15,22,35,.12)}
.ukhz-lyr button:not(.on) .ukhz-sw{opacity:.35}
.ukhz-sw{display:inline-block;width:10px;height:10px;border-radius:50%}
.ukhz-sw.rs{background:var(--ukhz-r3)}.ukhz-sw.sw{background:var(--ukhz-s3)}.ukhz-sw.past{background:#ea580c}.ukhz-sw.wa{background:var(--ukhz-wa);border-radius:2px}
.ukhz-fmap .tmap-attr,.ukhz-rmap .tmap-attr{position:absolute;right:6px;bottom:4px;font-size:10.5px;color:var(--muted);background:rgba(255,255,255,.85);padding:1px 6px;border-radius:4px}
.ukhz-fkey{margin-top:10px}
.ukhz-fkey .sep{color:var(--faint);margin-right:10px}
.ukhz-k.r3{background:var(--ukhz-r3)}.ukhz-k.r2{background:var(--ukhz-r2)}.ukhz-k.r1{background:var(--ukhz-r1)}
.ukhz-k.s3{background:var(--ukhz-s3)}.ukhz-k.s2{background:var(--ukhz-s2)}.ukhz-k.s1{background:var(--ukhz-s1)}
/* the map key wears the EA's own palette (the layers are the EA's images) */
.ukhz-fkey .ukhz-k.r3{background:#555b9d}.ukhz-fkey .ukhz-k.r2{background:#9a9fde}.ukhz-fkey .ukhz-k.r1{background:#c3e0ff}
.ukhz-fkey .ukhz-k.s3{background:#a63f9a}.ukhz-fkey .ukhz-k.s2{background:#d79adb}.ukhz-fkey .ukhz-k.s1{background:#f3d3f5}
.ukhz-k.wr{background:#a6c1e9}.ukhz-k.ws{background:#b5daac}.ukhz-k.wsw{background:#d2a7dd}
.ukhz-k.w{background:var(--ukhz-wa)}.ukhz-k.a{background:#a5d8e6}
.ukhz-dash{display:inline-block;width:18px;height:0!important;border-top:2.4px dashed var(--ink);border-radius:0!important;vertical-align:3px}
/* rivers and the sea */
.ukhz-band{border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;border-top:5px solid var(--ukhz-r1);display:flex;flex-direction:column;gap:2px}
.ukhz-band.r3{border-top-color:var(--ukhz-r3)}.ukhz-band.r2{border-top-color:var(--ukhz-r2)}
.ukhz-band b{font-size:32px;font-weight:800;letter-spacing:-.04em;line-height:1.1}
.ukhz-band small{font-size:13px;color:var(--muted)}
.ukhz-band em{font-style:normal;font-size:12.5px;color:var(--ink-2);margin-top:6px;padding-top:6px;border-top:1px solid var(--hair)}
.ukhz-hist{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;align-items:end;height:170px;padding-top:18px}
.ukhz-hb{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:3px}
.ukhz-hb i{display:block;width:100%;max-width:44px;background:var(--ukhz-r1);border-radius:4px 4px 0 0;min-height:2px}
.ukhz-hb.me i{background:var(--ukhz-r3)}
.ukhz-hb span{font-size:11.5px;color:var(--muted)}
.ukhz-hb b{font-size:11px;font-weight:600;color:var(--muted);text-align:center;line-height:1.2;min-height:27px}
.ukhz-hb em{position:absolute;top:-16px;font-style:normal;font:700 11.5px var(--sans);color:var(--ukhz-r3);white-space:nowrap}
.ukhz-pb{display:inline-block;width:90px;height:8px;border-radius:4px;background:#eef2f7;vertical-align:middle;overflow:hidden}
.ukhz-pb i{display:block;height:100%;background:var(--ukhz-r2)}
.ukhz-pt tr.me .ukhz-pb i{background:var(--ukhz-r3)}
/* surface water */
.ukhz-vs{display:grid;grid-template-columns:150px 1fr 60px;gap:10px;align-items:center;margin:0 0 10px;font-size:14px}
.ukhz-vs b{font-size:18px;text-align:right}
.ukhz-st2{display:flex;height:22px;border-radius:6px;background:#f1f3f6;overflow:hidden}
.ukhz-st2 i{display:block;height:100%}
.ukhz-st2 i.s3{background:var(--ukhz-s3)}.ukhz-st2 i.s2{background:var(--ukhz-s2)}.ukhz-st2 i.s1{background:var(--ukhz-s1)}
.ukhz-st2 i.r3{background:var(--ukhz-r3)}.ukhz-st2 i.r2{background:var(--ukhz-r2)}.ukhz-st2 i.r1{background:var(--ukhz-r1)}
.ukhz-vsax{display:grid;grid-template-columns:150px 1fr 60px;gap:10px;font-size:11.5px;color:var(--faint)}
.ukhz-vsax .ax{display:flex;justify-content:space-between}
.ukhz-vsax b{font-weight:500}
/* flood history */
.ukhz-big{border-radius:var(--r-lg);padding:16px 18px;background:linear-gradient(170deg,#fff1e8,#fff 70%);border:1px solid #f5d0b9}
.ukhz-big > b{display:block;font-size:34px;font-weight:800;letter-spacing:-.04em;color:var(--ukhz-past);margin-top:2px}
.ukhz-big p{font-size:14.5px;line-height:1.5;color:var(--ink-2);margin:8px 0 0}
/* river gauge */
.ukhz-cc{height:220px}
.ukhz-cc .haz-bars rect{fill:#9cc7e6}
.ukhz-cc .haz-bars rect.pk{fill:var(--ukhz-wa)}
.ukhz-cc .haz-bars rect.hit{fill:transparent}
.ukhz-rl{stroke:#64748b;stroke-width:1;stroke-dasharray:4 4;vector-effect:non-scaling-stroke;pointer-events:none}
.ukhz-rl.rec{stroke:var(--ukhz-past);stroke-dasharray:none}
.ukhz-rlab{position:absolute;right:0;transform:translateY(-2px);font-size:11px;font-weight:700;color:var(--ukhz-past);background:rgba(255,255,255,.85);padding:0 4px;border-radius:3px}
.ukhz-rlab.n{color:#64748b;right:auto;left:0}
/* warnings */
.ukhz-now{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-radius:var(--r);background:#ecfdf3;padding:10px 14px;font-size:14.5px}
.ukhz-now.on{background:#fff4e5}.ukhz-now.on .ukhz-dot{background:#d97706;box-shadow:0 0 0 4px rgba(217,119,6,.18)}
.ukhz-now.off{background:var(--surface)}
.ukhz-now .link{margin-left:auto}
.ukhz-dot{width:10px;height:10px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 4px rgba(22,163,74,.18)}
.ukhz-wbars{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;height:150px}
.ukhz-wst{flex:1;width:100%;display:flex;flex-direction:column;justify-content:flex-end}
.ukhz-wst i{display:block;width:100%}
.ukhz-wst i.a{background:#a5d8e6;border-radius:3px 3px 0 0}
.ukhz-wst i.w{background:var(--ukhz-wa)}
.ukhz-wbars b{font-size:10px;font-weight:600;color:var(--faint)}
/* radon */
.ukhz-rmap{position:relative;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff}
.ukhz-sq path{stroke:#fff;stroke-width:1.5;opacity:.8}
.ukhz-rr{display:grid;grid-template-columns:14px 120px 1fr 40px;gap:8px;align-items:center;font-size:13.5px;margin-bottom:7px}
.ukhz-rr > i{width:12px;height:12px;border-radius:3px}
.ukhz-rt{height:12px;border-radius:6px;background:#f1f3f6;overflow:hidden}
.ukhz-rt b{display:block;height:100%}
.ukhz-rr em{font-style:normal;text-align:right;font-weight:700}
/* neighbours by Hazard risk letter */
.ukhz-gmap .nbmap .o.ukhz-ga{fill:#8fd19e}
.ukhz-gmap .nbmap .o.ukhz-gb{fill:#dcebb4}
.ukhz-gmap .nbmap .o.ukhz-gc{fill:#f7dfa1}
.ukhz-gmap .nbmap .o.ukhz-gd{fill:#ee8f78}
.ukhz-gmap .nbmap .me{stroke:var(--ink);stroke-width:2.2}
.ukhz-gmap .nbmap .me.ukhz-ga{fill:#8fd19e}.ukhz-gmap .nbmap .me.ukhz-gb{fill:#dcebb4}.ukhz-gmap .nbmap .me.ukhz-gc{fill:#f2c96b}.ukhz-gmap .nbmap .me.ukhz-gd{fill:#ee8f78}
.legend i.ukhz-ga{background:#8fd19e}.legend i.ukhz-gb{background:#dcebb4}.legend i.ukhz-gc{background:#f7dfa1}.legend i.ukhz-gd{background:#ee8f78}
.ukhz-gmap .nbl.me{color:var(--ink);font-weight:800}
@media (max-width:900px){.ukhz-tiles{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .ukhz-bands{grid-template-columns:1fr}
  .ukhz-band b{font-size:28px}
  .ukhz-hist{gap:3px}
  .ukhz-hb b{font-size:9.5px}
  .ukhz-vs,.ukhz-vsax{grid-template-columns:96px 1fr 50px}
  .ukhz-rr{grid-template-columns:14px 90px 1fr 36px}
  .ukhz-lyr{position:static;padding:8px;background:#fff;border-bottom:1px solid var(--line)}
  .ukhz-lyr button{height:28px;padding:0 9px;font-size:12px}
  .ukhz-wbars{gap:1px}
  .ukhz-wbars b{font-size:8.5px}
  .ukhz-pb{width:50px}
}
@media (max-width:420px){.ukhz-tiles{grid-template-columns:1fr}}
