.weather-forecast { margin: 15px 0 13px; padding: 14px 15px 12px; border: 1px solid #b9dbe5; border-radius: 15px; background: linear-gradient(120deg, #f0fbfb, #f8fbff); color: #14394c; }
.weather-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.weather-heading-mark { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 11px; background: #ffce66; color: #65441b; font-size: 22px; }
.weather-heading > div { display: grid; gap: 2px; min-width: 0; }
.weather-heading strong { font-size: 15px; line-height: 1.2; }
.weather-heading div > span { font-size: 12px; color: #436374; }
.weather-loading { margin: 0; font-size: 13px; line-height: 1.5; color: #405f72; }
.weather-days { display: grid; grid-auto-columns: minmax(85px, 1fr); grid-auto-flow: column; gap: 6px; overflow-x: auto; padding: 2px 0 7px; scrollbar-color: #91bfc6 transparent; }
.weather-day { display: grid; justify-items: center; gap: 4px; min-width: 0; padding: 11px 4px 9px; border: 1px solid #d4e8eb; border-radius: 11px; background: #fff; text-align: center; }
.weather-date { color: #2e5364; font-size: 11px; font-weight: 800; white-space: nowrap; text-transform: capitalize; }
.weather-icon { display: block; width: 29px; height: 29px; color: #e5a031; }
.weather-icon-cloud,.weather-icon-fog { color: #718fa6; }
.weather-icon-rain,.weather-icon-storm { color: #2371b6; }
.weather-icon-snow { color: #67a8c4; }
.weather-temperature { display: flex; align-items: baseline; gap: 5px; font-size: 14px; white-space: nowrap; }
.weather-temperature strong { color: #183e53; font-weight: 850; }
.weather-temperature span { color: #648094; }
.weather-description { color: #557082; font-size: 10px; white-space: nowrap; }
.weather-source,.weather-index-source { margin: 6px 0 0; color: #617988; font-size: 10px; line-height: 1.4; }
.weather-source a,.weather-index-source a { color: #245d79; text-decoration: underline; text-underline-offset: 2px; }
.weather-index-source { margin-top: 10px; }
.weather-badge { position: absolute; z-index: 3; top: 10px; left: 10px; display: inline-flex; align-items: center; gap: 5px; max-width: calc(100% - 76px); padding: 5px 8px; border: 1px solid #ffffffb0; border-radius: 10px; background: #fffef4f2; color: #193d51; box-shadow: 0 3px 12px #092f4040; pointer-events: none; }
.weather-badge .weather-icon { width: 25px; height: 25px; flex: none; }
.weather-badge > span { display: grid; gap: 1px; line-height: 1; }
.weather-badge strong { font-size: 15px; font-weight: 850; }
.weather-badge small { font-size: 9px; white-space: nowrap; }
.weather-badge-muted { color: #4d6876; font-size: 10px; font-weight: 750; }
.destination-index-item .weather-badge small { display: none; }
.destination-index-item .weather-badge strong { font-size: 15px; line-height: 1; }
.city-photo .weather-badge { top: 12px; left: 12px; }
.dream-destinations-hero > .weather-badge { z-index: 2; top: 16px; left: auto; right: 16px; max-width: 45%; padding: 8px 11px; }
.dream-destinations-hero > .weather-badge strong { font-size: 20px; }
@media (max-width: 720px) {
  .weather-forecast { padding: 12px; }
  .weather-days { grid-auto-columns: 89px; }
  .weather-badge { top: 6px; left: 6px; padding: 4px 6px; }
  .weather-badge .weather-icon { width: 21px; height: 21px; }
  .weather-badge strong { font-size: 13px; }
  .dream-destinations-hero > .weather-badge { top: 12px; right: 12px; }
}