/* يوقف oscillation بتاعة Theme Builder */
#after-header {
    margin-top: calc(-1 * 100dvh) !important;
    min-height: 100dvh !important;
}

/* تكبير لوجو الهيدر (Center Header) */
.header-section--center .navbar-brand img {
    width: 160px !important;
    /* عدّل الرقم حسب اللي يعجبك */
    height: auto !important;
    /* يحافظ على النسبة */
    max-height: 100px !important;
    /* اختياري عشان ما يكسر الهيدر */
    object-fit: contain;
    padding: 10px;
}

/* إخفاء الشريط العلوي فقط بدون المساس باللوجو */
.top-navbar {
    display: none !important;
}

/* تكبير خط عناصر المنيو وتغيير اللون */
.main-menu li a span {
    font-size: 14px !important;
    color: rgb(180, 96, 111) !important;
    padding-top: 10px;
    font-weight: 500;
}

/* اخفاء المسافات الكبيرة */
section.S_store_features {
    margin-bottom: 2.8rem !important;
}

/* 1) بدل height:70vh نخليه min-height عشان البنر ما يختفيش */
#S_banner_counter-3 {
    height: auto !important;
    min-height: 45vh !important;
    /* عدّلها: 35vh / 40vh / 50vh */
}

/* 2) إلغاء height:70vh المكرر على الكونتينر وخليه يملأ السكشن */
#S_banner_counter-3 .container-narrow {
    height: 100% !important;
    min-height: 100% !important;
}

/* تقليل المسافة أسفل Banner Counter */
section.S_banner_counter {
    margin-bottom: 2.8rem !important;
}

/* تقليل المسافة أسفل سكشن الهيدر (العنوان) */
section.S_header_section {
    margin-bottom: 1.8rem !important;
}

section#S_banner_counter-10 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Reduce bottom space only for testimonials section */
#S_testimonials-12 {
    margin-bottom: 15px !important;
}

/* ---اخفاء المسافات الكبيرة */

/* ==========================
   Center title + Move arrows
   Scoped ONLY to: #best-offers-9-slider
   ========================== */

#best-offers-9-slider .s-slider-block__title {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    position: relative !important;
    margin-bottom: 16px !important;
}

/* الجزء اللي فيه العنوان */
#best-offers-9-slider .s-slider-block__title-right {
    padding: 0 !important;
    margin: 0 !important;
}

/* العنوان نفسه */
#best-offers-9-slider .s-slider-block__title-right h2 {
    color: rgb(155, 128, 130) !important;
    font-size: 36px !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* الأسهم: انزلها تحت العنوان بدون ما تأثر على التوسيط */
#best-offers-9-slider .s-slider-block__title-left {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: -46px !important;
    margin: 0 !important;
}

/* مسافة بين الأسهم وبين الكروت */
#best-offers-9-slider .s-slider-container {
    margin-top: 65px !important;
}

/* إزالة أي padding افتراضي حوالين العنوان */
#best-offers-9-slider .s-slider-block__title-right,
#best-offers-9-slider .s-slider-block__title-right h2 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* موبايل */
@media (max-width: 768px) {
    #best-offers-9-slider .s-slider-block__title-right h2 {
        font-size: 24px !important;
    }

    #best-offers-9-slider .s-slider-block__title-left {
        bottom: -36px !important;
    }
}

/* =========================
   Center footer columns (Desktop only)
   ========================= */

/* Desktop only – center footer columns */
@media (min-width:1024px) {

    /* الجريد نفسه */
    .store-footer__inner .container.grid {
        justify-content: center !important;
        grid-template-columns: repeat(2, minmax(0, 420px)) !important;
    }

    /* إخفاء عمود التطبيقات */
    .store-footer__inner salla-apps-icons {
        display: none !important;
    }

    /* توسيط العمودين */
    .store-footer__inner .container.grid>div {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* اعكس ترتيب العمودين بدون ما يكسر الجريد */
    .store-footer__inner .container.grid {
        direction: ltr !important;
    }

    .store-footer__inner .container.grid>div {
        direction: rtl !important;
        /* يحافظ على النص عربي */
    }

}

/* المنتجات */
/* ============================
   #slider-with-bg-9 ONLY
   Product cards styling
   ============================ */

#slider-with-bg-9 custom-salla-product-card.s-product-card-entry {
    border: 2px solid rgb(228, 175, 179) !important;
    border-radius: 14px !important;
    /* اختياري */
    overflow: hidden !important;
    /* عشان البوردر يبقى نظيف */
}

/* 1) اسم المنتج: أكبر شوية + في النص */
#slider-with-bg-9 .s-product-card-content-title,
#slider-with-bg-9 .s-product-card-content-title a {
    text-align: center !important;
}

#slider-with-bg-9 .s-product-card-content-title a {
    display: block !important;
    font-size: 16px !important;
    /* زوّد/قلّل حسب ذوقك */
    line-height: 1.35 !important;
    font-weight: 600 !important;
}

/* 2) السعر: أكبر + في النص */
#slider-with-bg-9 .s-product-card-sale-price {
    width: 100% !important;
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: baseline !important;
    gap: 10px !important;
}

/* السعر بعد الخصم (الحالي) */
#slider-with-bg-9 .s-product-card-sale-price h4 {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: rgb(180, 96, 111) !important;
}

/* السعر قبل الخصم */
#slider-with-bg-9 .s-product-card-sale-price span {
    font-size: 14px !important;
    font-weight: 600 !important;
    opacity: .75 !important;
}

/* (اختياري) توسيط الجزء الرئيسي كله لو حابب */
#slider-with-bg-9 .s-product-card-content-main .flex {
    align-items: center !important;
}

/* Mobile only – space between product cards */
@media (max-width: 768px) {

    #slider-with-bg-9 .swiper-wrapper {
        gap: 12px !important;
    }

    #slider-with-bg-9 .s-products-slider-card {
        margin-left: 6px !important;
        margin-right: 6px !important;
    }

}

a[aria-label="استكشفي المجموعة"] {
    padding: 15px 24px !important;
    border-radius: 15px !important;
}

/* تغيير لون الزرار (Background + Border)*/
#slider-with-bg-9 .s-button-element.s-button-primary {
    background: rgb(228, 175, 179) !important;
    border-color: rgb(228, 175, 179) !important;
}

#slider-with-bg-9 .s-button-element.s-button-primary .s-button-text,
#slider-with-bg-9 .s-button-element.s-button-primary span {
    color: #fff !important;
}

#slider-with-bg-9 .s-button-element.s-button-primary:hover {
    filter: brightness(0.92) !important;
}

@media (max-width:768px) {

    /* 1) قلل ارتفاع الهيرو نفسه (بدل 100vh) */
    #S_universal_slider-0 .universal-slider__slide {
        height: 52vh !important;
        /* جرّب 55vh - 70vh حسب اللي يعجبك */
        min-height: 380px !important;
        /* عشان النص والزرار ما يختفوش */
    }

    /* 2) خلّي طبقة الميديا والفيديو تلتزم بنفس الارتفاع */
    #S_universal_slider-0 .universal-slider__media,
    #S_universal_slider-0 .universal-slider__video-container,
    #S_universal_slider-0 .universal-slider__video {
        height: 100% !important;
    }

    /* 3) تحكم في الجزء الظاهر من الفيديو (اختياري) */
    #S_universal_slider-0 .universal-slider__video {
        object-fit: cover !important;
        object-position: center 20% !important;
        /* نزّل/طلّع الكادر: 20% / 50% / 70% */
    }

}

/* Mobile only: replace background image ONLY for #S_banner_counter-3 */
@media (max-width: 768px) {

    /* نخفي الـ img الأصلية اللي عاملة background */
    #S_banner_counter-3>img.absolute.inset-0 {
        display: none !important;
    }

    /* نخلي السكشن هو اللي شايل الصورة */
    #S_banner_counter-3 {
        position: relative;
        /* احتياطي */
        background-image: url("https://uploaded.sirv.com/%D8%B1%D9%88%D8%AA%D9%8A%D9%86%20%D8%A7%D9%84%D8%B9%D9%86%D8%A7%D9%8A%D8%A9%20%D8%A7%D9%84%D9%83%D8%A7%D9%85%D9%84%20%D9%81%D9%8A%20%D8%A8%D9%83%D8%AC%20%D9%88%D8%A7%D8%AD%D8%AF%20(1920%20x%201080%20px)%20(1080%20x%201400%20px)%20(2).png") !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;

        /* دي أهم سطرين عشان الصورة الطول تظهر جزء أكبر */
        background-position: center top !important;
        /* لو عايز تنزل العناصر لتحت أكتر بدل top خليه center bottom */
    }

    /* بما إن عندك div داخلي برضه عليه height:70vh نخليه ياخد نفس الارتفاع بدون ما يبوظ */
    #S_banner_counter-3 .container-narrow {
        height: 70vh !important;
    }
}

.text-primary-reverse {
    color: #ffffff !important;
}

/* Mobile only: replace background image ONLY for #S_banner_counter-10 */
/* S_banner_counter-10 mobile background swap ONLY */
@media (max-width: 768px) {

    #S_banner_counter-10>img.absolute.inset-0 {
        display: none !important;
    }

    #S_banner_counter-10 {
        background-image: url("https://uploaded.sirv.com/%D8%B1%D9%88%D8%AA%D9%8A%D9%86%20%D8%A7%D9%84%D8%B9%D9%86%D8%A7%D9%8A%D8%A9%20%D8%A7%D9%84%D9%83%D8%A7%D9%85%D9%84%20%D9%81%D9%8A%20%D8%A8%D9%83%D8%AC%20%D9%88%D8%A7%D8%AD%D8%AF%20(1920%20x%201080%20px)%20(1080%20x%201400%20px)%20(4).png") !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center top !important;
    }

    #S_banner_counter-10 .container-narrow {
        height: 70vh !important;
    }

    #S_banner_counter-10 {
        margin-bottom: 3.5rem !important;
        /* نفس mb-14 تقريباً */
    }

    #best-offers-9-slider {
        margin-bottom: 48px !important;
        /* غيّر الرقم زي ما تحب */
    }

    #S_header_section-11 {
        margin-top: 36px !important;
    }

    #S_header_section-4 .main-title-text {
        font-size: 1.25rem !important;
    }

    #S_header_section-4 .sub-title-text {
        font-size: 0.95rem !important;
        overflow-wrap: anywhere !important;
        font-weight: 600;
    }

    #S_header_section-11 .main-title-text {
        font-size: 1.25rem !important;
    }

    #S_header_section-11 .sub-title-text {
        font-size: 0.95rem !important;
        overflow-wrap: anywhere !important;
        font-weight: 600;
    }

    #best-offers-9-slider .s-slider-container {
        margin-top: 35px !important;
    }

    .compare-marquee.is-bottom {
        margin-bottom: 2.5rem !important;
    }

    section.S_store_features {
        margin-bottom: 2rem !important;
    }

    #best-offers-9-slider .s-slider-block__title-right h2 {
        font-size: 1.25rem !important;
    }

    .flex.flex-col.py-7.items-center.justify-center h1 {
        font-size: 1.25rem !important;
    }

    .flex.flex-col.py-7.items-center.justify-center h3 {
        font-size: 0.95rem !important;
    }

    .comparing-row-wrapper{
        display:grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;

        column-gap:40px !important;   /* المسافة في النص */
        row-gap:18px !important;

        padding-left:18px !important;
        padding-right:18px !important;
    }

    .comparing-row-wrapper > section.S_comparing{
        width:100% !important;
        margin:0 !important;
    }

    /* 3) (اختياري) لو فيه padding داخلي بيكسر العرض */
    .comparing-row-wrapper>section.S_comparing .flex.flex-col.gap-2 {
        width: 100% !important;
    }

}

/* ===== Increase height of ALL comparing sliders ===== */
#S_comparing-5 #ba-slider-5>.relative.block.w-full,
#S_comparing-6 #ba-slider-6>.relative.block.w-full,
#S_comparing-7 #ba-slider-7>.relative.block.w-full,
#S_comparing-8 #ba-slider-8>.relative.block.w-full {
    padding-top: 145% !important;
    /* Mobile height (كان 75%) */
}

/* Desktop */
@media (min-width: 768px) {

    #S_comparing-5 #ba-slider-5>.relative.block.w-full,
    #S_comparing-6 #ba-slider-6>.relative.block.w-full,
    #S_comparing-7 #ba-slider-7>.relative.block.w-full,
    #S_comparing-8 #ba-slider-8>.relative.block.w-full {
        padding-top: 100% !important;
        /* Desktop height (كان ~45%) */
    }
}

/* Optional: خلي الصور تطلع لفوق شوية بدل center */
#S_comparing-5 img,
#S_comparing-6 img,
#S_comparing-7 img,
#S_comparing-8 img {
    object-position: center top !important;
}

section.sticky-product-bar{
  background: #fff !important;
}

/* ===============================
   Mobile product cards spacing
   =============================== */
@media (max-width:768px){

  /* مسافة بين السلايدات */
  .s-slider-container .swiper-wrapper{
    padding-right: 30px !important;
    padding-left: 30px !important;
  }

  .s-products-slider-card{
    padding: 0 20px !important;
    margin-left: 24px !important;
  }

  /* شكل الكارت نفسه */
  .s-product-card-entry{
    border: 1px solid rgb(225,175,179) !important;
    border-radius: 16px !important;
    padding: 10px !important;
    background: #fff !important;
    transition: 0.3s ease;
  }

  /* ظل خفيف احترافي */
  .s-product-card-entry{
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  }

  /* توسيط المحتوى كله */
  .s-product-card-content{
    text-align: center !important;
  }

  /* تكبير اسم المنتج */
  .s-product-card-content-title a{
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    display: block;
  }

  /* توسيط السعر */
  .s-product-card-content-sub{
    justify-content: center !important;
  }

  /* السعر بعد الخصم (السعر الأساسي الظاهر الكبير) */
  .s-product-card-sale-price h4{
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: #b4606f !important;
  }

  /* السعر قبل الخصم */
  .s-product-card-sale-price span{
    font-size: 0.9rem !important;
    opacity: 0.7;
  }

  .s-product-card-entry.s-product-card-vertical 
  .s-product-card-sale-price h4{
      color: #b4606f !important;
  }

}

/* مسافة بين السلايدات */
.s-slider-container .swiper-wrapper{
  padding-right: 20px !important;
  padding-left: 20px !important;
}

/* شكل الكارت نفسه */
.s-product-card-entry{
  border: 1px solid rgb(225,175,179) !important;
  border-radius: 16px !important;
  padding: 10px !important;
  background: #fff !important;
  transition: 0.3s ease;
}

/* ظل خفيف احترافي */
.s-product-card-entry{
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

/* توسيط المحتوى كله */
.s-product-card-content{
  text-align: center !important;
}

/* تكبير اسم المنتج */
.s-product-card-content-title a{
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  display: block;
}

/* توسيط السعر */
.s-product-card-content-sub{
  justify-content: center !important;
  color: #b4606f !important;
}

/* السعر بعد الخصم (السعر الأساسي الظاهر الكبير) */
.s-product-card-sale-price h4{
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  color: #b4606f !important;
}

/* السعر قبل الخصم */
.s-product-card-sale-price span{
  font-size: 0.9rem !important;
  opacity: 0.7;
}

.s-product-card-entry.s-product-card-vertical 
.s-product-card-sale-price h4{
    color: #b4606f !important;
}

/* خاص بالتصنيفات فقط */

@media (max-width: 768px){

  /* CATEGORY ONLY */
  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal{
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;

    /* حل قص الزرار */
    height: auto !important;
    min-height: unset !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 1 !important;
  }

  /* خلي الكارت ياخد مساحة كفاية جوه الجريد */
  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal .s-product-card-content{
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 auto !important;
  }

  /* ===== Fix image: remove any fixed heights causing cropping/blank space ===== */
  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal .s-product-card-image{
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    overflow: hidden !important; /* نخليها نظيفة جوه البوردر */
  }

  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal .s-product-card-image a{
    display: block !important;
    width: 100% !important;
    height: auto !important;
  }

  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal img.s-product-card-image-cover{
    display: block !important;
    width: 100% !important;
    height: auto !important;        /* مهم */
    max-height: none !important;     /* مهم */
    object-fit: contain !important;  /* عشان ما يقصش الصورة */
  }

  /* ===== Ensure footer/button stays inside card and visible ===== */
  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal .s-product-card-content-footer{
    width: 100% !important;
    margin-top: 10px !important;
    overflow: visible !important;
  }

  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal salla-add-product-button,
  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal .s-button-wrap,
  html.is-category-page custom-salla-product-card.s-product-card-entry.s-product-card-horizontal .s-button-element{
    width: 100% !important;
  }

  /* لو الجريد نفسه بيقص العناصر (نادر بس بيحصل) */
  html.is-category-page .s-products-grid,
  html.is-category-page .products-grid,
  html.is-category-page [class*="products-grid"]{
    overflow: visible !important;
  }

  /* أضف للسلة */
  html.is-category-page 
  custom-salla-product-card.s-product-card-entry.s-product-card-horizontal 
  .s-button-text span{
    
    visibility: hidden;   /* نخفي النص */
    position: relative;
  }

  html.is-category-page 
  custom-salla-product-card.s-product-card-entry.s-product-card-horizontal 
  .s-button-text span::after{
    
    content: "أضف للسلة";
    visibility: visible;
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    letter-spacing: normal !important;   /* مهم جداً */
    font-family: inherit !important;     /* يستخدم نفس الخط */
  }
}

/* صفحة العروض */
@media (max-width: 768px){

  /* ========= OFFERS ONLY (clean reset) ========= */

  /* Center cards */
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 0 12px !important;
  }

  /* Card width */
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards > custom-salla-product-card{
    width: min(360px, 100%) !important;
    margin: 0 auto !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* Image box (remove h-full effect) */
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-product-card-image a{
    display: block !important;
    width: 100% !important;
    height: 180px !important;       /* ثابت وواضح */
    overflow: hidden !important;
  }

  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card img.s-product-card-image-cover{
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
  }

  /* Title 2 lines */
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-product-card-content-title a{
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    line-height: 1.45 !important;
  }

  /* Make sure footer (button) is visible */
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-product-card-content-footer{
    display: block !important;
    margin-top: 12px !important;
  }

  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card salla-add-product-button,
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-button-wrap,
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-button-element{
    width: 100% !important;
    display: block !important;
  }

  /* Button text => "أضف للسلة" */
  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-button-element{
    letter-spacing: 0 !important;
  }

  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-button-text span{
    visibility: hidden !important;
    position: relative !important;
  }

  html.is-offers-page .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card .s-button-text span::after{
    content: "أضف للسلة";
    visibility: visible !important;
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: inherit !important;
    font-weight: 600 !important;
  }
  /* OFFERS ONLY - FIX IMAGE ONLY */
  @media (max-width: 768px){

  /* OFFERS ONLY – fill image area completely */

  html.is-offers-page
  .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card
  .s-product-card-image{
    padding: 0 !important;
    background: transparent !important;
  }

  html.is-offers-page
  .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card
  .s-product-card-image a{
    display: block !important;
    width: 100% !important;
    height: auto !important;           /* خليه ياخد ارتفاع طبيعي */
    aspect-ratio: auto !important;     /* شيل أي نسبة ثابتة */
  }

  html.is-offers-page
  .s-products-list-wrapper.s-products-list-vertical-cards
  > custom-salla-product-card
  img.s-product-card-image-cover{
    width: 100% !important;
    height: auto !important;           /* الصورة تتحكم في نفسها */
    object-fit: unset !important;      /* شيل contain/cover */
    display: block !important;
  }

}
}