/* AHI v2 — styles de la boutique */
@font-face{font-family:Figtree;font-weight:400;font-display:swap;src:url(fonts/figtree-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Figtree;font-weight:500;font-display:swap;src:url(fonts/figtree-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Figtree;font-weight:600;font-display:swap;src:url(fonts/figtree-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Figtree;font-weight:700;font-display:swap;src:url(fonts/figtree-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Figtree;font-weight:800;font-display:swap;src:url(fonts/figtree-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Figtree;font-weight:400;font-display:swap;src:url(fonts/figtree-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Figtree;font-weight:600;font-display:swap;src:url(fonts/figtree-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Figtree;font-weight:800;font-display:swap;src:url(fonts/figtree-latin-ext-800-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

@font-face{font-family:"Bricolage Grotesque";font-weight:700;font-display:swap;src:url(fonts/bricolage-grotesque-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:"Bricolage Grotesque";font-weight:800;font-display:swap;src:url(fonts/bricolage-grotesque-latin-800-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:"Bricolage Grotesque";font-weight:800;font-display:swap;src:url(fonts/bricolage-grotesque-latin-ext-800-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+1E00-1E9F}
:root{
  /* Dantokpa : lagune, latérite, huile de palme, feuille, calebasse */
  --encre:#0F6E6E; --encre2:#0B5858; --encre3:#168080;
  --soleil:#E5A626; --soleil-f:#D29418; --soleil-c:#FBEBC4;
  --piment:#B5452B; --piment-f:#9C3A23; --piment-c:#F7E1D8;
  --lagune:#0F6E6E; --palme:#2E6A42; --palme-c:#E2EFE4;
  --fond:#FBF3E4; --carte:#FFFDF8; --ph:#F6ECDB; --ligne:#E8D9BE; --ligne2:#F1E6D2;
  --texte:#0B3B45; --gris:#6B5E4B; --gris2:#9C8F7A;
  --titre:"Bricolage Grotesque",Figtree,system-ui,sans-serif;
  --r:14px; --ombre:0 1px 2px rgba(11,59,69,.06),0 3px 10px rgba(107,94,75,.08);
  --max:1480px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--texte);font:400 15px/1.45 Figtree,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
svg.i{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.muet{color:var(--gris)}
.lien{color:var(--lagune);cursor:pointer;background:none;border:0;padding:0}
.lien:hover{text-decoration:underline;color:#0B5858}
.nowrap{white-space:nowrap}

/* ── en-tête ─────────────────────────────────────────────── */
.tete{background:var(--encre);color:#fff;position:sticky;top:0;z-index:40}
.tete-l{display:flex;align-items:center;gap:10px;padding:8px 12px;max-width:var(--max);margin:0 auto}
.logo{display:flex;align-items:center;padding:6px 6px 4px;border:1px solid transparent;border-radius:6px}
.logo svg{height:30px;width:auto}
.tete .zone{display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid transparent;border-radius:6px;background:none;color:#fff;text-align:left;line-height:1.15}
.tete .zone:hover,.logo:hover{border-color:rgba(255,255,255,.7)}
.zone small{display:block;color:#BFE0DC;font-size:12px}
.zone b{font-size:14px;font-weight:700}
.recherche{flex:1;display:flex;min-width:0;height:42px;border-radius:8px;overflow:visible;position:relative;background:var(--carte)}
.recherche:focus-within{box-shadow:0 0 0 3px var(--soleil)}
.recherche select{border:0;background:#F1E5CF;color:var(--texte);padding:0 8px;font-size:13px;border-radius:8px 0 0 8px;max-width:150px;outline:0}
.recherche input{flex:1;min-width:0;border:0;padding:0 12px;font-size:15px;outline:0;background:var(--carte);color:var(--texte)}
.recherche button{border:0;background:var(--soleil);width:48px;border-radius:0 8px 8px 0;display:grid;place-items:center;color:var(--encre)}
.recherche button:hover{background:var(--soleil-f)}
.sugg{position:absolute;left:0;right:0;top:46px;background:var(--carte);color:var(--texte);border-radius:8px;box-shadow:0 10px 30px rgba(0,0,0,.25);overflow:hidden;z-index:60}
.sugg a{display:flex;gap:10px;align-items:center;padding:10px 14px;font-size:14px}
.sugg a:hover,.sugg a.actif{background:#F6ECDA}
.sugg a small{color:var(--gris);margin-left:auto;font-size:12px}
.tete .pan{position:relative;display:flex;align-items:flex-end;gap:2px;padding:6px 8px;border:1px solid transparent;border-radius:6px;font-weight:700}
.tete .pan:hover{border-color:rgba(255,255,255,.7)}
.pan .cpt{position:absolute;left:18px;top:0;min-width:20px;height:20px;border-radius:10px;background:var(--soleil);color:var(--encre);font-size:12px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.pan svg.i{width:30px;height:30px}
.menu-btn{background:none;border:0;color:#fff;padding:6px;display:flex}
.sous{background:var(--encre2);color:#fff}
.sous-l{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;max-width:var(--max);margin:0 auto;padding:0 8px}
.sous-l::-webkit-scrollbar{display:none}
.sous a,.sous button{white-space:nowrap;padding:9px 10px;font-size:14px;font-weight:500;border:1px solid transparent;border-radius:4px;background:none;color:#fff;display:flex;align-items:center;gap:6px}
.sous a:hover,.sous button:hover{border-color:rgba(255,255,255,.6)}
.sous .fort{font-weight:700}
.t-mob{display:none}
@media (max-width:860px){
  .tete-l{flex-wrap:wrap;gap:6px;padding:8px 10px 10px}
  .t-desk{display:none!important}
  .t-mob{display:flex}
  .logo svg{height:26px}
  .recherche{order:5;flex:1 0 100%}
  .recherche select{display:none}
  .recherche input{border-radius:8px 0 0 8px}
  .tete .esp{flex:1}
  .livrer-mob{background:var(--encre3);color:#fff;font-size:13px;padding:8px 12px;display:flex;align-items:center;gap:6px;border:0;width:100%}
}
@media (min-width:861px){.livrer-mob,.t-mob{display:none!important}}

/* ── tiroir « Tous » ─────────────────────────────────────── */
.voile{position:fixed;inset:0;background:rgba(8,14,24,.6);z-index:80;opacity:0;pointer-events:none;transition:opacity .2s}
.voile.ouvert{opacity:1;pointer-events:auto}
.tiroir{position:fixed;top:0;bottom:0;left:0;width:min(360px,86vw);background:var(--carte);z-index:90;transform:translateX(-100%);transition:transform .25s ease;overflow-y:auto}
.tiroir.ouvert{transform:none}
.tiroir .t-haut{background:var(--encre2);color:#fff;padding:16px 20px;font-weight:700;font-size:18px;display:flex;align-items:center;gap:10px}
.tiroir h4{margin:0;padding:16px 20px 6px;font-size:17px}
.tiroir a,.tiroir button.l{display:flex;justify-content:space-between;align-items:center;padding:11px 20px;font-size:15px;width:100%;background:none;border:0;text-align:left}
.tiroir a:hover,.tiroir button.l:hover{background:#F6ECDA}
.tiroir hr{border:0;border-top:1px solid var(--ligne);margin:8px 0}

/* ── mise en page ────────────────────────────────────────── */
main{min-height:60vh}
.page{max-width:var(--max);margin:0 auto;padding:16px}
.page-e{max-width:1100px;margin:0 auto;padding:16px}
.page-m{max-width:760px;margin:0 auto;padding:16px}
.bloc{background:var(--carte);border-radius:var(--r);padding:18px;box-shadow:var(--ombre)}
.bloc+.bloc{margin-top:14px}
h1{font-family:var(--titre);font-size:28px;font-weight:800;margin:0 0 12px;letter-spacing:-.01em}
h2{font-family:var(--titre);font-size:22px;font-weight:800;margin:0 0 12px;letter-spacing:-.01em}
h3{font-family:var(--titre);font-size:17px;font-weight:700;margin:0 0 8px}
.fil{font-size:13px;color:var(--gris);margin:0 0 10px;display:flex;flex-wrap:wrap;gap:6px}
.fil a{color:var(--lagune)}
@media (max-width:600px){.page,.page-e,.page-m{padding:10px}.bloc{padding:14px}h1{font-size:22px}}

/* ── boutons et champs ───────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:12px;padding:10px 18px;font-weight:700;font-size:15px;line-height:1.2;transition:background .15s,box-shadow .15s;white-space:nowrap}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-soleil{background:var(--soleil);color:var(--encre)}
.btn-soleil:hover{background:var(--soleil-f)}
.btn-piment{background:var(--piment);color:#fff}
.btn-piment:hover{background:var(--piment-f)}
.btn-encre{background:var(--encre);color:#fff}
.btn-encre:hover{background:var(--encre3)}
.btn-ligne{background:var(--carte);border-color:var(--ligne);color:var(--texte);box-shadow:0 1px 2px rgba(11,59,69,.06)}
.btn-ligne:hover{background:#FBF4E7}
.btn-bloc{width:100%}
.btn-p{padding:7px 14px;font-size:14px}
.btn-carre{border-radius:8px}
.champ{width:100%;border:1px solid #D3BF9C;border-radius:8px;padding:10px 12px;font-size:15px;background:var(--carte);outline:0}
.champ:focus{border-color:var(--lagune);box-shadow:0 0 0 3px rgba(15,110,110,.18)}
textarea.champ{min-height:90px;resize:vertical}
label.lab{display:block;font-weight:700;font-size:14px;margin:12px 0 5px}
label.lab small{font-weight:400;color:var(--gris)}
.aide{font-size:13px;color:var(--gris);margin-top:4px}
.ligne2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:520px){.ligne2{grid-template-columns:1fr}}
.choix{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--ligne);border-radius:10px;padding:12px 14px;cursor:pointer;background:var(--carte)}
.choix+.choix{margin-top:8px}
.choix:has(input:checked){border-color:var(--lagune);background:#E8F4F2;box-shadow:0 0 0 1px var(--lagune)}
.choix input{margin-top:3px;accent-color:var(--lagune);width:18px;height:18px;flex:none}
.choix .d{flex:1}
.choix b{display:block}
.pastille{display:inline-flex;align-items:center;gap:4px;border-radius:6px;padding:2px 7px;font-size:12px;font-weight:700}
.p-piment{background:var(--piment);color:#fff}
.p-palme{background:var(--palme-c);color:var(--palme)}
.p-soleil{background:var(--soleil-c);color:#7A4E00}
.p-gris{background:#F3E8D5;color:var(--gris)}
.p-encre{background:var(--encre);color:#fff}

/* ── étoiles ─────────────────────────────────────────────── */
.etoiles{position:relative;display:inline-block;font-size:15px;line-height:1;letter-spacing:1px;color:#E0CFB0;white-space:nowrap}
.etoiles::before{content:"★★★★★"}
.etoiles i{position:absolute;left:0;top:0;overflow:hidden;color:#D99A12;font-style:normal}
.etoiles i::before{content:"★★★★★"}
.note-l{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--lagune)}

/* ── vignettes produit ───────────────────────────────────── */
.grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
@media (max-width:600px){.grille{grid-template-columns:1fr 1fr;gap:8px}}
.carte{background:var(--carte);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--ombre);position:relative;transition:box-shadow .15s}
.carte:hover{box-shadow:0 4px 18px rgba(11,59,69,.12)}
.carte .ph{aspect-ratio:1;background:var(--ph);display:grid;place-items:center;overflow:hidden}
.carte .ph img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.carte .c{padding:10px 12px 12px;display:flex;flex-direction:column;gap:4px;flex:1}
.carte .t{font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
.carte .t:hover{color:var(--piment)}
.carte .m{font-size:12px;color:var(--gris)}
.prix{font-family:var(--titre);font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.prix sup{font-size:.55em;font-weight:700;vertical-align:.7em;margin-left:1px}
.carte .prix{font-size:20px}
.barre{color:var(--gris);text-decoration:line-through;font-size:13px;white-space:nowrap}
.carte .liv{font-size:12px;color:var(--gris)}
.carte .liv b{color:var(--texte)}
.carte .remise{position:absolute;left:8px;top:8px}
.carte .coeur{position:absolute;right:6px;top:6px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);border:0;display:grid;place-items:center;color:var(--gris);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.carte .coeur.on{color:var(--piment)}
.carte .coeur.on svg{fill:var(--piment)}
.vide-ph{color:#BFAE90;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px}
.vide-ph svg.i{width:38px;height:38px;stroke-width:1.5}

/* ── carrousels ──────────────────────────────────────────── */
.rangee{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(170px,190px);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;scrollbar-width:thin}
.rangee>*{scroll-snap-align:start}
.rangee .carte{box-shadow:none;border:1px solid var(--ligne2)}
@media (max-width:600px){.rangee{grid-auto-columns:150px;gap:8px}}
.tete-sect{display:flex;align-items:baseline;gap:14px;margin-bottom:10px}
.tete-sect h2{margin:0}
.tete-sect a{color:var(--lagune);font-size:14px}

/* ── accueil ─────────────────────────────────────────────── */
.heros{position:relative;overflow:hidden;border-radius:0 0 var(--r) var(--r)}
.slides{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.slide{flex:0 0 100%;min-height:300px;padding:44px 6vw 90px;color:#fff;display:flex;flex-direction:column;justify-content:center;gap:10px;position:relative;overflow:hidden}
.slide h2{font-family:var(--titre);font-size:clamp(30px,4.4vw,52px);line-height:1.02;margin:0;max-width:640px;letter-spacing:-.02em}
.slide p{margin:0;max-width:520px;font-size:clamp(15px,1.6vw,18px);opacity:.92}
.slide .btn{align-self:flex-start;margin-top:6px}
.slide .motif{position:absolute;right:2vw;bottom:70px;width:min(560px,48vw);pointer-events:none}
@media (max-width:760px){.slide .motif{display:none}}
.s1{background:var(--encre)}
.s2{background:var(--piment)}
.s3{background:var(--palme)}

.points{position:absolute;left:0;right:0;bottom:78px;display:flex;justify-content:center;gap:8px}
.points button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.45);padding:0}
.points button.on{background:var(--carte);width:22px;border-radius:5px}
.accueil-cartes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:-70px;position:relative;z-index:2}
@media (max-width:1100px){.accueil-cartes{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.accueil-cartes{grid-template-columns:1fr;gap:10px;margin-top:-64px}.slide{min-height:250px;padding:28px 18px 84px}}
.tuile{background:var(--carte);padding:16px 18px;border-radius:var(--r);box-shadow:var(--ombre);display:flex;flex-direction:column}
.tuile h3{font-size:18px;font-weight:800;margin-bottom:10px}
.tuile .q4{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1}
.tuile .q4 a{display:flex;flex-direction:column;gap:4px;font-size:12px}
.tuile .q4 .ph{aspect-ratio:1;background:var(--ph);border-radius:6px;display:grid;place-items:center;overflow:hidden}
.tuile .q4 .ph img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.tuile .q4 span{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.tuile>a.lien{margin-top:12px;font-size:14px}
.confiance{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:var(--carte);border-radius:var(--r);box-shadow:var(--ombre);overflow:hidden}
.confiance div{display:flex;gap:12px;align-items:center;padding:16px 18px;border-right:1px solid var(--ligne2)}
.confiance div:last-child{border-right:0}
.confiance svg.i{width:28px;height:28px;color:var(--lagune);stroke-width:1.6}
.confiance b{display:block;font-size:14px}
.confiance small{color:var(--gris);font-size:12.5px}
@media (max-width:900px){.confiance{grid-template-columns:1fr 1fr}.confiance div:nth-child(2){border-right:0}.confiance div:nth-child(-n+2){border-bottom:1px solid var(--ligne2)}}
.sect{margin-top:16px}
.bandeau-vente{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:var(--encre);color:#fff;border-radius:var(--r);padding:22px 24px}
.bandeau-vente h3{font-size:20px;margin:0}
.bandeau-vente p{margin:4px 0 0;color:#C4CEDA}
.bandeau-vente .btn{margin-left:auto}

/* ── recherche ───────────────────────────────────────────── */
.res-tete{background:var(--carte);border-bottom:1px solid var(--ligne);box-shadow:0 1px 2px rgba(0,0,0,.04)}
.res-tete .in{max-width:var(--max);margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px}
.res-tete b.q{color:var(--piment)}
.res-tete select{margin-left:auto;border:1px solid var(--ligne);border-radius:8px;padding:7px 10px;background:#FBF4E7;font-size:13px}
.res{display:grid;grid-template-columns:250px 1fr;gap:20px;align-items:start}
.filtres{font-size:14px;position:sticky;top:130px;max-height:calc(100vh - 140px);overflow:auto;padding-right:6px}
.filtres h4{margin:16px 0 6px;font-size:15px}
.filtres h4:first-child{margin-top:0}
.filtres a,.filtres label{display:flex;align-items:center;gap:8px;padding:3px 0;cursor:pointer}
.filtres a:hover{color:var(--piment)}
.filtres a.on{font-weight:700}
.filtres .n{color:var(--gris2);font-size:12px}
.filtres input[type=checkbox]{accent-color:var(--lagune);width:16px;height:16px}
.filtres .prixs{display:flex;gap:6px;align-items:center}
.filtres .prixs input{width:88px;padding:6px 8px;border:1px solid #D3BF9C;border-radius:6px}
.btn-filtres{display:none}
@media (max-width:860px){
  .res{grid-template-columns:1fr}
  .filtres{position:fixed;inset:auto 0 0 0;top:auto;max-height:82vh;background:var(--carte);z-index:95;padding:18px 18px 90px;border-radius:16px 16px 0 0;transform:translateY(105%);transition:transform .25s}
  .filtres.ouvert{transform:none}
  .filtres .fermer-f{position:fixed;left:0;right:0;bottom:0;padding:12px 18px;background:var(--carte);border-top:1px solid var(--ligne)}
  .btn-filtres{display:inline-flex}
}
@media (min-width:861px){.filtres .fermer-f{display:none}}
.pagination{display:flex;justify-content:center;gap:6px;margin:22px 0 6px;flex-wrap:wrap}
.pagination a,.pagination span{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--ligne);border-radius:8px;background:var(--carte);font-weight:600;padding:0 10px}
.pagination .on{border-color:var(--encre);box-shadow:inset 0 0 0 1px var(--encre)}
.puces{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.puce{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ligne);background:var(--carte);border-radius:10px;padding:6px 12px;font-size:13px;font-weight:600}
.puce:hover{border-color:var(--gris2)}
.puce.on{background:var(--encre);color:#fff;border-color:var(--encre)}

/* ── fiche produit ───────────────────────────────────────── */
.fiche{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) 300px;gap:24px;align-items:start}
@media (max-width:1150px){.fiche{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.achat{grid-column:1/-1}}
@media (max-width:760px){.fiche{grid-template-columns:1fr;gap:14px}}
.galerie{display:grid;grid-template-columns:64px 1fr;gap:10px;position:sticky;top:130px}
.galerie .vignettes{display:flex;flex-direction:column;gap:8px}
.galerie .vignettes button{width:64px;height:64px;border:1px solid var(--ligne);border-radius:8px;background:var(--carte);padding:3px;overflow:hidden}
.galerie .vignettes button.on{border-color:var(--soleil-f);box-shadow:0 0 0 2px var(--soleil)}
.galerie .vignettes img{width:100%;height:100%;object-fit:contain}
.galerie .grande{aspect-ratio:1;background:var(--carte);border-radius:var(--r);display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.galerie .grande::-webkit-scrollbar{display:none}
.galerie .grande>div{flex:0 0 100%;scroll-snap-align:center;display:grid;place-items:center;padding:12px}
.galerie .grande img{max-height:100%;object-fit:contain}
.galerie .pts{display:none}
@media (max-width:760px){
  .galerie{grid-template-columns:1fr;position:static}
  .galerie .vignettes{display:none}
  .galerie .pts{display:flex;justify-content:center;gap:6px;margin-top:8px}
  .galerie .pts i{width:7px;height:7px;border-radius:50%;background:#E0CFB0}
  .galerie .pts i.on{background:var(--encre)}
}
.infos h1{font-size:23px;font-weight:700;line-height:1.25;margin:0 0 6px}
.infos .marque{color:var(--lagune);font-size:14px}
.infos hr,.achat hr{border:0;border-top:1px solid var(--ligne);margin:12px 0}
.gros-prix{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}
.gros-prix .prix{font-size:30px}
.gros-prix .p-piment{font-size:15px;padding:4px 8px;margin-top:6px}
.opt h4{margin:14px 0 8px;font-size:14px;font-weight:600}
.opt h4 b{font-weight:800}
.opts{display:flex;gap:8px;flex-wrap:wrap}
.opts button{min-width:48px;padding:8px 14px;border:1px solid #D3BF9C;border-radius:8px;background:var(--carte);font-weight:600;font-size:14px}
.opts button.on{border-color:var(--lagune);box-shadow:0 0 0 2px rgba(15,110,110,.35);background:#E8F4F2}
.opts button.epuise{color:var(--gris2);text-decoration:line-through;border-style:dashed}
.caracs{width:100%;border-collapse:collapse;font-size:14px}
.caracs th{text-align:left;font-weight:700;background:#F6ECDA;width:40%;padding:9px 12px;vertical-align:top}
.caracs td{padding:9px 12px}
.caracs tr{border-bottom:1px solid var(--ligne2)}
.puces-f{margin:8px 0 0;padding-left:18px}
.puces-f li{margin:4px 0}
.achat{border:1px solid var(--ligne);border-radius:var(--r);padding:18px;background:var(--carte);position:sticky;top:130px}
.achat .prix{font-size:28px}
.achat .stock{font-size:17px;font-weight:700;margin:10px 0}
.achat .stock.ok{color:var(--palme)}
.achat .stock.peu{color:var(--piment)}
.achat .liv{font-size:14px;margin:8px 0}
.achat .liv b{font-weight:700}
.achat select{border:1px solid var(--ligne);border-radius:8px;padding:7px 10px;background:#FBF4E7;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.achat .btn{width:100%;margin-top:8px;padding:11px}
.vendu{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;font-size:13px;margin-top:12px}
.vendu span{color:var(--gris)}
.garanties{display:flex;flex-direction:column;gap:8px;font-size:13px;margin-top:12px}
.garanties div{display:flex;gap:8px;align-items:flex-start}
.garanties svg.i{width:18px;height:18px;color:var(--lagune);margin-top:1px}
.avis-g{display:grid;grid-template-columns:300px 1fr;gap:32px}
@media (max-width:760px){.avis-g{grid-template-columns:1fr;gap:16px}}
.histo{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.histo button{display:grid;grid-template-columns:56px 1fr 40px;gap:10px;align-items:center;background:none;border:0;padding:0;font-size:14px;color:var(--lagune);text-align:left}
.histo .b{height:20px;border-radius:4px;background:#F3E8D5;border:1px solid #E0CFB0;overflow:hidden}
.histo .b i{display:block;height:100%;background:#D99A12}
.un-avis{padding:14px 0;border-bottom:1px solid var(--ligne2)}
.un-avis .qui{display:flex;align-items:center;gap:8px;font-size:13px}
.un-avis .av{width:30px;height:30px;border-radius:50%;background:#EADBC0;display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--encre2)}
.un-avis .t{font-weight:700;margin:6px 0 2px}
.un-avis .v{font-size:12px;color:var(--piment);font-weight:700}
.barre-mob{display:none}
@media (max-width:760px){
  .barre-mob{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;background:var(--carte);padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--ligne);z-index:30;box-shadow:0 -4px 14px rgba(0,0,0,.06)}
  .barre-mob .btn{flex:1}
  body.a-barre{padding-bottom:76px}
}

/* ── panier / commande ───────────────────────────────────── */
.panier-g{display:grid;grid-template-columns:1fr 320px;gap:18px;align-items:start}
@media (max-width:900px){.panier-g{grid-template-columns:1fr}}
.ligne-p{display:grid;grid-template-columns:120px 1fr auto;gap:16px;padding:16px 0;border-bottom:1px solid var(--ligne2)}
.ligne-p:last-child{border-bottom:0}
.ligne-p .ph{width:120px;height:120px;background:var(--ph);border-radius:8px;display:grid;place-items:center;overflow:hidden}
.ligne-p .ph img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.ligne-p .t{font-size:16px;font-weight:600;line-height:1.3}
.ligne-p .act{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:8px;font-size:13px}
.qte{display:inline-flex;align-items:center;border:2px solid var(--soleil);border-radius:999px;overflow:hidden;height:34px}
.qte button{width:34px;height:100%;border:0;background:var(--carte);font-size:18px;font-weight:700;display:grid;place-items:center}
.qte span{min-width:30px;text-align:center;font-weight:700}
@media (max-width:600px){.ligne-p{grid-template-columns:90px 1fr;gap:12px}.ligne-p .ph{width:90px;height:90px}.ligne-p .pr{grid-column:2}}
.recap .l{display:flex;justify-content:space-between;gap:10px;font-size:14px;margin:6px 0}
.recap .tot{font-size:19px;font-weight:800;border-top:1px solid var(--ligne);padding-top:10px;margin-top:10px;color:var(--piment)}
.etape-c{display:grid;grid-template-columns:34px 1fr;gap:12px}
.etape-c .n{width:34px;height:34px;border-radius:50%;background:var(--encre);color:#fff;display:grid;place-items:center;font-weight:800}
.adr{border:1px solid var(--ligne);border-radius:10px;padding:12px 14px;font-size:14px;line-height:1.4}
.adr b{font-size:15px}

/* ── commandes ───────────────────────────────────────────── */
.cmd{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--r);overflow:hidden}
.cmd+.cmd{margin-top:14px}
.cmd .h{background:#F6ECDA;border-bottom:1px solid var(--ligne);padding:12px 16px;display:flex;gap:28px;flex-wrap:wrap;font-size:12.5px;color:var(--gris)}
.cmd .h b{display:block;color:var(--texte);font-size:13.5px;font-weight:600}
.cmd .h .ref{margin-left:auto;text-align:right}
.cmd .b{padding:16px;display:grid;grid-template-columns:1fr 220px;gap:16px}
@media (max-width:700px){.cmd .b{grid-template-columns:1fr}.cmd .h{gap:14px}.cmd .h .ref{margin-left:0;text-align:left}}
.etat{font-family:var(--titre);font-size:19px;font-weight:800;margin-bottom:4px}
.bloc>.etat{font-size:21px}
.etat.ok{color:var(--palme)}
.etat.ko{color:var(--piment)}
.cmd .art{display:grid;grid-template-columns:72px 1fr;gap:12px;margin-top:12px;align-items:center}
.cmd .art .ph{width:72px;height:72px;background:var(--ph);border-radius:8px;overflow:hidden;display:grid;place-items:center}
.cmd .art .ph img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.cmd .boutons{display:flex;flex-direction:column;gap:8px}
.suivi{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin:18px 0 8px;position:relative}
.suivi div{text-align:center;font-size:12.5px;position:relative;padding-top:30px;color:var(--gris)}
.suivi div::before{content:"";position:absolute;top:8px;left:0;right:0;height:6px;background:#EADCC4}
.suivi div:first-child::before{left:50%;border-radius:3px 0 0 3px}
.suivi div:last-child::before{right:50%}
.suivi div.fait::before{background:var(--palme)}
.suivi div::after{content:"";position:absolute;top:1px;left:calc(50% - 10px);width:20px;height:20px;border-radius:50%;background:var(--carte);border:3px solid #D9C6A6;box-sizing:border-box}
.suivi div.fait::after{background:var(--palme);border-color:var(--palme)}
.suivi div.fait{color:var(--texte);font-weight:600}
.suivi small{display:block;font-weight:400;color:var(--gris);font-size:11.5px}
@media (max-width:600px){
  .suivi{grid-auto-flow:row;gap:0}
  .suivi div{text-align:left;padding:0 0 18px 34px}
  .suivi div::before{top:0;bottom:0;left:9px;right:auto;width:4px;height:auto}
  .suivi div:first-child::before{left:9px;top:10px;border-radius:0}
  .suivi div:last-child::before{display:none}
  .suivi div::after{top:0;left:0}
}
.code-l{display:flex;align-items:center;gap:16px;background:var(--soleil-c);border:1px solid #F2D78A;border-radius:var(--r);padding:14px 16px}
.code-l .c{font-family:var(--titre);font-size:36px;font-weight:800;letter-spacing:.18em;font-variant-numeric:tabular-nums}
.livreur{display:flex;gap:12px;align-items:center;border:1px solid var(--ligne);border-radius:var(--r);padding:12px 14px}
.livreur .ph{width:52px;height:52px;border-radius:50%;background:#EADBC0;overflow:hidden;display:grid;place-items:center;font-weight:800;font-size:18px}
.livreur .ph img{width:100%;height:100%;object-fit:cover}

/* ── compte ──────────────────────────────────────────────── */
.tuiles-c{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.tuile-c{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--ligne);border-radius:var(--r);padding:16px;background:var(--carte);text-align:left}
.tuile-c:hover{background:#FCF6EC}
.tuile-c svg.i{width:34px;height:34px;color:var(--lagune);stroke-width:1.5}
.tuile-c b{display:block;font-size:16px}
.tuile-c small{color:var(--gris)}

/* ── espaces vendeur / admin ─────────────────────────────── */
.onglets{display:flex;gap:4px;border-bottom:1px solid var(--ligne);margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.onglets a{padding:10px 14px;font-weight:600;font-size:14px;color:var(--gris);border-bottom:3px solid transparent;white-space:nowrap}
.onglets a.on{color:var(--texte);border-color:var(--soleil)}
.chiffres{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.chiffre{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--r);padding:14px 16px}
.chiffre small{color:var(--gris);font-size:12.5px;font-weight:600}
.chiffre b{display:block;font-family:var(--titre);font-size:24px;font-weight:800;margin-top:2px}
.table{width:100%;border-collapse:collapse;font-size:14px;background:var(--carte)}
.table th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--gris);padding:10px;border-bottom:1px solid var(--ligne)}
.table td{padding:10px;border-bottom:1px solid var(--ligne2);vertical-align:top}
.table-w{overflow-x:auto;border:1px solid var(--ligne);border-radius:var(--r);background:var(--carte)}
.photos-e{display:flex;gap:8px;flex-wrap:wrap}
.photos-e .p{width:92px;height:92px;border:1px solid var(--ligne);border-radius:8px;position:relative;background:var(--ph);overflow:hidden}
.photos-e .p img{width:100%;height:100%;object-fit:cover}
.photos-e .p button.x{position:absolute;right:3px;top:3px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(11,59,69,.75);color:#fff;font-size:14px;line-height:1}
.photos-e .p button.prem{position:absolute;left:3px;bottom:3px;border:0;border-radius:6px;background:rgba(255,255,255,.92);font-size:11px;font-weight:700;padding:3px 6px}
.photos-e .p .pr{position:absolute;left:3px;bottom:3px;font-size:10px}
.photos-e label.aj{width:92px;height:92px;border:2px dashed #D3BF9C;border-radius:8px;display:grid;place-items:center;text-align:center;font-size:12px;color:var(--gris);cursor:pointer}
.var-l{display:grid;grid-template-columns:1fr 1fr 90px 110px 36px;gap:6px;margin-bottom:6px;align-items:center}
.var-l input{padding:8px 9px;font-size:14px}
.var-l button{border:0;background:none;color:var(--gris);font-size:20px}
@media (max-width:560px){.var-l{grid-template-columns:1fr 1fr 70px 36px}.var-l .vp{display:none}}
.alerte{border-radius:var(--r);padding:12px 14px;font-size:14px;display:flex;gap:10px;align-items:flex-start}
.alerte svg.i{margin-top:1px}
.a-info{background:#E3F2F0;color:#0B5858}
.a-att{background:var(--soleil-c);color:#6B4700}
.a-ko{background:var(--piment-c);color:#9C2515}
.a-ok{background:var(--palme-c);color:#0D5A2E}

/* ── pied de page ────────────────────────────────────────── */
.haut-p{display:block;width:100%;background:var(--encre3);color:#fff;border:0;padding:14px;font-size:13px;margin-top:36px}
.haut-p:hover{background:#168080}
footer{background:var(--encre2);color:#E3F1EF;font-size:14px}
footer .in{max-width:1100px;margin:0 auto;padding:36px 16px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
footer h5{color:#fff;font-size:15px;margin:0 0 10px}
footer a{display:block;padding:3px 0;color:#E3F1EF}
footer a:hover{text-decoration:underline}
footer .bas{border-top:1px solid #136A6A;text-align:center;padding:18px 16px;font-size:12.5px;color:#BFE0DC;display:flex;flex-direction:column;align-items:center;gap:10px}
footer .bas svg{height:24px}
@media (max-width:700px){footer .in{grid-template-columns:1fr 1fr}}

/* ── divers ──────────────────────────────────────────────── */
#toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:24px;z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center;width:max-content;max-width:92vw}
.toast{background:var(--encre);color:#fff;padding:12px 18px;border-radius:10px;font-weight:600;font-size:14px;box-shadow:0 8px 24px rgba(0,0,0,.25);display:flex;align-items:center;gap:10px}
.toast.ok{background:var(--palme)}
.toast.err{background:var(--piment)}
body.a-barre #toasts{bottom:90px}
dialog.modale{border:0;border-radius:14px;padding:0;width:min(520px,94vw);max-height:90vh;box-shadow:0 20px 60px rgba(0,0,0,.35)}
dialog.modale::backdrop{background:rgba(8,14,24,.6)}
dialog.modale .mh{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--ligne);font-weight:800;font-size:17px;position:sticky;top:0;background:var(--carte)}
dialog.modale .mh button{border:0;background:none;font-size:24px;line-height:1;color:var(--gris)}
dialog.modale .mc{padding:16px 18px 18px}
.squel{background:linear-gradient(90deg,#F0E3CC 25%,#F3E8D5 50%,#F0E3CC 75%);background-size:200% 100%;animation:sq 1.2s infinite;border-radius:8px}
@keyframes sq{to{background-position:-200% 0}}
.vide{text-align:center;padding:40px 16px;color:var(--gris)}
.vide svg.i{width:56px;height:56px;stroke-width:1.2;color:#D3BF9C;margin:0 auto 10px}
.vide h3{color:var(--texte)}
.sep{height:1px;background:var(--ligne);margin:14px 0}
.flex{display:flex;gap:10px;align-items:center}
.flex-w{flex-wrap:wrap}
.entre{justify-content:space-between}
.mt{margin-top:12px}.mt2{margin-top:20px}.mb{margin-bottom:12px}
.petit{font-size:13px}
.gras{font-weight:700}
.auth{max-width:400px;margin:24px auto}
.auth .logo-a{display:flex;justify-content:center;margin-bottom:16px}
.auth .logo-a svg{height:40px}
.onglet2{display:grid;grid-template-columns:1fr 1fr;background:#F1E5CF;border-radius:10px;padding:4px;margin-bottom:6px}
.onglet2 button{border:0;background:none;padding:9px;border-radius:8px;font-weight:700;color:var(--gris)}
.onglet2 button.on{background:var(--carte);color:var(--texte);box-shadow:0 1px 3px rgba(0,0,0,.1)}

/* ── signature Dantokpa ──────────────────────────────────── */
.tete::after{content:"";display:block;height:8px;background:url(kanvo-bande.svg) left center/auto 100% repeat-x}
footer::before{content:"";display:block;height:10px;background:url(kanvo-bande.svg) left center/auto 100% repeat-x}
footer{background:var(--encre)}
.tuile h3,.tete-sect h2,.bandeau-vente h3{font-family:var(--titre)}
.bandeau-vente{position:relative;overflow:hidden;padding-bottom:30px}
.bandeau-vente::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:url(kanvo-bande.svg) left center/auto 100% repeat-x}
.carte .ph img,.tuile .q4 .ph img,.ligne-p .ph img,.cmd .art .ph img{mix-blend-mode:multiply}
.recherche{border-radius:12px}.recherche select{border-radius:12px 0 0 12px}.recherche button{border-radius:0 12px 12px 0}
@media (max-width:860px){.recherche input{border-radius:12px 0 0 12px}}
.p-piment{background:var(--piment)}
.mdp{position:relative}.mdp .champ{padding-right:86px}
.oeil{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;padding:6px 8px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gris)}
.oeil:hover{color:var(--texte)}
.btn-panier{background:var(--lagune);color:#fff}.btn-panier:hover{background:var(--encre2)}
.qte{border-color:var(--lagune)}

/* v3 : point rouge, échanges avec l'équipe, studio photo, banque d'images */
.point-r{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--piment);margin-left:6px;vertical-align:middle;box-shadow:0 0 0 2px var(--carte)}
.expiree{color:var(--piment);font-weight:700}
.champ.ko{border-color:var(--piment);box-shadow:0 0 0 3px var(--piment-c)}
.fil-m{display:flex;flex-direction:column;gap:10px;margin:10px 0}
.msg{max-width:88%;border-radius:12px;padding:10px 12px;font-size:14px;line-height:1.45;border:1px solid var(--ligne)}
.msg.admin{background:var(--carte);align-self:flex-start;border-left:3px solid var(--encre)}
.msg.vendeur{background:#EAF3F1;align-self:flex-end}
.msg .qui{font-size:12px;color:var(--gris);margin-bottom:3px}
.msg .qui b{color:var(--texte)}
.msg ul{margin:6px 0 0;padding-left:18px}
.msg .docs{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.joints{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.joint{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ligne);border-radius:8px;padding:4px 8px;font-size:13px;background:var(--carte)}
.joint button{border:0;background:none;color:var(--gris);font-size:16px;line-height:1}
.cases{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin:6px 0 10px}
@media (max-width:520px){.cases{grid-template-columns:1fr}}
.st-case{display:flex;gap:8px;align-items:flex-start;font-size:14px;margin:6px 0;cursor:pointer}
.st-case input{margin-top:3px}
dialog.modale.large{width:min(920px,96vw)}
.studio{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:18px}
@media (max-width:720px){.studio{grid-template-columns:1fr}}
.st-vue{position:relative;background:repeating-conic-gradient(#F3E8D5 0 25%,#fff 0 50%) 0 0/20px 20px;border-radius:10px;overflow:hidden;aspect-ratio:1;border:1px solid var(--ligne)}
.st-vue img{width:100%;height:100%;object-fit:contain;display:block}
.st-att{position:absolute;right:8px;bottom:8px;background:rgba(11,59,69,.8);color:#fff;font-size:12px;border-radius:6px;padding:3px 8px}
.st-att[hidden]{display:none}
.st-modes{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.st-c{display:grid;grid-template-columns:96px 1fr;align-items:center;gap:8px;font-size:13px;font-weight:600;margin:4px 0}
.st-c input{width:100%;accent-color:var(--encre)}
#st-curseurs.grise{opacity:.45}
#st-maintien{touch-action:none;user-select:none;-webkit-user-select:none}
.photos-e .p button.ret{position:absolute;left:3px;top:3px;border:0;border-radius:6px;background:var(--encre);color:#fff;font-size:11px;font-weight:700;padding:3px 6px}
.photos-e .p .enc{position:absolute;inset:0;display:grid;place-items:center;background:rgba(255,253,248,.8);font-size:11px;font-weight:700;color:var(--gris)}
.src-photos{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.bq-f{display:grid;grid-template-columns:1fr 220px;gap:8px;margin-bottom:10px}
@media (max-width:560px){.bq-f{grid-template-columns:1fr}}
.bq-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;max-height:56vh;overflow:auto;padding:2px}
.bq-fiche{border:1px solid var(--ligne);border-radius:10px;background:var(--carte);padding:8px;text-align:left;display:flex;flex-direction:column;gap:3px;cursor:pointer;font:inherit;color:inherit}
.bq-fiche:hover{border-color:var(--encre)}
.bq-fiche b{font-size:14px;line-height:1.25}
.bq-fiche small{color:var(--gris);font-size:12px}
.bq-ph{aspect-ratio:1;background:#fff;border-radius:6px;display:grid;place-items:center;overflow:hidden;margin-bottom:4px}
.bq-ph img{width:100%;height:100%;object-fit:contain}
.bq-ph svg.i{width:36px;height:36px;color:#D3BF9C}
.bq-photos{display:flex;gap:8px;flex-wrap:wrap}
.bq-pc{position:relative;width:96px;cursor:pointer}
.bq-pc img{width:96px;height:96px;object-fit:contain;background:#fff;border:2px solid var(--ligne);border-radius:8px;display:block}
.bq-pc input{position:absolute;left:6px;top:6px;width:18px;height:18px;accent-color:var(--encre)}
.bq-pc input:checked + img{border-color:var(--encre)}
.bq-pc small{display:block;font-size:10px;color:var(--gris);margin-top:2px}
.bq-caracs{display:flex;flex-direction:column;gap:4px}
.bq-cr{display:grid;grid-template-columns:22px 130px 1fr;gap:8px;align-items:center;font-size:14px;padding:4px 0;border-bottom:1px dashed var(--ligne)}
.bq-cr span{font-weight:700}
.bq-cr em{font-style:normal}
.bq-cr select{padding:6px 8px;font-size:14px}
@media (max-width:520px){.bq-cr{grid-template-columns:22px 1fr}.bq-cr select,.bq-cr em{grid-column:2}}
.bq-mini{width:52px;height:52px;background:#fff;border:1px solid var(--ligne);border-radius:6px;overflow:hidden;display:grid;place-items:center}
.bq-mini img{width:100%;height:100%;object-fit:contain}
.bq-mini svg.i{width:24px;height:24px;color:#D3BF9C}
.bq-adm{width:140px}
.bq-adm .p{width:140px!important;height:140px!important}
.bq-adm .p img{object-fit:contain!important;background:#fff}
.bq-adm input{margin-top:4px;padding:6px 8px;font-size:12px}
.nb-fiche{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#EAF3F1;border-radius:10px;padding:10px 12px;font-size:14px;margin-bottom:10px}
.photos-e .p,.photos-e label.aj{width:112px;height:112px}
.bq-lettre{font:800 34px/1 var(--titre);color:#D3BF9C}
.bq-plus{grid-column:1/-1;justify-self:center}
.bq-marques{max-height:92px;overflow:auto}
.bq-outils{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.bq-outils .champ{width:auto;min-width:160px;padding:8px 10px}
.bq-libres{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin-top:10px}
.bq-libre{border:1px solid var(--ligne);border-radius:8px;overflow:hidden;background:var(--carte);font-size:11px}
.bq-libre img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:#fff}
.bq-libre div{padding:6px;color:var(--gris);line-height:1.3}
.bq-libre button{width:100%;border:0;border-top:1px solid var(--ligne);background:none;padding:7px;font-weight:700;color:var(--encre);cursor:pointer}
.bq-libre button:disabled{color:var(--gris)}
/* carte du point de retrait */
.lieu-q{position:relative}
.lieu-q svg.i{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--gris)}
.lieu-q .champ{padding-left:36px}
.lieu-r{display:grid;border:1px solid var(--ligne);border-radius:8px;overflow:hidden;margin-top:6px;background:var(--carte)}
.lieu-r:empty{display:none}
.lieu-r button{border:0;border-bottom:1px solid var(--ligne);background:none;text-align:left;padding:10px 12px;font:inherit;font-size:14px;cursor:pointer}
.lieu-r button:last-child{border-bottom:0}
.lieu-r button:hover{background:var(--ph)}
.lieu-r p{margin:0;padding:10px 12px;font-size:14px;color:var(--gris)}
.carte-r{position:relative;height:260px;border-radius:10px;overflow:hidden;background:var(--ph);margin-top:10px;border:1px solid var(--ligne)}
.carte-r #b-carte{position:absolute;inset:0}
.carte-pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);z-index:500;pointer-events:none;filter:drop-shadow(0 4px 4px rgba(0,0,0,.3))}
.zoom-b{position:absolute;right:10px;top:10px;z-index:500;display:grid;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.zoom-b button{width:38px;height:38px;border:0;background:var(--carte);font-size:20px;font-weight:700;color:var(--texte);cursor:pointer}
.zoom-b button+button{border-top:1px solid var(--ligne)}
/* l'iPhone zoome sur les champs sous 16 px et l'écran reste zoomé */
@media (pointer:coarse){input,select,textarea{font-size:16px!important}}
[hidden]{display:none!important}
