*{margin:0;padding:0;box-sizing:border-box;font-family:'Jost', sans-serif;}
body{background:#fff;color:#111;overflow-x:hidden;}
header{position:sticky;top:0;z-index:99;background:#fff;border-bottom:1px solid #eee;margin-bottom:0!important}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;max-width:1400px;margin:auto;}
.hamburger{width:28px;cursor:pointer;display:flex;flex-direction:column;gap:5px;}
.hamburger span{height:2px;background:#111;display:block;transition:.3s}
.logo{font-weight:600;font-size:20px;letter-spacing:2px;cursor:pointer;}
.cart-icon{cursor:pointer;position:relative;font-size:22px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;}
.cart-count{position:absolute;top:-8px;right:-8px;background:#111;color:#fff;font-size:10px;width:18px;height:18px;border-radius:50%;display:none;align-items:center;justify-content:center;}
.cart-count.show{display:flex;}
.drawer{position:fixed;top:0;left:-100%;width:340px;height:100vh;background:#fff;z-index:999;transition:.4s ease;padding:25px;overflow-y:auto;}
.drawer.active{left:0;}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:500;display:none;}
.overlay.active{display:block;}
.drawer ul{list-style:none;margin-top:30px;}
.drawer ul li{padding:14px 0;border-bottom:1px solid #eee;cursor:pointer;}
.drawer ul li a{text-decoration:none;color:#111;text-transform:uppercase;font-size:15px;display:block;letter-spacing:.5px}
.close-btn{font-size:28px;cursor:pointer;float:right;}
.search-drawer{position:fixed;top:-100%;left:0;width:100%;background:#fff;z-index:999;transition:.4s ease;padding:25px 20px;box-shadow:0 10px 20px rgba(0,0,0,.1);}
.search-drawer.active{top:0;}
.search-box{display:flex;align-items:center;max-width:700px;margin:auto;border-bottom:1.5px solid #111;width:100%;}
.search-box input{flex:1;border:0;padding:16px 10px;font-size:16px;outline:none;width:100%;}
.search-box span{cursor:pointer;font-size:13px;color:#777;padding:10px}
.view{display:none;}.view.active{display:block;}
.collection-head{text-align:center;padding:35px 20px 20px;}
.collection-head h1{font-family:'EB Garamond',serif;font-size:36px;text-transform:uppercase;letter-spacing:1px}
.collection-head p{font-size:14px;color:#666;max-width:750px;margin:12px auto 0;line-height:1.7}
.products{max-width:1400px;margin:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px;}
.card{border:1px solid #eee;cursor:pointer}
.card-img{aspect-ratio:1/1;background:#f9f9f9;overflow:hidden;position:relative;}
.card-img img{width:100%;height:100%;object-fit:cover;}
.card-info{padding:12px;}
.card-info h3{font-size:13px;font-weight:400;height:36px;overflow:hidden;line-height:1.3}
.sale{position:absolute;top:8px;left:8px;background:#111;color:#fff;font-size:10px;padding:4px 8px}
.pagination{display:flex;justify-content:center;align-items:center;gap:8px;padding:25px;flex-wrap:wrap}
.pagination button{padding:10px 16px;border:1px solid #111;background:#fff;cursor:pointer;font-size:14px}
.pagination button.active{background:#111;color:#fff}
.pagination.next-btn{background:#111;color:#fff;padding:12px 20px}
#productView{padding:0!important;margin:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;height:auto;padding-top:0!important}
.waseeh-gallery{position:relative;width:100%;max-width:100%;margin:0.5px auto 0 auto!important;padding:0!important;display:block;line-height:0}
.thumbs, #thumbs{display:none!important}
.gallery-dots{display:flex;justify-content:center;align-items:center;gap:6px;padding:0!important;margin:0!important;height:14px!important;line-height:0!important}
.gallery-dots span{width:6px;height:6px;border-radius:50%;background:#d1c7b8;display:block;transition:.3s;cursor:pointer}
.gallery-dots span.active{background:#111;width:18px;border-radius:10px}
.main-img{width:100%;background:#f8f8f8;display:flex;align-items:center;justify-content:center;border:none;overflow:hidden;margin:0!important;padding:0!important;line-height:0!important}
.main-img img{width:400px!important;height:400px!important;max-width:400px!important;max-height:400px!important;min-width:400px!important;min-height:400px!important;object-fit:contain!important;display:block;background:#fff;margin:0!important}
.product-options-row{max-width:1000px;margin:10px auto 0 auto!important;padding:0 12px!important;display:flex!important;flex-direction:row!important;gap:12px!important;justify-content:space-between!important;align-items:flex-start!important;}
.product-options-row > div{flex:0 0 50%!important;width:50%!important;max-width:50%!important;min-width:0!important;margin:0!important;}
.product-options-row > div:first-child{padding-right:6px!important}
.product-options-row > div:last-child{padding-left:6px!important}
#baseColorWrap{margin:0!important}
.variant-wrap, #variantBtns{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:10px!important;padding:10px 0 6px 0!important;margin-top:6px!important;width:100%!important;}
#variantBtns button, .variant-btn{width:110px!important;min-width:110px!important;max-width:110px!important;flex:0 0 auto!important;padding:10px 12px!important;font-size:13px!important;white-space:nowrap!important;text-align:center!important;border:1px solid #111!important;}
#variantBtns button.active{background:#111!important;color:#fff!important;}
.variant-wrap::-webkit-scrollbar, #variantBtns::-webkit-scrollbar{display:none}
.product-layout-waseeh{max-width:800px;margin:auto;padding:0 20px 40px;}
.breadcrumb{text-align:center;font-size:12px;color:#777;margin:0.5px 0 0 0!important;padding:0.5px 0 0 0!important}
.waseeh-title{font-family:'EB Garamond', serif;font-size:28px;text-align:center;text-transform:uppercase;line-height:1.2;margin:4px 0 0 0!important}
.waseeh-price{text-align:center;display:flex;justify-content:center;gap:12px;align-items:center;font-size:18px;margin:6px 0 0 0!important}
.waseeh-price s{color:#777;font-size:16px}
.style-label{text-align:center;font-size:13px;letter-spacing:3px;margin:20px 0 12px;text-transform:uppercase}
.variant-btn{border:1px solid #b8b0a8;padding:10px 18px;font-size:13px;background:#fff;cursor:pointer}
.variant-btn.active{border:2px solid #111;font-weight:600;background:#f5f5f0}
.waseeh-details h3{font-size:17px;margin:28px 0 10px;font-weight:500}
.waseeh-details ul{padding-left:20px;color:#333;font-size:14px;line-height:1.9}
.btn-green{width:100%;background:#25D366;color:#fff;padding:15px;border:0;cursor:pointer;text-transform:uppercase;margin-top:10px;display:block;text-align:center;text-decoration:none;}
.cart-container{max-width:800px;margin:auto;padding:30px 20px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#111;color:#fff;padding:12px 25px;border-radius:30px;font-size:14px;z-index:1000;display:none;}
.toast.show{display:block;}
@media(max-width:900px){.products{grid-template-columns:repeat(2,1fr);}.waseeh-title{font-size:22px}.collection-head h1{font-size:28px}}
@media(max-width:500px){
 .main-img img{width:92vw!important;height:92vw!important;min-width:92vw!important;min-height:92vw!important;max-width:400px!important;max-height:400px!important}
 .product-options-row{gap:10px!important;padding:0 10px!important}
 #variantBtns button, .variant-btn{width:100px!important;min-width:100px!important;max-width:100px!important}
}

/* ===== BASE COLOR - 3 IN 1 LINE SMALL ===== */
#colorBtns{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:8px!important;
  row-gap:10px!important;
  padding:8px 0 6px 0!important;
  margin-top:6px!important;
}
#colorBtns::-webkit-scrollbar{display:none}
#colorBtns > div{
  width:38px!important;
  height:auto!important;
  min-height:48px!important;
  flex:0 0 38px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:4px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  cursor:pointer!important;
  margin:0!important;
}
#colorBtns > div > div:first-child{
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  border-radius:50%!important;
  border:1.5px solid #999!important;
  display:block!important;
  flex-shrink:0!important;
}
#colorBtns > div.active > div:first-child{
  border:2px solid #111!important;
  box-shadow:0 0 0 2px #fff, 0 0 0 3px #111!important;
}
#colorBtns > div > span,
#colorBtns > div > div:last-child{
  font-size:9px!important;
  text-align:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  width:38px!important;
  height:auto!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
/* ===== QTY - 3 BOXES SAME SIZE JUDE HUE ===== */
.qty{display:flex!important;gap:0!important;align-items:center!important;justify-content:center!important;margin:25px 0 15px 0!important;}
.qty button{width:45px!important;height:45px!important;min-width:45px!important;border:1px solid #111!important;background:#fff!important;color:#111!important;font-size:20px!important;cursor:pointer!important;display:flex!important;align-items:center!important;justify-content:center!important;}
.qty input#qty{width:60px!important;height:45px!important;border:1px solid #111!important;border-left:0!important;border-right:0!important;text-align:center!important;font-size:16px!important;font-weight:600!important;background:#fff!important;color:#111!important;outline:0!important;margin:0!important;border-radius:0!important;}

/* ===== ADD TO CART ===== */
.waseeh-add, #addToCartBtn{width:100%!important;background:#111!important;color:#fff!important;padding:18px!important;border:1.5px solid #111!important;cursor:pointer!important;text-transform:uppercase!important;letter-spacing:2px!important;font-size:14px!important;margin-top:20px!important;display:block!important;text-align:center!important;}

/* ===== DARK MODE ===== */
body.dark-mode{background:#111!important;color:#fff!important}
body.dark-mode header{background:#000!important;border-bottom:1px solid #222!important}
body.dark-mode .header-inner{background:#000!important}
body.dark-mode .hamburger span{background:#fff!important}
body.dark-mode .logo{color:#fff!important}
body.dark-mode #logoBtn{color:#fff!important}
body.dark-mode #searchBtn{color:#fff!important}
body.dark-mode #cartBtn{color:#fff!important}
body.dark-mode .cart-icon{color:#fff!important}
body.dark-mode .close-btn{color:#fff!important}
body.dark-mode .drawer, body.dark-mode .filter-drawer, body.dark-mode .sort-modal, body.dark-mode .search-drawer{background:#1a1a1a!important;color:#fff!important}
body.dark-mode .drawer ul li{border-color:#333!important}
body.dark-mode .drawer ul li a{color:#fff!important}
body.dark-mode .products .card{background:#1e1e1e!important;border-color:#333!important}
body.dark-mode .card-info h3, body.dark-mode .card-info b, body.dark-mode .collection-head h1, body.dark-mode .waseeh-title, body.dark-mode .waseeh-details h3, body.dark-mode .waseeh-details li, body.dark-mode .breadcrumb, body.dark-mode #pTitle, body.dark-mode #pPrice, body.dark-mode #pDetailsList li, body.dark-mode #pDimensions li, body.dark-mode #pMaterial li, body.dark-mode #selectedVariantName, body.dark-mode #selectedColorName, body.dark-mode .qty{color:#fff!important}
body.dark-mode .waseeh-price s{color:#aaa!important}
body.dark-mode #colorBtns > div > div:first-child{border:2px solid #fff!important}
body.dark-mode #colorBtns > div.active > div:first-child{border:2px solid #fff!important;box-shadow:0 0 0 2px #111, 0 0 0 4px #fff!important}
body.dark-mode #variantBtns button, body.dark-mode .variant-btn{background:#222!important;color:#fff!important;border-color:#555!important}
body.dark-mode #variantBtns button.active{background:#fff!important;color:#111!important;border-color:#fff!important}
body.dark-mode .main-img{background:#111!important}
body.dark-mode .main-img img{background:#111!important}
body.dark-mode .waseeh-gallery{background:#111!important}
body.dark-mode #searchInput{color:#fff!important}
body.dark-mode #searchInput::placeholder{color:#aaa!important}
body.dark-mode .gallery-dots span{background:#555!important}
body.dark-mode .gallery-dots span.active{background:#fff!important}
body.dark-mode #filterBtn, body.dark-mode #sortBtn{background:#222!important;color:#fff!important;border-color:#444!important}
#filterBtn, #sortBtn{background:#fff!important;color:#111!important;border:1px solid #d1c7b8!important}
.sort-dot{width:22px;height:22px;border:1.5px solid #111;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;background:#fff}
.sort-dot.active::after{content:'';width:12px;height:12px;background:#111;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
body.dark-mode .sort-dot{border-color:#fff!important;background:#1a1a1a!important}
body.dark-mode .sort-dot.active::after{background:#fff!important}
body.dark-mode .sort-modal .sort-item{border-color:#333!important}
body.dark-mode .qty button, body.dark-mode .qty input#qty{background:#fff!important;color:#111!important;border-color:#fff!important}
body.dark-mode .waseeh-add, body.dark-mode #addToCartBtn{background:#fff!important;color:#111!important;border-color:#fff!important}