/* wq-layers.css — the popups, pins and chart of public/wq-layers.js (28 Oct 2026): the /sewage map's own rules
   (public/sewage2.css, 25–27 Oct 2026) under .fr-wq instead of .sw2, for the maps that draw its water-quality layers
   through the shared module (/map first). A change to a rule here should be made in sewage2.css too until that page
   loads this file (BACKLOG). */
.fr-wq.sampling-icon{background:transparent;border:0}
.fr-wq.sampling-icon svg{display:block;width:26px;height:32px;overflow:visible;filter:drop-shadow(0 1px 2px #1d203640);transition:transform .15s}
.fr-wq.sampling-icon:hover svg,.fr-wq.sampling-icon:focus-visible svg{transform:translateY(-2px) scale(1.08)}
.fr-wq .sample-popup{color:#173e48;min-width:260px;max-width:320px;font-family:inherit}
.fr-wq .sample-popup>span{font-size:9px;color:#7553b8;font-weight:700;letter-spacing:1px}
.fr-wq .sample-popup h3{font-size:18px;line-height:1.3;margin:10px 0}
.fr-wq .sample-popup p{font-size:11px;line-height:1.6;margin:0 0 6px}
.fr-wq .sample-popup a{display:block;color:#644299;font-weight:700;margin-top:12px}
:root[data-theme=dark] .fr-wq .sample-popup{color:#173e48}
.fr-wq .sample-popup .sample-when{margin:0 0 8px;color:#4c6a74}
.fr-wq .sample-popup .sample-chips{display:flex;flex-wrap:wrap;gap:5px;margin:4px 0 8px}
.fr-wq .sample-popup .sample-chips button{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:5px 8px;border:1px solid #d9e1ea;border-radius:7px;background:#f4f7fb;color:#173e48;font:inherit;font-size:10px;line-height:1.25;cursor:pointer;text-align:left}
.fr-wq .sample-popup .sample-chips button b{font-size:9px;color:#56627a;font-weight:700;letter-spacing:.2px}
.fr-wq .sample-popup .sample-chips button span{font-variant-numeric:tabular-nums;font-weight:600}
.fr-wq .sample-popup .sample-chips button span.q{font-style:italic;font-weight:500}
.fr-wq .sample-popup .sample-chips button[aria-pressed=true]{background:#e8f0fa;border-color:#2f6db3;box-shadow:inset 0 0 0 1px #2f6db3}
.fr-wq .sample-popup .sample-chips button:focus-visible{outline:2px solid #644299;outline-offset:1px}
.fr-wq .sample-popup .sample-chart-h{margin:2px 0 4px;font-size:10.5px;line-height:1.45;color:#3d5560}
.fr-wq .sample-popup .sample-chart-h strong{color:#173e48;font-size:11.5px}
.fr-wq .sample-popup .wq-chart{width:300px;height:158px;max-width:none;margin:0 -4px}
.fr-wq .sample-popup .sample-loading{color:#4c6a74;font-style:italic}
.fr-wq .sample-popup .sample-caveat{margin:8px 0 0;color:#4c6a74}
.fr-wq .sample-popup .sample-credit{display:block;margin-top:8px;font-size:9px;color:#7b8a93;line-height:1.4}
.fr-wq .sample-popup .sample-retry{font:inherit;color:#644299;background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
@media(max-width:480px){.fr-wq .sample-popup{min-width:236px;max-width:260px}.fr-wq .sample-popup .wq-chart{width:250px;height:132px}.fr-wq .sample-popup h3{font-size:16px;margin:6px 0}}
.fr-wq .sample-popup .sample-info{display:inline-grid;place-items:center;width:17px;height:17px;margin-left:4px;padding:0;border:1.5px solid #644299;border-radius:50%;background:#fff;color:#644299;font:italic 700 11px/1 Georgia,serif;cursor:pointer;vertical-align:1px}
.fr-wq .sample-popup .sample-info[aria-expanded=true]{background:#644299;color:#fff}
.fr-wq .sample-popup .sample-about{background:#f6f3fc;border-left:3px solid #7553b8;border-radius:6px;padding:7px 9px;margin:4px 0 6px}
.fr-wq .sample-popup .sample-about p{margin:0 0 5px;font-size:10.5px;line-height:1.5}
.fr-wq .sample-popup .sample-about p:last-child{margin:0}
.fr-wq .sample-popup .sample-about-foot{color:#5c6873;font-style:italic}
.fr-wq .sample-popup .sample-ref-key{margin:2px 0 0;font-size:9.5px;color:#8a4322}
.fr-wq .sample-popup .sample-ref-key i{display:inline-block;width:16px;border-top:1.5px dashed #b4572e;vertical-align:3px;margin-right:5px}
.fr-wq .sample-popup .v-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:0;flex:none}
.fr-wq .sample-popup .v-good{background:#2f8a4e}.fr-wq .sample-popup .v-depends{background:#d39a1c}.fr-wq .sample-popup .v-fails{background:#c2412d}.fr-wq .sample-popup .v-few{background:#9aa5ae}
.fr-wq .sample-popup .sample-verdict{display:flex;align-items:baseline;gap:2px;margin:4px 0 6px;padding:6px 8px;border-radius:6px;font-size:10.5px;line-height:1.45;background:#f4f7f9;color:#173e48}
.fr-wq .sample-popup .sample-verdict .v-dot{margin-top:3px}
.fr-wq .sample-popup .sample-wb{margin:0 0 8px;padding:7px 9px;border:1px solid #dfe5ea;border-radius:8px;background:#fafbfc}
.fr-wq .sample-popup .sample-wb-h{display:flex;align-items:flex-start;gap:5px;margin:0;font-size:12px;line-height:1.35}
.fr-wq .sample-popup .sample-wb-h>span{flex:1}
.fr-wq .sample-popup .sample-wb-h small{font-size:10px;color:#5c6873}
.fr-wq .sample-popup .sample-wb-h .v-dot{margin-top:4px;width:10px;height:10px}
.fr-wq .sample-popup .sample-wb .sample-about{margin:7px 0 0}
.fr-wq .sample-popup .sample-wb-none{margin:0;font-size:10.5px;color:#5c6873;font-style:italic}
.fr-wq .sample-popup .sample-wb-el{list-style:none;margin:0 0 5px;padding:0;display:grid;gap:2px}
.fr-wq .sample-popup .sample-wb-el li{display:flex;justify-content:space-between;font-size:10.5px}
.fr-wq .sample-popup .t-good{color:#2f8a4e}.fr-wq .sample-popup .t-depends{color:#a8700c}.fr-wq .sample-popup .t-fails{color:#c2412d}.fr-wq .sample-popup .t-few{color:#5c6873}
/* the sampling-site chart the server draws (wqSeriesSvg()): axes, grid, the dashed official line */
.fr-wq .wq-chart .wq-grid{stroke:#e3e8ec;stroke-width:1}.fr-wq .wq-chart .wq-axis{stroke:#9aa5ae;stroke-width:1}.fr-wq .wq-chart .wq-ax{font-size:9px;fill:#5c6873}
/* water-quality sondes: a teal pin when reporting, grey after 3 h without a reading */
.fr-wq .sonde-popup>span{color:#0e7f86}.fr-wq .sonde-popup a.sonde-ea{color:#0b6a70}
.fr-wq .sonde-chart .sonde-line{fill:none;stroke:#0e7f86;stroke-width:1.6;stroke-linejoin:round}.fr-wq .sonde-chart .sonde-last{fill:#0e7f86;stroke:#fff;stroke-width:1.5}
.fr-wq .sonde-chart .sonde-fault{fill:none;stroke:#8d949c;stroke-width:1.2}.fr-wq .sonde-fault-key{font-size:11px;color:#5d6670;margin:4px 0}.fr-wq .sonde-fault-key i{display:inline-block;width:8px;height:8px;border:1.4px solid #8d949c;border-radius:50%;margin-right:5px;vertical-align:-1px}
.fr-wq .sonde-popup a.sonde-page-link{margin-top:10px}.fr-wq .sonde-popup a.sonde-page-link+a.sonde-ea{margin-top:4px;font-weight:600}
/* a river's hover and click: the EA grade of its stretch */
.fr-wq.river-tip-wrap .leaflet-tooltip-content>strong,.fr-wq.river-tip-wrap>strong{display:block}.fr-wq.river-tip-wrap .rt-grade{display:block;margin-top:4px}
.fr-wq .rt-grade i{display:inline-block;width:14px;height:4px;border-radius:2px;margin-right:5px;vertical-align:2px}.fr-wq .rt-grade small{color:#5c6873}.fr-wq .rt-none{color:#5c6873}
.fr-wq.river-tip-wrap .rt-more{display:block;margin-top:4px;color:#5c6873;font-size:9px}
.fr-wq .river-popup{color:#173e48;font-size:11px;line-height:1.5}.fr-wq .river-popup>span{font-size:9px;color:#0e7f86;font-weight:700;letter-spacing:1px}
.fr-wq .river-popup h3{font-size:17px;line-height:1.3;margin:6px 0 10px}.fr-wq .river-popup section{border-left:3px solid #e3e8ec;padding:2px 0 2px 10px;margin:0 0 10px}
.fr-wq .river-popup p{color:#5c6873;margin:4px 0 0;font-size:10px}
/* live rivers' moving flow (public/live-rivers.js): pale dashes running downstream, the sewage map's motion */
.lr-motion{animation:fr-river-flow 9s linear infinite;pointer-events:none}
@keyframes fr-river-flow{to{stroke-dashoffset:-90}}
@media (prefers-reduced-motion:reduce){.lr-motion{animation:none}}
/* live rivers (public/live-rivers.js): the hover names the gauge the line's colour comes from */
.fr-wq.lr-tip .leaflet-tooltip-content>strong,.fr-wq.lr-tip>strong{display:block}
.fr-wq.lr-tip .lr-gauge,.fr-wq.lr-tip .lr-none{display:block;margin-top:4px}.fr-wq.lr-tip .lr-none{color:#5c6873}
.fr-wq.lr-tip .lr-gauge i{display:inline-block;width:14px;height:4px;border-radius:2px;margin-right:5px;vertical-align:2px}
.fr-wq.lr-tip small{display:block;margin-top:4px;color:#5c6873;font-size:9px}