/* Weather Widget (LEGACY v1) — kabdalis2 design system.
   DEPRECATED: weather-widget-v3 is the successor.
   Minimal kabdalis2 styling so legacy instances don't look broken,
   but no full redesign. New pages should use weather-widget-v3.

   view.js adds .ww.b-card to wrapper at runtime. */

.kabdalis-weather-widget.ww{
    padding:var(--card-pad);
    display:flex; flex-direction:column; gap:12px;
}
.ww h2,
.ww .kabdalis-weather-title{
    font-family:var(--font-display); font-weight:var(--display-w);
    letter-spacing:var(--display-ls);
    font-size:1.2rem; line-height:1.15; margin:0; color:var(--ink);
}

/* Stats grid — uses 2-up b-metrics-like layout */
.ww .weather-stats,
.ww .stats-grid{
    display:grid; grid-template-columns:repeat(2, 1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
    border-radius:var(--radius-sm); overflow:hidden;
}
.ww .stat-col{
    background:var(--surface);
    padding:14px;
    display:flex; flex-direction:column; gap:4px;
}
.ww .stat-label{
    font-family:var(--font-mono); font-size:.64rem;
    text-transform:uppercase; letter-spacing:.04em; color:var(--muted);
}
.ww .stat-value{
    font-family:var(--font-display); font-weight:var(--display-w);
    font-size:1.5rem; line-height:1; color:var(--ink);
}

/* Weather bar (legacy home-bar layout) — columns are distributed by CSS instead
   of the old JS gridTemplateColumns math, which read getComputedStyle per item
   and wrote the column count on a 200ms timer (layout thrash + visible reflow).
   auto-fit + minmax keeps items evenly sized and wraps to as many rows as fit. */
.kabdalis-weather-widget .weather-bar-content{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(120px, 1fr));
    gap:12px;
}
@media (max-width:768px){
    .kabdalis-weather-widget .weather-bar-content{
        grid-template-columns:repeat(auto-fit, minmax(96px, 1fr));
    }
}