/* =============================================================================
 * kfa_consent.css — M-LEGAL.9 (2026-09-29)
 * Bandeau de consentement aux cookies de mesure.
 * -----------------------------------------------------------------------------
 * ⚠️ TOUTES les classes sont préfixées `kfa-cc`. Bootstrap 3 est chargé sur
 *    chaque page et possède `.btn`, `.close`, `.alert`, `.container` : un nom
 *    générique ici se ferait repeindre par Bootstrap, ou repeindrait Bootstrap.
 *    Piège déjà payé sur le back-office.
 *
 * ⚠️ AUCUNE dépendance à Bootstrap : le bandeau doit s'afficher à l'identique
 *    sur les 15 vues du tunnel de réservation, dont certaines ne chargent pas
 *    les mêmes CSS que le reste du site.
 * ============================================================================= */

.kfa-cc {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 2147483000;      /* au-dessus des modales Bootstrap (1050) et des
                               widgets tiers, sans atteindre la valeur maximale */
  box-sizing: border-box;
  max-width: 1080px;
  margin: 0 auto;
  padding: 16px 18px;
  background: #ffffff;
  border: 1px solid #e0e2ee;
  border-radius: 12px;
  box-shadow: 0 -2px 6px rgba(20, 22, 46, .05), 0 14px 38px rgba(20, 22, 46, .16);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 16px;
}

/* Pas d'animation d'entrée au premier rendu : le bandeau doit être lisible
   immédiatement, y compris par un lecteur d'écran. */
.kfa-cc[hidden] { display: none !important; }

.kfa-cc * { box-sizing: border-box; }

.kfa-cc-corps {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  min-width: 0;
}

.kfa-cc-titre {
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #14162e;
}

.kfa-cc-txt {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: #555b7d;
}

.kfa-cc-txt a {
  color: #20285e;              /* navy de la charte */
  text-decoration: underline;
  text-underline-offset: 2px;
}
.kfa-cc-txt a:hover { color: #3a4691; }

.kfa-cc-actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  gap: 9px;
}

/* ⚖️ REFUSER DOIT ÊTRE AUSSI ACCESSIBLE QU'ACCEPTER.
   Même police, même taille, même graisse, même hauteur, même niveau visuel —
   seule la couleur de fond distingue les deux. Un « Refuser » en lien discret
   ou en gris pâle est précisément ce que la CNIL sanctionne. Ne pas « améliorer
   la conversion » en déséquilibrant ces deux boutons. */
.kfa-cc-btn {
  margin: 0;
  padding: 11px 20px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background-color .14s ease;
}
.kfa-cc-btn:focus-visible { outline: 2px solid #f15e61; outline-offset: 2px; }
.kfa-cc-btn:focus { outline: 2px solid #f15e61; outline-offset: 2px; }

.kfa-cc-oui { background: #20285e; color: #ffffff; }
.kfa-cc-oui:hover { background: #2b3577; }

.kfa-cc-non { background: #eef0f7; color: #14162e; border-color: #e0e2ee; }
.kfa-cc-non:hover { background: #e3e6f0; }

/* Téléphone : le bandeau passe en colonne et les deux boutons occupent la
   même largeur — l'équivalence accepter/refuser doit tenir à toutes les tailles. */
@media (max-width: 640px) {
  .kfa-cc {
    left: 8px;
    right: 8px;
    bottom: 8px;
    padding: 14px 15px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 13px;
  }
  .kfa-cc-actions { width: 100%; }
  .kfa-cc-btn { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }
}

/* Le lien de retrait, dans le pied de page. Discret mais toujours atteignable :
   le retrait du consentement doit rester possible à tout moment. */
.kfa-cc-gerer {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}