/* =====================================================================
   SKIN « DARK » (noir et or) · 29/10/2026
   Habillage premium posé sur le moteur commun v3 (obg-app.js + ospicynaan-app.css).
   Toutes les règles commencent par html.v3.skin-dark : elles battent les règles v3
   injectées par le moteur sans toucher aux autres applis.
   ===================================================================== */

html.skin-dark,html.skin-dark body{background:#0b0b0d}
html.skin-dark #app{
  --brand:#e8c46a;--brandText:#141210;--brand2:#141210;
  --bg:#0b0b0d;--card:#141417;--elev:#1a1a1e;--text:#f4f1ea;--muted:#a39e93;
  --line:#2a2722;--hair:rgba(232,196,106,.10);--imgbg:#18181b;
  --gold:#e8c46a;--gold-deep:#c9a14a;--gold-soft:rgba(232,196,106,.10);--gold-line:rgba(232,196,106,.28);
  --r-sm:10px;--r-lg:18px;
  background:radial-gradient(120% 60% at 50% -10%,#1c1a15 0%,#0b0b0d 55%) fixed,#0b0b0d;color:var(--text)
}

/* ---------- titres : Barlow Condensed (identité), prix en or ---------- */
html.v3.skin-dark #app .c-px,html.v3.skin-dark #app .bs-px,html.v3.skin-dark #app .cl-px,html.v3.skin-dark #app .us-px,html.v3.skin-dark #app .supp-px,html.v3.skin-dark #app .item-base{color:var(--gold)!important}
html.v3.skin-dark #app .sec-title,html.v3.skin-dark #app .rail-head h2{color:var(--text)!important;display:flex;align-items:center;gap:12px;letter-spacing:.02em!important}
html.v3.skin-dark #app .sec-title::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--gold-line),transparent)}

/* ---------- barre du haut : mot-symbole LA DALLE noir et or ---------- */
html.v3.skin-dark #app .topbar{background:linear-gradient(to bottom,#0b0b0d 76%,transparent)!important}
html.v3.skin-dark #app .topbar .brand-logo{display:none!important}
html.v3.skin-dark #app .topbar::before{content:"LA";order:0;font:900 25px/1 'Barlow Condensed',sans-serif;letter-spacing:.02em;color:var(--text);min-height:30px;display:flex;align-items:center}
html.v3.skin-dark #app .topbar::after{content:"DALLE";order:1;margin-left:-4px;font:900 25px/1 'Barlow Condensed',sans-serif;letter-spacing:.02em;color:var(--gold)}
html.v3.skin-dark #app .topbar > *{order:2}
html.v3.skin-dark #app .tb-rate{background:var(--gold-soft)!important;color:var(--gold)!important;border:0!important}
html.v3.skin-dark #app .tb-open{margin-left:auto;background:rgba(255,255,255,.04)!important;border:1px solid var(--line)!important;color:var(--text)!important}

/* ---------- hero : photo en carte, filet or, « & » or ---------- */
html.v3.skin-dark #app .hero{border-radius:22px!important;border:1px solid var(--gold-line)!important;box-shadow:0 24px 48px -20px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.4) inset!important;overflow:hidden}
html.v3.skin-dark #app .hero-img{opacity:.78!important}
html.v3.skin-dark #app .hero::after{background:linear-gradient(to top,rgba(8,8,10,.92) 6%,rgba(8,8,10,.35) 55%,rgba(8,8,10,.1))!important}
html.v3.skin-dark #app .hero-title{font-size:60px!important;letter-spacing:.005em!important}
html.v3.skin-dark #app .hero-title span{color:var(--gold)!important}
html.v3.skin-dark #app .hero-badge{background:rgba(10,10,12,.62)!important;border:1px solid var(--gold-line)!important;color:var(--gold)!important;letter-spacing:.02em}
html.v3.skin-dark #app .hero-sub{color:rgba(244,241,234,.86)!important}

/* cadeau : bandeau or */
html.v3.skin-dark #app .v3gift{background:linear-gradient(135deg,rgba(232,196,106,.14),rgba(232,196,106,.04))!important;border:1px solid var(--gold-line)!important;color:var(--text)!important}
html.v3.skin-dark #app .v3gift .v3i{color:var(--gold)!important}

/* recherche + catégories */
html.v3.skin-dark #app .v3sticky{background:#0b0b0d!important}
html.v3.skin-dark #app .msearch{background:var(--card)!important;border:1px solid var(--line)!important}
html.v3.skin-dark #app .msearch input{background:transparent!important;color:var(--text)!important}
html.v3.skin-dark #app .cat{background:var(--card)!important;border:1px solid var(--line)!important;color:var(--muted)!important}
html.v3.skin-dark #app .cat.active,html.v3.skin-dark #app .chip.on,html.v3.skin-dark #app .chip.incl.on{background:var(--gold)!important;border-color:var(--gold)!important;color:#141210!important}

/* commander à plusieurs */
html.v3.skin-dark #app .v3grp{background:linear-gradient(135deg,#17171a,#111113)!important;border:1px solid var(--line)!important}
html.v3.skin-dark #app .v3grp .gi-ic .v3i{color:var(--gold)!important}

/* les plus commandés */
html.v3.skin-dark #app .bs,html.v3.skin-dark #app .v3rail .bs,html.v3.skin-dark #app .upsell .bs{background:var(--card)!important;border:1px solid var(--line)!important;box-shadow:0 14px 28px -16px rgba(0,0,0,.9)!important}
html.v3.skin-dark #app .bs-media{background:var(--imgbg)!important}
html.v3.skin-dark #app .bs-rank{background:var(--gold)!important;color:#141210!important;border-radius:999px!important}

/* actus + fidélité */
html.v3.skin-dark #app .nwp{border:1px solid var(--gold-line)!important;box-shadow:0 18px 34px -18px rgba(0,0,0,.95)!important}
html.v3.skin-dark #app .nws-d i.on{background:var(--gold)!important}
html.v3.skin-dark #app .loy-lite{background:var(--card)!important;border:1px solid var(--gold-line)!important;border-style:solid!important;color:var(--text)!important}
html.v3.skin-dark #app .loy-lite .ll-stk{color:var(--gold)!important}

/* ---------- cartes produits ---------- */
html.v3.skin-dark #app .section .card{background:var(--card)!important;border:1px solid var(--line)!important;box-shadow:0 16px 30px -18px rgba(0,0,0,.95)!important}
html.v3.skin-dark #app .section .card-ov{background:linear-gradient(to top,rgba(10,10,12,.92) 8%,rgba(10,10,12,.35) 48%,transparent 78%)!important}
html.v3.skin-dark #app .card-plus{background:var(--gold)!important;color:#141210!important;box-shadow:0 6px 16px rgba(232,196,106,.28)!important}
html.v3.skin-dark #app .hot{background:var(--gold)!important;color:#141210!important}
html.v3.skin-dark #app .c-qty{background:var(--gold)!important;color:#141210!important}

/* ---------- barre panier + navigation ---------- */
html.v3.skin-dark #app .cartbar-in{background:linear-gradient(135deg,#f1d68a,#d9b155)!important;color:#141210!important;box-shadow:0 16px 34px -12px rgba(232,196,106,.45)!important}
html.v3.skin-dark #app .cartbar-in *{color:#141210!important}
html.v3.skin-dark #app nav,html.v3.skin-dark #app .navbar,html.v3.skin-dark #app .tabbar{background:rgba(11,11,13,.97)!important;border-top:1px solid var(--line)!important}

/* ---------- boutons principaux ---------- */
html.v3.skin-dark #app .cta{background:linear-gradient(135deg,#f1d68a,#d9b155)!important;color:#141210!important;border:0!important;box-shadow:0 16px 32px -14px rgba(232,196,106,.55)!important}
html.v3.skin-dark #app .cta *{color:#141210!important}
html.v3.skin-dark #app .icon-btn{background:rgba(20,20,23,.9)!important;border:1px solid var(--line)!important;color:var(--text)!important}

/* ---------- fiche produit : grande photo ---------- */
html.v3.skin-dark #app .v3ihead{position:relative;display:block!important;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 2px!important}
html.v3.skin-dark #app .v3ihead .icon-btn{position:absolute;top:calc(22px + env(safe-area-inset-top,0px));left:28px;z-index:2;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
html.v3.skin-dark #app .v3ithumb{width:100%!important;height:auto!important;aspect-ratio:4/3;border-radius:22px!important;border:1px solid var(--gold-line);box-shadow:0 26px 46px -22px rgba(0,0,0,.95);background:radial-gradient(80% 80% at 50% 40%,#232019,#121214)!important}
html.v3.skin-dark #app .v3ithumb img{object-fit:var(--imgfit,cover)}
html.v3.skin-dark #app .v3itx{padding:16px 4px 4px}
html.v3.skin-dark #app .v3itx .item-nm{font-size:38px!important;line-height:.95!important}
html.v3.skin-dark #app .v3itx .item-desc{-webkit-line-clamp:3!important;font-size:14.5px!important;margin-top:8px!important}
html.v3.skin-dark #app .v3prog span{color:var(--gold)!important}
html.v3.skin-dark #app .v3prog b,html.v3.skin-dark #app .step-dots .sd.on{background:var(--gold)!important}
html.v3.skin-dark #app .opt-tag{background:var(--gold-soft)!important;color:var(--gold)!important;border:0!important}
html.v3.skin-dark #app .chip{background:var(--card)!important;border:1px solid var(--line)!important;color:var(--text)!important}
html.v3.skin-dark #app .supp-card{background:var(--card)!important;border:1px solid var(--line)!important}
html.v3.skin-dark #app .supp-card.on{border-color:var(--gold)!important;box-shadow:0 0 0 1px var(--gold)!important}
html.v3.skin-dark #app .supp-add,html.v3.skin-dark #app .supp-step{border-color:var(--gold)!important;color:var(--gold)!important;border-radius:999px!important}
html.v3.skin-dark #app .supp-sb{color:var(--gold)!important}
html.v3.skin-dark #app .supp-check,html.v3.skin-dark #app .supp-badge{background:var(--gold)!important;color:#141210!important}
html.v3.skin-dark #app .toggle-row.on{border-color:var(--gold)!important}
html.v3.skin-dark #app .toggle-row.on .tr-check{background:var(--gold)!important;border-color:var(--gold)!important;color:#141210!important}
html.v3.skin-dark #app .v3mo.on,html.v3.skin-dark #app .v3mopt.on{border-color:var(--gold)!important;background:var(--gold-soft)!important;box-shadow:none!important}
html.v3.skin-dark #app .v3rd.on{background:var(--gold)!important;border-color:var(--gold)!important;color:#141210!important}

/* ---------- panier ---------- */
html.v3.skin-dark #app .cl-qb{border-color:var(--line)!important;color:var(--text)!important;background:var(--card)!important}
html.v3.skin-dark #app .v3-giftline{color:var(--gold)!important;font-weight:600}
html.v3.skin-dark #app .v3plus{border-color:var(--gold)!important;color:var(--gold)!important}
html.v3.skin-dark #app .v3loy-b i{border-color:var(--gold-line)!important;border-radius:999px!important}
html.v3.skin-dark #app .v3loy-b i.on{background:var(--gold)!important;border-color:var(--gold)!important}
html.v3.skin-dark #app .v3loy-b i.next{border-color:var(--gold)!important}
html.v3.skin-dark #app .totals .trow.big span:last-child,html.v3.skin-dark #app .totals .trow.big .disp{color:var(--gold)!important}

/* ---------- paiement ---------- */
html.v3.skin-dark #app .sheet-hd .v3ctot{color:var(--gold)!important}
html.v3.skin-dark #app .v3-seg{background:var(--card)!important;border:1px solid var(--line)!important}
html.v3.skin-dark #app .v3-seg button.on,html.v3.skin-dark #app .v3-seg .on{background:var(--gold)!important;color:#141210!important}
html.v3.skin-dark #app .field input,html.v3.skin-dark #app .field textarea,html.v3.skin-dark #app .field select{background:var(--card)!important;border:1px solid var(--line)!important;color:var(--text)!important}
html.v3.skin-dark #app .field input:focus,html.v3.skin-dark #app .field textarea:focus{border-color:var(--gold)!important;box-shadow:0 0 0 3px var(--gold-soft)!important;outline:none}
html.v3.skin-dark #app .v3recapline button,html.v3.skin-dark #app .v3cf-link{color:var(--gold)!important}

/* ---------- confirmation ---------- */
html.v3.skin-dark #app .cf-numcard{background:linear-gradient(135deg,#1b1915,#111113)!important;border:1px solid var(--gold-line)!important}
html.v3.skin-dark #app .cf-numcard .cf-num-v{color:var(--gold)!important}
html.v3.skin-dark #app .v3cf-h .v3i{color:var(--gold)!important}