/* Keep the Windy shell; put source advisories where the forecast used to lead. */
body.map-first.alert-mode {--wx-bottom:calc(78px + env(safe-area-inset-bottom));}
#alertView {position:absolute;z-index:55;top:116px;left:8px;width:400px;max-height:calc(100dvh - 225px);display:flex;flex-direction:column;background:var(--wx-panel,#3c3c3ce8);color:#fff;border-radius:4px;box-shadow:0 0 5px #0008;font-size:.8rem;}
#alertView header {display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid #fff3;}
#alertScope {display:block;font-size:.75rem;color:#eee;margin-top:3px;}
#alertView button {color:#fff;background:#4d4d4d;border:1px solid #fff4;min-height:44px;cursor:pointer;border-radius:4px;}
#alertCollapse {width:44px;font-size:1.4rem;}
#alertBody {overflow:auto;overscroll-behavior:contain;padding:10px 12px;}
#alertBody[hidden] {display:none;}
#alertSources {font-size:.72rem;color:#ddd;line-height:1.5;margin-bottom:12px;}
.alert-card {padding:10px 12px;margin:10px 0;border-left:3px solid #aaa;background:#2727278c;}
.alert-card[data-severity=roja] {border-color:#ff6368;}
.alert-card[data-severity=amarilla] {border-color:#ffcf5d;}
.alert-card[data-severity=preventiva] {border-color:#8bd5a6;}
#alertView h2 {font-size:.86rem;line-height:1.4;margin:6px 0;}
#alertView p {font-size:.74rem;line-height:1.5;margin:6px 0;}
#alertView a {display:block;color:#ffd36b;padding:9px 0;min-height:44px;}
#alertRefresh {width:100%;}
#alertBar {display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;min-height:78px;padding:4px 12px max(4px,env(safe-area-inset-bottom));}
.alert-now {font-size:.76rem;color:var(--wx-gold,#e6ad00);white-space:nowrap;}
.alert-filters {display:flex;flex:1;gap:3px;}
.alert-filters button {flex:1;background:#4d4d4d;color:#fff;border:0;border-bottom:3px solid transparent;min-height:44px;padding:6px 10px;cursor:pointer;white-space:nowrap;}
.alert-filters [data-alert-filter=roja] {border-bottom-color:#ff6368;}
.alert-filters [data-alert-filter=amarilla] {border-bottom-color:#ffcf5d;}
.alert-filters [data-alert-filter=preventiva] {border-bottom-color:#8bd5a6;}
.alert-filters [aria-pressed=true] {outline:2px solid var(--wx-gold,#e6ad00);outline-offset:-2px;background:#626262;}
.alert-key {width:100%;font-size:.65rem;color:#ddd;text-align:right;}
body.alert-mode.wx-on #alertBar {display:none;}
body.alert-mode.wx-on {--wx-bottom:calc(66px + env(safe-area-inset-bottom));}
body.alert-mode.wx-on #alertView {display:none;}
body.alert-mode .ac-tira {display:none!important;}
body.alert-mode.panel-abierto #alertView,body.alert-mode:has(.map-incident) #alertView,body.alert-mode:has(#alertMajor:not(.hidden)) #alertView {display:none;}
body.map-first.panel-abierto #alertBar {left:410px;}
@media(max-width:879px){#alertView{top:116px;width:calc(100% - 76px);max-width:400px;max-height:min(48dvh,440px)}#alertView header{padding:8px}#alertBar{gap:0;padding-left:6px;padding-right:6px}.alert-now{font-size:.63rem;width:100%}.alert-filters button{font-size:.68rem;padding:4px}.alert-key{font-size:.58rem;line-height:1.2}body.map-first.panel-abierto #alertBar{left:0}body.map-first.panel-abierto #alertBar{display:none}}
@media(max-height:500px){#alertView{max-height:calc(100dvh - 200px)}#alertView:not(.collapsed) #alertSources{display:none}}