/* ==================================================================
   MISE EN PAGE & DIVERS
   Regroupe : mise en page 2 colonnes, utilitaires de texte,
   animations blink, encadrés (PanneauMichelin, shadowbox), FAQ,
   effet de survol des titres/liens, carte Leaflet, bouton retour
   en haut de page.
   ================================================================== */

/* --- Bouton "retour en haut" --- */
#backtotop {
  bottom: 60px;
}

/* --- Mise en page 2 colonnes (région gauche / droite) --- */
.layout__region--first {
  float: left;
  width: 30%;
}
.layout__region--second > .group-right {
  float: left;
  width: 70%;
}
.field--name-description {
  margin-top: 0px;
}
.logo_localisation {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 60%;
}
.localisation_description {
  margin-left: 10px;
  margin-top: 0px;
  padding-top: 0;
  color: var(--couleur-texte-gris-clair);
}
@media screen and (max-width: 64em) { .localisation_description { font-size: 1.2em; } }
@media screen and (max-width: 50em) { .localisation_description { font-size: 1.1em; } }
@media screen and (max-width: 30em) { .localisation_description { font-size: 1em; } }

/* --- Image responsive (style "large") --- */
.image-style-large { width: 100%; }
@media screen and (max-width: 64em) { .image-style-large { width: 100%; } }
@media screen and (max-width: 50em) { .image-style-large { max-width: 400px; } }
@media screen and (max-width: 30em) { .image-style-large { max-width: 320px; } }

/* --- Carte Leaflet --- */
.leaflet-div-icon {
  background: #fff;
  border: 1px solid #666;
}

/* --- Utilitaires de texte --- */
.adresse-minuscule { text-transform: capitalize; }
.majuscule  { text-transform: uppercase; }
.minuscule  { text-transform: lowercase; }
.capitalise { text-transform: capitalize; }
.user-entity { text-transform: capitalize; }

/* --- Encadré adresse (fusion des deux déclarations d'origine) ---
   NB : dans le CSS d'origine, .address était déclaré deux fois ;
   la deuxième déclaration (sans :hover) écrasait la première en
   permanence. Fusionné ici en une seule règle + un vrai :hover. */
.address {
  font-family: 'Georgia', serif;
  font-size: 1.2em;
  line-height: 1.6;
  color: var(--couleur-texte-gris);
  margin-bottom: 1.5em;
  text-align: justify;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px;
  background-color: var(--fond-blanc-casse);
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.address:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transform: translateY(-5px);
}

/* --- Encadrés type panneau --- */
.PanneauMichelin {
  width: auto;
  padding: 5px;
  text-align: center;
  font-size: smaller;
  font-weight: 500;
  color: #000;
  background: var(--fond-gris-survol);
  border: 1px solid var(--couleur-principale-accent);
  border-radius: 7px;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
}

.shadowbox {
  width: 5em;
  border: 1px solid var(--couleur-texte-gris);
  box-shadow: 8px 8px 5px #444;
  padding: 5px;
  background-image: linear-gradient(180deg, #fff, #ddd 40%, #ccc);
}

/* --- Animations "clignotement" ---
   Une seule définition de @keyframes blink (le doublon opposé qui
   existait dans le CSS d'origine a été supprimé, voir README). */
.blink {
  animation: blinkMe 4s linear infinite;
}
@keyframes blinkMe {
  0%   { opacity: 0; }
  50%  { opacity: 1; }
  100% { opacity: 0; }
}

.blinkhome {
  animation: blink 2.5s step-start infinite;
}
@keyframes blink {
  0%   { opacity: 0; }
  50%  { opacity: 1; }
  100% { opacity: 0; }
}

/* --- Effet de soulignement animé sur les titres et liens de contenu --- */
.node__title a { position: relative; text-decoration: none; }
.node__title a::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 3px;
  border-radius: 3px;
  background-color: var(--couleur-principale-sombre);
  bottom: -1px;
  left: 0;
  transform-origin: center;
  transform: scaleX(0);
  transition: transform .5s ease-in-out;
}
.node__title a:hover::before { transform-origin: center; transform: scaleX(1); }

.node__content a { position: relative; text-decoration: none; }
.node__content a::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 3px;
  border-radius: 3px;
  background-color: var(--couleur-principale-sombre);
  bottom: -1px;
  left: 0;
  transform-origin: center;
  transform: scaleX(0);
  transition: transform .5s ease-in-out;
}
.node__content a:hover::before { transform-origin: center; transform: scaleX(1); }

/* --- FAQ (accordéon) --- */
.ui-accordion-header-active {
  background-color: var(--couleur-principale);
  border: 1px solid var(--couleur-principale-sombre);
  color: var(--couleur-texte-badge);
}

/* --- Divers widgets tiers --- */
.slider { text-align: center; top: 0px; }
.tarteaucitronIconBottomRight { bottom: 120px; }