/* Existing warnings-page layout and card sizes are deliberately inherited. */
.warnings-beta .warning-nl-map{cursor:crosshair}
.warning-beta-base{fill:#8cc783;fill-opacity:.8;stroke:none;pointer-events:none}
.warning-beta-boundary{fill:none;stroke:rgba(72,99,113,.82);stroke-width:.75;pointer-events:none;vector-effect:non-scaling-stroke}
.warning-beta-municipality{fill:none;stroke:rgba(72,99,113,.22);stroke-width:.34;pointer-events:none;vector-effect:non-scaling-stroke}
.warning-beta-area{fill-opacity:1;stroke-width:.8;stroke-linejoin:round;pointer-events:none;vector-effect:non-scaling-stroke}
.warning-beta-area.is-yellow{fill:#f3d34c;stroke:#b69c32}
.warning-beta-area.is-orange{fill:#f39943;stroke:#b06b2c}
.warning-beta-area.is-red{fill:#e76468;stroke:#aa4249}
.warning-beta-marker-ring{fill:#124566;stroke:white;stroke-width:2;vector-effect:non-scaling-stroke}
.warning-beta-marker{fill:#fff}
.warnings-beta [data-beta-marker-layer]{pointer-events:none}
.warnings-beta [data-beta-marker][hidden]{display:none!important}
.warning-beta-refresh{border:1px solid #ffffff44;background:#ffffff15;border-radius:50%;color:#fff;width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;cursor:pointer}
.warning-beta-refresh:disabled{opacity:.5;cursor:wait}
.warning-beta-item{padding:17px 0;border-bottom:1px solid var(--line,#bfd1da)}
.warning-beta-item:first-child{padding-top:0}
.warning-beta-item:last-child{border-bottom:0}
.warning-beta-item h3{margin:12px 0 6px;font-size:17px;line-height:1.4}
.warning-beta-item p{margin:12px 0 0}
.warning-beta-item .warning-detail-code{margin:0}
.warning-beta-time{font-weight:800}
.warning-beta-test{font-size:11px!important;opacity:.8}
.warning-beta-item details{margin-top:12px;font-size:13px;line-height:1.6}
.warning-beta-item summary{font-weight:750;cursor:pointer}
.warning-beta-test-controls{font-size:12px;line-height:1.7}
.warning-beta-test-controls summary{cursor:pointer;font-weight:750}
.warning-beta-sources{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.warning-beta-sources button{border:1px solid var(--line,#bed1d8);background:var(--panel,#e6f0f4);color:inherit;font:inherit;font-weight:750;padding:9px 12px;border-radius:10px;cursor:pointer}
.warning-beta-sources button[aria-pressed=true]{background:#164c68;color:white}
.local-warning-list[hidden]{display:none!important}.local-warning-list{display:grid;gap:8px;margin:0 0 16px;width:100%;grid-column:1/-1}.local-warning-row{display:grid;grid-template-columns:20px 1fr;gap:3px 9px;padding:11px 14px;border:1px solid transparent;border-radius:12px;text-decoration:none;color:#223b48;background:#ffedb5;font-size:13px;line-height:1.55}.local-warning-row>i{grid-row:1/3;font-size:19px}.local-warning-row>span{grid-column:2;font-size:12px}.local-warning-row.is-yellow{background:#fff0b9;border-color:#b9942955}.local-warning-row.is-orange{background:#ffe0c1;border-color:#bd702a55}.local-warning-row.is-red{background:#ffdade;border-color:#bc424c55}.local-warning-unavailable{font-size:12px;opacity:.75}[data-theme=dark] .local-warning-row{color:#f0f5f7}[data-theme=dark] .local-warning-row.is-yellow{background:#4b4324}[data-theme=dark] .local-warning-row.is-orange{background:#563921}[data-theme=dark] .local-warning-row.is-red{background:#552c37}.wn-selected-location-marker{pointer-events:none}.wn-selected-location-marker text{fill:#fff;stroke:#143b51;stroke-width:3;paint-order:stroke;font:800 12px system-ui,sans-serif}.wn-selected-location-marker circle{fill:#fff;stroke:#124566;stroke-width:2;vector-effect:non-scaling-stroke}


/* Province zoom uses shape focus, never a rectangular outline. */
.warnings-beta .warning-beta-base[role="button"]{pointer-events:auto;cursor:pointer;outline:none}
.warnings-beta .warning-beta-base[role="button"]:focus-visible{stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke;outline:none}

.warnings-beta.is-map-zooming .warning-nl-map,.warnings-beta.is-map-zooming .warning-beta-base[role="button"]{pointer-events:none;cursor:wait}

/* Reuse the existing map picker, with the national reset directly underneath. */
.warnings-beta .warning-beta-picker{max-width:calc(100% - 24px)}
.warnings-beta .warning-beta-picker .current-map-picker-btn{min-width:0;width:auto;max-width:100%;gap:14px;cursor:pointer}
.warnings-beta .warning-beta-picker .current-map-picker-menu{width:max-content!important;min-width:100%;max-width:calc(100vw - 70px);max-height:none!important;overflow:visible}
.warnings-beta .warning-beta-picker .current-map-picker-menu button{display:flex;align-items:center;cursor:pointer;min-height:32px;white-space:nowrap}
.warnings-beta .warning-map-reset{top:60px;left:12px;cursor:pointer}
.warning-beta-item-heading{display:flex;align-items:center;gap:10px;margin:10px 0 6px}
.warning-beta-item-heading h3{margin:0}
.warning-beta-detail-icon{width:40px;height:40px;object-fit:contain;flex:0 0 40px;background:#e8f0f3;border-radius:8px;padding:4px}
@media(max-width:850px){.warnings-beta .warning-map-reset{left:8px;top:54px}}

/* Warning explanation stays on its own page and uses the full content width. */
.warning-explanation .warning-criteria{grid-column:1/-1;min-width:0;margin-top:8px}
.warning-criteria h3{font-size:clamp(20px,2vw,24px);line-height:1.3;margin:24px 0 12px;color:var(--ink,inherit)}
.warning-explanation .warning-criteria>p{max-width:88ch;font-size:14px;line-height:1.7;color:var(--muted);margin:0 0 16px}
.warning-criteria-codes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0 26px}
.warning-criteria-codes p{margin:0;padding:12px 14px;border-left:3px solid #6eac94;background:rgba(128,169,187,.08);border-radius:0 10px 10px 0;font-size:13px;line-height:1.6}
.warning-criteria-codes p:nth-child(2){border-color:#d8b538}.warning-criteria-codes p:nth-child(3){border-color:#df924a}.warning-criteria-codes p:nth-child(4){border-color:#d56970}
.warning-criteria-codes strong{display:block;margin-bottom:3px;color:var(--ink,inherit)}
.warning-criteria-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0 30px}
.warning-criteria-item{min-width:0;border:1px solid var(--line,#bed1d8);border-radius:16px;padding:20px;background:rgba(255,255,255,.28)}
.warning-criteria-heading{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.warning-criteria-heading h4{margin:0;font-size:18px;line-height:1.3}
.warning-criteria-heading img{width:46px;height:46px;object-fit:contain;padding:7px;background:#e1edf2;border-radius:12px;flex:0 0 46px}
.warning-criteria-copy>p{margin:0 0 16px;font-size:14px;line-height:1.6;color:var(--muted)}
.warning-criteria-copy dl{margin:0;display:grid;gap:14px}
.warning-criteria-copy dl>div{border-top:1px solid var(--line,#bed1d8);padding-top:12px}
.warning-criteria-copy dt{font-weight:800;font-size:12px;line-height:1.5;margin-bottom:5px;display:flex;align-items:center;gap:7px}
.warning-criteria-copy dt:before{content:'';width:8px;height:8px;border-radius:50%;background:#d8b538;flex:0 0 8px}
.warning-criteria-copy dl>div:nth-child(2) dt:before{background:#df924a}
.warning-criteria-copy dd{margin:0;font-size:14px;line-height:1.65}
[data-theme=dark] .warning-criteria-item{background:rgba(128,169,187,.06)}
@media(max-width:900px){.warning-criteria-list{grid-template-columns:1fr}.warning-criteria-codes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.warning-criteria-list{gap:12px}.warning-criteria-item{padding:16px}.warning-criteria-copy>p,.warning-criteria-copy dd,.warning-explanation .warning-criteria>p{font-size:13px}.warning-criteria-codes{gap:8px}.warning-criteria-codes p{padding:10px;font-size:12px}}

/* Homepage: dezelfde kleuren als de waarschuwingskaart. */
[data-warning-home]{--warning-color:#8cc783;box-shadow:none}
[data-warning-home].is-yellow,[data-warning-home].is-orange,[data-warning-home].is-red{border-color:var(--warning-color);box-shadow:inset 0 0 0 1px var(--warning-color)}
.warning-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 16px}
.warning-type-tile{--warning-color:#bfd2da;position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:78px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px 4px;border:1px solid var(--warning-color);border-radius:12px;background:var(--warning-color);color:#102b40;text-align:center;text-decoration:none;font-weight:750;font-size:.85rem}
.warning-type-tile::before{content:"";position:absolute;inset:0;z-index:-1;background-image:var(--warning-pattern),var(--warning-pattern),var(--warning-pattern),var(--warning-pattern),var(--warning-pattern),var(--warning-pattern);background-position:5% 12%,29% 72%,44% -6%,68% 88%,89% 23%,101% 73%;background-size:24px,19px,22px,25px,20px,27px;background-repeat:no-repeat;opacity:.11;pointer-events:none}
.warning-type-tile img{width:30px;height:30px;object-fit:contain}
.warning-type-tile:hover,.warning-type-tile:focus-visible{outline:2px solid #285777;outline-offset:1px}
.warning-type-tile.is-green{--warning-color:#8cc783}
:is([data-warning-home],.warning-type-tile,.warning-upcoming button).is-yellow{--warning-color:#f3d34c}
:is([data-warning-home],.warning-type-tile,.warning-upcoming button).is-orange{--warning-color:#f39943}
:is([data-warning-home],.warning-type-tile,.warning-upcoming button).is-red{--warning-color:#e76468}
.warning-upcoming{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.warning-upcoming[hidden]{display:none}
.warning-upcoming button{background:var(--warning-color);color:#102b40;border:0;border-radius:9px;padding:8px 12px;font:inherit;font-weight:750;cursor:pointer}
@media(max-width:680px){.warning-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.warning-beta-item-heading .warning-detail-code{margin-inline-start:auto;flex-shrink:0;white-space:nowrap}
.warning-beta-item-heading h3{min-width:0;overflow-wrap:anywhere}