/* MG Vape – en-tête de catégorie / marque + filtres en pastilles */
.mgvh{position:relative;overflow:hidden;margin:18px auto 22px;max-width:1320px;border-radius:26px;padding:30px 34px 26px;color:#fff;
  background:radial-gradient(ellipse 55% 120% at 92% 40%,rgba(227,6,19,.5),transparent 60%),linear-gradient(115deg,#0b0b0e 0%,#1a0507 60%,#2a0609 100%)}
.mgvh:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 2px,transparent 2px 36px);pointer-events:none}
.mgvh>*{position:relative}
.mgvh-top{display:flex;align-items:center;gap:22px}
.mgvh-logo{flex:none;width:96px;height:96px;border-radius:22px;background:#fff;display:grid;place-items:center;padding:10px;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.mgvh-logo img{max-width:100%;max-height:100%;object-fit:contain}
.mgvh-crumb{font:600 12px/1 Poppins,sans-serif;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,255,.55)}
.mgvh-crumb a{color:rgba(255,255,255,.75)!important;text-decoration:none!important}
.mgvh h1{margin:8px 0 0!important;font:italic 900 clamp(38px,5vw,64px)/.9 'Barlow Condensed',Poppins,sans-serif!important;text-transform:uppercase;color:#fff!important;letter-spacing:-.5px;border:0!important;padding:0!important;background:none!important}
.mgvh h1:before,.mgvh h1:after{display:none!important}
.mgvh-count{display:inline-flex;align-items:center;gap:8px;margin-top:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:7px 14px;font:600 13px/1 Poppins}
.mgvh-count b{color:#ffc83d}
/* Groupes de filtres */
.mgvh-filters{margin-top:22px;display:grid;gap:12px}
.mgvh-g{display:flex;align-items:flex-start;gap:14px}
.mgvh-g>span{flex:none;display:flex;align-items:center;gap:8px;width:150px;padding-top:8px;font:800 12px/1 Poppins;letter-spacing:1.5px;text-transform:uppercase;color:#ffc83d}
.mgvh-g>span img{width:22px;height:22px;filter:invert(1);opacity:.85}
.mgvh-chips{display:flex;flex-wrap:wrap;gap:8px}
.mgvh-chip{height:36px;padding:0 15px;border-radius:999px;border:1.5px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;font:600 13px/1 Poppins;cursor:pointer;transition:all .15s;white-space:nowrap}
.mgvh-chip:hover{border-color:#fff;background:rgba(255,255,255,.14)}
.mgvh-chip.on{background:#e30613;border-color:#e30613;box-shadow:0 6px 16px rgba(227,6,19,.5)}
.mgvh-more{background:none;border:0;color:rgba(255,255,255,.7);font:700 12.5px Poppins;text-decoration:underline;cursor:pointer;height:36px}
.mgvh-g .mgvh-chip.x{display:none}.mgvh-g.open .mgvh-chip.x{display:inline-block}
.mgvh-reset{justify-self:start;margin-left:164px;background:none;border:0;color:#ff8d93;font:700 12.5px Poppins;cursor:pointer}
body.mgvh-on .page-heading-wrapper{position:absolute!important;left:-99999px!important;top:0;width:1px;height:1px;overflow:hidden}   /* l'en-tête d'origine reste dans la page (filtres du module) mais invisible */
@media (max-width:767px){.mgvh{border-radius:0;margin:0 0 16px;padding:22px 16px}.mgvh-top{gap:14px}.mgvh-logo{width:68px;height:68px;border-radius:16px}
  .mgvh-g{flex-direction:column;gap:8px}.mgvh-g>span{width:auto;padding:0}.mgvh-chips{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none;padding-bottom:2px}.mgvh-reset{margin-left:0}}
.mgvh-orig{position:static!important;left:auto!important;max-width:1320px;margin:0 auto 20px}
.mgvh-filters:empty{display:none}
/* recherche dans un groupe de filtres */
.mgvh-q{display:inline-flex;align-items:center;position:relative;margin:0}
.mgvh-q:before{content:"";position:absolute;left:14px;top:50%;width:11px;height:11px;border:2px solid #ffc83d;border-radius:50%;transform:translateY(-60%)}
.mgvh-q:after{content:"";position:absolute;left:24px;top:58%;width:6px;height:2px;background:#ffc83d;transform:rotate(45deg)}
.mgvh-q input{height:40px;width:220px;border-radius:999px;border:1.5px solid rgba(255,200,61,.55);background:rgba(0,0,0,.35);color:#fff;padding:0 16px 0 38px;font:600 13px Poppins;outline:none;-webkit-appearance:none;box-shadow:none}
.mgvh-q input::placeholder{color:#aaa}
.mgvh-q input:focus{border-color:#ffc83d;background:rgba(0,0,0,.55)}
.mgvh-q.empty input{border-color:#e30613}
.mgvh-chip.hid{display:none!important}
.mgvh-g.qon .mgvh-chip.x:not(.hid){display:inline-block!important}
.mgvh-g.qon .mgvh-more{display:none!important}
@media (max-width:767px){.mgvh-q,.mgvh-q input{width:100%}}

/* ===== CHARTE « SOUS VERRE » · FOND BLANC ===== */
.mgvh{color:#070707!important;font-family:Inter,sans-serif;border-radius:32px!important;border:1.5px solid rgba(255,255,255,.9);
  background:radial-gradient(120% 70% at 18% 0%,rgba(255,255,255,.85),rgba(255,255,255,0) 58%),linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.3))!important;
  -webkit-backdrop-filter:blur(24px) saturate(190%);backdrop-filter:blur(24px) saturate(190%);
  box-shadow:inset 0 1.5px 0 #fff,inset 0 0 24px rgba(255,255,255,.45),0 0 0 1px rgba(7,7,7,.05),0 30px 60px -22px rgba(7,7,7,.24)}
.mgvh:before{display:none!important}
.mgvh-crumb{font:700 12px Inter!important;letter-spacing:.24em!important;color:#8e8e93!important}.mgvh-crumb a{color:#8e8e93!important}
.mgvh h1{font:800 clamp(40px,5vw,60px)/1 'Manrope',Inter,sans-serif!important;letter-spacing:-.045em!important;text-transform:none!important;color:#070707!important}
.mgvh-logo{border-radius:24px!important;box-shadow:inset 0 0 0 1px rgba(7,7,7,.05),0 10px 24px -14px rgba(7,7,7,.35)!important}
.mgvh-count{background:#111111!important;border:0!important;color:#ffffff!important;font:700 13px Inter!important}.mgvh-count b{color:#ffffff!important}
.mgvh-g>span{color:#8e8e93!important;font:700 11.5px Inter!important;letter-spacing:.22em!important}
.mgvh-g>span img{filter:none!important;opacity:.7}
.mgvh-chip{color:#070707!important;font:600 13px Inter!important;border:1px solid #fff!important;background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.5))!important;box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(7,7,7,.06),0 6px 14px -10px rgba(7,7,7,.25)}
.mgvh-chip:hover{background:#fff!important}
.mgvh-chip.on{background:#111111!important;border-color:transparent!important;box-shadow:0 8px 18px -10px rgba(7,7,7,.7)!important;color:#ffffff}
.mgvh-more{color:#2a5fe8!important;font:700 12.5px Inter!important}
.mgvh-reset{color:#a8741a!important;font:700 12.5px Inter!important}
.mgvh-q:before{border-color:#8e8e93!important}.mgvh-q:after{background:#8e8e93!important}
.mgvh-q input{background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.5))!important;border:1px solid #fff!important;color:#070707!important;font:500 13px Inter!important;box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(7,7,7,.06)}
.mgvh-q input:focus{box-shadow:0 0 0 3px rgba(42,95,232,.6)!important}
.mgvh-q.empty input{box-shadow:0 0 0 2px #c38f2a!important}
/* filtre sélectionné : pilule saphir, texte blanc + coche, toujours lisible */
html body .mgvh-chip.on,html body .mgvh-chip.on *{color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important}
html body .mgvh-chip.on{background:linear-gradient(115deg,rgba(255,255,255,0) 18%,rgba(255,255,255,.16) 40%,rgba(255,255,255,0) 60%),linear-gradient(135deg,#2453dc,#2a5fe8 50%,#4775f0)!important;border-color:#2a5fe8!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),0 10px 22px -10px rgba(42,95,232,.7)!important;padding-left:14px!important}
html body .mgvh-chip.on:before{content:"✓";display:inline-block;margin-right:7px;font-weight:800;color:#fff}
/* 3.0.6 — compteur « N produits » en bleu saphir */
html body .mgvh-count{background:linear-gradient(135deg,#2453dc,#2a5fe8 55%,#4775f0)!important;border:1px solid rgba(255,255,255,.25)!important;color:#fff!important;box-shadow:0 6px 18px rgba(42,95,232,.28),inset 0 1px 0 rgba(255,255,255,.35)!important}
html body .mgvh-count b{color:#fff!important}
/* 3.2.0 — en-tête de catégorie « barre compacte » : fil d'Ariane, titre, nombre et tri sur une ligne */
html body .mgvh.mgvh-a{padding:14px 18px 14px 26px!important;border-radius:24px!important;margin:0 auto 18px!important;min-height:0!important}
html body .mgvh.mgvh-a .mgvh-top{display:flex!important;align-items:center!important;gap:18px!important;flex-wrap:wrap}
html body .mgvh.mgvh-a .mgvh-top>div:not(.mgvh-tools){display:flex;align-items:center;gap:16px;flex-wrap:wrap;min-width:0}
html body .mgvh.mgvh-a .mgvh-logo{width:52px!important;height:52px!important;border-radius:14px!important;flex:none}
html body .mgvh.mgvh-a .mgvh-crumb{font-size:10.5px!important;letter-spacing:.16em!important}
html body .mgvh.mgvh-a h1{margin:0!important;font:800 30px/1 Manrope,Inter,sans-serif!important;letter-spacing:-.04em!important}
html body .mgvh.mgvh-a .mgvh-count{margin:0!important;height:30px;padding:0 13px!important}
html body .mgvh.mgvh-a .mgvh-filters:not(:empty){margin-top:14px!important;padding-top:14px;border-top:1px solid rgba(20,30,70,.08)}
.mgvh-tools{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mgvh-tools form{display:flex!important;align-items:center;gap:8px;margin:0!important;padding:0!important;float:none!important;width:auto!important}
.mgvh-tools label{margin:0!important;font:600 13px Inter,sans-serif!important;color:#5b5f6b!important;white-space:nowrap;padding:0!important;float:none!important}
.mgvh-tools .selector,.mgvh-tools .select{float:none!important;width:auto!important;margin:0!important;display:inline-block!important}
.mgvh-tools select{height:38px!important;min-width:0;width:auto!important;padding:0 34px 0 14px!important;border-radius:999px!important;border:1px solid rgba(20,30,70,.12)!important;font:700 13px Inter,sans-serif!important;color:#111!important;cursor:pointer;-webkit-appearance:none;appearance:none;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/14px!important;box-shadow:0 4px 10px rgba(20,30,70,.05)!important}
.mgvh-tools form.nbrItemPage span,.mgvh-tools .nbrItemPage span{font:600 13px Inter,sans-serif!important;color:#5b5f6b!important}
@media (max-width:767px){
html body .mgvh.mgvh-a{padding:14px 14px!important;border-radius:20px!important;margin:0 10px 14px!important}
html body .mgvh.mgvh-a .mgvh-top{gap:10px!important}
html body .mgvh.mgvh-a .mgvh-top>div:not(.mgvh-tools){gap:6px 12px}
html body .mgvh.mgvh-a .mgvh-crumb{flex-basis:100%}
html body .mgvh.mgvh-a h1{font-size:24px!important}
.mgvh-tools{margin-left:0;width:100%;justify-content:space-between}
.mgvh-tools select{height:36px!important;font-size:12.5px!important}
.mgvh-tools label{font-size:12px!important}
}
html body .mgvh-tools form,html body .mgvh-tools form>div,html body .mgvh-tools .form-group{display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;margin:0!important;padding:0!important}
html body .mgvh-tools label{display:inline-block!important;margin:0!important}
html body .mgvh-tools select{min-width:170px!important;max-width:240px}
@media (max-width:767px){html body .mgvh-tools form,html body .mgvh-tools form>div{flex:1}html body .mgvh-tools select{min-width:0!important;flex:1;max-width:none}}
html body .mgvh-tools .select,html body .mgvh-tools .selector,html body .mgvh-tools .hstack{display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;width:auto!important}
html body .mgvh-tools .select select{width:auto!important}
/* 3.2.1 — filtres sur téléphone : les pastilles passent à la ligne (plus rien de coupé au bord) */
@media (max-width:767px){html body .mgvh .mgvh-chips{flex-wrap:wrap!important;overflow:visible!important;width:100%!important;gap:7px!important}html body .mgvh .mgvh-chip{height:34px!important;padding:0 13px!important;font-size:12.5px!important}}
