/* =========================================================
   EMAN-SA Mobile UX Pack (SAFE OVERRIDE)
   Focus: Mobile first | preserve current UI | no HTML/JS changes
   Color ratio target:
   60% White | 25% Purple #4f3777 | 10% Black/Gray | 5% Tiffany #14d8a8
========================================================= */

/* ---------- 0) Tokens ---------- */
:root{
  --brand-purple: #4f3777;
  --brand-tiffany: #14d8a8;

  --ink-900: #0f0f12;
  --ink-700: #2a2b33;
  --ink-500: #6b6d7a;

  --surface: #ffffff;
  --surface-2: #fbfbfd;
  --surface-3: #f6f7fb;

  --line: rgba(15,15,18,.10);
  --line-2: rgba(15,15,18,.07);

  --sh-soft: 0 10px 25px rgba(15,15,18,.08);
  --sh-hover: 0 14px 40px rgba(15,15,18,.12);

  --r-xl: 18px;
  --r-lg: 14px;
  --r-md: 12px;

  --ring: 0 0 0 3px color-mix(in srgb, var(--brand-tiffany) 30%, transparent);

  /* CTA */
  --cta-bg: var(--brand-purple);
  --cta-fg: #ffffff;

  /* Subtle accent (tiffany 5%) */
  --accent-bg: color-mix(in srgb, var(--brand-tiffany) 14%, white);
  --accent-fg: var(--brand-tiffany);
}

*{ -webkit-tap-highlight-color: transparent; }
html{ scroll-behavior:smooth; }
body{
  background: var(--surface);
  color: var(--ink-900);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
p, .text-muted{ color: var(--ink-500); line-height: 1.75; }
hr{ border-color: var(--line-2); }

/* ---------- 1) Focus / accessibility (quality feel) ---------- */
:where(a, button, [role="button"], input, select, textarea, .s-button-element):focus-visible{
  outline: none !important;
  box-shadow: var(--ring) !important;
  border-radius: var(--r-md);
}

/* ---------- 2) Mobile spacing (reduce visual noise) ---------- */
@media (max-width: 991px){
  .container, .s-container{ padding-inline: 14px !important; }
  section, .section, .s-block{ margin-block: 14px !important; }
  .s-block{ padding-block: 18px !important; background: transparent; }
}

/* ---------- 3) Header / Nav (sticky polish + tappability) ---------- */
.store-header, header, .main-nav-container, .s-header{
  background: var(--surface);
  border-bottom: 1px solid var(--line-2);
}
@supports (backdrop-filter: blur(10px)){
  .main-nav-container, .s-header{
    backdrop-filter: blur(10px);
    background: color-mix(in srgb, var(--surface) 86%, transparent);
  }
}

/* Tap targets: minimum 44px */
.header-btn, .header-btn__icon, .mburger, .mburger i,
.sicon-menu, .sicon-user, .sicon-cart, .sicon-search, .header-icon{
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-md);
}
.header-btn:hover{ background: rgba(15,15,18,.04); }

/* ---------- 4) Links (purple identity without overpowering) ---------- */
a{ color: color-mix(in srgb, var(--brand-purple) 92%, var(--ink-900)); text-decoration: none; }
a:hover{ opacity: .92; }

/* ---------- 5) Cards (unify feel) ---------- */
.card, .s-card, .product-card, .s-product-card, .s-block__content{
  background: var(--surface);
  border: 1px solid var(--line-2);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-soft);
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover, .s-card:hover, .product-card:hover, .s-product-card:hover{
  transform: translateY(-1px);
  box-shadow: var(--sh-hover);
  border-color: var(--line);
}

/* ---------- 6) Swiper / sliders (mobile: peek + smooth) ---------- */
.s-slider-container, .swiper{ border-radius: var(--r-xl); overflow: hidden; }

@media (max-width: 991px){
  .swiper, .s-slider-container, .s-slider-wrapper{ overflow: visible !important; }
  .swiper-wrapper{ padding-inline: 12px !important; }
  .swiper-slide{
    border-radius: var(--r-xl);
    overflow: hidden;
    box-shadow: var(--sh-soft);
  }
  .swiper-pointer-events{ touch-action: pan-y; }
}

/* Pagination bullets (clean) */
.swiper-pagination-bullet{
  width: 8px; height: 8px;
  border-radius: 999px;
  opacity: .35;
}
.swiper-pagination-bullet-active{ opacity: 1; transform: scale(1.1); }

/* ---------- 7) Product cards (mobile-first conversion gains) ---------- */
@media (max-width: 991px){
  .product-card__content, .s-product-card-content{
    padding: 12px 12px 10px !important;
  }

  .product-card__title a, .s-product-card-title{
    color: var(--ink-900) !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .product-card__price, .s-product-card-price, .s-product-card-sale-price{
    color: var(--ink-900) !important;
    font-weight: 900 !important;
    letter-spacing: .2px;
    margin-top: 6px !important;
  }

  /* Tech products: prevent ugly crop */
  .product-card__image, .s-product-card-image{ background: var(--surface-2); }
  .product-card__image img, .s-product-card-image img{
    object-fit: contain !important;
    aspect-ratio: 1 / 1;
    padding: 10px;
    background: transparent;
    display: block;
    width: 100%;
  }

  /* Wishlist / quickview: neutral controls, not stealing color budget */
  .quickview-btn .s-button-element,
  .wishlist-btn .s-button-element,
  .product-card__actions .s-button-element{
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--surface) 92%, var(--ink-900) 8%) !important;
    border: 1px solid var(--line-2) !important;
    color: var(--ink-900) !important;
  }

  /* Primary CTA: purple identity */
  .product-card__addToCart .s-button-element,
  salla-add-product-button[width="wide"] .s-button-element,
  .s-button-primary, .btn-primary{
    width: 100% !important;
    min-height: 46px !important;
    border-radius: 999px !important;
    background: var(--cta-bg) !important;
    color: var(--cta-fg) !important;
    border: 1px solid color-mix(in srgb, var(--brand-purple) 80%, black) !important;
    font-weight: 900 !important;
    letter-spacing: .2px;
  }
  .product-card__addToCart .s-button-element:active{ transform: translateY(1px); }
}

/* ---------- 8) Buttons / forms (comfort on mobile) ---------- */
.s-button-element, .btn, .s-btn, .s-button-btn{
  border-radius: var(--r-lg);
  transition: transform .12s ease, box-shadow .2s ease, opacity .2s ease;
}
.s-button-element:hover{ transform: translateY(-1px); opacity: .96; }
.s-button-element:active{ transform: translateY(0px); }

@media (max-width: 991px){
  input, select, textarea, .form-control, .s-input{
    min-height: 46px !important;
    border-radius: var(--r-md) !important;
    border: 1px solid var(--line) !important;
    background: var(--surface);
    color: var(--ink-900);
  }
}

/* ---------- 9) Section title divider (your enhanced-title-border) ---------- */
.enhanced-title-border.home-block-line{
  display: block;
  width: 100%;
  height: 1px;
  margin: 10px 0 14px;
  background: color-mix(in srgb, var(--ink-900) 10%, transparent);
  border-radius: 999px;
  position: relative;
  overflow: hidden;
}
.enhanced-title-border.home-block-line::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
  width: 88px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--brand-purple) 0%, var(--brand-purple) 70%, var(--brand-tiffany) 100%);
}
[dir="rtl"] .enhanced-title-border.home-block-line::before{ right:0; }
html:not([dir="rtl"]) .enhanced-title-border.home-block-line::before{ left:0; }

@media (max-width: 640px){
  .enhanced-title-border.home-block-line{ margin: 8px 0 12px; }
  .enhanced-title-border.home-block-line::before{ width: 64px; }
}

/* ---------- 10) Reduce motion ---------- */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}
/* =========================
   HOTFIX: Undo risky globals (mobile)
   Paste AFTER your previous patch
   ========================= */

@media (max-width: 991px){

  /* A) Stop breaking all sliders globally */
  .swiper, .s-slider-container, .s-slider-wrapper{
    overflow: hidden !important;     /* رجّع السلايدر لطبيعته */
  }
  .swiper-wrapper{
    padding-inline: 0 !important;    /* يلغي padding اللي قد يسبب قص/تزحلق */
  }
  .swiper-slide{
    box-shadow: none !important;     /* كان يسبب “كروت” غير مقصودة */
    border-radius: 0 !important;     /* يلغي تدوير عام على كل سلايد */
  }

  /* B) Stop forcing contain on every image inside product blocks/sections */
  .product-card__image img,
  .s-product-card-image img{
    object-fit: cover !important;    /* رجّع الافتراضي الآمن */
    padding: 0 !important;
    aspect-ratio: auto !important;
  }

  /* C) Stop global card shadowing that may hit blocks unexpectedly */
  .s-block__content{
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
  }
}
/* =========================
   SAFE Mobile Enhancements (Scoped)
   ========================= */

:root{
  --brand-purple:#4f3777;
  --brand-tiffany:#14d8a8;
  --ink-900:#0f0f12;
  --line-2:rgba(15,15,18,.07);
  --r-xl:18px;
  --r-lg:14px;
  --r-md:12px;
  --sh-soft:0 10px 25px rgba(15,15,18,.08);
  --ring:0 0 0 3px color-mix(in srgb, var(--brand-tiffany) 30%, transparent);
}

@media (max-width: 991px){
  /* Tap targets */
  .header-btn, .header-btn__icon, .mburger, .mburger i,
  .sicon-menu, .sicon-user, .sicon-cart, .sicon-search, .header-icon{
    min-width:44px; min-height:44px;
    display:inline-flex; align-items:center; justify-content:center;
    border-radius: var(--r-md);
  }

  /* Focus */
  :where(a,button,[role="button"],input,select,textarea,.s-button-element):focus-visible{
    outline:none !important;
    box-shadow: var(--ring) !important;
    border-radius: var(--r-md);
  }

  /* Product cards ONLY */
  .product-card, .s-product-card{
    border:1px solid var(--line-2);
    border-radius: var(--r-xl);
    overflow:hidden;
    box-shadow: var(--sh-soft);
  }

  .product-card__content, .s-product-card-content{
    padding:12px 12px 10px !important;
  }

  .product-card__title a, .s-product-card-title{
    line-height:1.25 !important;
    font-weight:800 !important;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  /* CTA: فقط زر الإضافة */
  .product-card__addToCart .s-button-element,
  salla-add-product-button[width="wide"] .s-button-element,
  .s-button-primary, .btn-primary{
    min-height:46px !important;
    border-radius:999px !important;
    background: var(--brand-purple) !important;
    color:#fff !important;
    font-weight:900 !important;
  }

  /* Title divider you asked for */
  .enhanced-title-border.home-block-line{
    display:block;
    width:100%;
    height:1px;
    margin:8px 0 12px;
    background: color-mix(in srgb, var(--ink-900) 10%, transparent);
    border-radius:999px;
    position:relative;
    overflow:hidden;
  }
  .enhanced-title-border.home-block-line::before{
    content:"";
    position:absolute;
    top:0; bottom:0;
    width:64px;
    border-radius:999px;
    background: linear-gradient(90deg, var(--brand-purple) 0%, var(--brand-purple) 70%, var(--brand-tiffany) 100%);
  }
  [dir="rtl"] .enhanced-title-border.home-block-line::before{ right:0; }
  html:not([dir="rtl"]) .enhanced-title-border.home-block-line::before{ left:0; }
}
/* Remove ugly divider under home block titles */
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG
section.s-block--circle-links
.home-block-title > span{
  display: none !important;
}
/* ===================================================
   Section: مختارات اليوم
   ID: best-offers-2-slider
   BG Color: #e4cbfd (Approved)
   Mobile-first – Scoped – Safe
=================================================== */

#best-offers-2-slider{
  background: #e4cbfd !important;
  padding: 22px 0;
  border-radius: 18px;
}

/* منع أي عناصر داخلية من كسر الخلفية */
#best-offers-2-slider,
#best-offers-2-slider .s-products-slider-wrapper,
#best-offers-2-slider .s-slider-container{
  background-color: #e4cbfd !important;
}

/* مسافة جانبية مريحة للجوال */
#best-offers-2-slider .s-products-slider-wrapper{
  padding-inline: 12px;
}

/* تنعيم الانتقال البصري بين الأقسام */
@media (max-width: 768px){
  #best-offers-2-slider{
    margin-inline: -10px; /* يعطي إحساس full-width مثل Celia */
    border-radius: 0;
  }
}
/* =========================================
   Button: عرض الكل — best-offers-2-slider
========================================= */

#best-offers-2-slider a.btn--outline-primary{
  background-color: #4f3777 !important; /* بنفسجي غامق */
  color: #ffffff !important;
  border: none !important;
  border-radius: 999px !important; /* Pill */
  height: 44px;
  padding-inline: 16px;
  font-weight: 700;
}

/* أيقونة السهم */
#best-offers-2-slider a.btn--outline-primary i{
  color: #ffffff !important;
}

/* Hover / Touch feedback */
#best-offers-2-slider a.btn--outline-primary:hover,
#best-offers-2-slider a.btn--outline-primary:active{
  background-color: #3e2d63 !important; /* أغمق شوي */
}

/* =========================================================
   Global: Numbered Swiper Pagination (Bullets -> 1,2,3..)
   Applies to all sliders that use .swiper-pagination-bullets
   Active color: #4f3777
========================================================= */

/* 1) نخلي البولت دائرة رقمية بدل نقطة */
.swiper .swiper-pagination.swiper-pagination-bullets{
  counter-reset: sallaBulletCounter;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

/* 2) شكل كل رقم */
.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet{
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  opacity: 1 !important;
  background: transparent !important;
  border: 1px solid rgba(0,0,0,.18);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: all .25s ease;
}

/* 3) رقم إنجليزي (1 2 3) */
.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet::before{
  counter-increment: sallaBulletCounter;
  content: counter(sallaBulletCounter); /* English digits by default */
  font-weight: 800;
  font-size: 14px;
  line-height: 1;
  color: rgba(0,0,0,.75);
}

/* 4) النشط */
.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active{
  background: #4f3777 !important;
  border-color: #4f3777 !important;
}

.swiper .swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active::before{
  color: #fff !important;
}
/* =========================================
   Circle Links Sliders – Global Text Tuning
   Applies to any similar section (circle image + title)
========================================= */

/* العنوان تحت الصورة */
.s-slider-wrapper .swiper-slide a h3.mt-6{
  font-size: 14px !important;
  line-height: 1.35 !important;
  margin-top: 12px !important;
  font-weight: 600 !important;
}

/* الوصف (إن وُجد) */
.s-slider-wrapper .swiper-slide a p.text-sm{
  font-size: 12px !important;
  line-height: 1.4 !important;
}

/* للجوال */
@media (max-width: 640px){
  .s-slider-wrapper .swiper-slide a h3.mt-6{
    font-size: 13px !important;
    line-height: 1.3 !important;
  }
}
/* =========================================================
   GLOBAL: Fix price position (with/without rating) for ALL product cards
   + GLOBAL: Set ALL rating stars color to #00cc99
========================================================= */

/* 1) اجعل محتوى كرت المنتج عمودي وثابت */
custom-salla-product-card .product-card__content,
.product-card .product-card__content{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

custom-salla-product-card .product-card__content-wrapper,
.product-card .product-card__content-wrapper{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* 2) ادفع السعر لأسفل دائماً (يوقف اختلاف مكانه بسبب النجوم) */
custom-salla-product-card .price-wrapper,
.product-card .price-wrapper{
  margin-top: auto !important;
}

/* 3) ثبّت مساحة التقييم حتى لو اختلف وجوده (اختياري لكن مفيد) */
custom-salla-product-card .s-product-card-rating,
.product-card .s-product-card-rating{
  min-height: 18px !important;
}

/* =========================================================
   GLOBAL Stars color: #00cc99 (ALL stars on the site)
========================================================= */
salla-rating-stars,
.s-rating-stars-wrapper,
.s-product-card-rating,
.s-rating-stars-btn-star{
  color: #00cc99 !important;
}

/* فرض اللون على الـ SVG (لو الثيم ما يلتزم بـ color) */
salla-rating-stars svg,
salla-rating-stars svg path,
.s-rating-stars-wrapper svg,
.s-rating-stars-wrapper svg path{
  fill: #00cc99 !important;
}
/* =========================================
   Gaming Overlay Categories (3 cards) - special-cats-with-bg--16
   بنر + 3 كروت فوقه (Overlay) - نسخة جاهزة للتنفيذ
========================================= */

.special-cats-with-bg--16{
  position: relative;
  overflow: hidden;
}

/* البنر: فك التقييد وخفف الارتفاع */
.special-cats-with-bg--16 > .relative.mx-auto{
  max-width: 100% !important;
  padding-bottom: 0 !important;
}
.special-cats-with-bg--16 > .relative.mx-auto .relative.py-32{
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}
@media (max-width: 639px){
  .special-cats-with-bg--16 > .relative.mx-auto .relative.py-32{
    padding-top: 36px !important;
    padding-bottom: 28px !important;
  }
}

/* الكروت: Overlay فوق نهاية البنر */
.special-cats-with-bg--16 section[aria-labelledby="collection-heading"]{
  position: relative;
  z-index: 5;
  margin-top: -64px !important;
  padding-bottom: 18px !important;
}
@media (max-width: 639px){
  .special-cats-with-bg--16 section[aria-labelledby="collection-heading"]{
    margin-top: -38px !important;
    padding-bottom: 12px !important;
  }
}

/* شبكة الكروت */
.special-cats-with-bg--16 section[aria-labelledby="collection-heading"] .grid{
  max-width: 1100px !important;
  margin: 0 auto !important;
  gap: 14px !important;
}
@media (max-width: 639px){
  .special-cats-with-bg--16 section[aria-labelledby="collection-heading"] .grid{
    gap: 10px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* ستايل Gaming للكرت */
.special-cats-with-bg--16 .group.relative{
  border-radius: 16px !important;
  overflow: hidden !important;

  background: rgba(9, 12, 20, .55) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  border: 1px solid rgba(79, 55, 119, .55) !important;
  box-shadow:
    0 16px 40px rgba(0,0,0,.35),
    0 0 0 1px rgba(255,255,255,.06) inset !important;

  transform: translateZ(0);
}

/* ارتفاع الكروت مناسب */
@media (min-width: 640px){
  .special-cats-with-bg--16 .group.relative{ height: 220px !important; }
}
@media (max-width: 639px){
  .special-cats-with-bg--16 .group.relative{ height: 110px !important; }
}

/* تحسين صور الكروت */
.special-cats-with-bg--16 .group.relative img{
  transform: scale(1.03);
  filter: saturate(1.08) contrast(1.08);
}

/* تغميق احترافي */
.special-cats-with-bg--16 .group.relative .bg-gradient-to-b{
  opacity: .55 !important;
}
.special-cats-with-bg--16 .group.relative:hover .bg-gradient-to-b{
  opacity: .40 !important;
}

/* عنوان التصنيف كبادج (Gaming badge) */
.special-cats-with-bg--16 .group.relative .category-name{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 12px;
  border-radius: 999px;

  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: .2px;

  background: rgba(0,0,0,.45);
  border: 1px solid rgba(0,204,153,.40);
  box-shadow: 0 10px 22px rgba(0,0,0,.25);

  font-size: 13px !important;
  line-height: 1 !important;
  text-shadow: 0 10px 30px rgba(0,0,0,.35);
}

/* Glow on hover */
.special-cats-with-bg--16 .group.relative:hover{
  border-color: rgba(0,204,153,.55) !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,.42),
    0 0 0 1px rgba(255,255,255,.08) inset,
    0 0 26px rgba(0,204,153,.12) !important;
}

/* إزالة الفراغ الأبيض الزائد في الجوال */
@media (max-width: 639px){
  .special-cats-with-bg--16 .sm\:hidden .h-48.w-full.bg-storeBG{
    height: 10px !important;
  }
}
/* =====================================================
   GLOBAL PRODUCTS SECTIONS – Calm UI System
   Palette: fbfbfb → f5f5f5 → ededed
   Applies to ALL product sections & sliders
===================================================== */

/* 1) خلفية جميع أقسام المنتجات */
.s-block--tabs-produtcs,
.s-products-slider-wrapper,
.s-products-slider-slider,
section[class*="featured-products"],
section[class*="products"]{
  background: #fbfbfb !important;
}

/* 2) تقليل المسافات العمودية */
.s-block--tabs-produtcs{
  padding-top: 24px !important;
  padding-bottom: 28px !important;
}
@media (max-width: 640px){
  .s-block--tabs-produtcs{
    padding-top: 16px !important;
    padding-bottom: 20px !important;
  }
}

/* =====================================================
   TABS – Global
===================================================== */
.tabs{
  gap: 8px !important;
  padding-bottom: 12px !important;
}

.tabs .tab-trigger button{
  background: #f5f5f5 !important;
  border: 1px solid #e6e6e6 !important;
  color: #444 !important;
  font-size: 13px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  transition: all .25s ease;
}

.tabs .tab-trigger.is-active button{
  background: #ededed !important;
  border-color: #dcdcdc !important;
  color: #111 !important;
  font-weight: 600 !important;
}

/* =====================================================
   PRODUCT CARD – Global
===================================================== */
custom-salla-product-card,
.product-card{
  background: #ffffff !important;
  border-radius: 14px !important;
  border: 1px solid #ededed !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.04) !important;
}

/* تثبيت المحتوى عموديًا */
.product-card__content,
.product-card__content-wrapper{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* عنوان المنتج – سطرين فقط */
.product-card__title a{
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: #222 !important;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* السعر دائمًا بأسفل البطاقة */
.price-wrapper{
  margin-top: auto !important;
  padding-top: 6px !important;
}

/* السعر */
.total-price{
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #333 !important;
}

/* =====================================================
   ADD TO CART – Calm Button
===================================================== */
.product-card__addToCart button,
.product-card__mini-cart button{
  background: #f1f1f1 !important;
  border: 1px solid #e0e0e0 !important;
  color: #111 !important;
  font-size: 13px !important;
  border-radius: 10px !important;
  transition: background .2s ease;
}

.product-card__addToCart button:hover,
.product-card__mini-cart button:hover{
  background: #e8e8e8 !important;
}

/* =====================================================
   SECONDARY ACTIONS (Wishlist / Quickview)
===================================================== */
.product-card__actions button{
  background: rgba(255,255,255,.9) !important;
  border: 1px solid #e6e6e6 !important;
}

/* =====================================================
   MOBILE POLISH
===================================================== */
@media (max-width: 640px){
  .tabs{
    padding-bottom: 8px !important;
  }

  .product-card__title a{
    font-size: 12.5px !important;
  }

  .total-price{
    font-size: 13.5px !important;
  }
}
/* =====================================================
   FIX: Circle Links Glow not showing بسبب overflow-hidden
   Applies to ALL circle-links sections فقط
===================================================== */

/* 0) افتح الـ overflow (داخل أقسام الدوائر فقط) */
.s-block--circle-links .overflow-hidden.rounded-full{
  overflow: visible !important;
  position: relative;
  isolation: isolate;
}

/* 1) الهالة */
.s-block--circle-links .overflow-hidden.rounded-full::before{
  content: "";
  position: absolute;
  inset: -10px;                 /* حجم الهالة */
  border-radius: 999px;
  background: radial-gradient(
    circle,
    rgba(20,216,168,0.22) 0%,
    rgba(20,216,168,0.14) 42%,
    rgba(20,216,168,0.06) 68%,
    rgba(20,216,168,0.00) 78%
  );
  z-index: -1;
  filter: blur(8px);
  pointer-events: none;
}

/* 2) Hover */
.s-block--circle-links .swiper-slide:hover .overflow-hidden.rounded-full::before{
  inset: -12px;
  background: radial-gradient(
    circle,
    rgba(20,216,168,0.30) 0%,
    rgba(20,216,168,0.18) 48%,
    rgba(20,216,168,0.08) 72%,
    rgba(20,216,168,0.00) 82%
  );
}

/* 3) تأكيد أن الصورة فوق الهالة */
.s-block--circle-links .overflow-hidden.rounded-full img{
  position: relative;
  z-index: 1;
  border-radius: 999px; /* ضمان الدائرة */
}
/* =====================================================
   Circle Links: Perfect Circle + Active/hover grow + stronger glow
   Applies to ALL circle-links sections
===================================================== */

/* 1) ثبّت الحامل يكون مربع دائري مهما كان العرض */
.s-block--circle-links .swiper-slide a > .overflow-hidden.rounded-full{
  width: 78px !important;          /* صغّر */
  height: 78px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 999px !important;
  margin-inline: auto !important;
  overflow: visible !important;     /* عشان الهالة */
  position: relative;
  transform: translateZ(0) scale(.92); /* أصغر افتراضيًا */
  transition: transform .22s ease, filter .22s ease;
}

/* 2) الصورة داخل الدائرة (لا تعتمد على w-fit/h-24) */
.s-block--circle-links .swiper-slide a > .overflow-hidden.rounded-full img{
  width: 100% !important;
  height: 100% !important;
  border-radius: 999px !important;
  object-fit: contain !important;   /* شعارات */
  background: #fff !important;
  padding: 10px !important;
  display: block;
}

/* 3) الهالة الافتراضية (خفيفة) */
.s-block--circle-links .swiper-slide a > .overflow-hidden.rounded-full::before{
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: 999px;
  background: radial-gradient(circle,
    rgba(20,216,168,.18) 0%,
    rgba(20,216,168,.10) 45%,
    rgba(20,216,168,.00) 78%
  );
  filter: blur(10px);
  pointer-events: none;
  z-index: -1;
  transition: inset .22s ease, filter .22s ease, background .22s ease, opacity .22s ease;
  opacity: .9;
}

/* 4) لما المستخدم يمرر (Active) أو يهوفر: تكبر وتزيد كثافة اللون */
.s-block--circle-links .swiper-slide-active a > .overflow-hidden.rounded-full,
.s-block--circle-links .swiper-slide:hover a > .overflow-hidden.rounded-full{
  transform: translateZ(0) scale(1.03);
}

.s-block--circle-links .swiper-slide-active a > .overflow-hidden.rounded-full::before,
.s-block--circle-links .swiper-slide:hover a > .overflow-hidden.rounded-full::before{
  inset: -14px;
  filter: blur(12px);
  background: radial-gradient(circle,
    rgba(20,216,168,.34) 0%,
    rgba(20,216,168,.18) 52%,
    rgba(20,216,168,.00) 82%
  );
  opacity: 1;
}

/* 5) Responsive */
@media (max-width: 640px){
  .s-block--circle-links .swiper-slide a > .overflow-hidden.rounded-full{
    width: 68px !important;
    height: 68px !important;
  }
  .s-block--circle-links .swiper-slide a > .overflow-hidden.rounded-full img{
    padding: 9px !important;
  }
}