/* ==========================================================================
   Bandeau de consentement aux témoins (cookies)

   Volontairement PAS un mur : une personne dont le sous-sol est inondé doit
   pouvoir voir le numéro de téléphone et appeler sans avoir à trancher une
   question de vie privée d'abord. Le bandeau se pose en bas à gauche, laisse
   la page utilisable, et n'obstrue pas la barre d'appel mobile.
   ========================================================================== */

.consentement {
  position: fixed;
  z-index: 120;
  left: var(--space-gutter);
  right: var(--space-gutter);
  bottom: var(--space-gutter);
  max-width: 27rem;
  background: var(--c-paper);
  color: var(--c-text);
  border-radius: var(--r-lg);
  border-top: 4px solid var(--c-accent);
  box-shadow: var(--shadow-lg);
  padding: clamp(1.15rem, 0.9rem + 1vw, 1.6rem);
  font-size: var(--text-sm);
  /* Masqué tant que le script n'a pas décidé s'il doit s'afficher : évite
     l'apparition-disparition chez les gens qui ont déjà répondu. */
  display: none;
}
.consentement[data-visible='true'] { display: block; }

/* Sur mobile, la barre d'appel occupe le bas de l'écran : on se pose au-dessus. */
@media (max-width: 939px) {
  .consentement { bottom: calc(var(--callbar-h) + 0.75rem); }
}

.consentement h2 {
  font-size: var(--text-lg);
  color: var(--c-navy);
  margin-bottom: 0.5rem;
}

.consentement p {
  color: var(--c-text-muted);
  line-height: 1.55;
  margin-bottom: 1rem;
}

.consentement a { color: var(--c-accent-deep); text-decoration: underline; text-underline-offset: 2px; }
.consentement a:hover { color: var(--c-navy); }

.consentement__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.consentement__actions .btn {
  flex: 1 1 auto;
  padding: 0.7rem 1rem;
  font-size: var(--text-sm);
}
/* « Personnaliser » est secondaire : pleine largeur en dessous des deux choix
   principaux, pour ne pas concurrencer la décision. */
.consentement__actions .btn--lien {
  flex-basis: 100%;
  --btn-bg: transparent;
  --btn-fg: var(--c-text-muted);
  border: none;
  text-decoration: underline;
  text-underline-offset: 3px;
  padding: 0.4rem;
}
.consentement__actions .btn--lien:hover {
  --btn-bg: transparent;
  --btn-fg: var(--c-navy);
  transform: none;
  box-shadow: none;
}

/* --- Panneau de réglages détaillés --- */
.consentement__reglages {
  display: none;
  margin: 0.25rem 0 1.15rem;
  padding-top: 1rem;
  border-top: 1px solid var(--c-line);
}
.consentement[data-reglages='true'] .consentement__reglages { display: block; }

.categorie {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.7rem 0;
}
.categorie + .categorie { border-top: 1px solid var(--c-line); }

.categorie input {
  margin-top: 2px;
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  accent-color: var(--c-accent);
}
.categorie input:disabled { opacity: 0.55; }

.categorie strong {
  display: block;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--c-navy);
  margin-bottom: 0.15rem;
}
.categorie span {
  display: block;
  font-size: var(--text-xs);
  color: var(--c-text-muted);
  line-height: 1.5;
}
.categorie em {
  font-style: normal;
  color: var(--c-accent-deep);
  font-weight: 600;
}

/* --- Lien de réouverture, dans le pied de page --- */
.lien-consentement {
  background: none;
  border: none;
  padding: 0;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.lien-consentement:hover { color: var(--c-accent-lift); }

@media (prefers-reduced-motion: no-preference) {
  .consentement[data-visible='true'] {
    animation: consentement-entree var(--dur-normal) var(--ease-out);
  }
  @keyframes consentement-entree {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: none; }
  }
}