/**
 * Thème partagé du gestionnaire de consentement (tarteaucitronjs 1.31).
 *
 * ══════════════════════════════════════════════════════════════════════════
 * CE QUE CETTE FEUILLE EST, ET CE QU'ELLE N'EST PAS
 * ══════════════════════════════════════════════════════════════════════════
 *
 * C'est une **surcharge**, pas un remplacement. `useExternalCss` reste à
 * `false` : la bibliothèque charge sa propre feuille, et celle-ci ne réécrit
 * que l'apparence par-dessus. La documentation amont est explicite —
 * `useExternalCss: true` fait que « the tarteaucitron.css file will *not* be
 * loaded » — c'est-à-dire qu'on hériterait alors de la maintenance de toute la
 * structure (grille du panneau, points de rupture, états ouvert/fermé). On ne
 * la veut pas : on veut leurs correctifs de structure, et nos couleurs.
 *
 * Conséquence : il faut **gagner la cascade** contre une feuille dont les
 * sélecteurs vont jusqu'à
 * `html body #tarteaucitronRoot #tarteaucitron ul#tarteaucitronServices_mandatory .tarteaucitronDeny`.
 *
 * ══════════════════════════════════════════════════════════════════════════
 * COMMENT ON GAGNE LA CASCADE — SANS `!important` PARTOUT
 * ══════════════════════════════════════════════════════════════════════════
 *
 * Un seul mécanisme, appliqué uniformément : **le sélecteur d'identifiant
 * `#tarteaucitronRoot` est répété quatre fois**. Répéter un identifiant est du
 * CSS valide et parfaitement défini : chaque occurrence compte dans le
 * comptage de spécificité, sans changer les éléments sélectionnés.
 *
 *   notre préfixe          → (4, 0, 0)
 *   + n'importe quelle cible → au moins (4, 0, 0), et (5, 0, 0) si c'est un id
 *
 * Le plafond de la bibliothèque, sur les propriétés qu'on touche, est de
 * **trois identifiants** :
 *
 *   #tarteaucitron #tarteaucitronServices #tarteaucitronServices_mandatory
 *       .tarteaucitronLine button.tarteaucitronAllow          → (3, 2, 1)
 *   html body #tarteaucitronRoot #tarteaucitronAlertBig
 *       div.tarteaucitronPartnersList                         → (3, 1, 3)
 *
 * Les identifiants se comparent AVANT les classes et les éléments : 4 > 3 clôt
 * la comparaison, quel que soit le reste. Toute règle d'ici l'emporte donc, et
 * il n'y a **rien à recalculer à chaque ajout** — c'est l'intérêt d'un préfixe
 * unique plutôt que d'un `!important` posé au cas par cas.
 *
 * Trois choses que ce préfixe ne peut pas battre, et qu'on assume :
 *
 *  1. Les déclarations `!important` de la bibliothèque. Trois nous concernent,
 *     toutes sur `font-size` — l. 64/891 (boutons d'action et liens tertiaires),
 *     l. 197 (statut et séparateur d'un service), l. 248 (bouton
 *     « Enregistrer »). Ce sont les seuls endroits où l'on répond par un
 *     `!important`, et le test `consent-theme.test.ts` interdit tous les autres.
 *  2. Les styles en ligne posés par le JS (affichage/masquage). C'est de la
 *     mécanique, pas de l'apparence : on n'y touche pas.
 *  3. Ce qui vit hors de `#tarteaucitronRoot`. En pratique, le substitut de
 *     contenu tiers (`.tac_activate`) — que ce portefeuille ne rend pas via
 *     Tarteaucitron mais via `<ConsentPlaceholder>`, un composant React.
 *
 * Les couches de cascade (`@layer`) ne sont **pas** une option ici : toute
 * règle non-layerée bat toute règle layerée, et `tarteaucitron.css` n'est pas
 * layerée. Se mettre dans une couche nous ferait perdre à coup sûr.
 *
 * ══════════════════════════════════════════════════════════════════════════
 * L'ÉGALITÉ « ACCEPTER » / « REFUSER » EST STRUCTURELLE
 * ══════════════════════════════════════════════════════════════════════════
 *
 * La CNIL exige que refuser soit aussi simple qu'accepter. Le motif le plus
 * répandu — « Accepter » en bouton plein coloré, « Refuser » en lien gris — est
 * précisément ce qu'elle sanctionne.
 *
 * Ici, ce n'est pas une convention qu'on se promet de tenir : **les deux
 * boutons sont habillés par un unique bloc de déclarations**. Il n'existe, dans
 * toute cette feuille, aucune règle qui donne à l'un une taille, une graisse,
 * une couleur ou un ordre que l'autre n'a pas. On ne peut pas dégrader le
 * refus sans dégrader l'acceptation dans le même geste.
 *
 * `test/consent-theme.test.ts` verrouille l'invariant : toute règle qui touche
 * une propriété de poids visuel sur un côté de la paire sans toucher l'autre
 * fait échouer la CI. Ajouter plus tard un `#tarteaucitronAllDenied2 { opacity:
 * .6 }` est donc une erreur de build, pas une régression silencieuse.
 *
 * « Personnaliser » reste en action tertiaire (lien souligné) : c'est un
 * troisième choix, pas un refus — le refus, lui, est déjà à un clic.
 *
 * ══════════════════════════════════════════════════════════════════════════
 * CALIBRAGE PAR L'APP
 * ══════════════════════════════════════════════════════════════════════════
 *
 * Le mécanisme est partagé, les couleurs sont locales. L'app pose ses jetons
 * sur `:root`, depuis ses propres variables de thème :
 *
 *   :root {
 *     --gj-consent-surface:    hsl(var(--card));
 *     --gj-consent-ink:        hsl(var(--foreground));
 *     --gj-consent-action-bg:  hsl(var(--primary));
 *     --gj-consent-action-ink: hsl(var(--primary-foreground));
 *     --gj-consent-radius:     var(--radius);
 *   }
 *
 * ⚠️ `--gj-consent-action-bg` / `--gj-consent-action-ink` valent pour **les
 * deux** boutons. Il n'existe volontairement pas de `--gj-consent-accept-bg` :
 * l'API elle-même refuse de représenter l'asymétrie.
 *
 * ⚠️ Le couple action-bg / action-ink doit atteindre **4,5:1** (WCAG AA, texte
 * de 16 px). Plusieurs de nos jetons `--primary` sont des teals clairs prévus
 * pour un texte foncé : vérifier avant de recopier `--primary-foreground`.
 *
 * Sans aucun jeton, les valeurs par défaut ci-dessous rendent correctement :
 * blanc, encre presque noire (17,76:1), action anthracite sur blanc (15,52:1).
 *
 * ══════════════════════════════════════════════════════════════════════════
 * AUCUNE RESSOURCE DISTANTE
 * ══════════════════════════════════════════════════════════════════════════
 *
 * Pas de `@import`, pas de `url(https://…)`, pas de police distante. Un
 * gestionnaire de consentement qui appellerait un tiers pour s'afficher serait
 * une contradiction, et `assertConsentHostsDeclared` (src/lib/consent-audit.ts)
 * ferait échouer la CI de l'app. La typographie est héritée de la page.
 */

/* ══════════════════════════════════════════════════════════════════════════
   Jetons — valeurs par défaut, écrasables par l'app via `--gj-consent-*`
   ══════════════════════════════════════════════════════════════════════════
   Les alias `--gjc-*` existent pour que les défauts soient écrits UNE fois,
   ici, plutôt que répétés en `var(x, défaut)` dans chaque déclaration. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot {
  --gjc-surface: var(--gj-consent-surface, #ffffff);
  --gjc-ink: var(--gj-consent-ink, #16181d);
  --gjc-muted-ink: var(--gj-consent-muted-ink, #4b5158);
  --gjc-action-bg: var(--gj-consent-action-bg, #1f2430);
  --gjc-action-ink: var(--gj-consent-action-ink, #ffffff);
  --gjc-radius: var(--gj-consent-radius, 10px);
  --gjc-border: var(--gj-consent-border, rgba(20, 24, 31, 0.12));
  --gjc-shadow: var(--gj-consent-shadow, 0 12px 40px rgba(16, 20, 28, 0.22));
  --gjc-focus: var(--gj-consent-focus, currentColor);
  --gjc-max-width: var(--gj-consent-max-width, 30rem);

  /* Interne, non exposé : un voile de l'encre sur la surface. Sert aux états
     de survol et aux fonds secondaires, et suit donc le thème de l'app sans
     lui demander deux jetons de plus. */
  --gjc-veil: color-mix(in srgb, var(--gjc-ink) 7%, transparent);

  /* Interne : la silhouette du cadenas de la pastille, utilisée en masque.
     Volontairement NON exposé — ce n'est pas une couleur à calibrer, et une app
     qui voudrait sa propre icône la remplacerait mieux par `customCloserId`,
     qui donne un vrai libellé plutôt qu'un pictogramme sans texte. */
  --gjc-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8a2 2 0 0 0-2-2h-1V7a5 5 0 0 0-5-5zm0 2a3 3 0 0 1 3 3v3H9V7a3 3 0 0 1 3-3zm0 11a1.75 1.75 0 0 1 1 3.19V19a1 1 0 0 1-2 0v-2.81A1.75 1.75 0 0 1 12 13z'/%3E%3C/svg%3E");
}

/* ══════════════════════════════════════════════════════════════════════════
   Base — annule le `#tarteaucitronRoot * { color:#333; font-size:14px }`
   de la bibliothèque, et rend la typographie à la page.
   ══════════════════════════════════════════════════════════════════════════
   Le `font-size` en `rem` n'est pas cosmétique. `tarteaucitron.css` dimensionne
   son texte en PIXELS — 38 des 44 déclarations `font-size` de la feuille — et
   un réglage de taille dans la page (`html { font-size }`, que plusieurs de nos
   sites exposent comme commande « Aa+ ») ne l'atteint donc pas. Mesuré sur
   coraly.fr, dont le public est déficient visuel : racine portée à 28 px,
   bandeau resté à 15 px. La personne qui demande le texte le plus grand reçoit
   la décision juridique dans le plus petit.

   `0.875rem` vaut 14 px sur une racine par défaut : à réglage inchangé, le
   rendu est identique à celui de la bibliothèque. Ce qui change, c'est qu'il
   SUIT désormais. Les rôles qui doivent rester plus gros (titres du panneau)
   sont redimensionnés explicitement plus bas, sinon cette base les aplatirait.
   `test/consent-theme.test.ts` refuse tout `font-size` en pixels dans cette
   feuille : la propriété est verrouillée, pas seulement présente. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot * {
  box-sizing: border-box;
  color: var(--gjc-ink);
  font-family: inherit;
  font-size: 0.875rem;
}

/* ☑ / ☒ / ✚ : la bibliothèque les écrit en `content` et les force en `#000`.
   Ce sont des points de code à double présentation — sans indication, le
   navigateur choisit l'emoji, qui arrive avec SES couleurs (la case cochée
   sort en violet) et ignore `color`. `font-variant-emoji: text` demande la
   présentation textuelle, donc monochrome et teintable. Sans effet là où la
   propriété n'est pas connue : on ne perd rien. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronCheck::before,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronCross::before,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronPlus::before {
  color: currentColor;
  font-variant-emoji: text;
}

/* Anneau de focus — le défaut de la bibliothèque est un pointillé bleu fixe
   (#3d86d8), qui jure avec toutes nos palettes et disparaît sur fond sombre. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot a:focus-visible,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot button:focus-visible {
  outline: 3px solid var(--gjc-focus);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ══════════════════════════════════════════════════════════════════════════
   Le bandeau
   ══════════════════════════════════════════════════════════════════════════
   ── Placement : on reste EN BAS, et on minimise la hauteur ──────────────
   Mesuré sur ridesamui.com, qui est le cas difficile (le module de recherche
   est posé au ras du bas de la fenêtre initiale, aux deux points de rupture) :

     bande d'origine        desktop  52 px | mobile  95,2 px
     carte de coin (essai)  desktop 189 px | mobile  181 px  ← recale la carte
                            sur le bouton « Rechercher » : REJETÉE
     retenue                desktop 60,8 px | mobile 139,7 px

   Tout ce qui est ancré en bas recouvre quelque chose. La seule variable qu'on
   contrôle vraiment est la HAUTEUR — d'où une rangée unique en desktop, et un
   empilement serré en mobile. Le texte reste sur une largeur lisible ; les
   boutons gardent une cible confortable.

   Le mobile coûte 44,5 px de plus que la bande d'origine, et ce n'est pas de la
   décoration : 28 de ces pixels sont la rangée que « Personnaliser » occupe
   seul, parce que les deux actions prennent 50 % chacune. La bande d'origine
   faisait tenir les trois contrôles sur une ligne — mais seulement parce que
   ses boutons étaient dimensionnés par la longueur de leur libellé (mesuré :
   115,6 px pour « accepter » contre 134,2 px pour « refuser »). C'est
   exactement l'asymétrie que cette feuille existe pour supprimer. Les 28 px
   sont le prix de la parité, pas un défaut de mise en page.

   Une variante a été essayée pour les récupérer — « Personnaliser » en
   `position: absolute` dans le coin bas-droit, ce qui ramenait la bande à
   111,4 px — et REJETÉE sur mesure : le lien se posait alors PAR-DESSUS
   « Tout refuser » (299-374 px contre 195-362 px). Dégrader le bouton de refus
   pour gagner de la hauteur est précisément ce qu'on refuse de faire.

   Ce qu'on n'a pas retenu, et pourquoi :
    - `orientation: "popup"` — la bibliothèque y ajoute `role="dialog"`,
      `aria-modal="true"` et un **piège à focus** (l. 1359-1360), sans voile
      derrière : le clavier est enfermé, la souris non. Et sa carte de 250 px
      posée en bas à gauche recouvre, sur un écran de 390 px, exactement le
      module de recherche.
    - `orientation: "middle"` — vrai dialogue avec voile flouté, mais c'est un
      barrage plein écran au premier rendu.
    - un `padding-bottom` sur la page — supprime le recouvrement, mais le
      bandeau apparaît après le chargement du script : c'est un décalage de
      mise en page (CLS) sur chaque première visite. Le remède est pire.

   `orientation: "bottom"` reste donc en place, et l'on ne change QUE la
   géométrie : pas de dialogue, pas de piège à focus, pas de blocage du
   défilement, et aucun décalage — l'élément est `fixed` depuis le début. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig {
  background: var(--gjc-surface);
  color: var(--gjc-ink);
  border: 1px solid var(--gjc-border);
  border-bottom: 0;
  border-radius: var(--gjc-radius) var(--gjc-radius) 0 0;
  box-shadow: var(--gjc-shadow);
  text-align: left;
  padding: 0.75rem 1rem 0.875rem;
  width: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  margin: 0;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronDisclaimerAlert {
  display: block;
  padding: 0;
  margin: 0 0 0.625rem;
  color: var(--gjc-ink);
  font-size: 0.875rem;
  line-height: 1.45;
  text-align: left;
  max-height: 35vh;
}

/* ≥ 768 px : une seule rangée — texte à gauche, actions à droite. C'est ce qui
   ramène la bande à la hauteur d'un bouton plus ses marges. */
@media (min-width: 48em) {
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig {
    padding: 0.625rem 1.5rem;
    text-align: right;
  }

  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronDisclaimerAlert {
    display: inline-block;
    width: auto;
    max-width: 46%;
    margin: 0 1.25rem 0 0;
    font-size: 0.875rem;
    vertical-align: middle;
  }
}

/* < 768 px : resserrement mesuré, pas décoratif.
   Sur ridesamui.com en 390 × 844, la bande passe de 151,7 px à 139,7 px, ce qui
   déplace son bord haut de 692 à 704 px — c'est-à-dire exactement sous le champ
   « Pick-up/delivery location » (664-704 px), la première case du tunnel. Douze
   pixels décident donc si le premier champ du formulaire est intact ou rogné.
   Les trois valeurs ci-dessous sont les seules qu'on puisse reprendre sans
   toucher ni la cible tactile des actions (40 px) ni celle de « Personnaliser »
   (24 px, le plancher WCAG 2.5.8). */
@media (max-width: 47.99em) {
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig {
    padding: 0.625rem 1rem 0.75rem;
  }

  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronDisclaimerAlert {
    margin: 0 0 0.5rem;
  }

  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronCloseAlert {
    margin: 0.25rem 1rem 0 0;
    padding: 0.25rem;
  }
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronDisclaimerAlert strong {
  color: var(--gjc-ink);
  font-size: 1rem;
  font-weight: 650;
}

/* ══════════════════════════════════════════════════════════════════════════
   ⚖️  LA PAIRE — « Tout accepter » et « Tout refuser »
   ══════════════════════════════════════════════════════════════════════════
   UN SEUL bloc, pour les quatre boutons : les deux du bandeau
   (`Personalize2` = accepter, `AllDenied2` = refuser) et les deux de l'en-tête
   du panneau (`AllAllowed` / `AllDenied`).

   Ne PAS scinder ce bloc. Ne PAS ajouter ailleurs une règle qui ne viserait
   qu'un côté : `test/consent-theme.test.ts` échoue si une propriété de poids
   visuel n'est pas posée sur les deux.

   `font-size` porte un `!important` — le seul de la feuille — parce que la
   bibliothèque écrit `font-size: 16px!important` sur ces mêmes boutons
   (tarteaucitron.css l. 891). Il s'applique aux deux à la fois, donc il ne
   crée aucune asymétrie. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPersonalize2,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAllDenied2,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAllAllowed,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAllDenied {
  background: var(--gjc-action-bg);
  color: var(--gjc-action-ink);
  border: 1px solid transparent;
  border-radius: calc(var(--gjc-radius) - 2px);
  padding: 0.5rem 1rem;
  min-height: 2.5rem;
  /* Même plancher de largeur pour les deux : « Tout refuser » est plus court
     que « Tout accepter » dans la plupart de nos langues, et un bouton plus
     petit se lit comme un choix secondaire. Le bandeau, lui, les met à 50 %
     chacun (règle de disposition plus bas), ce qui neutralise ce plancher. */
  min-width: 11rem;
  font-size: 0.9375rem !important;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  opacity: 1;
  cursor: pointer;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPersonalize2:hover,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAllDenied2:hover,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAllAllowed:hover,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAllDenied:hover {
  background: var(--gjc-action-bg);
  color: var(--gjc-action-ink);
  opacity: 0.88;
}

/* Disposition des actions du bandeau — deux moitiés strictement égales.
   La largeur est exprimée en pourcentage du même conteneur et la marge est
   identique des deux côtés : aucune des deux ne peut devenir plus grande que
   l'autre sans que l'autre change avec elle.

   ⚠️ On ne peut PAS passer `#tarteaucitronAlertBig` en `display:flex/grid` :
   le script écrit `style.display = 'block'` **en ligne** pour l'afficher
   (`userInterface.css`, l. 1338-1352), et un style en ligne bat toute feuille.
   Le seul moyen de le contrer serait `display: grid !important`, qui
   empêcherait ensuite le script de refermer le bandeau. D'où les
   `inline-block`. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPersonalize2,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronAllDenied2 {
  display: inline-block;
  width: calc(50% - 0.75rem);
  min-width: 0;
  margin: 0 0.5rem 0 0;
  vertical-align: top;
}

@media (min-width: 48em) {
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPersonalize2,
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronAllDenied2 {
    width: auto;
    min-width: 11rem;
    margin: 0 0 0 0.5rem;
    vertical-align: middle;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   Actions tertiaires — « Personnaliser » et le lien de confidentialité
   ══════════════════════════════════════════════════════════════════════════
   Souligné, sans fond : un troisième choix, pas un refus déguisé. Le refus
   plein est déjà au-dessus, à égalité avec l'acceptation. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronCloseAlert,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPersonalize,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPrivacyUrl,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPrivacyUrlDialog {
  background: transparent;
  color: var(--gjc-muted-ink);
  border: 0;
  border-radius: 6px;
  padding: 0.375rem 0.25rem;
  margin: 0.375rem 1rem 0 0;
  font-size: 0.8125rem !important;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

@media (min-width: 48em) {
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronCloseAlert,
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPersonalize,
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPrivacyUrl,
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPrivacyUrlDialog {
    margin: 0 0 0 1rem;
    vertical-align: middle;
  }
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronCloseAlert:hover,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPersonalize:hover,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPrivacyUrl:hover,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronPrivacyUrlDialog:hover {
  color: var(--gjc-ink);
}

/* ══════════════════════════════════════════════════════════════════════════
   Le panneau détaillé
   ══════════════════════════════════════════════════════════════════════════ */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronBack {
  background: var(--gjc-ink);
  opacity: 0.45;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitron .tarteaucitronBorder,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronMainLine,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronLine,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronSave,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronClosePanel,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronInfo,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronTitle,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronDetails,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronCookiesList,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronCookiesTitle {
  background: var(--gjc-surface);
  color: var(--gjc-ink);
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices {
  border-radius: var(--gjc-radius);
  box-shadow: var(--gjc-shadow);
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronLine {
  border-left: 4px solid transparent;
  border-bottom: 1px solid var(--gjc-border);
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronLine:hover {
  background: var(--gjc-veil);
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronTitle button,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .asCatToggleBtn,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronH1,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronH2,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronH3 {
  background: transparent;
  color: var(--gjc-ink);
}

/* Hiérarchie typographique du panneau, en unités relatives.
   Sans ces trois règles, la base `0.875rem` posée plus haut aplatirait les
   titres — la bibliothèque les dimensionne en pixels (22 px pour `H1`/`strong`,
   18 px pour `H3`), et notre préfixe les bat. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronH1,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName a {
  font-size: 1.375rem;
  line-height: 1.25;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronH2 {
  font-size: 1.25rem;
  line-height: 1.3;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronH3 {
  font-size: 1.125rem;
  line-height: 1.35;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronName .tacCurrentStatus,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronName .tarteaucitronReadmoreSeparator,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronListCookies,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronDisclaimer {
  color: var(--gjc-muted-ink);
  /* `!important` face au `font-size: 12px!important` de tarteaucitron.css
     l. 197 sur `.tacCurrentStatus` / `.tarteaucitronReadmoreSeparator`. */
  font-size: 0.8125rem !important;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronSaveButton {
  background: var(--gjc-action-bg);
  color: var(--gjc-action-ink);
  border-radius: calc(var(--gjc-radius) - 2px);
  font-weight: 600;
  /* `!important` face au `font-size: 18px!important` de tarteaucitron.css
     l. 248. Sans lui, le bouton « Enregistrer » reste le seul texte du
     panneau figé en pixels. */
  font-size: 1rem !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   ⚖️  LA PAIRE, deuxième instance — bascules par service dans le panneau
   ══════════════════════════════════════════════════════════════════════════
   Même règle que ci-dessus : `.tarteaucitronAllow` et `.tarteaucitronDeny`
   sont habillés ensemble, jamais séparément.

   Au repos, les deux sont des boutons à contour. Sélectionné, celui qui l'est
   se remplit — la même couleur pour l'un comme pour l'autre. C'est déjà mieux
   que le défaut de la bibliothèque, où les DEUX sont jaunes en permanence et
   où seul le glyphe ☑/☐ distingue l'état actif. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronAsk .tarteaucitronAllow,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronAsk .tarteaucitronDeny {
  background: transparent;
  color: var(--gjc-ink);
  border: 1px solid var(--gjc-border);
  border-radius: calc(var(--gjc-radius) - 2px);
  padding: 0.5rem 0.875rem;
  min-height: 2.5rem;
  min-width: 6.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  text-shadow: none;
  opacity: 1;
  cursor: pointer;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronIsAllowed .tarteaucitronAllow,
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot .tarteaucitronIsDenied .tarteaucitronDeny {
  background: var(--gjc-action-bg);
  color: var(--gjc-action-ink);
  border-color: transparent;
  font-weight: 600;
}

/* ══════════════════════════════════════════════════════════════════════════
   Pastille de réouverture
   ══════════════════════════════════════════════════════════════════════════
   ⚠️ On n'y touche ni `display` ni `position` : la bibliothèque pose
   `display:none` en ligne tant que le bandeau est ouvert — c'est voulu, et un
   style en ligne battrait de toute façon cette feuille. Seule l'apparence est
   reprise, pour que la pastille cesse d'être un objet étranger dans le coin.

   Le vrai point d'entrée à privilégier reste un lien « Gérer les cookies » en
   pied de page, branché via l'option `customCloserId` de la bibliothèque : une
   pastille flottante de 50 px sans libellé visible n'est reliée au
   consentement par presque personne. */
#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronIcon #tarteaucitronManager {
  background: var(--gjc-surface);
  border: 1px solid var(--gjc-border);
  border-radius: var(--gjc-radius) var(--gjc-radius) 0 0;
  box-shadow: var(--gjc-shadow);
  padding: 0.5rem 0.625rem;
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronIcon #tarteaucitronManager img {
  width: 2rem;
  height: 2rem;
  display: block;
}

/* ── Le cadenas, recoloré ────────────────────────────────────────────────────
   La bibliothèque livre son cadenas comme un `<img>` portant un PNG en base64,
   jaune #FBD600. Une image matricielle ne se recolore pas : `color` ne
   l'atteint pas, et un `filter` ne peut pas transformer une couleur arbitraire
   en une autre de façon fiable. Le contenant était donc déjà repris par cette
   feuille, et le cadenas restait le dernier morceau de la bibliothèque visible
   — en permanence, dans un coin de chaque page.

   On le masque et on dessine à sa place une forme équivalente, colorée par
   `--gjc-action-bg`. `mask-image` sur un SVG en ligne prend la silhouette du
   tracé et laisse la couleur au fond : le dessin suit donc le thème de l'app,
   y compris quand elle bascule en sombre.

   Sous `@supports`, à dessein : là où le masquage n'est pas connu, on ne fait
   RIEN — l'image d'origine reste, jaune mais présente. Sans cette garde, un
   navigateur sans `mask` afficherait un carré plein à la place du cadenas, ce
   qui est pire que le jaune.

   Le SVG est en ligne, comme tout le reste de cette feuille : aucune ressource
   distante, `assertConsentHostsDeclared` continue de passer. */
@supports ((mask-image: none) or (-webkit-mask-image: none)) {
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot
    #tarteaucitronIcon
    #tarteaucitronManager
    img {
    display: none;
  }

  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot
    #tarteaucitronIcon
    #tarteaucitronManager::before {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background-color: var(--gjc-action-bg);
    -webkit-mask: var(--gjc-lock) center / contain no-repeat;
    mask: var(--gjc-lock) center / contain no-repeat;
  }
}

#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot #tarteaucitronAlertSmall {
  background: var(--gjc-surface);
  border: 1px solid var(--gjc-border);
  border-radius: var(--gjc-radius) 0 0 0;
  box-shadow: var(--gjc-shadow);
}

/* ══════════════════════════════════════════════════════════════════════════
   Mouvement réduit — la bibliothèque anime tout (`#tarteaucitronRoot *`)
   ══════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot,
  #tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot#tarteaucitronRoot * {
    transition-duration: 0.01ms;
    animation-duration: 0.01ms;
  }
}