/* A static floating summary; the page keeps its original visual design. */
.weather-float {
  position:fixed;
  left:20px;
  bottom:20px;
  z-index:40;
  width:min(230px,calc(100vw - 40px));
  min-height:50px;
  border:1px solid #E2DFD8;
  border-radius:14px;
  background:#fff;
  box-shadow:0 5px 22px #19232A12;
  overflow:hidden;
}
.weather-float > [data-weather-summary] { min-width:0; }
.weather-float-link {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:54px;
  width:100%;
  padding:10px 13px;
  color:#19232A;
  background:#fff;
  text-decoration:none;
  line-height:1.35;
}
.weather-float-link:hover { background:#FCF7F5; }
.weather-float-link:focus-visible { outline:3px solid #B62C36; outline-offset:-4px; border-radius:12px; }
.weather-float-icon, .weather-float-icon svg { display:block; width:24px; height:24px; }
.weather-float-icon { flex:0 0 24px; color:#B62C36; }
.weather-float-copy { display:block; flex:1; min-width:0; }
.weather-float-label { display:block; margin-bottom:2px; font-size:9px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:#677078; }
.weather-float-value { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#19232A; font-size:12px; font-weight:650; font-variant-numeric:tabular-nums; }
.weather-float-arrow { flex:0 0 auto; color:#B62C36; font-size:15px; line-height:1; }
body:has(.weather-float:not([hidden])) .site-footer { padding-bottom:96px; }

/* Four upcoming periods complement the current conditions in the main widget. */
[data-live-weather] .weather-details { margin:16px 0; }
[data-live-weather] .weather-details dt { font-size:11px; font-weight:400; color:#5C646C; }
[data-live-weather] .weather-details dd { margin:4px 0 0; color:var(--ink,#19232A); font-size:15px; font-weight:650; }
.weather-forecast { display:block; margin:24px 0 18px; padding-top:21px; border-top:1px solid #E1E2DF; }
[data-live-weather] .weather-forecast-heading { font-size:17px; letter-spacing:-.025em; line-height:1.35; margin:0 0 8px; color:var(--ink,#19232A); }
[data-live-weather] .weather-forecast-summary { font-size:13px; line-height:1.65; color:#59616A; margin:0 0 15px; }
.weather-hours { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; list-style:none; padding:0; margin:0; }
.weather-hour { display:flex; flex-direction:column; min-width:0; padding:13px 10px; border:1px solid #E1E2DF; border-radius:6px; background:#F7F6F2; }
.weather-hour-time { display:block; font-size:11px; font-weight:650; color:#59616A; line-height:1.4; }
.weather-hour-temp { display:block; margin:10px 0 7px; color:var(--ink,#19232A); font-size:23px; font-weight:750; line-height:1; letter-spacing:-.045em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.weather-hour-condition { display:block; flex:1; margin-bottom:8px; color:#39434A; font-size:11px; line-height:1.5; overflow-wrap:break-word; }
.weather-hour-rain { display:block; padding-top:8px; border-top:1px solid #DADDD9; color:#59616A; font-size:10px; line-height:1.5; }
[data-live-weather] .weather-updated { font-size:11px; line-height:1.65; color:#626A71; }
[data-live-weather] .weather-source { font-size:11px; line-height:1.6; }

@media(max-width:1050px) and (min-width:781px) {
  .weather-hours { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:780px) {
  .weather-float { left:12px; right:auto; bottom:max(12px,env(safe-area-inset-bottom)); width:max-content; max-width:calc(100vw - 24px); min-height:44px; border-radius:11px; }
  .weather-float-link { width:auto; min-height:44px; padding:7px 10px; gap:7px; }
  .weather-float-icon,.weather-float-icon svg { width:20px; height:20px; }
  .weather-float-icon { flex-basis:20px; }
  .weather-float-label { display:none; }
  .weather-float-value { max-width:140px; font-size:11px; font-weight:600; }
  .weather-float-arrow { font-size:12px; }
  body:has(.planner-dock:not([hidden])) .weather-float { bottom:calc(max(12px,env(safe-area-inset-bottom)) + 60px); }
  [data-live-weather] .button { width:auto; max-width:100%; align-self:flex-start; flex:0 0 auto; }
  .weather-hours { gap:10px; }
  .weather-hour { padding:13px; }
}
@media(max-width:560px) {
  .weather-hours { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .weather-hour-temp { font-size:24px; }
}
@media(max-width:360px) {
  .weather-hour { padding:12px 10px; }
}
@media print {
  .weather-float, .weather-forecast { display:none !important; }
  body:has(.weather-float) .site-footer { padding-bottom:22px; }
}
.weather-float[hidden] { display:none !important; }