/* Carte partagée, habillage PUBLIC (onima.ch/carte et aperçu de la landing).

   Le composant de carte (static/js/onima-carte.js) et son vocabulaire de
   classes (.carte-*) viennent du portail : portal-carte.css reste la source
   de vérité et n'est JAMAIS modifié, pour que app.onima.ch/carte demeure
   identique au pixel près. Ce fichier n'ajoute que ce que la page publique
   n'a pas : la coquille de l'app connectée.

   Chargé APRÈS onima.css (tokens :root) et portal-carte.css.

   Deux gabarits :
     .carte-public   la page /carte, en dessous du page-hero
     .carte-embed    l'aperçu compact de la landing, sans barre de filtres */

/* ---- base de la barre de filtres (fournie par portal-app.css dans l'app) ---- */
.app-filters {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px 14px;
  margin-bottom: 18px;
}
.app-filters select {
  font: inherit;
  font-size: 14px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  min-width: 150px;
}

/* ---- page /carte : filtres, compteur, puis le corps deux colonnes ---- */
.carte-public {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.carte-public__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.carte-public__hint {
  margin: 0;
  font-size: 14px;
  color: var(--ink-soft);
}
/* La hauteur reprend celle de l'ancienne carte pleine page, pour que le
   passage au composant partagé ne change pas la stature de la page. */
.carte-public__body {
  height: clamp(480px, 68vh, 760px);
  min-height: 0;
}

/* ---- aperçu compact de la landing ---- */
.carte-embed {
  height: 520px;
  min-height: 0;
}

/* ---- bouton du projet choisi, variante verrouillée (visiteur anonyme) ----
   La phrase ne tient pas sur une ligne dans un panneau de 320px : le bouton
   prend toute la largeur et centre son texte au lieu de déborder. */
.carte-focus__cta--locked {
  align-self: stretch;
  text-align: center;
  line-height: 1.3;
}

/* ---- responsive : sous 920px le panneau devient un tiroir (règle du
       portail), les deux gabarits rendent donc la main sur la hauteur ---- */
@media (max-width: 920px) {
  .carte-public__body,
  .carte-embed { height: auto; }
  .app-filters { padding: 11px 12px; }
  /* Trente et une puces de filtre repousseraient la carte hors de l'écran :
     la barre devient une zone défilante, la carte reste à portée de pouce. */
  .carte-public .carte-filters {
    max-height: 190px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  /* L'aperçu de la landing n'est qu'une section parmi d'autres : il prend
     moins de hauteur que la page carte, qui elle est la destination. */
  .carte-embed .carte-mapwrap { height: 42vh; min-height: 260px; }
  .carte-embed .carte-side { max-height: 34vh; }
}

@media (max-width: 520px) {
  .app-filters { gap: 8px; padding: 10px 11px; }
  .app-filters select { min-width: 0; width: 100%; }
  .carte-public__head { gap: 8px; }
  .carte-public__hint { font-size: 13.5px; }
  /* Le tiroir garde la carte lisible sur un écran de téléphone. */
  .carte-mapwrap { min-height: 300px; }
  .carte-legend { left: 8px; bottom: 8px; max-width: calc(100% - 16px); }
}