/* Preset "Cosmetic" (original pastel cosmetic boutique look): cream #FFF8F6, blush #F9E4E8, lavender #ECE6F7, ink #3D2B35,
   rose #C2547A (primary, AA on white), mauve #8A6BBE (accent). Cormorant Garamond titles + Nunito body; El Messiri/Almarai (Arabic).
   Dark mode via toggle (html[data-mode=dark]) or prefers-color-scheme. Layout: centered header, banner hero, pill buttons, soft rounded cards. */
:root,:root:not([data-mode=dark]),:root[data-mode=light]{
  --c-bg:#FFF8F6;--c-surface:#FFFFFF;--c-surface-2:#FDEFF1;--c-soft:#F9E4E8;--c-line:#F1DDE2;--c-line-strong:#E4C4CD;
  --c-ink:#3D2B35;--c-muted:#7A6570;--c-primary:#C2547A;--c-on-primary:#FFFFFF;--c-primary-soft:#FBE3EB;
  --c-accent:#8A6BBE;--c-on-accent:#FFFFFF;--c-accent-ink:#6D4FA3;--c-accent-soft:#ECE6F7;--c-focus:#C2547A;
  --c-header-bg:#FFFFFF;--c-header-ink:#3D2B35;--c-header-muted:#7A6570;--c-header-line:#F1DDE2;--c-header-accent:#C2547A;
  --c-hero-bg:#F9E4E8;--c-hero-ink:#3D2B35;--c-hero-muted:#6E5A64;--c-hero-media:#F4D3DC;--c-hero-media-2:#E6DCF4;
  --c-footer-bg:#F6E9EE;--c-footer-ink:#6E5A64;--c-footer-title:#3D2B35;
  --c-sidebar-bg:#3D2B35;--c-sidebar-ink:#E9D9E0;--c-sidebar-active:rgba(255,255,255,.1);
  --c-success:#2F7D5B;--c-success-soft:#E2F3EA;--c-danger:#B4233F;--c-danger-soft:#FCE8EC;--c-warning:#8A5300;--c-warning-soft:#FCF1DE;--c-info:#5B4BB0;--c-info-soft:#ECE9FA;
  --font-latin:"Nunito";--font-arabic:"Almarai";--font-display-face:"Cormorant Garamond";
  --font-display:var(--font-display-face),"El Messiri",var(--font-fallback);--display-weight:600;--display-style-em:italic;--display-tracking:0;
  --r-xs:8px;--r-sm:12px;--r-md:18px;--r-lg:22px;--r-xl:30px;--r-media:20px;--r-arch:999px;--r-btn:999px;--r-input:14px;
  --shadow:0 2px 8px rgba(194,84,122,.08);--shadow-lg:0 18px 40px rgba(138,107,190,.16);
  color-scheme:light;
}
:root[data-mode=dark]{
  --c-bg:#1E161B;--c-surface:#2A1F26;--c-surface-2:#33262F;--c-soft:#3A2B35;--c-line:#46343F;--c-line-strong:#5A4451;
  --c-ink:#F7EAF0;--c-muted:#C9B3BE;--c-primary:#F2A7C3;--c-on-primary:#2A1520;--c-primary-soft:#4A2636;
  --c-accent:#C7B2F0;--c-on-accent:#221A33;--c-accent-ink:#C7B2F0;--c-accent-soft:#352C4A;--c-focus:#F2A7C3;
  --c-header-bg:#1E161B;--c-header-ink:#F7EAF0;--c-header-muted:#C9B3BE;--c-header-line:#46343F;--c-header-accent:#F2A7C3;
  --c-hero-bg:#2A1F26;--c-hero-ink:#F7EAF0;--c-hero-muted:#D8C4CE;--c-hero-media:#4A2636;--c-hero-media-2:#352C4A;
  --c-footer-bg:#160F13;--c-footer-ink:rgba(247,234,240,.72);--c-footer-title:#F7EAF0;
  --c-success:#7CD3A8;--c-success-soft:#173226;--c-danger:#FF9AAE;--c-danger-soft:#3E1822;--c-warning:#F2C37A;--c-warning-soft:#3A2A12;--c-info:#B7AAF5;--c-info-soft:#272347;
  --shadow:0 1px 2px rgba(0,0,0,.4);--shadow-lg:0 16px 40px rgba(0,0,0,.5);
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){:root:not([data-mode]):not([data-theme=light]){
  --c-bg:#1E161B;--c-surface:#2A1F26;--c-surface-2:#33262F;--c-soft:#3A2B35;--c-line:#46343F;--c-line-strong:#5A4451;
  --c-ink:#F7EAF0;--c-muted:#C9B3BE;--c-primary:#F2A7C3;--c-on-primary:#2A1520;--c-primary-soft:#4A2636;
  --c-accent:#C7B2F0;--c-on-accent:#221A33;--c-accent-ink:#C7B2F0;--c-accent-soft:#352C4A;--c-focus:#F2A7C3;
  --c-header-bg:#1E161B;--c-header-ink:#F7EAF0;--c-header-muted:#C9B3BE;--c-header-line:#46343F;--c-header-accent:#F2A7C3;
  --c-hero-bg:#2A1F26;--c-hero-ink:#F7EAF0;--c-hero-muted:#D8C4CE;--c-hero-media:#4A2636;--c-hero-media-2:#352C4A;
  --c-footer-bg:#160F13;--c-footer-ink:rgba(247,234,240,.72);--c-footer-title:#F7EAF0;
  --c-success:#7CD3A8;--c-success-soft:#173226;--c-danger:#FF9AAE;--c-danger-soft:#3E1822;--c-warning:#F2C37A;--c-warning-soft:#3A2A12;--c-info:#B7AAF5;--c-info-soft:#272347;
  --shadow:0 1px 2px rgba(0,0,0,.4);--shadow-lg:0 16px 40px rgba(0,0,0,.5);
  color-scheme:dark;
}}
html[data-preset=cosmetic] .topbar{background:linear-gradient(90deg,var(--c-soft),var(--c-accent-soft));color:var(--c-ink);text-align:center}
html[data-preset=cosmetic] .site-header{background:color-mix(in srgb,var(--c-header-bg) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--c-header-line)}
html[data-preset=cosmetic] .main-nav a{border-radius:999px;padding-inline:.8em}
html[data-preset=cosmetic] .main-nav a[aria-current=page]{background:var(--c-primary-soft);color:var(--c-primary)}
html[data-preset=cosmetic] .cart-pill{background:var(--c-primary);color:var(--c-on-primary);border-radius:999px}
html[data-preset=cosmetic] .hero{background:radial-gradient(70% 120% at 15% 0%,var(--c-hero-media) 0%,transparent 60%),radial-gradient(60% 100% at 90% 100%,var(--c-hero-media-2) 0%,transparent 60%),var(--c-hero-bg);border-radius:0 0 var(--r-xl) var(--r-xl)}
html[data-preset=cosmetic] .hero h1 em{color:var(--c-primary)}
html[data-preset=cosmetic] .hero .eyebrow{color:var(--c-accent-ink);letter-spacing:.12em}
html[data-preset=cosmetic] .hero-ctas .btn-hero{background:var(--c-primary);color:var(--c-on-primary);border-color:var(--c-primary);border-radius:999px}
html[data-preset=cosmetic] .cat-strip{background:var(--c-bg);border-color:var(--c-line)}
html[data-preset=cosmetic] .cat-strip a{font-family:var(--font-body)!important;font-style:normal!important;font-size:.92rem!important;color:var(--c-ink);background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:999px;padding:.35em 1em}
html[data-preset=cosmetic] .cat-strip a:hover{background:var(--c-primary-soft);color:var(--c-primary)}
html[data-preset=cosmetic] .cat-strip a::after{content:none}
html[data-preset=cosmetic] .pcard{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:10px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
html[data-preset=cosmetic] .pcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
html[data-preset=cosmetic] .pcard .thumb{background:var(--c-surface-2);border-radius:var(--r-md)}
html[data-preset=cosmetic] .pcard .name{font-family:var(--font-body);font-weight:600;font-size:.95rem}
html[data-preset=cosmetic] .pcard .price{color:var(--c-primary);font-weight:700}
html[data-preset=cosmetic] .pcard .tag{font-family:var(--font-body);font-style:normal;font-weight:700;background:var(--c-accent);color:var(--c-on-accent);border-radius:999px}
html[data-preset=cosmetic] .btn{font-weight:700;border-radius:var(--r-btn)}
html[data-preset=cosmetic] .badge{border-radius:999px;background:var(--c-accent-soft);color:var(--c-accent-ink)}
html[data-preset=cosmetic] .product-page .big-price{color:var(--c-primary)}
html[data-preset=cosmetic] .gallery-main{background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-xl)}
html[data-preset=cosmetic] .cart-line,html[data-preset=cosmetic] .card{background:var(--c-surface);border-color:var(--c-line);border-radius:var(--r-lg)}
html[data-preset=cosmetic] .summary-total{color:var(--c-primary)}
html[data-preset=cosmetic] .site-footer{border-radius:var(--r-xl) var(--r-xl) 0 0}
html[data-preset=cosmetic] .bottom-nav{background:var(--c-surface);border-top:1px solid var(--c-line);border-radius:var(--r-lg) var(--r-lg) 0 0}
html[data-preset=cosmetic] .bottom-nav a[aria-current=page]{color:var(--c-primary)}
html[data-preset=cosmetic] .wilaya-bar{background:var(--c-accent-soft);color:var(--c-accent-ink)}
[dir=rtl][data-preset=cosmetic] body{--font-display:"El Messiri",var(--font-fallback);--display-style-em:normal}
[dir=rtl][data-preset=cosmetic] .hero{background-position:right}

/* 2026-10-30 responsive — phones/tablets: solid header without blur (keeps the fixed off-canvas menu full height). */
@media(max-width:1023.98px){html[data-preset=cosmetic] .site-header{background:var(--c-header-bg);-webkit-backdrop-filter:none;backdrop-filter:none}}