/* Compléments pour la page de suivi de livraison (chargé après style.css). */

/* Formulaire d'entrée : un seul grand champ, impossible à rater */
.suivi-etroit { max-width: 640px; margin: 0 auto; }
.champ-suivi input {
  font-size: 1.35rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.9rem 1rem;
  width: 100%;
}
.champ-suivi .btn-grand { width: 100%; }
.suivi-erreur { margin: 1rem 0; }

/* Marqueurs emoji de la carte (L.divIcon, aucune image externe) */
.suivi-emoji {
  background: none;
  border: none;
  font-size: 26px;
  line-height: 34px;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.45);
}

/* Légende sous la carte */
.suivi-legende {
  font-family: var(--mono, monospace);
  font-size: 0.88rem;
  color: color-mix(in srgb, var(--creme) 75%, transparent);
  margin-top: 0.6rem;
}

/* Deux colonnes : étapes à gauche, SMS + température à droite */
.suivi-colonnes {
  display: grid;
  gap: 2rem 3rem;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  align-items: start;
}
.suivi-colonnes h2 { margin-bottom: 0.8rem; }

/* Bandeau « les SMS sont simulés » */
.suivi-note {
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--creme) 60%, transparent);
  border: 1px dashed color-mix(in srgb, var(--chene) 35%, transparent);
  border-radius: 8px;
  padding: 0.5rem 0.8rem;
  margin-bottom: 0.8rem;
}

.sms-fil { max-width: 560px; }

/* Encadré de la courbe de température */
.suivi-temp {
  background: var(--cave-2, #241a17);
  border: 1px solid color-mix(in srgb, var(--chene) 25%, transparent);
  border-radius: 10px;
  padding: 1rem 1.2rem 0.8rem;
}
.suivi-temp h3 { font-size: 1rem; margin-bottom: 0.6rem; }
.suivi-temp canvas { display: block; width: 100%; height: auto; }
.suivi-temp-note {
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--creme) 60%, transparent);
  margin-top: 0.4rem;
}

/* Le bandeau de données passe bien en colonne sur petit écran */
@media (max-width: 560px) {
  .suivi-bandeau { gap: 1rem 1.5rem; }
  .suivi-donnee strong { font-size: 1.15rem; }
  #carte-suivi { height: 320px; }
}