/* Purged 2026-09-07: rules whose classes/ids appear nowhere in the root templates or JS were removed (audit). Original kept as style.legacy.css */
:root{
  --bg:#ffffff;
  --bg-alt:#f5f5f5;
  --accent:#111111;
  --accent-light:#555555;
  --text:#111111;
  --text-muted:#767676;
  --border:#e5e5e5;
  --header-bg:rgba(255,255,255,.97);
  --img-a:#f0f0f0;
  --img-b:#e2e2e2;
}
[data-theme="dark"]{
  --bg:#111111;
  --bg-alt:#1a1a1a;
  --accent:#ffffff;
  --accent-light:#cccccc;
  --text:#f5f5f5;
  --text-muted:#999999;
  --border:#2e2e2e;
  --header-bg:rgba(17,17,17,.97);
  --img-a:#242424;
  --img-b:#1a1a1a;
}
*{margin:0;padding:0;box-sizing:border-box;}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Montserrat',sans-serif;
  font-weight:400;
  line-height:1.6;
  transition:background .25s, color .25s;
}
h1,h2,h3{
  font-family:'Montserrat','Noto Naskh Arabic',sans-serif;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.02em;
}
html[dir="rtl"] body{
  font-family:'Noto Naskh Arabic','Montserrat',sans-serif;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3{
  font-family:'Noto Naskh Arabic',sans-serif;
  text-transform:none;
}
a{color:inherit;text-decoration:none;}
.topbar{
  background:var(--accent);
  color:var(--bg);
  text-align:center;
  font-size:.8rem;
  font-weight:500;
  padding:8px 12px;
  letter-spacing:.02em;
}
.logo{
  font-family:'Montserrat',sans-serif;
  text-transform:uppercase;
  font-size:1.6rem;
  font-weight:700;
  letter-spacing:.05em;
}
.logo span{color:var(--accent);}
.main-nav{
  display:flex;
  gap:28px;
  flex:1;
  justify-content:center;
}
.main-nav a{
  font-size:.82rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--text-muted);
  transition:color .2s;
}
.main-nav a:hover{color:var(--accent-light);}
.main-nav-dept{
  background:none;
  border:none;
  padding:4px 0;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--text-muted);
  cursor:pointer;
  font-family:inherit;
}
.main-nav-dept.active{color:var(--text);}
.main-nav-dept:hover{color:var(--accent-light);}
.main-nav-empty-dept{
  padding:16px 0;
  color:var(--text-muted);
  font-size:.85rem;
  text-align:center;
}
.main-nav-item{
  position:relative;
  padding:18px 0;
}
.main-nav-toggle{
  display:none;
  background:none;
  border:none;
  color:var(--text-muted);
  cursor:pointer;
  padding:4px;
  font-size:.7rem;
  touch-action:manipulation;
}
.main-nav-dropdown{
  display:none;
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:4px;
  box-shadow:0 16px 32px rgba(0,0,0,.15);
  padding:10px 0;
  min-width:190px;
  z-index:60;
}
.main-nav-item:hover .main-nav-dropdown{display:block;}
.main-nav-dropdown a{
  display:block;
  padding:9px 20px;
  font-size:.78rem;
  white-space:nowrap;
}
.main-nav-dropdown a:hover{background:var(--bg-alt);}
.search-bar{
  max-height:0;
  overflow:hidden;
  transition:max-height .25s ease;
  border-top:0 solid var(--border);
}
.search-bar.open{
  max-height:80px;
  overflow:visible;
  border-top:1px solid var(--border);
}
.search-bar-form{
  position:relative;
  max-width:1920px;
  margin:0 auto;
  padding:16px 24px;
  display:flex;
  gap:10px;
}
.search-suggestions{
  display:none;
  position:absolute;
  top:100%;
  left:24px;
  right:24px;
  background:var(--bg);
  border:1px solid var(--border);
  border-top:none;
  border-radius:0 0 4px 4px;
  box-shadow:0 12px 24px rgba(0,0,0,.25);
  z-index:50;
  overflow:hidden;
  padding:20px;
  display:none;
  gap:24px;
}
.search-suggestions.open{display:flex;}
@media (max-width:700px){.search-suggestions{flex-direction:column;padding:16px;max-height:70vh;overflow-y:auto;}#searchRecentMobile .product-related-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
    overflow-x:visible;
    padding-right:0;
  }#searchRecentMobile .product-related-grid .product-card{width:auto;flex-shrink:initial;}}
.search-bar-form input{
  flex:1;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:12px 16px;
  border-radius:2px;
  font-family:inherit;
  font-size:16px;
}
.search-bar-form input:focus{
  outline:none;
  border-color:var(--accent);
}
.search-bar-form button{
  background:var(--accent);
  color:var(--bg);
  border:none;
  padding:0 20px;
  border-radius:2px;
  cursor:pointer;
  font-size:1rem;
}
.btn-primary{
  display:inline-block;
  background:var(--accent);
  color:var(--bg);
  padding:14px 36px;
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:600;
  border-radius:2px;
  transition:background .2s;
}
.btn-primary:hover{background:var(--accent-light);}
[data-theme="dark"] .hero-banner:not(.has-photo){
  background:linear-gradient(135deg, #2a2a2a 0%, #050505 100%);
}
.hero-banner:not(.has-photo) .hero-banner-overlay{background:none;}
.categories{max-width:1920px;margin:0 auto;padding:0 24px 40px;}
.category-tile:not(.has-photo){
  background:linear-gradient(160deg, var(--text) 0%, var(--accent-light) 100%);
}
.products{max-width:1920px;margin:0 auto;padding:0 24px 20px;}
.product-grid.grid-dense{
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
}
.product-card{
  position:relative;
  display:block;
  background:var(--bg);
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow:hidden;
  transition:opacity .2s;
}
.product-card:hover{
  opacity:.85;
}
.product-gallery-thumb{
  width:100%;
  aspect-ratio:3/5;
  border:1px solid var(--border);
  padding:0;
  background:none;
  cursor:pointer;
  overflow:hidden;
  border-radius:4px;
}
.product-gallery-thumb.active{border-color:var(--text);border-width:2px;}
.product-gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.product-detail-img-wrap{position:relative;flex:1;min-width:0;display:flex;gap:10px;touch-action:pan-y;}
.product-detail-main-slot{flex:1;min-width:0;height:100%;}
.product-detail-main-slot .product-detail-img{width:100%;height:100%;}
@media (min-width:769px){.product-detail-img-wrap{height:600px;}.product-gallery-thumbs .product-gallery-thumb:nth-child(-n+2){display:none;}}
@media (max-width:768px){.product-detail-img-wrap{flex-direction:column;order:1;}.product-detail-img-wrap .product-detail-main-slot:nth-child(2){display:none;}.product-gallery-thumb{flex:1 1 0;min-width:78px;}}
.color-select-options{display:flex;flex-wrap:wrap;gap:10px;}
.color-option{
  width:34px;
  height:34px;
  border-radius:50%;
  border:2px solid var(--bg);
  box-shadow:0 0 0 1px var(--border);
  cursor:pointer;
  padding:0;
}
.color-option.active{box-shadow:0 0 0 2px var(--text);}
.size-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:340px;}
.size-option{
  padding:12px 6px;
  border:1px solid var(--border);
  background:none;
  color:var(--text);
  font-size:.85rem;
  cursor:pointer;
  border-radius:2px;
  transition:border-color .15s, background .15s, color .15s;
}
.size-option:hover{border-color:var(--text);}
.size-option.active{border-color:var(--text);border-width:2px;background:var(--text);color:var(--bg);}
.product-detail-form .btn-primary[disabled]{background:var(--border);color:var(--text-muted);cursor:not-allowed;}
.cart-sidebar-item-variant{display:block;font-size:.78rem;color:var(--text-muted);margin:2px 0;}
.wishlist-heart{
  position:absolute;
  top:10px;
  right:10px;
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.85);
  border:none;
  border-radius:50%;
  color:var(--text);
  font-size:.95rem;
  cursor:pointer;
  z-index:5;
  transition:background .2s, color .2s, transform .15s;
}
:root:not([data-theme="light"]) .wishlist-heart{background:rgba(20,20,20,.7);}
:root[data-theme="dark"] .wishlist-heart{background:rgba(20,20,20,.7);}
.wishlist-heart i{font-weight:400;}
.wishlist-heart.active{color:#e0384a;}
.wishlist-heart.active i{font-weight:900;}
.wishlist-heart:hover{transform:scale(1.08);}
[dir="rtl"] .wishlist-heart{right:auto;left:10px;}
.product-img{
  display:block;
  width:100%;
  aspect-ratio:3/5;
  object-fit:cover;
  background:linear-gradient(135deg,var(--img-a),var(--img-b));
}
.product-card h3{
  font-size:.85rem;
  font-weight:500;
  text-transform:none;
  letter-spacing:0;
  padding:14px 14px 2px;
}
.product-price{
  font-size:.85rem;
  color:var(--text-muted);
  font-weight:400;
  padding:2px 14px 16px;
}
.auth-card{
  background:var(--bg-alt);
  border:1px solid var(--border);
  border-radius:4px;
  padding:36px 28px;
}
.auth-form .btn-primary{
  border:none;
  cursor:pointer;
  margin-top:6px;
}
.product-detail-img.has-photo::before{display:none;}
.product-detail-img.js-zoomable{cursor:zoom-in;}
.product-zoom-overlay.open{opacity:1;visibility:visible;}
.product-zoom-img.zoomed{cursor:zoom-out;}
.product-detail-price{
  font-size:1.6rem;
  color:var(--accent-light);
  font-weight:600;
  margin-bottom:22px;
}
.product-rating-summary{display:inline-flex;align-items:center;gap:8px;margin-bottom:18px;color:var(--text);text-decoration:none;font-size:.85rem;}
.star-full{color:#e0384a;}
.star-half{color:#e0384a;opacity:.5;}
.star-empty{color:var(--border);}
@media (max-width:600px){.product-related-grid .product-card{width:150px;flex-shrink:0;}}
.product-reviews{max-width:1920px;margin:0 auto;padding:32px 60px 60px;border-top:1px solid var(--border);}
[dir="rtl"] .product-reviews{text-align:right;}
.review-item{border:1px solid var(--border);border-radius:12px;padding:20px 22px;background:var(--img-a,rgba(127,127,127,.04));display:flex;flex-direction:column;gap:10px;}
.review-form{width:100%;border:1px solid var(--border);border-radius:12px;padding:26px 28px;background:var(--img-a,rgba(127,127,127,.04));box-sizing:border-box;}
.review-star-btn{background:none;border:none;font-size:1.9rem;line-height:1;cursor:pointer;color:var(--border);padding:0;transition:color .1s,transform .1s;}
.review-star-btn:hover{transform:scale(1.12);}
.review-star-btn.active{color:#e0384a;}
.review-form textarea{width:100%;border:1px solid var(--border);border-radius:8px;padding:12px 14px;font-family:inherit;font-size:16px;resize:vertical;margin-bottom:16px;background:var(--bg);color:var(--text);}
.review-form textarea:focus{outline:none;border-color:var(--text);}
.review-photo-preview.has-image{border-style:solid;}
.review-photo-preview.has-image i{display:none;}
.review-modal-overlay.open{opacity:1;visibility:visible;}
.review-modal-body .review-form{border:none;padding:0;background:none;}
.review-pill{padding:9px 16px;border:1px solid var(--border);border-radius:20px;background:none;color:var(--text);font-size:.8rem;cursor:pointer;transition:border-color .15s,background .15s,color .15s;}
.review-pill:hover{border-color:var(--text);}
.review-pill.active{border-color:var(--text);background:var(--text);color:var(--bg);}
.product-detail-form{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:16px;
  margin-bottom:20px;
  width:100%;
}
.product-detail-form label{
  font-size:.8rem;
  color:var(--text-muted);
}
.product-detail-form input{
  width:70px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:10px;
  border-radius:2px;
  font-family:inherit;
  text-align:center;
}
.product-detail-form .btn-primary{
  border:none;
  cursor:pointer;
}
.address-suggestions{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  right:0;
  margin-top:4px;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:2px;
  box-shadow:0 12px 24px rgba(0,0,0,.25);
  z-index:20;
  overflow:hidden;
}
.address-suggestions.open{display:block;}
.address-suggestion{
  display:block;
  width:100%;
  text-align:left;
  background:none;
  border:none;
  border-bottom:1px solid var(--border);
  padding:10px 14px;
  font-size:.82rem;
  color:var(--text);
  cursor:pointer;
  font-family:inherit;
}
.address-suggestion:last-child{border-bottom:none;}
.address-suggestion:hover{background:var(--bg-alt);color:var(--accent-light);}
[dir="rtl"] .address-suggestion{text-align:right;}
#billingAddressFields{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.cart-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  opacity:0;
  visibility:hidden;
  transition:opacity .25s ease;
  z-index:200;
}
.cart-overlay.open{
  opacity:1;
  visibility:visible;
}
.cart-sidebar{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  width:100%;
  max-width:400px;
  background:var(--bg);
  border-left:1px solid var(--border);
  box-shadow:-12px 0 32px rgba(0,0,0,.3);
  z-index:201;
  display:flex;
  flex-direction:column;
  transform:translateX(100%);
  transition:transform .3s ease;
}
.cart-sidebar.open{transform:translateX(0);}
[dir="rtl"] .cart-sidebar{
  right:auto;
  left:0;
  border-left:none;
  border-right:1px solid var(--border);
  box-shadow:12px 0 32px rgba(0,0,0,.3);
  transform:translateX(-100%);
}
[dir="rtl"] .cart-sidebar.open{transform:translateX(0);}
.account-overlay.open{opacity:1;visibility:visible;}
.account-sidebar.open{transform:translateX(0);}
[dir="rtl"] .account-sidebar.open{transform:translateX(0);}
@media (max-width:600px){.cart-sidebar,
  .account-sidebar{
    max-width:none;
    border-left:none;
    border-right:none;
    box-shadow:none;
  }[dir="rtl"] .cart-sidebar,
  [dir="rtl"] .account-sidebar{
    border-left:none;
    border-right:none;
    box-shadow:none;
  }}
.account-sidebar-body{padding:28px 24px;}
.account-sidebar-body h3{
  font-size:1.4rem;
  margin-bottom:8px;
}
.google-signin-btn{margin-bottom:16px;}
.google-signin-btn > div{width:100% !important;}
.cart-sidebar-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px 24px;
  border-bottom:1px solid var(--border);
}
.cart-sidebar-header h3{
  font-family:'Montserrat','Noto Naskh Arabic',sans-serif;
  text-transform:uppercase;
  font-weight:700;
  font-size:1.2rem;
}
.cart-sidebar-items{
  flex:1;
  overflow-y:auto;
  padding:8px 24px;
}
.cart-sidebar-empty{
  color:var(--text-muted);
  text-align:center;
  padding:40px 0;
  font-size:.9rem;
}
.cart-sidebar-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 0;
  border-bottom:1px solid var(--border);
}
.cart-sidebar-item-img{
  display:block;
  width:56px;
  height:56px;
  flex-shrink:0;
  border-radius:4px;
  object-fit:cover;
  background:linear-gradient(135deg,var(--img-a),var(--img-b));
}
.cart-sidebar-item-info{
  flex:1;
  min-width:0;
}
.cart-sidebar-item-name{
  display:block;
  font-size:.82rem;
  color:var(--text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-bottom:4px;
}
.cart-sidebar-item-price{
  font-size:.8rem;
  color:var(--accent-light);
}
.cart-sidebar-item-controls{
  display:flex;
  align-items:center;
  gap:6px;
}
.cart-sidebar-item-controls input{
  width:44px;
  background:var(--bg-alt);
  border:1px solid var(--border);
  color:var(--text);
  padding:6px;
  border-radius:2px;
  font-family:inherit;
  text-align:center;
  font-size:.8rem;
}
.cart-sidebar-remove{
  background:none;
  border:none;
  color:var(--text-muted);
  cursor:pointer;
  font-size:.85rem;
}
.cart-sidebar-remove:hover{color:#c83c3c;}
.cart-sidebar-footer{
  flex-shrink:0;
  padding:20px 24px 24px;
  border-top:1px solid var(--border);
}
.cart-sidebar-footer .cart-total{
  text-align:center;
  margin-bottom:14px;
}
.cart-sidebar-footer .section-link{
  margin-top:0;
}
.cart-total{
  font-size:1.1rem;
}
.cart-total span{
  color:var(--accent-light);
  font-weight:600;
}
.admin-price-form .btn-primary{
  padding:8px 14px;
  font-size:.72rem;
  border:none;
  cursor:pointer;
}
.ak-nav a.active{
  background:linear-gradient(90deg, rgba(224,56,74,.1) 0%, rgba(224,56,74,.0875) 50%, rgba(0,0,0,0) 100%);
  border-left-color:#e0384a;
  color:#e9ecef;
  font-weight:400;
}
.ak-nav a.active i{color:#e9ecef;}
@media (max-width:900px){.ak-nav a.active{border-left-color:transparent;border-bottom-color:#e0384a;}}
.vendor-product-form .btn-primary{align-self:flex-start;border:none;cursor:pointer;padding:10px 20px;font-size:.75rem;}
.vendor-status-toggle.is-active{background:#c8e6c9;color:#1e5c22;}
.vendor-wizard-step-dot.active{background:var(--text);border-color:var(--text);color:var(--bg);}
.vendor-wizard-nav .btn-primary,
.vendor-wizard-nav .btn-outline{padding:12px 24px;}
.vendor-landing-cta .btn-primary,
.vendor-landing-cta .btn-outline{padding:15px 30px;}
.vendor-landing-final-cta .btn-primary{padding:15px 34px;}
.cookie-banner-actions .btn-primary,
.cookie-banner-actions .btn-outline{padding:10px 20px;font-size:.75rem;white-space:nowrap;}
.whatsapp-float-btn{
  position:fixed;
  right:20px;
  bottom:20px;
  width:56px;
  height:56px;
  border-radius:50%;
  background:#25d366;
  color:#ffffff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.6rem;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
  z-index:250;
  transition:transform .15s ease;
}
.whatsapp-float-btn:hover{transform:scale(1.06);}
@media (max-width:600px){.whatsapp-float-btn{right:14px;bottom:14px;width:50px;height:50px;font-size:1.4rem;}}
.admin-photo-upload-form .btn-primary{
  padding:8px 14px;
  font-size:.72rem;
  border:none;
  cursor:pointer;
}
.category-pill.active{
  background:var(--accent);
  color:var(--bg);
  border-color:var(--accent);
}
.view-toggle-btn{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:none;
  border:1px solid var(--border);
  border-radius:2px;
  color:var(--text-muted);
  cursor:pointer;
}
.view-toggle-btn.active{
  background:var(--accent);
  color:var(--bg);
  border-color:var(--accent);
}
.filter-tab.active i{transform:rotate(180deg);}
.toolbar-pagination{
  display:flex;
  align-items:center;
  gap:10px;
}
.page-arrow.disabled{color:var(--border);pointer-events:none;}
.range-track{
  position:absolute;
  top:11px;
  height:2px;
  background:var(--accent);
}
.filter-drawer-overlay.open{opacity:1;visibility:visible;}
.filter-drawer.open{transform:translateX(0);}
.filter-accordion-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:none;
  border:none;
  padding:18px 0;
  font-family:inherit;
  font-weight:700;
  font-size:.8rem;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--text);
  cursor:pointer;
}
.filter-accordion-toggle i{font-size:.7rem;color:var(--text-muted);transition:transform .2s;}
.filter-accordion-toggle[aria-expanded="true"] i{transform:rotate(180deg);}
body.filter-drawer-locked{overflow:hidden;}
@media (max-width:700px){.product-grid,
  .product-grid.grid-dense{
    grid-template-columns:repeat(2,1fr);
  }.products{padding-left:0;padding-right:0;}}
.filter-bar .btn-primary{
  border:none;
  cursor:pointer;
  padding:10px 22px;
}
.pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  margin:40px auto 0;
  padding-top:30px;
  border-top:1px solid var(--border);
  font-size:.85rem;
}
.pagination a{
  color:var(--accent-light);
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:.78rem;
}
.pagination a:hover{color:var(--accent);}
.infinite-scroll-sentinel{height:1px;}
.infinite-scroll-spinner{
  display:flex;
  justify-content:center;
  padding:30px 0;
}
.infinite-scroll-spinner::after{
  content:'';
  width:26px;
  height:26px;
  border:2px solid var(--border);
  border-top-color:var(--accent-light);
  border-radius:50%;
  animation:infinite-scroll-spin .7s linear infinite;
}
@keyframes infinite-scroll-spin{to{transform:rotate(360deg);}}
.cart-qty-input{
  width:36px;
  text-align:center;
  border:none;
  border-left:1px solid var(--border);
  border-right:1px solid var(--border);
  height:30px;
  font-size:.85rem;
  background:none;
  color:var(--text);
  -moz-appearance:textfield;
}
.cart-qty-input::-webkit-outer-spin-button,
.cart-qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.section-link{
  display:block;
  text-align:center;
  margin-top:24px;
  color:var(--accent-light);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:.8rem;
}
.section-link:hover{color:var(--accent);}
@media (max-width:860px){.main-nav{
    display:none;
    position:fixed;
    inset:0;
    background:var(--bg);
    flex-direction:column;
    padding:0;
    border-bottom:none;
    z-index:201;
    max-height:none;
    overflow-y:auto;
    gap:0;
  }.main-nav.open{display:flex;}.main-nav{padding:0 20px 20px;}.main-nav-dept{font-size:.9rem;}.main-nav-item{padding:0;border-bottom:1px solid var(--border);}.main-nav-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;}.main-nav-toggle i{transition:transform .2s;}.main-nav-item.open .main-nav-toggle i{transform:rotate(180deg);}.main-nav-dropdown{
    display:none;
    position:static;
    transform:none;
    background:none;
    border:none;
    box-shadow:none;
    border-radius:0;
    padding:0 0 12px;
    min-width:0;
  }.main-nav-item.open .main-nav-dropdown{display:flex;flex-direction:column;gap:2px;}.main-nav-dropdown a{padding:9px 0 9px 8px;font-size:.8rem;color:var(--text-muted);}.search-bar.open{
    display:flex;
    flex-direction:column;
    position:fixed;
    inset:0;
    max-height:none;
    overflow-y:auto;
    z-index:201;
    background:var(--bg);
    border-top:none;
  }.search-bar-mobile-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:20px 24px;
    border-bottom:1px solid var(--border);
    flex-shrink:0;
  }.search-bar-form{padding:16px 24px;}.search-suggestions{
    position:static;
    left:auto;right:auto;
    border:none;
    box-shadow:none;
    max-height:none;
  }.search-recent-mobile{padding:0 24px 24px;}.search-recent-title{font-size:.85rem;font-weight:600;margin:8px 0 14px;}}
@media (min-width:861px){.main-nav-mobile-header,
  .search-bar-mobile-header,
  .search-recent-mobile{display:none;}}
.account-tab-btn.is-active{background:var(--accent);color:var(--bg);}
.account-tab-panel.is-active{display:block;}
.account-referral-copy-btn{
  border:none;
  cursor:pointer;
  flex-shrink:0;
}
.cart-saved-actions .btn-primary{padding:8px 16px;font-size:.72rem;}/* Modernist redesign — base tokens + resets taken verbatim from the Claude
   Design handoff's own <style> block. Everything else on the pages this
   stylesheet serves uses INLINE styles copied directly from the template
   (inline always wins over style.css, so nothing from the old theme can
   bleed through), matching how the source .dc.html itself is authored. */

/* --on-acc: the text colour to put ON TOP of --acc. It cannot be a fixed white: the dark
   theme lightens --acc to #ff563c so a red link stays readable on a dark page (5.26:1),
   and white text on that same fill drops to 3.16:1 — below AA, on the Add-to-cart button.
   Darkening --acc instead would fix the button and break the links, so the two roles are
   separated rather than compromised. */
:root{
  --ink:#201e1d; --ground:#f3f2f2; --paper:#ffffff; --acc:#d02a11; --on-acc:#ffffff; --mut:#605d5d; --line:#201e1d;
}
[data-theme="dark"]{
  --ink:#f8f4f4; --ground:#201e1d; --paper:#2d2b2b; --acc:#ff563c; --on-acc:#201e1d; --mut:#9b9797; --line:#605d5d;
}

/* Les panneaux coulissants (panier, compte) sont en position:fixed et attendent fermes a
   translateX(100%). Hors de l'ecran, ils elargissaient malgre tout la zone defilable : sur un
   telephone de 320 px le document faisait 412 px, la page glissait de cote et le contenu
   passait sous le bord droit — sur toutes les pages et dans les quatre langues. Tous les
   autres elements mesures trop larges ne faisaient que remplir ce document elargi ; il n'y
   avait qu'une cause.
   'clip' plutot que 'hidden' : hidden ferait de la racine un conteneur de defilement et
   casserait position:sticky ailleurs sur le site. hidden reste en repli pour les navigateurs
   qui ne connaissent pas clip. */
html,body{overflow-x:hidden;overflow-x:clip}
body{margin:0;background:var(--ground);font-family:"Archivo",system-ui,sans-serif;color:var(--ink)}
[dir="rtl"] body{font-family:"Noto Kufi Arabic","Archivo",system-ui,sans-serif}
a{color:var(--acc);text-decoration:none}
a:hover{color:#ae1800}
.mn *{box-sizing:border-box}
.mn button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;text-align:inherit;border-radius:0}
.mn input{font-family:inherit}
.mn img{max-width:100%}
.mn .sc::-webkit-scrollbar{height:0}
@keyframes mo-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Page root wrapper, exactly the mockup's outer <div> */
.mn{width:100%;background:var(--ground);color:var(--ink);display:flex;flex-direction:column}

/* ===== Drawers / overlays: JS-driven (.open toggling), and the cart drawer's
   item rows are injected by main.js using these class names — CSS is
   unavoidable here since there's no server-rendered markup to inline-style. ===== */
.main-nav, .search-bar, .cart-sidebar{transition:none}
.main-nav:not(.open), .search-bar:not(.open){display:none}
.cart-sidebar{position:fixed;inset:0;z-index:30;transform:translateX(100%);transition:transform .16s ease-out}
.cart-sidebar.open{transform:translateX(0)}
.cart-overlay{position:fixed;inset:0;z-index:29;background:rgba(32,30,29,.5);display:none}
.cart-overlay.open{display:block}
.main-nav.open, .search-bar.open{position:fixed;inset:0;z-index:35;background:var(--ground);display:flex;flex-direction:column;animation:mo-in .16s ease-out}

/* Mobile category accordion rows: collapsed unless the parent row is .open (JS-toggled).
   These class names are reused from the pre-redesign stylesheet purely as main.js hooks
   (toggle/open state, department filter) — style.css still has real rules attached to
   them (old desktop hover-dropdown positioning, Montserrat font, spacing), so every
   property it sets must be neutralized here rather than relying on breakpoint luck. */
.main-nav-dropdown{display:none;position:static;transform:none;background:none;border:none;box-shadow:none;border-radius:0;padding:0;margin:0;min-width:0}
.main-nav-item:hover .main-nav-dropdown{display:none}
.main-nav-item.open .main-nav-dropdown{display:flex}
.main-nav-item{position:static;padding:0;margin:0}
.main-nav-dept{font-family:inherit}
.main-nav-toggle{padding:0;height:auto;font-size:inherit}
/* main.js filters department rows via the `hidden` property; the rows also carry an
   inline display:flex for their own layout, which otherwise always wins over `hidden`. */
.main-nav-item[hidden]{display:none !important}
/* main.js toggles .active on click, but the buttons' initial colors are server-rendered
   inline (hardcoded to the default department) — let the JS-driven class win instead. */
.main-nav-dept.active{background:var(--ink,#201e1d) !important;color:var(--ground,#f3f2f2) !important}
.main-nav-dept:not(.active){background:none !important;color:var(--ink,#201e1d) !important}
.main-nav-item.open .main-nav-toggle i{transform:rotate(180deg)}
.main-nav-toggle i{transition:transform .15s}

.cart-sidebar{width:min(440px,94vw);margin-left:auto;background:var(--ground);border-left:2px solid var(--line);display:flex;flex-direction:column;box-shadow:-14px 0 34px rgba(32,30,29,.28)}
@media (max-width:1023px){ .cart-sidebar{width:100%;border-left:0} }
.cart-sidebar-header{flex:none;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:22px clamp(14px,3vw,26px);border-bottom:2px solid var(--line)}
.cart-sidebar-header h3{font-weight:900;font-size:22px;text-transform:uppercase;letter-spacing:-.01em;margin:0}
.cart-sidebar-items{flex:1;overflow-y:auto;display:flex;flex-direction:column}
.cart-sidebar-empty{padding:40px 26px;font-weight:800;font-size:18px}
.cart-sidebar-item{display:flex;gap:14px;padding:18px clamp(14px,3vw,26px);border-bottom:2px solid var(--line)}
.cart-sidebar-item-img{width:82px;height:110px;flex:none;background:var(--paper);object-fit:cover;border:2px solid var(--line)}
.cart-sidebar-item-info{flex:1;display:flex;flex-direction:column;gap:7px}
.cart-sidebar-item-name{font-weight:600;font-size:13px;line-height:1.3;color:var(--ink)}
.cart-sidebar-item-variant{font:500 9px/1 "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.cart-sidebar-item-price{font-weight:800;font-size:15px}
.cart-sidebar-item-controls{display:flex;align-items:center;gap:10px;margin-top:auto}
.cart-sidebar-footer{flex:none;padding:20px 26px 24px;border-top:2px solid var(--line);display:flex;flex-direction:column;gap:12px}
.cart-sidebar-footer .cart-total{display:flex;justify-content:space-between;font-weight:900;font-size:22px;margin:0}
.cart-sidebar-footer .btn-primary{background:var(--acc);color:#fff;padding:17px 20px;font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;text-align:center}
.cart-sidebar-footer .section-link{border:2px solid var(--line);padding:14px 20px;font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);display:block;text-align:center}

/* No body bottom padding: the floating tab bar slides away when the footer is in view, and
   #main > .mn already keeps content clear of it. */

/* Keyboard focus: the inline outline:none on form fields hid it entirely. !important is the only
   way a stylesheet rule beats an inline declaration; :focus-visible keeps mouse clicks clean. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--acc,#ec3013) !important;outline-offset:2px}
.mn-skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--ink,#201e1d);color:var(--ground,#f3f2f2);padding:10px 14px;font-weight:700}
.mn-skip:focus{left:8px}
/* The floating WhatsApp button covered cart totals on 375px screens. */
@media (max-width:640px){#main > .mn{padding-bottom:84px}}

/* Icons: inline SVG sprite (/css/icons.svg) replaces Font Awesome — 1em box, inherits colour like the <i> it replaces. */
.fa-icon{width:1em;height:1em;display:inline-block;vertical-align:-0.125em;fill:currentColor;flex:none}
/* Honeypot wrapper (config/security.php) — moved here from the purged style.css; a visible
   "website" field next to the newsletter input was the symptom. */
.hp-wrap{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}
/* The notify-me box is rendered hidden and opened by clicking a sold-out size; its inline
   display:flex used to beat the hidden attribute, so it showed on every product. */
#stockNotifyBox[hidden]{display:none !important}

/* Desktop nav: tighter on narrow desktops so the 10 categories stay on one line */
@media (min-width:1024px) and (max-width:1220px){#desktopNavLinks{gap:6px 12px !important}.mn-desktop-nav-link{font-size:11px !important;letter-spacing:0.05em !important}}
#headerSearchInput::placeholder{color:var(--ground,#f3f2f2);opacity:0.6}

/* PDP breadcrumb: on narrow screens the back link goes under the crumb instead of overlapping it */
@media (max-width:640px){.mn-pdp-crumb{flex-wrap:wrap;gap:10px 16px}.mn-pdp-crumb > span{flex:1 1 100%;line-height:1.5 !important}}
/* Newsletter: placeholder readable on the red block (default grey hurt on red) */
#nlEmail::placeholder{color:rgba(255,255,255,0.8);opacity:1}
#nlEmail{caret-color:#fff}

/* ---- Desktop mega menu ---------------------------------------------------------------- */
.mn-desktop-nav-item{padding-bottom:12px;margin-bottom:-12px}
.mn-mega{display:none;position:absolute;left:0;right:0;top:100%;z-index:60;background:var(--paper,#fff);border:2px solid var(--line,#201e1d);border-top:0;box-shadow:0 24px 40px rgba(32,30,29,0.18);padding:26px clamp(16px,4vw,48px) 30px;gap:0 clamp(20px,3vw,44px);text-align:start}
.mn-mega-col{display:flex;flex-direction:column;min-width:0;padding-inline-end:clamp(12px,2vw,28px);border-inline-end:1px solid rgba(32,30,29,0.12)}
.mn-mega-col:last-of-type{border-inline-end:0}
.mn-mega-h{font-weight:800;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink,#201e1d);padding:0 0 12px}
.mn-mega-link{display:block;padding:7px 0;font-weight:500;font-size:13px;color:var(--ink,#201e1d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-mega-link.is-strong{font-weight:700}
.mn-mega-link:hover,.mn-mega-row:hover span{color:var(--acc,#ec3013)}
.mn-mega-row{display:flex;align-items:center;gap:14px;padding:6px 0;border-bottom:1px solid rgba(32,30,29,0.12);font-weight:500;font-size:13px;color:var(--ink,#201e1d)}
.mn-mega-row:last-child{border-bottom:0}
.mn-mega-row img,.mn-mega-dot{width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:top;border:2px solid var(--line,#201e1d);background:var(--ground,#f3f2f2);flex:none}
.mn-mega-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mn-mega-promo{position:relative;display:flex;align-items:flex-end;min-height:300px;border:2px solid var(--line,#201e1d);background-size:cover;background-position:top center;color:#fff;padding:16px}
.mn-mega-promo::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,0.65) 100%)}
.mn-mega-promo span{position:relative;font-weight:900;font-size:16px;letter-spacing:0.04em;text-transform:uppercase;line-height:1.1}
.mn-mega-promo:hover span{text-decoration:underline}
/* Floating mobile tab bar: labels on one line, compact height */
.mn-tabbar > a,.mn-tabbar > button{padding:9px 2px 10px !important;gap:5px !important}
.mn-tabbar > a > span:last-child,.mn-tabbar > button > span:last-child{white-space:nowrap;font-size:7.5px !important;letter-spacing:0.02em !important}

/* ---- Address autocomplete suggestions ------------------------------------------------ */
.address-suggestions{display:none;position:absolute;left:0;right:0;top:100%;z-index:30;background:var(--paper,#fff);border:2px solid var(--line,#201e1d);border-top:0;max-height:260px;overflow-y:auto}
.address-suggestions.open{display:block}
.address-suggestion{display:flex;flex-direction:column;gap:3px;width:100%;text-align:start;padding:10px 13px;border:0;border-bottom:1px solid rgba(32,30,29,0.12);background:none;color:var(--ink,#201e1d);cursor:pointer;font-family:inherit}
.address-suggestion:last-child{border-bottom:0}
.address-suggestion:hover,.address-suggestion:focus-visible{background:var(--ground,#f3f2f2)}
.address-suggestion-main{font-weight:700;font-size:13px}
.address-suggestion-sub{font:500 10px/1.3 'IBM Plex Mono',monospace;letter-spacing:0.06em;text-transform:uppercase;color:var(--mut,#605d5d)}

/* Wishlist button feedback (product page button has no .wishlist-heart styling of its own) */
.js-wishlist-toggle.active{color:var(--acc,#ec3013) !important}
.js-wishlist-toggle[data-heart-swap].active{border-color:var(--acc,#ec3013) !important}
.js-wishlist-toggle.wish-pop svg{animation:mnWishPop .38s cubic-bezier(.2,.9,.3,1.4)}
@keyframes mnWishPop{0%{transform:scale(1)}45%{transform:scale(1.45)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.js-wishlist-toggle.wish-pop svg{animation:none}}

/* ---- Desktop filter sidebar: follows the scroll on infinite-scroll pages ------------------- */
/* Category, search and boutique pages now load far more products than fit one screen; without
   this the filter panel is stuck at the top of the (very tall) grid row and scrolls out of view
   after the first few products. align-self:start keeps the sidebar at its own content height
   inside the grid (grid items stretch by default), sticky+top pins it near the viewport top as
   the page scrolls, and max-height/overflow-y give it its own scrollbar if the filter list is
   itself taller than the viewport. */
@media (min-width:1024px){
  .mn-cat-sidebar,.mn-search-sidebar{position:sticky;top:24px;align-self:start;max-height:calc(100vh - 48px);overflow-y:auto}
}

/* Curseur de prix double (filtres), même dessin que PriceRangeSlider de l'app */
.mn-price-range{display:flex;flex-direction:column;gap:14px}
.mn-price-range-vals{display:flex;align-items:center;gap:8px}
.mn-price-range-box{flex:1;min-width:0;border:2px solid var(--line,#201e1d);background:var(--paper,#fff);padding:7px 9px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.mn-price-range-box.is-right{align-items:flex-end;text-align:right}
.mn-price-range-lab{font:500 9px/1 'IBM Plex Mono',monospace;letter-spacing:0.12em;color:var(--mut,#605d5d)}
.mn-price-range-val{font-weight:800;font-size:13px;line-height:1.15;white-space:normal;overflow-wrap:anywhere;color:var(--ink,#201e1d)}
.mn-price-range-dash{flex:none;width:10px;height:2px;background:var(--line,#201e1d)}
.mn-price-range-track{position:relative;height:24px}
.mn-price-range-bg{position:absolute;left:12px;right:12px;top:10px;height:4px;box-sizing:border-box;border:2px solid var(--line,#201e1d);background:var(--paper,#fff)}
.mn-price-range-fill{position:absolute;top:10px;height:4px;background:var(--acc,#ec3013)}
.mn-price-range input[type=range]{-webkit-appearance:none;appearance:none;position:absolute;left:0;top:0;width:100%;height:24px;margin:0;padding:0;background:transparent;pointer-events:none;outline:none}
.mn-price-range input[type=range]::-webkit-slider-runnable-track{background:transparent;height:24px}
.mn-price-range input[type=range]::-moz-range-track{background:transparent;height:24px}
.mn-price-range input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border:2px solid var(--ink,#201e1d);border-radius:0;background:linear-gradient(var(--ground,#f3f2f2),var(--ground,#f3f2f2)) center/2px 10px no-repeat var(--ink,#201e1d);pointer-events:auto;cursor:grab;box-shadow:0 2px 4px rgba(0,0,0,0.25)}
.mn-price-range input[type=range]::-moz-range-thumb{width:20px;height:20px;border:2px solid var(--ink,#201e1d);border-radius:0;background:linear-gradient(var(--ground,#f3f2f2),var(--ground,#f3f2f2)) center/2px 10px no-repeat var(--ink,#201e1d);pointer-events:auto;cursor:grab;box-shadow:0 2px 4px rgba(0,0,0,0.25)}
.mn-price-range input[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid var(--acc,#ec3013);outline-offset:2px}
.mn-price-range input[type=range]:focus-visible::-moz-range-thumb{outline:2px solid var(--acc,#ec3013);outline-offset:2px}
.mn-price-range-btn{align-self:flex-end;border:2px solid var(--line,#201e1d);padding:8px 14px;font-weight:700;font-size:11px;letter-spacing:0.1em;color:var(--ink,#201e1d);background:none}

/* Barre d'onglets mobile : ancrée par le haut (svh = hauteur stable du viewport) pour ne pas
   suivre la barre d'adresse Safari qui se replie au scroll. Repli « bottom » sinon (inline). */
@supports (top: 1svh){
  .mn-tabbar{bottom:auto !important;top:calc(100svh - 14px);transform:translateY(-100%)}
  @media (display-mode: standalone){ .mn-tabbar{top:calc(100svh - 14px - env(safe-area-inset-bottom,0px))} }
}