/* Lot 7 : bannière de consentement et bulle de discussion. Rien de nouveau : les valeurs et les
   composants de la fiche 27297 (assets/css/fiche-produit.css). Barre fixée en bas : .cc-sticky.
   Boutons : .cc-cta. Lignes du panneau : .cc-bundle. Titre : .cc-ha-btn.
   Toutes les règles passent par les identifiants #cdo-cc et #cdo-bulle : les règles génériques de
   Woodmart sur les boutons (« :is(.btn, .button, button, …) », base.min.css) ont sinon la même
   spécificité qu'une classe, et passent après. */
#cdo-cc,#cdo-bulle{--ink:#313131;--cream:#FFFEF2;--deep:#2C2924;--ink2:#6B6860;--sand:#F6F6E8;--border:rgba(49,49,49,.09);--r:12px;--sans:'Jost',system-ui,sans-serif;--serif:'Cormorant Garamond',Georgia,serif;--max:1222px}
#cdo-cc{display:none;position:fixed;left:0;right:0;bottom:0;z-index:100000;max-height:85vh;overflow-y:auto;background:var(--cream);border-top:1px solid var(--border);color:var(--ink);font:300 14.5px/1.5 var(--sans);text-align:left;outline:none;-webkit-font-smoothing:antialiased}
html.cdo-cc-demande #cdo-cc{display:block}
/* Les gabarits portés (accueil, ingrédients, pages) masquent tout enfant direct de <body> hors de leur
   liste : « body>*:not(.header)…:not(#wpadminbar){display:none!important} », soit 1 identifiant et
   jusqu'à 21 classes. L'identifiant doublé (2 identifiants) l'emporte, sans toucher à ces gabarits. */
html.cdo-cc-demande body>#cdo-cc#cdo-cc{display:block!important}
/* Le panier latéral du site (.sidecart, snippet 38901) ou un panneau latéral de Woodmart ouvert passe
   devant : la bannière revient à sa fermeture. */
html.cdo-cc-demande:has(.sidecart.open) body>#cdo-cc#cdo-cc,html.cdo-cc-demande:has(.wd-side-hidden.wd-opened) body>#cdo-cc#cdo-cc{display:none!important}
#cdo-cc *{box-sizing:border-box}
#cdo-cc .cdo-cc-in{max-width:var(--max);margin:0 auto;padding:20px 28px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"corps actions";align-items:center;gap:16px 40px}
#cdo-cc .cdo-cc-corps{grid-area:corps}
#cdo-cc .cdo-cc-titre{margin:0 0 4px;padding:0;font:500 17px var(--serif);letter-spacing:normal;text-transform:none;color:var(--ink)}
#cdo-cc .cdo-cc-texte{margin:0;padding:0;font:300 14.5px/1.5 var(--sans);color:var(--ink2)}
#cdo-cc .cdo-cc-texte a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
/* Les trois boutons sont EMPILES EN COLONNE, a droite, de meme largeur.
   `max-content` fait que la colonne prend la largeur du libelle le plus long : les trois
   boutons sont donc egaux entre eux, et aucun ne traine une marge inutile. Le meme fond,
   la meme taille et la meme typographie pour les trois : « Tout refuser » est aussi
   evident que « Tout accepter », et ce n est pas une preference, c est une obligation. */
#cdo-cc .cdo-cc-actions{grid-area:actions;display:grid;grid-template-columns:max-content;gap:8px;justify-self:end}
/* Boutons compacts : la hauteur vient du remplissage, plus d une hauteur fixe de 54px ou le
   texte flottait au milieu du vide. Mesure du 30/09/2026 : le libelle occupait 47 a 54 %%
   de la largeur du bouton. */
#cdo-cc .cdo-cc-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:0;margin:0;padding:10px 16px;border:none;border-radius:var(--r);background:var(--ink);box-shadow:none;color:var(--cream);font:500 12px/1 var(--sans);letter-spacing:2.5px;text-transform:uppercase;text-shadow:none;white-space:nowrap;cursor:pointer;transition:background .3s}
@media (hover:hover){#cdo-cc .cdo-cc-btn:hover{background:var(--deep);color:var(--cream)}}
#cdo-cc .cdo-cc-btn:focus-visible,#cdo-cc .cdo-cc-ligne input:focus-visible,#cdo-cc .cdo-cc-texte a:focus-visible,#cdo-bulle:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
#cdo-cc .cdo-cc-panneau{grid-area:panneau;display:none}
#cdo-cc .cdo-cc-seul-panneau{display:none}
#cdo-cc.cdo-cc-perso .cdo-cc-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"corps" "panneau" "actions"}
#cdo-cc.cdo-cc-perso .cdo-cc-actions{justify-self:end}
#cdo-cc.cdo-cc-perso .cdo-cc-panneau{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#cdo-cc.cdo-cc-perso .cdo-cc-seul-panneau{display:flex}
#cdo-cc.cdo-cc-perso .cdo-cc-seul-bandeau{display:none}
#cdo-cc .cdo-cc-ligne{display:flex;gap:12px;align-items:flex-start;margin:0;padding:16px;border:1px solid var(--border);border-radius:var(--r);background:var(--sand);font-weight:300;cursor:pointer}
#cdo-cc .cdo-cc-ligne input{flex:0 0 auto;width:18px;height:18px;margin:2px 0 0;accent-color:var(--ink);cursor:pointer}
#cdo-cc .cdo-cc-ligne input:disabled{cursor:default}
#cdo-cc .cdo-cc-nom{display:block;margin-bottom:2px;font:500 15px var(--sans);color:var(--ink)}
#cdo-cc .cdo-cc-desc{display:block;font:300 11.5px/1.5 var(--sans);color:var(--ink2)}
#cdo-cc .cdo-cc-note{grid-column:1/-1;margin:0;font:300 11.5px/1.5 var(--sans);color:var(--ink2)}
@media (max-width:1100px){
  #cdo-cc .cdo-cc-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"corps" "actions"}
  #cdo-cc .cdo-cc-actions{grid-template-columns:repeat(3,minmax(0,1fr));justify-self:stretch}
  #cdo-cc.cdo-cc-perso .cdo-cc-actions{justify-self:stretch}
}
@media (max-width:767px){
  #cdo-cc .cdo-cc-in{padding:16px 16px 20px;gap:14px}
  #cdo-cc .cdo-cc-actions{grid-template-columns:minmax(0,1fr);gap:8px;justify-self:stretch}
/* Sur mobile le bouton reste plus haut que sur desktop : le pouce n est pas une souris.
   40px de haut, contre 32 sur grand ecran, pour une cible confortable. */
#cdo-cc .cdo-cc-btn{padding:14px 16px}
  #cdo-cc.cdo-cc-perso .cdo-cc-panneau{grid-template-columns:minmax(0,1fr)}
}
/* La bulle de discussion : charge Tawk.to au clic. Couleurs du bouton .cc-cta. */
#cdo-bulle{position:fixed;right:20px;bottom:20px;z-index:99999;display:flex;align-items:center;justify-content:center;width:60px;height:60px;min-height:0;margin:0;padding:0;border:none;border-radius:50%;background:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.1);color:var(--cream);cursor:pointer;transition:background .3s}
body>#cdo-bulle#cdo-bulle{display:flex!important}
/* Pendant que le visiteur règle ses choix (panneau ouvert, très haut à 390 px), la bulle s'efface. */
html.cdo-cc-demande body>#cdo-cc.cdo-cc-perso~#cdo-bulle#cdo-bulle{display:none!important}
@media (hover:hover){#cdo-bulle:hover{background:var(--deep);color:var(--cream)}}
#cdo-bulle.cdo-bulle-attente{opacity:.55;cursor:default}