/* =====================================================================
   BLOXI refonte — habillage des guides (pages /guides/… et /store/guide-achat/)
   Les guides sont d'anciens snippets autonomes (thème sombre, Syne, JetBrains Mono) qui
   redéfinissent --bg, --ink, --line… sur :root. Ici on rebranche leurs variables sur la
   charte refonte, avec une spécificité plus forte (:not(#bxg)), sans toucher à leur contenu.
   ===================================================================== */

/* ---------- variables des guides → charte refonte (clair) ---------- */
html:root:not(#bxg),html[data-theme="light"]:not(#bxg){
  --bg:#f6f5f0;--bg-2:#ecebe4;--bg-3:#ecebe4;--bg-card:#ffffff;--bg-card-hover:#fbfaf6;--surface:#ffffff;
  --ink:#0b1118;--ink-2:#323c47;--ink-soft:#323c47;--mute:#56616d;--muted:#56616d;--muted-2:#7b8590;
  --line:rgba(11,17,24,.14);--line-2:rgba(11,17,24,.08);--line-strong:rgba(11,17,24,.22);
  --g:#00774f;--g-btn:#00774f;--on-g:#fff;--g-soft:rgba(0,119,79,.09);
  --accent:#00774f;--accent-soft:rgba(0,119,79,.09);--accent-line:rgba(0,119,79,.28);
  --pilier:#00774f;--pilier-soft:rgba(0,119,79,.09);--pilier-line:rgba(0,119,79,.28);--pilier-deep:rgba(0,119,79,.5);
  --cyan:#1d5fa8;--jaune:#8a5a00;--jaune-soft:rgba(217,119,6,.1);--jaune-line:rgba(217,119,6,.3);
  --shadow-sm:none;--shadow-md:0 18px 40px rgba(11,17,24,.06);--shadow-lg:0 18px 40px rgba(11,17,24,.08);
  --font-display:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --radius-xs:8px;--radius-sm:12px;--radius-md:16px;--radius-lg:20px;
}
html[data-theme="dark"]:not(#bxg){
  --bg:#0a0e13;--bg-2:#121922;--bg-3:#121922;--bg-card:#131b24;--bg-card-hover:#16202b;--surface:#131b24;
  --ink:#eef3f6;--ink-2:#c9d2da;--ink-soft:#c9d2da;--mute:#a3afbb;--muted:#a3afbb;--muted-2:#7d8995;
  --line:rgba(238,243,246,.14);--line-2:rgba(238,243,246,.08);--line-strong:rgba(238,243,246,.22);
  --g:#00e5a0;--g-btn:#00e5a0;--on-g:#04140d;--g-soft:rgba(0,229,160,.1);
  --accent:#00e5a0;--accent-soft:rgba(0,229,160,.1);--accent-line:rgba(0,229,160,.3);
  --pilier:#00e5a0;--pilier-soft:rgba(0,229,160,.1);--pilier-line:rgba(0,229,160,.3);--pilier-deep:rgba(0,229,160,.5);
  --cyan:#7cc0ff;--jaune:#f5b454;--jaune-soft:rgba(245,180,84,.12);--jaune-line:rgba(245,180,84,.3);
  --shadow-sm:none;--shadow-md:none;--shadow-lg:0 18px 40px rgba(0,0,0,.35);
}
/* couleur du pilier selon la rubrique */
body.bxg-assist{--pilier:var(--assist);--pilier-soft:var(--assist-soft);--pilier-line:color-mix(in srgb,var(--assist) 30%,transparent);--pilier-deep:color-mix(in srgb,var(--assist) 50%,transparent)}
body.bxg-store{--pilier:var(--store);--pilier-soft:var(--store-soft);--pilier-line:color-mix(in srgb,var(--store) 30%,transparent);--pilier-deep:color-mix(in srgb,var(--store) 50%,transparent)}

/* ---------- mise en page : le guide porte son propre titre, pleine largeur utile ---------- */
body.bxg .bx-page>.bx-page-hd{display:none}
body.bxg .bx-page>.bx-prose{max-width:none}
body.bxg .bx-prose>*+*{margin-top:0}
body.bxg .bx-prose a{text-decoration:none}
body.bxg .dev-toggle,body.bxg .theme-toggle,body.bxg [data-dev-toggle]{display:none!important}

/* ---------- typographie : plus de Syne ni de mono, hiérarchie refonte ---------- */
body.bxg .bx-prose{font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
body.bxg .bx-prose :is(h1,h2,h3,h4){font-family:inherit!important;letter-spacing:-.02em;color:var(--ink)}
body.bxg .bx-prose h1{font-size:clamp(2.1rem,6vw,3.4rem)!important;line-height:1.06!important;font-weight:700!important}
body.bxg .bx-prose h2{font-size:clamp(1.5rem,4vw,2.1rem)!important;line-height:1.15!important;font-weight:700!important}
body.bxg .bx-prose h3{font-size:1.2rem!important;font-weight:700!important}
body.bxg .bx-prose :is(code,kbd,pre,.mono,[class*="mono"]){font-family:inherit!important;letter-spacing:0!important}
/* surtitres et étiquettes en petites capitales mono → étiquettes refonte */
body.bxg .bx-prose :is(.eyebrow,.tag,.kicker,.label,.pill,.chip){font-family:inherit!important;letter-spacing:.02em!important;text-transform:none!important;font-weight:600!important}
/* dégradé de titre (vert/bleu) → vert refonte plein */
body.bxg .bx-prose .gradient{background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--g)!important}
/* lisibilité : corps 18 px minimum, gris lisible */
body.bxg .bx-prose :is(p,li,td,th,dd){font-size:max(1.05rem,1em)}
body.bxg .bx-prose .lead{font-size:clamp(1.15rem,2.4vw,1.3rem)!important;color:var(--ink-2)!important;max-width:40em}

/* ---------- cartes et encadrés : surfaces refonte ---------- */
body.bxg .bx-prose :is(.card,.crit,.op,.box,.callout,.step,.faq-item,.tile){background:var(--surface);border-color:var(--line);border-radius:16px}
body.bxg .bx-prose :is(.hero,.page-hero){background:none!important;padding-left:0!important;padding-right:0!important}
body.bxg .bx-prose .hero::before,body.bxg .bx-prose .hero::after{display:none!important}

/* ---------- grilles trop serrées sur téléphone et en colonne étroite ---------- */
body.bxg .bx-prose [class*="grid"]{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))!important}
@media (max-width:600px){body.bxg .bx-prose table{display:block;overflow-x:auto}}

/* ---------- boutons : style refonte (pastille verte, 48 px au pouce) ---------- */
body.bxg .bx-prose :is(.btn,.cta,a.button,.btn-primary){font-family:inherit!important;border-radius:999px!important;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 20px;font-weight:600;letter-spacing:0!important;text-transform:none!important}
body.bxg .bx-prose :is(.btn-primary,.btn.primary,.cta.primary,.btn.p){background:var(--g-btn)!important;color:var(--on-g)!important;border-color:var(--g-btn)!important}

/* ---------- guide d'achat Store (5645) : pas de second logo sous l'en-tête du site ---------- */
body.bxg .q-lock,body.bxg .bg-fx{display:none!important}
body.bxg .q-bighead{padding:0!important;margin:0 auto 14px!important;background:none!important;border:0!important;display:flex!important;justify-content:center}
body.bxg .q-lock-tag{display:inline-flex;font-family:inherit!important;font-size:.9rem!important;color:var(--pilier)!important;background:var(--pilier-soft);border-radius:999px;padding:4px 12px;letter-spacing:0!important;text-transform:none!important}