/* Weather page styles */
.wt-now {
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 2px 16px rgba(0,0,0,.07);
    padding: 28px 32px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.wt-now__temp { font-size: 72px; font-weight: 800; line-height: 1; color: #111; letter-spacing: -2px; }
.wt-now__desc { font-size: 16px; color: #555; margin-top: 4px; }
.wt-now__feels { font-size: 13px; color: #9ca3af; margin-top: 3px; }
.wt-updated { font-size: 12px; color: #d1d5db; text-align: center; margin-top: 20px; }

/* Strip */
.wt-strip-wrap { margin-bottom: 24px; }
.wt-strip { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.wt-strip__card {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 1px 6px rgba(0,0,0,.06);
    padding: 12px 6px;
    text-align: center;
    transition: box-shadow .15s;
    flex: 0 0 auto;
    width: 82px;
}
.wt-strip__card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.10); }
.wt-strip__dow { font-size: 22px; font-weight: 700; color: #374151; }
.wt-strip__dow.weekend { color: #ef4444; }
.wt-strip__date { font-size: 11px; color: #9ca3af; margin-bottom: 6px; }
.wt-strip__dtemp { font-size: 17px; font-weight: 700; color: #111; margin-top: 3px; }
.wt-strip__sep { border: none; border-top: 1px solid #f3f4f6; margin: 8px 4px; }
.wt-strip__ntemp { font-size: 13px; color: #6b7280; margin-top: 2px; }

/* Top grid: current + strip */
.wt-top-grid { display: grid; grid-template-columns: 30% 70%; gap: 16px; align-items: stretch; margin-bottom: 24px; }
.wt-top-grid .wt-now { margin-bottom: 0; }
.wt-top-grid .wt-strip-wrap {
    display: flex;
    padding: 0 16px 0 0;
}
.wt-top-grid .wt-strip { flex-wrap: nowrap; overflow-x: hidden; gap: 6px; width: 100%; align-items: stretch; }
.wt-top-grid .wt-strip__card { flex: 1 1 0; min-width: 0; width: auto; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 8px 4px; }

/* Day blocks */
.wt-day { background: #fff; border-radius: 16px; box-shadow: 0 1px 8px rgba(0,0,0,.06); overflow: hidden; min-width: 0; }
.wt-day__hdr { padding: 14px 20px; font-size: 15px; font-weight: 700; color: #111; border-bottom: 1px solid #f3f4f6; }
.wt-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 4px; }

/* Flex rows */
.wt-rows { width: 100%; }
.wt-row { display: flex; align-items: center; border-bottom: 1px solid #f3f4f6; padding: 10px 16px; }
.wt-row:last-child { border-bottom: none; }
.wt-row--head { padding: 8px 16px; background: #fafafa; }
.wt-row--head span { font-size: 11px; color: #9ca3af; text-transform: uppercase; letter-spacing: .4px; }
.wt-row__slot { flex: 0 0 70px; font-size: 13px; color: #6b7280; }
.wt-row__icon { flex: 0 0 36px; }
.wt-row__icon img { display: block !important; width: 28px !important; height: 28px !important; border-radius: 0 !important; margin: 0 !important; }
.wt-row__val { flex: 1; font-size: 14px; color: #374151; text-align: center; }
.wt-temp-main { font-size: 16px; font-weight: 700; color: #111; }
.wt-temp-feels { font-size: 13px; color: #9ca3af; }

/* Images */
.wt-now img { display: inline-block !important; border-radius: 0 !important; margin: 0 !important; width: 64px !important; height: 64px !important; }
.wt-strip__card img { display: block !important; border-radius: 0 !important; margin: 0 auto !important; }
.wt-strip__card img[width="34"] { width: 34px !important; height: 34px !important; }
.wt-strip__card img[width="24"] { width: 24px !important; height: 24px !important; }

/* Tablet */
@media (max-width: 900px) {
    .wt-now__temp { font-size: 48px !important; }
    .wt-now img { width: 40px !important; height: 40px !important; }
}

/* Mobile */
@media (max-width: 768px) {
    .wt-strip__dow { font-size: 12px; }
    .wt-top-grid .wt-strip-wrap { padding: 0; }
    .wt-top-grid { grid-template-columns: 1fr; }
    .wt-top-grid .wt-strip { flex-wrap: nowrap; overflow-x: auto; }
    .wt-detail-grid { grid-template-columns: 1fr; }
    .wt-detail-grid .wt-day { width: 100%; }
    .wt-col-mob-hide { display: none !important; }
    .wt-row__slot { flex: 0 0 60px; }
    .wt-now { flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px; }
    .wt-now > div { width: 100%; }
    .wt-now__temp { font-size: 56px !important; }
}

/* Theme overrides */
.news-art__content .wt-now img,
.news-art__content .wt-strip__card img,
.news-art__content .wt-row__icon img { height: auto !important; max-width: none !important; }
