/* ── OpenHome – Tarteaucitron custom styles ──────────────────────────────────
   Surcharge de tarteaucitron.css (v1.32.0).
   Variables CSS disponibles car main.css est chargé en amont.
   ──────────────────────────────────────────────────────────────────────────── */

/* ── Base ──────────────────────────────────────────────────────────────────── */
#tarteaucitronRoot * {
  font-family: var(--font-body) !important;
  box-sizing: border-box;
  line-height: 1.5;
}

/* ── Backdrop ──────────────────────────────────────────────────────────────── */
html body.tarteaucitron-modal-open div#tarteaucitronRoot::before {
  background: rgba(12, 31, 52, 0.55) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}

/* ── Panneau principal ─────────────────────────────────────────────────────── */
/* overflow:hidden retiré ici — il rognait le bouton Fermer positionné en absolu.
   Le fond blanc + border-radius suffisent à donner l'arrondi visuel. */
#tarteaucitron {
  border-radius: var(--radius-lg) !important;
  background: var(--color-bg) !important;
  box-shadow: 0 24px 80px rgba(12, 31, 52, 0.20) !important;
  max-width: 780px !important;
  width: calc(100% - 40px) !important;
  left: 50% !important;
  margin-left: 0 !important;
  transform: translateX(-50%) !important;
  top: 5% !important;
}

#tarteaucitron .tarteaucitronBorder {
  border: none !important;
  background: var(--color-bg) !important;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg) !important;
  overflow: hidden !important;
}

/* ── Bouton Fermer ─────────────────────────────────────────────────────────── */
#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronClosePanelCookie,
#tarteaucitron #tarteaucitronClosePanel {
  position: absolute !important;
  top: 10px !important;
  right: 12px !important;
  background: var(--color-bg-light) !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 6px 14px !important;
  width: auto !important;
  letter-spacing: 0.03em !important;
  border-radius: var(--radius-sm) !important;
  cursor: pointer !important;
  z-index: 10 !important;
}
#tarteaucitron #tarteaucitronClosePanel:hover {
  background: var(--color-border) !important;
  color: var(--color-dark) !important;
}

/* ── Titre ─────────────────────────────────────────────────────────────────── */
#tarteaucitronRoot .tarteaucitronH1 {
  font-family: var(--font-heading) !important;
  font-size: 1.9rem !important;
  font-weight: 500 !important;
  color: var(--color-dark) !important;
  margin: 28px 0 12px !important;
  letter-spacing: -0.01em !important;
}

/* ── Info (résumé sous le titre) ───────────────────────────────────────────── */
#tarteaucitron #tarteaucitronInfo {
  color: var(--color-muted) !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  padding: 0 24px 16px !important;
  max-width: none !important;
  position: static !important;
  display: block !important;
}

/* Détails de catégorie : affichage inline permanent.
   On neutralise le button catToggleBtn (non-fonctionnel sans showDetailsOnClick)
   et on supprime le + pour éviter toute confusion. */
#tarteaucitronRoot .catToggleBtn {
  cursor: default !important;
  pointer-events: none !important;
}
#tarteaucitronRoot .tarteaucitronPlus {
  display: none !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronDetails {
  display: block !important;
  position: static !important;
  color: var(--color-muted) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  max-width: none !important;
  padding: 2px 20px 14px !important;
  font-weight: 400 !important;
}

#tarteaucitron #tarteaucitronDisclaimer {
  color: var(--color-muted) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  width: 90% !important;
}

/* ── Lien politique confidentialité (dans le panneau) ──────────────────────── */
#tarteaucitron #tarteaucitronPrivacyUrl,
#tarteaucitron #tarteaucitronPrivacyUrlDialog {
  background: transparent !important;
  color: var(--color-primary) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-size: 13px !important;
  padding: 2px 0 !important;
  margin: 0 4px !important;
  border-radius: 0 !important;
  display: inline !important;
  box-shadow: none !important;
}

/* ── Ligne globale (Tout accepter / Tout refuser) ───────────────────────────── */
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine {
  background: var(--color-bg-light) !important;
  border: none !important;
  border-top: 1px solid var(--color-border) !important;
  border-bottom: 1px solid var(--color-border) !important;
  border-left: none !important;
  padding: 12px 20px !important;
  margin: 0 !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine:hover {
  background: var(--color-bg-light) !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName {
  margin-left: 0 !important;
}

/* ── Entêtes de catégories ─────────────────────────────────────────────────── */
#tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronTitle,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
#tarteaucitronRoot .asCatToggleBtn {
  background: transparent !important;
  color: var(--color-dark) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  padding: 18px 20px 6px !important;
  margin: 0 !important;
  width: auto !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronTitle + [id^="tarteaucitronDetails"] {
  color: var(--color-muted) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  padding: 2px 20px 14px !important;
  background: var(--color-bg) !important;
  font-weight: 400 !important;
  margin: 0 !important;
  width: 100% !important;
}

/* ── Lignes de service ─────────────────────────────────────────────────────── */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine {
  background: var(--color-bg) !important;
  border-left: none !important;
  border-bottom: 1px solid var(--color-border) !important;
  padding: 14px 20px !important;
  overflow: hidden !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine:last-child {
  border-bottom: none !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine:hover {
  background: #fafaf9 !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsAllowed,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsDenied {
  border-left: none !important;
}

/* ── Nom / description du service ──────────────────────────────────────────── */
#tarteaucitronRoot .tarteaucitronH2 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--color-dark) !important;
  margin: 0 !important;
}
#tarteaucitron .tarteaucitronH3 {
  font-size: 14px !important;
  font-weight: 500 !important;
}
#tarteaucitron strong {
  font-size: 14px !important;
  font-weight: 600 !important;
}
.tarteaucitronName .tacCurrentStatus,
.tarteaucitronName .tarteaucitronReadmoreSeparator {
  color: var(--color-muted) !important;
  font-size: 12px !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName a {
  color: var(--color-muted) !important;
  font-size: 12px !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-weight: 400 !important;
}
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName a:hover {
  color: var(--color-primary) !important;
}

/* ── Boutons Autoriser / Interdire (par service) ────────────────────────────── */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk {
  margin: 4px 0 0 !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow,
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny,
.tac_activate .tarteaucitronAllow {
  border-radius: var(--radius-sm) !important;
  padding: 6px 14px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  border: 1.5px solid var(--color-border) !important;
}

/* Autoriser – non actif */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow {
  background: var(--color-bg) !important;
  color: var(--color-muted) !important;
}
/* Autoriser – actif */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsAllowed .tarteaucitronAllow,
#tarteaucitron #tarteaucitronServices #tarteaucitronServices_mandatory .tarteaucitronLine button.tarteaucitronAllow {
  background: var(--color-primary) !important;
  color: #fff !important;
  border-color: var(--color-primary) !important;
}
/* Autoriser – hover */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow:hover {
  background: var(--color-primary-light) !important;
  color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
}

/* Interdire – non actif */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny {
  background: var(--color-bg) !important;
  color: var(--color-muted) !important;
}
/* Interdire – actif */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine.tarteaucitronIsDenied .tarteaucitronDeny {
  background: var(--color-dark) !important;
  color: #fff !important;
  border-color: var(--color-dark) !important;
}
/* Interdire – hover */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny:hover {
  background: var(--color-bg-light) !important;
  color: var(--color-dark) !important;
  border-color: var(--color-dark) !important;
}

/* ── Boutons globaux dans la mainLine ───────────────────────────────────────── */
/* Même ordre que la bannière : "Tout refuser" gauche (outlined), "Tout accepter" droite (orange). */
/* Le conteneur doit être flex pour que order fonctionne (base = inline-block). */
#tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronAsk {
  display: flex !important;
  gap: 0.5rem !important;
}
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllDenied,
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllDenied2 {
  order: 1 !important;
  background: transparent !important;
  color: var(--color-dark) !important;
  border: 1.5px solid var(--color-dark) !important;
  border-radius: var(--radius-sm) !important;
  padding: 7px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllDenied:hover,
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllDenied2:hover {
  background: var(--color-dark) !important;
  color: #fff !important;
}

#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllAllowed,
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllAllowed2 {
  order: 2 !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  border: 1.5px solid var(--color-primary) !important;
  border-radius: var(--radius-sm) !important;
  padding: 7px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllAllowed:hover,
#tarteaucitronRoot #tarteaucitronServices #tarteaucitronAllAllowed2:hover {
  background: var(--color-primary-hover) !important;
  border-color: var(--color-primary-hover) !important;
}

/* État sélectionné des boutons globaux */
#tarteaucitron #tarteaucitronServices #tarteaucitronAllAllowed.tarteaucitronIsSelected,
#tarteaucitron #tarteaucitronServices #tarteaucitronAllAllowed2.tarteaucitronIsSelected {
  background: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  opacity: 1 !important;
  box-shadow: var(--shadow-sm) !important;
}
#tarteaucitron #tarteaucitronServices #tarteaucitronAllDenied.tarteaucitronIsSelected,
#tarteaucitron #tarteaucitronServices #tarteaucitronAllDenied2.tarteaucitronIsSelected {
  background: var(--color-dark) !important;
  color: #fff !important;
  border-color: var(--color-dark) !important;
  opacity: 1 !important;
}

/* ── Pied du panneau (Save) ─────────────────────────────────────────────────── */
html body #tarteaucitronRoot div#tarteaucitronSave {
  background: var(--color-bg-light) !important;
  border-top: 1px solid var(--color-border) !important;
  padding: 14px 20px !important;
}
html body #tarteaucitronRoot button#tarteaucitronSaveButton {
  background: var(--color-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  padding: 9px 24px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
}
html body #tarteaucitronRoot button#tarteaucitronSaveButton:hover {
  background: var(--color-primary-hover) !important;
}

/* ── Bannière initiale (bottom) ─────────────────────────────────────────────── */
#tarteaucitronRoot.tarteaucitronBeforeVisible #tarteaucitronAlertBig {
  display: flex !important;
}
#tarteaucitronRoot #tarteaucitronAlertBig {
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 0.5rem 1rem !important;
  box-sizing: border-box !important;
  background: var(--color-bg) !important;
  color: var(--color-text) !important;
  border-top: 1px solid var(--color-border) !important;
  box-shadow: 0 -4px 24px rgba(12, 31, 52, 0.08) !important;
  padding: 16px 32px !important;
}

#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  color: var(--color-text) !important;
  font-size: 14px !important;
}
#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong {
  color: var(--color-text) !important;
  font-size: 14px !important;
}

/* "Tout refuser" — outlined, à gauche */
#tarteaucitronAlertBig #tarteaucitronAllDenied2 {
  order: 1 !important;
  background: transparent !important;
  color: var(--color-dark) !important;
  border: 1.5px solid var(--color-dark) !important;
  border-radius: var(--radius-sm) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 9px 20px !important;
  margin: 0 !important;
  cursor: pointer !important;
}
#tarteaucitronAlertBig #tarteaucitronAllDenied2:hover {
  background: var(--color-dark) !important;
  color: #fff !important;
}

/* "Tout accepter" — orange, à droite */
#tarteaucitronAlertBig #tarteaucitronPersonalize2,
#tarteaucitronAlertBig #tarteaucitronPersonalize {
  order: 2 !important;
  background: var(--color-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius-sm) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 9px 20px !important;
  margin: 0 !important;
  cursor: pointer !important;
}
#tarteaucitronAlertBig #tarteaucitronPersonalize2:hover,
#tarteaucitronAlertBig #tarteaucitronPersonalize:hover {
  background: var(--color-primary-hover) !important;
}

/* "Personnaliser" — lien texte discret */
#tarteaucitronAlertBig #tarteaucitronCloseAlert {
  order: 3 !important;
  background: transparent !important;
  color: var(--color-muted) !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  padding: 9px 4px !important;
  margin: 0 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  cursor: pointer !important;
}
#tarteaucitronAlertBig #tarteaucitronCloseAlert:hover {
  color: var(--color-text) !important;
}

/* Lien confidentialité dans la bannière */
#tarteaucitronAlertBig #tarteaucitronPrivacyUrl,
#tarteaucitronAlertBig #tarteaucitronPrivacyUrlDialog {
  background: transparent !important;
  color: var(--color-muted) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-size: 13px !important;
  padding: 4px 8px !important;
  box-shadow: none !important;
}

/* ── Icônes d'état des boutons (☐/☑ unicode remplacés) ─────────────────────── */
/* État neutre : pas d'icône — le contour du bouton suffit */
#tarteaucitronRoot .tarteaucitronCheck::before,
#tarteaucitronRoot .tarteaucitronCross::before {
  content: '' !important;
  display: none !important;
}

/* Autorisé : ✓ blanc sur bouton orange */
#tarteaucitronRoot .tarteaucitronIsAllowed .tarteaucitronAllow .tarteaucitronCheck::before {
  content: '✓' !important;
  display: inline !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  margin-right: 5px !important;
  color: #fff !important;
}

/* Interdit : ✕ blanc sur bouton sombre */
#tarteaucitronRoot .tarteaucitronIsDenied .tarteaucitronDeny .tarteaucitronCross::before {
  content: '✕' !important;
  display: inline !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  margin-right: 5px !important;
  color: #fff !important;
}

/* Obligatoire : ✓ blanc (services non désactivables) */
#tarteaucitronRoot #tarteaucitronServices_mandatory .tarteaucitronCheck::before {
  content: '✓' !important;
  display: inline !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  margin-right: 5px !important;
  color: #fff !important;
}


/* ── Scrollbar du panneau ───────────────────────────────────────────────────── */
#tarteaucitronServices::-webkit-scrollbar { width: 4px; }
#tarteaucitronServices::-webkit-scrollbar-track { background: transparent; }
#tarteaucitronServices::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 4px;
}

/* ── Mobile ─────────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  /* Bannière initiale : position de base (barre mobile masquée) */
  #tarteaucitronRoot #tarteaucitronAlertBig {
    bottom: env(safe-area-inset-bottom, 0px) !important;
    border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 16px !important;
    gap: 0.625rem !important;
  }

  /* Bannière décalée au-dessus de la barre quand elle est visible */
  body:has(#oh-mobile-bar:not([hidden])) #tarteaucitronRoot #tarteaucitronAlertBig {
    bottom: calc(65px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Texte : flex-basis auto en colonne pour qu'il prenne sa hauteur naturelle */
  #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert {
    flex: 0 0 auto !important;
    min-width: unset !important;
  }

  /* Sur mobile : "Tout accepter" d'abord (orange, plus visible) */
  #tarteaucitronAlertBig #tarteaucitronPersonalize2,
  #tarteaucitronAlertBig #tarteaucitronPersonalize { order: 1 !important; text-align: center !important; }

  #tarteaucitronAlertBig #tarteaucitronAllDenied2  { order: 2 !important; text-align: center !important; }
  #tarteaucitronAlertBig #tarteaucitronCloseAlert  { order: 3 !important; text-align: center !important; }

  /* Panneau Personnaliser : plein écran entre le haut et la barre mobile */
  #tarteaucitron {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: calc(65px + env(safe-area-inset-bottom, 0px)) !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    transform: none !important;
    border-radius: 0 !important;
    overflow-y: auto !important;
  }
}