/* ==========================================================================
   AXEPTIO — Feuille de style des éléments personnalisés
   Les Jardins de Lully
   --------------------------------------------------------------------------
   Alignée sur variables.css (design system) : police Outfit, vert #153F25 /
   sable #C3AD8F, crème #F7F4EF, bordure #E7E1D6, boutons en pilule, tailles
   de texte fluides (--font-size-*). Se charge APRÈS les autres feuilles.
   Couvre : 1) liste dynamique des cookies · 2) blocage Google Maps ·
            3) lien / bouton « Gérer mes cookies ».
   NB : l'apparence du POP-UP Axeptio se règle dans l'admin Axeptio
   (Couleur et Style) — non concernée par ce fichier.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Bouton partagé (Maps + gestion des cookies) — style bouton du site (pilule)
   -------------------------------------------------------------------------- */
.axeptio-btn {
  display: inline-block;
  font-family: var(--font-heading);
  font-weight: var(--weight-medium);
  font-size: var(--font-size-base);
  letter-spacing: var(--tracking-base);
  line-height: 1.2;
  color: var(--color-on-primary);
  background: var(--color-primary);
  border: 0;
  border-radius: var(--border-radius-pill) !important; /* bat le radius par défaut des boutons Divi et un éventuel style inline */
  padding: 0.7em 1.6em;
  cursor: pointer;
  text-decoration: none;
  transition: opacity var(--transition-default);
}
.axeptio-btn:hover { opacity: 0.85; }

/* --------------------------------------------------------------------------
   1. Liste dynamique des cookies
   HTML : <div class="axeptio-cookies-list"></div>  (rempli par le script)
   Les titres h3 (catégorie, sable) et h4 (service, vert) héritent du thème.
   -------------------------------------------------------------------------- */
.axeptio-cookies-list {
  font-family: var(--font-body);
  color: var(--color-text);
}

/* Catégorie (une étape Axeptio) */
.axeptio-cookies-list .cookie-step { margin-bottom: var(--space-lg); }
.axeptio-cookies-list .cookie-step:last-child { margin-bottom: 0; }
.axeptio-cookies-list .cookie-step > h3 { margin: 0 0 var(--space-sm); }

/* Un service */
.axeptio-cookies-list .vendor {
  margin-bottom: var(--space-md);
}
.axeptio-cookies-list .vendor:last-child {
  margin-bottom: 0;
}
.axeptio-cookies-list .vendor h4 { margin: 0 0 var(--space-xs); }

/* Descriptions : alignées sur le corps de texte du site, tailles cohérentes.
   Sélecteur renforcé (p.classe) pour passer devant les règles de Divi. */
.axeptio-cookies-list .vendor p.shortDescription,
.axeptio-cookies-list .vendor p.longDescription {
  margin: 0 0 var(--space-xs);
  font-size: var(--font-size-base);
  font-weight: var(--weight-light);
  line-height: var(--leading-body);
  letter-spacing: var(--tracking-base);
}
.axeptio-cookies-list .vendor p.shortDescription { color: var(--color-text-muted); }
.axeptio-cookies-list .vendor p.longDescription  { color: var(--color-text); }

/* Lien vers la politique du fournisseur : petit lien vert souligné */
.axeptio-cookies-list .policyUrl {
  display: inline-block;
  margin-top: var(--space-xs);
  font-size: var(--font-size-sm);
  color: var(--color-primary);
  text-decoration: underline;
}
.axeptio-cookies-list .policyUrl:hover { opacity: 0.75; }

/* --------------------------------------------------------------------------
   2. Blocage Google Maps
   Placeholder : <div class="axeptio-map-placeholder" data-hide-on-vendor-consent="gmaps"> … </div>
   Iframe : garde son style="display:none" inline (le script la révèle).
   -------------------------------------------------------------------------- */
.axeptio-map-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  min-height: 450px;              /* = hauteur de la carte : évite le saut de mise en page */
  padding: var(--space-md);
  text-align: center;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius-md);
}
.axeptio-map-placeholder p {
  margin: 0;
  max-width: 42ch;
  font-size: var(--font-size-base);
  line-height: var(--leading-body);
  color: var(--color-text);
}

/* --------------------------------------------------------------------------
   3. Lien « Gérer mes cookies » (variante lien texte)
   Lien : <a class="axeptio-manage-link" …>   |   Bouton : <button class="axeptio-btn" …>
   -------------------------------------------------------------------------- */
.axeptio-manage-link {
  color: var(--color-primary);
  text-decoration: underline;
  cursor: pointer;
}
.axeptio-manage-link:hover { opacity: 0.75; }

/* --------------------------------------------------------------------------
   4. Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 600px) {
  .axeptio-map-placeholder { min-height: 320px; padding: var(--space-sm); }
}
