/* ==============================================
   MEEM ART — Complete Master Stylesheet
   ============================================== */

:root {
  --mim-brown: #2B221D;
  --mim-gold: #8c5b36;
  --mim-sand: #FAF7F2;
  --mim-accent: #b26767;
  --mim-border: #d8a8a8;

  --color-primary: #8c5b36 !important;
  --color-primary-dark: #2B221D !important;
  --color-primary-light: #FAF7F2 !important;
  --color-primary-reverse: #ffffff !important;
}

/* ==============================================
   1. خلفية المتجر بالكامل (الأوف وايت الدافئ)
   ============================================== */
body,
.site-wrapper,
main,
.s-block,
.s-block--features,
.store-features,
.s-block--banners,
.s-block--categories,
.s-block-products-slider,
.s-products-slider-wrapper,
section.s-block {
  background-color: var(--mim-sand) !important;
  color: #2b221d;
}

/* ==============================================
   2. الهيدر واللوجو وقائمة الأقسام
   ============================================== */
.s-menu-topnav-list {
  display: none !important;
}

.store-header .top-navbar {
  background: #ffffff !important;
  border-bottom: 1px solid #f0ebe4 !important;
  padding: 6px 0 !important;
}

.store-header .top-navbar .s-search-input {
  background: #f7f4ef !important;
  border-radius: 20px !important;
  border: 1px solid #e5ded6 !important;
  color: #2b221d !important;
  font-size: 13px !important;
}

.store-header .top-navbar .s-search-input::placeholder {
  color: rgba(70, 67, 78, 0.72) !important;
  opacity: 1;
}

.store-header .navbar-brand,
#mainnav .navbar-brand,
.site-header__logo {
  display: inline-flex !important;
  align-items: center !important;
}

.store-header .navbar-brand *,
#mainnav .navbar-brand *,
.site-header__logo * {
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: var(--mim-gold) !important;
}

.store-header .navbar-brand img,
#mainnav .navbar-brand img {
  max-height: 26px !important;
  width: auto !important;
}

/* ==============================================
   3. البانر الأول العريض (إلغاء الفراغ والالتصاق التام)
   ============================================== */
main,
#main-content,
.site-wrapper > main {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

body.index main > .s-block:first-of-type,
body.index main > section:first-of-type,
body.index .s-block--fixed-banner:first-of-type,
body.index .s-block--photos-slider:first-of-type {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 25px 0 !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
}

body.index .s-block--fixed-banner .container,
body.index .s-block--photos-slider .container {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  height: auto !important;
  min-height: 0 !important;
}

body.index .s-block--fixed-banner .banner,
body.index .s-block--fixed-banner .banner-entry,
body.index .s-block--fixed-banner picture,
body.index .s-block--fixed-banner .lazy__bg,
body.index .s-block--fixed-banner [class*="wrapper"] {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  aspect-ratio: auto !important;
  display: block !important;
}

body.index .s-block--fixed-banner img,
body.index .s-block--photos-slider img,
body.index main > .s-block:first-of-type img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: cover !important;
  aspect-ratio: auto !important;
  image-rendering: -webkit-optimize-contrast !important;
  transform: translateZ(0) !important;
}

body.index .s-block--photos-slider .s-slider-nav-arrow {
  display: none !important;
}

/* ==============================================
   4. باقي البنرات العادية في الصفحة
   ============================================== */
body.index main > .s-block:not(:first-of-type) [class*="banner"]:not(.s-block--banners [class*="banner"]),
body.index main > section:not(:first-of-type) [class*="banner"]:not(.s-block--banners [class*="banner"]),
.s-block-banner:not(:first-of-type) {
  max-width: 1220px !important;
  margin: 25px auto !important;
  padding: 0 10px !important;
  box-sizing: border-box !important;
}

body.index main > .s-block:not(:first-of-type) img:not(.s-product-card img):not(.s-block--banners img) {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 380px !important;
  border-radius: 12px !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 auto !important;
}

/* ==============================================
   5. أقسام المتجر (6 كروت متساوية 1x6 للكمبيوتر و 2x3 للموبايل)
   ============================================== */
@media (min-width: 1024px) {
  body.index .s-block--banners .grid,
  .s-block:has([class*="banner"]) .grid,
  .s-block-banners .grid {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 14px !important;
    max-width: 1320px !important;
    margin: 0 auto 30px auto !important;
    padding: 0 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  body.index .s-block--banners .banner-entry,
  body.index .s-block--banners .banner-entry .lazy__bg,
  .s-block-banners .banner-entry,
  .s-block:has([class*="banner"]) .grid > div {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04) !important;
    margin: 0 !important;
  }

  body.index .s-block--banners img,
  .s-block-banners img,
  .s-block:has([class*="banner"]) img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    display: block !important;
  }
}

@media (max-width: 1023px) {
  body.index .s-block--banners .grid,
  .s-block:has([class*="banner"]) .grid,
  .s-block-banners .grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    padding: 0 12px !important;
    margin: 0 auto 20px auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  body.index .s-block--banners .banner-entry,
  body.index .s-block--banners .banner-entry .lazy__bg,
  .s-block-banners .banner-entry,
  .s-block:has([class*="banner"]) .grid > div {
    width: 100% !important;
    max-width: 100% !important;
    grid-column: span 1 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    margin: 0 !important;
  }

  body.index .s-block--banners img,
  .s-block-banners img,
  .s-block:has([class*="banner"]) img {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 10px !important;
    display: block !important;
  }
}

/* ==============================================
   6. كروت وسلايدر المنتجات (إظهار كامل اللوحة بدون أي قص)
   ============================================== */
.s-products-slider-wrapper .s-slider-block__title {
  position: relative;
  justify-content: center !important;
  min-height: 44px;
  margin-bottom: 24px !important;
  text-align: center;
}

.s-products-slider-wrapper .s-slider-block__title-right {
  width: 100%;
  margin: 0 auto !important;
  text-align: center !important;
}

.s-products-slider-wrapper .s-slider-block__title h2 {
  width: 100%;
  color: var(--mim-brown) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  text-align: center !important;
}

.s-products-slider-wrapper .s-slider-block__title-left {
  display: none !important;
}

/* توحيد ارتفاع الكروت في السلايدر */
.s-products-slider-wrapper .swiper-wrapper,
.s-block-products-slider .swiper-wrapper {
  display: flex !important;
  align-items: stretch !important;
}

.s-products-slider-wrapper .swiper-slide,
.s-block-products-slider .swiper-slide {
  height: auto !important;
  display: flex !important;
}

/* هيكل الكارت */
custom-salla-product-card.s-product-card-entry,
.s-product-card-entry,
.product-entry {
  box-sizing: border-box !important;
  padding: 12px !important;
  border: 1.5px solid var(--mim-border) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  width: 100% !important;
  height: 100% !important;
}

.custom-salla-product-card.s-product-card-entry:hover,
.s-product-card-entry:hover,
.product-entry:hover {
  border-color: var(--mim-accent) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 24px rgba(178, 103, 103, 0.15) !important;
}

/* إخفاء المربع الوهمي الشفاف */
.s-product-card-entry .s-add-to-wishlist,
.s-product-card-entry .s-product-card-wishlist-btn,
.product-entry .s-add-to-wishlist,
.s-product-card-entry div[class*="wishlist"],
.s-product-card-entry a[class*="wishlist"]:empty,
.s-product-card-entry span[class*="badge"]:not([class*="sale"]):not([class*="promotion"]):empty {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* تكبير حاوية الصورة وإظهار كامل تفاصيل اللوحة */
.s-product-card-entry .s-product-card-image,
.product-entry .product-entry__image,
.s-product-card-image-wrapper {
  position: relative !important;
  width: 100% !important;
  height: 290px !important; /* ارتفاع ثابت يحفظ حجم الصورة من الانضغاط */
  min-height: 290px !important;
  max-height: 290px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background-color: #f7f4ef !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* منع قص أي جزء من اللوحة */
.s-product-card-entry .s-product-card-image img,
.product-entry img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important; /* إظهار اللوحة بالكامل بإطارها وتفاصيلها دون قص */
  border-radius: 8px !important;
  display: block !important;
  padding: 4px !important;
  box-sizing: border-box !important;
  transition: transform 0.4s ease !important;
}

.custom-salla-product-card.s-product-card-entry:hover img,
.product-entry:hover img {
  transform: scale(1.03) !important;
}

/* توزيع وضبط النصوص في الأسفل */
.s-product-card-entry .s-product-card-content,
.product-entry .product-entry__content {
  width: 100%;
  padding: 4px 0 0 !important;
  align-items: center !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  justify-content: space-between !important;
}

.s-product-card-entry .s-product-card-content-main,
.s-product-card-entry .s-product-card-content-sub,
.s-product-card-entry .s-product-card-content-title,
.s-product-card-entry .s-product-card-price,
.product-entry .product-entry__price {
  width: 100%;
  text-align: center !important;
  justify-content: center !important;
}

.s-product-card-entry .s-product-card-content-title,
.s-product-card-entry .s-product-card-content-title a,
.product-entry .product-entry__title {
  color: var(--mim-brown) !important;
  font-weight: 700 !important;
  font-size: 14.5px !important;
  line-height: 1.4 !important;
  margin: 0 0 6px 0 !important;
}

.s-product-card-entry .s-product-card-price,
.product-entry .product-entry__price {
  font-size: 14.5px !important;
  font-weight: 800 !important;
  color: #2b221d !important;
  margin: 4px auto 10px auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 4px !important;
}

.s-product-card-entry .s-product-card-content-footer {
  width: 100% !important;
  margin-top: auto !important;
}

.s-product-card-entry .s-button-primary-outline,
.s-product-card-entry .s-button-outline,
.product-entry .s-product-card-add-to-cart-btn {
  border: 1.5px solid var(--mim-accent) !important;
  border-radius: 10px !important;
  color: var(--mim-accent) !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  background: transparent !important;
  width: 100% !important;
  padding: 8px 12px !important;
}

.s-product-card-entry .s-button-primary-outline:hover,
.s-product-card-entry .s-button-outline:hover,
.product-entry .s-product-card-add-to-cart-btn:hover {
  background: var(--mim-accent) !important;
  color: #ffffff !important;
}

@media (max-width: 767px) {
  .s-product-card-entry .s-product-card-image,
  .product-entry .product-entry__image,
  .s-product-card-image-wrapper {
    height: 190px !important;
    min-height: 190px !important;
    max-height: 190px !important;
  }
}

/* ==============================================
   7. مميزات المتجر (Store features)
   ============================================== */
.store-features,
.s-block--features {
  background: #ffffff !important;
  border-radius: 12px !important;
}

.store-features .feature-item,
.s-block--features .feature-item,
.s-block--features .s-block--features__item {
  border: 1px solid #efe6dd !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

/* ==============================================
   8. آراء العملاء (Testimonials)
   ============================================== */
.s-block:has(.s-reviews-testimonial),
.s-block--custom-testimonials {
  max-width: 1240px !important;
  margin: 40px auto !important;
  padding: 0 15px !important;
}

.s-reviews-testimonial,
.s-block--custom-testimonials .s-reviews-testimonial {
  min-height: 190px !important;
  padding: 24px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1.5px solid #efe6dd !important;
  color: #111111 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
}

/* ==============================================
   9. فوتر ميم آرت (كيرف + كانفاس + سنتر كامل للموبايل)
   ============================================== */
.store-footer {
  background-color: #241b16 !important;
  background-image: 
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255, 255, 255, 0.015) 50%, transparent 50%),
    linear-gradient(90deg, rgba(255, 255, 255, 0.015) 50%, transparent 50%),
    linear-gradient(145deg, #1d1511 0%, #2b221d 50%, #3a2b22 100%) !important;
  background-size: 8px 8px, 4px 4px, 4px 4px, 100% 100% !important;
  border-top-left-radius: 36px !important;
  border-top-right-radius: 36px !important;
  overflow: hidden !important;
  margin-top: 40px !important;
}

.store-footer__inner {
  padding-top: 50px !important;
  padding-bottom: 30px !important;
  background: transparent !important;
  color: #ffffff !important;
  border: none !important;
}

.store-footer__inner h3 {
  color: #FAF7F2 !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin-bottom: 15px !important;
}

.store-footer__inner p,
.store-footer__inner a,
.store-footer__inner li,
.store-footer__inner span,
.store-footer__inner b,
.store-footer__inner .s-menu-footer-list a {
  color: #d8cfc4 !important;
  justify-content: center;
  display: flex;
  font-size: 13.5px;
}

/* أيقونات السوشيال ميديا وسنترتها الدقيقة */
.contact-social .s-social-list {
  justify-content: center !important;
  display: flex !important;
  gap: 12px !important;
  margin-top: 15px !important;
}

.store-footer__inner .s-social-link a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  border: 1.5px solid rgba(255, 255, 255, 0.4) !important;
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05) !important;
  margin: 0 !important;
}

.store-footer__inner .s-social-link svg {
  fill: #ffffff !important;
  width: 18px !important;
  height: 18px !important;
  margin: auto !important;
  display: block !important;
}

/* السجل التجاري */
.commercial-img,
.store-footer__inner .s-trust-badges-image img {
  width: 70px !important;
  height: auto !important;
  display: block !important;
  margin: 10px auto !important;
}

.store-footer__inner .s-trust-badges-label,
.store-footer__inner .s-trust-badges-number {
  color: #ffffff !important;
  text-align: center !important;
}

/* شريط الحقوق وطرق الدفع السفلي */
footer.store-footer > .md\:flex.container {
  width: 100% !important;
  max-width: none !important;
  min-height: 80px;
  margin: 0 !important;
  padding: 16px 20px !important;
  background: #17110e !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

footer.store-footer > .md\:flex.container .copyright-text,
footer.store-footer > .md\:flex.container .copyright-text * {
  color: #a89f97 !important;
  font-size: 12.5px !important;
}

/* ==============================================
   10. التجاوب الشامل (Mobile Responsive)
   ============================================== */
@media (max-width: 1023px) {
  .container {
    max-width: 100% !important;
    padding-inline: 16px !important;
  }

  custom-salla-product-card.s-product-card-entry,
  .s-product-card-entry {
    padding: 10px !important;
  }

  .store-footer__inner {
    padding-top: 35px !important;
    padding-bottom: 35px !important;
    text-align: center !important;
  }

  footer.store-footer > .md\:flex.container {
    flex-direction: column !important;
    gap: 15px !important;
    text-align: center !important;
  }
}