/* ==========================================================================
   In Pulse - meteo.css
   La météo papier (app/meteo.html) : une fiche A4 à remplir À LA MAIN.
   À l'écran, la fiche suit les tokens (deux thèmes). À l'IMPRESSION, elle
   sort seule, en noir sur blanc LITTÉRAL — un utilisateur en thème sombre
   ne doit pas imprimer un fond nuit.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Écran
   -------------------------------------------------------------------------- */
.meteo-imprimer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--espace-sm);
  margin-top: var(--espace-lg);
}

.meteo-fiche {
  max-width: 50rem;
  margin-top: var(--espace-xl);
  padding: var(--espace-2xl);
  background-color: var(--couleur-surface);
  border: 1px solid var(--couleur-filet-fort);
  border-radius: var(--rayon-md);
  display: grid;
  gap: var(--espace-xl);
}

.meteo-fiche__entete {
  text-align: center;
  display: grid;
  gap: var(--espace-2xs);
  border-bottom: 1px solid var(--couleur-filet-fort);
  padding-bottom: var(--espace-lg);
}

.meteo-fiche__marque {
  font-family: var(--police-titre);
  font-weight: var(--graisse-demi);
  letter-spacing: 0.04em;
}

.meteo-fiche__titre {
  font-size: var(--taille-2xl);
}

.meteo-fiche__date {
  color: var(--couleur-texte-secondaire);
}

.meteo-fiche__ligne-courte {
  display: inline-block;
  width: 10rem;
  border-bottom: 1px solid var(--couleur-filet-fort);
  vertical-align: baseline;
}

.meteo-fiche__bloc h3 {
  font-size: var(--taille-md);
  margin-bottom: var(--espace-md);
}

.meteo-fiche__aide {
  font-size: var(--taille-xs);
  font-weight: var(--graisse-normale);
  color: var(--couleur-texte-discret);
  text-transform: none;
}

/* Case à cocher au stylo : un carré vide, bordure marquée. */
.meteo-fiche__case {
  display: inline-block;
  width: 1.1rem;
  height: 1.1rem;
  border: 1.5px solid var(--couleur-encre);
  border-radius: 2px;
  flex-shrink: 0;
}

.meteo-fiche__temps {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: var(--espace-md);
}

.meteo-fiche__temps li {
  display: flex;
  align-items: center;
  gap: var(--espace-xs);
  font-weight: var(--graisse-demi);
}

.meteo-fiche__temps svg {
  width: 1.6rem;
  height: 1.6rem;
  flex-shrink: 0;
}

.meteo-fiche__tableau {
  width: 100%;
  border-collapse: collapse;
}

.meteo-fiche__tableau th,
.meteo-fiche__tableau td {
  border: 1px solid var(--couleur-filet-fort);
  padding: var(--espace-sm);
  text-align: center;
  vertical-align: middle;
}

.meteo-fiche__tableau th[scope="row"] {
  text-align: left;
  font-weight: var(--graisse-demi);
}

.meteo-fiche__tableau thead th {
  font-size: var(--taille-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.meteo-fiche__question {
  font-weight: var(--graisse-demi);
  margin-bottom: var(--espace-xs);
}

.meteo-fiche__lignes {
  display: grid;
  gap: 1.5rem;
  margin-bottom: var(--espace-lg);
}

.meteo-fiche__lignes span {
  display: block;
  border-bottom: 1px solid var(--couleur-filet-fort);
  height: 0;
  padding-top: 1.1rem;
}

.meteo-fiche__pied {
  text-align: center;
  font-size: var(--taille-sm);
  color: var(--couleur-texte-secondaire);
  border-top: 1px solid var(--couleur-filet-fort);
  padding-top: var(--espace-lg);
}

/* --------------------------------------------------------------------------
   2. Impression : la fiche seule, noir sur blanc littéral (pas de tokens —
      le thème sombre ne doit jamais atteindre le papier).
   -------------------------------------------------------------------------- */
@page {
  size: A4;
  margin: 15mm;
}

@media print {
  .app-laterale,
  .app-entete,
  .app-pied,
  .meteo-explication {
    display: none !important;
  }

  body,
  .app-coquille,
  .app-contenu,
  .app-principal {
    display: block !important;
    background: #fff !important;
    color: #000 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .meteo-fiche {
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff !important;
    color: #000 !important;
    gap: 9mm;
  }

  .meteo-fiche * {
    color: #000 !important;
  }

  .meteo-fiche__entete,
  .meteo-fiche__pied {
    border-color: #000 !important;
  }

  .meteo-fiche__case,
  .meteo-fiche__tableau th,
  .meteo-fiche__tableau td,
  .meteo-fiche__lignes span,
  .meteo-fiche__ligne-courte {
    border-color: #000 !important;
  }
}
