/* ==================================================================
   FYRZASKA — CONSOLIDATED CUSTOM CSS  (cleaned & de-duplicated)

   What changed vs. the old file:
   • The four identical --v-* variable blocks (body.index, body:not(.index),
     body.store-products, body.product-single) are hoisted to :root once.
     This also makes the brand colors available to the header/navbar.
   • Homepage color literals (rgb(...)) replaced with the matching tokens.
   • Hover-icon size enforcement merged into the icon rule (was a 2nd block).
   • Removed the stray glyph margin (margin:0 16px 16px 0) that was pushing
     the eye/heart off-centre inside their circles.
   • Big latest-products cards keep the vertical (image-on-top) layout.
   • Mobile big-card grid fix included.

   Sections:
     1. Tokens
     2. Homepage (body.index)
     3. Global product card (body:not(.index))
     4. Listing page (body.store-products)
     5. Product detail (body.product-single)
     6. Header / navbar
   ================================================================== */


/* ============================ 1. TOKENS ========================== */
:root{
  --v-teal:#45C2B1; --v-teal-deep:#12BC9F; --v-teal-pale:#E3F6F3; --v-slate:#253D4E;
  --v-gray:#7E7E7E; --v-amber:#E5992B; --v-orange:#F59758; --v-border:#ECECEC;
}


/* ========================= 2. HOMEPAGE ========================== */

/* ----- Hero slider ----- */
.s-block--hero-slider{ padding:30px 80px 0 80px !important; box-sizing:border-box !important; }
.s-block--hero-slider .s-slider-container{ padding:0 !important; }
.s-block--hero-slider .swiper{ overflow:hidden !important; border-radius:30px !important; }
.s-block--hero-slider .swiper-slide{ background:transparent !important; border-radius:0 !important; overflow:hidden !important; }
.s-block--hero-slider .overlay-bg{ border-radius:0 !important; background-size:cover !important; background-position:center !important; }
.s-block--hero-slider .overlay-bg::after{ background:transparent !important; display:none !important; }

/* ----- Offers slider: 4 cards per row ----- */
.custom-zina-slider-product .swiper-slide,
.s-block--best-offers .swiper-slide{
  width:calc(25% - 16px) !important; max-width:calc(25% - 16px) !important; min-width:calc(25% - 16px) !important;
  flex:0 0 calc(25% - 16px) !important; margin:0 8px !important;
}
.custom-zina-slider-product,
.s-block--best-offers{ padding:18px 0 18px 0 !important; }

/* ----- Section titles (offers) ----- */
.custom-zina-slider-product .s-slider-block__title-right h2,
.s-block--best-offers .s-slider-block__title-right h2{
  font-size:32px !important; font-weight:700 !important; color:var(--v-slate) !important;
}

/* ----- Offers product cards ----- */
.custom-zina-slider-product .s-product-card-entry,
.s-block--best-offers .s-product-card-entry{
  background:#fff !important; border:1px solid var(--v-border) !important; border-radius:15px !important;
  overflow:hidden !important; margin:3px !important;
}
.custom-zina-slider-product .s-product-card-image,
.s-block--best-offers .s-product-card-image{ border-radius:15px 15px 0 0 !important; overflow:hidden !important; }
.custom-zina-slider-product .s-product-card-content-title,
.s-block--best-offers .s-product-card-content-title,
.custom-zina-slider-product .s-product-card-content-title a,
.s-block--best-offers .s-product-card-content-title a{ font-weight:700 !important; color:var(--v-slate) !important; }
.custom-zina-slider-product .s-product-card-content-subtitle,
.s-block--best-offers .s-product-card-content-subtitle{ color:var(--v-gray) !important; }
.custom-zina-slider-product .s-product-card-sale-price h4,
.s-block--best-offers .s-product-card-sale-price h4{ color:var(--v-teal) !important; font-weight:700 !important; }
.custom-zina-slider-product .s-product-card-sale-price > span:not(.rounded-full),
.s-block--best-offers .s-product-card-sale-price > span:not(.rounded-full){ color:#969696 !important; text-decoration:line-through !important; }
.custom-zina-slider-product .s-product-card-sale-price .rounded-full,
.s-block--best-offers .s-product-card-sale-price .rounded-full{ background:var(--v-orange) !important; color:#fff !important; font-weight:700 !important; }
.custom-zina-slider-product .s-product-card-content-footer .s-button-element,
.s-block--best-offers .s-product-card-content-footer .s-button-element{
  background:var(--v-teal-pale) !important; color:var(--v-teal) !important; border:none !important; border-radius:8px !important;
  font-weight:700 !important; width:100% !important; padding:12px !important; justify-content:center !important;
}
.custom-zina-slider-product .s-product-card-content-footer .s-button-text,
.s-block--best-offers .s-product-card-content-footer .s-button-text{
  justify-content:center !important; width:100% !important; display:flex !important; align-items:center !important;
  gap:6px !important; border-bottom:none !important; text-decoration:none !important;
}

/* ----- Banner ----- */
.zina-banner .relative.rounded-\[10px\]{ max-height:none !important; height:auto !important; }
.zina-banner img.md\:block{ max-height:none !important; height:auto !important; width:100% !important; object-fit:cover !important; display:block !important; }
.zina-banner img.md\:hidden{ display:none !important; }
.zina-banner{ padding-top:40px !important; }

/* ----- Latest-products (أحدث المنتجات): 2 per row, VERTICAL cards ----- */
.s-block--tabs-produtcs .s-products-list-wrapper{
  display:grid !important; grid-template-columns:repeat(2,1fr) !important; gap:24px !important;
}
.s-block--tabs-produtcs{ padding:18px 0 5px 0 !important; }
/* card shell + force vertical (image on top, content below) */
.s-block--tabs-produtcs .s-product-card-entry{
  border:1px solid var(--v-border) !important; border-radius:15px !important; overflow:hidden !important;
  display:flex !important; flex-direction:column !important;
}
/* image = full-width top block, fixed 240px, centered, contain */
.s-block--tabs-produtcs .s-product-card-image{
  width:100% !important; flex:0 0 auto !important;
  aspect-ratio:auto !important; height:240px !important; background:#fff !important; overflow:hidden !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
.s-block--tabs-produtcs .s-product-card-image img{
  width:auto !important; height:100% !important; max-width:90% !important; object-fit:contain !important; padding:20px !important;
}
.s-block--tabs-produtcs .s-product-card-content{ width:100% !important; flex:1 1 auto !important; padding:16px !important; }
.s-block--tabs-produtcs .s-product-card-content-main{ margin-bottom:10px !important; }
.s-block--tabs-produtcs .s-product-card-content-title,
.s-block--tabs-produtcs .s-product-card-content-title a{ font-weight:700 !important; color:var(--v-slate) !important; }
.s-block--tabs-produtcs .s-product-card-content-subtitle{ color:var(--v-gray) !important; }
.s-block--tabs-produtcs .s-product-card-sale-price h4{ color:var(--v-teal) !important; font-weight:700 !important; }
.s-block--tabs-produtcs .s-product-card-sale-price > span:not(.rounded-full){ color:#969696 !important; text-decoration:line-through !important; }
.s-block--tabs-produtcs .s-product-card-sale-price .rounded-full{ background:var(--v-orange) !important; color:#fff !important; font-weight:700 !important; }
.s-block--tabs-produtcs .s-product-card-content-footer .s-button-element{
  background:var(--v-teal-pale) !important; color:var(--v-teal) !important; border:none !important; border-radius:8px !important;
  font-weight:700 !important; width:100% !important; padding:12px !important; justify-content:center !important;
}
.s-block--tabs-produtcs .s-product-card-content-footer .s-button-text{
  justify-content:center !important; width:100% !important; display:flex !important; align-items:center !important;
  gap:6px !important; border-bottom:none !important; text-decoration:none !important;
}
.s-block--tabs-produtcs .tabs{ display:none !important; }   /* hide tab trigger */

/* ----- Homepage card INTERACTIVE LAYER (all homepage blocks) ----- */
/* shell hover-lift + clip so image zoom stays inside */
body.index .s-product-card-entry{ position:relative !important; transition:box-shadow .2s ease !important; }
body.index .s-product-card-entry:hover{ box-shadow:0 8px 22px rgba(37,61,78,.10) !important; }
body.index .s-product-card-image{ position:relative !important; overflow:hidden !important; }
/* image zoom on hover */
body.index .s-product-card-image img{ transition:transform 1.2s cubic-bezier(0,0,.05,1) !important; }
body.index .s-product-card-entry:hover .s-product-card-image img{ transform:scale(1.06) !important; }

/* teal ribbon badge (flush top-left) */
body.index .s-product-card-image .s-product-card-promotion-title{
  position:absolute !important; top:12px !important; left:0 !important; right:auto !important;
  z-index:3 !important; margin:0 !important; width:auto !important; max-width:75% !important;
  background:var(--v-teal) !important; color:#fff !important;
  font-size:11px !important; font-weight:700 !important; line-height:1.35 !important; padding:5px 11px !important;
  border-radius:0 6px 6px 0 !important; white-space:normal !important; box-shadow:0 2px 6px rgba(0,0,0,.12) !important;
}
/* bigger badge on the large latest-products cards only */
body.index .s-block--tabs-produtcs .s-product-card-image .s-product-card-promotion-title{
  font-size:14px !important; line-height:1.4 !important; padding:7px 15px !important;
}

/* hover icons: white circles, teal glyphs, centred pair (hover-only) */
body.index .s-product-card-quick-view-btn,
body.index salla-button.s-product-card-wishlist-btn{
  position:absolute !important; top:50% !important;
  width:40px !important; height:40px !important; min-width:40px !important; max-width:40px !important; box-sizing:border-box !important;
  border-radius:50% !important; background:#fff !important; border:none !important; box-shadow:0 4px 12px rgba(0,0,0,.15) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  opacity:0 !important; transform:translateY(-50%) scale(.85) !important;
  transition:opacity .25s ease, transform .25s ease !important; z-index:4 !important; cursor:pointer !important;
}
body.index .s-product-card-quick-view-btn{ left:50% !important; right:auto !important; margin-left:5px !important; }
body.index salla-button.s-product-card-wishlist-btn{ right:50% !important; left:auto !important; margin-right:5px !important; }
body.index .s-product-card-wishlist-btn.s-button-element{
  background:transparent !important; border:none !important; box-shadow:none !important;
  width:100% !important; height:100% !important; padding:0 !important; min-height:0 !important; border-radius:50% !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
/* glyphs — no stray margin, so they sit dead-centre in the circle */
body.index .s-product-card-quick-view-btn .sicon-eye,
body.index .s-product-card-wishlist-btn .sicon-heart{ color:var(--v-teal) !important; font-size:17px !important; }
body.index .s-product-card-entry:hover .s-product-card-quick-view-btn,
body.index .s-product-card-entry:hover salla-button.s-product-card-wishlist-btn{
  opacity:1 !important; transform:translateY(-50%) scale(1) !important;
}
/* wishlist heart safety (shares .s-button-element with cart button) */
body.index .s-product-card-wishlist-btn.s-button-element,
body.index .s-product-card-wishlist-btn.s-button-element:hover{ background:transparent !important; }
body.index .s-product-card-wishlist-btn .sicon-heart,
body.index .s-product-card-wishlist-btn:hover .sicon-heart{ color:var(--v-teal) !important; }
body.index .s-product-card-wishlist-btn.s-button-favorited .sicon-heart,
body.index .s-product-card-wishlist-btn.s-button-favorited:hover .sicon-heart{ color:#DE350B !important; }

/* add-to-cart hover: fill teal, white text (all homepage blocks) */
body.index .custom-zina-slider-product .s-product-card-content-footer .s-button-element,
body.index .s-block--best-offers .s-product-card-content-footer .s-button-element,
body.index .s-block--tabs-produtcs .s-product-card-content-footer .s-button-element{
  transition:background .3s ease, color .3s ease !important;
}
body.index .custom-zina-slider-product .s-product-card-content-footer .s-button-element:hover,
body.index .s-block--best-offers .s-product-card-content-footer .s-button-element:hover,
body.index .s-block--tabs-produtcs .s-product-card-content-footer .s-button-element:hover{ background:var(--v-teal) !important; }
body.index .custom-zina-slider-product .s-product-card-content-footer .s-button-element:hover *,
body.index .s-block--best-offers .s-product-card-content-footer .s-button-element:hover *,
body.index .s-block--tabs-produtcs .s-product-card-content-footer .s-button-element:hover *{ color:#fff !important; }

/* ----- Native salla-products-slider on the homepage (was unthemed) ----- */
body.index salla-products-slider .s-product-card-entry{
  border:.8px solid var(--v-border) !important; border-radius:15px !important; overflow:hidden !important; background:#fff !important;
}
body.index salla-products-slider .s-product-card-content-title,
body.index salla-products-slider .s-product-card-content-title a{ color:var(--v-slate) !important; font-weight:700 !important; }
body.index salla-products-slider .s-product-card-content-subtitle{ color:var(--v-gray) !important; }
body.index salla-products-slider .s-product-card-price,
body.index salla-products-slider .s-product-card-price *,
body.index salla-products-slider .s-product-card-sale-price h4{ color:var(--v-teal) !important; font-weight:700 !important; }
body.index salla-products-slider .s-product-card-sale-price > span:not(.rounded-full){ color:#9B9B9B !important; text-decoration:line-through !important; }
body.index salla-products-slider .s-product-card-sale-price .rounded-full{ background:var(--v-orange) !important; color:#fff !important; font-weight:700 !important; }
body.index salla-products-slider .s-product-card-content-footer .s-button-element{
  background:var(--v-teal-pale) !important; color:var(--v-teal) !important; border:none !important; border-radius:8px !important;
  font-weight:700 !important; width:100% !important; padding:12px !important;
  display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important;
  transition:background .3s ease, color .3s ease !important;
}
body.index salla-products-slider .s-product-card-content-footer .s-button-element *{ color:var(--v-teal) !important; }
body.index salla-products-slider .s-product-card-content-footer .s-button-element:hover{ background:var(--v-teal) !important; }
body.index salla-products-slider .s-product-card-content-footer .s-button-element:hover *{ color:#fff !important; }

/* ----- Homepage MOBILE ----- */
@media (max-width:768px){
  .s-block--hero-slider{ padding:16px 12px 0 12px !important; }
  .s-block--hero-slider .swiper{ border-radius:16px !important; }
  .custom-zina-slider-product .swiper-slide,
  .s-block--best-offers .swiper-slide{
    width:calc(50% - 16px) !important; max-width:calc(50% - 16px) !important; min-width:calc(50% - 16px) !important;
    flex:0 0 calc(50% - 16px) !important;
  }
}
@media (max-width:640px){
  /* big latest-products cards: responsive square image, full-width button, no hover icons */
  body.index .s-block--tabs-produtcs .s-products-list-wrapper{ grid-template-columns:repeat(2,1fr) !important; gap:12px !important; }
  body.index .s-block--tabs-produtcs .s-product-card-image{ height:auto !important; aspect-ratio:1/1 !important; padding:0 !important; }
  body.index .s-block--tabs-produtcs .s-product-card-image img{ width:100% !important; height:100% !important; max-width:100% !important; object-fit:contain !important; padding:12px !important; }
  body.index .s-block--tabs-produtcs .s-product-card-content{ padding:10px !important; }
  body.index .s-block--tabs-produtcs .s-product-card-content-footer .s-button-element{ width:100% !important; padding:10px !important; font-size:12px !important; }
  body.index .s-block--tabs-produtcs .s-product-card-image .s-product-card-promotion-title{ font-size:10px !important; padding:4px 9px !important; max-width:80% !important; }
  body.index .s-product-card-quick-view-btn,
  body.index salla-button.s-product-card-wishlist-btn{ display:none !important; }
}


/* ==================== 3. GLOBAL PRODUCT CARD ==================== */
/* Applies everywhere EXCEPT the homepage. Verzasca-match component. */

/* card shell */
body:not(.index) .s-product-card-entry{
  position:relative !important; background:#fff !important;
  border:0.8px solid var(--v-border) !important; border-radius:15px !important; overflow:hidden !important;
  transition:box-shadow .2s ease !important; box-shadow:none !important;
}
body:not(.index) .s-product-card-entry:hover{ box-shadow:0 8px 22px rgba(37,61,78,.10) !important; }

/* image: 1:1 square, contain, soft zoom */
body:not(.index) .s-product-card-image{
  position:relative !important; width:100% !important; aspect-ratio:1/1 !important; height:auto !important;
  background:#fff !important; overflow:hidden !important; display:block !important; border-radius:15px 15px 0 0 !important;
}
body:not(.index) .s-product-card-image > a{ position:absolute !important; inset:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; }
body:not(.index) .s-product-card-image img{
  width:100% !important; height:100% !important; object-fit:contain !important; padding:10px !important;
  transition:transform 1.2s cubic-bezier(0,0,.05,1) !important;
}
body:not(.index) .s-product-card-entry:hover .s-product-card-image img{ transform:scale(1.06) !important; }

/* badge */
body:not(.index) .s-product-card-image .s-product-card-promotion-title{
  position:absolute !important; top:12px !important; left:0 !important; right:auto !important;
  z-index:3 !important; margin:0 !important; width:auto !important; max-width:75% !important;
  background:var(--v-teal) !important; color:#fff !important;
  font-size:11px !important; font-weight:700 !important; line-height:1.35 !important; padding:5px 11px !important;
  border-radius:0 6px 6px 0 !important; white-space:normal !important; box-shadow:0 2px 6px rgba(0,0,0,.12) !important;
}

/* hover icons */
body:not(.index) .s-product-card-quick-view-btn,
body:not(.index) salla-button.s-product-card-wishlist-btn{
  position:absolute !important; top:50% !important; width:40px !important; height:40px !important; border-radius:50% !important;
  background:#fff !important; border:none !important; box-shadow:0 4px 12px rgba(0,0,0,.15) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  opacity:0 !important; transform:translateY(-50%) scale(.85) !important;
  transition:opacity .25s ease, transform .25s ease !important; z-index:4 !important; cursor:pointer !important;
}
body:not(.index) .s-product-card-quick-view-btn{ left:calc(50% + 5px) !important; right:auto !important; }
body:not(.index) salla-button.s-product-card-wishlist-btn{ left:calc(50% - 45px) !important; right:auto !important; }
body:not(.index) .s-product-card-wishlist-btn.s-button-element{
  background:transparent !important; border:none !important; box-shadow:none !important;
  width:100% !important; height:100% !important; padding:0 !important; min-height:0 !important; border-radius:50% !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
body:not(.index) .s-product-card-quick-view-btn .sicon-eye,
body:not(.index) .s-product-card-wishlist-btn .sicon-heart{ color:var(--v-teal) !important; font-size:17px !important; }
body:not(.index) .s-product-card-entry:hover .s-product-card-quick-view-btn,
body:not(.index) .s-product-card-entry:hover salla-button.s-product-card-wishlist-btn{ opacity:1 !important; transform:translateY(-50%) scale(1) !important; }
body:not(.index) .s-product-card-wishlist-btn.s-button-element,
body:not(.index) .s-product-card-wishlist-btn.s-button-element:hover{ background:transparent !important; }
body:not(.index) .s-product-card-wishlist-btn .sicon-heart,
body:not(.index) .s-product-card-wishlist-btn:hover .sicon-heart{ color:var(--v-teal) !important; }
body:not(.index) .s-product-card-wishlist-btn.s-button-favorited .sicon-heart,
body:not(.index) .s-product-card-wishlist-btn.s-button-favorited:hover .sicon-heart{ color:#DE350B !important; }

/* content */
body:not(.index) .s-product-card-content{ padding:0 16px 16px 15px !important; text-align:start !important; }
body:not(.index) .s-product-card-content-main{ display:flex !important; flex-direction:column !important; margin:0 !important; }
body:not(.index) .s-product-card-content-subtitle{
  order:-1 !important; color:var(--v-gray) !important; opacity:1 !important;
  font-size:14px !important; font-weight:400 !important; line-height:24px !important; margin:0 0 5px !important;
}
body:not(.index) .s-product-card-content-title{ margin:6px 0 5px !important; }
body:not(.index) .s-product-card-content-title,
body:not(.index) .s-product-card-content-title a{
  color:var(--v-slate) !important; font-weight:700 !important; font-size:12px !important; line-height:14.4px !important;
  display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important;
}
body:not(.index) .s-product-card-rating{ font-size:14px !important; line-height:24px !important; margin:0 !important; }
body:not(.index) .s-product-card-rating .sicon-star,
body:not(.index) salla-rating-stars [class*="star"]{ color:var(--v-amber) !important; }

/* price */
body:not(.index) .s-product-card-content-sub{ display:block !important; padding:0 !important; margin:0 !important; }
body:not(.index) .s-product-card-sale-price{
  display:flex !important; align-items:center !important; justify-content:flex-start !important;
  gap:6px !important; padding:5px 0 0 !important; margin:0 !important; line-height:24px !important;
}
body:not(.index) .s-product-card-sale-price h4,
body:not(.index) .s-product-card-sale-price h4 *,
body:not(.index) .s-product-card-content-sub h4{
  color:var(--v-teal) !important; font-weight:700 !important; font-size:12px !important; line-height:14px !important; margin:0 !important;
}
body:not(.index) .s-product-card-sale-price > span:not(.rounded-full){ color:#9B9B9B !important; text-decoration:line-through !important; font-size:11px !important; }
body:not(.index) .s-product-card-sale-price .rounded-full{
  background:var(--v-orange) !important; color:#fff !important; font-weight:700 !important; font-size:10px !important;
  padding:1px 6px !important; text-decoration:none !important;
}

/* add-to-cart */
body:not(.index) .s-product-card-content-footer{ display:block !important; width:100% !important; padding:0 !important; margin:8px 0 0 !important; }
body:not(.index) .s-product-card-content-footer .s-button-element{
  background:var(--v-teal-pale) !important; color:var(--v-teal) !important;
  border:none !important; border-radius:4px !important; font-weight:700 !important; font-size:11px !important; line-height:24px !important;
  width:100% !important; padding:2px 4px !important; flex-direction:row !important;
  display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important;
  transition:background .3s ease, color .3s ease !important;
}
body:not(.index) .s-product-card-content-footer .s-button-element *,
body:not(.index) .s-product-card-content-footer .s-button-text{ color:var(--v-teal) !important; }
body:not(.index) .s-product-card-content-footer .s-button-element:hover{ background:var(--v-teal) !important; }
body:not(.index) .s-product-card-content-footer .s-button-element:hover *{ color:#fff !important; }
body:not(.index) .s-product-card-content-footer .s-button-text{
  display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important;
  width:100% !important; border-bottom:none !important; text-decoration:none !important;
}
body:not(.index) .s-product-card-content-footer .s-button-element[disabled],
body:not(.index) .s-product-card-content-footer .s-button-disabled{ background:#EFEFEF !important; }
body:not(.index) .s-product-card-content-footer .s-button-element[disabled] *{ color:#9B9B9B !important; }


/* ===================== 4. LISTING PAGE ========================= */
body.store-products .s-products-list-wrapper.s-products-list-vertical-cards{
  display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:16px !important;
}
@media(max-width:1024px){ body.store-products .s-products-list-wrapper.s-products-list-vertical-cards{ grid-template-columns:repeat(3,1fr) !important; } }
@media(max-width:640px){ body.store-products .s-products-list-wrapper.s-products-list-vertical-cards{ grid-template-columns:repeat(2,1fr) !important; gap:10px !important; } }

body.store-products .s-infinite-scroll,
body.store-products .s-infinite-scroll-wrapper{ display:flex !important; justify-content:center !important; align-items:center !important; width:100% !important; margin:26px 0 10px !important; }
body.store-products .s-infinite-scroll-btn.s-button-primary,
body.store-products .s-infinite-scroll-btn{
  width:auto !important; max-width:280px !important; min-width:0 !important; flex:0 0 auto !important;
  background:var(--v-teal) !important; color:#fff !important; border:1.5px solid var(--v-teal) !important;
  border-radius:10px !important; box-shadow:none !important;
  font-family:'Almarai',sans-serif !important; font-size:13px !important; font-weight:700 !important;
  padding:10px 40px !important; height:auto !important; line-height:1.4 !important; cursor:pointer !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important;
  transition:background .25s ease, box-shadow .25s ease, transform .1s ease !important;
}
body.store-products .s-infinite-scroll-btn:hover{ background:var(--v-teal-deep) !important; border-color:var(--v-teal-deep) !important; box-shadow:0 6px 18px rgba(69,194,177,.35) !important; }
body.store-products .s-infinite-scroll-btn:active{ transform:translateY(1px) !important; }
body.store-products .s-infinite-scroll-btn-text,
body.store-products .s-infinite-scroll-btn-text *{ color:#fff !important; font-weight:700 !important; }
body.store-products .s-infinite-scroll-btn .s-button-loader,
body.store-products .s-infinite-scroll-btn-loader{ color:#fff !important; }
body.store-products .breadcrumbs{ color:var(--v-slate) !important; }
body.store-products .breadcrumbs a:hover{ color:var(--v-teal) !important; }


/* ==================== 5. PRODUCT DETAIL ======================== */

/* layout */
body.product-single .flex.flex-col.items-start.md\:flex-row{ gap:32px !important; align-items:flex-start !important; justify-content:center !important; }
body.product-single .zina-main-content.main-content{ display:flex !important; flex-direction:column !important; gap:10px !important; width:100% !important; max-width:440px !important; }
body.product-single .zina-main-content > div.flex.justify-between{ justify-content:flex-start !important; gap:16px !important; flex-wrap:wrap !important; }

/* Main gallery image ONLY — smooth zoom, thumbnails excluded */
body.product-single salla-slider.details-slider .swiper-slide-active,
body.product-single salla-slider.image-slider .swiper-slide-active{ overflow:hidden !important; }

body.product-single salla-slider.details-slider .swiper-slide-active img,
body.product-single salla-slider.image-slider .swiper-slide-active img{
  transition:transform .6s cubic-bezier(.2,0,.2,1) !important; will-change:transform !important;
}
body.product-single salla-slider.details-slider .swiper-slide-active:hover img,
body.product-single salla-slider.image-slider .swiper-slide-active:hover img{
  transform:scale(1.35) !important;
}

/* Make sure thumbnails NEVER zoom */
body.product-single .s-slider-thumbs img,
body.product-single .s-slider-thumbs .swiper-slide:hover img{
  transform:none !important;
}

/* thumbnails */
body.product-single .s-slider-thumbs .swiper-slide,
body.product-single .s-slider-thumbs .swiper-slide *,
body.product-single .s-slider-thumbs button,
body.product-single .s-slider-thumbs a{ outline:none !important; -webkit-tap-highlight-color:transparent !important; }
body.product-single .s-slider-thumbs .swiper-slide-thumb-active{ box-shadow:0 0 0 2px var(--v-teal) inset !important; border-radius:8px !important; }
body.product-single .s-slider-thumbs .swiper-slide-thumb-active img{ border-radius:8px !important; }
body.product-single .s-slider-thumbs .swiper-slide-thumb-active::after,
body.product-single .s-slider-thumbs .swiper-slide-thumb-active::before{ box-shadow:none !important; border-color:transparent !important; content:none !important; }

/* title */
body.product-single h1.title-detail,
body.product-single h1[class*="text-["]{ font-size:28px !important; font-weight:700 !important; line-height:1.3 !important; color:var(--v-slate) !important; margin:0 0 10px !important; }

/* price */
body.product-single .total-price,
body.product-single h2.total-price,
body.product-single .text-\[red\],
body.product-single [class*="total-price"]:not(.before-price){ color:var(--v-teal) !important; font-weight:800 !important; font-size:26px !important; }
body.product-single .total-price *{ color:var(--v-teal) !important; }
body.product-single .before-price{ color:#9B9B9B !important; text-decoration:line-through !important; font-weight:400 !important; font-size:16px !important; }

/* hide the duplicate "السعر" price row (top price under the title stays) */
body.product-single .center-between.w-full:has(> .form-label){ display:none !important; }

/* purchase count (teal inline, no box) */
body.product-single div.bg-white.py-2\.5.rounded-md.inline-flex{
  display:inline-flex !important; background:transparent !important; box-shadow:none !important;
  color:var(--v-teal) !important; font-weight:700 !important; font-size:14px !important; padding:0 !important; align-items:center !important; gap:6px !important;
}
body.product-single div.bg-white.py-2\.5.rounded-md.inline-flex *{ color:var(--v-teal) !important; }
body.product-single .v-subrow{ display:flex !important; align-items:center !important; gap:12px !important; flex-wrap:wrap !important; }
body.product-single .v-subrow > *{ margin:0 !important; }
body.product-single .v-subrow [class*="bg-white"]{ background:transparent !important; box-shadow:none !important; padding:0 !important; color:var(--v-teal) !important; font-weight:700 !important; font-size:14px !important; }
body.product-single .v-subrow [class*="bg-white"] *{ color:var(--v-teal) !important; }

/* share row */
body.product-single .v-share-row{ display:flex !important; align-items:center !important; gap:14px !important; margin-top:6px !important; }
body.product-single .v-share-row a,
body.product-single .v-share-row i{ color:var(--v-teal) !important; }

/* hide Salla-only blocks (loyalty / gifting / tamara) */
body.product-single salla-loyalty-banner,
body.product-single salla-loyalty-points-banner,
body.product-single salla-cashback-banner,
body.product-single salla-gifting,
body.product-single .s-loyalty-points-banner,
body.product-single [class*="loyalty"],
body.product-single [class*="gifting"],
body.product-single [class*="tamara"]{ display:none !important; }

/* Tabby / installment box — hidden when empty, styled when it has content */
body.product-single salla-installment,
body.product-single [class*="tabby"]{
  border:1px solid var(--v-border) !important; border-radius:12px !important; background:#fff !important; padding:14px 16px !important;
}
body.product-single salla-installment{ display:none !important; }
body.product-single salla-installment:has(*){ display:block !important; }
body.product-single salla-installment *{ display:revert !important; }

/* quantity stepper */
body.product-single salla-quantity-input *{ border:none !important; box-shadow:none !important; outline:none !important; background:transparent !important; }
body.product-single salla-quantity-input,
body.product-single salla-quantity-input.s-quantity-input{
  display:flex !important; align-items:center !important; justify-content:center !important;
  border:1.5px solid var(--v-teal) !important; border-radius:8px !important; overflow:hidden !important; background:#fff !important;
}
body.product-single .s-quantity-input-increase-button,
body.product-single .s-quantity-input-decrease-button{ color:var(--v-teal) !important; font-size:18px !important; width:44px !important; }
body.product-single .s-quantity-input-increase-button:hover,
body.product-single .s-quantity-input-decrease-button:hover{ background:var(--v-teal-pale) !important; }
body.product-single .s-quantity-input-input,
body.product-single salla-quantity-input input{ color:var(--v-slate) !important; font-weight:700 !important; font-size:15px !important; text-align:center !important; }

/* button bar (grid) */
body.product-single section.sticky-product-bar{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:12px !important; width:100% !important; align-items:stretch !important; }
body.product-single .sticky-product-bar__quantity{ grid-column:2 !important; grid-row:1 !important; display:flex !important; align-items:center !important; justify-content:center !important; margin:0 !important; padding:0 !important; min-height:0 !important; width:auto !important; max-width:none !important; }
body.product-single .sticky-product-bar__quantity salla-quantity-input{ width:100% !important; height:52px !important; }
body.product-single salla-add-product-button.sticky-product-bar__btn{ grid-column:1 !important; grid-row:1 !important; display:block !important; width:auto !important; max-width:none !important; margin:0 !important; }
body.product-single section.sticky-product-bar > salla-mini-checkout-widget,
body.product-single .v-buynow-row{ grid-column:1 / span 2 !important; grid-row:2 !important; width:100% !important; max-width:100% !important; margin:0 !important; }

/* main add-to-cart (solid teal) */
body.product-single section.sticky-product-bar salla-add-product-button button.s-button-element,
body.product-single section.sticky-product-bar salla-add-product-button button.s-button-primary,
body.product-single .s-add-product-button-main button{
  background-color:var(--v-teal) !important; background-image:none !important;
  --s-button-primary-bg:var(--v-teal) !important; --s-button-primary-color:#fff !important; --s-button-primary-border-color:var(--v-teal) !important;
  border:1.5px solid var(--v-teal) !important; color:#fff !important;
  border-radius:8px !important; font-size:15px !important; font-weight:700 !important; width:100% !important; min-height:52px !important;
  box-shadow:0 4px 14px rgba(69,194,177,.30) !important; transition:background .25s ease, box-shadow .25s ease !important;
}
body.product-single .s-add-product-button-main{ width:100% !important; }
body.product-single section.sticky-product-bar salla-add-product-button .s-button-text,
body.product-single section.sticky-product-bar salla-add-product-button .s-button-text *{ color:#fff !important; visibility:visible !important; opacity:1 !important; }
body.product-single section.sticky-product-bar salla-add-product-button button.s-button-element:hover,
body.product-single section.sticky-product-bar salla-add-product-button button.s-button-primary:hover{
  background-color:var(--v-teal-deep) !important; border-color:var(--v-teal-deep) !important; --s-button-primary-bg:var(--v-teal-deep) !important;
}

/* buy-now (teal outline, full width) */
body.product-single section.sticky-product-bar salla-mini-checkout-widget button,
body.product-single .v-buynow-row button,
body.product-single .v-buy-now{
  background:transparent !important; background-color:transparent !important; background-image:none !important;
  color:var(--v-teal) !important; border:1.5px solid var(--v-teal) !important; border-radius:8px !important; font-weight:700 !important; width:100% !important; box-shadow:none !important;
}
body.product-single section.sticky-product-bar salla-mini-checkout-widget button *,
body.product-single .v-buynow-row button *{ color:var(--v-teal) !important; }
body.product-single section.sticky-product-bar salla-mini-checkout-widget button:hover,
body.product-single .v-buynow-row button:hover{ background:var(--v-teal) !important; }
body.product-single section.sticky-product-bar salla-mini-checkout-widget button:hover *,
body.product-single .v-buynow-row button:hover *{ color:#fff !important; }

/* tabs */
body.product-single salla-tabs{ display:block !important; margin-top:32px !important; }
body.product-single .s-tabs-header{ display:flex !important; gap:12px !important; border-bottom:none !important; padding-bottom:6px !important; }
body.product-single .s-tabs-header-item{
  border-radius:999px !important; padding:10px 28px !important; background:#fff !important;
  border:1px solid var(--v-border) !important; color:var(--v-gray) !important; font-weight:700 !important; font-size:14px !important;
  transition:color .2s ease, box-shadow .2s ease !important;
}
body.product-single .s-tabs-header-item.s-tabs-active{ color:var(--v-teal) !important; background:#fff !important; border-color:transparent !important; box-shadow:0 6px 16px rgba(0,0,0,.10) !important; }
body.product-single .s-tabs-header-item:hover{ color:var(--v-slate) !important; }

/* description */
body.product-single salla-tab-content,
body.product-single .s-tabs-content{ color:var(--v-gray) !important; font-size:15px !important; line-height:26px !important; padding-top:18px !important; }
body.product-single .s-tabs-content h2,
body.product-single .s-tabs-content h3,
body.product-single .s-text-editor-content h2,
body.product-single .s-text-editor-content h3,
body.product-single .s-text-editor-content strong{ color:var(--v-teal) !important; font-weight:700 !important; }
body.product-single .s-tabs-content a,
body.product-single .s-text-editor-content a,
body.product-single [class*="read-more"],
body.product-single [class*="show-more"]{ color:var(--v-teal) !important; text-decoration:none !important; font-weight:700 !important; }
body.product-single .s-tabs-content a:hover,
body.product-single [class*="read-more"]:hover{ text-decoration:underline !important; }

/* reviews */
body.product-single salla-comments [class*="star"],
body.product-single salla-reviews-summary [class*="star"],
body.product-single [class*="rating"] [class*="star"]{ color:var(--v-amber) !important; }
body.product-single salla-comments [class*="name"],
body.product-single salla-comments a{ color:var(--v-teal) !important; font-weight:700 !important; }
body.product-single salla-comments .s-comment-item,
body.product-single salla-comments [class*="comment-card"]{ background:#fff !important; border:1px solid var(--v-border) !important; border-radius:14px !important; }
body.product-single salla-comment-form button,
body.product-single salla-comment-form .s-button-element{ background:var(--v-teal) !important; border-color:var(--v-teal) !important; border-radius:8px !important; }
body.product-single salla-comment-form button *{ color:#fff !important; }

/* related products slider (container) */
body.product-single salla-products-slider{ display:block !important; margin:40px 0 60px !important; }
body.product-single salla-products-slider .s-slider-dot-active,
body.product-single salla-products-slider .swiper-pagination-bullet-active{ background:var(--v-teal) !important; }
body.product-single .s-products-slider-title,
body.product-single salla-products-slider ~ h2,
body.product-single [class*="products-slider"] h2{ color:var(--v-slate) !important; font-weight:800 !important; }


/* ====================== 6. HEADER / NAVBAR ===================== */
header.store-header.zina-store-header{ background-color:#ffffff !important; box-shadow:0 2px 8px rgba(0,0,0,.06) !important; }
.inner.bg-inherit{ background-color:#ffffff !important; box-shadow:0 2px 8px rgba(0,0,0,.08) !important; }

/* menu tabs: teal resting → slate on hover, teal for active */
ul.main-menu > li.nice-mega-menu.root-level > a,
ul.main-menu > li.nice-mega-menu.root-level > a > span{ color:var(--v-teal) !important; font-weight:500 !important; transition:color .2s ease !important; }
ul.main-menu > li.nice-mega-menu.root-level > a:hover,
ul.main-menu > li.nice-mega-menu.root-level > a:hover > span{ color:var(--v-slate) !important; }
.main-menu > li.root-level.active > a,
.main-menu > li.root-level.active > a span,
.main-menu > li.root-level[aria-current] > a,
.main-menu > li.root-level[aria-current] > a span{ color:var(--v-teal) !important; }
/* ==================================================================
   FYRZASKA — BIG CARDS: lock image to a consistent frame
   Overrides any earlier image-size rule. Icons re-center on this frame.
   ================================================================== */
body.index .s-block--tabs-produtcs .s-product-card-image{
  height:340px !important;
  min-height:340px !important;
  max-height:340px !important;
  aspect-ratio:auto !important;
  width:100% !important;
  background:#fff !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
}
body.index .s-block--tabs-produtcs .s-product-card-image img{
  width:auto !important;
  height:100% !important;
  max-width:92% !important;
  object-fit:contain !important;
  padding:20px !important;
}
/* ==================================================================
   FYRZASKA — BIG CARDS: remove hover icons + tighten content to match
   ================================================================== */

/* 1) Remove heart + eye entirely on the big latest-products cards */
body.index .s-block--tabs-produtcs .s-product-card-quick-view-btn,
body.index .s-block--tabs-produtcs salla-button.s-product-card-wishlist-btn,
body.index .s-block--tabs-produtcs .s-product-card-wishlist-btn{
  display:none !important;
}

/* 2) Content rhythm — subtitle above title, tidy sizes/spacing */
body.index .s-block--tabs-produtcs .s-product-card-content{ padding:14px 16px 16px !important; text-align:start !important; }
body.index .s-block--tabs-produtcs .s-product-card-content-main{ display:flex !important; flex-direction:column !important; margin:0 0 8px !important; }

/* subtitle first, muted gray */
body.index .s-block--tabs-produtcs .s-product-card-content-subtitle{
  order:-1 !important; color:var(--v-gray) !important; opacity:1 !important;
  font-size:13px !important; font-weight:400 !important; line-height:20px !important; margin:0 0 4px !important;
}
/* title: slate, bold, 2-line clamp */
body.index .s-block--tabs-produtcs .s-product-card-content-title{ margin:2px 0 4px !important; }
body.index .s-block--tabs-produtcs .s-product-card-content-title,
body.index .s-block--tabs-produtcs .s-product-card-content-title a{
  color:var(--v-slate) !important; font-weight:700 !important; font-size:15px !important; line-height:20px !important;
  display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important;
}
/* price: teal, aligned to start */
body.index .s-block--tabs-produtcs .s-product-card-content-sub{ display:block !important; padding:0 !important; margin:0 0 10px !important; }
body.index .s-block--tabs-produtcs .s-product-card-price,
body.index .s-block--tabs-produtcs .s-product-card-price *,
body.index .s-block--tabs-produtcs .s-product-card-sale-price h4{
  color:var(--v-teal) !important; font-weight:700 !important; font-size:16px !important; margin:0 !important;
}
body.index .s-block--tabs-produtcs .s-product-card-sale-price{
  display:flex !important; align-items:center !important; justify-content:flex-start !important; gap:6px !important;
}
body.index .s-block--tabs-produtcs .s-product-card-sale-price > span:not(.rounded-full){ color:#969696 !important; text-decoration:line-through !important; font-size:13px !important; }
body.index .s-block--tabs-produtcs .s-product-card-sale-price .rounded-full{ background:var(--v-orange) !important; color:#fff !important; font-weight:700 !important; font-size:11px !important; padding:1px 7px !important; }

/* add-to-cart: full-width pale teal */
body.index .s-block--tabs-produtcs .s-product-card-content-footer .s-button-element{
  background:var(--v-teal-pale) !important; color:var(--v-teal) !important; border:none !important; border-radius:8px !important;
  font-weight:700 !important; font-size:14px !important; width:100% !important; padding:12px !important;
  display:flex !important; align-items:center !important; justify-content:center !important; gap:6px !important;
}
/* Heart + eye glyph offset inside their circles — all pages */
.s-product-card-quick-view-btn .sicon-eye,
.s-product-card-wishlist-btn .sicon-heart{
  margin:0 16px 16px 0 !important;
}
/* Product page badge (.promotion-title) → teal ribbon, flush top-left */
body.product-single .promotion-title{
  position:absolute !important; top:16px !important; left:0 !important; right:auto !important;
  z-index:5 !important; margin:0 !important; width:auto !important;
  background:var(--v-teal) !important; color:#fff !important;
  font-size:13px !important; font-weight:700 !important; line-height:1.4 !important; padding:6px 14px !important;
  border-radius:0 8px 8px 0 !important; box-shadow:0 2px 6px rgba(0,0,0,.12) !important;
}
/* ==================================================================
   FYRZASKA — PRODUCT PAGE: mobile layout (<=768px)
   ================================================================== */
@media (max-width:768px){
  /* stack gallery + info vertically, full width */
  body.product-single .flex.flex-col.items-start.md\:flex-row{
    flex-direction:column !important; gap:20px !important; align-items:stretch !important;
  }
  body.product-single .zina-main-content.main-content{
    max-width:100% !important; width:100% !important;
  }
  /* gallery full width */
  body.product-single salla-slider.details-slider,
  body.product-single salla-slider.image-slider{ width:100% !important; }

  /* button bar: cart + qty on row 1, buy-now full row 2 (keep grid but fluid) */
  body.product-single section.sticky-product-bar{ grid-template-columns:1fr 1fr !important; gap:10px !important; }
  body.product-single .sticky-product-bar__quantity salla-quantity-input{ height:48px !important; }
  body.product-single section.sticky-product-bar salla-add-product-button button.s-button-element{ min-height:48px !important; font-size:14px !important; }

  /* tighten title/price so they don't overpower a narrow screen */
  body.product-single h1.title-detail,
  body.product-single h1[class*="text-["]{ font-size:22px !important; }
  body.product-single .total-price,
  body.product-single [class*="total-price"]:not(.before-price){ font-size:22px !important; }

  /* product tabs: allow horizontal scroll instead of wrapping/overflow */
  body.product-single .s-tabs-header{ overflow-x:auto !important; flex-wrap:nowrap !important; -webkit-overflow-scrolling:touch !important; }
  body.product-single .s-tabs-header-item{ flex:0 0 auto !important; padding:8px 18px !important; font-size:13px !important; }
}
/* Product price — bigger bolder teal (JS-tagged, bulletproof) */
body.product-single h2.v-price,
body.product-single h2.v-price *{
  color:var(--v-teal) !important;
  font-weight:800 !important;
  font-size:30px !important;
  line-height:1.2 !important;
}
body.product-single h2.v-price .sicon-sar,
body.product-single h2.v-price i{ font-size:24px !important; }

/* ==================================================================
   FYRZASKA — PRODUCT PAGE: center the info column on mobile
   ================================================================== */
@media (max-width:768px){
  /* center the whole info column's contents */
  body.product-single .zina-main-content.main-content{
    align-items:center !important; text-align:center !important;
  }
  /* title, price, subtitle, model/category rows */
  body.product-single .zina-main-content h1,
  body.product-single .zina-main-content h2.v-price,
  body.product-single .zina-main-content .v-subrow,
  body.product-single .zina-main-content div.mb-3,
  body.product-single .zina-main-content div.mb-2{
    text-align:center !important; justify-content:center !important; width:100% !important;
  }
  /* price row + subrow: center their flex items */
  body.product-single .zina-main-content div.gap-4.flex,
  body.product-single .zina-main-content .v-subrow{
    justify-content:center !important;
  }
  
}