/*
 * Cartes des clubs, sous leurs deux formes :
 *   .carte-google · le cadre d'une carte Google (My Maps sur la page Clubs,
 *                   emplacement d'une salle sur la fiche d'un club) ;
 *   .carte-suisse · la carte interactive Leaflet sur fond swisstopo, servie
 *                   tant que le comité n'a pas renseigné de carte Google.
 * Polices et couleurs reprennent les jetons de style.css (--titre, --etiquette,
 * --vert-fonce, --filet) avec un repli en dur pour un usage hors site (test).
 */

/* Cadre d'une carte Google intégrée. Le rapport de forme évite le saut de
   mise en page pendant le chargement de l'iframe. */
.carte-google {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 420px;
  max-height: 720px;
  background: #eef2ef;
  border: 1px solid var(--filet, #BFD6C7);
  border-radius: 4px;
  overflow: hidden;
}

.carte-google iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Carte My Maps : le bandeau noir de Google (titre, partage) est repoussé
   hors du cadre, il ne reste que la carte. */
.carte-google--mymaps iframe {
  position: absolute;
  left: 0;
  top: -66px;
  height: calc(100% + 66px);
}

/* Cadre bas de la fiche d'un club : il tient dans la colonne latérale sans
   pousser le reste de la page. */
.carte-google--compacte {
  aspect-ratio: auto;
  min-height: 0;
  max-height: none;
  height: 320px;
}

.carte-google__lien {
  margin: 10px 0 0;
  font-size: 0.9rem;
}

@media (max-width: 700px) {
  .carte-google--compacte { height: 260px; }
}

.carte-suisse {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  min-height: 360px;
  max-height: 640px;
  background: #eef2ef;
  border: 1px solid var(--filet, #BFD6C7);
  border-radius: 10px;
  overflow: hidden;
  font-family: var(--texte, "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif);
}

.carte-suisse__chargement {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  color: #4b5f56;
  font-size: 0.95rem;
  background: #eef2ef;
}

.carte-suisse__erreur {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 16px;
  text-align: center;
  color: #4b5f56;
  background: #eef2ef;
}

.carte-suisse__erreur a {
  color: var(--vert-fonce, #124A31);
  font-weight: 600;
}

.carte-suisse .leaflet-container {
  width: 100%;
  height: 100%;
  font-family: var(--texte, "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif);
  background: #eef2ef;
}

/* Marqueur club : pastille ronde vert profond, bord blanc cassé, logo ou
   initiales au centre. */
.marqueur-club {
  display: flex;
  align-items: center;
  justify-content: center;
}

.marqueur-club__pastille {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--vert-fonce, #124A31);
  border: 2px solid #f7f5ef;
  box-shadow: 0 1px 4px rgba(18, 74, 49, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f7f5ef;
  font-family: var(--etiquette, "Barlow Condensed", "Arial Narrow", Arial, sans-serif);
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  transition: transform 0.25s cubic-bezier(.16, 1, .3, 1), box-shadow 0.25s cubic-bezier(.16, 1, .3, 1);
  cursor: pointer;
}

.marqueur-club:hover .marqueur-club__pastille,
.marqueur-club:focus-visible .marqueur-club__pastille {
  transform: scale(1.12);
  box-shadow: 0 2px 8px rgba(18, 74, 49, 0.45);
}

.marqueur-club__pastille img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: contain;
  background: #f7f5ef;
}

/* Contrôle « Recentrer sur le canton », posé comme un contrôle Leaflet
   personnalisé en haut à droite. */
.carte-suisse__recentrer {
  background: #f7f5ef;
  border: 1px solid var(--filet, #BFD6C7);
  border-radius: 6px;
  padding: 6px 10px;
  font-family: var(--etiquette, "Barlow Condensed", "Arial Narrow", Arial, sans-serif);
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--vert-fonce, #124A31);
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

.carte-suisse__recentrer:hover,
.carte-suisse__recentrer:focus-visible {
  background: var(--vert-fonce, #124A31);
  color: #f7f5ef;
}

/* Popup club : logo, nom, localité, adresse, publics. */
.leaflet-popup-content-wrapper {
  border-radius: 8px;
  border: 1px solid var(--filet, #BFD6C7);
}

.leaflet-popup-content {
  font-family: var(--texte, "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif);
  color: #1c2b24;
  margin: 12px 14px;
}

.popup-club {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 180px;
}

.popup-club__entete {
  display: flex;
  align-items: center;
  gap: 8px;
}

.popup-club__logo {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: contain;
  background: #f7f5ef;
  border: 1px solid var(--filet, #BFD6C7);
  flex: none;
}

/* Spécificité volontairement doublée (deux classes) : leaflet.css impose
   `.leaflet-container a { color: #0078A8; }`, plus spécifique qu'une seule
   classe, sur tous les liens des popups. */
.popup-club .popup-club__nom {
  font-weight: 700;
  color: var(--vert-fonce, #124A31);
  text-decoration: none;
  font-size: 1rem;
}

.popup-club .popup-club__nom:hover {
  text-decoration: underline;
}

.popup-club__localite,
.popup-club__adresse {
  margin: 0;
  font-size: 0.85rem;
  color: #4b5f56;
}

.popup-club__publics {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}

.popup-club__badge {
  background: #eef2ef;
  border: 1px solid var(--filet, #BFD6C7);
  color: var(--vert-fonce, #124A31);
  border-radius: 999px;
  padding: 2px 9px;
  font-size: 0.72rem;
  font-family: var(--etiquette, "Barlow Condensed", "Arial Narrow", Arial, sans-serif);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.carte-suisse__aide {
  margin: 10px 0 0;
  font-size: 0.85rem;
  color: #4b5f56;
}

/* Ligne unique sous la carte Google : le renvoi à la protection des données,
   volontairement discret. */
.carte-suisse__mention {
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: #4b5f56;
}

.carte-suisse__liste-secours {
  margin: 10px 0;
  padding-left: 20px;
}

@media (prefers-reduced-motion: reduce) {
  .marqueur-club__pastille {
    transition: none;
  }
  .marqueur-club:hover .marqueur-club__pastille,
  .marqueur-club:focus-visible .marqueur-club__pastille {
    transform: none;
  }
}

/* Carte compacte de la fiche d'un club : hauteur fixe, sans rapport de
   forme, pour tenir dans la colonne latérale sans pousser la page. */
.carte-suisse--compacte {
  aspect-ratio: auto;
  min-height: 0;
  max-height: none;
  height: 320px;
}

@media (max-width: 700px) {
  .carte-suisse--compacte { height: 260px; }
}
