/* A self-contained weather destination in the Cores de Lisboa system.
   Do not inherit the retired guide's compact weather.css component. */
.rd-guest-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}
.rd-weather-pane{min-width:0;scroll-margin-top:100px}
.rd-weather-back{display:inline-flex;align-items:center;min-height:44px;margin-bottom:16px;font-weight:600}
.rd-guest-shell #weather{width:100%;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;scroll-margin-top:110px;font:400 17px/1.55 var(--font-body);color:var(--ink)}
#weather .eyebrow{font:700 14px/1.5 var(--font-body);letter-spacing:.1em;color:var(--accent);margin:0 0 12px}
#weather .weather-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}
#weather #weather-title{font:800 clamp(36px,4.5vw,64px)/1.02 var(--font-display);letter-spacing:-.035em;max-width:15ch;margin:0;text-wrap:balance}
#weather button{font:600 16px/1.3 var(--font-body);color:var(--ink);background:var(--white);border:1px solid var(--line-2);border-radius:12px;min-height:44px;padding:10px 16px;cursor:pointer}
#weather button:disabled{opacity:.45;cursor:default}
#weather :focus-visible{outline:3px solid var(--accent);outline-offset:3px}
#weather .weather-output{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:20px 32px;background:var(--sol);border-radius:24px;padding:28px 32px;margin:0 0 14px;box-sizing:border-box}
#weather .weather-output:empty{display:none}
#weather .weather-current{display:flex;align-items:center;flex-wrap:wrap;gap:16px;font-weight:600}
#weather .weather-temp{font:800 64px/1 var(--font-display);letter-spacing:-.04em}
#weather .weather-symbol{display:block!important;flex:none;width:32px;min-width:32px;height:32px;object-fit:contain}
#weather .weather-icon{width:56px;min-width:56px;height:56px}
#weather .weather-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin:0}
#weather .weather-metrics dt{font-size:14px;font-weight:600}
#weather .weather-metrics dd{font-size:22px;font-weight:700;margin:4px 0 0}
#weather .weather-status,#weather .weather-note{font-size:14px;line-height:1.6;color:var(--muted);margin:12px 0}
#weather .weather-output .weather-note{grid-column:1/-1;margin:0;color:var(--ink)}
#weather .weather-output a{color:var(--ink);text-decoration:underline;text-underline-offset:.15em}
#weather .weather-unavailable{grid-column:1/-1;margin:0;max-width:48ch}
#weather .weather-choices{display:flex;gap:6px;flex-wrap:wrap;background:var(--cal-3);padding:6px;border-radius:16px;width:fit-content;margin:28px 0 22px}
#weather .weather-choices button{border-color:transparent;background:transparent;min-width:110px}
#weather .weather-choices button[aria-pressed=true]{color:var(--white);background:var(--ink);box-shadow:0 2px 6px #221a2018}
#weather .weather-date-heading{font:800 30px/1.15 var(--font-display);letter-spacing:-.02em;margin:26px 0 12px}
#weather .weather-suggestions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:20px 0 28px}
#weather .weather-suggestion{min-width:0;padding:26px;border-radius:22px;background:var(--ceu)}
#weather .weather-suggestion:nth-child(2){background:var(--jacaranda-soft)}
#weather .weather-suggestion h3,#weather .weather-climate-summary h3{font:800 26px/1.15 var(--font-display);letter-spacing:-.02em;margin:14px 0}
#weather .weather-suggestion p{font:400 17px/1.6 var(--font-body);margin:12px 0}
#weather .weather-suggestion .eyebrow{font-size:14px;font-weight:700;margin:0}
#weather .weather-suggestion .weather-period{font-size:14px;font-weight:600}
#weather .weather-condition{display:flex;align-items:center;gap:10px;font-size:15px;margin:14px 0}
#weather .weather-suggestion a,#weather .weather-day-detail>a{display:inline-flex;align-items:center;min-height:44px;font-size:16px;font-weight:700}
#weather .weather-week,#weather .weather-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin:20px 0}
#weather .weather-day{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:132px;min-width:0;padding:12px 4px}
#weather .weather-day strong{font:800 25px/1 var(--font-display)}
#weather .weather-day small{font:600 15px/1.3 var(--font-body);white-space:nowrap}
#weather .weather-day[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white}
#weather .weather-day[aria-current=date]{box-shadow:inset 0 0 0 3px var(--accent)}
#weather .weather-average:not([aria-pressed=true]){background:var(--cal-2);border-style:dashed}
#weather .weather-average-tag{font:600 14px/1.2 var(--font-body)}
#weather .weather-average-label{font-weight:700;margin:16px 0 8px}
#weather .weather-weekday{text-align:center;font-size:14px;font-weight:600;color:var(--muted);padding:8px 0}
#weather .weather-month-nav{display:flex;align-items:center;gap:12px;margin-top:28px}
#weather .weather-month-nav h3{flex:1;font:800 28px/1.2 var(--font-display);letter-spacing:-.02em;margin:0}
#weather .weather-month-nav button{min-width:44px}
#weather .weather-month-nav button:not(:last-child){font-size:24px}
#weather .weather-climate-summary{padding:24px;border-left:4px solid var(--sol);border-radius:14px;background:var(--cal-2);margin:20px 0}
#weather .weather-climate-summary p{margin:12px 0}
#weather .weather-links{display:flex;flex-wrap:wrap;gap:12px 24px;padding-top:20px;margin-top:24px;border-top:1px solid var(--line);font-size:14px}
#weather .weather-links a{display:inline-flex;align-items:center;min-height:44px}
.rd-weather-pane #weather-credits{padding:20px 24px;margin:28px 0 0;border:1px solid var(--line);border-radius:18px;background:white;font:400 14px/1.6 var(--font-body)}
.rd-weather-pane #weather-credits summary{font-weight:700}
.rd-weather-pane #weather-credits p{margin:12px 0}
/* Retired footer element rules must not turn the shared brand footer into
   a two-column, serif miniature on this guest-guide destination. */
body>.rd-footer{display:block;width:100%;max-width:none;margin:40px 0 0;padding:0;font:400 16px/1.55 var(--font-body)}
.rd-footer-grid strong{font-family:var(--font-body);font-weight:700;font-size:18px}
.rd-footer .rd-logo span{font:inherit;margin:0}
.rd-footer .rd-footer-grid p,.rd-footer>.rd-container>details p{color:#e0d3d8}
@media(min-width:901px){.rd-weather-pane{width:100%}}
@media(max-width:900px){
 .rd-weather-pane{scroll-margin-top:24px}
 .rd-guest-shell:has(.rd-weather-pane:not([hidden])){max-width:900px}
 #weather .weather-output{grid-template-columns:minmax(0,1fr);align-items:start;align-content:center;gap:20px}
 #weather .weather-metrics{width:100%;gap:16px}
 #weather .weather-week{grid-template-columns:repeat(4,minmax(0,1fr))}
 #weather .weather-day{min-height:112px}
 #weather .weather-day small{font-size:14px}
}
@media(max-width:600px){
 .rd-weather-back{margin-bottom:12px}
 #weather .weather-heading{align-items:flex-start;gap:10px;margin-bottom:22px}
 #weather .weather-heading button{padding:10px;font-size:14px}
 #weather .weather-output{padding:22px;border-radius:20px}
 #weather .weather-temp{font-size:52px}
 #weather .weather-current{gap:12px}
 #weather .weather-current>span{font-size:16px}
 #weather .weather-metrics{gap:12px}
 #weather .weather-metrics dt{font-size:14px}
 #weather .weather-metrics dd{font-size:19px}
 #weather .weather-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:2px}
 #weather .weather-choices button{min-width:0;padding:10px 6px;font-size:15px}
 #weather .weather-suggestions{grid-template-columns:1fr;gap:14px}
 #weather .weather-suggestion{padding:22px}
 #weather .weather-date-heading{font-size:26px}
 #weather .weather-week{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 #weather .weather-calendar{gap:4px}
 #weather .weather-calendar .weather-day{min-height:104px;padding:8px 1px;gap:7px;border-radius:10px}
 #weather .weather-calendar .weather-day strong{font-size:20px}
 #weather .weather-calendar .weather-day small{font-size:14px}
 #weather .weather-calendar .weather-symbol{width:24px;min-width:24px;height:24px}
 #weather .weather-average-tag{font-size:14px}
 #weather .weather-weekday{font-size:14px}
 #weather .weather-month-nav{gap:6px;flex-wrap:wrap}
 #weather .weather-month-nav h3{font-size:24px}
 #weather .weather-month-nav button{padding:8px}
 #weather .weather-month-nav button:last-child{margin-left:auto;font-size:14px}
 #weather .weather-links{flex-direction:column;gap:4px}
}

/* Keep month temperatures readable at 320px without shrinking the labels. */
#weather .weather-range{display:inline-flex;gap:2px;align-items:center;justify-content:center}
@media(max-width:600px){#weather .weather-calendar .weather-range{display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.2;white-space:normal}#weather .weather-calendar .weather-range-divider{display:none}#weather .weather-calendar .weather-day{min-height:132px}#weather .weather-calendar .weather-day small{font-size:14px}}
@media(max-width:360px){#weather .weather-calendar{width:calc(100% + 40px);margin-inline:-20px;gap:2px;grid-template-columns:repeat(7,minmax(44px,1fr))}#weather .weather-calendar .weather-day{min-width:44px}}
/* The guest app already has a Map tab; avoid a redundant floating button
   covering dates in the full-month planner. Desktop keeps the header map. */
@media(max-width:900px){body:has(.rd-weather-pane:not([hidden])) .ll-map-fab{display:none}}
/* The async hourly probabilities must fit in the space reserved before fetch.
   No-JS keeps the existing hidden empty box and official-source fallback. */
html.ll-js #weather .weather-output{min-height:188px}
html.ll-js #weather .weather-output:empty{display:grid}
html.ll-js #weather .weather-output:empty::before{content:'';display:block;width:min(180px,100%);height:52px;border-radius:12px;background:#221a2014}
@media(max-width:900px){html.ll-js #weather .weather-output{min-height:300px}}
@media(max-width:600px){html.ll-js #weather .weather-output{min-height:340px}}
@media(max-width:360px){html.ll-js #weather .weather-output{min-height:380px}}
