/**
 * Tarteaucitron.js v3 — Custom Theme (réutilisable)
 * ──────────────────────────────────────────────────
 * Basé sur le thème Telebib2 par Assuralia.
 *
 * UTILISATION :
 * 1. Modifier les variables CSS ci-dessous pour adapter aux couleurs du site
 * 2. Charger ce fichier APRÈS les CSS par défaut de tarteaucitron
 *    <link rel="stylesheet" href="/path/to/tarteaucitron-custom.css">
 */

/* ══════════════════════════════════════════════════════════════
   VARIABLES — Modifier ici pour personnaliser le thème
   ══════════════════════════════════════════════════════════════ */
:root {
  /* --- Couleurs principales — overridables via le module Joomla (onglet Couleurs) --- */
  --tac-primary:        #3b3b3b;   /* Gris/brun foncé — boutons accepter, en-tête panel */
  --tac-primary-hover:  #2a2a2a;   /* Hover gris foncé */
  --tac-primary-shadow: rgba(59, 59, 59, 0.22);  /* Ombre du panel */
  --tac-primary-ring:   rgba(59, 59, 59, 0.25);  /* Ring focus/actif bouton accepter */

  --tac-accent:         #a0c145;   /* Vert clair — bouton enregistrer, état interdit */
  --tac-accent-hover:   #8aaa35;   /* Hover vert clair */
  --tac-accent-pale:    #eef7de;   /* Fond bouton interdit actif */
  --tac-accent-dark:    #4a5a1a;   /* Texte bouton interdit actif */
  --tac-accent-ring:    rgba(160, 193, 69, 0.3); /* Ring focus état interdit */

  --tac-info:           #a0c145;   /* Couleur info (scrollbar, bordure infobox) */

  /* --- Fonds et textes --- */
  --tac-dark:           #1E1E1E;   /* Noir profond — fond bandeau bas */
  --tac-bg:             #ffffff;   /* Fond du panel et des lignes */
  --tac-bg-alt:         #F5F7FA;   /* Fond alternatif (services obligatoires) */
  --tac-border:         #E5E9EE;   /* Bordures séparatrices */
  --tac-border-light:   #EFF2F5;   /* Bordures légères entre services */
  --tac-text:           #444444;   /* Gris foncé — corps de texte */
  --tac-text-muted:     #6B7280;   /* Texte secondaire */
  --tac-text-disabled:  #D1D5DB;   /* Bordures boutons inactifs */

  /* --- États --- */
  --tac-allowed-bg:     #eef7de;   /* Fond ligne autorisée (teinte verte) */
  --tac-denied-bg:      #F5F7FA;   /* Fond ligne interdite */

  /* --- Backdrop --- */
  --tac-backdrop:       rgba(30, 30, 30, 0.6);
  --tac-backdrop-blur:  3px;

  /* --- Dimensions --- */
  --tac-panel-width:    620px;
  --tac-panel-radius:   16px;
  --tac-panel-max-h:    82vh;
  --tac-btn-radius:     7px;
  --tac-btn-radius-sm:  5px;

  /* --- Typographie --- */
  --tac-font:           'Fira Sans', system-ui, -apple-system, sans-serif;

  /* --- Icône flottante (cookie) --- */
  --tac-icon-size:      48px;
  --tac-icon-image:     url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M12 2C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2zm0 18c-4.418 0-8-3.582-8-8s3.582-8 8-8 8 3.582 8 8-3.582 8-8 8zm-1-13a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm3 2a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm-5 4a1 1 0 1 0 0 2 1 1 0 0 0 0-2zm4 2a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3z"/></svg>');
  /* Ou utiliser une image custom : url('/path/to/cookies.png') */
}


/* ══════════════════════════════════════════════════════════════
   1. SCROLL LOCK — 100 % CSS, aucun JS ni override du template.

   Déclenché dès que le panel tarteaucitron est ouvert :
     • #tarteaucitron     → dialog principal
     • #tarteaucitronBack → backdrop

   Technique « modal scroll-lock » standard (Bootstrap, Reach UI…) :
     • body { position: fixed; width: 100% } sort le body du flux,
       ce qui défeat de façon universelle TOUS les scrollers,
       y compris les smooth-scrollers JS (Lenis, locomotive-scroll,
       gsap ScrollSmoother), Mobile Safari rubber-band, etc.
     • html { overflow: clip } empile une seconde barrière.

   Trade-off connu : la page « remonte » visuellement à 0 le temps
   que la modale est ouverte. C'est le prix pour une solution 100 %
   CSS, sans JS ni hook sur le template (la préservation exacte
   du scroll-Y nécessiterait du JS pour lire window.scrollY).

   N.B. : on ne lock PAS pour la bannière du bas (#tarteaucitronAlertBig)
   — sinon la page saute à 0 à chaque première visite, ce qui est
   bien plus gêlant que la bannière elle-même.
   ══════════════════════════════════════════════════════════════ */
html:has(#tarteaucitronBack[style*="display: block"]),
html:has(#tarteaucitronBack[style*="display:block"]),
html:has(#tarteaucitron[style*="display: block"]),
html:has(#tarteaucitron[style*="display:block"]),
html.tarteaucitron-modal-open,
html.tarteaucitron-modal-open-noscroll {
  overflow: clip !important;
  scrollbar-gutter: stable;
}

body:has(#tarteaucitronBack[style*="display: block"]),
body:has(#tarteaucitronBack[style*="display:block"]),
body:has(#tarteaucitron[style*="display: block"]),
body:has(#tarteaucitron[style*="display:block"]),
body.tarteaucitron-modal-open,
body.tarteaucitron-modal-open-noscroll {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  overflow: clip !important;
  /* Bloque touch + rebond natif (mobile, macOS). */
  touch-action: none !important;
  overscroll-behavior: none !important;
}

/* Ré-active explicitement le touch/scroll à l'intérieur du panel
   tarteaucitron — sinon `touch-action: none` sur <body> empêche
   tout scroll tactile sur la zone services de la modale.
   ⚠ Indispensable pour mobile / trackpad. */
#tarteaucitron,
#tarteaucitron *,
#tarteaucitronServices,
#tarteaucitronServices * {
  touch-action: auto !important;
}

#tarteaucitronServices {
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}

/* ══════════════════════════════════════════════════════════════
   2. FONT GLOBALE
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronRoot,
#tarteaucitronRoot * {
  font-family: var(--tac-font);
  box-sizing: border-box;
}

/* ══════════════════════════════════════════════════════════════
   3. BACKDROP
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronBack {
  position: fixed;
  inset: 0;
  z-index: 2147483644;
  background: var(--tac-backdrop);
  backdrop-filter: blur(var(--tac-backdrop-blur));
  border: none;
  cursor: default;
}

#tarteaucitronBack {
  display: none;
}

html.tarteaucitron-modal-open #tarteaucitronBack,
html.tarteaucitron-modal-open-noscroll #tarteaucitronBack,
body.tarteaucitron-modal-open #tarteaucitronBack,
body.tarteaucitron-modal-open-noscroll #tarteaucitronBack {
  display: block;
}

/* ══════════════════════════════════════════════════════════════
   4. PANEL PRINCIPAL — overlay centré fixe
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron {
  position: fixed;
  inset: auto;
  top: 50% !important;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  width: min(92vw, var(--tac-panel-width));
  height: auto;
  max-height: var(--tac-panel-max-h);
  z-index: 2147483647;
  background: var(--tac-bg);
  border-radius: var(--tac-panel-radius);
  box-shadow: 0 24px 64px var(--tac-primary-shadow);
  border: none;
  overflow: hidden;
  display: none;
  flex-direction: column;
  margin: 0;
}

/* Tarteaucitron passe le panel en `style="display:block"` via JS,
   ce qui écrase notre flex layout → #tarteaucitronServices n'est
   plus contraint en hauteur et ne scrolle pas. On force le flex
   dès que le panel est visible. */
#tarteaucitron[style*="display: block"],
#tarteaucitron[style*="display:block"],
#tarteaucitron.tarteaucitron-modal-open,
html.tarteaucitron-modal-open #tarteaucitron,
html.tarteaucitron-modal-open-noscroll #tarteaucitron,
body.tarteaucitron-modal-open #tarteaucitron,
body.tarteaucitron-modal-open-noscroll #tarteaucitron {
  display: flex !important;
}

.purgeBtn {
  display: none !important;
}

/* ══════════════════════════════════════════════════════════════
   5. BOUTON × FERMER
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronClosePanel {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 10;
  font-size: 0;
  line-height: 0;
  color: transparent;
  width: 28px;
  height: 28px;
  padding: 0;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}

#tarteaucitronClosePanel::after {
  content: '×';
  font-size: 1.1rem;
  line-height: 1;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 300;
  display: block;
}

#tarteaucitronClosePanel:hover {
  background: rgba(255, 255, 255, 0.28);
}

#tarteaucitronClosePanel:hover::after {
  color: #ffffff;
}

/* ══════════════════════════════════════════════════════════════
   6. EN-TÊTE — layout fixé
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitronMainLine {
  background: var(--tac-primary);
  border: none;
  padding: 1.25rem 3rem 1.1rem 1.5rem;
  flex-shrink: 0;
  position: relative;
  left: auto;
  top: auto;
  width: auto;
  margin: 0;
}

#tarteaucitron .tarteaucitronH1,
#tarteaucitron #dialogTitle {
  color: #ffffff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  display: block;
  margin: 0 0 0.3rem;
  padding: 0;
  position: static;
  inset: auto;
  transform: none;
}

#tarteaucitron #tarteaucitronInfo {
  display: block;
  margin-bottom: 0.75rem;
}

#tarteaucitron #tarteaucitronInfo p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.78rem;
  line-height: 1.5;
  margin: 0;
}

#tarteaucitron .tarteaucitronName {
  display: block;
  margin-bottom: 0.5rem;
}

#tarteaucitron .tarteaucitronName .tarteaucitronH2 {
  color: #fff !important;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: block;
  margin: 0;
}

/* ══════════════════════════════════════════════════════════════
   7. BOUTONS GLOBAUX "Tout accepter / Tout refuser"
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronScrollbarAdjust {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
  margin: 0;
  padding: 0;
}

#tarteaucitronAllAllowed {
  background: #ffffff;
  color: var(--tac-primary);
  border: none;
  border-radius: var(--tac-btn-radius);
  font-family: var(--tac-font);
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.38rem 1rem;
  cursor: pointer;
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

#tarteaucitronAllAllowed:hover {
  background: var(--tac-allowed-bg);
}

#tarteaucitronAllDenied {
  background: transparent;
  color: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: var(--tac-btn-radius);
  font-family: var(--tac-font);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.38rem 1rem;
  cursor: pointer;
  line-height: 1.4;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

#tarteaucitronAllDenied:hover {
  background: rgba(255, 255, 255, 0.1);
}

/* ══════════════════════════════════════════════════════════════
   8. ZONE SCROLLABLE DES SERVICES
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronServices {
  overflow-y: auto !important;
  overflow-x: hidden;
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  /* Fallback : si jamais le flex ne contraint pas la hauteur
     (panel en display:block forcé par tarteaucitron, etc.),
     on borne explicitement la hauteur scrollable.
     header (~110px) + footer save (~55px) → reste max-h - 170px. */
  max-height: calc(var(--tac-panel-max-h) - 170px);
  box-sizing: content-box !important;
  padding-bottom: 20px !important;
  /* Touch / smooth-scroll iOS */
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

#tarteaucitronServices::-webkit-scrollbar { width: 4px; }
#tarteaucitronServices::-webkit-scrollbar-track { background: #F3F4F6; }
#tarteaucitronServices::-webkit-scrollbar-thumb { background: var(--tac-info); border-radius: 99px; }

/* ══════════════════════════════════════════════════════════════
   9. CACHER catégories vides & titres superflus
   ══════════════════════════════════════════════════════════════ */
.tarteaucitronHidden {
  display: none;
}

.tarteaucitronHidden.tarteaucitronDetails,
.tarteaucitronInfoBox {
  display: block;
}

/* ══════════════════════════════════════════════════════════════
   10. CONTENEUR + LIGNES DE SERVICE
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitronBorder {
  background: var(--tac-bg-alt);
  border: none;
  padding: 0 1rem;
}

#tarteaucitron ul {
  padding-left: 0;
}

#tarteaucitronAlertBig #tarteaucitronCloseCross {
  display: none;
}

.tac_visually-hidden {
  display: none !important;
}

#tarteaucitron button {
  gap: 0;
}

#tarteaucitron .tarteaucitronTitle {
  background: var(--tac-bg);
  border-bottom: 1px solid var(--tac-border);
}

#tarteaucitron .tarteaucitronTitle button,
#tarteaucitron .catToggleBtn {
  color: var(--tac-text);
  font-size: 0.85rem;
  font-weight: 600;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0.6rem 1.25rem;
  width: 100%;
  text-align: left;
}

#tarteaucitron .tarteaucitronLine,
.cookie-list {
  background: var(--tac-bg);
  border-bottom: 1px solid var(--tac-border-light);
  padding: 0.65rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: unset;
  position: static;
}

#tarteaucitron ul.cookie-list {
  display: block; /* annule le flex hérité du sélecteur groupé .cookie-list */
  padding: 0;
  margin: 0.25rem 0 0.5rem;
  font-size: 0.75rem;
  list-style: none;
  border: 1px solid var(--tac-border);
  border-radius: 6px;
  overflow: hidden;
}

#tarteaucitron ul.cookie-list li.tarteaucitronCookiesListMain {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.35rem 0.75rem;
  border-bottom: 1px solid var(--tac-border-light);
  background: var(--tac-bg);
  min-height: unset;
  border-left: none;
  border-right: none;
}

#tarteaucitron ul.cookie-list li.tarteaucitronCookiesListMain:last-child {
  border-bottom: none;
}

#tarteaucitron ul.cookie-list .tarteaucitronCookiesListLeft {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 0 auto;
  color: var(--tac-text);
  font-weight: 600;
}

#tarteaucitron ul.cookie-list .tarteaucitronCookiesListRight {
  flex: 1 1 0;
  text-align: right;
  color: var(--tac-text-muted);
  font-size: 0.7rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 55%;
}

#tarteaucitron .tarteaucitronLine:last-child {
  border-bottom: none;
}

#tarteaucitron #tarteaucitronServices_mandatory .tarteaucitronLine {
  background: var(--tac-bg-alt);
}

#tarteaucitron .tarteaucitronLine .tarteaucitronName {
  flex: 1;
  min-width: 0;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronH3 {
  color: var(--tac-text);
  font-size: 0.83rem;
  font-weight: 600;
  display: block;
  margin: 0 0 0.1rem;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronName > span:not(.tarteaucitronH3):not(.tarteaucitronH2):not(.tarteaucitronListCookies) {
  color: var(--tac-text-muted);
  font-size: 0.73rem;
  line-height: 1.4;
  display: block;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk #tarteaucitronAllAllowed {
  background: var(--tac-accent);
  color: #ffffff;
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0.55rem 1.75rem;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk #tarteaucitronAllDenied {
  background: transparent;
  color: #f8f9fa;
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0.55rem 1.75rem;
}

#tarteaucitron ul li::marker {
  color: transparent;
}

#tarteaucitron .tarteaucitronLine.tarteaucitronMainLine {
  padding: 2rem;
  background-color: var(--tac-primary);
  display: block;
}

#tarteaucitron li.tarteaucitronLine {
  list-style: none;
}

/* ══════════════════════════════════════════════════════════════
   11. BOUTONS AUTORISER/INTERDIRE (lignes — petits)
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitronLine .tarteaucitronAsk {
  display: flex;
  gap: 0.35rem;
  flex-shrink: 0;
  align-items: center;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow {
  background: var(--tac-primary);
  color: #ffffff;
  border: none;
  border-radius: var(--tac-btn-radius-sm);
  font-family: var(--tac-font);
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.25rem 0.65rem;
  cursor: pointer;
  line-height: 1.35;
  white-space: nowrap;
  width: auto;
  height: auto;
  min-width: unset;
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow:hover {
  background: var(--tac-primary-hover);
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny {
  background: transparent;
  color: var(--tac-text-muted);
  border: 1px solid var(--tac-text-disabled);
  border-radius: var(--tac-btn-radius-sm);
  font-family: var(--tac-font);
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.25rem 0.65rem;
  cursor: pointer;
  line-height: 1.35;
  white-space: nowrap;
  width: auto;
  height: auto;
  min-width: unset;
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny:hover {
  border-color: var(--tac-accent);
  color: var(--tac-accent);
}

#tarteaucitron .tarteaucitronLine .tarteaucitronAsk button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ══════════════════════════════════════════════════════════════
   12. INFO BOX
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitronInfoBox {
  background: rgba(0, 180, 216, 0.07);
  border-left: 3px solid var(--tac-info);
  border-radius: 0 4px 4px 0;
  color: var(--tac-text);
  font-size: 0.77rem;
  line-height: 1.5;
  padding: 0.5rem 0.9rem;
  margin: 0 1rem 0.5rem;
}

/* ══════════════════════════════════════════════════════════════
   13. TOGGLE "Gestion des services" / "Détail des cookies"
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitron-toggle-group {
  background: transparent;
  border: none;
  color: var(--tac-primary);
  font-size: 0.72rem;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
  display: inline;
}

/* ══════════════════════════════════════════════════════════════
   14. BARRE ENREGISTRER (bas)
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronSave {
  background: var(--tac-bg);
  border-top: 1px solid var(--tac-border);
  padding: 0.8rem 1.25rem;
  text-align: right;
  flex-shrink: 0;
}

#tarteaucitronSaveButton {
  background: var(--tac-accent);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-family: var(--tac-font);
  font-size: 0.875rem;
  font-weight: 700;
  padding: 0.55rem 1.75rem;
  cursor: pointer;
  letter-spacing: 0.01em;
  line-height: 1.4;
}

#tarteaucitronSaveButton:hover {
  background: var(--tac-accent-hover);
}

/* ══════════════════════════════════════════════════════════════
   15. ICÔNE FLOTTANTE — bouton cookie
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronIcon {
  position: fixed;
  bottom: 1.25rem;
  left: 1.25rem;
  z-index: 2147483646;
  top: auto;
  right: auto;
}

#tarteaucitronManager {
  background-color: var(--tac-primary);
  border: none;
  border-radius: 50%;
  width: var(--tac-icon-size);
  height: var(--tac-icon-size);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px var(--tac-primary-shadow);
  cursor: pointer;
  padding: 0;
  overflow: hidden;
}

#tarteaucitronManager:hover {
  background-color: var(--tac-primary-hover);
  transform: scale(1.06);
}

#tarteaucitronManager img {
  display: none;
}

#tarteaucitronManager::after {
  content: '';
  display: block;
  width: 28px;
  height: 28px;
  background-image: var(--tac-icon-image);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: brightness(0) invert(1);
}

/* ══════════════════════════════════════════════════════════════
   16. BANNIÈRE BAS DE PAGE (mode banner)
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronAlertBig {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  top: auto;
  z-index: 2147483646;
  background: var(--tac-dark);
  border-top: 3px solid var(--tac-primary);
  padding: 1rem 1.5rem;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
}

#tarteaucitronAlertBig #tarteaucitronDisclaimerAlert {
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.85rem;
}

#tarteaucitronAlertBig .tarteaucitronCTAButton {
  border-radius: var(--tac-btn-radius);
  font-family: var(--tac-font);
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.4rem 0.9rem;
  cursor: pointer;
  border: none;
  line-height: 1.4;
}

#tarteaucitronAlertBig #tarteaucitronPersonalize2 {
  background: var(--tac-primary);
  color: #ffffff;
}

#tarteaucitronAlertBig #tarteaucitronAllDenied2 {
  background: transparent;
  color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

#tarteaucitronAlertBig #tarteaucitronCloseAlert {
  background: transparent;
  color: rgba(255, 255, 255, 0.55);
  border: none;
  font-size: 0.75rem;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
}

/* ══════════════════════════════════════════════════════════════
   17. MESSAGE "aucun cookie nécessitant consentement"
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronNoServicesTitle {
  color: var(--tac-text-muted);
  font-size: 0.82rem;
  font-style: italic;
  padding: 0.75rem 1.25rem;
  background: var(--tac-bg);
  border: none;
  list-style: none;
}

/* ══════════════════════════════════════════════════════════════
   18. LIGNE TRANSPARENTE (liste détail cookies)
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitronLine[style*="background:transparent"],
#tarteaucitron .tarteaucitronLine[style*="background: transparent"] {
  background: transparent;
  border-bottom: none;
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

/* ══════════════════════════════════════════════════════════════
   19. LIEN TARTEAUCITRON.IO (discret)
   ══════════════════════════════════════════════════════════════ */
#tarteaucitron .tarteaucitronSelfLink {
  display: none;
}

/* ══════════════════════════════════════════════════════════════
   20. ÉTATS CLAIRS POUR "AUTORISER / INTERDIRE"
       Basé sur aria-pressed + classes de ligne
   ══════════════════════════════════════════════════════════════ */

#tarteaucitron .tarteaucitronAllow,
#tarteaucitron .tarteaucitronDeny {
  transition: all .18s ease-in-out;
}

/* --- État des lignes --- */
#tarteaucitron li.tarteaucitronLine.tarteaucitronIsAllowed {
  background-color: var(--tac-allowed-bg);
}

#tarteaucitron li.tarteaucitronLine.tarteaucitronIsDenied {
  background-color: var(--tac-denied-bg);
}

/* --- Bouton Autoriser --- */
#tarteaucitron .tarteaucitronAsk .tarteaucitronAllow[aria-pressed="true"] {
  background: var(--tac-primary);
  color: #ffffff;
  box-shadow: 0 0 0 2px var(--tac-primary-ring);
  opacity: 1;
  transform: translateY(-1px);
  border: none;
}

#tarteaucitron .tarteaucitronAsk .tarteaucitronAllow[aria-pressed="false"] {
  background: var(--tac-primary);
  color: #ffffff;
  opacity: .55;
}

#tarteaucitron .tarteaucitronAsk .tarteaucitronAllow:hover {
  background: var(--tac-primary-hover);
  opacity: 1;
}

/* --- Bouton Interdire --- */
#tarteaucitron .tarteaucitronAsk .tarteaucitronDeny[aria-pressed="true"] {
  background: var(--tac-accent-pale);
  border-color: var(--tac-accent);
  color: var(--tac-accent-dark);
  box-shadow: 0 0 0 2px var(--tac-accent-ring);
  opacity: 1;
  transform: translateY(-1px);
}

#tarteaucitron .tarteaucitronAsk .tarteaucitronDeny[aria-pressed="false"] {
  background: transparent;
  color: var(--tac-text-muted);
  border: 1px solid var(--tac-text-disabled);
  opacity: .55;
}

#tarteaucitron .tarteaucitronAsk .tarteaucitronDeny:hover {
  color: var(--tac-accent);
  border-color: var(--tac-accent);
  opacity: 1;
}

#tarteaucitron .tarteaucitronAsk button:disabled {
  opacity: 0.35 !important;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* ══════════════════════════════════════════════════════════════
   21. BLOCAGE NAVIGATION PENDANT LE BANDEAU
      (le scroll-lock est géré globalement en section 1)
   ══════════════════════════════════════════════════════════════ */
body:has(#tarteaucitronAlertBig[style*="display: block"]):before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99998;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2px);
  pointer-events: auto;
}

#tarteaucitronAlertBig:not([style*="display: block"]):not([style*="display:block"]) {
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  border: none !important;
  pointer-events: none !important;
}

/* ══════════════════════════════════════════════════════════════
   22. LAYOUT RESPONSIVE DU BANDEAU
   ══════════════════════════════════════════════════════════════ */
@media (min-width: 768px) {
  #tarteaucitronAlertBig {
    display: grid !important;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: auto auto auto;
    align-items: center;
    column-gap: 1.5rem;
    padding-right: 1.5rem;
  }

  #tarteaucitronDisclaimerAlert {
    grid-column: 1;
    grid-row: 1 / span 3;
    align-self: center;
    max-width: 100%;
  }

  #tarteaucitronPersonalize2 {
    grid-column: 2;
    grid-row: 1;
    width: auto;
  }

  #tarteaucitronAllDenied2 {
    grid-column: 2;
    grid-row: 2;
    width: auto;
  }

  #tarteaucitronCloseAlert {
    grid-column: 2;
    grid-row: 3;
    width: auto;
    text-align: center;
  }
}

@media (max-width: 767px) {
  #tarteaucitronAlertBig {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
    padding-right: 1rem;
  }
}

#tarteaucitronDisclaimerAlert {
  font-size: 0.9rem;
  color: #ffffff;
}

#tarteaucitronAlertBig .tarteaucitronCTAButton {
  border-radius: var(--tac-btn-radius);
  font-family: var(--tac-font);
  padding: 0.45rem 1.1rem;
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  border: none;
}

#tarteaucitronPersonalize2 {
  background: var(--tac-primary);
  color: white;
}

#tarteaucitronPersonalize2:hover {
  background: var(--tac-primary-hover);
}

#tarteaucitronAllDenied2 {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.4);
  color: rgba(255, 255, 255, 0.9);
}

#tarteaucitronAllDenied2:hover {
  background: rgba(255, 255, 255, 0.1);
}

#tarteaucitronCloseAlert {
  background: transparent;
  color: white;
  text-decoration: underline;
  font-size: 0.85rem;
  padding: 0.45rem 0.4rem;
}

#tarteaucitronCloseCross {
  display: none;
}

/* ══════════════════════════════════════════════════════════════
   23. SITE AVEC COOKIES STRICTEMENT NÉCESSAIRES UNIQUEMENT
   Le bandeau du bas est purement informatif (obligation
   d'information, pas de consentement requis légalement).
   On masque "Tout refuser" et "Personnaliser" pour ne garder
   qu'un bouton "OK / J'ai compris" (= "Tout accepter").
   À retirer si le site a un jour des cookies tiers nécessitant
   un vrai choix utilisateur.
   ══════════════════════════════════════════════════════════════ */
#tarteaucitronAlertBig #tarteaucitronAllDenied2,
#tarteaucitronAlertBig #tarteaucitronCloseAlert {
  display: none !important;
}

/* Sur desktop, la grille du bandeau prévoyait 3 lignes pour les
   boutons → on simplifie le layout puisqu'il n'en reste qu'un. */
@media (min-width: 768px) {
  #tarteaucitronAlertBig {
    grid-template-rows: auto !important;
  }
  #tarteaucitronAlertBig #tarteaucitronPersonalize2 {
    grid-row: 1 !important;
    align-self: center;
  }
}

/* ══════════════════════════════════════════════════════════════
   24. CORRECTIFS DIVERS
   ══════════════════════════════════════════════════════════════ */
/* Masquer le lien "Voir le site officiel" quand l'URL est invalide */
#tarteaucitronServices a.tarteaucitronReadmoreOfficial[href="undefined"] {
  display: none !important;
}