/* BDX Configurator v5.0 — Template Print.com */
:root{--bdx:#FCAF3B;--bdx-dk:#E89B2A;--bdx-lt:#FFF8E1;--bdx-txt:#1a1a1a;--bdx-mid:#555;--bdx-dim:#888;--bdx-brd:#e5e7eb;--bdx-bg:#f7f8fa;--bdx-w:#fff;--bdx-r:10px;--bdx-rs:6px;--bdx-eco:#16a34a;--bdx-warn:#f59e0b;--bdx-red:#dc2626;--bdx-ok:#16a34a}

/* === Theme overrides === */
body.bdx-configured-product .bdx-product-layout{display:block!important}
body.bdx-configured-product .bdx-product-main{max-width:100%!important;width:100%!important}
body.bdx-configured-product aside.bdx-product-aside,
body.bdx-configured-product #bdx-recap-col{display:none!important}
/* v2.1 SHELL — page produit quasi full-width (garde-fou 1800px sur écrans ultra-larges).
   Les autres pages (panier, compte) sont centrées à 1400px par le thème (main.css). */
body.bdx-configured-product .bdx-content,
body.bdx-configured-product .bdx-woo-wrap{max-width:1800px!important;width:100%!important;margin-left:auto!important;margin-right:auto!important;padding:0 clamp(16px,3vw,48px)!important;box-sizing:border-box}
body.bdx-configured-product .woocommerce-product-gallery{display:none!important}
body.bdx-configured-product .product_meta,
body.bdx-configured-product .sku_wrapper,
body.bdx-configured-product .posted_in,
body.bdx-configured-product .tagged_as,
body.bdx-configured-product .woocommerce-product-details__short-description:empty,
body.bdx-configured-product .single_add_to_cart_button,
body.bdx-configured-product form.cart .quantity,
body.bdx-configured-product form.cart{display:none!important}

/* === Root === */
#bdx-configurator{margin:0 0 3rem;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:var(--bdx-txt);font-size:14px;line-height:1.5}
.bx-load{display:flex;align-items:center;justify-content:center;padding:3rem;gap:10px;color:var(--bdx-dim)}
.bx-spin{width:20px;height:20px;border:2.5px solid var(--bdx-brd);border-top-color:var(--bdx);border-radius:50%;animation:bx-sp .7s linear infinite;display:inline-block}
@keyframes bx-sp{to{transform:rotate(360deg)}}
.bx-err{padding:2rem;text-align:center;color:var(--bdx-red);background:#fef2f2;border:1px solid #fecaca;border-radius:var(--bdx-r)}

/* === Main grid ===
   Layout piloté par CONTAINER QUERIES (largeur RÉELLE dispo), pas par le viewport :
   gère correctement la nav latérale fixe (240px) quelle que soit la taille d'écran. */
#bdx-configurator{container-type:inline-size;container-name:bxcfg}
.bx-lay{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:clamp(24px,3vw,48px);align-items:start}
/* En dessous de ~760px de large dispo → 1 colonne (récap passé en statique plus bas, après sa règle de base).
   NB: avec la nav fixe de 240px, le configurateur ne fait que ~947px à 1366px de viewport ;
   un seuil à 960px le faisait basculer en 1 colonne sur tous les laptops. Le récap fait 360px,
   donc 2 colonnes restent viables jusqu'à ~760px de large dispo. */
@container bxcfg (max-width:760px){ .bx-lay{grid-template-columns:1fr;gap:20px} }
.bx-main{display:flex;flex-direction:column;gap:0;min-width:0;container-type:inline-size;container-name:bxmain}

/* === Pack d'options en colonnes équilibrées (masonry CSS) ===
   Remplace « 1 groupe API = 1 colonne » : chaque propriété est une carte
   indivisible, répartie sur 1→3 colonnes selon la largeur réelle (bxmain). */
.bx-pack{column-gap:28px;columns:1}
@container bxmain (min-width:520px){.bx-pack{columns:2}}
@container bxmain (min-width:820px){.bx-pack{columns:3}}
/* Layout « quantité en dernier » (façon Print) : options en masonry à gauche,
   colonne QUANTITÉ (+versions) FIXE à droite — toujours la dernière colonne. */
.bx-pack3{display:grid;grid-template-columns:minmax(0,1fr);gap:0 28px}
/* Seuil 520 px : .bx-main ne fait que ~610 px sur desktop (nav + récap sticky autour). */
@container bxmain (min-width:520px){.bx-pack3{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}}
.bx-pack3 .bx-pack-main{columns:1}
@container bxmain (min-width:820px){.bx-pack3 .bx-pack-main{columns:2}}
.bx-qtycol .bx-p{margin:0 0 22px}
.bx-pack>.bx-p{break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;display:inline-block;width:100%;vertical-align:top;margin:0 0 22px}
.bx-pack .bx-photo-card{padding:0}
.bx-pack .bx-photo-card .bx-gallery{max-width:100%}
.bx-pack .bx-versions{border:none;padding:0;margin:0}
.bx-pack .bx-versions-card .bx-sec-t{margin-bottom:12px}

/* === En-tête produit : galerie photo + description (façon Print) === */
.bx-head{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:32px;align-items:start;padding:0 0 24px;border-bottom:1px solid var(--bdx-brd);margin-bottom:4px}
@container bxmain (max-width:640px){.bx-head{grid-template-columns:1fr;gap:18px}}
.bx-head-info{min-width:0}
.bx-gallery{display:flex;flex-direction:column;gap:10px}
.bx-gal-main{position:relative;display:block;width:100%;aspect-ratio:1/1;border:1px solid var(--bdx-brd);border-radius:14px;overflow:hidden;background:var(--bdx-bg);cursor:zoom-in;padding:12px}
.bx-gal-main img{width:100%;height:100%;object-fit:contain;display:block}
.bx-gal-zoom{position:absolute;bottom:10px;right:10px;width:30px;height:30px;border-radius:8px;background:rgba(17,17,17,.55);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px}
.bx-gal-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:8px}
.bx-gal-th{padding:0;border:1.5px solid var(--bdx-brd);border-radius:9px;overflow:hidden;background:var(--bdx-bg);cursor:pointer;aspect-ratio:1/1}
.bx-gal-th img{width:100%;height:100%;object-fit:contain;display:block}
.bx-gal-th.sel{border-color:var(--bdx);box-shadow:0 0 0 1.5px var(--bdx) inset}
.bx-desc{font-size:14px;line-height:1.6;color:var(--bdx-txt)}
.bx-desc-sub{font-size:15px;font-weight:700;color:var(--bdx-txt);margin:0 0 10px}
.bx-desc-bullets{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.bx-desc-bullets li{position:relative;padding-left:24px;color:var(--bdx-txt)}
.bx-desc-bullets li::before{content:"";position:absolute;left:2px;top:7px;width:8px;height:8px;border-radius:50%;background:var(--bdx)}
.bx-desc-txt{margin:10px 0 0;color:var(--bdx-mid)}

/* Galerie seule (sans description à côté) : largeur contenue, alignée à gauche */
.bx-head-solo{display:block;border-bottom:1px solid var(--bdx-brd);padding-bottom:24px;margin-bottom:4px}
.bx-head-solo .bx-gallery{max-width:440px}

/* Onglet « Description » (SEO) sobre, replié, rendu en bas de page */
.bx-desc-acc{padding:0}
.bx-desc-acc>.bx-desc-acc-h{list-style:none;cursor:pointer;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--bdx-mid);padding:18px 0;display:flex;align-items:center;justify-content:space-between}
.bx-desc-acc>.bx-desc-acc-h::-webkit-details-marker{display:none}
.bx-desc-acc>.bx-desc-acc-h::after{content:"+";font-size:18px;font-weight:400;color:var(--bdx-dim)}
.bx-desc-acc[open]>.bx-desc-acc-h::after{content:"\2013"}
.bx-desc-acc-body{padding:0 0 20px}
.bx-desc-acc-body .bx-desc{font-size:13.5px;color:var(--bdx-mid)}
.bx-desc-acc-body .bx-desc-sub{font-size:14px}

/* === Bloc 3 colonnes façon Print (photo+indications | options métier | quantité+versions) === */
.bx-top3{display:grid;grid-template-columns:1fr;gap:28px;padding:0 0 24px;border-bottom:1px solid var(--bdx-brd)}
@container bxmain (min-width:560px){.bx-top3{grid-template-columns:1fr 1fr}.bx-top3>.bx-col:nth-child(3){grid-column:1/-1}}
@container bxmain (min-width:820px){.bx-top3{grid-template-columns:1.05fr 1fr 1fr}.bx-top3>.bx-col:nth-child(3){grid-column:auto}}
.bx-top3>.bx-col{display:flex;flex-direction:column;gap:24px;min-width:0}
.bx-top3 .bx-sec{border:none;padding:0}
.bx-top3 .bx-p{margin-bottom:0}
.bx-top3 .bx-gallery{max-width:100%}
.bx-prod-bullets{margin:2px 0 0}
.bx-prod-bullets .bx-desc-bullets{gap:8px}
.bx-prod-bullets .bx-desc-bullets li{font-size:13.5px;color:var(--bdx-txt)}
/* Caractéristiques produit (marque/support/coupe) sous la photo */
.bx-specs-list{margin:14px 0 0;border-top:1px solid var(--bdx-brd);padding-top:12px;display:flex;flex-direction:column;gap:7px}
.bx-spec-row{display:flex;justify-content:space-between;gap:12px;font-size:13px;line-height:1.3}
.bx-spec-k{color:var(--bdx-mid);flex-shrink:0}
.bx-spec-v{color:var(--bdx-txt);font-weight:600;text-align:right}

/* === Accessoires (façon Print) === */
.bx-acc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.bx-acc-card{border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden;background:var(--bdx-w);display:flex;flex-direction:column}
.bx-acc-img{aspect-ratio:1/1;background:var(--bdx-bg);display:flex;align-items:center;justify-content:center}
.bx-acc-img img{width:100%;height:100%;object-fit:cover;display:block}
.bx-acc-body{padding:12px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.bx-acc-name{font-size:13px;font-weight:600;color:var(--bdx-txt);line-height:1.3;flex:1}
.bx-acc-price{font-size:14px;font-weight:700;color:var(--bdx-txt)}
.bx-acc-suf{font-size:11px;font-weight:500;color:var(--bdx-dim)}
.bx-acc-add{border:1.5px solid var(--bdx);background:#fff;color:var(--bdx-dk);border-radius:var(--bdx-rs);padding:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .12s}
.bx-acc-add:hover{background:var(--bdx);color:#fff}
.bx-acc-add.added{background:var(--bdx-ok,#16a34a);border-color:var(--bdx-ok,#16a34a);color:#fff;cursor:default}
.bx-acc-add:disabled{opacity:.7;cursor:default}
/* Carte accessoire « Tendeurs » : quantité manuelle + bouton auto « tendeurs nécessaires » */
.bx-acc-qty{display:flex;align-items:center;gap:6px}
.bx-acc-qb{width:30px;height:32px;flex-shrink:0;border:1.5px solid var(--bdx-brd);background:#fff;color:var(--bdx-dk);border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;line-height:1}
.bx-acc-qb:hover{border-color:var(--bdx);color:var(--bdx)}
.bx-acc-qin{width:46px;height:32px;text-align:center;border:1.5px solid var(--bdx-brd);border-radius:8px;font-size:14px;-moz-appearance:textfield}
.bx-acc-qin::-webkit-outer-spin-button,.bx-acc-qin::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.bx-acc-qty .bx-acc-add{flex:1;padding:8px 6px}
.bx-acc-tend{margin-top:8px;border:1.5px dashed var(--bdx);background:#fff7ed;color:var(--bdx-dk);border-radius:var(--bdx-rs);padding:9px;font-size:12.5px;font-weight:700;cursor:pointer;transition:all .12s}
.bx-acc-tend:hover{background:var(--bdx);color:#fff;border-style:solid}
/* Accessoire inclus dans la commande (case cochée) → carte mise en avant */
.bx-acc-card.on{border-color:var(--bdx);box-shadow:0 0 0 2px rgba(255,122,0,.12)}
.bx-acc-suf{font-size:11px;font-weight:500;color:var(--bdx-dim)}
.bx-acc-inc{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--bdx-txt);cursor:pointer;user-select:none}
.bx-acc-inc input{width:17px;height:17px;accent-color:var(--bdx);cursor:pointer;flex-shrink:0}
.bx-acc-lt{margin-left:auto;font-size:13px;font-weight:800;color:var(--bdx-dk);white-space:nowrap}
/* Détail « Produit / Accessoires » dans le récap prix sticky */
.bx-acc-brk{display:flex;justify-content:space-between;font-size:12px;color:var(--bdx-mid);margin-bottom:3px}
.bx-acc-brk span:last-child{font-weight:700;color:var(--bdx-txt)}

/* === Textile : couleur/taille/quantité + positions d'impression === */
.bx-variants{display:flex;flex-direction:column;gap:22px}
.bx-var-colors{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}
.bx-var-sizes{display:flex;flex-wrap:wrap;gap:8px}
.bx-sizepill{border:1.5px solid var(--bdx-brd);background:#fff;border-radius:9px;padding:9px 15px;font-size:13px;cursor:pointer;transition:all .12s;color:var(--bdx-txt);font-weight:500}
.bx-sizepill:hover{border-color:var(--bdx);background:var(--bdx-lt)}
.bx-sizepill.sel{border-color:var(--bdx);background:var(--bdx);color:#fff;font-weight:700}
/* Textile en-tête 2 colonnes (photo | positions déroulants) */
.bx-tex-top{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:32px;align-items:start;padding-top:0}
@container bxmain (max-width:720px){.bx-tex-top{grid-template-columns:minmax(0,1fr);gap:20px}}
.bx-tex-photo,.bx-tex-pos{min-width:0}
.bx-tex-photo .bx-gallery{max-width:440px}
.bx-pos-table{display:flex;flex-direction:column;gap:8px}
.bx-pos-hint{font-size:12px;color:var(--bdx-dim);margin:-2px 0 8px}
.bx-pos-trow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 12px;border:1px solid var(--bdx-brd);border-radius:var(--bdx-r);background:var(--bdx-w);transition:opacity .15s,border-color .15s,background .15s}
.bx-pos-trow.off{opacity:.62;background:#fafafa}
.bx-pos-trow.on{border-color:var(--bdx);background:var(--bdx-lt)}
.bx-pos-chkw{display:flex;align-items:center;gap:11px;cursor:pointer;min-width:0;margin:0}
.bx-pos-chk{width:18px;height:18px;flex:0 0 auto;accent-color:var(--bdx);cursor:pointer;margin:0}
.bx-pos-tname{font-size:13px;font-weight:600;color:var(--bdx-txt);display:flex;flex-direction:column;gap:2px}
.bx-pos-tdim{font-size:11px;font-weight:400;color:var(--bdx-dim)}
.bx-pos-tright{flex:0 0 auto;display:flex;align-items:center;justify-content:flex-end;min-width:90px;text-align:right}
.bx-pos-sel{max-width:230px;flex-shrink:0;margin:0}
.bx-pos-tone{font-size:12.5px;color:var(--bdx-mid)}
.bx-pos-tprice{font-size:13px;font-weight:700;color:var(--bdx-dk)}
.bx-positions{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.bx-pos-row{border:1px solid var(--bdx-brd);border-radius:var(--bdx-r);padding:12px 14px;background:var(--bdx-w)}
.bx-pos-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px;gap:8px}
.bx-pos-name{font-size:13px;font-weight:700;color:var(--bdx-txt)}
.bx-pos-dim{font-size:11px;color:var(--bdx-dim);white-space:nowrap}

/* === Rangée d'icônes pli/déroulage (façon Print), pleine largeur en tête === */
.bx-iconrow{padding-top:0;padding-bottom:24px}
.bx-iconrow .bx-p{margin-bottom:0}
.bx-iconrow .bx-grid{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))}
.bx-iconrow .bx-gi{padding:14px 8px}
.bx-iconrow .bx-gi-img{width:64px;height:64px}
.bx-iconrow .bx-gi .bx-ic{width:60px;height:60px}

/* === Lasure & swatches pleine largeur : tuiles plus grandes (façon Print) === */
.bx-full .bx-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}
.bx-full .bx-gi-img{width:100%;height:62px;object-fit:cover;border-radius:7px}

/* === Lightbox galerie === */
.bx-lb .bx-lb-box{position:relative;background:#fff;border-radius:14px;max-width:min(880px,92vw);width:100%;padding:18px}
.bx-lb-main{width:100%;aspect-ratio:1/1;max-height:70vh;background:var(--bdx-bg);border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.bx-lb-main img{max-width:100%;max-height:100%;object-fit:contain}
.bx-lb-thumbs{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;justify-content:center}
.bx-lb-th{width:56px;height:56px;padding:0;border:1.5px solid var(--bdx-brd);border-radius:8px;overflow:hidden;background:var(--bdx-bg);cursor:pointer}
.bx-lb-th img{width:100%;height:100%;object-fit:cover;display:block}
.bx-lb-th.sel{border-color:var(--bdx);box-shadow:0 0 0 1.5px var(--bdx) inset}
.bx-lb-x{position:absolute;top:10px;right:12px;z-index:2;width:32px;height:32px;border:none;border-radius:8px;background:rgba(17,17,17,.06);font-size:22px;line-height:1;cursor:pointer;color:#111}

/* === Sections === */
.bx-sec{border-bottom:1px solid var(--bdx-brd);padding:24px 0}
.bx-sec:first-child{padding-top:0}
.bx-sec:last-child{border-bottom:none}
.bx-sec-t{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--bdx-mid);margin:0 0 16px}
.bx-upload-note{margin:0 0 14px;padding:11px 14px;background:var(--bdx-lt);border:1px solid var(--bdx-brd);border-radius:var(--bdx-r);font-size:13px;line-height:1.5;color:var(--bdx-txt)}
.bx-specs{margin:4px 0 14px;padding:12px 14px;background:var(--bdx-bg);border:1px solid var(--bdx-brd);border-radius:var(--bdx-r)}
.bx-specs-t{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--bdx-mid);margin:0}
.bx-specs-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;cursor:pointer;padding:0;font-family:inherit}
.bx-specs-chev{transition:transform .2s;color:var(--bdx-dim);font-size:15px}
.bx-specs.open .bx-specs-chev{transform:rotate(180deg)}
.bx-specs-body{display:none;margin-top:10px}
.bx-specs.open .bx-specs-body{display:block}
.bx-specs .bx-rl{font-size:12.5px}
.bx-specs-help{display:inline-block;margin-top:10px;font-size:12px;color:var(--bdx);text-decoration:underline}
.bx-versions .bx-ver-row{display:flex;align-items:center;gap:10px;background:var(--bdx-bg);border:1px solid var(--bdx-brd);border-radius:var(--bdx-r);padding:10px 14px}
.bx-versions .bx-ver-lbl{flex:1;font-weight:600;color:var(--bdx-txt)}
.bx-versions .bx-ver-val{min-width:42px;text-align:center;font-weight:700;font-size:16px;background:#fff;border:1px solid var(--bdx-brd);border-radius:6px;padding:4px 8px}
.bx-versions .bx-ver-btn{width:34px;height:34px;border:none;border-radius:6px;background:var(--bdx);color:#fff;font-size:18px;font-weight:700;cursor:pointer;line-height:1}
.bx-versions .bx-ver-btn:disabled{opacity:.4;cursor:not-allowed}
.bx-versions .bx-ver-row.disabled{opacity:.7}
.bx-versions .bx-ver-hint{font-size:12px;color:var(--bdx-dim);margin-top:8px;line-height:1.5}

/* === 3 Columns === */
.bx-cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
@container bxmain (max-width:720px){.bx-cols3{grid-template-columns:1fr 1fr;gap:20px}}
@container bxmain (max-width:460px){.bx-cols3{grid-template-columns:1fr;gap:16px}}
.bx-col{display:flex;flex-direction:column;gap:16px}

/* === Lot de colonnes avec Quantité épinglée à droite (v2.1) === */
.bx-props{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:28px;align-items:start}
.bx-props-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:start}
@container bxmain (max-width:620px){.bx-props{grid-template-columns:1fr}}
@container bxmain (max-width:460px){.bx-props-l{grid-template-columns:1fr;gap:16px}}

/* === Property === */
.bx-p{margin-bottom:6px}
.bx-p-lbl{font-size:13px;font-weight:700;color:var(--bdx-txt);margin:0 0 8px}
.bx-p-dim{font-size:12px;color:var(--bdx-dim,#6b7280);margin:-4px 0 8px}

/* === List items (1 option per line) === */
.bx-list{border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden;margin-bottom:6px}
.bx-li{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid #f3f4f6;cursor:pointer;font-size:13px;transition:all .1s;line-height:1.3}
.bx-li:last-child{border-bottom:none}
.bx-li:hover{background:var(--bdx-lt)}
.bx-li.sel{background:var(--bdx);color:#fff;font-weight:600;border-bottom-color:var(--bdx-dk)}
.bx-li .name{flex:1;min-width:0;overflow-wrap:break-word;word-break:normal}
.bx-li .df{font-size:11px;color:var(--bdx-dim);white-space:nowrap;flex-shrink:0}.bx-li .df.pos{color:var(--bdx-red)}.bx-li .df.neg{color:var(--bdx-ok)}
.bx-li.sel .df{color:rgba(255,255,255,.7)}
.bx-li .chk{font-weight:700;flex-shrink:0}
.bx-li .w{color:var(--bdx-warn);font-size:13px;flex-shrink:0}
.bx-li .eco{color:var(--bdx-eco);font-size:11px;flex-shrink:0}
.bx-li.inc{color:var(--bdx-dim)}
.bx-li.inc:hover{border-color:var(--bdx-warn);background:#fffbeb}

/* === Vignette photo d'option (option-info / Contentful) === */
.bx-li-thumb{width:40px;height:40px;flex-shrink:0;border-radius:6px;overflow:hidden;background:#f3f4f6;border:1px solid #e5e7eb;display:flex;align-items:center;justify-content:center}
.bx-li-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.bx-li.has-thumb{padding-top:8px;padding-bottom:8px}
.bx-li.sel .bx-li-thumb{border-color:rgba(255,255,255,.5)}
.bx-li.sel .bx-sw{border-color:rgba(255,255,255,.55)}

/* === Color swatches === */
.bx-sw{width:18px;height:18px;border-radius:50%;border:1px solid rgba(0,0,0,.15);flex-shrink:0}
/* Grille de vignettes/icônes (viewMode icons/image : déroulage étiquettes, mode de pliage…) */
.bx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:10px;margin-bottom:6px}
.bx-gi{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 8px;border:1.5px solid var(--bdx-brd,#e5e7eb);border-radius:10px;background:#fff;cursor:pointer;font-size:12px;line-height:1.25;text-align:center;color:#374151;transition:border-color .12s,background .12s,box-shadow .12s}
.bx-gi:hover{border-color:var(--bdx,#FCAF3B);background:var(--bdx-lt,#fff7ed)}
.bx-gi.sel{border-color:var(--bdx,#FCAF3B);background:var(--bdx-lt,#fff7ed);box-shadow:0 0 0 1.5px var(--bdx,#FCAF3B) inset}
.bx-gi.inc{opacity:.45}
.bx-gi-img{width:54px;height:54px;object-fit:contain;border-radius:6px}
.bx-gi .bx-ic{width:46px;height:46px;color:#6b7280}
.bx-gi.sel .bx-ic{color:var(--bdx,#FCAF3B)}
.bx-gi-n{display:block;word-break:break-word}
.bx-gi-pr{font-size:11px;color:var(--bdx-dim,#9ca3af)}
.bx-gi-pr.pos{color:var(--bdx-red,#dc2626)}.bx-gi-pr.neg{color:var(--bdx-ok,#16a34a)}
.bx-gi-chk{position:absolute;top:6px;right:7px;font-size:12px;font-weight:800;color:var(--bdx,#FCAF3B)}
@media(max-width:600px){.bx-grid{grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:8px}.bx-gi-img,.bx-gi .bx-ic{width:42px;height:42px}}

/* === "Voir tout" === */
.bx-sa{display:inline-flex;padding:8px 14px;border:1.5px dashed var(--bdx-brd);border-radius:var(--bdx-rs);background:none;cursor:pointer;font-size:12px;color:var(--bdx-dk);transition:all .15s;margin-top:4px}
.bx-sa:hover{border-color:var(--bdx);background:var(--bdx-lt)}

/* === Method tag in quantity header === */
.bx-meth-tag{font-size:11px;font-weight:600;color:var(--bdx-mid);background:var(--bdx-bg);padding:3px 10px;border-radius:10px;text-transform:none;letter-spacing:0}
.bx-q-other{padding:10px 14px;font-size:13px;color:var(--bdx-dim);border-top:1px solid #f3f4f6;text-align:center;cursor:pointer}
.bx-q-other:hover{background:var(--bdx-lt)}

/* === Quantity list === */
.bx-qt{display:flex;flex-direction:column;gap:0;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden;margin-bottom:4px}
.bx-q{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border:none;border-bottom:1px solid #f3f4f6;background:var(--bdx-w);cursor:pointer;transition:all .1s;font-size:14px;min-width:0;width:100%}
.bx-q:last-child{border-bottom:none}
.bx-q:hover{background:var(--bdx-lt)}
.bx-q.sel{background:var(--bdx);color:#fff;font-weight:700}
.bx-q.sel .pr{color:rgba(255,255,255,.85)}
.bx-q .n{font-weight:600}
.bx-q .pr{font-size:13px;color:var(--bdx-mid);font-weight:500}
.bx-qmore{display:flex;align-items:center;justify-content:center;padding:10px;border-top:1px solid #f3f4f6;background:none;cursor:pointer;font-size:12px;color:var(--bdx-dk);width:100%}
.bx-qmore:hover{background:var(--bdx-lt)}

/* === Extras: Print.com 3-column cards === */
.bx-ext-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@container bxmain (max-width:720px){.bx-ext-cards{grid-template-columns:1fr 1fr}}
@container bxmain (max-width:460px){.bx-ext-cards{grid-template-columns:1fr}}
.bx-ext-card{border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden;background:var(--bdx-w)}
.bx-ext-card-h{font-size:13px;font-weight:700;color:var(--bdx-txt);padding:14px 16px;border-bottom:1px solid var(--bdx-brd);display:flex;justify-content:space-between;align-items:center}
.bx-ext-card-body{display:flex;flex-direction:column}
.bx-ext-row{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid #f3f4f6;font-size:13px;cursor:pointer;transition:all .1s;background:var(--bdx-w)}
.bx-ext-row:last-child{border-bottom:none}
.bx-ext-row:hover{background:var(--bdx-bg)}
.bx-ext-row.active{color:var(--bdx-dk)}
.bx-ext-row input[type=checkbox]{accent-color:var(--bdx);width:18px;height:18px;flex-shrink:0;cursor:pointer}
.bx-ext-name{flex:1}
.bx-ext-row.multi{flex-wrap:wrap}
.bx-ext-row.multi label{display:flex;align-items:center;gap:10px;flex:1}
.bx-ext-sel{width:100%;margin-top:6px;padding:7px 28px 7px 10px;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-rs);font-size:12px;background:var(--bdx-w);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23888' d='M5 7L1 3h8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;cursor:pointer}
.bx-sel{width:100%;padding:9px 32px 9px 12px;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-rs);background:var(--bdx-w);font-size:13px;color:var(--bdx-txt);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%23888' d='M5 7L1 3h8z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;transition:all .12s}
.bx-sel:hover,.bx-sel:focus{border-color:var(--bdx);outline:none;box-shadow:0 0 0 3px rgba(252,175,59,.12)}
.bx-cb-row{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer;padding:6px 0}
.bx-cb-row input{accent-color:var(--bdx);width:18px;height:18px}

/* ══════════════════════════════════════════════════════
   SERVICE CARDS — Print.com style
   ══════════════════════════════════════════════════════ */
.bx-svc-sub{font-size:12px;color:var(--bdx-mid);margin-bottom:12px}
.bx-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden}
@container bxmain (max-width:560px){.bx-svc-grid{grid-template-columns:1fr}}
.bx-svc-card{padding:16px;background:var(--bdx-w);border-right:1px solid var(--bdx-brd);display:flex;flex-direction:column}
.bx-svc-card:last-child{border-right:none}
.bx-svc-card.sel{background:var(--bdx-ok);color:#fff}
.bx-svc-card.disabled{opacity:.5}
.bx-svc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.bx-svc-name{font-size:14px;font-weight:700}
.bx-svc-chk{width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.bx-svc-desc{font-size:11px;line-height:1.5;margin:0;padding:0 0 0 16px;flex:1}
.bx-svc-desc li{margin-bottom:4px}
.bx-svc-card.sel .bx-svc-desc{color:rgba(255,255,255,.9)}
.bx-svc-price{font-size:13px;font-weight:700;color:var(--bdx-dk);margin-top:10px;padding-top:10px;border-top:1px solid var(--bdx-brd)}
.bx-svc-card.sel .bx-svc-price{color:rgba(255,255,255,.7);border-top-color:rgba(255,255,255,.2)}
.bx-svc-card.disabled .bx-svc-price{color:var(--bdx-dim)}

/* ══════════════════════════════════════════════════════
   DELIVERY — horizontal calendar Print.com style
   ══════════════════════════════════════════════════════ */
.bx-del-tabs{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.bx-del-tab{padding:8px 16px;border:1.5px solid var(--bdx-brd);border-radius:20px;background:var(--bdx-w);cursor:pointer;font-size:12px;color:var(--bdx-mid);transition:all .15s;display:flex;align-items:center;gap:6px}
.bx-del-tab:hover{border-color:var(--bdx)}
.bx-del-tab.sel{border-color:var(--bdx);background:var(--bdx-lt);color:var(--bdx-dk)}
.bx-del-tab strong{color:var(--bdx-dk);font-size:13px}
.bx-cal{display:flex;gap:0;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden}
.bx-cal-day{flex:1;padding:12px 8px;text-align:center;cursor:pointer;border-right:1px solid #f3f4f6;transition:all .1s;background:var(--bdx-w);min-width:0}
.bx-cal-day:last-child{border-right:none}
.bx-cal-day:hover{background:var(--bdx-lt)}
.bx-cal-day.sel{background:var(--bdx);color:#fff}
.bx-cal-j{font-size:10px;text-transform:uppercase;font-weight:600;color:var(--bdx-dim);margin-bottom:2px}
.bx-cal-day.sel .bx-cal-j{color:rgba(255,255,255,.7)}
.bx-cal-d{font-size:20px;font-weight:700;line-height:1.2}
.bx-cal-m{font-size:10px;color:var(--bdx-dim);margin-bottom:6px}
.bx-cal-day.sel .bx-cal-m{color:rgba(255,255,255,.7)}
.bx-cal-p{font-size:11px;font-weight:600;color:var(--bdx-dk)}
.bx-cal-day.sel .bx-cal-p{color:rgba(255,255,255,.85)}
.bx-del-sel{margin-top:12px;padding:12px 16px;background:var(--bdx-bg);border-radius:var(--bdx-rs)}
.bx-del-main{font-size:13px;margin-bottom:8px}

/* ══════════════════════════════════════════════════════
   CARRIER TABLE
   ══════════════════════════════════════════════════════ */
.bx-car-tbl{border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden}
.bx-car-hd{display:grid;grid-template-columns:1fr 1fr 120px 80px;gap:8px;padding:10px 14px;background:var(--bdx-bg);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--bdx-mid);border-bottom:1px solid var(--bdx-brd)}
.bx-car-row{display:grid;grid-template-columns:1fr 1fr 120px 80px;gap:8px;align-items:center;padding:10px 14px;border-bottom:1px solid #f3f4f6;cursor:pointer;font-size:13px;transition:all .1s}
.bx-car-row:last-child{border-bottom:none}
.bx-car-row:hover{background:var(--bdx-lt)}
.bx-car-row.sel{background:var(--bdx);color:#fff;font-weight:600;border-bottom-color:var(--bdx-dk)}
.bx-car-row .cname{font-weight:600}
.bx-car-row .cname small{font-weight:400;color:var(--bdx-dim);font-size:11px}
.bx-car-row.sel .cname small{color:rgba(255,255,255,.7)}
.bx-car-row .ctime{font-size:12px;color:var(--bdx-mid)}
.bx-car-row.sel .ctime{color:rgba(255,255,255,.7)}
.bx-car-row .creli{display:flex;align-items:center;gap:6px;font-size:11px}
.bx-car-row .rbar{width:60px;height:6px;background:#e5e7eb;border-radius:3px;overflow:hidden}
.bx-car-row .rfill{height:100%;background:var(--bdx-ok);border-radius:3px}
.bx-car-row.sel .rbar{background:rgba(255,255,255,.3)}
.bx-car-row.sel .rfill{background:#fff}
.bx-car-row .rdim{color:var(--bdx-dim);font-size:10px}
.bx-car-row .cprice{font-weight:600;text-align:right;font-size:12px}

/* === Cut-off === */
.bx-cutoff{margin-top:10px;padding:12px 16px;background:#FFF8E1;border:1px solid #FCAF3B;border-radius:var(--bdx-rs);font-size:13px;color:#92400e;display:flex;align-items:center;gap:10px}
.bx-cutoff strong{color:var(--bdx-dk)}
.bx-cutoff-cd{margin-top:8px;padding:10px 16px;background:#fff;border:1.5px solid #FCAF3B;border-radius:var(--bdx-rs);font-size:14px;font-weight:800;color:#b45309;display:flex;align-items:center;gap:10px;letter-spacing:.2px}
.bx-cutoff-cd .bx-cd-ic{font-size:16px;line-height:1;animation:bxCdPulse 1.6s ease-in-out infinite}
.bx-cutoff-cd.soon{background:#fef2f2;border-color:#ef4444;color:#b91c1c}
.bx-cutoff-cd.over{background:#f3f4f6;border-color:#d1d5db;color:#6b7280;font-weight:700}
.bx-cutoff-cd.over .bx-cd-ic{animation:none}
@keyframes bxCdPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.65}}

/* === Sidebar === */
.bx-side{position:sticky;top:80px;background:var(--bdx-w);border:1px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden;max-height:calc(100vh - 100px);display:flex;flex-direction:column;box-shadow:0 2px 16px rgba(0,0,0,.06)}
/* < ~760px de large dispo → récap en bloc statique sous les options (après la règle de base pour gagner en cascade). */
@container bxcfg (max-width:760px){.bx-side{position:static;max-height:none;margin-top:8px}}
.bx-side-h{background:var(--bdx-bg);padding:16px 20px;border-bottom:1px solid var(--bdx-brd);flex-shrink:0}
.bx-side-h h2{font-size:16px;font-weight:700;margin:0}.bx-side-h .sku{font-size:10px;color:var(--bdx-dim);margin-top:2px}
.bx-side-b{padding:14px 20px;overflow-y:auto;flex:1;min-height:0}
.bx-rl{display:flex;justify-content:space-between;gap:8px;padding:5px 0;font-size:12px;border-bottom:1px solid #f3f4f6}
.bx-rl:last-child{border:none}
.bx-rl .l{color:var(--bdx-dim);white-space:nowrap}.bx-rl .v{color:var(--bdx-txt);font-weight:600;text-align:right;max-width:170px;word-break:break-word}

/* === Sidebar delivery === */
.bx-del-info{margin-top:10px;padding:10px 12px;background:var(--bdx-bg);border-radius:var(--bdx-rs);font-size:12px}
.bx-del-r{display:flex;justify-content:space-between;padding:3px 0;font-size:11px;margin-top:4px}

/* === Price === */
.bx-pb{margin-top:12px;padding-top:12px;border-top:2px solid var(--bdx-txt)}
.bx-pt{display:flex;justify-content:space-between;align-items:baseline}
.bx-pt span:first-child{font-size:13px;font-weight:600}
.bx-ttc{font-size:22px;font-weight:800;color:var(--bdx-dk)}
.bx-ht{font-size:11px;color:var(--bdx-dim);text-align:right;margin-top:2px}

/* === CTA === */
.bx-side-f{padding:16px 20px;flex-shrink:0;border-top:1px solid var(--bdx-brd)}
.bx-cta{display:block;width:100%;padding:14px;background:var(--bdx);color:#fff;border:none;border-radius:var(--bdx-rs);font-size:14px;font-weight:700;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;text-align:center;transition:all .2s}
.bx-cta:hover{background:var(--bdx-dk);transform:translateY(-1px);box-shadow:0 4px 12px rgba(232,155,42,.35)}
.bx-cta:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
/* Bouton secondaire « Rajouter les tendeurs nécessaires » (bâches/banderoles) */
.bx-cta-tendeur{display:block;width:100%;margin-top:10px;padding:11px;background:#fff;color:var(--bdx-dk);border:1.5px solid var(--bdx);border-radius:var(--bdx-rs);font-size:13px;font-weight:700;cursor:pointer;text-align:center;transition:all .15s}
.bx-cta-tendeur:hover{background:var(--bdx);color:#fff}
.bx-cta-tendeur.added{background:var(--bdx-ok,#16a34a);border-color:var(--bdx-ok,#16a34a);color:#fff;cursor:default}
.bx-cta-tendeur:disabled{opacity:.7;cursor:default}
/* Section « Service opérateur » (maquette graphiste / pose & installation) */
.bx-opsvc{display:flex;flex-direction:column;gap:10px}
.bx-opsvc-row{display:flex;gap:10px;align-items:flex-start;cursor:pointer;padding:12px 14px;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-rs);transition:border-color .12s,background .12s}
.bx-opsvc-row:hover{border-color:var(--bdx)}
.bx-opsvc-chk{margin-top:3px;width:18px;height:18px;flex-shrink:0;cursor:pointer;accent-color:var(--bdx)}
.bx-opsvc-row strong{display:block;font-size:14px;color:var(--bdx-dk)}
.bx-opsvc-d{display:block;font-size:12px;color:#6b7280;margin-top:2px}
.bx-opsvc-warn{margin-top:0}

/* === Barre sticky mobile (page produit) === */
.bx-mobile-bar{display:none}
@media(max-width:768px){
  .bx-mobile-bar{display:flex;align-items:center;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid #e5e7eb;box-shadow:0 -4px 20px rgba(0,0,0,.12);padding:10px 14px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .bx-mb-info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;line-height:1.25}
  .bx-mb-name{font-weight:700;font-size:13px;color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bx-mb-sub{font-size:11.5px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bx-mb-price{font-weight:800;font-size:15px;color:#111;white-space:nowrap}
  .bx-mb-price small{font-size:10px;font-weight:600;color:#6b7280}
  .bx-mobile-bar .bx-mb-cta{width:auto;flex:0 0 auto;padding:11px 18px;font-size:14px;text-transform:none;letter-spacing:0}
  #bdx-configurator{padding-bottom:86px}
}

/* === Modals === */
.bx-mo{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:99999;display:flex;align-items:center;justify-content:center;animation:bx-fi .15s}
@keyframes bx-fi{from{opacity:0}to{opacity:1}}
.bx-md{background:var(--bdx-w);border-radius:var(--bdx-r);max-width:800px;width:94%;max-height:80vh;overflow-y:auto;padding:24px 28px;box-shadow:0 16px 48px rgba(0,0,0,.18);animation:bx-su .2s}
@keyframes bx-su{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}
.bx-md-t{font-size:15px;font-weight:700;margin:0 0 16px;display:flex;justify-content:space-between;align-items:center}
.bx-md-x{background:none;border:none;font-size:20px;cursor:pointer;color:var(--bdx-dim);padding:0;line-height:1}.bx-md-x:hover{color:var(--bdx-txt)}

/* === Modal tabs === */
.bx-tabs{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:16px}
.bx-tab{padding:6px 14px;border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-rs);background:none;cursor:pointer;font-size:12px;transition:all .12s}
.bx-tab:hover{border-color:var(--bdx)}.bx-tab.act{border-color:var(--bdx);background:var(--bdx-lt);font-weight:600}

/* === Modal list (reuses .bx-li) === */
.bx-md .bx-list{border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r);overflow:hidden}
.bx-list-cat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--bdx-mid);padding:10px 14px;background:var(--bdx-bg);border-bottom:1px solid var(--bdx-brd)}

/* === Incompatibility modal === */
.bx-inc-box{background:#fffbeb;border:1px solid #fcd34d;border-radius:var(--bdx-rs);padding:12px 14px;margin-bottom:14px;font-size:13px;color:#92400e;display:flex;gap:8px;align-items:flex-start}
.bx-inc-alt{padding:10px 14px;border:1px solid var(--bdx-brd);border-radius:var(--bdx-rs);cursor:pointer;font-size:13px;transition:all .12s;display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.bx-inc-alt:hover{border-color:var(--bdx);background:var(--bdx-lt)}.bx-inc-alt .arr{color:var(--bdx);font-weight:700}

/* === Upload zone === */
.bx-upload{border:2px dashed var(--bdx-brd);border-radius:var(--bdx-r);padding:32px 20px;text-align:center;background:var(--bdx-bg);cursor:pointer;transition:all .2s}
.bx-upload:hover{border-color:var(--bdx);background:var(--bdx-lt)}
.bx-upload-ico{font-size:32px;margin-bottom:8px}
.bx-upload-txt{font-size:14px;font-weight:600;color:var(--bdx-txt);margin-bottom:4px}
.bx-upload-sub{font-size:12px;color:var(--bdx-dim)}
.bx-upload input[type=file]{display:none}
.bx-custom-size-widget{margin:8px 0 4px;padding:14px;background:var(--bdx-bg);border:1.5px solid var(--bdx-brd);border-radius:var(--bdx-r)}
.bx-custom-size-row{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.bx-custom-size-field{display:flex;flex-direction:column;gap:4px;flex:1;min-width:90px}
.bx-custom-size-field label{font-size:11px;font-weight:600;color:var(--bdx-mid);text-transform:uppercase;letter-spacing:.4px}
.bx-custom-size-input{border:1.5px solid var(--bdx-brd);border-radius:8px;padding:8px 10px;font-size:14px;font-weight:600;color:var(--bdx-txt);background:#fff;width:100%;box-sizing:border-box;-moz-appearance:textfield}
.bx-custom-size-input::-webkit-outer-spin-button,.bx-custom-size-input::-webkit-inner-spin-button{-webkit-appearance:none}
.bx-custom-size-input:focus{outline:none;border-color:var(--bdx);box-shadow:0 0 0 3px var(--bdx-lt)}
.bx-custom-size-sep{font-size:18px;font-weight:700;color:var(--bdx-mid);padding-bottom:8px}
.bx-custom-size-hint{font-size:11px;color:var(--bdx-dim);margin-top:8px}
.bx-custom-size-err{font-size:12px;color:#dc2626;margin-top:6px;min-height:16px}
.bx-custom-size-btn{margin-top:12px;width:100%;padding:10px;background:var(--bdx);color:#fff;border:none;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;transition:background .2s}
.bx-custom-size-btn:hover{background:var(--bdx-dk)}
.bx-gabarit-wrap{margin-top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.bx-gabarit-btn{background:none;border:1.5px solid var(--bdx);color:var(--bdx);border-radius:var(--bdx-r);padding:8px 14px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}
.bx-gabarit-btn:hover{background:var(--bdx);color:#fff}
.bx-gabarit-btn:disabled{opacity:.6;cursor:wait}
.bx-q-other{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1.5px dashed var(--bdx-brd);border-radius:8px;cursor:pointer;font-size:13px;color:var(--bdx-mid);margin-top:4px;transition:all .2s}
.bx-q-other:hover,.bx-q-other.active{border-color:var(--bdx);color:var(--bdx)}
.bx-q-other-input{display:block;border:1.5px solid var(--bdx-brd);border-radius:6px;padding:4px 8px;font-size:13px;font-weight:600;width:80px;-moz-appearance:textfield}
.bx-q-other-input::-webkit-outer-spin-button,.bx-q-other-input::-webkit-inner-spin-button{-webkit-appearance:none}
.bx-q-other-input:focus{outline:none;border-color:var(--bdx)}
.bx-q-other.active .bx-q-other-input{display:block}
.bx-q-other-unit{font-size:11px;color:var(--bdx-dim)}
.bx-q-other.sel{border-style:solid;border-color:var(--bdx);background:var(--bdx-lt);color:var(--bdx-dk);font-weight:600}
.bx-q-err{font-size:11px;color:#dc2626;margin-top:4px;padding:0 4px}
.bx-custom-size-done{display:flex;align-items:center;gap:10px;margin:8px 0 4px;padding:12px 14px;background:#f0fdf4;border:1.5px solid #86efac;border-radius:var(--bdx-r)}
.bx-csd-check{display:flex;align-items:center;justify-content:center;width:22px;height:22px;background:#22c55e;color:#fff;border-radius:50%;font-size:13px;font-weight:700;flex-shrink:0}
.bx-csd-dims{font-size:13px;color:#166534;flex:1}
.bx-csd-dims strong{font-weight:700}
.bx-csd-edit{background:none;border:1px solid #86efac;color:#166534;border-radius:6px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s}
.bx-csd-edit:hover{background:#dcfce7}
.bx-inc-chg{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;background:var(--bdx-bg);border:1px solid var(--bdx-brd);border-radius:8px;margin-bottom:6px}
.bx-inc-chg-prop{font-size:12px;font-weight:600;color:var(--bdx-mid)}
.bx-inc-chg-vals{font-size:13px;color:var(--bdx-txt)}
.bx-inc-chg-vals strong{color:var(--bdx-dk)}
.bx-inc-chg{display:block;padding:12px;background:var(--bdx-bg);border:1px solid var(--bdx-brd);border-radius:8px;margin-bottom:8px}
.bx-inc-chg-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px}
.bx-inc-chg-cur{font-size:11px;color:#92400e}
.bx-inc-chg-sel{width:100%;border:1.5px solid var(--bdx-brd);border-radius:8px;padding:9px 10px;font-size:13px;font-weight:600;color:var(--bdx-txt);background:#fff;cursor:pointer}
.bx-inc-chg-sel:focus{outline:none;border-color:var(--bdx);box-shadow:0 0 0 3px var(--bdx-lt)}
.bx-removed-warn{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;margin-bottom:20px;background:#fffbeb;border:1.5px solid #fcd34d;border-radius:var(--bdx-r)}
.bx-rw-ico{font-size:18px;flex-shrink:0}
.bx-rw-txt{flex:1;font-size:13px;color:#92400e;line-height:1.5}
.bx-rw-txt strong{font-weight:700}
.bx-rw-x{background:none;border:none;font-size:20px;color:#92400e;cursor:pointer;line-height:1;padding:0 4px;flex-shrink:0;opacity:.6}
.bx-rw-x:hover{opacity:1}
.bx-gabarit-info{font-size:12px;color:var(--bdx-dim)}
.bx-gabarit-info a{color:var(--bdx);text-decoration:underline}

/* === Responsive === */
@media(max-width:768px){
  #bdx-configurator{font-size:13px}
  .bx-exg{grid-template-columns:1fr}
  /* Vrai mobile : la barre prix collante en bas remplace le récap latéral. */
  .bx-side{display:none}
  .bx-side-h{padding:12px 16px}.bx-side-b{padding:10px 16px}.bx-side-f{padding:12px 16px}
  .bx-li{padding:8px 12px;font-size:12px}
  .bx-q{padding:8px 12px;font-size:13px}
  .bx-sec{padding:16px 0}
  .bx-p-lbl{font-size:12px}
  .bx-sec-t{font-size:12px}
  .bx-md{max-width:100%;width:96%;padding:16px 18px;max-height:90vh}
  .bx-upload{padding:20px 16px}
  .bx-del-row{grid-template-columns:100px 1fr auto auto;padding:8px 10px;font-size:12px}
  .bx-cal-day{padding:8px 4px}
  .bx-cal-d{font-size:16px}
  .bx-svc-grid{grid-template-columns:1fr}
  .bx-svc-card{border-right:none;border-bottom:1px solid var(--bdx-brd)}
  .bx-svc-card:last-child{border-bottom:none}
}
@media(max-width:480px){
  .bx-ttc{font-size:18px}
  .bx-cta{padding:12px;font-size:13px}
  .bx-del-tabs{gap:4px}
  .bx-del-tab{padding:6px 10px;font-size:11px}
  .bx-cal-day{padding:6px 2px}
  .bx-cal-d{font-size:14px}
  .bx-cal-p{font-size:9px}
  .bx-svc-grid{grid-template-columns:1fr}
}

.bx-summary-img{margin-bottom:20px;text-align:center;background:#f8f9fa;border-radius:14px;padding:20px;max-width:400px}
.bx-summary-img img{max-width:100%;max-height:300px;object-fit:contain;border-radius:8px}

/* ── Bouton info "i" + modale option-info ── */
.bx-info-i{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:8px;border:none;border-radius:50%;background:var(--bdx-mid,#94a3b8);color:#fff;font-size:11px;font-weight:700;font-style:italic;font-family:Georgia,serif;cursor:pointer;vertical-align:middle;transition:background .2s;line-height:1;padding:0}
.bx-info-i:hover{background:var(--bdx,#FCAF3B)}
.bx-md-info{max-width:640px;width:94%;max-height:85vh;display:flex;flex-direction:column}
.bx-optinfo-body{overflow-y:auto;padding:4px 0;flex:1}
.bx-optinfo-card{border:1px solid var(--bdx-brd,#e5e7eb);border-radius:12px;padding:16px;margin-bottom:12px}
.bx-optinfo-main{display:flex;gap:16px;align-items:flex-start}
.bx-optinfo-txt{flex:1;min-width:0}
.bx-optinfo-txt h4{margin:0 0 8px;font-size:15px;font-weight:700;color:var(--bdx-txt,#1f2937)}
.bx-optinfo-txt p{margin:0;font-size:13px;line-height:1.6;color:var(--bdx-mid,#4b5563)}
.bx-optinfo-img{flex-shrink:0;width:120px}
.bx-optinfo-img img{width:120px;height:120px;object-fit:cover;border-radius:8px}
.bx-optinfo-chars{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--bdx-brd,#e5e7eb)}
.bx-optinfo-char{display:flex;flex-direction:column;align-items:center;gap:4px;width:64px;text-align:center}
.bx-optinfo-char img{width:36px;height:36px;object-fit:contain}
.bx-optinfo-char span{font-size:9px;line-height:1.2;color:var(--bdx-dim,#6b7280)}
.bx-optinfo-foot{padding-top:14px;border-top:1px solid var(--bdx-brd,#e5e7eb);display:flex;justify-content:flex-end}
.bx-optinfo-foot .bx-custom-size-btn{width:auto;padding:10px 24px}
@media(max-width:640px){
  .bx-optinfo-main{flex-direction:column}
  .bx-optinfo-img,.bx-optinfo-img img{width:100%;height:auto;max-height:200px}
}

/* ── TEXTILE MATRIX — Sélection couleurs et tailles ── */
.bx-vm-head,
.bx-vm-row{
  display:grid;
  grid-template-columns: 14px minmax(140px,1.4fr) minmax(120px,1fr) 90px 100px 36px;
  align-items:center;
  gap:10px;
}
.bx-vm-head{
  padding:0 4px 8px;
  font-size:12px; font-weight:600; color:var(--bdx-mid,#6b7280);
  border-bottom:1px solid var(--bdx-line,#e5e7eb);
}
.bx-vm-head .bx-vm-hp,
.bx-vm-row .bx-vm-price{ text-align:right; }
.bx-vm-row{
  padding:8px 4px;
  border-bottom:1px solid var(--bdx-line,#f0f1f3);
}
.bx-vm-dot{
  width:10px; height:10px; border-radius:50%;
  background:var(--bdx-line,#d1d5db);
  border:1px solid rgba(0,0,0,.15);
}
.bx-vm-cell select,
.bx-vm-cell input{
  width:100%; height:38px; padding:0 10px; font-size:14px;
  border:1px solid var(--bdx-line,#d1d5db); border-radius:8px;
  background:var(--bdx-bg,#fff); color:var(--bdx-fg,#111); box-sizing:border-box;
}
.bx-vm-cell select:focus,
.bx-vm-cell input:focus{
  outline:none; border-color:var(--bdx-accent,#2563eb);
  box-shadow:0 0 0 3px rgba(37,99,235,.15);
}
.bx-vm-qin{ text-align:center; }
.bx-vm-price{ font-size:14px; font-weight:600; color:var(--bdx-fg,#111); }
.bx-vm-del{
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  border:1px solid transparent; border-radius:8px; background:transparent; cursor:pointer;
  font-size:15px; line-height:1; color:var(--bdx-mid,#6b7280);
  transition:background .12s,color .12s;
}
.bx-vm-del:hover:not([disabled]){ background:#fee2e2; color:#dc2626; }
.bx-vm-del[disabled]{ opacity:.3; cursor:not-allowed; }
.bx-vm-add{
  display:block; width:100%; margin-top:12px; padding:11px 14px;
  font-size:14px; font-weight:600; color:var(--bdx-accent,#2563eb);
  background:transparent; border:1.5px dashed var(--bdx-accent,#93c5fd);
  border-radius:10px; cursor:pointer; transition:background .12s,border-color .12s;
}
.bx-vm-add:hover{ background:rgba(37,99,235,.06); border-style:solid; }
.bx-vm-err{
  margin-top:10px; padding:8px 12px; font-size:13px; font-weight:600;
  color:#b91c1c; background:#fef2f2; border:1px solid #fecaca; border-radius:8px;
}
.bx-vm-foot{
  margin-top:14px; padding-top:12px;
  border-top:1px solid var(--bdx-line,#e5e7eb); font-size:14px;
}
.bx-vm-foot-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:2px 0; color:var(--bdx-mid,#6b7280);
}
.bx-vm-foot-row strong{ color:var(--bdx-fg,#111); font-size:15px; }
.bx-vm-foot-prod{ font-weight:600; color:var(--bdx-fg,#111); }
.bx-vm-foot-ship{ font-size:12px; }
.bx-vm-incl{ color:var(--bdx-ok,#16a34a); font-weight:600; }
.bx-vm-foot-total{
  margin-top:6px; padding-top:8px; border-top:1px dashed var(--bdx-line,#e5e7eb);
  color:var(--bdx-fg,#111);
}
.bx-vm-foot-total span:last-child{ font-size:16px; font-weight:700; }

@media (max-width:600px){
  .bx-vm-head{ display:none; }
  .bx-vm-row{
    grid-template-columns: 14px 1fr 1fr;
    grid-template-areas:
      "dot color color"
      "dot size  qty"
      "dot price del";
    row-gap:8px;
  }
  .bx-vm-dot{ grid-area:dot; align-self:start; margin-top:14px; }
  .bx-vm-color{ grid-area:color; }
  .bx-vm-size{ grid-area:size; }
  .bx-vm-qty{ grid-area:qty; }
  .bx-vm-price{ grid-area:price; text-align:left; align-self:center; }
  .bx-vm-del{ grid-area:del; justify-self:end; }
}

/* ── TEXTILE MATRIX — sélecteur de couleur custom (vignette + nom) ── */
.bx-vm-color{ position:relative; }
.bx-vm-colorpick{ position:relative; width:100%; }
.bx-vm-colorbtn{
  display:flex; align-items:center; gap:8px; width:100%; height:38px; padding:0 8px;
  border:1px solid var(--bdx-line,#d1d5db); border-radius:8px; background:var(--bdx-bg,#fff);
  cursor:pointer; font-size:14px; color:var(--bdx-fg,#111); text-align:left;
}
.bx-vm-colorbtn:hover{ border-color:var(--bdx-accent,#2563eb); }
.bx-vm-sw{
  flex:0 0 auto; width:26px; height:26px; border-radius:6px;
  background-size:cover; background-position:center; border:1px solid rgba(0,0,0,.15);
}
.bx-vm-sw[data-empty]{ background:repeating-linear-gradient(45deg,#eee,#eee 4px,#f7f7f7 4px,#f7f7f7 8px); }
/* Grosses vignettes dans le déroulant (le client voit bien la couleur) */
.bx-vm-coloropt .bx-vm-sw{ width:46px; height:46px; border-radius:8px; }
.bx-vm-coloropt{ padding:7px 9px; cursor:zoom-in; }
.bx-vm-colorpop{ max-height:360px; }
/* Aperçu agrandi au survol (au-dessus de tout, hors flux scrollable) */
#bdx-vm-zoom{
  position:fixed; z-index:3000; display:none; pointer-events:none;
  background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  box-shadow:0 14px 48px rgba(0,0,0,.3); padding:6px;
}
#bdx-vm-zoom img{ display:block; width:240px; height:240px; object-fit:cover; border-radius:8px; background:#f3f4f6; }
.bx-vm-colorname{ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bx-vm-colorcar{ flex:0 0 auto; color:var(--bdx-mid,#6b7280); font-size:11px; }
.bx-vm-colorpop{
  display:none; position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:60;
  max-height:300px; overflow-y:auto; background:#fff; border:1px solid var(--bdx-line,#d1d5db);
  border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.16); padding:4px;
}
.bx-vm-colorpop.open{ display:block; }
.bx-vm-coloropt{
  display:flex; align-items:center; gap:8px; width:100%; padding:6px 8px; border:none;
  background:transparent; cursor:pointer; font-size:13px; color:var(--bdx-fg,#111);
  text-align:left; border-radius:7px;
}
.bx-vm-coloropt:hover{ background:#f3f4f6; }
.bx-vm-coloropt.sel{ background:rgba(37,99,235,.08); font-weight:600; }
.bx-vm-coloropt>span:nth-of-type(2){ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bx-vm-colorchk{ flex:0 0 auto; color:var(--bdx-accent,#2563eb); }

/* ═══ Responsive mobile (2026-06-26) ═══ */
/* Aperçu couleur agrandi : jamais sur tactile (la vignette fixe resterait bloquée à l'écran). */
@media (hover: none), (pointer: coarse) {
  #bdx-vm-zoom { display: none !important; }
  .bx-vm-coloropt { cursor: pointer; }
}
/* Table transporteurs : 2 colonnes fluides sur mobile (évite le débordement horizontal). */
@media (max-width: 560px) {
  .bx-car-hd { display: none; }
  .bx-car-row { grid-template-columns: minmax(0,1fr) auto; gap: 4px 10px; }
  .bx-car-row .cname { grid-column: 1; min-width: 0; }
  .bx-car-row .cprice { grid-column: 2; grid-row: 1; text-align: right; justify-self: end; white-space: nowrap; }
  .bx-car-row .ctime { grid-column: 1 / -1; }
  .bx-car-row .creli { grid-column: 1 / -1; }
}

/* ── Section « Fichier d'impression » : 2 colonnes [Téléverser | Créer en ligne] ── */
.bx-filerow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 6px 0 16px; }
@media (max-width: 1024px) { .bx-filerow { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .bx-filerow { grid-template-columns: 1fr; } }
.bx-filecol { border: 1px solid #e5e7eb; border-radius: 12px; padding: 18px; background: #fff; display: flex; flex-direction: column; }
.bx-filecol-studio { border-color: #FCAF3B; background: #fffdf7; }
.bx-filecol-designer { border-color: #c7d2fe; background: #f7f8ff; }
.bx-filecol-designer.on { border-color: #4f46e5; background: #eef1ff; }
.bx-designer-btn { align-self: flex-start; background: #4f46e5; color: #fff; border: none; border-radius: 10px; padding: 11px 18px; font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.bx-designer-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(79,70,229,.3); }
.bx-filecol-designer.on .bx-designer-btn { background: #16a34a; }
/* Message + accès au brief quand la demande designer est active */
.bx-designer-info { margin-top: 10px; font-size: 12.5px; line-height: 1.5; color: #3730a3; background: #eef1ff; border: 1px solid #c7d2fe; border-radius: 9px; padding: 9px 11px; }
.bx-brief-btn { margin-top: 8px; width: 100%; border: 1.5px dashed #4f46e5; background: #fff; color: #4f46e5; border-radius: 9px; padding: 10px 12px; font-size: 13px; font-weight: 700; cursor: pointer; transition: all .12s; text-align: left; }
.bx-brief-btn:hover { background: #4f46e5; color: #fff; border-style: solid; }
.bx-brief-btn.done { border-style: solid; border-color: #16a34a; color: #15803d; background: #f0fdf4; }
.bx-brief-hint { margin-top: 6px; font-size: 11.5px; color: #6b7280; line-height: 1.45; }

/* ── Modale BRIEF GRAPHIQUE ── */
.bx-brief-ov { position: fixed; inset: 0; z-index: 100000; background: rgba(17,24,39,.55); display: flex; align-items: center; justify-content: center; padding: 18px; }
.bx-brief-md { background: #fff; width: 100%; max-width: 680px; max-height: 92vh; border-radius: 16px; display: flex; flex-direction: column; box-shadow: 0 24px 80px rgba(0,0,0,.35); overflow: hidden; }
.bx-brief-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px 14px; border-bottom: 1px solid #e5e7eb; }
.bx-brief-t { font-size: 18px; font-weight: 800; color: #111827; }
.bx-brief-sub { font-size: 12.5px; color: #6b7280; margin-top: 3px; line-height: 1.4; }
.bx-brief-x { border: none; background: #f3f4f6; color: #374151; width: 32px; height: 32px; border-radius: 8px; cursor: pointer; font-size: 14px; flex-shrink: 0; }
.bx-brief-x:hover { background: #e5e7eb; }
.bx-brief-body { padding: 16px 20px; overflow-y: auto; }
.bx-brief-sec { margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px dashed #e5e7eb; }
.bx-brief-sec:last-child { border-bottom: none; }
.bx-brief-sec-t { font-size: 14px; font-weight: 800; color: #111827; margin-bottom: 10px; }
.bx-brief-sec label { display: block; font-size: 12px; font-weight: 600; color: #4b5563; margin-bottom: 10px; }
.bx-brief-sec input[type=text], .bx-brief-sec textarea { display: block; width: 100%; margin-top: 4px; border: 1.5px solid #d1d5db; border-radius: 8px; padding: 9px 11px; font-size: 13px; font-family: inherit; }
.bx-brief-sec input[type=text]:focus, .bx-brief-sec textarea:focus { outline: none; border-color: #4f46e5; }
.bx-brief-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 560px) { .bx-brief-row2 { grid-template-columns: 1fr; } }
.bx-brief-radios { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 10px; }
.bx-brief-radios label { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #374151; margin: 0; cursor: pointer; }
.bx-brief-radios input { accent-color: #4f46e5; width: 16px; height: 16px; }
.bx-brief-file input[type=file] { display: block; width: 100%; margin-top: 4px; font-size: 12px; color: #4b5563; }
.bx-brief-colors { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.bx-brief-colors label { margin: 0; font-size: 12px; font-weight: 700; }
.bx-brief-colors input[type=color] { width: 38px; height: 32px; border: 1.5px solid #d1d5db; border-radius: 8px; padding: 2px; cursor: pointer; background: #fff; }
.bx-brief-hint2 { font-size: 11px; color: #9ca3af; }
.bx-brief-foot { display: flex; align-items: center; gap: 10px; padding: 14px 20px; border-top: 1px solid #e5e7eb; background: #f9fafb; flex-wrap: wrap; }
.bx-brief-note { font-size: 11.5px; color: #6b7280; flex: 1 1 220px; line-height: 1.4; }
.bx-brief-cancel { border: 1.5px solid #d1d5db; background: #fff; color: #374151; border-radius: 9px; padding: 10px 16px; font-size: 13px; font-weight: 700; cursor: pointer; }
.bx-brief-send { border: none; background: #4f46e5; color: #fff; border-radius: 9px; padding: 11px 18px; font-size: 13.5px; font-weight: 800; cursor: pointer; }
.bx-brief-send:hover { filter: brightness(1.08); }
.bx-brief-send:disabled { opacity: .7; cursor: wait; }
.bx-filecol-ic { font-size: 26px; line-height: 1; margin-bottom: 8px; }
.bx-filecol-h { font-size: 15px; font-weight: 800; color: #111827; margin-bottom: 6px; }
.bx-filecol-p { font-size: 13px; color: #6b7280; line-height: 1.5; margin: 0 0 14px; flex: 1; }
.bx-studio-btn { align-self: flex-start; background: linear-gradient(135deg, #FCAF3B, #e89d2b); color: #fff; border: none; border-radius: 10px; padding: 11px 18px; font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.bx-studio-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(252,175,59,.35); }

/* Tactile : le :hover "colle" après un tap (mobile) → un 2e format restait surligné en
   jaune clair. On neutralise le fond de survol sur appareils SANS vrai pointeur, en
   préservant l'état SÉLECTIONNÉ (.sel/.act). */
@media (hover: none) {
  #bdx-configurator .bx-sizepill:not(.sel):hover,
  #bdx-configurator .bx-li:not(.sel):not(.act):hover,
  #bdx-configurator .bx-gi:not(.sel):hover,
  #bdx-configurator .bx-sa:not(.sel):hover,
  #bdx-configurator .bx-q-other:not(.sel):hover,
  #bdx-configurator .bx-q:not(.sel):hover,
  #bdx-configurator .bx-qmore:hover,
  #bdx-configurator .bx-cal-day:not(.sel):hover,
  #bdx-configurator .bx-car-row:not(.sel):hover,
  #bdx-configurator .bx-inc-alt:not(.sel):hover,
  #bdx-configurator .bx-upload:hover {
    background: #fff;
    border-color: var(--bdx-brd);
  }
}