/* purpose: MD Weather portal — Weather Channel style glass UI */
/* author: MD Hub */
/* date: 2026-09-02 */

body.ap-kind-weather{
	background:#061018;color:var(--mdw-text);
	--mdw-glass:rgba(8,18,32,.42);
	--mdw-glass-2:rgba(255,255,255,.10);
	--mdw-line:rgba(255,255,255,.16);
	--mdw-text:#f8fafc;
	--mdw-muted:rgba(248,250,252,.72);
	--mdw-accent:#38bdf8;
	--mdw-accent-ink:#082f49;
	--mdw-chrome:rgba(6,16,24,.28);
	--mdw-panel:rgba(8,18,32,.94);
	--mdw-overlay:rgba(4,10,18,.42);
	--mdw-tab-bg:rgba(6,16,24,.62);
	--mdw-tab-on:#7dd3fc;
	--mdw-input:rgba(8,18,32,.7);
	--mdw-wash:linear-gradient(180deg,rgba(4,10,18,.28) 0%,rgba(4,10,18,.18) 35%,rgba(4,10,18,.55) 100%);
	--mdw-highlight:rgba(125,211,252,.14);
	--mdw-highlight-line:rgba(125,211,252,.34)
}
html.dark body.ap-kind-weather{background:#061018}
html.light body.ap-kind-weather{
	background:#dbeafe;color:var(--mdw-text);
	--mdw-glass:rgba(255,255,255,.72);
	--mdw-glass-2:rgba(15,23,42,.06);
	--mdw-line:rgba(15,23,42,.12);
	--mdw-text:#0f172a;
	--mdw-muted:rgba(15,23,42,.68);
	--mdw-accent:#0284c7;
	--mdw-accent-ink:#fff;
	--mdw-chrome:rgba(248,250,252,.78);
	--mdw-panel:rgba(255,255,255,.96);
	--mdw-overlay:rgba(241,245,249,.48);
	--mdw-tab-bg:rgba(255,255,255,.82);
	--mdw-tab-on:#0369a1;
	--mdw-input:rgba(255,255,255,.88);
	--mdw-wash:linear-gradient(180deg,rgba(248,250,252,.58) 0%,rgba(248,250,252,.28) 38%,rgba(226,232,240,.7) 100%);
	--mdw-highlight:rgba(3,105,161,.1);
	--mdw-highlight-line:rgba(3,105,161,.28)
}
body.ap-kind-weather #ap_app{background:transparent}
body.ap-kind-weather .ap-top{
	background:var(--mdw-chrome);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
	border-bottom:1px solid var(--mdw-line);color:var(--mdw-text)
}
body.ap-kind-weather .ap-brand h1,body.ap-kind-weather .ap-brand p,body.ap-kind-weather .ap-btn{color:var(--mdw-text)}
body.ap-kind-weather .ap-btn{background:var(--mdw-glass);border-color:var(--mdw-line)}
html.light body.ap-kind-weather #ap_portal_settings .ap-btn{
	background:var(--bo-bg,#f8fafc);border-color:var(--bo-border,#e2e8f0);color:var(--bo-text,#111827)
}
body.ap-kind-weather #ap_workspace{padding:0;overflow:hidden;background:transparent;position:relative}

#mdw_root{position:relative;height:100%;min-height:0;display:flex;flex-direction:column;color:var(--mdw-text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
#mdw_bg{position:absolute;inset:0;overflow:hidden;z-index:0;background:#0b1c2e}
html.light #mdw_bg{background:#93c5fd}
#mdw_bg_motion{position:absolute;inset:0}
#mdw_bg_poster{
	position:absolute;inset:-16%;width:132%;height:132%;object-fit:cover;object-position:center;
	transform:translate3d(0,0,0);will-change:transform;opacity:1;transition:opacity 1.15s linear;
	animation:mdw-ken 96s linear infinite alternate
}
#mdw_bg.is-live #mdw_bg_poster{opacity:0}
.mdw-bg-vid{
	position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
	opacity:0;transition:opacity 1.15s linear;transform:translateZ(0);backface-visibility:hidden;pointer-events:none
}
.mdw-bg-vid.is-on{opacity:.92}
#mdw_fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#mdw_bg_wash{position:absolute;inset:0;background:var(--mdw-wash)}
#mdw_app{position:relative;z-index:1;display:flex;flex-direction:column;height:100%;min-height:0}

.mdw-loc{display:flex;align-items:center;gap:8px;padding:10px 12px 6px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
.mdw-loc button{appearance:none;border:0;background:transparent;color:var(--mdw-text);cursor:pointer}
#mdw_geo_btn,#mdw_unit_btn{
	width:40px;height:40px;border-radius:12px;background:var(--mdw-glass);border:1px solid var(--mdw-line);
	display:inline-flex;align-items:center;justify-content:center;flex-shrink:0
}
.mdw-loc-name{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:16px;font-weight:650}
.mdw-loc-text{min-width:0;display:flex;flex-direction:column;align-items:center;line-height:1.15}
.mdw-loc-text #mdw_loc_label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.mdw-loc-time{display:block;font-size:11px;font-weight:600;letter-spacing:.02em;opacity:.78;margin-top:2px}
.mdw-units{font-weight:800;font-size:13px}

#mdw_places{
	position:absolute;inset:0;z-index:12;background:var(--mdw-overlay);
	backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
	display:flex;align-items:flex-start;justify-content:center;padding:12px
}
#mdw_places[hidden]{display:none!important}
.mdw-places-panel{
	width:min(420px,100%);margin-top:8px;background:var(--mdw-panel);
	border:1px solid var(--mdw-line);border-radius:18px;padding:12px;box-shadow:0 18px 40px rgba(0,0,0,.28)
}
.mdw-places-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.mdw-places-head h2{margin:0;font-size:15px;font-weight:800;color:var(--mdw-text)}
#mdw_places_done{border:0;border-radius:10px;padding:7px 12px;background:var(--mdw-accent);color:var(--mdw-accent-ink);font-weight:700;cursor:pointer}
#mdw_places_list{list-style:none;margin:0 0 10px;padding:0;max-height:40vh;overflow:auto}
.mdw-place{
	display:flex;align-items:center;gap:8px;width:100%;text-align:left;
	padding:10px 8px;border-radius:12px;border:1px solid transparent;color:var(--mdw-text);font-weight:650
}
.mdw-place.on{background:var(--mdw-highlight);border-color:var(--mdw-highlight-line)}
.mdw-place .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mdw-place-del{
	width:32px;height:32px;border-radius:10px;background:var(--mdw-glass-2);color:var(--mdw-text);flex-shrink:0
}
.mdw-place-empty{opacity:.7;padding:12px 8px;font-size:13px}

#mdw_search{display:flex;flex-wrap:wrap;gap:8px;position:relative}
#mdw_q{flex:1;min-width:160px;border:1px solid var(--mdw-line);border-radius:12px;background:var(--mdw-input);color:var(--mdw-text);padding:10px 12px;font-size:16px}
#mdw_search button{border:0;border-radius:12px;padding:10px 12px;background:var(--mdw-accent);color:var(--mdw-accent-ink);font-weight:700;cursor:pointer}
#mdw_suggest{position:absolute;left:0;right:0;top:48px;z-index:8;background:var(--mdw-panel);border:1px solid var(--mdw-line);border-radius:14px;overflow:hidden;max-height:240px;overflow-y:auto}
#mdw_suggest button{display:block;width:100%;text-align:left;background:transparent!important;color:var(--mdw-text)!important;border:0;border-radius:0;padding:12px 14px;font-weight:600}
#mdw_suggest button:hover{background:var(--mdw-highlight)!important}

#mdw_alerts{margin:0 12px 8px;display:flex;flex-direction:column;gap:6px}
#mdw_alerts[hidden]{display:none!important}
.mdw-alert{border-radius:14px;padding:10px 12px;background:linear-gradient(135deg,#9a3412,#b45309);border:1px solid rgba(255,255,255,.18);cursor:pointer;color:#fff}
.mdw-alert.sev-extreme,.mdw-alert.sev-severe{background:linear-gradient(135deg,#7f1d1d,#b91c1c)}
.mdw-alert.sev-minor{background:linear-gradient(135deg,#0e7490,#0284c7)}
.mdw-alert b{display:block;font-size:13px}
.mdw-alert span{display:block;font-size:12px;opacity:.9;margin-top:2px}

#mdw_pages{flex:1;min-height:0;overflow:auto;padding:0 12px 88px;padding-bottom:calc(88px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
.mdw-page[hidden]{display:none!important}
.mdw-hero{text-align:center;padding:8px 8px 18px}
.mdw-icon{width:112px;height:112px;margin:0 auto 4px;filter:drop-shadow(0 10px 18px rgba(0,0,0,.28))}
.mdw-icon svg{width:100%;height:100%;display:block}
.mdw-temp{font-size:92px;font-weight:200;line-height:1;letter-spacing:-3px}
.mdw-temp small{font-size:36px;font-weight:300;letter-spacing:0}
.mdw-cond{font-size:18px;font-weight:600;margin-top:4px;text-shadow:0 2px 10px rgba(0,0,0,.18)}
.mdw-hi-lo{margin-top:6px;font-size:15px;opacity:.92}
.mdw-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:14px}
.mdw-chip{background:var(--mdw-glass);border:1px solid var(--mdw-line);border-radius:999px;padding:6px 10px;font-size:12px;font-weight:650;backdrop-filter:blur(10px)}

.mdw-card{background:var(--mdw-glass);border:1px solid var(--mdw-line);border-radius:18px;padding:12px;margin:0 0 12px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.mdw-card h3{margin:0 0 10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.mdw-hours{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.mdw-hour{flex:0 0 68px;text-align:center;padding:6px 2px;border-radius:14px}
.mdw-hour.is-now{
	background:var(--mdw-highlight);
	box-shadow:inset 0 0 0 1px var(--mdw-highlight-line)
}
.mdw-hour .t{font-size:11px;opacity:.8}
.mdw-hour .ic{width:36px;height:36px;margin:6px auto}
.mdw-hour .ic svg{width:100%;height:100%}
.mdw-hour .v{font-size:16px;font-weight:700}
.mdw-hour .p{font-size:11px;color:var(--mdw-tab-on)}

.mdw-days{display:flex;flex-direction:column;gap:8px}
.mdw-day{display:grid;grid-template-columns:64px 32px 40px 1fr 40px;gap:8px;align-items:center;padding:4px 6px;margin:0 -6px;border-radius:12px}
.mdw-day.is-today{
	background:var(--mdw-highlight);
	box-shadow:inset 0 0 0 1px var(--mdw-highlight-line)
}
.mdw-day .n{font-weight:650}
.mdw-day .ic{width:32px;height:32px}
.mdw-day .ic svg{width:100%;height:100%}
.mdw-bar{height:6px;border-radius:99px;background:var(--mdw-glass-2);overflow:hidden;position:relative}
.mdw-bar>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--mdw-accent),#fbbf24)}
.mdw-lo,.mdw-hi,.mdw-hl{font-variant-numeric:tabular-nums;font-weight:700}
.mdw-lo{text-align:right;opacity:.85}
.mdw-hi{text-align:right}

.mdw-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mdw-stat{background:var(--mdw-glass-2);border-radius:14px;padding:12px}
.mdw-stat .k{font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.75}
.mdw-stat .v{font-size:22px;font-weight:700;margin-top:4px}
.mdw-stat .s{font-size:12px;opacity:.8;margin-top:2px}

.mdw-gauge{display:flex;align-items:center;gap:14px}
.mdw-ring{width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;border:5px solid currentColor;background:var(--mdw-glass-2)}
.mdw-poll{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mdw-poll>div{flex:1;min-width:88px;background:var(--mdw-glass-2);border-radius:12px;padding:8px;text-align:center}
.mdw-poll .n{font-size:10px;text-transform:uppercase;opacity:.75}
.mdw-poll .v{font-size:15px;font-weight:700}

.mdw-health-hero{overflow:hidden;padding:0 0 12px}
.mdw-health-cover{
	position:relative;height:148px;background-size:cover;background-position:center;
	border-radius:18px 18px 0 0
}
.mdw-health-cover:after{
	content:"";position:absolute;inset:0;
	background:linear-gradient(180deg,rgba(4,10,18,.08) 0%,rgba(4,10,18,.72) 100%)
}
html.light .mdw-health-cover:after{
	background:linear-gradient(180deg,rgba(15,23,42,.08) 0%,rgba(15,23,42,.62) 100%)
}
.mdw-health-cover-copy{
	position:absolute;left:14px;right:14px;bottom:12px;z-index:1;color:#f8fafc
}
.mdw-health-cover-copy .k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.85;font-weight:700}
.mdw-health-cover-copy .v{font-size:42px;font-weight:200;line-height:1;letter-spacing:-1px;margin-top:2px;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.mdw-health-cover-copy .s{font-size:15px;font-weight:700;margin-top:4px}
.mdw-health-advice{margin:12px 14px 0;font-size:13px;line-height:1.45;opacity:.9}
.mdw-health-hero .mdw-poll{margin:10px 12px 0}

.mdw-pollen-card h4{
	margin:14px 0 8px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.75
}
.mdw-pollen-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mdw-pollen-tile{
	overflow:hidden;border-radius:14px;background:var(--mdw-glass-2);border:1px solid var(--mdw-line)
}
.mdw-pollen-pic{height:96px;overflow:hidden}
.mdw-pollen-pic img{width:100%;height:100%;object-fit:cover;display:block}
.mdw-pollen-copy{padding:8px 10px 10px}
.mdw-pollen-copy .n{font-size:13px;font-weight:750;text-transform:none;opacity:1}
.mdw-pollen-copy .c{font-size:11px;font-weight:700;margin-top:4px}
.mdw-level{height:6px;border-radius:99px;background:var(--mdw-glass-2);overflow:hidden;margin-top:8px;box-shadow:inset 0 0 0 1px var(--mdw-line)}
.mdw-level>i{display:block;height:100%;border-radius:99px}
.mdw-pollen-empty{text-align:center;padding:4px 0 8px}
.mdw-pollen-empty img{width:100%;height:120px;object-fit:cover;border-radius:14px;opacity:.85;display:block;margin-bottom:10px}
.mdw-pollen-empty div{opacity:.85;font-size:13px}

.mdw-list{display:flex;flex-direction:column;gap:0}
.mdw-list .mdw-hour-row,.mdw-list .mdw-day-row{
	display:grid;grid-template-columns:64px 40px 1fr auto;gap:10px;align-items:center;
	padding:10px 8px;border-bottom:1px solid var(--mdw-line);border-radius:12px
}
.mdw-list .mdw-hour-row.is-now,.mdw-list .mdw-day-row.is-today{
	background:var(--mdw-highlight);
	box-shadow:inset 0 0 0 1px var(--mdw-highlight-line);
	border-bottom-color:transparent
}
.mdw-list .mdw-hour-row:last-child,.mdw-list .mdw-day-row:last-child{border-bottom:0}

.mdw-tabs{
	position:absolute;left:0;right:0;bottom:0;z-index:3;
	display:grid;grid-template-columns:repeat(5,1fr);gap:2px;
	padding:8px 8px calc(8px + env(safe-area-inset-bottom));
	background:var(--mdw-tab-bg);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
	border-top:1px solid var(--mdw-line)
}
.mdw-tabs button{
	appearance:none;border:0;background:transparent;color:var(--mdw-muted);
	display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;font-size:10px;font-weight:700;cursor:pointer
}
.mdw-tabs button i{font-size:16px}
.mdw-tabs button.on{color:var(--mdw-tab-on)}

#mdw_radar{position:relative;height:100%;min-height:360px;margin:0 -12px;padding:0}
#mdw_radar_map{position:absolute;inset:0 0 56px 0;background:#0b1220}
html.light #mdw_radar_map{background:#e2e8f0}
.mdw-radar-bar{
	position:absolute;left:0;right:0;bottom:0;height:56px;display:flex;align-items:center;gap:10px;
	padding:8px 12px;background:var(--mdw-tab-bg)
}
#mdw_radar_play{width:40px;height:40px;border:0;border-radius:12px;background:var(--mdw-accent);color:var(--mdw-accent-ink);cursor:pointer}
#mdw_radar_slider{flex:1}
#mdw_radar_time{font-size:12px;min-width:84px;text-align:right}
.mdw-radar-legend{
	position:absolute;left:10px;top:10px;z-index:500;display:flex;align-items:center;gap:6px;
	padding:6px 10px;border-radius:10px;background:rgba(15,23,42,.78);color:#e2e8f0;font-size:11px;font-weight:700;
	pointer-events:none
}
html.light .mdw-radar-legend{background:rgba(255,255,255,.88);color:#0f172a}
.mdw-radar-legend strong{font-size:10px;letter-spacing:.04em;margin-right:4px}
.mdw-radar-sw{width:10px;height:10px;border-radius:2px;display:inline-block}
.mdw-radar-sw.sw1{background:#04e304}
.mdw-radar-sw.sw2{background:#fdf802}
.mdw-radar-sw.sw3{background:#fd9500}
.mdw-radar-sw.sw4{background:#d40000}

.mdw-empty{text-align:center;padding:48px 16px;opacity:.9}
.mdw-empty button{margin-top:12px;border:0;border-radius:12px;padding:10px 16px;background:var(--mdw-accent);color:var(--mdw-accent-ink);font-weight:700;cursor:pointer}

.mdw-wx-sun .ray{transform-origin:50% 50%;animation:mdw-spin 16s linear infinite}
.mdw-wx-sun .core{animation:mdw-pulse 3s ease-in-out infinite}
.mdw-wx-moon .core{animation:mdw-pulse 4s ease-in-out infinite}
.mdw-wx-cloud .c{animation:mdw-drift 5s ease-in-out infinite}
.mdw-wx-rain .drop{animation:mdw-fall .9s linear infinite}
.mdw-wx-snow .flake{animation:mdw-sfall 2.2s linear infinite}
.mdw-wx-storm .bolt{animation:mdw-flash 1.6s ease-in-out infinite}
.mdw-wx-fog .f{animation:mdw-drift 6s ease-in-out infinite}

@keyframes mdw-spin{to{transform:rotate(360deg)}}
@keyframes mdw-pulse{0%,100%{opacity:1}50%{opacity:.82;transform:scale(1.04)}}
@keyframes mdw-drift{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@keyframes mdw-fall{0%{transform:translateY(-6px);opacity:0}20%{opacity:1}100%{transform:translateY(18px);opacity:0}}
@keyframes mdw-sfall{0%{transform:translate(0,-4px);opacity:0}20%{opacity:1}100%{transform:translate(6px,16px);opacity:0}}
@keyframes mdw-flash{0%,70%,100%{opacity:.2}78%,86%{opacity:1}}
@keyframes mdw-ken{
	from{transform:translate3d(-1.1%,-.8%,0) scale(1.05)}
	to{transform:translate3d(1.2%,1%,0) scale(1.1)}
}
@media (prefers-reduced-motion:reduce){
	#mdw_bg_poster{animation:none}
	.mdw-bg-vid{transition:none}
	.mdw-wx-sun .ray,.mdw-wx-sun .core,.mdw-wx-moon .core,.mdw-wx-cloud .c,.mdw-wx-rain .drop,.mdw-wx-snow .flake,.mdw-wx-storm .bolt,.mdw-wx-fog .f{animation:none}
}

@media (max-width:720px){
	.mdw-temp{font-size:84px}
	.mdw-row{grid-template-columns:1fr}
}
