.meteo-page {--meteo-station-dz: var(--color-accent);--meteo-station-ergue: #9b59b6;}
/* Styles communs de la section Météo. */
/* meteo_match */
.meteo-page .match-container {display: flex;flex-direction: column;gap: 16px;}
.meteo-page .match-header {display: grid;grid-template-columns: 1fr auto 1fr;text-align: center;align-items: center;gap: 10px;margin-bottom: 4px;}
.meteo-page .vs-label {color: #d2d2d7;}
.meteo-page .match-row {display: grid;grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);text-align: center;align-items: center;gap: 12px;}
.meteo-page .stat-sub {color: var(--color-muted);margin-top: 2px;}
.meteo-page .metric-label {color: var(--color-muted);padding: 0 10px;white-space: nowrap;}
@media (max-width: 600px) {.meteo-page .match-row {grid-template-columns: 1fr 1fr;gap: 8px;}.meteo-page .metric-label {grid-column: 1 / -1;grid-row: 1;padding: 4px 0;color: var(--color-accent);}.meteo-page .match-row > .metric-tile:first-of-type {grid-column: 1;grid-row: 2;}.meteo-page .match-row > .metric-tile:last-of-type {grid-column: 2;grid-row: 2;}}
/* Couleurs propres aux tranches météo ; structure et typographie dans layout.css. */
.meteo-page .bg-freeze {background-color: #dbeafe !important;color: #1e40af;}
.meteo-page .bg-t0 {background-color: #f0f9ff !important;}
.meteo-page .bg-t5 {background-color: #e0f2fe !important;}
.meteo-page .bg-t10 {background-color: #ecfdf5 !important;}
.meteo-page .bg-t15 {background-color: #fef9c3 !important;}
.meteo-page .bg-t20 {background-color: #fef08a !important;}
.meteo-page .bg-t25 {background-color: #fed7aa !important;}
.meteo-page .bg-t30 {background-color: #fca5a5 !important;color: #7f1d1d;}
.meteo-page .bg-t35 {background-color: #f87171 !important;color: #fff;}
/* meteo_graphiques */
.meteo-page .legende-custom {display: flex;flex-direction: column;gap: 8px;margin-top: 15px;margin-bottom: 10px;}
.meteo-page .legende-ligne {display: flex;flex-wrap: wrap;align-items: center;gap: 8px;}
.meteo-page .legende-titre {min-width: 90px;}
.meteo-page .legende-item {display: inline-flex;align-items: center;gap: 5px;padding: 3px 8px;border-radius: 12px;background: rgba(255, 255, 255, 0.05);border: 1px solid rgba(255, 255, 255, 0.1);cursor: pointer;user-select: none;transition: all 0.2s ease;}
.meteo-page .legende-item:hover {background: rgba(255, 255, 255, 0.15);}
.meteo-page .legende-item.inactif {opacity: 0.4;text-decoration: line-through;}
.meteo-page .legende-puce {width: 12px;height: 12px;border-radius: 3px;display: inline-block;}
/* meteo_tbl_rain */
.meteo-page .bg-rain-summary {background-color: #bae6fd !important;font-weight: bold;}
.meteo-page .bg-sec-summary {background-color: #fef08a !important;font-weight: bold;}
.meteo-page .bg-sec {background-color: #fefce8 !important;}
.meteo-page .bg-r01 {background-color: #f0f9ff !important;}
.meteo-page .bg-r1 {background-color: #e0f2fe !important;}
.meteo-page .bg-r5 {background-color: #7dd3fc !important;}
.meteo-page .bg-r10 {background-color: #38bdf8 !important;color: #fff;}
.meteo-page .bg-r20 {background-color: #0284c7 !important;color: #fff;}
.meteo-page .bg-r30 {background-color: #0369a1 !important;color: #fff;}
.meteo-page .bg-rain-total {background-color: var(--color-page);}
/* Les cartes partagent leur apparence avec le reste du site. */
/* meteo_live : présentation extraite du HTML. */
.meteo-page .meteo-live-label {color: var(--color-muted);}
.meteo-page .meteo-live-extremes {display: flex;justify-content: space-between;margin-block: var(--space-section);text-align: center;border-bottom: 1px solid var(--color-border);padding-bottom: var(--space-section);}
.meteo-page .meteo-live-low {color: #007aff;}
.meteo-page .meteo-live-high {color: #ff3b30;}
.meteo-page .meteo-live-metrics {display: grid;grid-template-columns: 1fr 1fr;gap: var(--space-section);}
.meteo-page .meteo-live-accent {color: var(--color-accent);}
.meteo-page .meteo-live-detail {color: var(--color-text);}
/* meteo_graphiques : présentation extraite du HTML. */
.meteo-page .meteo-chart-dates {display: flex;flex-wrap: wrap;gap: 10px;align-items: center;justify-content: center;margin-bottom: 20px;}
.meteo-page .meteo-chart-filters {text-align:center;margin-bottom: 15px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.meteo-page .meteo-chart-divider {color: var(--color-border);}
.meteo-page .meteo-chart-summary {padding: 15px;border-radius: var(--radius-card);background: var(--color-surface-subtle);text-align: center;margin-top: 20px;}
.meteo-page .meteo-chart-comparison {display: flex;justify-content: space-around;gap: 15px;flex-wrap: wrap;}
.meteo-page .meteo-chart-station {border-right: 1px solid var(--color-border);padding-right: 15px;flex: 1;}
.meteo-page .meteo-chart-dz {margin: 0 0 8px 0;color: var(--color-accent-strong);}
.meteo-page .meteo-chart-stat {margin: 3px 0;}
.meteo-page .meteo-chart-station-secondary {flex: 1;}
.meteo-page .meteo-chart-er {margin: 0 0 8px 0;color: var(--meteo-station-ergue);}
.meteo-page .meteo-chart-single {display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: var(--space-section);}
.meteo-page .meteo-chart-stat-single {margin: 0;}
.meteo-page .meteo-chart-separator {width: 1px;height: 20px;background-color: var(--color-border);}
.meteo-page .meteo-chart-legend {margin-top:25px;}
/* meteo_records : présentation extraite du HTML. */
.meteo-page .meteo-record-label {opacity: 0.7;}
.meteo-page .meteo-record-date {opacity: 0.6;}
.meteo-page .meteo-record-high {color: #ff3b30;}
.meteo-page .meteo-record-low {color: #007aff;}
.meteo-page .meteo-live-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: var(--space-section); }
.meteo-page .meteo-live-grid > .card { margin: 0; }
.meteo-page .meteo-live-extremes { flex-wrap: wrap; gap: 12px; margin-block: var(--space-section); }