/* ==========================================================================
   Bandeau de consentement aux traceurs.

   Porté depuis la landing B2B (www/b2b, section 20 de son style.css) : même
   dessin, mêmes règles de conformité, tokens transposés sur ceux d'ici. La
   correspondance est exacte, les deux pages partagent la charte —
   rose-01 = --c-blush, rose-02 = --c-pink-soft, rose-03 = --c-magenta,
   violet = --c-navy.

   Tout ce qui touche au consentement vit dans ce seul fichier, `.btn--ghost`
   compris : la variante n'existe que pour « Personnaliser ». Le jour où le
   bandeau change de nature, il se retire d'un bloc.
   ========================================================================== */

/* Le bandeau ne bloque pas la page : rien n'oblige à consentir pour lire, et un
   voile modal ferait mur de cookies. Il ne se referme pas non plus tout seul —
   seul un choix explicite le fait disparaître. */
.cookies {
  position: fixed;
  inset: auto 0 0;
  /* Au-dessus de la barre d'appel collante (z-index 50), sous la modale de
     devis, qui est un <dialog> et vit dans sa propre couche. */
  z-index: 500;
  padding: clamp(12px, 1.5vw, 20px);
  padding-bottom: calc(clamp(12px, 1.5vw, 20px) + env(safe-area-inset-bottom, 0px));
}

.cookies[hidden] { display: none; }

.cookies__panel {
  width: min(1296px, 100%);
  max-height: 80dvh;
  margin-inline: auto;
  padding: clamp(20px, 2vw, 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
  border-radius: 20px;
  background: var(--c-white);
  box-shadow: 0 -4px 32px rgb(34 23 91 / .22);
}

.cookies__title {
  margin: 0;
  color: var(--c-magenta);
  font-size: clamp(22px, 1.56vw, 30px);
  font-weight: var(--fw-black);
  line-height: 1.33;
}

.cookies__intro {
  margin: 10px 0 0;
  color: var(--c-navy);
  font-size: clamp(16px, .94vw, 18px);
  line-height: 1.56;
}

.cookies__intro a { color: var(--c-magenta); text-decoration: underline; }

.cookies__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-block-start: clamp(16px, 1.5vw, 24px);
}

.cookies__actions--prefs { margin-block-start: 20px; }

/* « Tout refuser » et « Tout accepter » partagent strictement le même bouton :
   même taille, même couleur, même rang. Refuser ne doit coûter ni un clic ni un
   regard de plus qu'accepter (délibération CNIL n° 2020-091). */
.cookies__btn { flex: 1 1 200px; }

/* « Personnaliser » n'est pas une action de moindre importance, mais elle ouvre
   un panneau au lieu de trancher : le contour la distingue sans la diminuer. */
.btn--ghost {
  background: transparent;
  color: var(--c-navy);
  box-shadow: inset 0 0 0 2px var(--c-navy);
}

.btn--ghost:hover { background: var(--c-blush); }

.cookies__prefs { margin-block-start: clamp(16px, 1.5vw, 24px); }

.cookies__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 16px 0 0;
  border-block-start: 1px solid var(--c-blush);
  list-style: none;
}

.cookie-cat__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.cookie-cat__name {
  color: var(--c-navy);
  font-size: clamp(16px, .94vw, 18px);
  font-weight: var(--fw-semibold);
  line-height: 1.56;
  cursor: pointer;
}

.cookie-cat__always {
  flex: none;
  color: var(--c-magenta);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semibold);
}

.cookie-cat__desc {
  margin: 4px 0 0;
  padding-inline-end: 68px;
  color: var(--c-navy);
  font-size: var(--fs-xs);
  line-height: 1.54;
}

/* Interrupteur dessiné : la case native ne dit pas assez clairement « éteint »,
   or c'est l'état de départ et il doit se lire sans hésitation. */
.cookie-cat__switch {
  appearance: none;
  flex: none;
  position: relative;
  width: 52px;
  height: 28px;
  margin: 0;
  border-radius: var(--r-pill);
  background: var(--c-blush);
  box-shadow: inset 0 0 0 2px var(--c-pink-soft);
  cursor: pointer;
  transition: background-color .2s ease, box-shadow .2s ease;
}

.cookie-cat__switch::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--c-white);
  box-shadow: 0 1px 4px rgb(34 23 91 / .3);
  transition: transform .2s ease;
}

.cookie-cat__switch:checked {
  background: var(--c-magenta);
  box-shadow: inset 0 0 0 2px var(--c-magenta);
}

.cookie-cat__switch:checked::after { transform: translateX(24px); }

.cookie-cat__switch:focus-visible {
  outline: 2px solid var(--c-magenta);
  outline-offset: 3px;
}

/* Le lien de retrait, discret mais toujours présent au pied de page. Un accord
   doit se retirer aussi facilement qu'il se donne. */
.site-footer__consent {
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}