/*
Theme Name: Les Bulles Bizarres
Theme URI: https://lesbullesbizarres.fr
Author: Les Bulles Bizarres
Description: Thème WooCommerce sur mesure pour Les Bulles Bizarres — boutique de cartes à collectionner Pokémon et protections premium. Palette noir/rouge/blanc, header sticky avec mega-menu, mini-panier en tiroir, page d'accueil personnalisable depuis le Customizer.
Version: 1.7.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
WC requires at least: 8.0
WC tested up to: 9.0
Text Domain: bulles-bizarres
*/

:root{
  --paper:#FFFFFF;
  --paper-dim:#F4F4F4;
  --surface:#FFFFFF;
  --plate:#FFFFFF;
  --plate-line:rgba(20,15,13,.09);
  --ink:#1B1615;
  --ink-soft:#6B5F5A;
  --line:#E7E4E2;
  --red:#E12A20;
  --red-deep:#7A0F12;
  --red-ink:#3A0708;
  --black:#100D0C;
  --on-red:#FFF7F3;
  --shadow: 0 1px 2px rgba(20,10,8,.04), 0 8px 24px -12px rgba(20,10,8,.18);
  --shadow-lg: 0 20px 60px -20px rgba(20,10,8,.35);
  --radius-card: 22px;
  --radius-sm: 12px;
  --font-display:'Space Grotesk', 'Segoe UI', sans-serif;
  --font-body:'Inter', 'Segoe UI', sans-serif;
  --font-mono:'Space Mono', ui-monospace, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#141010;
    --paper-dim:#1B1615;
    --surface:#1F1918;
    --ink:#F4ECE7;
    --ink-soft:#B7A99F;
    --line:#332927;
    --red:#FF4B3D;
    --red-deep:#C22A1F;
    --red-ink:#5C120F;
    --black:#0A0807;
    --on-red:#FFF7F3;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.5);
    --shadow-lg: 0 20px 60px -20px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  --paper:#141010;
  --paper-dim:#1B1615;
  --surface:#1F1918;
  --ink:#F4ECE7;
  --ink-soft:#B7A99F;
  --line:#332927;
  --red:#FF4B3D;
  --red-deep:#C22A1F;
  --red-ink:#5C120F;
  --black:#0A0807;
  --on-red:#FFF7F3;
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px -12px rgba(0,0,0,.5);
  --shadow-lg: 0 20px 60px -20px rgba(0,0,0,.6);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scrollbar-gutter:stable;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:15.5px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3,h4{font-family:var(--font-display);text-wrap:balance;margin:0 0 .5em;letter-spacing:-.01em;}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}
.wrap{max-width:1280px;margin:0 auto;padding:0 28px;}
.eyebrow{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--red);
  display:flex;align-items:center;gap:8px;
  margin:0 0 10px;
}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);flex:none;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 22px;border-radius:100px;border:1.5px solid transparent;
  font-weight:600;font-size:14.5px;font-family:var(--font-body);
  transition:transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
  white-space:nowrap;
}
.btn:focus-visible{outline:2px solid var(--red);outline-offset:2px;}
.btn-primary{background:var(--red);color:var(--on-red);box-shadow:0 10px 24px -10px rgba(225,42,32,.55);}
.btn-primary:hover{background:var(--red-deep);transform:translateY(-1px);color:var(--on-red);}
.btn-dark{background:var(--black);color:#fff;}
.btn-dark:hover{background:var(--red-ink);transform:translateY(-1px);color:#fff;}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink);}
.btn-ghost:hover{border-color:var(--red);color:var(--red);}
.btn-outline-light{background:transparent;border-color:rgba(255,255,255,.35);color:#fff;}
.btn-outline-light:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff;}
.btn-buyback{background:transparent;border-color:var(--red);color:var(--red);white-space:nowrap;padding:11px 18px;font-size:13px;}
.btn-buyback:hover{background:var(--red);color:var(--on-red);}
.icon{width:19px;height:19px;flex:none;}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
section{padding:76px 0;}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:36px;flex-wrap:wrap;}
.section-head h2{font-size:clamp(24px,3vw,34px);}
.section-head p{margin:10px 0 0;color:var(--ink-soft);max-width:46ch;}
.filter-pills{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 28px;}
.filter-pill{padding:9px 16px;border-radius:100px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);font-size:13px;font-weight:600;transition:background .15s ease, color .15s ease, border-color .15s ease;}
.filter-pill:hover{border-color:var(--red);color:var(--red);}
.filter-pill.is-active{background:var(--black);border-color:var(--black);color:#fff;}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--black);color:#fff;padding:12px 18px;z-index:999;border-radius:0 0 10px 0;}
.skip-link:focus{left:0;}

/* ---------- Notices (WooCommerce) ---------- */
.woocommerce-message, .woocommerce-error, .woocommerce-info, .woocommerce-noreviews, p.no-comments{
  list-style:none;margin:0 0 24px;padding:16px 20px;border-radius:var(--radius-sm);background:var(--paper-dim);
  border:1px solid var(--line);display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:14px;
}
.woocommerce-error{border-color:var(--red);}
.woocommerce-message .button, .woocommerce-error .button, .woocommerce-info .button{order:2;margin-left:auto;background:var(--black);color:#fff;border-radius:100px;padding:10px 18px;font-weight:600;font-size:13px;height:auto;}
.woocommerce-message::before, .woocommerce-error::before, .woocommerce-info::before{display:none;}

/* ---------- Topbar ---------- */
.topbar{background:var(--black);color:#EFE6E0;font-size:12.5px;}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:38px;gap:16px;}
.topbar span{display:flex;align-items:center;gap:7px;opacity:.9;white-space:nowrap;}
.topbar .icon{width:14px;height:14px;color:var(--red);}
@media (max-width:820px){ .topbar .tb-mid{display:none;} .topbar .wrap{justify-content:center;} }

/* ---------- Header ---------- */
header.site{position:sticky;top:0;z-index:50;background:color-mix(in srgb, var(--paper) 92%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.header-row{display:flex;align-items:center;gap:22px;height:84px;}
.logo-badge{display:flex;align-items:center;gap:12px;flex:none;}
.logo-badge img{width:52px;height:52px;border-radius:50%;box-shadow:var(--shadow);object-fit:cover;}
.logo-word{font-family:var(--font-display);font-weight:700;font-size:18px;line-height:1.1;letter-spacing:-.01em;}
.logo-word small{display:block;font-family:var(--font-mono);font-weight:400;font-size:9.5px;letter-spacing:.16em;color:var(--red);text-transform:uppercase;margin-top:2px;}
.site-search{
  flex:1;display:flex;align-items:center;gap:10px;
  background:var(--surface);border:1.5px solid var(--line);border-radius:100px;
  padding:0 8px 0 18px;height:48px;max-width:520px;transition:border-color .15s ease, box-shadow .15s ease;
}
.site-search:focus-within{border-color:var(--red);box-shadow:0 0 0 4px color-mix(in srgb, var(--red) 12%, transparent);}
.site-search input{border:0;background:transparent;outline:0;flex:1;font-size:14px;color:var(--ink);font-family:var(--font-body);min-width:0;}
.site-search input::placeholder{color:var(--ink-soft);}
.site-search button{width:34px;height:34px;border-radius:50%;background:var(--black);color:#fff;display:flex;align-items:center;justify-content:center;border:0;flex:none;}
.header-actions{display:flex;align-items:center;gap:6px;flex:none;}
.icon-btn{position:relative;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--ink);}
.icon-btn:hover{background:var(--paper-dim);}
.cart-count{position:absolute;top:3px;right:3px;background:var(--red);color:#fff;font-family:var(--font-mono);font-size:10px;width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.cart-count:empty{display:none;}
.burger{display:none;}

nav.primary{border-top:1px solid var(--line);}
nav.primary .wrap{display:flex;height:52px;align-items:stretch;justify-content:center;}
nav.primary ul.menu, nav.primary > .wrap > ul{display:flex;gap:2px;margin:0;padding:0;list-style:none;height:100%;}
nav.primary .nav-item{position:relative;display:flex;align-items:center;}
nav.primary a.top-link{display:flex;align-items:center;gap:6px;padding:0 16px;height:100%;font-size:13.5px;font-weight:600;color:var(--ink);border-bottom:2px solid transparent;}
nav.primary a.top-link:hover, nav.primary .nav-item:hover > a.top-link, nav.primary .nav-item.current-menu-item > a.top-link{color:var(--red);border-color:var(--red);}
nav.primary .nav-item.is-sale > a.top-link{color:var(--red);}
nav.primary .chev{width:12px;height:12px;transition:transform .15s ease;}
nav.primary .nav-item:hover .chev{transform:rotate(180deg);}

.mega{
  display:none;
  position:absolute;top:100%;left:0;background:var(--surface);border:1px solid var(--line);border-radius:0 0 var(--radius-sm) var(--radius-sm);
  box-shadow:var(--shadow-lg);padding:26px;gap:28px;
  max-width:calc(100vw - 56px);overflow-x:auto;
  z-index:10;
}
/* Flex, not grid: a column with a heading + link list needs a comfortable
   fixed-ish width (min-width below) so its text doesn't wrap onto three
   lines, but a menu item with no children of its own — rendered as a single
   .mega-col-link, see nav-walker.php — should only take the width its own
   link text needs, not get stretched to match. A shared grid track can't
   tell those two cases apart; flex sizes each column by its own content. */
.nav-item:hover .mega, .nav-item:focus-within .mega{display:flex;}
.mega > div{flex:0 0 auto;}
.mega > div:not(.mega-col-link){min-width:150px;}
/* display:none (not visibility:hidden) so a closed panel takes up no space
   at all — with enough columns in a menu, a hidden-but-still-laid-out panel
   could extend past the viewport and force the whole page to scroll
   horizontally sideways. */
.mega .mega-title{font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 12px;white-space:nowrap;}
.mega .mega-title a{font-size:inherit;color:inherit;}
.mega .mega-title a:hover{color:var(--red);}
.mega ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.mega a{font-size:13.5px;white-space:nowrap;}
.mega a:hover{color:var(--red);}

/* ---------- Hero bento ---------- */
/* ---------- Promo carousel ---------- */
.promo-carousel{padding:40px 0 0;}
.carousel{position:relative;}
.carousel-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--radius-card);-webkit-overflow-scrolling:touch;}
.carousel-track::-webkit-scrollbar{display:none;}
.carousel-slide{position:relative;flex:0 0 100%;scroll-snap-align:start;aspect-ratio:21/8;border-radius:var(--radius-card);background-size:cover;background-position:center;background-color:var(--black);overflow:hidden;display:flex;align-items:flex-end;color:#fff;}
.carousel-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg, rgba(16,13,12,.88), rgba(16,13,12,.15) 65%);}
.carousel-overlay{position:relative;z-index:2;padding:32px 40px;max-width:560px;}
.carousel-overlay .eyebrow{margin-bottom:8px;}
.carousel-overlay .eyebrow::before{background:#FFC9C0;}
/* A <p>, not a heading: the carousel sits above the homepage H1. */
.carousel-title{font-family:var(--font-display);font-weight:700;letter-spacing:-.01em;text-wrap:balance;color:#fff;font-size:clamp(20px,2.6vw,30px);margin:0 0 16px;}
.carousel-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(16,13,12,.55);color:#fff;border:1px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;z-index:3;}
.carousel-nav:hover{background:var(--red);border-color:var(--red);}
.carousel-nav.prev{left:16px;}
.carousel-nav.next{right:16px;}
.carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:16px;}
.dot{width:8px;height:8px;border-radius:50%;background:var(--line);border:0;padding:0;}
.dot.is-active{background:var(--red);width:22px;border-radius:100px;transition:width .2s ease;}

.hero{padding:40px 0 0;}
.bento{display:grid;grid-template-columns:1.7fr 1fr;gap:20px;}
.bento-main{
  position:relative;overflow:hidden;border-radius:var(--radius-card);
  background:radial-gradient(120% 140% at 100% 0%, var(--red-deep), var(--red-ink) 55%, var(--black) 100%);
  color:#fff;min-height:420px;display:flex;align-items:center;padding:0 48px;
}
.bento-main::before, .bento-main::after{
  content:"";position:absolute;border-radius:50%;border:1.5px solid rgba(255,255,255,.14);pointer-events:none;
}
.bento-main::before{width:340px;height:340px;top:-120px;right:-60px;}
.bento-main::after{width:180px;height:180px;bottom:-70px;right:220px;border-color:rgba(255,255,255,.1);}
.bento-copy{position:relative;z-index:2;max-width:360px;}
.bento-copy .eyebrow{color:#FFC9C0;}
.bento-copy .eyebrow::before{background:#FFC9C0;}
.bento-copy .headline{font-family:var(--font-display);font-weight:700;text-wrap:balance;letter-spacing:-.01em;font-size:clamp(28px,3.4vw,40px);color:#fff;line-height:1.08;margin:0 0 14px;}
.bento-copy p{color:rgba(255,255,255,.78);margin:0 0 22px;font-size:14.5px;max-width:34ch;}
.price-tag{font-family:var(--font-mono);font-size:15px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);padding:6px 14px;border-radius:100px;display:inline-flex;align-items:baseline;gap:8px;margin-bottom:22px;}
.price-tag del{opacity:.6;font-size:.85em;text-decoration:line-through;}
.price-tag ins{text-decoration:none;}
.bento-actions{display:flex;gap:12px;flex-wrap:wrap;}
.bento-shot-wrap{position:absolute;right:20px;bottom:-16px;width:300px;height:300px;pointer-events:none;}
.bento-shot-wrap::before{
  content:"";position:absolute;inset:8% 4% 0 4%;border-radius:50%;
  background:radial-gradient(circle, rgba(255,247,243,.98) 0%, rgba(255,247,243,.65) 42%, rgba(255,247,243,0) 72%);
}
.bento-product-shot{position:relative;z-index:1;display:block;margin:0 auto;width:250px;filter:drop-shadow(0 22px 28px rgba(0,0,0,.5));transition:transform .5s cubic-bezier(.2,.9,.3,1);}
.bento-main:hover .bento-product-shot{transform:translateY(-8px) rotate(-2deg);}

.bento-side{display:flex;flex-direction:column;gap:20px;}
.tile{
  position:relative;flex:1;border-radius:var(--radius-card);background:var(--surface);border:1px solid var(--line);
  overflow:hidden;display:flex;align-items:stretch;min-height:190px;box-shadow:var(--shadow);
  transition:transform .2s ease, box-shadow .2s ease;
}
.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);}
.tile-media{position:relative;width:38%;flex:none;background:var(--plate);border-right:1px solid var(--plate-line);overflow:hidden;}
.tile-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:16px;transition:transform .35s ease;}
.tile:hover .tile-media img{transform:scale(1.06);}
.tile-copy{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:center;padding:22px;}
.tile-copy span.k{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--red);}
.tile-copy h3{font-size:18px;margin:4px 0 0;}
.tile-copy .go{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;margin-top:8px;color:var(--ink-soft);}
.tile:hover .tile-copy .go{color:var(--red);}

/* ---------- Trust bar ---------- */
.trust{padding:44px 0;border-bottom:1px solid var(--line);}
.trust .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.trust-item{display:flex;align-items:center;gap:14px;}
.trust-item .icon-wrap{width:46px;height:46px;border-radius:50%;background:var(--paper-dim);display:flex;align-items:center;justify-content:center;flex:none;color:var(--red);}
.trust-item strong{display:block;font-size:13.5px;}
.trust-item span{display:block;font-size:12px;color:var(--ink-soft);margin-top:2px;}

/* ---------- Product grid & cards ---------- */
ul.products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;list-style:none;margin:0;padding:0;}
ul.products li.product{list-style:none;margin:0;}
.grid-products{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;
  display:flex;flex-direction:column;height:100%;transition:transform .2s ease, box-shadow .2s ease;position:relative;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);}
.card-media{position:relative;aspect-ratio:1/1;background:var(--plate);overflow:hidden;display:block;}
.card-media img{width:100%;height:100%;object-fit:contain;padding:22px;transition:transform .5s ease;}
.card:hover .card-media img{transform:scale(1.06);}
.card-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(115deg, transparent 40%, rgba(255,255,255,.55) 48%, transparent 56%);
  transform:translateX(-120%);transition:transform .7s ease;pointer-events:none;
}
.card:hover .card-media::after{transform:translateX(120%);}
.badge{position:absolute;top:12px;left:12px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;padding:5px 10px;border-radius:100px;z-index:2;}
.badge.promo, .badge.out{background:var(--red);color:#fff;}
.badge.new{background:var(--black);color:#fff;}
.badge.best{background:var(--surface);border:1px solid var(--line);color:var(--ink);}
.card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1;}
.stars, .star-rating{display:flex;gap:2px;color:var(--red);}

/* Review form star picker (WooCommerce replaces the #rating <select> with
   this p.stars of plain-text links via its own JS — text stays for
   accessibility, ::before swaps in the visible star glyph). */
p.stars{gap:4px;margin:0 0 20px;}
p.stars a{position:relative;display:inline-block;width:24px;height:24px;font-size:0;color:var(--line);}
p.stars a::before{content:"\2605";position:absolute;inset:0;font-size:22px;line-height:24px;color:currentColor;}
p.stars a:hover, p.stars a.active{color:var(--red);}
.star-rating{position:relative;width:5.6em;height:1em;font-size:12px;line-height:1;letter-spacing:2px;overflow:hidden;}
.star-rating::before{content:"\2605\2605\2605\2605\2605";color:var(--line);}
.star-rating span{position:absolute;top:0;left:0;height:100%;overflow:hidden;white-space:nowrap;color:var(--red);}
.star-rating span::before{content:"\2605\2605\2605\2605\2605";}
.card-title{font-family:inherit;font-size:14px;font-weight:600;line-height:1.35;letter-spacing:normal;text-wrap:wrap;margin:0;}
.card-title a{color:inherit;}
.card-title a:hover{color:var(--red);}
.card-price{margin-top:auto;display:flex;align-items:baseline;gap:8px;font-family:var(--font-mono);}
.card-price .now, .card-price ins{font-size:16.5px;font-weight:700;text-decoration:none;color:var(--ink);}
.card-price del{font-size:12.5px;color:var(--ink-soft);opacity:1;order:2;}
.card-price .now.promo, .card-price ins{color:var(--red);}
.card .add_to_cart_button, .card .quick-add{
  position:absolute;left:12px;right:12px;bottom:12px;z-index:2;
  display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--black);color:#fff;border:0;border-radius:100px;padding:11px;font-weight:600;font-size:13px;
  transform:translateY(14px);opacity:0;transition:transform .2s ease, opacity .2s ease, background .15s ease;
}
.card:hover .add_to_cart_button, .card:focus-within .add_to_cart_button,
.card:hover .quick-add, .card:focus-within .quick-add{transform:translateY(0);opacity:1;}
.card .add_to_cart_button:hover, .card .quick-add:hover{background:var(--red);color:#fff;}
.card .added_to_cart{display:none;}

.toast{
  position:fixed;bottom:26px;left:50%;transform:translate(-50%, 20px);background:var(--black);color:#fff;
  padding:14px 22px;border-radius:100px;font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:10px;
  box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;transition:transform .25s ease, opacity .25s ease;z-index:200;
}
.toast.show{opacity:1;transform:translate(-50%, 0);pointer-events:auto;}
.toast .icon{color:#7CE0A6;}

/* ---------- Category band ---------- */
.cat-band{background:var(--paper-dim);}

/* ---------- Newsletter ---------- */
.newsletter{background:radial-gradient(120% 200% at 50% 0%, var(--red-ink), var(--black) 65%);color:#fff;text-align:center;}
.newsletter .wrap{max-width:640px;}
.newsletter h2{color:#fff;font-size:clamp(24px,3vw,32px);}
.newsletter p{color:rgba(255,255,255,.68);margin:12px 0 26px;}
.nl-form{display:flex;gap:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);padding:6px;border-radius:100px;}
.nl-form input{flex:1;background:transparent;border:0;outline:0;color:#fff;padding:0 16px;font-size:14px;font-family:var(--font-body);min-width:0;}
.nl-form input::placeholder{color:rgba(255,255,255,.5);}
.nl-note{font-size:12px;margin-top:14px;color:rgba(255,255,255,.55);}
.socials{display:flex;justify-content:center;gap:12px;margin-top:26px;}
.socials a{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .15s ease, border-color .15s ease;}
.socials a:hover{background:var(--red);border-color:var(--red);}

/* ---------- Footer ---------- */
footer.site{background:var(--black);color:#EFE6E0;padding:64px 0 0;}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.1);}
.foot-brand p{color:rgba(255,255,255,.55);font-size:13px;max-width:32ch;margin:14px 0 0;}
.foot-brand .logo-word{color:#fff;}
footer h4{font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);margin:0 0 16px;}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
footer a{font-size:13.5px;color:rgba(255,255,255,.82);}
footer a:hover{color:var(--red);}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;padding:22px 0;flex-wrap:wrap;gap:12px;}
.foot-bottom p{margin:0;font-size:12px;color:rgba(255,255,255,.45);}
.pay-chips{display:flex;gap:8px;}
.pay-chips span{font-family:var(--font-mono);font-size:10.5px;border:1px solid rgba(255,255,255,.2);padding:5px 10px;border-radius:6px;color:rgba(255,255,255,.7);}

/* ---------- Off-canvas drawers (mobile menu + mini cart) ---------- */
.drawer{position:fixed;inset:0;z-index:100;visibility:hidden;overflow:hidden;}
.drawer .scrim{position:absolute;inset:0;background:rgba(16,13,12,.5);opacity:0;transition:opacity .2s ease;}
.drawer .panel{position:absolute;top:0;bottom:0;width:86%;max-width:360px;background:var(--surface);padding:22px;transition:transform .25s ease;overflow-y:auto;display:flex;flex-direction:column;}
.drawer.drawer-left .panel{left:0;transform:translateX(-100%);}
.drawer.drawer-right .panel{right:0;transform:translateX(100%);}
.drawer.open{visibility:visible;}
.drawer.open .scrim{opacity:1;}
.drawer.open .panel{transform:translateX(0);}
.mobile-nav{margin-top:20px;}
.m-menu, .m-sub{list-style:none;margin:0;padding:0;}
.m-sub[hidden]{display:none;}
.m-row{display:flex;align-items:center;border-bottom:1px solid var(--line);}
.m-row > a, .m-row > .m-label{flex:1;min-width:0;display:block;padding:13px 4px;font-size:15px;font-weight:600;color:var(--ink);}
.m-item.is-sale > .m-row > a, .m-item.is-current > .m-row > a{color:var(--red);}
.m-toggle{flex:none;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:none;border:0;padding:0;color:var(--ink-soft);}
.m-toggle-full{flex:1;width:auto;height:auto;justify-content:space-between;padding:13px 4px;font-size:15px;font-weight:600;color:var(--ink);text-align:left;}
.m-chev{width:16px;height:16px;transition:transform .2s ease;}
.m-toggle[aria-expanded="true"] .m-chev{transform:rotate(180deg);}
.m-sub{padding-left:14px;}
.m-sub .m-row > a, .m-sub .m-row > .m-label, .m-sub .m-toggle-full{font-size:14px;font-weight:500;padding:11px 4px;}
.m-sub .m-item:not(.is-current) > .m-row > a{color:var(--ink-soft);}
.drawer-head{display:flex;align-items:center;justify-content:space-between;}
.drawer-title{margin:0;font-family:var(--font-display);font-size:16px;font-weight:700;letter-spacing:-.01em;}
.close-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;background:none;flex:none;}

.mini-cart-items{display:flex;flex-direction:column;gap:14px;margin:20px 0;flex:1;}
.mini-cart-item{display:flex;gap:12px;align-items:center;}
.mini-cart-item img{width:56px;height:56px;object-fit:contain;background:var(--plate);border:1px solid var(--plate-line);border-radius:10px;padding:6px;flex:none;}
.mini-cart-item .mci-info{flex:1;min-width:0;}
.mini-cart-item .mci-title{font-size:13px;font-weight:600;line-height:1.3;}
.mini-cart-item .mci-meta{font-size:12px;color:var(--ink-soft);font-family:var(--font-mono);margin-top:2px;}
.mini-cart-item a.remove{color:var(--ink-soft);font-size:18px;line-height:1;flex:none;}
.mini-cart-item a.remove:hover{color:var(--red);}
.mini-cart-empty{color:var(--ink-soft);font-size:14px;padding:30px 0;text-align:center;}
.mini-cart-foot{border-top:1px solid var(--line);padding-top:18px;display:flex;flex-direction:column;gap:12px;}
.mini-cart-subtotal{display:flex;justify-content:space-between;font-weight:700;font-family:var(--font-mono);}

/* ---------- WooCommerce: breadcrumbs, archive header, pagination ---------- */
.woocommerce-breadcrumb{font-size:12.5px;color:var(--ink-soft);padding:18px 0 0;}
.woocommerce-breadcrumb a{color:var(--ink-soft);}
.woocommerce-breadcrumb a:hover{color:var(--red);}
.archive-head{padding:28px 0 8px;}
.archive-head h1{font-size:clamp(24px,3vw,32px);}
.page-title, .woocommerce-products-header__title{font-family:var(--font-display);font-size:clamp(24px,3vw,32px);padding:28px 0 8px;margin:0;}
.search-results{padding-bottom:60px;}
.search-results .page-title span{color:var(--red);}
.search-result-post{max-width:760px;margin:0 0 40px;padding-bottom:40px;border-bottom:1px solid var(--line);}
.search-result-post img{border-radius:var(--radius-sm);margin-bottom:16px;}
.search-result-post h2{font-size:20px;margin-bottom:10px;}
.search-result-post h2 a:hover{color:var(--red);}
.term-description{color:var(--ink-soft);font-size:14px;max-width:70ch;margin:8px 0 0;}
.term-description a, .term-seo-text a, .archive-description a{color:var(--red);text-decoration:underline;text-underline-offset:2px;}
.term-description a:hover, .term-seo-text a:hover, .archive-description a:hover{color:var(--ink);}
/* Category "Texte SEO" (Produits > Catégories), below the product grid. */
.term-seo-text{max-width:820px;margin:60px 0 20px;padding-top:40px;border-top:1px solid var(--line);color:var(--ink-soft);font-size:15px;line-height:1.7;}
.term-seo-text > :first-child{margin-top:0;}
.term-seo-text h2{font-size:clamp(20px,2.4vw,24px);color:var(--ink);margin:32px 0 12px;}
.term-seo-text h3{font-size:18px;color:var(--ink);margin:24px 0 10px;}
.term-seo-text p{margin:0 0 14px;}
.term-seo-text ul, .term-seo-text ol{padding-left:20px;margin:0 0 14px;}
.term-seo-text strong{color:var(--ink);}
/* Blog category/tag archives (index.php). */
.archive-header{margin-bottom:40px;}
.archive-description{color:var(--ink-soft);}
span.onsale{background:var(--red);color:#fff;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px;border-radius:100px;position:absolute;top:16px;left:16px;z-index:3;}
.woocommerce-result-count, .woocommerce-ordering{font-size:13px;color:var(--ink-soft);}
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 0 30px;border-bottom:1px solid var(--line);margin-bottom:36px;}
.woocommerce-ordering select{border:1.5px solid var(--line);border-radius:100px;padding:9px 16px;background:var(--surface);color:var(--ink);font-size:13px;}
.woocommerce-pagination{margin:50px 0 0;}
.woocommerce-pagination ul{list-style:none;display:flex;gap:6px;padding:0;margin:0;justify-content:center;}
.woocommerce-pagination .page-numbers{display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 8px;border-radius:100px;border:1px solid var(--line);font-size:13px;font-weight:600;}
.woocommerce-pagination .page-numbers.current{background:var(--black);color:#fff;border-color:var(--black);}
.woocommerce-pagination a.page-numbers:hover{border-color:var(--red);color:var(--red);}

/* ---------- WooCommerce: single product ---------- */
.single-product div.product{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start;padding:36px 0 0;}
.single-product div.product > .woocommerce-tabs,
.single-product div.product > .related.products,
.single-product div.product > .up-sells.upsells{grid-column:1 / -1;}
.woocommerce-product-gallery{position:relative;max-width:440px;opacity:1 !important;}
.woocommerce-product-gallery__wrapper{background:var(--plate);border:1px solid var(--plate-line);border-radius:var(--radius-card);overflow:hidden;display:flex;flex-direction:column;gap:1px;}
.woocommerce-product-gallery__image{position:relative;aspect-ratio:1/1;overflow:hidden;}
.woocommerce-product-gallery__image a{display:block;width:100%;height:100%;}
.woocommerce-product-gallery img{width:100%;height:100%;object-fit:contain;display:block;}
.woocommerce-product-gallery__trigger{position:absolute;top:14px;right:14px;z-index:3;width:38px;height:38px;border-radius:50%;background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;opacity:.9;}
.woocommerce-product-gallery__trigger:hover{opacity:1;border-color:var(--red);}
.woocommerce-product-gallery__trigger img{width:16px;height:16px;object-fit:contain;}

/* Main-photo + thumbnails, built in JS on top of WooCommerce's own gallery
   markup (see theme.js) — only kicks in once JS has actually run, so a plain
   stacked gallery is still the (functional, if plainer) fallback. */
.woocommerce-product-gallery__wrapper.js-gallery{flex-direction:row;flex-wrap:wrap;gap:0;}
.woocommerce-product-gallery__wrapper.js-gallery .woocommerce-product-gallery__image{display:none;width:100%;}
.woocommerce-product-gallery__wrapper.js-gallery .woocommerce-product-gallery__image.is-active{display:block;}
.gallery-thumbs{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;}
.gallery-thumb{width:70px;height:70px;padding:5px;flex:none;border-radius:12px;border:1.5px solid var(--plate-line);background:var(--plate);cursor:pointer;}
.gallery-thumb img{width:100%;height:100%;object-fit:contain;display:block;}
.gallery-thumb:hover{border-color:var(--ink-soft);}
.gallery-thumb.is-active{border-color:var(--red);}

.summary.entry-summary .product_title{font-size:clamp(24px,2.6vw,32px);margin-bottom:10px;}
.summary.entry-summary .price{font-family:var(--font-mono);font-size:26px;font-weight:700;margin:14px 0;display:block;}
.summary.entry-summary .price del{font-size:16px;color:var(--ink-soft);opacity:1;margin-right:10px;}
.summary.entry-summary .price ins{text-decoration:none;color:var(--red);}
.summary.entry-summary .stock{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:6px 12px;border-radius:100px;background:var(--paper-dim);margin-bottom:18px;}
.bb-purchase-limit-note{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:6px 12px;border-radius:100px;background:var(--paper-dim);color:var(--red);margin:0 0 18px;}
.summary.entry-summary .stock.out-of-stock{color:var(--red);}
.summary.entry-summary .stock.in-stock, .summary.entry-summary .stock:not(.out-of-stock){color:#1f7a4d;}
.summary.entry-summary .woocommerce-product-details__short-description{color:var(--ink-soft);font-size:14.5px;margin-bottom:22px;}
.summary.entry-summary .product_meta{margin-top:24px;font-size:12.5px;color:var(--ink-soft);}
.summary.entry-summary .product_meta > span{display:block;margin-bottom:4px;}
.summary.entry-summary .product_meta a{color:var(--ink-soft);}
.summary.entry-summary .product_meta a:hover{color:var(--red);}

/* form.cart is flex for a simple product, whose only children are the
   quantity stepper and the add-to-cart button — but a variable product's
   form has a variations <table> and the price/stock/quantity block as
   direct children too, and that same flex row was forcing the table to sit
   beside them instead of above them. Scope the row layout to where it
   belongs on each. */
form.cart:not(.variations_form){display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:26px;}
.variations_form.cart{margin-bottom:26px;}
/* A <table> row centers cells on their tallest content by default, but a
   plain text label next to a <select> (which carries its own 12px padding
   from the generic select rule) still won't LOOK aligned unless both are
   explicitly centered on the same axis — hence flex on the row instead of
   relying on table layout. */
table.variations{width:100%;margin-bottom:18px;}
table.variations tbody, table.variations tr{display:block;}
table.variations tr{display:flex;align-items:center;flex-wrap:wrap;gap:12px;}
table.variations tr + tr{margin-top:10px;}
table.variations th.label{display:block;text-align:left;font-weight:600;font-size:13.5px;white-space:nowrap;padding:0;}
table.variations td.value{display:flex;align-items:center;gap:12px;padding:0;flex:1;min-width:0;}
table.variations td.value select{max-width:280px;}
a.reset_variations{font-size:12.5px;color:var(--ink-soft);}
a.reset_variations:hover{color:var(--red);}
.woocommerce-variation-add-to-cart{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.woocommerce-variation-price{margin-bottom:10px;}
.woocommerce-variation-price .price{font-family:var(--font-mono);font-size:22px;font-weight:700;}
.quantity{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:100px;overflow:hidden;height:52px;}
.quantity .qty-step{width:42px;height:100%;border:0;background:transparent;font-size:18px;font-weight:600;color:var(--ink);}
.quantity .qty-step:hover{background:var(--paper-dim);}
.quantity input.qty{width:48px;height:100%;border:0;text-align:center;font-family:var(--font-mono);font-size:14px;background:transparent;color:var(--ink);-moz-appearance:textfield;}
.quantity input.qty::-webkit-outer-spin-button, .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
form.cart button.single_add_to_cart_button{height:52px;padding:0 30px;border-radius:100px;background:var(--red);color:var(--on-red);font-weight:700;font-size:14.5px;border:0;transition:background .15s ease, transform .15s ease;}
form.cart button.single_add_to_cart_button:hover{background:var(--red-deep);transform:translateY(-1px);}

.trust-mini{display:flex;flex-wrap:wrap;gap:10px 22px;margin:22px 0;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.trust-mini span{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-soft);}
.trust-mini .icon{width:16px;height:16px;color:var(--red);}

.woocommerce-tabs{margin-top:50px;}
.woocommerce-tabs ul.tabs{list-style:none;display:flex;gap:6px;padding:0;margin:0 0 26px;border-bottom:1px solid var(--line);}
.woocommerce-tabs ul.tabs li{margin:0;}
.woocommerce-tabs ul.tabs li a{display:block;padding:12px 20px;font-weight:600;font-size:13.5px;border-bottom:2px solid transparent;margin-bottom:-1px;}
.woocommerce-tabs ul.tabs li.active a{color:var(--red);border-color:var(--red);}
.woocommerce-tabs .panel{max-width:70ch;font-size:14.5px;color:var(--ink-soft);line-height:1.7;}
.woocommerce-tabs .panel h2{font-size:20px;color:var(--ink);}

.related.products, .up-sells.upsells{padding:60px 0 0;}
.related.products > h2, .up-sells.upsells > h2{font-size:clamp(22px,2.8vw,28px);margin-bottom:28px;}

.sticky-atc{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -8px 24px -12px rgba(0,0,0,.15);padding:12px 18px;display:none;align-items:center;justify-content:space-between;gap:14px;}
.sticky-atc.visible{display:flex;}
.sticky-atc .sat-info{min-width:0;}
.sticky-atc .sat-title{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sticky-atc .sat-price{font-family:var(--font-mono);color:var(--red);font-weight:700;font-size:14px;}
.sticky-atc .btn{flex:none;}

/* ---------- WooCommerce: cart & checkout ---------- */
table.shop_table{width:100%;border-collapse:collapse;margin-bottom:30px;}
table.shop_table th{text-align:left;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);padding:0 12px 14px;border-bottom:1px solid var(--line);}
table.shop_table td{padding:16px 12px;border-bottom:1px solid var(--line);font-size:14px;}
table.shop_table td.product-thumbnail img{width:64px;height:64px;object-fit:contain;background:var(--plate);border:1px solid var(--plate-line);border-radius:10px;padding:6px;}
table.shop_table td.actions{text-align:right;}
.cart_totals{background:var(--paper-dim);border-radius:var(--radius-card);padding:28px;max-width:420px;margin-left:auto;}
.cart_totals table{width:100%;}
.cart_totals table td, .cart_totals table th{padding:12px 0;border-bottom:1px solid var(--line);font-size:14px;}
.cart_totals .order-total .amount{font-family:var(--font-mono);font-weight:700;font-size:18px;}
.wc-proceed-to-checkout .checkout-button{display:flex;width:100%;margin-top:18px;}
.coupon{display:flex;gap:10px;flex-wrap:wrap;}
.coupon input{flex:1;min-width:180px;height:48px;border-radius:100px;border:1.5px solid var(--line);padding:0 18px;background:var(--surface);color:var(--ink);}
.coupon button, input.button, button.button, a.button, .wc-forward, .checkout-button{
  height:48px;padding:0 22px;border-radius:100px;background:var(--black);color:#fff;font-weight:600;font-size:13.5px;border:0;transition:background .15s ease;
}
.coupon button:hover, input.button:hover, button.button:hover, a.button:hover{background:var(--red);color:#fff;}

.woocommerce-checkout .col2-set, .woocommerce-checkout #customer_details{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;}
.woocommerce-checkout .form-row{margin-bottom:16px;}
.woocommerce-checkout label{display:block;font-size:12.5px;font-weight:600;margin-bottom:6px;color:var(--ink-soft);}
.woocommerce-checkout input.input-text, .woocommerce-checkout select, .woocommerce-checkout textarea{
  width:100%;border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--surface);color:var(--ink);font-family:var(--font-body);font-size:14px;
}
.woocommerce-checkout input.input-text:focus, .woocommerce-checkout select:focus{border-color:var(--red);outline:0;}
#order_review, .woocommerce-checkout-review-order{background:var(--paper-dim);border-radius:var(--radius-card);padding:26px;}
.place-order{margin-top:20px;}
.place-order #place_order{width:100%;height:54px;font-size:15px;background:var(--red);}
.place-order #place_order:hover{background:var(--red-deep);}

/* ---------- WooCommerce: Cart & Checkout BLOCKS ----------
   lesbullesbizarres.fr uses the block-based Cart/Checkout (not the
   [woocommerce_cart]/[woocommerce_checkout] shortcodes), confirmed by
   inspecting the live site — these selectors are WooCommerce Blocks' own
   stable component classes, shared between the Cart and Checkout blocks. */
.wc-block-components-main{min-width:0;}
.wc-block-components-sidebar{min-width:340px;}
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-components-sidebar > div > .wc-block-components-totals-wrapper:last-child{
  background:var(--paper-dim);border-radius:var(--radius-card);
}
.wc-block-cart__sidebar, .wc-block-checkout__sidebar{background:var(--paper-dim);border-radius:var(--radius-card);padding:26px;}
.wc-block-cart__totals-title, .wc-block-components-checkout-order-summary__title-text{font-family:var(--font-display);font-size:18px;}
.wc-block-components-totals-item__label, .wc-block-components-totals-item__value{font-size:14px;}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-checkout-order-summary__title-price{font-family:var(--font-mono);font-weight:700;font-size:17px;}

.wc-block-cart-items, .wc-block-cart-items__header{border-color:var(--line);}
.wc-block-cart-items__header th{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px solid var(--line);}
.wc-block-cart-items__row{border-bottom:1px solid var(--line);}
.wc-block-cart-item__image img{background:var(--plate);border:1px solid var(--plate-line);border-radius:10px;padding:6px;}
.wc-block-components-product-name{font-weight:600;font-size:14px;color:var(--ink);}
.wc-block-cart-item__total .price, .wc-block-cart-item__prices .price{font-family:var(--font-mono);}

.wc-block-components-quantity-selector{border:1.5px solid var(--line);border-radius:100px;overflow:hidden;height:44px;}
.wc-block-components-quantity-selector__button{background:transparent;color:var(--ink);}
.wc-block-components-quantity-selector__button:hover{background:var(--paper-dim);}
.wc-block-components-quantity-selector__input{font-family:var(--font-mono);}
.wc-block-cart-item__remove-link{color:var(--ink-soft);}
.wc-block-cart-item__remove-link:hover{color:var(--red);}

.wc-block-components-checkout-step__title{font-family:var(--font-display);font-size:18px;}
.wc-block-components-checkout-step{border-color:var(--line);}
.wc-block-components-text-input input, .wc-block-components-address-form select,
.wc-block-components-radio-control__input{
  border-color:var(--line) !important;border-radius:10px !important;
}
.wc-block-components-text-input input:focus{border-color:var(--red) !important;box-shadow:0 0 0 1px var(--red) !important;}

.wc-block-components-button.wp-element-button, .wp-block-woocommerce-checkout .wp-element-button{
  background:var(--red);color:var(--on-red);border-radius:100px;font-weight:700;
}
.wc-block-components-button.wp-element-button:hover{background:var(--red-deep);color:var(--on-red);}
.wc-block-components-checkout-return-to-cart-button{background:transparent !important;color:var(--ink) !important;}

/* Text inputs / selects: WC Blocks' own stylesheet ships a hard-coded white
   background that wins over the generic input[type=...] rule below (loaded
   after ours), so these need !important the same way border-color already
   does above. */
.wc-block-components-text-input input,
.wc-blocks-components-select__select{
  background:var(--surface) !important;color:var(--ink) !important;
}
.wc-block-components-text-input label,
.wc-blocks-components-select__label{color:var(--ink-soft) !important;}
.wc-blocks-components-select__container{border-color:var(--line) !important;border-radius:10px !important;background:var(--surface) !important;}
.wc-blocks-components-select__select-arrow{fill:var(--ink-soft) !important;}

/* Checkbox / radio: native inputs already pick up accent-color from the
   generic input[type=checkbox],input[type=radio] rule; only the option
   "card" wrapper around each radio needs theme borders/backgrounds. */
.wc-block-components-radio-control__option{
  border:1.5px solid var(--line) !important;border-radius:10px;background:var(--surface);
  margin-bottom:10px;
}
.wc-block-components-radio-control__option-checked,
.wc-block-components-radio-control__option:has(input:checked){border-color:var(--red) !important;}
.wc-block-components-checkbox__label{color:var(--ink);}
/* WC Blocks sets appearance:none on the checkbox (so accent-color has no
   effect) and draws its own checkmark as a sibling SVG, absolutely
   positioned with no offsets — it lands wherever the checkbox would sit in
   normal flow, so resize/decorate the input in place rather than changing
   the label's display type, which would move that "flow position" out from
   under it. */
.wc-block-components-checkbox__input{
  appearance:none;-webkit-appearance:none;
  width:18px;height:18px;margin-right:10px;vertical-align:middle;
  border:1.5px solid var(--line) !important;border-radius:4px;background:var(--surface);
  cursor:pointer;
}
.wc-block-components-checkbox__input:checked{background:var(--red);border-color:var(--red) !important;}
.wc-block-components-checkbox__mark{fill:#fff;}
/* A third-party field (newsletter opt-in) wraps its label text in a <div> —
   block-level by default, so it forces a line break after the checkbox
   instead of sitting next to it like every native WC Blocks checkbox does. */
.wc-block-components-checkbox__label div{display:inline;}

/* Order summary line item: without an explicit width, WC Blocks' own flex
   column shrinks the title/price/meta to their own fitted width instead of
   the full available column — with a narrow sidebar that leaves so little
   room the product name wraps mid-word. Stretching them to 100% gives the
   text its full line length back before it needs to wrap at all. */
.wc-block-components-order-summary-item__description{min-width:0;flex:1 1 auto !important;}
.wc-block-components-order-summary-item__description .wc-block-components-product-name,
.wc-block-components-order-summary-item__description .wc-block-cart-item__prices,
.wc-block-components-order-summary-item__description .wc-block-components-product-metadata{
  width:100% !important;max-width:100% !important;
}

/* Coupon / totals accordion panel */
.wc-block-components-panel__button{color:var(--ink);font-weight:600;}
.wc-block-components-totals-coupon__button{background:var(--black) !important;color:#fff !important;border-radius:100px !important;}
.wc-block-components-totals-coupon__button:hover{background:var(--red) !important;}
.wc-block-components-totals-coupon input{background:var(--surface) !important;color:var(--ink) !important;border-color:var(--line) !important;border-radius:10px !important;}

/* ---------- WooCommerce: my account ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0 0 30px;padding:0 0 16px;display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--line);}
.woocommerce-account .woocommerce-MyAccount-navigation a{display:inline-flex;padding:10px 16px;border-radius:100px;font-weight:600;font-size:13px;background:var(--paper-dim);}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{background:var(--black);color:#fff;}
.woocommerce-account .woocommerce-MyAccount-content{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:30px;}
.account-wrap{padding:40px 0 60px;}

/* Empty-cart "new in store" block: an older-generation WooCommerce block
   (wc-block-grid__*, not the wc-block-components-* family styled
   elsewhere), inserted as page content when the Cart page was set up —
   never touched by the theme, so it was using raw browser defaults. */
.wp-block-woocommerce-empty-cart-block{text-align:center;padding:20px 0 40px;}
.wc-block-grid__products{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(150px,1fr)) !important;gap:20px;list-style:none;padding:0;margin:28px 0 0;}
.wc-block-grid__product{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;text-align:left;}
.wc-block-grid__product-image{background:var(--plate) !important;aspect-ratio:1/1;display:flex !important;align-items:center;justify-content:center;padding:16px;}
.wc-block-grid__product-image img{object-fit:contain;max-height:100%;width:auto;}
.wc-block-grid__product-title{display:block;padding:14px 14px 0;font-weight:600;font-size:14px;color:var(--ink);}
.wc-block-grid__product-price{display:block;padding:6px 14px 0;font-family:var(--font-mono);color:var(--ink);}
.wc-block-grid__product-add-to-cart{padding:14px;}
.wc-block-grid__product .wp-block-button__link{background:var(--red) !important;color:var(--on-red) !important;border-radius:100px !important;width:100%;text-align:center;padding:10px !important;font-weight:600;}
.wc-block-grid__product .wp-block-button__link:hover{background:var(--red-deep) !important;}

/* Login / register (logged-out My Account) — never styled before: it isn't
   wrapped in .woocommerce-MyAccount-content like the logged-in dashboard,
   so it was falling back to bare, unspaced form rows. */
.woocommerce-account .col2-set{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;}
.woocommerce-account .col2-set .col-1, .woocommerce-account .col2-set .col-2{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:30px;
}
.woocommerce-account .form-row{margin-bottom:16px;}
.woocommerce-account .form-row label{display:block;font-weight:600;font-size:13.5px;margin-bottom:6px;}
.woocommerce-account .woocommerce-form-login__rememberme{display:flex;align-items:center;gap:8px;font-weight:400;margin-bottom:0;}
.woocommerce-account .woocommerce-LostPassword{margin-top:14px;font-size:13px;}
.woocommerce-account .woocommerce-LostPassword a{color:var(--ink-soft);text-decoration:underline;}
.woocommerce-account .woocommerce-LostPassword a:hover{color:var(--red);}

/* The eye-icon toggle button WooCommerce's own JS injects into the password
   field relies on WooCommerce's default stylesheet for its icon and
   positioning — this theme disables that stylesheet everywhere else, so it
   was rendering as a bare, unstyled, unpositioned <button> (an empty grey
   pill sitting below the field instead of an icon inside it). */
.password-input{position:relative;display:block;}
.password-input input{padding-right:44px;width:100%;}
.show-password-input{
  position:absolute;top:50%;right:4px;transform:translateY(-50%);
  width:34px;height:34px;border:0;background-color:var(--ink-soft);padding:0;cursor:pointer;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  -webkit-mask-size:20px;mask-size:20px;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;
}
.show-password-input:hover{background-color:var(--ink);}
.show-password-input.display-password{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.94 10.94 0 0112 20c-7 0-11-8-11-8a21.8 21.8 0 015.06-6.06M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a21.8 21.8 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.94 10.94 0 0112 20c-7 0-11-8-11-8a21.8 21.8 0 015.06-6.06M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a21.8 21.8 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}

/* ---------- Blog / page basics ---------- */
.content-wrap{max-width:760px;margin:0 auto;padding:60px 28px;}
.content-wrap h1{font-size:clamp(26px,3.4vw,38px);margin-bottom:8px;}
.content-wrap img{border-radius:var(--radius-sm);max-width:100%;height:auto;}
.content-wrap .post-meta{color:var(--ink-soft);font-size:13px;margin-bottom:24px;}
.content-wrap .post-meta a{color:var(--ink-soft);}
.content-wrap a:not(.btn):not(.post-meta a){color:var(--red);text-decoration:underline;text-underline-offset:2px;}
.content-wrap a:not(.btn):not(.post-meta a):hover{color:var(--ink);}
.content-wrap .post-meta a:hover{color:var(--red);}

/* Long-form article typography (guides, buying-advice posts) — the_content()
   only gets the sitewide h1-h4 font-family rule otherwise, so paragraphs,
   lists and blockquotes need their own rhythm or a long guide reads as a
   wall of undifferentiated text. */
.content-wrap p{margin:0 0 20px;}
.content-wrap h2{font-size:clamp(22px,2.6vw,28px);margin:48px 0 16px;}
.content-wrap h3{font-size:clamp(18px,2vw,22px);margin:36px 0 14px;}
.content-wrap h2 + h3{margin-top:8px;}
.content-wrap ul, .content-wrap ol{margin:0 0 20px;padding-left:1.3em;}
.content-wrap li{margin-bottom:8px;}
.content-wrap li > ul, .content-wrap li > ol{margin-top:8px;margin-bottom:0;}
.content-wrap strong{font-weight:700;}
.content-wrap hr{border:0;border-top:1px solid var(--line);margin:40px 0;}
.content-wrap blockquote{
  margin:28px 0;padding:4px 24px;border-left:3px solid var(--red);
  color:var(--ink-soft);font-size:16px;font-style:italic;
}
.content-wrap blockquote p:last-child{margin-bottom:0;}
.content-wrap figure{margin:28px 0;}
.content-wrap figcaption{color:var(--ink-soft);font-size:13px;margin-top:8px;text-align:center;}
.content-wrap table{width:100%;border-collapse:collapse;margin:0 0 24px;font-size:14.5px;}
.content-wrap th, .content-wrap td{padding:10px 14px;border-bottom:1px solid var(--line);text-align:left;}
.content-wrap th{font-family:var(--font-display);font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);}
/* A WordPress "Buttons" block in the article body (e.g. "Voir les protections
   premium →") should read as a theme CTA, not a bare underlined link. */
.content-wrap .wp-block-button__link{
  display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:100px;
  background:var(--red);color:var(--on-red) !important;font-weight:600;font-size:14.5px;
  text-decoration:none !important;
}
.content-wrap .wp-block-button__link:hover{background:var(--red-deep);}
.content-wrap .wp-block-button.is-style-outline .wp-block-button__link{
  background:transparent;border:1.5px solid var(--line);color:var(--ink) !important;
}
.content-wrap .wp-block-button.is-style-outline .wp-block-button__link:hover{border-color:var(--red);color:var(--red) !important;}

/* ---------- Generic forms (contact/buyback/etc. from any plugin) ----------
   Class-based selectors elsewhere (search box, newsletter, WooCommerce
   checkout, quantity stepper) are all more specific than these bare
   type-attribute rules, so they keep winning where they already apply —
   this is just the fallback for any other form on the site. */
input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
input[type="number"], input[type="date"], input[type="password"], textarea, select{
  border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;
  background:var(--surface);color:var(--ink);font-family:var(--font-body);font-size:14px;
  width:100%;max-width:100%;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus,
input[type="number"]:focus, input[type="date"]:focus, input[type="password"]:focus, textarea:focus, select:focus{
  border-color:var(--red);outline:0;
}
input[type="checkbox"], input[type="radio"]{accent-color:var(--red);width:16px;height:16px;}
.content-wrap label, form label{font-weight:600;font-size:13.5px;}
button[type="submit"], input[type="submit"]{
  background:var(--red);color:var(--on-red);border:0;border-radius:100px;
  padding:13px 26px;font-weight:700;font-size:14px;cursor:pointer;transition:background .15s ease;
}
button[type="submit"]:hover, input[type="submit"]:hover{background:var(--red-deep);}

/* ---------- Third-party widgets ----------
   PayPal / Apple Pay / Stripe render their own branded buttons (often inside
   a cross-origin iframe the theme can't reach at all) — keep their wrapping
   containers neutral so the generic form/button rules above never paint a
   background or border underneath them. No wishlist feature on this site
   either, whichever plugin adds it. */
[id*="paypal" i], [class*="paypal" i],
[id*="apple-pay" i], [class*="apple-pay" i], [class*="applepay" i],
[id*="stripe" i], [class*="stripe" i],
.payment_box, .wc-block-components-payment-method-content{
  background:transparent !important;border:0 !important;
}
.yith-wcwl-add-to-wishlist, .tinvwl-add-to-wishlist-container, .addify-scw-button,
[class*="wishlist" i]{display:none !important;}

/* Related products / recently viewed: not WooCommerce's own (already unhooked
   in inc/woocommerce-hooks.php) but a third-party carousel plugin ("gpsc--"
   prefixed markup) that injects its own, independent of the theme. CSS is
   the only reliable way to remove it without touching that plugin's code. */
#gpsc--related, [id*="gpsc--related" i],
[id*="gpsc--recent" i], [class*="gpsc--recent" i],
[id*="recently-viewed" i], [id*="recently_viewed" i],
[class*="recently-viewed" i], [class*="recently_viewed" i]{display:none !important;}

/* Same plugin also injects its own extra-photos slider *inside* the product
   gallery wrapper (id="gpsc--gallery") — this one earns its keep (it's the
   only place a product's 2nd/3rd photo shows once this plugin has taken
   them over) so it gets restyled to match the theme instead of removed. */
#gpsc--gallery{margin-top:14px;padding:0 !important;}
#gpsc--gallery .swiper-slide{
  width:70px !important;height:70px;flex:none;border-radius:12px;overflow:hidden;
  border:1.5px solid var(--plate-line);background:var(--plate);
}
#gpsc--gallery .swiper-slide img{width:100%;height:100%;object-fit:contain;}
#gpsc--gallery .swiper-pagination{display:none !important;}

/* ---------- Newsletter admin note ---------- */
.nl-form.nl-done{opacity:.7;}

@media (max-width:960px){
  .bento{grid-template-columns:minmax(0,1fr);}
  .bento-main{min-height:360px;}
  ul.products, .grid-products{grid-template-columns:repeat(3,minmax(0,1fr));}
  .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .single-product div.product{grid-template-columns:minmax(0,1fr);gap:30px;}
  .woocommerce-product-gallery{width:100%;max-width:440px;margin:0 auto;}
  .woocommerce-checkout .col2-set, .woocommerce-checkout #customer_details{grid-template-columns:minmax(0,1fr);}
  .woocommerce-account .col2-set{grid-template-columns:minmax(0,1fr);gap:20px;}
  .header-actions .btn-buyback{display:none;}
}
@media (max-width:820px){
  nav.primary{display:none;}
  .burger{display:flex;}
  .site-search{display:none;}
  .trust .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
}
@media (max-width:640px){
  section{padding:52px 0;}
  .wrap{padding:0 18px;}
  .carousel-slide{aspect-ratio:4/5;}
  .carousel-overlay{padding:22px;}
  .carousel-nav{width:38px;height:38px;}
  ul.products, .grid-products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .foot-grid{grid-template-columns:minmax(0,1fr);gap:28px;}
  .header-row{height:72px;gap:12px;}
  .logo-badge img{width:42px;height:42px;}
  .logo-word{font-size:15px;}
  .bento-main{flex-direction:column;align-items:flex-start;gap:20px;padding:32px 24px;min-height:0;}
  .bento-copy{max-width:none;}
  .bento-shot-wrap{
    display:block;position:relative;right:auto;bottom:auto;top:auto;left:auto;
    width:240px;height:240px;align-self:center;
  }
  .bento-product-shot{width:200px;}
  .nl-form{flex-direction:column;background:none;border:0;padding:0;gap:10px;}
  .nl-form input{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:100px;padding:13px 18px;}
  .foot-bottom{flex-direction:column;align-items:flex-start;}
  table.shop_table thead{display:none;}
  table.shop_table tr{display:flex;flex-wrap:wrap;padding:14px 0;}
  .cart_totals{max-width:none;}
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}

/* ---------- Cookie consent (inc/consent.php, assets/js/consent.js) ---------- */
/* Bottom-left card on desktop, bottom sheet on phones. Never a full-screen
   wall: the CNIL rules out blocking the site until the visitor chooses. */
.cc{position:fixed;left:20px;bottom:20px;z-index:90;width:min(440px, calc(100vw - 40px));max-height:calc(100vh - 40px);overflow-y:auto;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--shadow-lg);padding:22px;display:flex;flex-direction:column;gap:14px;}
.cc[hidden]{display:none;}
.cc-title{margin:0;font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:-.01em;outline:none;}
.cc-text{margin:0;font-size:13.5px;line-height:1.55;color:var(--ink-soft);}
.cc-text a{color:var(--red);text-decoration:underline;text-underline-offset:2px;}
.cc-prefs{display:flex;flex-direction:column;border-top:1px solid var(--line);}
.cc-prefs[hidden]{display:none;}
.cc-pref{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer;}
.cc-pref-copy{display:flex;flex-direction:column;gap:2px;font-size:13px;line-height:1.45;color:var(--ink-soft);}
.cc-pref-copy strong{font-size:14px;color:var(--ink);}
/* The real checkbox stays in the page (keyboard, screen readers) but
   invisible; the switch next to it is drawn from its state. input.cc-check
   so it outranks the theme's global input[type="checkbox"] sizing. */
input.cc-check{position:absolute;right:0;top:50%;width:40px;height:24px;margin:-12px 0 0;opacity:0;cursor:pointer;}
.cc-switch{flex:none;position:relative;width:40px;height:24px;border-radius:100px;background:var(--line);transition:background .15s ease;pointer-events:none;}
.cc-switch::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .15s ease;}
.cc-check:checked + .cc-switch{background:var(--red);}
.cc-check:checked + .cc-switch::after{transform:translateX(16px);}
.cc-check:disabled + .cc-switch{opacity:.55;}
.cc-check:disabled{cursor:not-allowed;}
.cc-check:focus-visible + .cc-switch{outline:2px solid var(--red);outline-offset:2px;}
.cc-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;}
/* Refuse and accept: one shared style, on purpose (equal prominence). */
.cc-btn{background:var(--ink);color:var(--paper);padding:12px 14px;font-size:14px;}
.cc-btn:hover{background:var(--red);color:var(--on-red);}
.cc-link{grid-column:1 / -1;justify-self:center;background:none;border:0;padding:4px;font-size:13px;font-weight:600;color:var(--ink-soft);text-decoration:underline;text-underline-offset:2px;}
.cc-link:hover{color:var(--red);}
.cc-link[hidden], .cc-save[hidden]{display:none;}
.cc-save{grid-column:1 / -1;padding:12px 14px;font-size:14px;}
.foot-cookies{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer;}
.foot-cookies:hover{color:#fff;}
@media (max-width:640px){
  .cc{left:0;right:0;bottom:0;width:100%;max-height:85vh;border-radius:var(--radius-card) var(--radius-card) 0 0;border-width:1px 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom));}
}