/* --- NETTOYAGE DES MARGES --- */
.meteo-resume p {
    margin: 0;
    padding: 0;
}

.meteo-resume {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center; /* Centrage général pour tout le bloc */
    text-align: center;  /* Sécurité pour le texte */
}

.meteo-resume.full {
    align-items: center;
}

.meteo-resume.light {
    flex-direction: row; /* Aligné horizontalement pour le menu */
    align-items: center;
    gap: 10px;
}
.meteo-resume.light .meteo-main img { width: 40px; height: 40px; }
.meteo-resume.light .meteo-temp { font-size: 1.5rem; font-weight: bold; }

/* Centrage de la localisation */
.meteo-location {
    text-align: center;
    width: 100%;
    margin: 5px 0 !important;
}

.meteo-date {
    font-size: 1.2em;
    text-align: center;
}

/* --- ZONE SOLEIL --- */
.meteo-sun {
    display: flex;
    flex-direction: row; /* Force l'alignement horizontal */
    justify-content: center; /* Centre les deux groupes */
    gap: 15px; /* Réduit un peu le gap pour laisser plus de place */
    font-size: 0.9em; /* Légère réduction pour assurer la tenue sur une ligne */
    white-space: nowrap; /* Empêche le retour à la ligne du texte "Lever/Coucher" */
    width: 100%;
}

.sun-group {
    display: flex;
    align-items: center;
    gap: 5px;
}

.sun-icon {
    display: inline-flex;
    align-items: center;
}

.sun-icon svg {
    width: 25px;
    height: 25px;
}

/* --- TEMPÉRATURE XXL --- */
.meteo-main {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 5px;
}

.meteo-temp {
    font-size: 4em;
    line-height: 1;
}

.meteo-main img {
    width: 60px;
    height: 60px;
}

/* --- TABLEAU PRÉVISIONS --- */
.meteo-previsions-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.meteo-previsions-table th, 
.meteo-previsions-table td {
    text-align: center;
    padding: 6px 2px;
    font-size: 0.85em;
    vertical-align: middle;
}

/* Icônes d'en-tête */
.header-icon svg {
    width: 22px;
    height: 22px;
    display: inline-block;
    color: #4D4D4C;
    fill: currentColor;
    vertical-align: middle;
}

/* Ligne de séparation des jours */
.date-header {
    background-color: #f4f4f4;
    text-align: left !important;
}

.date-header td {
    padding: 8px 10px !important;
    font-size: 0.9em;
    color: #333;
    font-weight: bold;
}

/* Largeurs spécifiques colonnes */
.meteo-previsions-table th:nth-child(2), 
.meteo-previsions-table td:nth-child(2) {
    width: 35px;
}

.temp-negative {
    color: #0073aa; 
    font-weight: 600;
}



/* --- BOUTON TOGGLE (Style texte, aligné droite) --- */
.meteo-actions {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}

#toggle-meteo-btn {
    background: none !important;
    border: none !important;
    color: var(--wp--preset--color--accent-5);
    cursor: pointer;
    font-size: 0.9em;
    font-weight: 500;
    padding: 5px 0;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: color 0.2s;
}

#toggle-meteo-btn:hover {
    color: var(--wp--preset--color--accent-2);
}

#arrow { font-size: 0.8em; }

/* Masquer les lignes horaires par défaut */
.hourly-row {
    display: none;
}

/* --- FOOTER NOTE --- */
.meteo-footer-note {
    margin-top: 20px;
    padding: 15px;
    border-top: 1px solid #ddd;
    font-size: 0.85em; 
    color: #666;
    line-height: 1.4;
    text-align: justify;
}

.meteo-footer-note strong {
    display: inline;
    font-weight: bold;
    color: #333;
}

.meteo-footer-note .title-strong {
    display: block;
    margin-bottom: 5px;
}

/* --- TABLEAU PRÉVISIONS --- */

.meteo-previsions-table tr.current-row {
    display: table-row !important;
    background-color: #e8f4fd !important; /* Surlignage bleu léger */
}

/* 1. Par défaut, on masque les lignes horaires UNIQUEMENT si elles appartiennent à aujourd'hui */
.meteo-previsions-table .today-row.hourly-row {
    display: none;
}

/* 2. La ligne actuelle est toujours visible */
.meteo-previsions-table .current-row {
    display: table-row !important;
}

/* 3. Les lignes des jours futurs (non today-row) sont affichées par défaut */
.meteo-previsions-table .future-row {
    display: table-row !important;
}

/* 4. Quand on active le mode détail, on affiche tout */
.meteo-previsions-table.show-details .hourly-row {
    display: table-row !important;
}

/* Les lignes clés (00h, 06h, 12h, 18h) sont TOUJOURS visibles */
.meteo-previsions-table .key-row {
    display: table-row !important;
}

.meteo-previsions-table td:nth-child(5),
.meteo-previsions-table td:nth-child(6) {
    font-size: 0.85em;
}

.meteo-previsions-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.meteo-previsions-table th, .meteo-previsions-table td { text-align: center; padding: 6px 2px; font-size: 0.85em; vertical-align: middle; }
.header-icon svg { width: 30px; height: 30px; display: inline-block; color: #4D4D4C; fill: currentColor; vertical-align: middle; }
.date-header { background-color: #f4f4f4; text-align: left !important; }
.date-header td { padding: 8px 10px !important; font-size: 0.9em; color: #333; font-weight: bold; }
.meteo-previsions-table th:nth-child(2), .meteo-previsions-table td:nth-child(2) { width: 35px; }

/* --- TABLEAU TENDANCES (Global) --- */
.meteo-tendances-wrapper { overflow-x: auto; width: 100%; margin: 20px 0; }

.meteo-tendances { 
    border-collapse: collapse !important; 
    width: 100%; 
    table-layout: fixed; 
}

/* 1. TOUTE LA COLONNE STICKY (En-tête + Corps) */
.th-sticky, .sticky-col {
    width: 160px !important; 
    min-width: 160px !important;
    position: sticky !important;
    left: 0 !important;
    z-index: 9 !important;
    background-color: #fff; 
    border-right: 2px solid #eee !important;
}

/* 2. CENTRAGE ET STYLE LIEN */
.sticky-col {
    vertical-align: middle !important;
    padding: 0 10px !important;
    height: 60px;
}

.sticky-col a {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.2;
    color: var(--wp--preset--color--accent-5) !important;
    font-weight: 500;
    font-size: 1rem;
}

.sticky-col a:hover {
    color: var(--wp--preset--color--accent-2) !important;
    text-decoration: none;
}

/* 3. EN-TÊTE LIEU */
.th-sticky {
    border-bottom: 2px solid #eee !important;
    text-align: center !important;
    vertical-align: middle !important;
}

/* 4. CELLULES JOURS */
.meteo-tendances th, .meteo-tendances td {
    width: 60px !important;
    text-align: center !important;
    padding: 5px !important;
    vertical-align: middle !important;
    border-bottom: 1px solid #eee !important;
}

.meteo-tendances thead th {
    font-size: 0.8em;
    vertical-align: bottom;
    border-bottom: 2px solid #eee !important;
}

.meteo-tendances .date-sub { font-weight: normal; color: #666; font-size: 0.9em; }

/* 5. ALTERNANCE (Grise la 1ère, 3ème ligne) */
.meteo-tendances tbody tr:nth-child(odd) { background-color: #f9f9f9; }
.meteo-tendances tbody tr:nth-child(odd) .sticky-col { background-color: #f9f9f9 !important; }

.meteo-tendances tbody tr:nth-child(even) { background-color: #fff; }
.meteo-tendances tbody tr:nth-child(even) .sticky-col { background-color: #fff !important; }

/* Styles valeurs */
.meteo-tendances .temp { font-weight: bold; font-size: 0.9em; }
.meteo-tendances .blue { color: #0073aa; }