/* Bannière de consentement — partagée par l'entonnoir et les deux guides (src/partials/consentement.html).
   Feuille AUTONOME : l'entonnoir (Tailwind, préfixe mob:, CSS incorporée par page) et les guides (tokens
   --mobela-*) ne partagent aucune feuille, alors les couleurs de design.md sont écrites en dur ici.
   Dalle charbon dans les deux thèmes (elle reste lisible sur les pages claires des guides), rayon 0,
   filet bronze, jamais d'ombre portée. Servie à la racine du site : /suivi.css. */
.mob-consent {
  position: fixed;
  z-index: 90; /* sous les <dialog> (top layer), au-dessus du contenu; le lien d'évitement est à 100 */
  left: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 24px 20px calc(24px + env(safe-area-inset-bottom, 0px));
  background: #312a2d;
  color: #eae8e1;
  border-top: 1px solid #a59b7e;
  font: 400 15px/1.5 "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.mob-consent[hidden] {
  display: none;
}
.mob-consent * {
  box-sizing: border-box;
}
.mob-consent__titre {
  margin: 0 0 8px;
  font: 500 12px/1.4 Poppins, "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #cfc9ba;
}
.mob-consent__texte {
  margin: 0 0 16px;
  max-width: 62ch;
}
.mob-consent__texte[hidden] {
  display: none;
}
.mob-consent__texte a {
  color: #eae8e1;
  text-decoration: underline;
  text-underline-offset: 0.16em;
}
.mob-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.mob-consent__btn {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  min-height: 48px;
  padding: 14px 28px;
  border: 1px solid #eae8e1;
  border-radius: 0;
  background: transparent;
  color: #eae8e1;
  font: 500 15px/1 Poppins, "Helvetica Neue", Helvetica, Arial, sans-serif;
  cursor: pointer;
  transition: background-color 200ms ease, border-color 200ms ease;
}
.mob-consent__btn:hover {
  background: rgba(234, 232, 225, 0.1);
}
.mob-consent__btn--primaire {
  background: #44646f;
  border-color: #44646f;
}
.mob-consent__btn--primaire:hover {
  background: #4e727e;
  border-color: #4e727e;
}
.mob-consent__btn:focus-visible {
  outline: 2px solid #57818e;
  outline-offset: 2px;
}
@media (min-width: 720px) {
  .mob-consent {
    left: 24px;
    right: auto;
    bottom: 24px;
    max-width: 480px;
    padding: 28px;
    border: 1px solid #a59b7e;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mob-consent__btn {
    transition: none;
  }
}
