/* Dynamic Weather Card - styles are scoped with a dwc- prefix to avoid
   conflicts with your theme's CSS. */

.dwc-weather-widget{
  --dwc-ink-950:#0A1626;
  --dwc-ink-900:#0F1F35;
  --dwc-ink-800:#152944;
  --dwc-cyan-400:#4FD1C5;
  --dwc-cyan-300:#7EE8DD;
  --dwc-amber-400:#FFB454;
  --dwc-violet-400:#8B7EF0;
  --dwc-text-hi:#F3F7FB;
  --dwc-text-lo:#9FB1C9;
  --dwc-glass-border:rgba(255,255,255,0.10);
  --dwc-glass-fill:rgba(255,255,255,0.045);
  --dwc-font-display:'Space Grotesk',system-ui,sans-serif;
  --dwc-font-body:'Inter',system-ui,sans-serif;
  --dwc-font-mono:'JetBrains Mono',ui-monospace,monospace;

  position:relative;
  display:block;
  width:100%;
  max-width:360px;
  margin:0 auto;
  border-radius:var(--dwc-radius, 22px);
  overflow:hidden;
  border:1px solid var(--dwc-glass-border);
  box-shadow:0 20px 50px -18px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.02) inset;
  color:var(--dwc-text-hi);
  font-family:var(--dwc-font-body);
  box-sizing:border-box;
  animation:dwcCardIn .7s cubic-bezier(.2,.8,.3,1) both;
}
@keyframes dwcCardIn{
  0%{opacity:0; transform:translateY(16px) scale(.98);}
  100%{opacity:1; transform:translateY(0) scale(1);}
}
.dwc-weather-widget *{ box-sizing:border-box; }

.dwc-widget-title{
  position:relative; z-index:1;
  font-family:var(--dwc-font-display);
  font-size:15px;
  padding:14px 20px 0;
  margin:0;
}

.dwc-bg-layer{
  position:absolute; inset:0; z-index:0;
  opacity:0;
  transition:opacity 1s ease;
  background:linear-gradient(160deg,var(--dwc-ink-950),var(--dwc-ink-900) 55%,var(--dwc-ink-800));
}
.dwc-bg-layer.dwc-active{opacity:1;}
.dwc-bg-decor{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(circle at 78% 8%, rgba(79,209,197,0.20), transparent 55%),
             radial-gradient(circle at 10% 95%, rgba(139,126,240,0.16), transparent 50%);
}
.dwc-bg-layer.dwc-cond-clear-day{background:linear-gradient(160deg,#0E2A4A,#173B63 55%,#265584);}
.dwc-bg-layer.dwc-cond-clear-night{background:linear-gradient(160deg,#050B18,#0B1728 55%,#111F38);}
.dwc-bg-layer.dwc-cond-cloudy{background:linear-gradient(160deg,#101823,#1B2635 55%,#293A4E);}
.dwc-bg-layer.dwc-cond-rain{background:linear-gradient(160deg,#0A1420,#12202F 55%,#1C3243);}
.dwc-bg-layer.dwc-cond-storm{background:linear-gradient(160deg,#0B0E1C,#171A2E 55%,#242145);}
.dwc-bg-layer.dwc-cond-snow{background:linear-gradient(160deg,#101825,#1B2733 55%,#2C3D48);}
.dwc-bg-layer.dwc-cond-fog{background:linear-gradient(160deg,#12161C,#1D222A 55%,#2B313A);}

.dwc-sky-decor{position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none;}
.dwc-decor-cloud{
  position:absolute;
  border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(255,255,255,0.10), rgba(255,255,255,0) 70%);
  filter:blur(6px);
}
.dwc-decor-1{width:140px; height:56px; top:8%; animation:dwcDrift1 46s linear infinite;}
.dwc-decor-2{width:100px; height:40px; top:32%; animation:dwcDrift2 62s linear infinite; opacity:.7;}
.dwc-decor-3{width:170px; height:64px; top:58%; animation:dwcDrift3 78s linear infinite; opacity:.5;}
@keyframes dwcDrift1{0%{transform:translateX(-40%);} 100%{transform:translateX(340%);}}
@keyframes dwcDrift2{0%{transform:translateX(-30%);} 100%{transform:translateX(380%);}}
@keyframes dwcDrift3{0%{transform:translateX(-50%);} 100%{transform:translateX(320%);}}

.dwc-particle-layer{position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none;}
.dwc-p-rain{position:absolute; top:-20px; width:1.5px; height:14px; background:linear-gradient(to bottom, transparent, rgba(126,232,221,0.55)); animation-name:dwcRainFall; animation-timing-function:linear; animation-iteration-count:infinite;}
@keyframes dwcRainFall{0%{transform:translateY(0);opacity:0;} 10%{opacity:1;} 100%{transform:translateY(420px);opacity:0.2;}}
.dwc-p-snow{position:absolute; top:-10px; width:4px; height:4px; border-radius:50%; background:rgba(234,243,255,0.8); animation-name:dwcSnowFall; animation-timing-function:linear; animation-iteration-count:infinite;}
@keyframes dwcSnowFall{0%{transform:translate(0,0);opacity:0;} 10%{opacity:.9;} 100%{transform:translate(18px,420px);opacity:0.15;}}

.dwc-inner{position:relative; z-index:1; padding:18px 20px 18px;}

.dwc-header-row{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
.dwc-eyebrow{font-family:var(--dwc-font-mono); font-size:10px; letter-spacing:2px; color:var(--dwc-cyan-300); display:flex; align-items:center; gap:6px;}
.dwc-eyebrow::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--dwc-cyan-300); box-shadow:0 0 8px var(--dwc-cyan-300); animation:dwcLivePulse 1.8s ease-in-out infinite;}
.dwc-eyebrow.dwc-no-dot::before{display:none;}
@keyframes dwcLivePulse{0%,100%{opacity:1} 50%{opacity:0.35}}

.dwc-header-actions{display:flex; align-items:center; gap:8px;}
.dwc-refresh-btn{width:26px; height:26px; border-radius:50%; background:var(--dwc-glass-fill); border:1px solid var(--dwc-glass-border); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:transform .15s ease;}
.dwc-refresh-btn:active{transform:scale(.88);}
.dwc-refresh-btn svg{transition:transform .3s ease;}
.dwc-refresh-btn.dwc-spinning svg{animation:dwcSpin .9s linear infinite;}
@keyframes dwcSpin{from{transform:rotate(0)} to{transform:rotate(360deg)}}

.dwc-unit-toggle{background:var(--dwc-glass-fill); border:1px solid var(--dwc-glass-border); border-radius:20px; display:flex; cursor:pointer; font-family:var(--dwc-font-mono); font-size:11px; overflow:hidden; transition:transform .15s ease;}
.dwc-unit-toggle .dwc-unit{padding:4px 9px; color:var(--dwc-text-lo); transition:all .25s ease; cursor:pointer;}
.dwc-unit-toggle:active{transform:scale(.96);}
.dwc-unit-toggle .dwc-unit.dwc-active{background:var(--dwc-cyan-400); color:#04211E; font-weight:700;}

.dwc-ticker{
  position:relative; z-index:1;
  display:flex; align-items:center; gap:0;
  height:26px;
  font-family:var(--dwc-font-mono); font-size:10.5px; font-weight:700; letter-spacing:.3px;
}
.dwc-ticker.dwc-level-severe{background:#D8383E; color:#FFFFFF;}
.dwc-ticker.dwc-level-warning{background:#E08B1D; color:#241800;}
.dwc-ticker.dwc-level-info{background:#E0B72E; color:#241D00;}
.dwc-ticker-tag{
  flex-shrink:0; display:flex; align-items:center; gap:5px;
  padding:0 10px; height:100%;
  background:rgba(0,0,0,0.18);
  text-transform:uppercase;
}
.dwc-ticker-dot{width:6px; height:6px; border-radius:50%; background:currentColor; animation:dwcLivePulse 1.2s ease-in-out infinite;}
.dwc-ticker-track{flex:1; overflow:hidden; height:100%; display:flex; align-items:center;}
.dwc-ticker-move{display:inline-flex; align-items:center; white-space:nowrap; animation:dwcTickerScroll 20s linear infinite;}
.dwc-ticker-item{display:inline-flex; align-items:center; gap:5px; white-space:nowrap;}
.dwc-ticker-item svg{flex-shrink:0;}
.dwc-ticker-sep{margin:0 16px; opacity:.6;}
.dwc-ticker-time{
  flex-shrink:0; padding:0 10px; height:100%; display:flex; align-items:center;
  background:rgba(0,0,0,0.12); font-size:9px; font-weight:600; opacity:.85; letter-spacing:0;
  text-transform:none;
}
@keyframes dwcTickerScroll{from{transform:translateX(0);} to{transform:translateX(-50%);}}

.dwc-hi-arrow{animation:dwcHiBounce 1.6s ease-in-out infinite;}
.dwc-lo-arrow{animation:dwcLoBounce 1.6s ease-in-out infinite;}
@keyframes dwcHiBounce{0%{transform:translateY(2px); opacity:.55;} 50%{transform:translateY(-2px); opacity:1;} 100%{transform:translateY(2px); opacity:.55;}}
@keyframes dwcLoBounce{0%{transform:translateY(-2px); opacity:.55;} 50%{transform:translateY(2px); opacity:1;} 100%{transform:translateY(-2px); opacity:.55;}}

.dwc-greeting{font-family:var(--dwc-font-mono); font-size:10.5px; color:var(--dwc-text-lo); letter-spacing:.5px; margin-bottom:6px;}

.dwc-location-row{display:flex; align-items:center; gap:6px; font-family:var(--dwc-font-display); font-size:16px; font-weight:600; margin-bottom:2px;}
.dwc-location-row svg{flex-shrink:0;}
.dwc-retry-btn{margin-left:4px; font-family:var(--dwc-font-mono); font-size:10px; padding:3px 9px; background:var(--dwc-cyan-400); color:#04211E; border:none; border-radius:12px; cursor:pointer; font-weight:700; transition:transform .15s ease;}
.dwc-retry-btn:active{transform:scale(.92);}

.dwc-search-toggle-btn{
  margin-left:auto; flex-shrink:0; width:22px; height:22px; border-radius:50%;
  background:var(--dwc-glass-fill); border:1px solid var(--dwc-glass-border);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:transform .15s ease, background .2s ease;
}
.dwc-search-toggle-btn:active{transform:scale(.88);}
.dwc-search-toggle-btn.dwc-active{background:var(--dwc-cyan-400);}
.dwc-search-toggle-btn.dwc-active svg circle,
.dwc-search-toggle-btn.dwc-active svg path{stroke:#04211E;}

.dwc-search-panel{
  margin:8px 0 4px;
  padding:10px;
  background:var(--dwc-glass-fill);
  border:1px solid var(--dwc-glass-border);
  border-radius:12px;
  animation:dwcAlertIn .25s ease both;
}
.dwc-search-input-wrap{position:relative;}
.dwc-search-input{
  width:100%; background:rgba(0,0,0,0.25); border:1px solid var(--dwc-glass-border);
  border-radius:8px; padding:7px 28px 7px 10px; color:var(--dwc-text-hi); font-size:12.5px;
  font-family:var(--dwc-font-body); outline:none; box-sizing:border-box;
}
.dwc-search-input:focus{border-color:var(--dwc-cyan-400);}
.dwc-search-clear-btn{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(255,255,255,0.1); color:var(--dwc-text-lo); font-size:14px; line-height:1;
  display:flex; align-items:center; justify-content:center;
}
.dwc-search-clear-btn:active{transform:translateY(-50%) scale(.88);}
.dwc-search-results{margin-top:6px; max-height:160px; overflow-y:auto;}
.dwc-search-result-item{
  padding:7px 8px; border-radius:7px; font-size:12px; color:var(--dwc-text-hi);
  cursor:pointer; display:flex; justify-content:space-between; gap:6px;
}
.dwc-search-result-item:hover, .dwc-search-result-item:active{background:rgba(255,255,255,0.08);}
.dwc-search-result-item .dwc-search-result-country{color:var(--dwc-text-lo); font-size:10.5px; flex-shrink:0;}
.dwc-search-empty, .dwc-search-loading{font-size:11.5px; color:var(--dwc-text-lo); padding:6px 4px;}
.dwc-search-history{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
.dwc-search-history-chip{
  font-family:var(--dwc-font-mono); font-size:10px; padding:4px 9px; border-radius:12px;
  background:rgba(255,255,255,0.06); border:1px solid var(--dwc-glass-border); color:var(--dwc-text-lo);
  cursor:pointer; transition:background .2s ease;
}
.dwc-search-history-chip:hover, .dwc-search-history-chip:active{background:rgba(255,255,255,0.12); color:var(--dwc-text-hi);}
.dwc-search-use-my-location{
  margin-top:8px; width:100%; display:flex; align-items:center; justify-content:center; gap:6px;
  background:transparent; border:1px dashed var(--dwc-glass-border); color:var(--dwc-cyan-300);
  font-size:11px; font-family:var(--dwc-font-mono); padding:6px; border-radius:8px; cursor:pointer;
}
.dwc-search-use-my-location:active{transform:scale(.97);}
.dwc-weather-widget .dwc-hidden{display:none !important;}

.dwc-updated-row{font-family:var(--dwc-font-mono); font-size:9.5px; color:var(--dwc-text-lo); margin-bottom:8px; display:flex; align-items:center; gap:5px;}
.dwc-clock-row{font-family:var(--dwc-font-mono); font-size:11px; color:var(--dwc-text-lo); margin-bottom:14px; letter-spacing:1px;}

.dwc-main-display{display:flex; align-items:center; justify-content:space-between; margin-bottom:6px;}
.dwc-icon-stage{width:76px; height:76px; position:relative; flex-shrink:0;}
.dwc-icon-stage svg{position:absolute; inset:0; width:100%; height:100%; display:none;}
.dwc-icon-stage.dwc-show-clear-day .dwc-icon-clear-day{display:block;}
.dwc-icon-stage.dwc-show-clear-night .dwc-icon-clear-night{display:block;}
.dwc-icon-stage.dwc-show-cloudy-day .dwc-icon-cloudy-day{display:block;}
.dwc-icon-stage.dwc-show-cloudy-night .dwc-icon-cloudy-night{display:block;}
.dwc-icon-stage.dwc-show-rain-day .dwc-icon-rain-day{display:block;}
.dwc-icon-stage.dwc-show-rain-night .dwc-icon-rain-night{display:block;}
.dwc-icon-stage.dwc-show-storm-day .dwc-icon-storm-day{display:block;}
.dwc-icon-stage.dwc-show-storm-night .dwc-icon-storm-night{display:block;}
.dwc-icon-stage.dwc-show-snow-day .dwc-icon-snow-day{display:block;}
.dwc-icon-stage.dwc-show-snow-night .dwc-icon-snow-night{display:block;}
.dwc-icon-stage.dwc-show-fog-day .dwc-icon-fog-day{display:block;}
.dwc-icon-stage.dwc-show-fog-night .dwc-icon-fog-night{display:block;}

.dwc-sun-core{animation:dwcSunPulse 3.2s ease-in-out infinite; transform-origin:center;}
.dwc-sun-glow{animation:dwcSunGlowBreathe 3.2s ease-in-out infinite; transform-origin:center;}
@keyframes dwcSunGlowBreathe{0%,100%{opacity:1; transform:scale(1);} 50%{opacity:.7; transform:scale(1.08);}}
@keyframes dwcSunPulse{0%,100%{transform:scale(1); filter:drop-shadow(0 0 6px rgba(255,180,84,.55));} 50%{transform:scale(1.08); filter:drop-shadow(0 0 14px rgba(255,180,84,.9));}}
.dwc-sun-rays{animation:dwcRayRotate 18s linear infinite; transform-origin:center;}
@keyframes dwcRayRotate{from{transform:rotate(0)} to{transform:rotate(360deg)}}
.dwc-moon-glow{animation:dwcMoonGlow 3.6s ease-in-out infinite;}
@keyframes dwcMoonGlow{0%,100%{filter:drop-shadow(0 0 5px rgba(200,215,255,.5));} 50%{filter:drop-shadow(0 0 12px rgba(200,215,255,.85));}}
.dwc-star{animation:dwcTwinkle 2.4s ease-in-out infinite;}
.dwc-star-gold{filter:drop-shadow(0 0 2px rgba(255,217,140,.7));}
.dwc-star.dwc-star-sparkle{animation:dwcSparkleTwinkle 2.4s ease-in-out infinite; transform-origin:center;}
@keyframes dwcSparkleTwinkle{0%,100%{opacity:.3; transform:scale(.7);} 50%{opacity:1; transform:scale(1.15);}}
.dwc-star.dwc-s2{animation-delay:.6s;} .dwc-star.dwc-s3{animation-delay:1.2s;}
@keyframes dwcTwinkle{0%,100%{opacity:.25} 50%{opacity:1}}
.dwc-cloud-body{animation:dwcCloudFloat 4s ease-in-out infinite; filter:drop-shadow(0 5px 7px rgba(5,15,30,.35));}
@keyframes dwcCloudFloat{0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)}}
.dwc-drop{animation:dwcDropFall 1.1s linear infinite;}
.dwc-drop.dwc-d2{animation-delay:.35s;} .dwc-drop.dwc-d3{animation-delay:.7s;}
@keyframes dwcDropFall{0%{transform:translateY(-3px); opacity:0} 25%{opacity:1} 100%{transform:translateY(14px); opacity:0}}
.dwc-bolt{animation:dwcFlash 2.6s ease-in-out infinite; filter:drop-shadow(0 0 5px rgba(255,209,102,.85));}
.dwc-bolt-night{animation:dwcFlashNight 2.6s ease-in-out infinite; filter:drop-shadow(0 0 9px rgba(255,224,138,1));}
@keyframes dwcFlashNight{0%,88%,100%{opacity:0;} 90%,95%{opacity:1;}}
.dwc-flake.dwc-flake-sparkle{animation:dwcSnowSpin 2.4s linear infinite, dwcFlakeTwinkle 1.4s ease-in-out infinite;}
@keyframes dwcFlakeTwinkle{0%,100%{filter:brightness(1);} 50%{filter:brightness(1.6) drop-shadow(0 0 2px rgba(234,243,255,.8));}}
@keyframes dwcFlash{0%,88%,100%{opacity:0} 90%,95%{opacity:1}}
.dwc-flake{animation:dwcSnowSpin 2.4s linear infinite;}
.dwc-flake.dwc-f2{animation-delay:.6s;} .dwc-flake.dwc-f3{animation-delay:1.2s;}
@keyframes dwcSnowSpin{0%{transform:translate(0,-3px) rotate(0)} 100%{transform:translate(4px,15px) rotate(90deg); opacity:0}}
.dwc-fog-bar{animation:dwcFogDrift 3.6s ease-in-out infinite; filter:blur(0.4px);}
.dwc-fog-bar.dwc-f2{animation-delay:.5s;} .dwc-fog-bar.dwc-f3{animation-delay:1s;}
@keyframes dwcFogDrift{0%{transform:translateX(-5px); opacity:.5} 50%{transform:translateX(5px); opacity:.9} 100%{transform:translateX(-5px); opacity:.5}}

.dwc-temp-block{text-align:right;}
.dwc-temp-value{font-family:var(--dwc-font-mono); font-size:44px; font-weight:700; line-height:1; letter-spacing:-1px;}
.dwc-temp-unit-label{font-family:var(--dwc-font-mono); font-size:16px; color:var(--dwc-text-lo); vertical-align:top; position:relative; top:4px;}
.dwc-condition-text{font-size:13.5px; color:var(--dwc-text-lo); margin-bottom:8px;}
.dwc-hilo-row{display:flex; gap:14px; margin-bottom:10px; font-family:var(--dwc-font-mono); font-size:11.5px; color:var(--dwc-text-hi);}
.dwc-hilo-item{display:flex; align-items:center; gap:3px;}
.dwc-feels-like-wrap{display:inline-flex; align-items:center; gap:2px;}
.dwc-feels-arrow{display:inline-flex; align-items:center;}
.dwc-feels-arrow svg{display:block;}
.dwc-rain-chance{display:flex; align-items:center; gap:5px; font-size:11.5px; color:var(--dwc-cyan-300); margin:0 0 14px; font-family:var(--dwc-font-mono);}
.dwc-rain-chance-val{font-weight:700;}
.dwc-rain-chance-label{color:var(--dwc-text-lo); font-family:var(--dwc-font-body);}
.dwc-day-card-rain{font-family:var(--dwc-font-mono); font-size:9px; color:var(--dwc-cyan-300); display:flex; align-items:center; gap:2px;}

.dwc-arc-wrap{margin-bottom:14px;}
.dwc-arc-svg{width:100%; height:44px; display:block;}
.dwc-arc-path{fill:none; stroke:rgba(255,255,255,0.15); stroke-width:1.5; stroke-dasharray:2 4;}
.dwc-arc-dot-glow{fill:url(#dwcSunGlow);}
.dwc-arc-dot-core{fill:url(#dwcSunGrad); filter:drop-shadow(0 0 4px rgba(255,180,84,.75));}
.dwc-arc-dot.dwc-is-night .dwc-arc-dot-glow{fill:url(#dwcMoonHalo);}
.dwc-arc-dot.dwc-is-night .dwc-arc-dot-core{fill:url(#dwcMoonGrad); filter:drop-shadow(0 0 4px rgba(143,162,200,.65));}
.dwc-arc-dot-simple{fill:var(--dwc-amber-400); filter:drop-shadow(0 0 6px rgba(255,180,84,.8));}
.dwc-arc-dot.dwc-is-night .dwc-arc-dot-simple{fill:#8FA2C8; filter:drop-shadow(0 0 6px rgba(143,162,200,.7));}
.dwc-arc-times{display:flex; justify-content:space-between; margin-top:4px;}
.dwc-suntime-block{display:flex; flex-direction:column; align-items:center; gap:4px;}
.dwc-sunrise-time, .dwc-sunset-time{font-family:var(--dwc-font-mono); font-size:9.5px; font-weight:500; color:var(--dwc-text-hi); line-height:1;}
.dwc-suntime-divider{width:20px; height:1px; background:linear-gradient(90deg, transparent, var(--dwc-glass-border), transparent);}
.dwc-suntime-label{display:flex; align-items:center; gap:4px; font-family:var(--dwc-font-body); font-size:10.5px; font-weight:600; letter-spacing:.8px; color:var(--dwc-text-lo); line-height:1;}
.dwc-suntime-sun{filter:drop-shadow(0 0 2.5px rgba(255,180,84,.75));}
.dwc-suntime-moon{filter:drop-shadow(0 0 2.5px rgba(126,200,255,.65));}

.dwc-stats-grid{display:flex; flex-wrap:wrap; gap:10px 0; padding:12px 0; margin-bottom:12px; border-top:1px solid var(--dwc-glass-border); border-bottom:1px solid var(--dwc-glass-border);}
.dwc-stat{flex:0 0 33.33%; display:flex; flex-direction:column; align-items:center; gap:3px; font-family:var(--dwc-font-mono); font-size:12px; color:var(--dwc-text-hi);}
.dwc-stat svg{opacity:.85;}
.dwc-stat label{font-family:var(--dwc-font-body); font-size:9px; color:var(--dwc-text-lo); letter-spacing:.4px; text-transform:uppercase;}
.dwc-compass{position:relative; width:16px; height:16px; border:1px solid rgba(255,255,255,0.25); border-radius:50%;}
.dwc-compass .dwc-arrow{position:absolute; top:50%; left:50%; width:1.5px; height:7px; background:var(--dwc-violet-400); transform-origin:bottom center; transform:translate(-50%,-100%) rotate(0deg);}
.dwc-aqi-badge{padding:1px 7px; border-radius:8px; font-weight:700; font-size:11px;}

.dwc-trend-wrap{margin-bottom:14px;}
.dwc-trend-label{font-family:var(--dwc-font-mono); font-size:10px; letter-spacing:2px; color:var(--dwc-text-lo); display:block; margin-bottom:6px;}
.dwc-trend-svg{width:100%; height:52px; display:block; overflow:visible;}
.dwc-trend-line{fill:none; stroke:var(--dwc-cyan-400); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 4px rgba(79,209,197,.6));}
.dwc-trend-area{fill:url(#dwcTrendFill); stroke:none;}
.dwc-trend-dot{fill:#0A1626; stroke:var(--dwc-cyan-400); stroke-width:2;}
.dwc-trend-val{font-family:var(--dwc-font-mono); font-size:10px; font-weight:700; fill:var(--dwc-text-hi);}
.dwc-trend-footer{display:flex; justify-content:space-between; margin-top:4px; font-family:var(--dwc-font-mono); font-size:9.5px; color:var(--dwc-text-lo); letter-spacing:.5px;}

.dwc-forecast-heading{font-family:var(--dwc-font-mono); font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--dwc-text-lo); margin-bottom:8px;}
.dwc-tabs{display:flex; gap:6px; margin-bottom:10px;}
.dwc-tab-btn{font-family:var(--dwc-font-mono); font-size:10.5px; letter-spacing:1px; padding:5px 11px; border-radius:14px; background:var(--dwc-glass-fill); border:1px solid var(--dwc-glass-border); color:var(--dwc-text-lo); cursor:pointer; transition:all .2s ease;}
.dwc-tab-btn:active{transform:scale(.94);}
.dwc-tab-btn.dwc-active{background:var(--dwc-cyan-400); color:#04211E; font-weight:700; border-color:transparent;}

.dwc-forecast-scroll{display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x proximity; padding-bottom:4px; scrollbar-width:thin; scrollbar-color:var(--dwc-cyan-400) transparent;}
.dwc-forecast-scroll::-webkit-scrollbar{height:4px;}
.dwc-forecast-scroll::-webkit-scrollbar-thumb{background:var(--dwc-cyan-400); border-radius:4px;}
.dwc-forecast-scroll::-webkit-scrollbar-track{background:transparent;}
.dwc-day-card{scroll-snap-align:start; flex:0 0 58px; background:var(--dwc-glass-fill); border:1px solid var(--dwc-glass-border); border-radius:14px; padding:10px 0 8px; display:flex; flex-direction:column; align-items:center; gap:6px; transition:transform .2s ease, background .2s ease; animation:dwcCardFadeIn .4s ease both;}
.dwc-day-card:hover{transform:translateY(-3px); background:rgba(255,255,255,0.08);}
.dwc-day-card:active{transform:scale(.95);}
.dwc-day-card-now{border-color:var(--dwc-cyan-400); box-shadow:0 0 0 1px rgba(79,209,197,.3), 0 4px 14px -4px rgba(79,209,197,.4);}
@keyframes dwcCardFadeIn{0%{opacity:0; transform:translateY(8px);} 100%{opacity:1; transform:translateY(0);}}
.dwc-day-card .dwc-dname{font-family:var(--dwc-font-mono); font-size:10px; color:var(--dwc-text-lo); letter-spacing:.5px;}
.dwc-day-card svg{width:30px; height:30px; filter:drop-shadow(0 2px 3px rgba(0,0,0,.4));}
.dwc-day-card .dwc-dmax{font-family:var(--dwc-font-mono); font-size:12.5px; font-weight:700;}
.dwc-day-card .dwc-dmin{font-family:var(--dwc-font-mono); font-size:10.5px; color:var(--dwc-text-lo);}
.dwc-forecast-error{font-size:12px; color:var(--dwc-text-lo);}

.dwc-skeleton{background:linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.18), rgba(255,255,255,.05)); background-size:200% 100%; animation:dwcShimmer 1.4s infinite; border-radius:6px; color:transparent !important; border-color:transparent !important;}
@keyframes dwcShimmer{0%{background-position:200% 0} 100%{background-position:-200% 0}}

@media (prefers-reduced-motion: reduce){
  .dwc-weather-widget *{animation:none !important; transition:none !important;}
}
.dwc-weather-widget.dwc-offscreen *{animation-play-state:paused !important;}
.dwc-weather-widget button:focus-visible{outline:2px solid var(--dwc-cyan-400); outline-offset:2px;}