/* YELLOW SHOP | RAED | Unified identity — final clean
   استبدل CSS المخصص السابق بالكامل بهذا الملف. لا تضفه أسفل الأكواد السابقة.
   مبني على ملف الثيم المرسل؛ يحتاج معاينة داخل سلة للتحقق من مطابقة العناصر.
   اختر Tajawal من إعدادات الثيم. أسماء الخطوط هنا لا تقوم بتنزيلها.
   CSS ينسق العناصر الموجودة ولا ينشئ أقسامًا أو يغير صور المنتجات.
*/

/* 01 — Brand */
:root {
  --ys-yellow: #FEED06;
  --ys-ink: #171717;
  --ys-paper: #F7F7F5;
  --ys-white: #FFFFFF;
  --ys-muted: #707070;
  --ys-line: #EAEAEA;
  --ys-radius: 14px;
  --ys-font: "Tajawal", "Inter", system-ui, sans-serif;
  --ys-shadow: 0 4px 18px rgb(23 23 23 / 5%);
}
body {
  background: var(--ys-white);
  color: var(--ys-ink);
  font-family: var(--ys-font) !important;
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--ys-yellow); color: var(--ys-ink); }
/* Do not override the theme's container widths or menu positioning. */
.store-header :is(a, button),
.s-product-card-entry :is(a, button),
.store-footer a {
  transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}
:is(.store-header, .s-product-card-entry, .store-footer) :is(a, button):focus-visible {
  outline: 2px solid var(--ys-ink) !important;
  outline-offset: 3px;
}
.store-footer :is(a, button):focus-visible { outline-color: var(--ys-yellow) !important; }

/* 02 — Header and navigation */
.store-header, .main-header, .main-nav-container,
.main-nav-container.fixed-header {
  background: var(--ys-yellow) !important;
  color: var(--ys-ink);
}
.main-nav-container {
  border-bottom: 1px solid var(--ys-line);
  box-shadow: 0 2px 12px rgb(23 23 23 / 3%);
}
.navbar-brand img { object-fit: contain; }
.main-menu > li > a {
  color: var(--ys-ink);
  font-weight: 700;
  text-underline-offset: 7px;
  text-decoration-thickness: 2px;
}
.main-menu > li > a:hover {
  color: var(--ys-ink);
  text-decoration-line: underline;
  text-decoration-color: var(--ys-yellow);
}
.top-navbar, .top-nav, .announcement-bar {
  background: var(--ys-ink) !important;
  color: var(--ys-white) !important;
}
.top-navbar a, .top-nav a, .announcement-bar a {
  color: var(--ys-yellow) !important;
}
.announcement-bar { font-size: 13px; line-height: 1.7; }

/* 03 — Search and text fields: preserve checkboxes and radios */
salla-search input, input[type="search"], .search-input {
  background: var(--ys-paper) !important;
  color: var(--ys-ink) !important;
  border: 1px solid var(--ys-line) !important;
  border-radius: 12px !important;
  min-height: 44px;
  box-shadow: none;
}
input:is([type="text"], [type="email"], [type="tel"], [type="password"], [type="number"]),
textarea, select, .s-form-control {
  border: 1px solid var(--ys-line);
  border-radius: 10px;
  color: var(--ys-ink);
}
input:is([type="text"], [type="email"], [type="tel"], [type="password"], [type="number"], [type="search"]):focus,
textarea:focus, select:focus, .s-form-control:focus {
  border-color: var(--ys-ink) !important;
  outline: 2px solid var(--ys-yellow);
  outline-offset: 2px;
}

/* 04 — Primary buttons; do not recolor payment-provider buttons */
.btn--primary, .btn-primary, .s-button-primary,
salla-button[color="primary"]::part(button) {
  background: var(--ys-yellow) !important;
  color: var(--ys-ink) !important;
  border: 1px solid var(--ys-yellow) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  transition: background-color .2s ease, color .2s ease;
}
.s-button-btn:focus-visible {
  outline: 2px solid var(--ys-ink) !important;
  outline-offset: 3px;
}

/* 05 — Section titles and existing banners */
.section-title, .section-header h2, .s-block__title h2,
.s-slider-block__title h2 {
  color: var(--ys-ink) !important;
  font-weight: 800 !important;
  line-height: 1.5;
}
.section-title::after, .s-block__title h2::after,
.s-slider-block__title h2::after {
  content: "";
  display: block;
  width: 32px;
  height: 3px;
  margin-block-start: 7px;
  background: var(--ys-yellow);
  border-radius: 3px;
}
.banner-entry, .main-slider {
  border-radius: var(--ys-radius);
  overflow: hidden;
}
/* Full-image banners only; leave slider aspect ratios to theme settings. */
.banner-entry img { display: block; width: 100%; height: auto; }
.swiper-pagination-bullet {
  background: #C8C8C8 !important;
  opacity: 1 !important;
}
.swiper-pagination-bullet-active { background: var(--ys-yellow) !important; }
.swiper-button-next, .swiper-button-prev,
.s-slider-block__title-nav-right, .s-slider-block__title-nav-left {
  width: 36px !important;
  height: 36px !important;
  background: var(--ys-white) !important;
  color: var(--ys-ink) !important;
  border: 1px solid var(--ys-line) !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

/* 06 — Categories */
.category-entry, .category-card,
.s-block--categories .swiper-slide > a {
  background: var(--ys-paper);
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--ys-ink);
  box-shadow: none;
  transition: border-color .2s ease;
}
.category-entry img, .category-card img { object-fit: contain; }
.category-entry :is(h3, h4), .category-card :is(h3, h4) {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
}

/* 07 — Product cards: no forced column layout on horizontal cards */
.s-product-card-entry {
  background: var(--ys-white) !important;
  border: 1px solid var(--ys-line) !important;
  border-radius: var(--ys-radius) !important;
  overflow: hidden;
  box-shadow: none !important;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.s-product-card-entry.s-product-card-vertical {
  display: flex;
  flex-direction: column;
  height: auto !important;
  min-height: 0 !important;
  align-self: start;
}
.s-product-card-vertical .s-product-card-image {
  position: relative;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1;
  flex: none !important;
  padding: 0 !important;
  background: var(--ys-paper) !important;
  overflow: hidden;
}
.s-product-card-vertical .s-product-card-image img {
  display: block;
  box-sizing: border-box;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  padding: 6px !important;
  /* White margins embedded in source images require image editing. */
}
.s-product-card-vertical .s-product-card-content {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 14px !important;
}
.s-product-card-content-title { margin: 0 !important; }
.s-product-card-content-title a {
  color: var(--ys-ink) !important;
  font-family: var(--ys-font);
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;
  min-height: 0 !important;
  overflow-wrap: anywhere;
}
.s-product-card-vertical .s-product-card-content-title a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.s-product-card-content-sub { margin: 0 !important; padding: 0 !important; }
.s-product-card-price {
  color: var(--ys-ink) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}
/* Keep the current sale price dark; mute only the struck-out old price. */
.s-product-card-entry :is(del, s), .s-product-card-entry .price-before {
  color: var(--ys-muted) !important;
  font-size: 12px;
  font-weight: 400;
}
.s-product-card-vertical .s-product-card-content-footer {
  margin-top: 4px !important;
  padding-top: 0 !important;
}
.s-product-card-content-footer salla-add-product-button { display: block; width: 100%; }
.s-product-card-content-footer salla-add-product-button .s-button-btn,
.s-product-card-content-footer salla-add-product-button salla-button::part(button) {
  box-sizing: border-box;
  width: 100% !important;
  min-height: 44px !important;
  background: var(--ys-yellow) !important;
  color: var(--ys-ink) !important;
  border: 1px solid var(--ys-yellow) !important;
  border-radius: 10px !important;
  font-family: var(--ys-font);
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.s-product-card-promotion-title {
  background: var(--ys-yellow) !important;
  color: var(--ys-ink) !important;
  border-radius: 7px !important;
  padding: 4px 8px;
  font-size: 11px !important;
  font-weight: 700 !important;
}
/* No generic icon selector: do not recolor a selected favorite state. */
.s-product-card-wishlist-btn {
  border-radius: 50% !important;
  background: rgb(255 255 255 / 95%) !important;
  border: 1px solid var(--ys-line) !important;
}
.s-products-slider-wrapper .swiper-slide,
.s-block--products-slider .swiper-slide { height: auto !important; }
.s-block--products-slider .swiper { padding-block: 4px 16px; }

/* 08 — Product details, cart and supporting sections */
.product-single, .product-details, .product-main { color: var(--ys-ink); }
.product-single .price, .product-details .price { color: var(--ys-ink); font-weight: 800; }
.cart-item, .cart-product {
  border: 1px solid var(--ys-line);
  border-radius: 12px;
  background: var(--ys-white);
}
.breadcrumbs, .breadcrumb { color: var(--ys-muted); }
.pagination a, .pagination button { border-radius: 8px; }
.pagination .active {
  background: var(--ys-yellow) !important;
  color: var(--ys-ink) !important;
  border-color: var(--ys-yellow) !important;
}
.s-block--features, .features-section { background: var(--ys-paper); }
.feature-item, .features-section .feature { border-radius: 12px; }

/* 09 — Footer */
.store-footer, .store-footer__inner {
  background: var(--ys-ink) !important;
  color: #D4D4D4 !important;
}
.store-footer__inner { border-top: 1px solid rgb(255 255 255 / 8%); }
.store-footer :is(h2, h3, h4, .footer-title) { color: var(--ys-white) !important; font-weight: 700; }
.store-footer :is(h3, h4)::after {
  content: "";
  display: block;
  width: 28px;
  height: 3px;
  margin-block-start: 8px;
  background: var(--ys-yellow);
  border-radius: 3px;
}
.store-footer p, .store-footer address,
.store-footer .footer-about, .store-footer .store-about {
  color: #BDBDBD;
  line-height: 1.9;
}
.store-footer a { color: #D4D4D4 !important; }
.store-footer a:hover { color: var(--ys-yellow) !important; }
.store-footer .contact-social, .store-footer .social-links { color: var(--ys-yellow); }
.store-footer .contact-social a, .store-footer .social-links a {
  border-radius: 50%;
}
.store-footer__copyright {
  background: #101010 !important;
  color: #BDBDBD !important;
  border-top: 1px solid rgb(255 255 255 / 8%);
}
.store-footer__copyright a { color: var(--ys-yellow) !important; }
/* Preserve original logos and light backplates for readability. */
.store-footer :is(.payment-methods, .payments-methods) img {
  filter: none !important;
  opacity: 1 !important;
}

/* 10 — Existing mobile navigation; no new bar or positioning */
.bottom-nav, .mobile-nav, salla-bottom-navigation {
  background: var(--ys-white) !important;
  border-top: 1px solid var(--ys-line);
  box-shadow: 0 -3px 14px rgb(23 23 23 / 4%);
}
.bottom-nav .active, .mobile-nav .active { color: var(--ys-ink) !important; font-weight: 700; }
.bottom-nav .active i, .mobile-nav .active i { color: #AD8600 !important; }

/* 11 — Hover on devices that support it */
@media (hover: hover) {
  .s-product-card-entry:hover {
    border-color: #D4D4D4 !important;
    box-shadow: var(--ys-shadow) !important;
  }
  .category-entry:hover, .category-card:hover,
  .s-block--categories .swiper-slide > a:hover { border-color: var(--ys-yellow); }
  .swiper-button-next:hover, .swiper-button-prev:hover,
  .s-slider-block__title-nav-right:hover, .s-slider-block__title-nav-left:hover {
    background: var(--ys-yellow) !important;
  }
  .btn--primary:not(:disabled):hover, .btn-primary:not(:disabled):hover,
  .s-button-primary:not(:disabled):hover,
  salla-button[color="primary"]:not([disabled])::part(button):hover,
  .s-product-card-content-footer salla-add-product-button .s-button-btn:not(:disabled):hover,
  .s-product-card-content-footer salla-add-product-button salla-button:not([disabled])::part(button):hover {
    background: var(--ys-ink) !important;
    color: var(--ys-yellow) !important;
    border-color: var(--ys-ink) !important;
  }
}
/* Disabled states last, including pointer hover. */
.s-product-card-content-footer salla-add-product-button .s-button-btn:disabled,
.s-product-card-content-footer salla-add-product-button .s-button-btn[aria-disabled="true"],
.s-product-card-content-footer salla-add-product-button salla-button[disabled]::part(button),
.s-button-primary:disabled, .btn-primary:disabled, .btn--primary:disabled,
salla-button[color="primary"][disabled]::part(button) {
  background: var(--ys-paper) !important;
  color: var(--ys-muted) !important;
  border-color: var(--ys-line) !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

/* 12 — Mobile and motion preferences */
@media (max-width: 768px) {
  .s-product-card-entry { border-radius: 11px !important; }
  .s-product-card-vertical .s-product-card-content { padding: 10px !important; gap: 6px !important; }
  .s-product-card-content-title a { font-size: 13px !important; }
  .s-product-card-price { font-size: 14px !important; }
  .section-title, .section-header h2, .s-block__title h2, .s-slider-block__title h2 {
    font-size: 20px !important;
  }
  .category-entry :is(h3, h4), .category-card :is(h3, h4) { font-size: 12px; }
  .store-footer__inner { padding-block: 32px; }
  .store-footer :is(h3, h4) { font-size: 16px; }
  .store-footer p, .store-footer li { font-size: 13px; }
  .store-footer__copyright { text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .store-header :is(a, button), .s-product-card-entry,
  .s-product-card-entry :is(a, button), .store-footer a,
  .category-entry, .category-card { transition: none !important; }
}

/* YELLOW SHOP — تحديث شكل بطاقات المنتجات */

/* البطاقة الرأسية */
.s-product-card-entry.s-product-card-vertical {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  min-height: 0 !important;
  background: #fff !important;
  border: 1px solid #EAEAEA !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: none !important;
  transform: none !important;
}

/* صورة كبيرة بنسبة قريبة من المرجع */
.s-product-card-vertical .s-product-card-image {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 4 / 5 !important;
  flex: none !important;
  padding: 0 !important;
  background: #F7F7F5 !important;
  overflow: hidden !important;
  transform: none !important;
}

.s-product-card-vertical .s-product-card-image img {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  padding: 4px !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

/* محتوى البطاقة */
.s-product-card-vertical .s-product-card-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 auto !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 12px !important;
  text-align: right !important;
}

/* اسم المنتج: حتى ثلاثة أسطر */
.s-product-card-vertical .s-product-card-content-title {
  margin: 0 !important;
}

.s-product-card-vertical .s-product-card-content-title a {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  min-height: 0 !important;
  color: #171717 !important;
  font-family: "Tajawal", sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.6 !important;
}

/* السعر */
.s-product-card-vertical .s-product-card-content-sub {
  margin: 0 !important;
  padding: 0 !important;
}

.s-product-card-vertical .s-product-card-price {
  color: #171717 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}

.s-product-card-vertical :is(del, s, .price-before) {
  color: #707070 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

/* شارة المنتج الموجودة */
.s-product-card-vertical .s-product-card-promotion-title {
  background: #FEED06 !important;
  color: #171717 !important;
  border-radius: 0 0 8px 8px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 5px 9px !important;
}

/* زر المفضلة */
.s-product-card-vertical .s-product-card-wishlist-btn {
  background: #fff !important;
  border: 1px solid #EAEAEA !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

/* تقليل الفراغ قبل زر السلة */
.s-product-card-vertical .s-product-card-content-footer {
  margin-top: 4px !important;
  padding-top: 0 !important;
}

.s-product-card-vertical
.s-product-card-content-footer salla-add-product-button {
  display: block !important;
  width: 100% !important;
}

/* زر السلة */
.s-product-card-vertical salla-add-product-button .s-button-btn,
.s-product-card-vertical salla-add-product-button
salla-button::part(button) {
  width: 100% !important;
  min-height: 42px !important;
  background: #FEED06 !important;
  color: #171717 !important;
  border: 1px solid #FEED06 !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (hover: hover) {
  .s-product-card-vertical salla-add-product-button
  .s-button-btn:not(:disabled):hover,
  .s-product-card-vertical salla-add-product-button
  salla-button:not([disabled])::part(button):hover {
    background: #171717 !important;
    border-color: #171717 !important;
    color: #FEED06 !important;
  }
}

/* الأزرار المعطلة */
.s-product-card-vertical salla-add-product-button
.s-button-btn:disabled,
.s-product-card-vertical salla-add-product-button
.s-button-btn[aria-disabled="true"],
.s-product-card-vertical salla-add-product-button
salla-button[disabled]::part(button) {
  background: #F7F7F5 !important;
  border-color: #EAEAEA !important;
  color: #707070 !important;
  cursor: not-allowed !important;
}

/* الجوال */
@media (max-width: 768px) {
  .s-product-card-vertical .s-product-card-content {
    padding: 10px !important;
    gap: 6px !important;
  }

  .s-product-card-vertical .s-product-card-content-title a {
    font-size: 13px !important;
  }

  .s-product-card-vertical .s-product-card-price {
    font-size: 16px !important;
  }
}
/* تقليل ارتفاع مساحة صور المنتجات */
.s-product-card-vertical .s-product-card-image {
  aspect-ratio: 1 / 1 !important;
}

.s-product-card-vertical .s-product-card-image img {
  padding: 0 !important;
  object-fit: contain !important;
}

/* توحيد مساحة أسماء المنتجات ومحاذاة الأسعار والأزرار */
.s-product-card-vertical .s-product-card-content-title a {
  line-height: 1.6 !important;
  height: 4.8em !important;
  min-height: 4.8em !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
}

/* خلفية بيضاء موحدة لبطاقات المنتجات */
.s-product-card-entry,
.s-product-card-entry.s-product-card-vertical,
.s-product-card-entry .s-product-card-image,
.s-product-card-entry .s-product-card-image img,
.s-product-card-entry .s-product-card-content {
  background: #FFFFFF !important;
}
/* عرض البنرات كاملة دون قص أو تمديد */
.banner-entry {
  width: 100%;
  border-radius: 12px !important;
  overflow: hidden;
}

.banner-entry img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}
/* =====================================================
   YELLOW SHOP — MINIMAL PRODUCT CARD
   بطاقة منتجات نظيفة بأسلوب المتاجر الكبيرة
   ===================================================== */

/* البطاقة */
.s-product-card-entry.s-product-card-vertical {
    position: relative !important;
    container-type: inline-size;

    display: flex !important;
    flex-direction: column !important;

    background: #FFFFFF !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;

    border-radius: 0 !important;

    overflow: visible !important;

    height: auto !important;
    min-height: 0 !important;

    padding: 0 !important;
    margin: 0 !important;

    transform: none !important;
}


/* =========================
   صورة المنتج
   ========================= */

.s-product-card-vertical .s-product-card-image {
    position: relative !important;

    width: 100% !important;
    height: auto !important;

    aspect-ratio: 1 / 1 !important;

    background: #FFFFFF !important;

    border: 0 !important;
    border-radius: 0 !important;

    overflow: hidden !important;

    padding: 0 !important;
    margin: 0 !important;
}


.s-product-card-vertical .s-product-card-image img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    padding: 4px !important;

    object-fit: contain !important;
    object-position: center !important;

    background: #FFFFFF !important;

    border: 0 !important;

    transition: transform .25s ease !important;
}


/* =========================
   محتوى البطاقة
   ========================= */

.s-product-card-vertical .s-product-card-content {
    display: flex !important;
    flex-direction: column !important;

    justify-content: flex-start !important;

    gap: 3px !important;

    padding: 7px 2px 0 !important;

    background: #FFFFFF !important;

    text-align: right !important;

    flex: 0 0 auto !important;
}


/* =========================
   اسم المنتج
   ========================= */

.s-product-card-vertical .s-product-card-content-title {
    margin: 0 !important;
    padding: 0 !important;
}


.s-product-card-vertical .s-product-card-content-title a {
    display: -webkit-box !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;

    overflow: hidden !important;

    height: 3.2em !important;
    min-height: 3.2em !important;

    color: #222222 !important;

    font-family: "Tajawal", sans-serif !important;

    font-size: 13px !important;
    font-weight: 500 !important;

    line-height: 1.6 !important;

    text-decoration: none !important;
}


/* =========================
   السعر
   ========================= */

.s-product-card-vertical .s-product-card-content-sub {
    margin: 0 !important;
    padding: 0 !important;
}


.s-product-card-vertical .s-product-card-price {
    color: #D60000 !important;

    font-size: 15px !important;
    font-weight: 800 !important;

    line-height: 1.4 !important;
}


/* السعر القديم */

.s-product-card-vertical :is(
    del,
    s,
    .price-before
) {
    color: #999999 !important;

    font-size: 11px !important;
    font-weight: 400 !important;
}


/* =========================
   إخفاء زر المفضلة
   للحصول على شكل أنظف
   ========================= */

.s-product-card-vertical .s-product-card-wishlist-btn {
    display: none !important;
}


/* =========================
   مكان زر +
   ========================= */

.s-product-card-vertical .s-product-card-content-footer {
    position: absolute !important;

    top: calc(100cqw - 42px) !important;
    inset-inline-end: 7px !important;

    width: 38px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 10 !important;
}


/* الحاوية */

.s-product-card-vertical
.s-product-card-content-footer
salla-add-product-button {

    display: block !important;

    width: 38px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* =========================
   زر الإضافة الدائري
   ========================= */

.s-product-card-vertical
salla-add-product-button
.s-button-btn {

    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 38px !important;
    min-width: 38px !important;

    height: 38px !important;
    min-height: 38px !important;

    padding: 0 !important;
    margin: 0 !important;

    background: #FFFFFF !important;

    color: #171717 !important;

    border: 1px solid #DDDDDD !important;

    border-radius: 50% !important;

    box-shadow: 0 2px 7px rgb(0 0 0 / 8%) !important;

    font-size: 0 !important;

    overflow: hidden !important;

    cursor: pointer !important;

    transform: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease !important;
}


/* زر Salla الداخلي */

.s-product-card-vertical
salla-add-product-button
salla-button::part(button) {

    width: 38px !important;
    min-width: 38px !important;

    height: 38px !important;
    min-height: 38px !important;

    padding: 0 !important;

    background: #FFFFFF !important;

    color: transparent !important;

    border: 1px solid #DDDDDD !important;

    border-radius: 50% !important;

    box-shadow: 0 2px 7px rgb(0 0 0 / 8%) !important;
}


/* إخفاء أيقونة السلة الأصلية */

.s-product-card-vertical
salla-add-product-button
.s-button-btn svg,

.s-product-card-vertical
salla-add-product-button
.s-button-btn i {

    display: none !important;
}


/* علامة + */

.s-product-card-vertical
salla-add-product-button
.s-button-btn::before {

    content: "+" !important;

    position: absolute !important;

    inset: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #171717 !important;

    font-family: Arial, sans-serif !important;

    font-size: 25px !important;
    font-weight: 300 !important;

    line-height: 1 !important;

    pointer-events: none !important;
}


/* =========================
   شارات الخصم
   ========================= */

.s-product-card-vertical
.s-product-card-promotion-title {

    background: #FEED06 !important;
    color: #171717 !important;

    border-radius: 5px !important;

    padding: 4px 7px !important;

    font-size: 10px !important;
    font-weight: 700 !important;
}


/* =========================
   Hover للكمبيوتر
   ========================= */

@media (hover: hover) {

    .s-product-card-entry.s-product-card-vertical:hover {
        border: 0 !important;
        box-shadow: none !important;
    }


    .s-product-card-entry.s-product-card-vertical:hover
    .s-product-card-image img {

        transform: scale(1.025) !important;
    }


    .s-product-card-vertical
    salla-add-product-button
    .s-button-btn:not(:disabled):hover {

        background: #FEED06 !important;
        border-color: #FEED06 !important;

        transform: scale(1.06) !important;
    }


    .s-product-card-vertical
    salla-add-product-button
    salla-button:not([disabled])::part(button):hover {

        background: #FEED06 !important;
        border-color: #FEED06 !important;
    }
}


/* =========================
   المنتجات غير المتوفرة
   ========================= */

.s-product-card-vertical
salla-add-product-button
.s-button-btn:disabled,

.s-product-card-vertical
salla-add-product-button
.s-button-btn[aria-disabled="true"] {

    background: #F5F5F5 !important;

    border-color: #E4E4E4 !important;

    color: #AAAAAA !important;

    cursor: not-allowed !important;

    box-shadow: none !important;
}


/* =========================
   الجوال
   ========================= */

@media (max-width: 768px) {

    .s-product-card-vertical
    .s-product-card-content {

        padding: 6px 1px 0 !important;

        gap: 2px !important;
    }


    .s-product-card-vertical
    .s-product-card-content-title a {

        font-size: 12px !important;

        line-height: 1.55 !important;

        height: 3.1em !important;
        min-height: 3.1em !important;
    }


    .s-product-card-vertical
    .s-product-card-price {

        font-size: 14px !important;
    }


    .s-product-card-vertical
    .s-product-card-content-footer {

        top: calc(100cqw - 38px) !important;

        inset-inline-end: 5px !important;

        width: 35px !important;
        height: 35px !important;
    }


    .s-product-card-vertical
    .s-product-card-content-footer
    salla-add-product-button,

    .s-product-card-vertical
    salla-add-product-button
    .s-button-btn {

        width: 35px !important;
        min-width: 35px !important;

        height: 35px !important;
        min-height: 35px !important;
    }


    .s-product-card-vertical
    salla-add-product-button
    salla-button::part(button) {

        width: 35px !important;
        min-width: 35px !important;

        height: 35px !important;
        min-height: 35px !important;
    }


    .s-product-card-vertical
    salla-add-product-button
    .s-button-btn::before {

        font-size: 23px !important;
    }
}

/* =====================================================
   YELLOW SHOP — FIX PLUS BUTTON
   تثبيت زر + فوق صورة المنتج
   ===================================================== */


/* محتوى البطاقة يصبح نقطة مرجعية للزر */
.s-product-card-entry.s-product-card-vertical
.s-product-card-content {
    position: relative !important;
    overflow: visible !important;
}


/* مكان زر الإضافة */
.s-product-card-entry.s-product-card-vertical
.s-product-card-content-footer {

    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: absolute !important;

    top: -48px !important;
    inset-inline-end: 8px !important;

    width: 40px !important;
    height: 40px !important;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 50 !important;

    align-items: center !important;
    justify-content: center !important;
}


/* عنصر سلة نفسه */
.s-product-card-entry.s-product-card-vertical
.s-product-card-content-footer
salla-add-product-button {

    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 40px !important;
    height: 40px !important;

    min-width: 40px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* الزر */
.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn {

    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 40px !important;
    min-width: 40px !important;

    height: 40px !important;
    min-height: 40px !important;

    padding: 0 !important;
    margin: 0 !important;

    background: #FFFFFF !important;

    border: 1px solid #E1E1E1 !important;
    border-radius: 50% !important;

    color: transparent !important;

    box-shadow: 0 2px 8px rgb(0 0 0 / 10%) !important;

    overflow: hidden !important;

    font-size: 0 !important;
}


/* Salla Button Shadow DOM */
.s-product-card-entry.s-product-card-vertical
salla-add-product-button
salla-button::part(button) {

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 40px !important;
    min-width: 40px !important;

    height: 40px !important;
    min-height: 40px !important;

    padding: 0 !important;

    background: #FFFFFF !important;

    border: 1px solid #E1E1E1 !important;
    border-radius: 50% !important;

    box-shadow: 0 2px 8px rgb(0 0 0 / 10%) !important;
}


/* إخفاء أيقونة السلة الأصلية */
.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn svg,

.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn i {

    display: none !important;
}


/* علامة + */
.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn::after {

    content: "+" !important;

    position: absolute !important;

    inset: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #111111 !important;

    font-family: Arial, sans-serif !important;

    font-size: 26px !important;
    font-weight: 300 !important;

    line-height: 1 !important;

    pointer-events: none !important;
}


/* المرور بالماوس */
@media (hover: hover) {

    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button .s-button-btn:not(:disabled):hover {

        background: #FEED06 !important;
        border-color: #FEED06 !important;

        transform: scale(1.06) !important;
    }

    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button
    salla-button:not([disabled])::part(button):hover {

        background: #FEED06 !important;
        border-color: #FEED06 !important;
    }
}


/* الجوال */
@media (max-width: 768px) {

    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-footer {

        top: -43px !important;
        inset-inline-end: 6px !important;

        width: 36px !important;
        height: 36px !important;
    }


    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-footer
    salla-add-product-button,

    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button .s-button-btn {

        width: 36px !important;
        min-width: 36px !important;

        height: 36px !important;
        min-height: 36px !important;
    }


    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button
    salla-button::part(button) {

        width: 36px !important;
        min-width: 36px !important;

        height: 36px !important;
        min-height: 36px !important;
    }


    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button .s-button-btn::after {

        font-size: 23px !important;
    }
}

/* =====================================================
   YELLOW SHOP — FULL WIDTH STOREFRONT
   استخدام عرض الواجهة بالكامل
   ===================================================== */

/* الحاويات الرئيسية في الصفحة */
main .container,
main .s-container,
main .container-fluid,
.home .container,
.home .s-container,
.s-block .container,
.s-block .s-container,
.s-products-slider-wrapper .container,
.s-block--products-slider .container,
.s-block--categories .container,
.s-slider-block .container {
    width: 100% !important;
    max-width: none !important;

    padding-inline: 20px !important;
    margin-inline: auto !important;
}


/* أقسام الصفحة */
main .s-block,
.home .s-block,
.s-products-slider-wrapper,
.s-block--products-slider,
.s-block--categories {
    width: 100% !important;
    max-width: none !important;
}


/* سلايدر المنتجات */
.s-products-slider-wrapper,
.s-products-slider-wrapper .swiper,
.s-block--products-slider .swiper {
    width: 100% !important;
    max-width: none !important;
}


/* منع وجود حدود عرض ثابتة حول المنتجات */
.s-products-slider-wrapper .swiper-wrapper,
.s-block--products-slider .swiper-wrapper {
    width: 100% !important;
}


/* =====================================================
   البنرات — عرض كامل
   ===================================================== */

.banner-entry,
.main-slider,
.s-block--banners,
.s-block--banners .container,
.s-block--banners .s-container {
    width: 100% !important;
    max-width: none !important;
}


/* البنر نفسه */
.banner-entry img {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    height: auto !important;

    object-fit: contain !important;
}


/* =====================================================
   الأقسام
   ===================================================== */

.s-block--categories,
.s-block--categories .swiper,
.s-block--categories .swiper-wrapper {
    width: 100% !important;
    max-width: none !important;
}


/* =====================================================
   شاشات الكمبيوتر الكبيرة
   ===================================================== */

@media (min-width: 1200px) {

    main .container,
    main .s-container,
    .home .container,
    .home .s-container,
    .s-block .container,
    .s-block .s-container {

        max-width: none !important;

        padding-inline: 24px !important;
    }
}


/* =====================================================
   الجوال
   ===================================================== */

@media (max-width: 768px) {

    main .container,
    main .s-container,
    .home .container,
    .home .s-container,
    .s-block .container,
    .s-block .s-container {

        width: 100% !important;

        padding-inline: 10px !important;
    }
}

/* =====================================================
   YELLOW SHOP — FULL WIDTH HEADER + TIGHTER SPACING
   توسيع الشريط العلوي وتقليل الفواصل والمسافات
   ===================================================== */


/* =========================================
   1) الحاويات العامة
   ========================================= */
.store-header .container,
.store-header .s-container,
.main-header .container,
.main-header .s-container,
.main-nav-container .container,
.main-nav-container .s-container,
.top-navbar .container,
.top-navbar .s-container,
.top-nav .container,
.top-nav .s-container,
.announcement-bar .container,
.announcement-bar .s-container,
header .container,
header .s-container {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 24px !important;
    margin-inline: 0 !important;
}


/* =========================================
   2) الشريط العلوي / الهيدر
   ========================================= */
.store-header,
.main-header,
.main-nav-container,
.main-nav-container.fixed-header,
.top-navbar,
.top-nav,
.announcement-bar {
    width: 100% !important;
    max-width: none !important;
}


/* الصف الداخلي للهيدر */
.store-header .inner,
.main-header .inner,
.main-nav-container .inner,
.top-navbar .inner,
.top-nav .inner {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 0 !important;
}


/* محاذاة عناصر الهيدر بشكل أفضل */
.main-nav-container .navbar-wrapper,
.store-header .navbar-wrapper,
.main-header .navbar-wrapper,
.header-inner,
.navbar-inner {
    width: 100% !important;
    max-width: none !important;
}


/* الشعار */
.navbar-brand,
.store-logo {
    margin-inline-end: 24px !important;
    flex-shrink: 0 !important;
}


/* القائمة الرئيسية — الكمبيوتر فقط */
@media (min-width: 769px) {
    .main-menu,
    .nav-menu,
    .navbar-nav {
        display: flex !important;
        align-items: center !important;
        gap: 24px !important;
        flex-wrap: nowrap !important;
    }
}


/* الجهة اليسرى: الحساب / السلة / السعر */
.header-actions,
.navbar-actions,
.user-menu,
.store-header__cart,
.store-header__user {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}


/* =========================================
   3) إزالة قيود العرض عن أقسام الصفحة
   ========================================= */
main .container,
main .s-container,
.home .container,
.home .s-container,
.s-block .container,
.s-block .s-container,
.s-slider-block .container,
.s-slider-block .s-container,
.s-products-slider-wrapper .container,
.s-products-slider-wrapper .s-container,
.s-block--products-slider .container,
.s-block--products-slider .s-container,
.s-block--categories .container,
.s-block--categories .s-container {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 24px !important;
    margin-inline: 0 !important;
}


/* =========================================
   4) تقليل الفواصل العمودية بين البيانات والأقسام
   ========================================= */
.s-block,
.s-slider-block,
.s-block--products-slider,
.s-block--categories,
.s-products-slider-wrapper {
    margin-block: 18px !important;
    padding-block: 0 !important;
}


/* عنوان القسم + عرض الكل + الأسهم */
.section-header,
.s-block__title,
.s-slider-block__title,
.s-slider-block__title-wrap {
    margin-bottom: 12px !important;
    padding-bottom: 0 !important;
}


/* تقليل المسافة بين العنوان والمنتجات */
.section-header + *,
.s-block__title + *,
.s-slider-block__title + * {
    margin-top: 0 !important;
}


/* =========================================
   5) تقليل الفراغات داخل سلايدر المنتجات
   ========================================= */
.s-products-slider-wrapper,
.s-block--products-slider,
.s-products-slider-wrapper .swiper,
.s-block--products-slider .swiper {
    width: 100% !important;
    max-width: none !important;
    padding-inline: 0 !important;
}


/* تقليل padding أعلى/أسفل السلايدر */
.s-products-slider-wrapper .swiper,
.s-block--products-slider .swiper {
    padding-block: 0 8px !important;
}


/* لو الثيم يضيف فراغًا على الwrapper */
.s-products-slider-wrapper .swiper-wrapper,
.s-block--products-slider .swiper-wrapper {
    align-items: stretch !important;
}


/* =========================================
   6) تقليل الفواصل تحت الهيدر
   ========================================= */
main,
.main-content,
.content-wrapper,
.page-wrapper {
    padding-top: 0 !important;
}


/* أول بلوك بعد الهيدر */
.store-header + *,
.main-header + * {
    margin-top: 0 !important;
}


/* =========================================
   7) البنرات والأقسام بعرض كامل
   ========================================= */
.banner-entry,
.main-slider,
.s-block--banners,
.s-block--banners .container,
.s-block--banners .s-container,
.s-block--categories,
.s-block--categories .swiper {
    width: 100% !important;
    max-width: none !important;
}


/* =========================================
   8) الجوال
   ========================================= */
@media (max-width: 768px) {
    .store-header .container,
    .store-header .s-container,
    .main-header .container,
    .main-header .s-container,
    .main-nav-container .container,
    .main-nav-container .s-container,
    .top-navbar .container,
    .top-navbar .s-container,
    .top-nav .container,
    .top-nav .s-container,
    .announcement-bar .container,
    .announcement-bar .s-container,
    main .container,
    main .s-container,
    .home .container,
    .home .s-container,
    .s-block .container,
    .s-block .s-container {
        padding-inline: 10px !important;
    }

    /* قائمة الجوال: نترك MMenu الأصلي للثيم يدير التخطيط */

    .header-actions,
    .navbar-actions,
    .user-menu {
        gap: 8px !important;
    }

    .s-block,
    .s-slider-block,
    .s-block--products-slider,
    .s-block--categories,
    .s-products-slider-wrapper {
        margin-block: 12px !important;
    }

    .section-header,
    .s-block__title,
    .s-slider-block__title {
        margin-bottom: 8px !important;
    }
}

/* YELLOW SHOP — Final Product Card Alignment */

.s-product-card-vertical .s-product-card-content {
    gap: 2px !important;
    padding-top: 7px !important;
}

.s-product-card-vertical .s-product-card-content-title a {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;

    height: 3.2em !important;
    min-height: 3.2em !important;

    overflow: hidden !important;

    line-height: 1.6 !important;
}

.s-product-card-vertical .s-product-card-content-sub {
    margin-top: 1px !important;
}

.s-product-card-vertical .s-product-card-price {
    margin-top: 0 !important;
}
/* =====================================================
   YELLOW SHOP — PRODUCT SLIDER HEADER ONLY
   عنوان أقسام المنتجات فقط
   ===================================================== */


/* عنوان سلايدر المنتجات فقط */
.s-block--products-slider .s-slider-block__title,
salla-products-slider .s-slider-block__title {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    max-width: none !important;

    min-height: 0 !important;
    height: auto !important;

    margin: 0 0 10px !important;
    padding: 0 !important;

    gap: 12px !important;
}


/* عنوان القسم */
.s-block--products-slider .s-slider-block__title h2,
salla-products-slider .s-slider-block__title h2 {
    flex: 0 0 auto !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 18px !important;
    line-height: 1.5 !important;

    text-align: right !important;
}


/* الخط الأصفر */
.s-block--products-slider .s-slider-block__title h2::after,
salla-products-slider .s-slider-block__title h2::after {
    content: "" !important;

    display: block !important;

    width: 32px !important;
    height: 3px !important;

    margin-top: 5px !important;
    margin-inline-start: 0 !important;

    background: #FEED06 !important;

    border-radius: 3px !important;
}


/* الجهة التي تحتوي على عرض الكل والأسهم */
.s-block--products-slider .s-slider-block__title-nav,
salla-products-slider .s-slider-block__title-nav {
    display: flex !important;
    align-items: center !important;

    width: auto !important;
    height: auto !important;

    gap: 7px !important;

    margin: 0 !important;
    padding: 0 !important;

    flex: 0 0 auto !important;
}


/* عرض الكل */
.s-block--products-slider .s-slider-block__title a,
salla-products-slider .s-slider-block__title a {
    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    white-space: nowrap !important;
}


/* الأسهم */
.s-block--products-slider .s-slider-block__title-nav-right,
.s-block--products-slider .s-slider-block__title-nav-left,
salla-products-slider .s-slider-block__title-nav-right,
salla-products-slider .s-slider-block__title-nav-left {
    position: static !important;

    width: 36px !important;
    min-width: 36px !important;

    height: 36px !important;
    min-height: 36px !important;

    margin: 0 !important;
}


/* تقليل المسافة بين العنوان والمنتجات */
.s-block--products-slider .s-slider-block__title + .swiper,
salla-products-slider .s-slider-block__title + .swiper {
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/* الجوال */
@media (max-width: 768px) {

    .s-block--products-slider .s-slider-block__title,
    salla-products-slider .s-slider-block__title {
        margin-bottom: 7px !important;
        gap: 8px !important;
    }

    .s-block--products-slider .s-slider-block__title h2,
    salla-products-slider .s-slider-block__title h2 {
        font-size: 16px !important;
    }

    .s-block--products-slider .s-slider-block__title-nav-right,
    .s-block--products-slider .s-slider-block__title-nav-left,
    salla-products-slider .s-slider-block__title-nav-right,
    salla-products-slider .s-slider-block__title-nav-left {
        width: 32px !important;
        min-width: 32px !important;

        height: 32px !important;
        min-height: 32px !important;
    }
}

/* =====================================================
   YELLOW SHOP — CATEGORY BANNERS 350x200
   إظهار بانرات الأقسام كاملة بدون قص
   ===================================================== */

/* بطاقة بانر القسم */
.s-block--banners .banner-entry,
.banner-entry {
    position: relative !important;

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    aspect-ratio: 350 / 200 !important;

    overflow: hidden !important;

    border-radius: 10px !important;

    background: #F7F7F5 !important;
}


/* الرابط داخل البطاقة */
.s-block--banners .banner-entry > a,
.banner-entry > a {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
}


/* picture إن كان مستخدمًا من الثيم */
.s-block--banners .banner-entry picture,
.banner-entry picture {
    display: block !important;

    width: 100% !important;
    height: 100% !important;
}


/* الصورة */
.s-block--banners .banner-entry img,
.banner-entry img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    max-width: 100% !important;
    max-height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center center !important;

    transform: none !important;

    background: #F7F7F5 !important;
}


/* منع تكبير الصورة عند Hover */
@media (hover: hover) {

    .s-block--banners .banner-entry:hover img,
    .banner-entry:hover img {
        transform: none !important;
    }
}

/* =====================================================
   YELLOW SHOP — MOBILE CATEGORY BANNERS 2 COLUMNS
   عرض بطاقتين من الأقسام في كل صف على الجوال
   ===================================================== */

@media (max-width: 768px) {

    /* الحاوية التي تحتوي بانرات الأقسام */
    .s-block--banners .grid,
    .s-block--banners .banners-grid,
    .s-block--banners .container > div:has(> .banner-entry),
    .s-block--banners .s-container > div:has(> .banner-entry) {

        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 10px !important;

        width: 100% !important;
    }


    /* كل بطاقة */
    .s-block--banners .banner-entry {
        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;

        aspect-ratio: 350 / 200 !important;

        border-radius: 8px !important;
    }


    /* الرابط */
    .s-block--banners .banner-entry > a {
        width: 100% !important;
        height: 100% !important;
    }


    /* الصورة */
    .s-block--banners .banner-entry img {
        width: 100% !important;
        height: 100% !important;

        object-fit: contain !important;
        object-position: center !important;

        border-radius: 8px !important;
    }
}


/* شاشات الجوال الصغيرة جدًا */
@media (max-width: 380px) {

    .s-block--banners .grid,
    .s-block--banners .banners-grid,
    .s-block--banners .container > div:has(> .banner-entry),
    .s-block--banners .s-container > div:has(> .banner-entry) {

        gap: 7px !important;
    }
}


/* =====================================================
   YELLOW SHOP — MOBILE PRODUCT IMAGE BALANCE
   تصغير إطار الصورة + توسيط المنتج
   ===================================================== */

@media (max-width: 768px) {

    /* مساحة صورة المنتج */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-image {

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        /* بدلاً من المربع 1:1 */
        aspect-ratio: 4 / 3 !important;

        height: auto !important;
        min-height: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        background: #FFFFFF !important;

        overflow: hidden !important;
    }


    /* الصورة نفسها */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-image img {

        display: block !important;

        width: 86% !important;
        height: 86% !important;

        max-width: 86% !important;
        max-height: 86% !important;

        margin: auto !important;
        padding: 0 !important;

        object-fit: contain !important;
        object-position: center center !important;

        background: transparent !important;

        transform: none !important;
    }


    /* زر + يبقى قريباً من أسفل الصورة */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-footer {

        top: -39px !important;

        width: 34px !important;
        height: 34px !important;

        inset-inline-end: 5px !important;
    }


    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-footer
    salla-add-product-button,

    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button .s-button-btn {

        width: 34px !important;
        min-width: 34px !important;

        height: 34px !important;
        min-height: 34px !important;
    }


    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button
    salla-button::part(button) {

        width: 34px !important;
        min-width: 34px !important;

        height: 34px !important;
        min-height: 34px !important;
    }


    .s-product-card-entry.s-product-card-vertical
    salla-add-product-button .s-button-btn::after {

        font-size: 22px !important;
    }
}

/* =====================================================
   YELLOW SHOP — MOBILE PRODUCT CARD FINAL
   صورة أصغر + تمركز حقيقي + منع قص أول بطاقة
   ===================================================== */

@media (max-width: 768px) {

    /* مساحة آمنة يمين ويسار سلايدر المنتجات */
    .s-block--products-slider .swiper,
    .s-products-slider-wrapper .swiper {
        padding-inline: 10px !important;
        box-sizing: border-box !important;
    }


    /* بطاقة المنتج */
    .s-product-card-entry.s-product-card-vertical {
        width: 100% !important;
        min-width: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        overflow: visible !important;
    }


    /* إطار الصورة */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-image {

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        /* أقصر من السابق */
        aspect-ratio: 1 / .86 !important;

        height: auto !important;
        min-height: 0 !important;

        padding: 8px !important;
        margin: 0 !important;

        overflow: hidden !important;

        background: #FFFFFF !important;
    }


    /* المنتج داخل الإطار */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-image img {

        position: static !important;

        display: block !important;

        width: 78% !important;
        height: 78% !important;

        max-width: 78% !important;
        max-height: 78% !important;

        margin: auto !important;
        padding: 0 !important;

        object-fit: contain !important;
        object-position: 50% 50% !important;

        transform: none !important;
    }


    /* المحتوى أسفل الصورة */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content {

        padding: 6px 4px 0 !important;

        gap: 2px !important;

        text-align: right !important;
    }


    /* الاسم */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-title a {

        font-size: 13px !important;
        line-height: 1.55 !important;

        height: 3.1em !important;
        min-height: 3.1em !important;

        -webkit-line-clamp: 2 !important;
    }


    /* السعر */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-price {

        font-size: 15px !important;
        line-height: 1.4 !important;
    }


    /* زر + */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-footer {

        top: -37px !important;
        inset-inline-end: 6px !important;

        width: 34px !important;
        height: 34px !important;
    }
}

/* =====================================================
   YELLOW SHOP — MOBILE PRODUCT SLIDER FINAL FIX
   منع قص البطاقات + توسيط الصور + حجم متوازن
   ===================================================== */

@media (max-width: 768px) {

    /* مهم: لا نضع padding على Swiper نفسه */
    .s-block--products-slider .swiper,
    .s-products-slider-wrapper .swiper {
        padding-inline: 0 !important;
        margin-inline: 0 !important;

        width: 100% !important;
        max-width: 100% !important;

        overflow: hidden !important;
        box-sizing: border-box !important;
    }


    /* Wrapper */
    .s-block--products-slider .swiper-wrapper,
    .s-products-slider-wrapper .swiper-wrapper {
        padding-inline: 0 !important;
        margin-inline: 0 !important;

        align-items: stretch !important;
    }


    /* كل Slide */
    .s-block--products-slider .swiper-slide,
    .s-products-slider-wrapper .swiper-slide {
        box-sizing: border-box !important;

        padding-inline: 5px !important;

        overflow: visible !important;
    }


    /* بطاقة المنتج */
    .s-product-card-entry.s-product-card-vertical {
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow: visible !important;
    }


    /* مساحة الصورة */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-image {
        display: flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;

        aspect-ratio: 4 / 3 !important;

        height: auto !important;
        min-height: 0 !important;

        padding: 8px !important;
        margin: 0 !important;

        background: #fff !important;

        overflow: hidden !important;
        box-sizing: border-box !important;
    }


    /* صورة المنتج */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-image img {
        position: static !important;

        display: block !important;

        width: 74% !important;
        height: 74% !important;

        max-width: 74% !important;
        max-height: 74% !important;

        margin: auto !important;
        padding: 0 !important;

        object-fit: contain !important;
        object-position: center center !important;

        transform: none !important;

        background: transparent !important;
    }


    /* محتوى المنتج */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content {
        width: 100% !important;

        padding: 6px 4px 0 !important;

        box-sizing: border-box !important;

        gap: 2px !important;
    }


    /* اسم المنتج */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-title a {
        font-size: 12.5px !important;
        line-height: 1.55 !important;

        height: 3.1em !important;
        min-height: 3.1em !important;

        -webkit-line-clamp: 2 !important;
    }


    /* السعر */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-price {
        font-size: 14px !important;
    }


    /* زر + */
    .s-product-card-entry.s-product-card-vertical
    .s-product-card-content-footer {
        top: -37px !important;
        inset-inline-end: 7px !important;

        width: 34px !important;
        height: 34px !important;
    }
}

/* =====================================================
   YELLOW SHOP — MOBILE 2 PRODUCTS SLIDER
   عرض منتجين كاملين في الجوال مع بقاء السلايدر
   ===================================================== */

@media (max-width: 768px) {

    /* السلايدر نفسه */
    .s-block--products-slider .swiper,
    .s-products-slider-wrapper .swiper,
    salla-products-slider .swiper {
        width: 100% !important;
        max-width: 100% !important;

        padding-inline: 0 !important;
        margin-inline: 0 !important;

        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    /* الـ wrapper */
    .s-block--products-slider .swiper-wrapper,
    .s-products-slider-wrapper .swiper-wrapper,
    salla-products-slider .swiper-wrapper {
        display: flex !important;
        align-items: stretch !important;
    }

    /* كل شريحة = نصف الصف */
    .s-block--products-slider .swiper-slide,
    .s-products-slider-wrapper .swiper-slide,
    salla-products-slider .swiper-slide {
        width: calc((100% - 10px) / 2) !important;
        min-width: calc((100% - 10px) / 2) !important;
        max-width: calc((100% - 10px) / 2) !important;

        margin-inline-end: 10px !important;
        padding: 0 !important;

        box-sizing: border-box !important;
        overflow: visible !important;
        flex-shrink: 0 !important;
    }

    /* البطاقة داخل الشريحة */
    .s-block--products-slider .swiper-slide .s-product-card-entry,
    .s-products-slider-wrapper .swiper-slide .s-product-card-entry,
    salla-products-slider .swiper-slide .s-product-card-entry {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    /* الأسهم / علامات التنقل */
    .s-block--products-slider .s-slider-block__title-nav,
    .s-products-slider-wrapper .s-slider-block__title-nav,
    salla-products-slider .s-slider-block__title-nav {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;

        visibility: visible !important;
        opacity: 1 !important;
    }

    .s-block--products-slider .s-slider-block__title-nav-right,
    .s-block--products-slider .s-slider-block__title-nav-left,
    .s-products-slider-wrapper .s-slider-block__title-nav-right,
    .s-products-slider-wrapper .s-slider-block__title-nav-left,
    salla-products-slider .s-slider-block__title-nav-right,
    salla-products-slider .s-slider-block__title-nav-left {
        width: 32px !important;
        min-width: 32px !important;

        height: 32px !important;
        min-height: 32px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: static !important;
        margin: 0 !important;
    }

    /* مسافة بسيطة أسفل العنوان */
    .s-block--products-slider .s-slider-block__title,
    .s-products-slider-wrapper .s-slider-block__title,
    salla-products-slider .s-slider-block__title {
        margin-bottom: 8px !important;
    }
}

/* =====================================================
   YELLOW SHOP — HEADER BAR YELLOW
   تلوين شريط الهيدر العلوي بالأصفر
   ===================================================== */

.store-header,
.main-header,
.main-nav-container,
.main-nav-container.fixed-header {
    background: #FEED06 !important;
    border-bottom: 1px solid #E6C200 !important;
    box-shadow: none !important;
}

/* الحاوية الداخلية */
.store-header .inner,
.main-header .inner,
.main-nav-container .inner,
.header-inner,
.navbar-inner,
.navbar-wrapper {
    background: #FEED06 !important;
}

/* روابط القائمة */
.main-menu > li > a,
.nav-menu > li > a,
.navbar-nav > li > a {
    color: #171717 !important;
}

/* الأيقونات */
.store-header a,
.store-header button,
.main-header a,
.main-header button,
.header-btn,
.header-btn i,
.header-btn svg,
.user-btn,
.cart-btn {
    color: #171717 !important;
}

/* دوائر الأيقونات إن وجدت */
.store-header .btn,
.store-header .icon-btn,
.store-header .circle-action {
    border-color: rgba(23, 23, 23, 0.18) !important;
    background: transparent !important;
}

/* زر القائمة في الجوال */
.burger-menu,
.menu-trigger,
.menu-btn,
.nav-trigger {
    color: #171717 !important;
}

/* عند مرور الماوس */
.main-menu > li > a:hover,
.nav-menu > li > a:hover,
.navbar-nav > li > a:hover {
    color: #000 !important;
}
/* ضبط ارتفاع الشريط العلوي */
header,
.main-nav,
.navbar,
.navbar-wrapper,
.s-header {
    min-height: 54px !important;
}

/* حاوية الشعار */
.store-logo,
.navbar-brand,
.site-logo,
.logo {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    padding: 0 8px !important;
    margin: 0 !important;
}

/* صورة الشعار */
.store-logo img,
.navbar-brand img,
.site-logo img,
.logo img {
    max-height: 30px !important;
    width: auto !important;
    max-width: 120px !important;
    object-fit: contain !important;
    display: block !important;
}

/* للجوال */
@media (max-width: 768px) {
    .store-logo img,
    .navbar-brand img,
    .site-logo img,
    .logo img {
        max-height: 24px !important;
        max-width: 95px !important;
    }

    header,
    .main-nav,
    .navbar,
    .navbar-wrapper,
    .s-header {
        min-height: 48px !important;
    }
}
/* =====================================================
   YELLOW SHOP — UNIFIED BRAND YELLOW
   توحيد الأصفر + Hover + الخطوط التزيينية
   ===================================================== */

:root {
    --ys-yellow: #FEED06 !important;
}


/* ==============================
   FOOTER LINKS
   ============================== */

.store-footer a {
    color: #D4D4D4 !important;

    transition:
        color .2s ease,
        border-color .2s ease,
        background-color .2s ease !important;
}


/* Hover جميع روابط الفوتر */
.store-footer a:hover,
.store-footer a:focus {
    color: #FEED06 !important;
}


/* الروابط المهمة */
.store-footer .footer-links a:hover,
.store-footer .menu-item a:hover,
.store-footer li a:hover {
    color: #FEED06 !important;
}


/* ==============================
   FOOTER TITLES
   ============================== */

.store-footer h2,
.store-footer h3,
.store-footer h4,
.store-footer .footer-title {
    color: #FFFFFF !important;
}


/* الخط الأصفر أسفل عنوان الفوتر */
.store-footer h2::after,
.store-footer h3::after,
.store-footer h4::after,
.store-footer .footer-title::after {
    background: #FEED06 !important;
}


/* ==============================
   SOCIAL ICONS
   ============================== */

.store-footer .social-links a,
.store-footer .contact-social a {
    color: #FFFFFF !important;

    border-color: rgba(255, 255, 255, .55) !important;

    transition:
        color .2s ease,
        border-color .2s ease,
        background-color .2s ease !important;
}


.store-footer .social-links a:hover,
.store-footer .contact-social a:hover {
    color: #171717 !important;

    background: #FEED06 !important;
    border-color: #FEED06 !important;
}


/* ==============================
   CONTACT ICONS
   ============================== */

.store-footer .contact-item a:hover,
.store-footer .footer-contact a:hover {
    color: #FEED06 !important;
}


/* ==============================
   COPYRIGHT
   ============================== */

.store-footer__copyright a {
    color: #FFFFFF !important;
}


.store-footer__copyright a:hover {
    color: #FEED06 !important;
}


/* ==============================
   GLOBAL SECTION ACCENTS
   ============================== */

/* خطوط العناوين الصفراء */
.section-title::after,
.s-block__title h2::after,
.s-slider-block__title h2::after,
.store-footer h3::after,
.store-footer h4::after {
    background: #FEED06 !important;
}


/* نقطة السلايدر النشطة */
.swiper-pagination-bullet-active {
    background: #FEED06 !important;
}


/* ==============================
   GLOBAL LINK HOVER
   بدون التأثير على أزرار الشراء
   ============================== */

main a:not(.btn):not(.s-button-btn):hover {
    color: #FEED06 !important;
}


/* القائمة العلوية */
.main-menu > li > a:hover,
.nav-menu > li > a:hover,
.navbar-nav > li > a:hover {
    color: #171717 !important;

    text-decoration-color: #FEED06 !important;
}

/* ==========================================
   YELLOW SHOP — DARK UTILITY TOP BAR
   ========================================== */

.top-navbar,
.top-nav,
.announcement-bar {
    background: #171717 !important;
    color: #FFFFFF !important;

    border: 0 !important;
}

/* النصوص والروابط */
.top-navbar a,
.top-nav a,
.announcement-bar a {
    color: #FFFFFF !important;
}

/* Hover */
.top-navbar a:hover,
.top-nav a:hover,
.announcement-bar a:hover {
    color: #FEED06 !important;
}

/* البحث */
.top-navbar input,
.top-nav input,
.top-navbar .search-input,
.top-nav .search-input,
.top-navbar salla-search input,
.top-nav salla-search input {
    background: #FFFFFF !important;
    color: #171717 !important;

    border: 1px solid rgba(255,255,255,.15) !important;
}

/* زر العربية */
.top-navbar button,
.top-nav button,
.top-navbar .language-btn,
.top-nav .language-btn {
    background: #FEED06 !important;
    color: #171717 !important;

    border-color: #FEED06 !important;
}

/* الفواصل */
.top-navbar .divider,
.top-nav .divider {
    border-color: rgba(255,255,255,.18) !important;
}
/* YELLOW SHOP — Header Actions */

.store-header__cart,
.store-header__user,
.header-actions a,
.header-actions button {
    color: #171717 !important;
}

/* تثبيت زر + في يمين أسفل صورة المنتج */
.s-product-card-entry.s-product-card-vertical
.s-product-card-content-footer {
    inset-inline-start: 7px !important;
    inset-inline-end: auto !important;

    top: -38px !important;

    width: 36px !important;
    height: 36px !important;
}

/* شكل الزر */
.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn,
.s-product-card-entry.s-product-card-vertical
salla-add-product-button salla-button::part(button) {
    width: 36px !important;
    min-width: 36px !important;

    height: 36px !important;
    min-height: 36px !important;

    background: #FEED06 !important;
    border: 1px solid #FEED06 !important;
    border-radius: 50% !important;

    color: #171717 !important;

    box-shadow: 0 2px 8px rgb(0 0 0 / 10%) !important;
}

/* علامة + */
.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn::before,

.s-product-card-entry.s-product-card-vertical
salla-add-product-button .s-button-btn::after {
    color: #171717 !important;
}
/* =====================================================
   YELLOW SHOP — LOCK PRODUCT TITLE COLOR
   منع تغيير لون اسم المنتج نهائياً
   ===================================================== */

.s-product-card-entry
.s-product-card-content-title,

.s-product-card-entry
.s-product-card-content-title a,

.s-product-card-entry
.s-product-card-content-title a:link,

.s-product-card-entry
.s-product-card-content-title a:visited,

.s-product-card-entry
.s-product-card-content-title a:hover,

.s-product-card-entry
.s-product-card-content-title a:focus,

.s-product-card-entry
.s-product-card-content-title a:active,

.s-product-card-entry:hover
.s-product-card-content-title a,

.s-product-card-entry:focus-within
.s-product-card-content-title a {

    color: #171717 !important;
    -webkit-text-fill-color: #171717 !important;

    text-decoration: none !important;

    opacity: 1 !important;
}


/* أي span أو عنصر داخل اسم المنتج */
.s-product-card-entry
.s-product-card-content-title a * {

    color: #171717 !important;
    -webkit-text-fill-color: #171717 !important;
}


/* Hover البطاقة لا يؤثر على النص */
@media (hover: hover) {

    .s-product-card-entry:hover
    .s-product-card-content-title,

    .s-product-card-entry:hover
    .s-product-card-content-title a,

    .s-product-card-entry
    .s-product-card-content-title a:hover {

        color: #171717 !important;
        -webkit-text-fill-color: #171717 !important;
    }
}

/* ==========================================
   YELLOW SHOP — VIEW ALL LINK
   عرض الكل أسود وواضح
   ========================================== */

.s-block--products-slider .s-slider-block__title a,
.s-products-slider-wrapper .s-slider-block__title a,
salla-products-slider .s-slider-block__title a {
    color: #171717 !important;

    font-weight: 700 !important;
    text-decoration: none !important;

    opacity: 1 !important;
}

/* Hover */
.s-block--products-slider .s-slider-block__title a:hover,
.s-products-slider-wrapper .s-slider-block__title a:hover,
salla-products-slider .s-slider-block__title a:hover {
    color: #171717 !important;

    text-decoration: underline !important;
    text-decoration-color: #FEED06 !important;
    text-decoration-thickness: 3px !important;
    text-underline-offset: 5px !important;
}
/* =====================================================
   YELLOW SHOP — CATEGORY PAGE PRODUCTS GRID
   صفحات الأقسام / البحث / العلامات
   6 كمبيوتر - 5 لابتوب - 3 تابلت - 2 جوال
   ===================================================== */


/* عدد الأعمدة الافتراضي */
#main-content
salla-products-list[data-testid="store-products-list"] {
    --ys-products-cols: 6;
    --ys-products-gap: 18px;

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    overflow: visible !important;
}


/* =====================================================
   الحاوية الداخلية إذا كانت البطاقات مباشرة
   ===================================================== */

#main-content
salla-products-list[data-testid="store-products-list"]
:is(div, section, salla-infinite-scroll):has(> custom-salla-product-card),

#main-content
salla-products-list[data-testid="store-products-list"]
:is(div, section, salla-infinite-scroll):has(> salla-product-card) {

    display: grid !important;

    grid-template-columns:
        repeat(var(--ys-products-cols), minmax(0, 1fr)) !important;

    column-gap: var(--ys-products-gap) !important;
    row-gap: 28px !important;

    width: 100% !important;
    max-width: none !important;

    align-items: start !important;
}


/* =====================================================
   الحاوية الداخلية إذا كان لكل منتج Wrapper
   ===================================================== */

#main-content
salla-products-list[data-testid="store-products-list"]
:is(div, section, salla-infinite-scroll):has(> * > custom-salla-product-card),

#main-content
salla-products-list[data-testid="store-products-list"]
:is(div, section, salla-infinite-scroll):has(> * > salla-product-card) {

    display: grid !important;

    grid-template-columns:
        repeat(var(--ys-products-cols), minmax(0, 1fr)) !important;

    column-gap: var(--ys-products-gap) !important;
    row-gap: 28px !important;

    width: 100% !important;
    max-width: none !important;

    align-items: start !important;
}


/* إزالة أي عرض ثابت عن Wrapper كل منتج */
#main-content
salla-products-list[data-testid="store-products-list"]
:is(div, section, salla-infinite-scroll):has(> * > custom-salla-product-card) > *,

#main-content
salla-products-list[data-testid="store-products-list"]
:is(div, section, salla-infinite-scroll):has(> * > salla-product-card) > * {

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
}


/* بطاقة المنتج */
#main-content
salla-products-list[data-testid="store-products-list"]
custom-salla-product-card,

#main-content
salla-products-list[data-testid="store-products-list"]
salla-product-card {

    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
}


/* =====================================================
   الكمبيوتر الكبير — 6 منتجات
   ===================================================== */

@media (min-width: 1500px) {

    #main-content
    salla-products-list[data-testid="store-products-list"] {

        --ys-products-cols: 6;
        --ys-products-gap: 18px;
    }
}


/* =====================================================
   اللابتوب — 5 منتجات
   ===================================================== */

@media (min-width: 1100px) and (max-width: 1499px) {

    #main-content
    salla-products-list[data-testid="store-products-list"] {

        --ys-products-cols: 5;
        --ys-products-gap: 16px;
    }
}


/* =====================================================
   التابلت — 3 منتجات
   ===================================================== */

@media (min-width: 769px) and (max-width: 1099px) {

    #main-content
    salla-products-list[data-testid="store-products-list"] {

        --ys-products-cols: 3;
        --ys-products-gap: 14px;
    }
}


/* =====================================================
   الجوال — منتجان
   ===================================================== */

@media (max-width: 768px) {

    #main-content
    salla-products-list[data-testid="store-products-list"] {

        --ys-products-cols: 2;
        --ys-products-gap: 10px;
    }
}


/* =====================================================
   حجم صور منتجات صفحات الأقسام فقط
   ===================================================== */

#main-content
salla-products-list[data-testid="store-products-list"]
.s-product-card-image {

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    aspect-ratio: 1 / 1 !important;

    background: #FFFFFF !important;
}


/* توسيط وتصغير المنتج داخل مساحة الصورة */
#main-content
salla-products-list[data-testid="store-products-list"]
.s-product-card-image img {

    width: 82% !important;
    height: 82% !important;

    max-width: 82% !important;
    max-height: 82% !important;

    margin: auto !important;

    padding: 0 !important;

    object-fit: contain !important;
    object-position: center !important;
}
/* إخفاء زر عرض المزيد بصريًا مع بقائه متاحًا للجافاسكربت */
button:has(> span):has(span),
.s-button-btn {
    transition: opacity .2s ease;
}
/* YELLOW SHOP — FINAL CATEGORY CARD BALANCE */

@media (min-width: 769px) {

    #main-content
    salla-products-list[data-testid="store-products-list"]
    .s-product-card-image img {
        width: 80% !important;
        height: 80% !important;

        max-width: 80% !important;
        max-height: 80% !important;

        margin: auto !important;

        object-fit: contain !important;
        object-position: center !important;
    }

    #main-content
    salla-products-list[data-testid="store-products-list"]
    .s-product-card-content-footer {
        top: -36px !important;

        inset-inline-start: 8px !important;
        inset-inline-end: auto !important;
    }

    #main-content
    salla-products-list[data-testid="store-products-list"]
    .s-product-card-content {
        padding-top: 5px !important;
    }

    #main-content
    salla-products-list[data-testid="store-products-list"]
    .s-product-card-content-title a {
        font-size: 12.5px !important;
        line-height: 1.55 !important;

        height: 3.1em !important;
        min-height: 3.1em !important;
    }
}

/* =====================================================
   YELLOW SHOP — RESTORE MOBILE MENU BUTTON
   إعادة زر القائمة في هيدر الجوال فقط
   ===================================================== */

@media (max-width: 768px) {

    /* زر القائمة نفسه إذا كان موجوداً في بنية الثيم */
    .store-header :is(button, a):has([class*="sicon-menu"]),
    .main-header :is(button, a):has([class*="sicon-menu"]),
    .main-nav-container :is(button, a):has([class*="sicon-menu"]),
    .store-header .burger-menu,
    .store-header .menu-trigger,
    .store-header .menu-btn,
    .store-header .nav-trigger,
    .main-header .burger-menu,
    .main-header .menu-trigger,
    .main-header .menu-btn,
    .main-header .nav-trigger {

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        visibility: visible !important;
        opacity: 1 !important;

        width: 42px !important;
        min-width: 42px !important;

        height: 42px !important;
        min-height: 42px !important;

        margin: 0 !important;
        padding: 0 !important;

        position: relative !important;
        inset: auto !important;

        background: transparent !important;
        color: #171717 !important;

        border: 0 !important;
        box-shadow: none !important;

        z-index: 20 !important;
        flex: 0 0 42px !important;
    }

    /* أيقونة الهامبرغر */
    .store-header [class*="sicon-menu"],
    .main-header [class*="sicon-menu"],
    .main-nav-container [class*="sicon-menu"] {

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        visibility: visible !important;
        opacity: 1 !important;

        color: #171717 !important;

        font-size: 25px !important;
        line-height: 1 !important;

        width: auto !important;
        height: auto !important;
    }

    /* لا نعيد القائمة نفسها؛ فقط زر الفتح */
    .main-menu,
    .nav-menu,
    .navbar-nav {
        position: static;
    }
}