/* =====================================================
   Nabtah Gardens - Final Clean CSS for Salla Cilia Theme
   نسخة نهائية محسنة لثيم سيليا
===================================================== */

:root {
  --nabtah-bg: #FAF8F1;
  --nabtah-bg-soft: #F4F8F1;
  --nabtah-header: #EAF1DD;
  --nabtah-header-light: #F4F8F1;
  --nabtah-green: #2F6B3A;
  --nabtah-green-dark: #173B24;
  --nabtah-text: #1F3524;
  --nabtah-muted: #66735F;
  --nabtah-gold: #C8A96A;
  --nabtah-gold-soft: #E8D9B8;
  --nabtah-border: #DDE8D6;
  --nabtah-card-border: #E6DEC9;
  --nabtah-white: #FFFFFF;
}

/* =====================================================
   1. General Background & Text
===================================================== */

body,
.store-home,
.main-content,
.page-wrapper,
main {
  background-color: var(--nabtah-bg) !important;
  color: var(--nabtah-text) !important;
}

h1, h2, h3, h4, h5, h6,
.section-title,
.s-block__title,
.title,
.heading {
  color: var(--nabtah-green-dark) !important;
}

/* =====================================================
   Fix Footer Contact Buttons - WhatsApp Background
   إصلاح خلفية زر الواتساب في الفوتر
===================================================== */

/* أزرار التواصل داخل الفوتر */
footer a[href*="wa.me"],
footer a[href*="whatsapp"],
footer a[href*="tel:"],
footer a[href*="mailto:"],
.s-footer a[href*="wa.me"],
.s-footer a[href*="whatsapp"],
.s-footer a[href*="tel:"],
.s-footer a[href*="mailto:"],
.store-footer a[href*="wa.me"],
.store-footer a[href*="whatsapp"],
.store-footer a[href*="tel:"],
.store-footer a[href*="mailto:"] {
  background-color: #F7FAF2 !important;
  color: #2F6B3A !important;
  border: 1px solid #D8E4C8 !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  box-shadow: none !important;
}

/* أيقونات أزرار التواصل */
footer a[href*="wa.me"] i,
footer a[href*="whatsapp"] i,
footer a[href*="tel:"] i,
footer a[href*="mailto:"] i,
.s-footer a[href*="wa.me"] i,
.s-footer a[href*="whatsapp"] i,
.s-footer a[href*="tel:"] i,
.s-footer a[href*="mailto:"] i {
  color: #2F6B3A !important;
}

/* عند المرور */
footer a[href*="wa.me"]:hover,
footer a[href*="whatsapp"]:hover,
footer a[href*="tel:"]:hover,
footer a[href*="mailto:"]:hover,
.s-footer a[href*="wa.me"]:hover,
.s-footer a[href*="whatsapp"]:hover,
.s-footer a[href*="tel:"]:hover,
.s-footer a[href*="mailto:"]:hover {
  background-color: #EAF1DD !important;
  color: #173B24 !important;
}

p,
.description,
.text-gray-500,
.text-gray-600,
.text-gray-700 {
  color: var(--nabtah-muted) !important;
}

/* =====================================================
   2. Header & Main Navigation - Soft Green
===================================================== */

/* Top bar + main header + menu area */
header,
.site-header,
.store-header,
.main-header,
.header,
.header-wrapper,
.header-top,
.top-header,
.top-navbar,
.header-middle,
.header-bottom,
.navbar,
.main-nav,
.nav-wrapper,
.store-navigation {
  background-color: var(--nabtah-header) !important;
  color: var(--nabtah-text) !important;
  border-color: var(--nabtah-border) !important;
}

/* Remove inner white/green boxes inside header */
header .container,
.site-header .container,
.store-header .container,
.main-header .container,
.header .container,
.header-wrapper .container,
.header-top .container,
.header-middle .container,
.header-bottom .container,
.navbar .container,
.main-nav .container,
.nav-wrapper .container {
  background-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  border: none !important;
}

/* Navigation lists */
header nav,
header ul,
header li,
.navbar ul,
.main-nav ul,
.main-menu,
.header-nav,
.nav-menu,
.nav-desktop {
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Header links */
header a,
.site-header a,
.store-header a,
.main-header a,
.navbar a,
.main-nav a,
.main-menu a,
.header-nav a,
.nav-menu a,
.nav-desktop a,
header span {
  color: #2E5A33 !important;
  font-weight: 600 !important;
}

/* Header links hover */
header a:hover,
.site-header a:hover,
.store-header a:hover,
.main-header a:hover,
.navbar a:hover,
.main-nav a:hover,
.main-menu a:hover,
.header-nav a:hover {
  color: var(--nabtah-green-dark) !important;
  background-color: transparent !important;
}

/* Header icons */
header i,
header svg,
.site-header i,
.site-header svg,
.store-header i,
.store-header svg,
.sicon-shopping-bag,
.sicon-user,
.sicon-search,
.sicon-menu,
.sicon-heart {
  color: var(--nabtah-green) !important;
  fill: var(--nabtah-green) !important;
}

/* Header buttons/icons must NOT have dark backgrounds */
header button,
.site-header button,
.store-header button,
.main-header button,
.header-btn,
.s-search-trigger,
.s-cart-summary,
.s-user-menu-trigger,
header .btn,
header .button {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--nabtah-green) !important;
  border: none !important;
  box-shadow: none !important;
}

/* Header button hover */
header button:hover,
.site-header button:hover,
.store-header button:hover,
.header-btn:hover,
.s-search-trigger:hover,
.s-cart-summary:hover,
.s-user-menu-trigger:hover {
  background-color: rgba(47, 107, 58, 0.08) !important;
  color: var(--nabtah-green-dark) !important;
  border-radius: 12px !important;
}

/* Dropdown menus */
header .dropdown-menu,
header .sub-menu,
header .menu-dropdown,
header [class*="dropdown"],
header [class*="submenu"] {
  background-color: #F7FAF2 !important;
  border: 1px solid var(--nabtah-border) !important;
  box-shadow: 0 10px 25px rgba(47, 107, 58, 0.10) !important;
  border-radius: 12px !important;
}

/* Dropdown links */
header .dropdown-menu a,
header .sub-menu a,
header .menu-dropdown a,
header [class*="dropdown"] a,
header [class*="submenu"] a {
  color: #244A2B !important;
  background-color: transparent !important;
}

/* =====================================================
   3. Buttons
===================================================== */

/* Main buttons, but exclude header buttons */
main button,
main .btn,
main .button,
main .s-button-primary,
main .s-button-btn,
main a.btn,
main .add-to-cart,
main .product-card__addToCart,
main .s-product-card-vertical__add-button,
.s-button-primary,
.add-to-cart {
  background-color: var(--nabtah-green) !important;
  color: var(--nabtah-white) !important;
  border-color: var(--nabtah-green) !important;
  border-radius: 12px !important;
}

/* Button hover */
main button:hover,
main .btn:hover,
main .button:hover,
main .s-button-primary:hover,
main .s-button-btn:hover,
main a.btn:hover,
main .add-to-cart:hover,
main .product-card__addToCart:hover,
main .s-product-card-vertical__add-button:hover {
  background-color: var(--nabtah-green-dark) !important;
  border-color: var(--nabtah-green-dark) !important;
  color: var(--nabtah-white) !important;
}

/* Secondary buttons */
main .s-button-secondary,
main .btn-secondary,
main .button-secondary {
  background-color: var(--nabtah-gold-soft) !important;
  color: var(--nabtah-green-dark) !important;
  border-color: var(--nabtah-gold) !important;
}

/* =====================================================
   4. Product & Category Cards
===================================================== */

.product-card,
.s-product-card,
.s-product-card-entry,
.s-product-card-content,
.card,
.category-card,
.s-category-card {
  background-color: var(--nabtah-white) !important;
  border: 1px solid var(--nabtah-card-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 24px rgba(47, 107, 58, 0.07) !important;
  overflow: hidden !important;
}

.product-card:hover,
.s-product-card:hover,
.s-product-card-entry:hover,
.card:hover,
.category-card:hover,
.s-category-card:hover {
  box-shadow: 0 12px 30px rgba(47, 107, 58, 0.13) !important;
  transform: translateY(-2px);
  transition: all 0.25s ease;
}

.product-card__title,
.s-product-card-content-title,
.s-product-card__title,
.product-title,
.s-category-card h3,
.category-card h3,
.category-item h3 {
  color: var(--nabtah-green-dark) !important;
  font-weight: 700 !important;
}

.price,
.product-price,
.s-product-card-price,
.s-product-card-sale-price {
  color: var(--nabtah-green) !important;
  font-weight: 800 !important;
}

.regular-price,
.old-price,
.s-product-card-regular-price {
  color: #9A9A9A !important;
}

/* =====================================================
   5. Sections & Banners
===================================================== */

/* Keep sections clean, no random green frames */
.s-block,
.home-section,
section {
  background-color: transparent !important;
  margin-bottom: 26px !important;
  box-shadow: none !important;
}

/* Banners clean with soft spacing */
.banner,
.s-block--banner,
.s-block--banners,
.main-banner,
.hero-banner,
.slider,
.s-slider-block,
.salla-slider,
.s-block--photos-slider {
  background: transparent !important;
  margin-bottom: 30px !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Banner images */
.banner img,
.s-block--banner img,
.s-block--banners img,
.main-banner img,
.hero-banner img,
.slider img,
.s-slider-block img,
.salla-slider img,
.s-block--photos-slider img {
  border-radius: 18px !important;
}

/* Small elegant divider after major sections */
.s-block::after,
.home-section::after {
  content: "";
  display: block;
  width: 70px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--nabtah-gold), transparent);
  margin: 22px auto 0;
  opacity: 0.55;
}

/* Do not show divider inside cards */
.s-product-card::after,
.product-card::after,
.card::after,
.s-category-card::after,
.category-card::after {
  display: none !important;
}

/* =====================================================
   6. Inputs & Search
===================================================== */

input,
textarea,
select,
.s-search-input,
.search-input {
  background-color: var(--nabtah-white) !important;
  color: var(--nabtah-text) !important;
  border: 1px solid var(--nabtah-card-border) !important;
  border-radius: 12px !important;
}

input:focus,
textarea:focus,
select:focus,
.s-search-input:focus,
.search-input:focus {
  border-color: var(--nabtah-green) !important;
  box-shadow: 0 0 0 3px rgba(47, 107, 58, 0.12) !important;
}

/* =====================================================
   7. Badges
===================================================== */

.badge,
.tag,
.s-badge,
.discount-badge,
.sale-badge {
  background-color: var(--nabtah-gold) !important;
  color: var(--nabtah-green-dark) !important;
  border-radius: 20px !important;
}

/* =====================================================
   8. Footer - Soft Premium
===================================================== */

footer,
.site-footer,
.store-footer,
.footer {
  background-color: #E8F1E3 !important;
  color: var(--nabtah-text) !important;
  border-top: 1px solid var(--nabtah-border) !important;
}

footer p,
footer span,
footer a,
.site-footer p,
.site-footer span,
.site-footer a,
.store-footer p,
.store-footer span,
.store-footer a {
  color: var(--nabtah-text) !important;
}

footer a:hover,
.site-footer a:hover,
.store-footer a:hover {
  color: var(--nabtah-green) !important;
}

.footer-bottom,
.copyright,
.store-footer__inner {
  background-color: #DDE8D6 !important;
  color: var(--nabtah-text) !important;
}

/* =====================================================
   9. WhatsApp Button
===================================================== */

.whatsapp,
.whatsapp-button,
a[href*="wa.me"],
a[href*="whatsapp"] {
  background-color: #25D366 !important;
  color: var(--nabtah-white) !important;
  border-radius: 50px !important;
}

/* =====================================================
   10. Mobile Optimization
===================================================== */

@media (max-width: 768px) {
  .s-block,
  .home-section,
  section {
    margin-bottom: 20px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .banner,
  .s-block--banner,
  .s-block--banners,
  .main-banner,
  .hero-banner,
  .slider,
  .s-slider-block,
  .salla-slider,
  .s-block--photos-slider {
    margin-bottom: 22px !important;
  }

  .banner img,
  .s-block--banner img,
  .s-block--banners img,
  .main-banner img,
  .hero-banner img,
  .slider img,
  .s-slider-block img,
  .salla-slider img,
  .s-block--photos-slider img {
    border-radius: 14px !important;
  }

  h1,
  .section-title,
  .s-block__title {
    font-size: 24px !important;
  }

  h2 {
    font-size: 22px !important;
  }

  .product-card,
  .s-product-card,
  .s-product-card-entry,
  .s-category-card,
  .category-card {
    border-radius: 16px !important;
  }
}
/* =====================================================
   Final Override - Cilia Strong Green Header Fix
   تخفيف الشريط الأخضر القوي في ثيم سيليا
===================================================== */

/* استهداف الشريط الأخضر الرئيسي بكل طبقاته */
header,
header > div,
header .container,
header .inner,
header .wrapper,
.site-header,
.store-header,
.main-header,
.header,
.header-wrapper,
.header-middle,
.header-bottom,
.main-nav,
.navbar,
.nav-wrapper,
.store-navigation,
.s-header,
.s-header *,
[class*="header"],
[class*="navbar"],
[class*="navigation"] {
  background-color: #EAF1DD !important;
  background-image: none !important;
}

/* منع ظهور الأخضر القديم داخل القائمة */
header nav,
header nav *,
header ul,
header li,
header .main-menu,
header .menu,
header .nav,
header .navbar,
header .store-navigation,
header .nav-wrapper {
  background-color: transparent !important;
  background-image: none !important;
}

/* روابط القائمة */
header a,
header span,
header li,
header nav a,
header .main-menu a,
header .menu a,
header .nav a {
  color: #2E5A33 !important;
  font-weight: 600 !important;
}

/* Hover */
header a:hover,
header nav a:hover,
header .main-menu a:hover {
  color: #173B24 !important;
  background-color: transparent !important;
}

/* أيقونات الهيدر */
header i,
header svg,
header button,
header .sicon-shopping-bag,
header .sicon-user,
header .sicon-search,
header .sicon-menu {
  color: #2F6B3A !important;
  fill: #2F6B3A !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* أزرار الهيدر */
header button:hover,
header .header-btn:hover,
header .s-cart-summary:hover,
header .s-search-trigger:hover,
header .s-user-menu-trigger:hover {
  background-color: rgba(47, 107, 58, 0.08) !important;
  border-radius: 12px !important;
}

/* القوائم المنسدلة */
header .dropdown-menu,
header .sub-menu,
header .menu-dropdown,
header [class*="dropdown"],
header [class*="submenu"] {
  background-color: #F7FAF2 !important;
  border: 1px solid #D8E4C8 !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 25px rgba(47, 107, 58, 0.10) !important;
}
/* =====================================================
   Final Footer Override - Nabtah Gardens
   تخفيف لون الفوتر في ثيم سيليا
===================================================== */

/* كامل منطقة الفوتر */
footer,
footer *,
.site-footer,
.site-footer *,
.store-footer,
.store-footer *,
.footer,
.footer *,
.s-footer,
.s-footer *,
[class*="footer"] {
  background-color: #EAF1DD !important;
  background-image: none !important;
}

/* الشريط السفلي داخل الفوتر */
.footer-bottom,
.footer-bottom *,
.copyright,
.copyright *,
.store-footer__inner,
.store-footer__inner *,
.s-footer__bottom,
.s-footer__bottom *,
.s-footer__copyright,
.s-footer__copyright * {
  background-color: #F4F8F1 !important;
  background-image: none !important;
}

/* نصوص وروابط الفوتر */
footer,
footer p,
footer span,
footer a,
footer li,
.site-footer p,
.site-footer span,
.site-footer a,
.store-footer p,
.store-footer span,
.store-footer a,
.s-footer p,
.s-footer span,
.s-footer a {
  color: #1F3524 !important;
}

/* عناوين الفوتر */
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6,
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6,
.store-footer h1,
.store-footer h2,
.store-footer h3,
.store-footer h4,
.store-footer h5,
.store-footer h6,
.s-footer h1,
.s-footer h2,
.s-footer h3,
.s-footer h4,
.s-footer h5,
.s-footer h6 {
  color: #173B24 !important;
}

/* روابط الفوتر عند المرور */
footer a:hover,
.site-footer a:hover,
.store-footer a:hover,
.s-footer a:hover {
  color: #2F6B3A !important;
}

/* أيقونات التواصل والدفع */
footer i,
footer svg,
.site-footer i,
.site-footer svg,
.store-footer i,
.store-footer svg,
.s-footer i,
.s-footer svg {
  color: #2F6B3A !important;
  fill: #2F6B3A !important;
}

/* الدوائر حول الأيقونات */
footer .sicon,
footer .social-icon,
footer a[class*="social"],
footer a[class*="whatsapp"],
.s-footer .sicon,
.s-footer a[class*="social"] {
  background-color: #F7FAF2 !important;
  color: #2F6B3A !important;
  border: 1px solid #D8E4C8 !important;
}

/* إزالة الأخضر القديم من أي بلوك داخل الفوتر */
footer .container,
footer .row,
footer .wrapper,
footer .inner,
.site-footer .container,
.store-footer .container,
.s-footer .container {
  background-color: transparent !important;
}
/* =====================================================
   Footer Wave & Contrast Fix - Nabtah Gardens
   تنعيم شكل الفوتر والموجة العلوية
===================================================== */

/* منطقة الفوتر كاملة */
footer,
.site-footer,
.store-footer,
.s-footer,
.footer,
[class*="footer"] {
  background-color: #F4F8F1 !important;
  background-image: none !important;
  color: #1F3524 !important;
}

/* إزالة/تخفيف الموجة الخضراء الغامقة أعلى الفوتر */
footer::before,
.site-footer::before,
.store-footer::before,
.s-footer::before,
.footer::before,
footer .footer-top,
.site-footer .footer-top,
.store-footer .footer-top,
.s-footer .footer-top,
footer [class*="wave"],
.s-footer [class*="wave"],
.store-footer [class*="wave"] {
  background-color: #EAF1DD !important;
  background-image: none !important;
  color: #1F3524 !important;
}

/* أي SVG أو شكل موجة داخل الفوتر */
footer svg,
.site-footer svg,
.store-footer svg,
.s-footer svg {
  fill: #EAF1DD !important;
  color: #EAF1DD !important;
}

/* المنطقة العليا من الفوتر */
footer > div:first-child,
.site-footer > div:first-child,
.store-footer > div:first-child,
.s-footer > div:first-child {
  background-color: #F4F8F1 !important;
  background-image: none !important;
}

/* صندوق/محتوى الفوتر */
footer .container,
.site-footer .container,
.store-footer .container,
.s-footer .container {
  background-color: transparent !important;
}

/* عناوين الفوتر */
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6,
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6,
.store-footer h1,
.store-footer h2,
.store-footer h3,
.store-footer h4,
.store-footer h5,
.store-footer h6,
.s-footer h1,
.s-footer h2,
.s-footer h3,
.s-footer h4,
.s-footer h5,
.s-footer h6 {
  color: #173B24 !important;
}

/* نصوص وروابط الفوتر */
footer p,
footer span,
footer a,
footer li,
.site-footer p,
.site-footer span,
.site-footer a,
.store-footer p,
.store-footer span,
.store-footer a,
.s-footer p,
.s-footer span,
.s-footer a {
  color: #1F3524 !important;
}

/* روابط عند المرور */
footer a:hover,
.site-footer a:hover,
.store-footer a:hover,
.s-footer a:hover {
  color: #2F6B3A !important;
}

/* شريط التواصل السفلي */
.footer-bottom,
.copyright,
.store-footer__inner,
.s-footer__bottom,
.s-footer__copyright,
footer [class*="bottom"] {
  background-color: #EAF1DD !important;
  color: #1F3524 !important;
  border-top: 1px solid #D8E4C8 !important;
}

/* إزالة الفراغ الأبيض القوي قبل الفوتر إن وجد */
footer {
  margin-top: 0 !important;
  padding-top: 40px !important;
}
[data-selia^="home-images-grid-title-"] {
  color: #fff !important;
  background: rgba(7, 33, 18, 0.78) !important;
  top: auto !important;
  bottom: 14px !important;
  left: 14px !important;
  right: 14px !important;
  width: auto !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  text-align: center !important;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.65) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  z-index: 5 !important;
}

@media (min-width: 768px) {
  [data-selia^="home-images-grid-title-"] {
    font-size: 18px !important;
  }
}

@media (max-width: 767px) {
  [data-selia^="home-images-grid-title-"] {
    font-size: 14px !important;
    left: 8px !important;
    right: 8px !important;
    bottom: 8px !important;
    padding: 8px !important;
  }
}
/* Selia product card action buttons */
.product-entry .product-entry__actions a,
.product-entry .product-entry__actions button,
.product-entry .s-product-card-actions a,
.product-entry .s-product-card-actions button,
.s-product-card-entry .s-product-card-actions a,
.s-product-card-entry .s-product-card-actions button {
  background: #B7F34A !important;
  border-color: #B7F34A !important;
  color: #12351F !important;
}

/* Hover */
.product-entry .product-entry__actions a:hover,
.product-entry .product-entry__actions button:hover,
.product-entry .s-product-card-actions a:hover,
.product-entry .s-product-card-actions button:hover,
.s-product-card-entry .s-product-card-actions a:hover,
.s-product-card-entry .s-product-card-actions button:hover {
  background: #A8E93B !important;
  border-color: #A8E93B !important;
  color: #12351F !important;
}
/* Round product images */
.product-entry img,
.s-product-card-entry img,
.product-entry__image img,
.s-product-card-image img {
    border-radius: 18px !important;
    overflow: hidden !important;
}

/* Make sure image wrappers clip correctly */
.product-entry__image,
.s-product-card-image,
.product-entry .product-image,
.s-product-card-entry .product-image {
    border-radius: 18px !important;
    overflow: hidden !important;
}
/* =========================================
   NABTAH GARDENS – IMAGE CORNERS
   ========================================= */

/* Main banners / large promotional images */
.banner img,
.banner-entry img,
.s-block--banners img,
.s-block--photos-slider img,
.swiper-slide img {
    border-radius: 24px !important;
}

/* Product cards */
.product-entry img,
.product-card img,
.s-product-card-image img,
.s-product-card-image {
    border-radius: 18px !important;
}

/* Keep rounded images clipped cleanly */
.banner,
.banner-entry,
.product-card,
.s-product-card-image {
    overflow: hidden;
}
/* ضبط حجم الفيديو على الكمبيوتر */
@media (min-width: 1024px) {
  video:not(:fullscreen) {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 75vh !important;
    object-fit: contain !important;
    margin-inline: auto !important;
  }
}
/* أزرار المنتجات: أخضر زيتي وكتابة بيضاء */
.product-entry .product-entry__actions a,
.product-entry .product-entry__actions button,
.product-entry .s-product-card-actions a,
.product-entry .s-product-card-actions button,
.s-product-card-entry .s-product-card-actions a,
.s-product-card-entry .s-product-card-actions button {
  background: #596B35 !important;
  border-color: #596B35 !important;
  color: #FFFFFF !important;
}

.product-entry .product-entry__actions a:hover,
.product-entry .product-entry__actions button:hover,
.product-entry .s-product-card-actions a:hover,
.product-entry .s-product-card-actions button:hover,
.s-product-card-entry .s-product-card-actions a:hover,
.s-product-card-entry .s-product-card-actions button:hover {
  background: #46552A !important;
  border-color: #46552A !important;
  color: #FFFFFF !important;
}
/* زر إضافة للسلة داخل بطاقات المنتجات */
.product-entry salla-add-product-button button:not(:disabled),
.s-product-card-entry salla-add-product-button button:not(:disabled) {
  background: #596B35 !important;
  border-color: #596B35 !important;
  color: #FFFFFF !important;
  opacity: 1 !important;
}

.product-entry salla-add-product-button button:not(:disabled):hover,
.s-product-card-entry salla-add-product-button button:not(:disabled):hover {
  background: #46552A !important;
  border-color: #46552A !important;
}
/* الحفاظ على تناسب الشعار الشفاف */
header img[src*="Nabtah-Online-Transparent"],
header .navbar-brand img,
header .logo img,
header img[alt*="نبتة"] {
  object-fit: contain !important;
  height: auto !important;
  max-height: 110px !important;
  width: auto !important;
  max-width: 100% !important;
}

/* Shop by your needs: 2 columns on mobile, 4 on desktop.
   Scoped to the existing eight-category homepage section. */
[component-id="1198927394"] .square-links__grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

[component-id="1198927394"] .square-links__item {
  min-width: 0;
}

@media (min-width: 1024px) {
  [component-id="1198927394"] .square-links__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* Product picks: larger clear images, four desktop cards. */
[component-id="683598272"] .s-products-list-wrapper {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
}
[component-id="683598272"] .product-card {
  min-width: 0 !important;
  width: 100% !important;
}
[component-id="683598272"] .product-card__image {
  height: 230px !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
}
[component-id="683598272"] .product-card__image > a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
[component-id="683598272"] .product-card__image img.main-image {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
  opacity: 1 !important;
}
[component-id="683598272"] .product-card__out-label {
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  background: #fff !important;
  color: #704636 !important;
  border: 1px solid #decfc6 !important;
  border-radius: 8px !important;
  padding: 5px 9px !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  width: auto !important;
  height: auto !important;
  z-index: 2 !important;
}
@media (min-width: 1024px) {
  [component-id="683598272"] .s-products-list-wrapper {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  [component-id="683598272"] .product-card__image {
    height: clamp(280px, 24vw, 380px) !important;
  }
}
@media (max-width: 480px) {
  [component-id="683598272"] .s-products-list-wrapper {
    gap: 12px !important;
  }
  [component-id="683598272"] .product-card__image {
    height: 200px !important;
  }
}

/* NABTAH brand section: larger images, preserve three-column layout. */
[component-id="929913570"] .product-card__image {
  height: clamp(320px, 30vw, 420px) !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
}
[component-id="929913570"] .product-card__image > a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}
[component-id="929913570"] .product-card__image img.main-image {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center !important;
}
@media (max-width: 767px) {
  [component-id="929913570"] .product-card__image {
    height: 230px !important;
  }
}