/* =====================================================================
   tarteaucitron — skin BELUGA (v4)
   Surcharge couleurs, typo, layout de la lib pour coller au design du
   site (cream, choco, terracotta).

   IMPORTANT — structure reelle de tarteaucitron 1.33 (verifiee en live) :
   - Le bandeau (#tarteaucitronAlertBig) et le panneau detaille
     (#tarteaucitron) sont 2 conteneurs SEPARES dans #tarteaucitronRoot.
   - Boutons du bandeau :
       "Tout accepter"  = button.tarteaucitronCTAButton.tarteaucitronAllow
       "Tout refuser"   = button.tarteaucitronCTAButton.tarteaucitronDeny
       "Personnaliser"  = button sans classe (id dynamique)
       "Politique..."   = #tarteaucitronPrivacyUrl
   - Les boutons CTA contiennent une icone native (span.tarteaucitronCheck
     / .tarteaucitronCross) qui rend un caractere casse : on la masque et
     on pose nos propres icones (Lucide) en ::before.
   - Le CSS de base cible par ID (forte specificite + !important), donc on
     prefixe nos selecteurs par #tarteaucitronRoot #tarteaucitronAlertBig
     et on garde !important pour gagner la cascade.
   ===================================================================== */

/* ---------- Icones (data-URI Lucide, MIT) -------------------------- */
:root {
  --tac-ic-check-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --tac-ic-x-choco: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233D2914' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
  --tac-ic-x-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
  --tac-ic-sliders-choco: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233D2914' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='21' x2='14' y1='4' y2='4'/%3E%3Cline x1='10' x2='3' y1='4' y2='4'/%3E%3Cline x1='21' x2='12' y1='12' y2='12'/%3E%3Cline x1='8' x2='3' y1='12' y2='12'/%3E%3Cline x1='21' x2='16' y1='20' y2='20'/%3E%3Cline x1='12' x2='3' y1='20' y2='20'/%3E%3Cline x1='14' x2='14' y1='2' y2='6'/%3E%3Cline x1='8' x2='8' y1='10' y2='14'/%3E%3Cline x1='16' x2='16' y1='18' y2='22'/%3E%3C/svg%3E");
  --tac-ic-check-green: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232E7D5B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --tac-ic-extlink: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23E26D5C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E");
}

#tarteaucitronRoot,
#tarteaucitronRoot * {
  font-family: var(--font-body), Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  box-sizing: border-box !important;
}

/* Masque les icones natives cassees (caractere "carre") des boutons CTA.
   On remet nos propres icones Lucide en ::before. */
#tarteaucitronRoot .tarteaucitronCheck,
#tarteaucitronRoot .tarteaucitronCross {
  display: none !important;
}

/* =====================================================================
   1. BANDEAU PRINCIPAL (#tarteaucitronAlertBig)
   ===================================================================== */
#tarteaucitronRoot #tarteaucitronAlertBig {
  /* display SANS !important : la specificite a 2 IDs suffit a battre le
     CSS de base au rendu, mais laisse tarteaucitron masquer le bandeau
     via son style inline "display:none" apres le choix utilisateur. */
  display: flex;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: clamp(10px, 0.6rem + 1vw, 18px) !important;
  background: var(--cream) !important;
  color: var(--choco) !important;
  border-top: 3px solid var(--terracotta) !important;
  border-radius: 0 !important;
  padding-top: clamp(14px, 0.6rem + 2vw, 26px) !important;
  padding-bottom: clamp(14px, 0.6rem + 2vw, 26px) !important;
  padding-left: max(clamp(14px, 0.4rem + 3vw, 40px), calc((100% - 1100px) / 2)) !important;
  padding-right: max(clamp(14px, 0.4rem + 3vw, 40px), calc((100% - 1100px) / 2)) !important;
  box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.12) !important;
  max-width: 100% !important;
  width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig::before {
  display: none !important; /* retire un eventuel pseudo decoratif du base */
}

/* Texte du disclaimer : pleine largeur, plus petit, jamais tronque */
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert {
  flex: 1 1 100% !important;
  display: block !important;
  color: var(--choco) !important;
  font-size: clamp(0.78rem, 0.74rem + 0.3vw, 0.9rem) !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong {
  color: var(--choco) !important;
  font-weight: 700 !important;
}

/* ----- "Tout accepter" : gros bouton plein principal --------------- */
#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronAllow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5em !important;
  background: var(--terracotta) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: clamp(0.95rem, 0.88rem + 0.4vw, 1.1rem) !important;
  line-height: 1.1 !important;
  padding: clamp(12px, 0.6rem + 0.8vw, 16px) clamp(22px, 1rem + 2.5vw, 40px) !important;
  margin: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: var(--shadow) !important;
  transition: background var(--t-base) var(--ease), transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease) !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronAllow::before {
  content: "" !important;
  display: inline-block !important;
  width: 1.15em !important;
  height: 1.15em !important;
  flex-shrink: 0 !important;
  background-image: var(--tac-ic-check-white) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronAllow:hover {
  background: var(--choco) !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--shadow-hover) !important;
}

/* ----- "Tout refuser" : lien texte (pas un bouton), lisible -------- */
#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronDeny {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4em !important;
  background: transparent !important;
  color: var(--choco) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  font-size: clamp(0.88rem, 0.82rem + 0.3vw, 1rem) !important;
  line-height: 1.2 !important;
  padding: clamp(8px, 0.4rem + 0.4vw, 12px) 4px !important;
  margin: 0 !important;
  text-transform: none !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 1.5px !important;
  cursor: pointer !important;
  transition: color var(--t-base) var(--ease) !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronDeny::before {
  content: "" !important;
  display: inline-block !important;
  width: 1em !important;
  height: 1em !important;
  flex-shrink: 0 !important;
  background-image: var(--tac-ic-x-choco) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronDeny:hover {
  color: var(--terracotta) !important;
  text-decoration-thickness: 2px !important;
}

/* ----- "Personnaliser" : meme tete que refuser (lien texte) -------- */
#tarteaucitronRoot #tarteaucitronAlertBig button:not(.tarteaucitronCTAButton):not(#tarteaucitronPrivacyUrl) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4em !important;
  background: transparent !important;
  color: var(--choco) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  font-size: clamp(0.88rem, 0.82rem + 0.3vw, 1rem) !important;
  line-height: 1.2 !important;
  padding: clamp(8px, 0.4rem + 0.4vw, 12px) 4px !important;
  margin: 0 !important;
  text-transform: none !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 1.5px !important;
  cursor: pointer !important;
  transition: color var(--t-base) var(--ease) !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig button:not(.tarteaucitronCTAButton):not(#tarteaucitronPrivacyUrl)::before {
  content: "" !important;
  display: inline-block !important;
  width: 1.05em !important;
  height: 1.05em !important;
  flex-shrink: 0 !important;
  background-image: var(--tac-ic-sliders-choco) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig button:not(.tarteaucitronCTAButton):not(#tarteaucitronPrivacyUrl):hover {
  color: var(--terracotta) !important;
}

/* ----- "Politique de confidentialite" : lien terracotta ------------ */
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl {
  background: transparent !important;
  color: var(--terracotta) !important;
  border: 0 !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  font-size: clamp(0.82rem, 0.78rem + 0.25vw, 0.92rem) !important;
  padding: clamp(8px, 0.4rem + 0.4vw, 12px) 4px !important;
  margin: 0 !important;
  text-transform: none !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  cursor: pointer !important;
}

#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl:hover {
  color: var(--choco) !important;
}

/* =====================================================================
   2. ICONE FLOTTANTE DE RE-OUVERTURE
   ===================================================================== */
#tarteaucitronRoot #tarteaucitronIcon {
  z-index: 9999 !important;
}

#tarteaucitronRoot #tarteaucitronManager {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4em !important;
  background: var(--terracotta) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-weight: 600 !important;
  font-size: clamp(0.72rem, 0.68rem + 0.2vw, 0.82rem) !important;
  padding: clamp(7px, 0.4rem + 0.3vw, 10px) clamp(11px, 0.6rem + 0.5vw, 15px) !important;
  border: 0 !important;
  box-shadow: var(--shadow) !important;
  cursor: pointer !important;
  transition: background var(--t-base) var(--ease) !important;
}

#tarteaucitronRoot #tarteaucitronManager:hover {
  background: var(--choco) !important;
}

/* =====================================================================
   3. PANNEAU DE CONFIGURATION DETAILLE (#tarteaucitron, conteneur a part)
   ===================================================================== */
#tarteaucitron {
  background: var(--cream) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-hover) !important;
  max-width: min(92vw, 680px) !important;
}

#tarteaucitron .tarteaucitronH1,
#tarteaucitron #tarteaucitronServices .tarteaucitronTitle button {
  color: var(--choco) !important;
  font-weight: 800 !important;
  font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.3rem) !important;
  text-transform: none !important;
}

/* Bouton fermer : pastille ronde compacte avec une croix (le libelle
   texte est masque via font-size:0 pour eviter toute troncature). */
#tarteaucitron #tarteaucitronClosePanel {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  bottom: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  width: 38px !important;
  height: 38px !important;
  background: var(--choco) !important;
  color: transparent !important;
  border-radius: 999px !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-transform: none !important;
  border: 0 !important;
  cursor: pointer !important;
  overflow: hidden !important;
  z-index: 5 !important;
  transition: background var(--t-base) var(--ease) !important;
}

#tarteaucitron #tarteaucitronClosePanel:hover {
  background: var(--terracotta) !important;
}

#tarteaucitron #tarteaucitronClosePanel::before {
  content: "" !important;
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  background-image: var(--tac-ic-x-white) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#tarteaucitron #tarteaucitronInfo {
  background: var(--cream-warm) !important;
  color: var(--choco-soft) !important;
  border: 0 !important;
  border-radius: var(--radius-xs) !important;
  padding: clamp(10px, 0.6rem + 0.5vw, 16px) clamp(12px, 0.7rem + 0.5vw, 18px) !important;
  font-size: clamp(0.78rem, 0.74rem + 0.2vw, 0.88rem) !important;
  line-height: 1.5 !important;
}

#tarteaucitron #tarteaucitronServices {
  background: transparent !important;
}

#tarteaucitron .tarteaucitronLine {
  border-left: 4px solid var(--cream-warm) !important;
  background: var(--surface) !important;
  border-radius: 0 var(--radius-xs) var(--radius-xs) 0 !important;
  padding: clamp(10px, 0.6rem + 0.5vw, 16px) clamp(12px, 0.7rem + 0.5vw, 18px) !important;
  margin: 8px 0 !important;
}

#tarteaucitron .tarteaucitronLine.tarteaucitronIsAllowed {
  border-left-color: var(--terracotta) !important;
}

#tarteaucitron .tarteaucitronLine.tarteaucitronIsDenied {
  border-left-color: var(--choco-soft) !important;
}

#tarteaucitron .tarteaucitronName .tarteaucitronH3,
#tarteaucitron .tarteaucitronName .tarteaucitronH3 span {
  color: var(--choco) !important;
  font-weight: 700 !important;
  font-size: clamp(0.92rem, 0.86rem + 0.3vw, 1.05rem) !important;
}

#tarteaucitron .tarteaucitronListCookies {
  color: var(--choco-soft) !important;
  font-size: clamp(0.72rem, 0.68rem + 0.2vw, 0.82rem) !important;
}

/* Liens du panneau (En savoir plus, Voir le site officiel) */
#tarteaucitron .tarteaucitronName a,
#tarteaucitron .tarteaucitronReadmoreSeparator a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35em !important;
  color: var(--terracotta) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-size: clamp(0.74rem, 0.7rem + 0.2vw, 0.84rem) !important;
}

#tarteaucitron .tarteaucitronName a::after,
#tarteaucitron .tarteaucitronReadmoreSeparator a::after {
  content: "" !important;
  display: inline-block !important;
  width: 0.9em !important;
  height: 0.9em !important;
  background-image: var(--tac-ic-extlink) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  opacity: 0.85 !important;
}

/* Boutons "Autoriser" / "Interdire" par service (dans le panneau) */
#tarteaucitron .tarteaucitronAllow,
#tarteaucitron .tarteaucitronDeny {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4em !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: clamp(6px, 0.35rem + 0.3vw, 9px) clamp(12px, 0.6rem + 0.6vw, 18px) !important;
  font-weight: 600 !important;
  font-size: clamp(0.78rem, 0.74rem + 0.2vw, 0.88rem) !important;
  cursor: pointer !important;
  text-transform: none !important;
}

#tarteaucitron .tarteaucitronAllow {
  background: var(--terracotta) !important;
  color: #fff !important;
}

#tarteaucitron .tarteaucitronAllow:hover {
  background: var(--choco) !important;
}

#tarteaucitron .tarteaucitronAllow::before {
  content: "" !important;
  display: inline-block !important;
  width: 1em !important;
  height: 1em !important;
  background-image: var(--tac-ic-check-white) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#tarteaucitron .tarteaucitronDeny {
  background: var(--cream-warm) !important;
  color: var(--choco) !important;
  border: 1px solid var(--border) !important;
}

#tarteaucitron .tarteaucitronDeny:hover {
  background: var(--border) !important;
}

#tarteaucitron .tarteaucitronDeny::before {
  content: "" !important;
  display: inline-block !important;
  width: 1em !important;
  height: 1em !important;
  background-image: var(--tac-ic-x-choco) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

#tarteaucitron .tarteaucitronLine.tarteaucitronIsAllowed .tarteaucitronAllow {
  background: var(--open) !important;
}

#tarteaucitron .tarteaucitronLine.tarteaucitronIsDenied .tarteaucitronDeny {
  background: var(--closed) !important;
  color: #fff !important;
  border-color: var(--closed) !important;
}

#tarteaucitron .tarteaucitronLine.tarteaucitronIsDenied .tarteaucitronDeny::before {
  background-image: var(--tac-ic-x-white) !important;
}

/* =====================================================================
   4. RESPONSIVE
   ===================================================================== */

/* Mobile : "Tout accepter" pleine largeur, refuser/personnaliser sous le texte */
@media (max-width: 540px) {
  #tarteaucitronRoot #tarteaucitronAlertBig {
    justify-content: center !important;
  }
  #tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronAllow {
    width: 100% !important;
    order: 4 !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
  #tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton.tarteaucitronDeny {
    order: 3 !important;
  }
  #tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl {
    order: 5 !important;
    flex: 1 1 100% !important;
    text-align: center !important;
  }
  #tarteaucitron #tarteaucitronClosePanel {
    width: 100% !important;
    justify-content: center !important;
  }
}