/* ==========================================================================
   متجر الشيا الناعمة — ملف CSS منظم ونظيف
   --------------------------------------------------------------------------
   تم تنظيف الملف من:
   - تكرار تنسيق معرض صور المنتج
   - القواعد العامة التي كانت تغيّر كل الحدود والأزرار
   - التعارض بين aspect-ratio: 1/1 و aspect-ratio: auto
   - تنسيقات التقييمات غير المقيدة بصفحتها
   ========================================================================== */


/* ==========================================================================
   01) هوية الألوان العامة
   ========================================================================== */

:root {
  --background: #FFFFFF;
  --foreground: #3E4A2C;
  --primary: #4F5E38;
  --primary-foreground: #FFFFFF;
  --secondary: #EEF1E7;
  --muted: #9C9377;
  --accent: #8A4A2B;
  --border: #D7DEC9;
  --input: #B9C2A8;
  --ring: #4F5E38;

  --highlight-honey: #D9A566;
  --highlight-terracotta: #C67B54;
  --highlight-sage: #A8B48C;
}


/* ألوان التنبيهات والأسعار القديمة */
.text-destructive {
  color: var(--highlight-terracotta) !important;
}

.bg-destructive {
  background-color: var(--highlight-terracotta) !important;
}


/* تلوين أزرار إضافة المنتجات فقط بدل جميع الأزرار الخارجية */
button[data-add-to-cart].btn-outlined,
button[data-add-to-cart-form].btn-outlined,
[data-product-card] .btn-outlined {
  background-color: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border-color: var(--primary) !important;
}

button[data-add-to-cart].btn-outlined:hover,
button[data-add-to-cart-form].btn-outlined:hover,
[data-product-card] .btn-outlined:hover {
  background-color: var(--foreground) !important;
  border-color: var(--foreground) !important;
}

button[data-add-to-cart].btn-outlined svg,
button[data-add-to-cart-form].btn-outlined svg,
[data-product-card] .btn-outlined svg {
  color: var(--primary-foreground) !important;
}


/* ==========================================================================
   02) الواجهة الرئيسية الكاملة
   --------------------------------------------------------------------------
   تمت مطابقة هذه القواعد مع البنية الفعلية للصفحة الرئيسية:
   - الهيدر
   - البنر الرئيسي
   - شريط المزايا
   - قسم باقات الشيا الناعمة
   - قسم أحدث المنتجات
   - آراء العملاء
   - الفوتر
   ========================================================================== */


/* --------------------------------------------------------------------------
   02.1) أساس الصفحة الرئيسية
   -------------------------------------------------------------------------- */

body[data-template="home"] {
  background: var(--background);
  color: var(--foreground);
}

body[data-template="home"] #main {
  overflow: hidden;
}

body[data-template="home"] #main .theme-container,
body[data-template="home"] header .theme-container,
body[data-template="home"] footer .theme-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
}


/* --------------------------------------------------------------------------
   02.2) الهيدر
   -------------------------------------------------------------------------- */

body[data-template="home"] > .sticky {
  z-index: 60;
}

body[data-template="home"] > .sticky > header {
  background: var(--secondary) !important;
  border-color: color-mix(in srgb, var(--border) 45%, transparent) !important;

  box-shadow:
    0 6px 18px rgba(62, 74, 44, 0.05);

  backdrop-filter: none;
}

body[data-template="home"] > .sticky > header nav {
  min-height: 66px;
}

body[data-template="home"] > .sticky > header nav > div:first-of-type {
  min-width: 0;
}

body[data-template="home"] > .sticky > header nav ul a,
body[data-template="home"] > .sticky > header nav ul button {
  color: var(--foreground) !important;
  font-weight: 500;
  text-decoration: none !important;

  transition:
    color 0.2s ease,
    opacity 0.2s ease;
}

body[data-template="home"] > .sticky > header nav ul a:hover,
body[data-template="home"] > .sticky > header nav ul button:hover {
  color: var(--primary) !important;
}


/* --------------------------------------------------------------------------
   02.3) البنر الرئيسي
   -------------------------------------------------------------------------- */

body[data-template="home"]
[section-id="e412bcf4-981b-425c-9597-ee209a593cd9"] {
  width: calc(100% - 32px);
  max-width: 1320px;

  min-height: 470px !important;

  margin: 22px auto 0 !important;
  padding-inline: 0 !important;

  border: 1px solid
    color-mix(in srgb, var(--border) 34%, transparent);

  border-radius: 26px !important;
  overflow: hidden !important;

  box-shadow:
    0 22px 55px rgba(62, 74, 44, 0.12);
}

body[data-template="home"]
[section-id="e412bcf4-981b-425c-9597-ee209a593cd9"]
> .absolute {
  border-radius: inherit;
  overflow: hidden;
}

body[data-template="home"]
[section-id="e412bcf4-981b-425c-9597-ee209a593cd9"]
picture,
body[data-template="home"]
[section-id="e412bcf4-981b-425c-9597-ee209a593cd9"]
picture img {
  width: 100%;
  height: 100%;
}

body[data-template="home"]
[section-id="e412bcf4-981b-425c-9597-ee209a593cd9"]
picture img {
  object-fit: cover !important;
  object-position: center !important;
}


/* --------------------------------------------------------------------------
   02.4) شريط المزايا
   -------------------------------------------------------------------------- */

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"] {
  width: 100%;
  padding: 20px 16px 34px !important;

  background: var(--background) !important;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
.theme-container {
  padding: 18px 24px !important;

  background: linear-gradient(
    90deg,
    #fffdf8 0%,
    #f7f8f1 50%,
    #fffdf8 100%
  ) !important;

  border: 1px solid #e5e9da !important;
  border-radius: 20px !important;

  box-shadow:
    0 10px 28px rgba(62, 74, 44, 0.06);
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
.theme-container
> .grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
.theme-container
> .grid
> div {
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;

  min-width: 0;
  min-height: 76px;

  padding: 8px 24px !important;
  text-align: right !important;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
.theme-container
> .grid
> div:not(:last-child) {
  border-left: 1px solid #dde3d2;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
picture {
  display: flex !important;
  align-items: center;
  justify-content: center;

  width: 54px !important;
  height: 54px !important;

  background: #eef2e5;
  border-radius: 50%;
  overflow: hidden;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
picture img {
  width: 40px !important;
  height: 40px !important;
  object-fit: contain !important;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
.theme-container
> .grid
> div
> div {
  min-width: 0;

  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;

  text-align: right !important;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
h3 {
  margin: 0 !important;

  color: var(--foreground) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
}

body[data-template="home"]
[section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
p {
  margin: 0 !important;

  color: #747966 !important;
  font-size: 12px !important;
  line-height: 1.6 !important;
}


/* --------------------------------------------------------------------------
   02.5) أقسام المنتجات في الصفحة الرئيسية
   -------------------------------------------------------------------------- */

body[data-template="home"] .section-products {
  position: relative;
  padding: 40px 16px 52px !important;
}

body[data-template="home"]
[section-id="daddddac-179e-4b24-9334-e783b623e2b3"] {
  background: linear-gradient(
    180deg,
    #f7f8f2 0%,
    #ffffff 100%
  );
}

body[data-template="home"]
[section-id="e1fe4234-8243-4519-ac55-6cfc4a746b31"] {
  background: var(--background);
}

body[data-template="home"]
.section-products
[data-products-carousel] {
  gap: 24px !important;
}

body[data-template="home"]
.section-products
[data-products-carousel]
> .flex.items-center.justify-between {
  gap: 18px;
  padding-inline: 4px;
}


/* عنوان قسم المنتجات */
body[data-template="home"]
.section-products
[data-products-carousel]
h2 {
  position: relative;

  margin: 0 !important;
  padding-inline-start: 16px;

  color: var(--foreground) !important;
  font-size: clamp(24px, 2vw, 31px) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.02em;
}

body[data-template="home"]
.section-products
[data-products-carousel]
h2::before {
  content: "";

  position: absolute;
  inset-block: 5px;
  inset-inline-start: 0;

  width: 4px;

  background: var(--primary);
  border-radius: 999px;
}


/* رابط المزيد */
body[data-template="home"]
.section-products
[data-products-carousel]
> .flex.items-center.justify-between
> a {
  min-height: 42px;
  padding: 8px 14px !important;

  display: inline-flex !important;
  align-items: center;
  gap: 8px;

  color: var(--primary) !important;
  background: var(--background);

  border: 1px solid
    color-mix(in srgb, var(--border) 45%, transparent);

  border-radius: 999px;

  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;

  transition:
    transform 0.2s ease,
    background-color 0.2s ease;
}

body[data-template="home"]
.section-products
[data-products-carousel]
> .flex.items-center.justify-between
> a:hover {
  transform: translateX(-2px);
  background: var(--secondary);
}


/* السلايدر */
body[data-template="home"]
.section-products
.products-embla {
  --slide-spacing: 18px !important;

  margin-inline: 0 !important;
}

body[data-template="home"]
.section-products
.products-embla__viewport {
  padding: 8px 5px 16px !important;
}

body[data-template="home"]
.section-products
.products-embla__container {
  align-items: stretch !important;
}

body[data-template="home"]
.section-products
.products-embla__slide {
  height: auto !important;
}


/* بطاقة المنتج */
body[data-template="home"]
.section-products
[data-product-card] {
  height: 100% !important;
  min-width: 0;

  gap: 0 !important;

  padding: 9px !important;

  background: var(--background) !important;

  border: 1px solid
    color-mix(in srgb, var(--border) 42%, transparent) !important;

  border-radius: 18px !important;
  overflow: hidden !important;

  box-shadow:
    0 8px 24px rgba(62, 74, 44, 0.06);

  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease;
}

@media (hover: hover) {
  body[data-template="home"]
  .section-products
  [data-product-card]:hover {
    transform: translateY(-6px);

    border-color:
      color-mix(in srgb, var(--primary) 35%, var(--border)) !important;

    box-shadow:
      0 18px 38px rgba(62, 74, 44, 0.12);
  }
}


/* صورة بطاقة المنتج */
body[data-template="home"]
.section-products
[data-product-card]
> a:first-child {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;

  margin: 0 !important;

  background: #f7f5ee !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}

body[data-template="home"]
.section-products
[data-product-card]
> a:first-child
> img {
  display: block !important;

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

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

  transition: transform 0.35s ease;
}

@media (hover: hover) {
  body[data-template="home"]
  .section-products
  [data-product-card]:hover
  > a:first-child
  > img {
    transform: scale(1.025);
  }
}


/* شارات المنتجات */
body[data-template="home"]
.section-products
[data-product-card]
> a:first-child
> .absolute.top-4 {
  top: 10px !important;
  inset-inline-end: 10px !important;
  inset-inline-start: auto !important;

  max-width: calc(100% - 64px);
  gap: 6px !important;
}

body[data-template="home"]
.section-products
[data-product-card]
> a:first-child
> .absolute.top-4
> span {
  max-width: 100%;

  padding: 5px 9px !important;
  border-radius: 999px !important;

  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  overflow: hidden;
  text-overflow: ellipsis;
}


/* زر المفضلة */
body[data-template="home"]
.section-products
[data-product-card]
[data-wishlist-btn] {
  inset-block-end: 10px !important;
  inset-inline-start: 10px !important;
  inset-inline-end: auto !important;

  width: 42px !important;
  height: 42px !important;

  color: var(--primary) !important;
  background:
    color-mix(in srgb, var(--background) 90%, transparent) !important;

  border: 1px solid
    color-mix(in srgb, var(--border) 42%, transparent) !important;

  border-radius: 50% !important;

  box-shadow:
    0 6px 18px rgba(62, 74, 44, 0.1);

  backdrop-filter: blur(8px);
}


/* منطقة معلومات المنتج */
body[data-template="home"]
.section-products
[data-product-card]
> a:first-child
+ div {
  flex: 1 1 auto;

  min-width: 0;
  padding: 15px 9px 10px !important;

  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}


/* اسم المنتج */
body[data-template="home"]
.section-products
[data-product-card]
h3,
body[data-template="home"]
.section-products
[data-product-card]
h4 {
  min-height: 48px;
  margin: 0 !important;

  color: var(--foreground) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;

  overflow: hidden;
}

body[data-template="home"]
.section-products
[data-product-card]
h3 a,
body[data-template="home"]
.section-products
[data-product-card]
h4 a {
  color: inherit !important;
  text-decoration: none !important;
}


/* التقييم */
body[data-template="home"]
.section-products
[data-product-card]
.text-warning {
  color: #e6aa18 !important;
}

body[data-template="home"]
.section-products
[data-product-card]
.text-warning
svg,
body[data-template="home"]
.section-products
[data-product-card]
svg.text-warning {
  width: 15px !important;
  height: 15px !important;
}


/* السعر */
body[data-template="home"]
.section-products
[data-product-card]
[data-product-price] {
  color: var(--primary) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}

body[data-template="home"]
.section-products
[data-product-card]
[data-product-price-old] {
  font-size: 13px !important;
  opacity: 0.72;
}

body[data-template="home"]
.section-products
[data-product-card]
[data-product-discount] {
  padding: 5px 8px !important;
  border-radius: 999px !important;

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


/* الجزء السفلي من البطاقة */
body[data-template="home"]
.section-products
[data-product-card]
> .mt-auto {
  width: 100% !important;

  margin-top: auto !important;
  padding: 0 9px 9px !important;
}


/* زر أضف للسلة */
body[data-template="home"]
.section-products
[data-product-card]
[data-add-to-cart] {
  width: 100% !important;
  min-height: 50px !important;

  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  border-color: var(--primary) !important;
  border-radius: 12px !important;

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

body[data-template="home"]
.section-products
[data-product-card]
[data-quantity-section] {
  width: 100% !important;
}

body[data-template="home"]
.section-products
[data-product-card]
.qty-input {
  width: 100% !important;
  min-height: 50px;

  background: var(--background) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
}

body[data-template="home"]
.section-products
[data-product-card]
.qty-input-btn {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;

  color: var(--primary) !important;
}

body[data-template="home"]
.section-products
[data-product-card]
.qty-input-field {
  font-size: 15px !important;
  font-weight: 700 !important;
}


/* أسهم السلايدر */
body[data-template="home"]
.section-products
[data-carousel-prev],
body[data-template="home"]
.section-products
[data-carousel-next] {
  width: 42px !important;
  height: 42px !important;
  padding: 9px !important;

  color: var(--primary) !important;
  background: var(--background) !important;

  border: 1px solid
    color-mix(in srgb, var(--border) 42%, transparent) !important;

  border-radius: 50% !important;

  box-shadow:
    0 6px 16px rgba(62, 74, 44, 0.08);
}


/* --------------------------------------------------------------------------
   02.6) آراء العملاء
   -------------------------------------------------------------------------- */

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"] {
  padding: 48px 16px 58px !important;

  background: #fbfaf6 !important;
  border-top: 1px solid #f0eee6;
  border-bottom: 1px solid #ece9df;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
.theme-container {
  max-width: 1320px !important;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
h2 {
  width: 100%;
  margin: 0 0 28px !important;

  color: var(--foreground) !important;
  font-size: clamp(25px, 2vw, 31px) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
h2::after {
  content: "تجارب حقيقية من عميلات الشيا الناعمة";

  display: block;
  margin-top: 8px;

  color: #777d6d;
  font-size: 14px;
  font-weight: 400;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
.embla__viewport {
  padding: 8px 5px 16px !important;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
.embla__container {
  align-items: stretch !important;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article {
  position: relative;

  min-height: 250px;
  padding: 28px 22px 22px !important;

  background: var(--background) !important;

  border: 1px solid
    color-mix(in srgb, var(--border) 42%, transparent) !important;

  border-radius: 18px !important;

  box-shadow:
    0 10px 28px rgba(62, 74, 44, 0.07);

  overflow: hidden;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article::before {
  content: "❝";

  position: absolute;
  top: 18px;
  right: 18px;

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

  width: 40px;
  height: 40px;

  background: #eef2e5;
  color: var(--primary);

  border-radius: 50%;

  font-size: 23px;
  font-weight: 700;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article
> div:first-child {
  justify-content: flex-end !important;
  padding-right: 50px;
  margin-bottom: 16px;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article
> div:first-child
svg {
  width: 18px !important;
  height: 18px !important;
  color: #e6aa18 !important;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article
p {
  margin: 6px 0 20px !important;

  color: #3f4635 !important;
  font-size: 14px !important;
  line-height: 1.9 !important;
  text-align: right !important;
}

body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article
h3 {
  margin-top: auto !important;
  padding-top: 14px;

  color: var(--foreground) !important;

  border-top: 1px solid #edf0e7;

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


/* --------------------------------------------------------------------------
   02.7) الفوتر
   -------------------------------------------------------------------------- */

body[data-template="home"] footer {
  background: color-mix(
    in srgb,
    var(--primary) 13%,
    var(--background)
  ) !important;

  border-top: 1px solid color-mix(
    in srgb,
    var(--primary) 22%,
    var(--border)
  ) !important;
}

body[data-template="home"] footer a {
  color: var(--foreground) !important;
  text-decoration: none !important;
}

body[data-template="home"] footer a:hover {
  color: var(--primary) !important;
}


/* --------------------------------------------------------------------------
   02.8) التابلت
   -------------------------------------------------------------------------- */

@media (min-width: 768px) and (max-width: 1023px) {
  body[data-template="home"]
  [section-id="e412bcf4-981b-425c-9597-ee209a593cd9"] {
    min-height: 430px !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid
  > div:nth-child(2) {
    border-left: 0;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid
  > div:nth-child(-n + 2) {
    border-bottom: 1px solid #dde3d2;
  }

  body[data-template="home"]
  [section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
  .embla__slide {
    flex-basis: 50% !important;
  }
}


/* --------------------------------------------------------------------------
   02.9) الجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template="home"] > .sticky > header {
    padding-inline: 12px !important;
  }

  body[data-template="home"]
  [section-id="e412bcf4-981b-425c-9597-ee209a593cd9"] {
    width: calc(100% - 24px);

    min-height: 330px !important;

    margin-top: 12px !important;
    border-radius: 18px !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"] {
    padding: 14px 12px 24px !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container {
    padding: 8px !important;
    border-radius: 16px !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid
  > div {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 8px !important;

    min-height: 142px;

    padding: 14px 8px !important;
    text-align: center !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid
  > div
  > div {
    align-items: center !important;
    text-align: center !important;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid
  > div:nth-child(2) {
    border-left: 0;
  }

  body[data-template="home"]
  [section-id="fd42a7ba-04ad-481a-bd15-75fc942ba53b"]
  .theme-container
  > .grid
  > div:nth-child(-n + 2) {
    border-bottom: 1px solid #dde3d2;
  }

  body[data-template="home"]
  .section-products {
    padding: 28px 12px 38px !important;
  }

  body[data-template="home"]
  .section-products
  [data-products-carousel]
  h2 {
    padding-inline-start: 13px;
    font-size: 21px !important;
  }

  body[data-template="home"]
  .section-products
  [data-products-carousel]
  > .flex.items-center.justify-between
  > a {
    min-height: 38px;
    padding: 7px 11px !important;
    font-size: 12px !important;
  }

  body[data-template="home"]
  .section-products
  .products-embla {
    --slide-size: 84% !important;
    --slide-spacing: 12px !important;
  }

  body[data-template="home"]
  .section-products
  [data-product-card] {
    border-radius: 16px !important;
  }

  body[data-template="home"]
  .section-products
  [data-product-card]
  h3,
  body[data-template="home"]
  .section-products
  [data-product-card]
  h4 {
    min-height: 46px;
    font-size: 14px !important;
  }

  body[data-template="home"]
  [section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"] {
    padding: 38px 12px 44px !important;
  }

  body[data-template="home"]
  [section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
  .embla__slide {
    flex-basis: 88% !important;
  }

  body[data-template="home"]
  [section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
  article {
    min-height: 230px;
    padding: 24px 18px 18px !important;
  }
}


/* ==========================================================================
   05) صفحة تفاصيل المنتج
   ========================================================================== */

body[data-template="product_details"] {
  --ss-bg: var(--background);
  --ss-text: var(--foreground);
  --ss-primary: var(--primary);
  --ss-primary-text: var(--primary-foreground);
  --ss-secondary: var(--secondary);
  --ss-muted: var(--muted);
  --ss-accent: var(--accent);
  --ss-border: var(--border);

  --ss-primary-soft: color-mix(
    in srgb,
    var(--primary) 10%,
    var(--background)
  );

  --ss-border-soft: color-mix(
    in srgb,
    var(--border) 45%,
    transparent
  );

  --ss-shadow:
    0 18px 50px color-mix(in srgb, var(--primary) 9%, transparent),
    0 3px 12px color-mix(in srgb, var(--foreground) 5%, transparent);
}

body[data-template="product_details"] main#main {
  padding-bottom: 95px;
}

body[data-template="product_details"]
main#main
.theme-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
}


/* مسار التنقل */
body[data-template="product_details"]
nav[aria-label="breadcrumb"] {
  padding: 12px 16px;

  background: var(--ss-primary-soft);
  border: 1px solid var(--ss-border-soft);
  border-radius: 14px;
}

body[data-template="product_details"]
nav[aria-label="breadcrumb"]
ol {
  gap: 10px !important;
}

body[data-template="product_details"]
nav[aria-label="breadcrumb"]
a {
  color: var(--ss-muted) !important;
  text-decoration: none !important;
}

body[data-template="product_details"]
nav[aria-label="breadcrumb"]
a:hover {
  color: var(--ss-primary) !important;
}

body[data-template="product_details"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--ss-text) !important;
  font-weight: 700 !important;
}


/* توزيع الصورة والمعلومات */
body[data-template="product_details"]
#product-main-section {
  align-items: start !important;
  gap: clamp(24px, 4vw, 54px) !important;
}

@media (min-width: 1024px) {
  body[data-template="product_details"]
  #product-main-section {
    grid-template-columns:
      minmax(0, 1.08fr)
      minmax(390px, 0.92fr) !important;
  }
}


/* معرض صور المنتج — نسخة واحدة فقط */
body[data-template="product_details"]
.product-gallery-column {
  min-width: 0;
}

body[data-template="product_details"] .product-gallery {
  width: 100% !important;
  max-width: 100% !important;
  padding: 10px !important;

  background: var(--ss-secondary) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 22px !important;

  overflow: hidden !important;
  box-shadow: var(--ss-shadow);
}

body[data-template="product_details"]
.product-gallery__container {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;

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

body[data-template="product_details"]
.product-gallery__slide {
  position: relative !important;

  flex: 0 0 100% !important;

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

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

  background: var(--ss-bg) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}

body[data-template="product_details"]
.product-gallery__slide
img {
  display: block !important;

  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 760px !important;

  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center !important;

  background: var(--ss-bg) !important;
  border-radius: 16px !important;
}

body[data-template="product_details"]
.product-gallery__slide
img.object-cover {
  object-fit: contain !important;
}


/* بطاقة معلومات المنتج */
body[data-template="product_details"]
.product-details-column {
  min-width: 0;
  gap: 20px !important;

  padding: clamp(22px, 3vw, 34px) !important;

  background: var(--ss-bg) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 22px !important;
  box-shadow: var(--ss-shadow);
}

body[data-template="product_details"]
.product-details-column
#header
h1 {
  margin: 0 !important;

  color: var(--ss-text) !important;
  font-size: clamp(26px, 2.2vw, 36px) !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  letter-spacing: -0.02em;
}

body[data-template="product_details"]
.product-details-column
#header
h1
+ div {
  margin-top: 8px !important;
  flex-wrap: wrap;
}

body[data-template="product_details"]
.product-details-column
#header
h1
+ div
svg {
  width: 18px !important;
  height: 18px !important;
}

body[data-template="product_details"]
.product-details-column
#header
h1
+ div
a {
  color: var(--ss-muted) !important;
  font-size: 13px !important;
  text-underline-offset: 4px;
}


/* الشارات */
body[data-template="product_details"]
#product-badges {
  gap: 8px !important;
  margin-top: 14px !important;
}

body[data-template="product_details"]
#product-badges
> span {
  min-height: 32px;
  padding: 6px 12px !important;
  border-radius: 999px !important;

  font-size: 12px !important;
  font-weight: 600 !important;
}


/* السعر */
body[data-template="product_details"]
[data-product-price] {
  color: var(--ss-primary) !important;
  font-size: clamp(27px, 2.4vw, 36px) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

body[data-template="product_details"]
[data-product-price-old] {
  font-size: 15px !important;
  opacity: 0.72;
}

body[data-template="product_details"]
[data-product-discount] {
  padding: 6px 10px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}

body[data-template="product_details"]
[data-product-sku-wrapper] {
  width: 100%;
  margin-top: 8px;

  color: var(--ss-muted) !important;
  font-size: 11px !important;
  opacity: 0.68;

  direction: ltr;
  text-align: right;
}


/* الوصف المختصر */
body[data-template="product_details"]
.product-details-column
> .prose {
  margin: 0 !important;
  padding: 16px 18px !important;

  background: var(--ss-primary-soft) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 15px !important;

  color: var(--ss-text) !important;
  font-size: 14px !important;
  line-height: 1.95 !important;
}

body[data-template="product_details"]
.product-details-column
> .prose
p {
  margin-block: 0 !important;
}

body[data-template="product_details"]
.product-details-column
> .prose
p
+ p {
  margin-top: 6px !important;
}

body[data-template="product_details"]
.product-details-column
> .prose
strong {
  color: var(--ss-text) !important;
  font-weight: 600 !important;
}


/* الكمية */
body[data-template="product_details"]
#product-form
[data-quantity-wrapper] {
  grid-template-columns: auto 1fr !important;
  align-items: center !important;
  gap: 18px !important;

  padding: 14px 16px;

  background: var(--ss-secondary);
  border: 1px solid var(--ss-border-soft);
  border-radius: 14px;
}

body[data-template="product_details"]
#product-form
[data-quantity-wrapper]
.form-label {
  margin: 0 !important;

  color: var(--ss-text) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

body[data-template="product_details"]
#product-form
[data-quantity-wrapper]
.qty-input {
  justify-self: end;
  min-width: 170px;
  height: 48px;

  background: var(--ss-bg);
  border-color: var(--ss-border) !important;
  border-radius: 12px !important;
}

body[data-template="product_details"]
#product-form
.qty-input-btn {
  width: 48px !important;
  height: 46px !important;
}

body[data-template="product_details"]
#product-form
.qty-input-field {
  font-size: 16px !important;
  font-weight: 600 !important;
}


/* زر إضافة المنتج */
body[data-template="product_details"]
[data-add-to-cart-form="product-form"] {
  min-height: 58px !important;

  background: var(--ss-primary) !important;
  color: var(--ss-primary-text) !important;
  border-color: var(--ss-primary) !important;
  border-radius: 14px !important;

  font-size: 17px !important;
  font-weight: 700 !important;

  box-shadow:
    0 10px 25px color-mix(in srgb, var(--primary) 22%, transparent);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

body[data-template="product_details"]
[data-add-to-cart-form="product-form"]:hover {
  transform: translateY(-2px);

  box-shadow:
    0 14px 30px color-mix(in srgb, var(--primary) 28%, transparent);
}


/* زر المفضلة */
body[data-template="product_details"]
[data-product-actions]
[data-wishlist-btn] {
  width: 58px !important;
  height: 58px !important;
  flex: 0 0 58px;

  background: var(--ss-bg) !important;
  color: var(--ss-primary) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 14px !important;
}


/* تمارا وتابي */
body[data-template="product_details"] tamara-widget,
body[data-template="product_details"] .tabby-product-widget,
body[data-template="product_details"] #apple_pay_quick_checkout_widget {
  display: block;
  width: 100%;

  margin-top: 12px !important;
  padding: 12px 14px !important;

  background: var(--ss-bg);
  border: 1px solid var(--ss-border-soft);
  border-radius: 14px !important;

  overflow: hidden;
}


/* مشاركة المنتج */
body[data-template="product_details"]
#product-form
> .border-border-light {
  margin-top: 18px !important;
  padding-top: 16px !important;
  justify-content: space-between;

  border-color: var(--ss-border-soft) !important;
}

body[data-template="product_details"]
#product-form
> .border-border-light
a,
body[data-template="product_details"]
#product-form
> .border-border-light
button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 38px;
  height: 38px;

  background: var(--ss-secondary);
  border-radius: 50%;
}


/* ==========================================================================
   06) تفاصيل المنتج
   ========================================================================== */

body[data-template="product_details"]
#additional-info {
  width: 100%;
  max-width: 1320px;

  margin: 34px auto 0 !important;
  gap: 18px !important;
}

body[data-template="product_details"]
#additional-info
> div {
  overflow: hidden;

  background: var(--ss-bg);
  border: 1px solid var(--ss-border-soft);
  border-radius: 18px;

  box-shadow:
    0 10px 30px color-mix(in srgb, var(--foreground) 4%, transparent);
}

body[data-template="product_details"]
#additional-info
button[commandfor="features-details"] {
  min-height: 64px;
  padding: 10px 18px !important;

  background: var(--ss-primary-soft) !important;
  border-radius: 0 !important;
}

body[data-template="product_details"]
#additional-info
button[commandfor="features-details"]
> span:first-child {
  color: var(--ss-text) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}

body[data-template="product_details"]
#additional-info
button[commandfor="features-details"]
> span:last-child {
  background: var(--ss-bg) !important;
  color: var(--ss-primary) !important;
}

body[data-template="product_details"]
#features-details
> div {
  margin-top: 0 !important;
  padding: clamp(22px, 4vw, 38px) !important;
}

body[data-template="product_details"]
#features-details
.prose {
  width: 100%;
  max-width: 1050px !important;
  margin-inline: auto !important;

  color: var(--ss-text) !important;
  font-size: 15px !important;
  line-height: 2.1 !important;
  text-align: right !important;
}

body[data-template="product_details"]
#features-details
.prose
p {
  margin-block: 10px !important;
}

body[data-template="product_details"]
#features-details
.prose
strong {
  color: var(--ss-primary) !important;
  font-weight: 700 !important;
}


/* ==========================================================================
   07) تقييمات صفحة المنتج
   ========================================================================== */

body[data-template="product_details"] #reviews {
  width: 100%;
  max-width: 1320px;

  margin: 44px auto 0 !important;
  scroll-margin-top: 110px;
}

body[data-template="product_details"]
#reviews
> .mt-6 {
  display: flex !important;
  flex-direction: column !important;

  width: 100% !important;
  gap: 18px !important;
  margin-top: 0 !important;
}

body[data-template="product_details"]
#reviews
> .mt-6
> h2 {
  width: 100%;
  margin: 0 0 4px !important;

  color: var(--ss-text) !important;
  font-size: clamp(24px, 2.2vw, 32px) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

body[data-template="product_details"]
#reviews
> .mt-6
> h2
+ div {
  display: grid !important;
  grid-template-columns: minmax(210px, 280px) minmax(0, 1fr) !important;
  align-items: stretch !important;

  width: 100% !important;
  padding: clamp(20px, 3vw, 30px) !important;

  background: var(--ss-primary-soft) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 18px !important;
}

body[data-template="product_details"]
#reviews
> .mt-6
> h2
+ div
> div:first-child {
  min-width: 0 !important;
  padding: 18px !important;

  background: var(--ss-bg) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 14px !important;
}

body[data-template="product_details"]
#reviews
[data-login-redirect],
body[data-template="product_details"]
#reviews
a[href*="/reviews/new"] {
  min-height: 48px;

  background: var(--ss-primary) !important;
  color: var(--ss-primary-text) !important;
  border-color: var(--ss-primary) !important;
  border-radius: 12px !important;

  font-weight: 700 !important;
}

body[data-template="product_details"]
#reviews
> .mt-6
> .border-border.border-y {
  width: 100% !important;
  padding: 13px 16px !important;

  background: var(--ss-secondary) !important;
  border: 0 !important;
  border-radius: 12px !important;
}

body[data-template="product_details"]
#reviews
> .mt-6
> .flex.flex-col.gap-2 {
  display: flex !important;
  flex-direction: column !important;

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

  gap: 14px !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body[data-template="product_details"]
#reviews
> .mt-6
> .flex.flex-col.gap-2
> .flex.w-full.flex-col.gap-1 {
  width: 100% !important;
  min-width: 0 !important;

  padding: 20px 22px !important;

  background: var(--ss-bg) !important;
  border: 1px solid var(--ss-border-soft) !important;
  border-radius: 16px !important;

  box-shadow:
    0 8px 24px color-mix(in srgb, var(--foreground) 4%, transparent);
}

body[data-template="product_details"]
#reviews
p.font-semibold {
  color: var(--ss-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body[data-template="product_details"]
#reviews
[data-time-ago-date] {
  margin-inline-start: auto;

  color: var(--ss-muted) !important;
  font-size: 11px !important;
  opacity: 0.72;

  direction: ltr;
  unicode-bidi: isolate;
}

body[data-template="product_details"]
#reviews
> .mt-6
> .flex.flex-col.gap-2
> .flex.w-full.flex-col.gap-1
> p {
  width: 100%;
  margin-top: 10px !important;

  color: var(--ss-text) !important;
  font-size: 14px !important;
  line-height: 1.9 !important;
  text-align: right !important;

  overflow-wrap: anywhere;
}

body[data-template="product_details"]
#reviews
.border-foreground.ms-6.mt-3 {
  width: 100% !important;

  margin: 16px 0 0 !important;
  padding: 14px 16px !important;

  background: var(--ss-primary-soft) !important;
  border: 0 !important;
  border-radius: 13px !important;
}

body[data-template="product_details"]
#reviews
.border-foreground.ms-6.mt-3
img {
  max-width: 72px;
  height: 30px !important;
  object-fit: contain !important;
}

body[data-template="product_details"]
#reviews
.flex.justify-end {
  display: flex !important;
  justify-content: center !important;

  width: 100% !important;
  margin-top: 4px !important;
}

body[data-template="product_details"]
#reviews
.flex.justify-end
> a {
  width: auto !important;
  min-width: 180px;
  min-height: 46px;

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

  padding: 10px 22px !important;

  background: var(--ss-primary) !important;
  color: var(--ss-primary-text) !important;
  border-color: var(--ss-primary) !important;
  border-radius: 12px !important;

  font-weight: 700 !important;
}


/* ==========================================================================
   08) المنتجات المقترحة في صفحة المنتج
   ========================================================================== */

body[data-template="product_details"]
[data-products-carousel="related-products"] {
  margin-top: 18px;
}

body[data-template="product_details"]
[data-products-carousel="related-products"]
[data-product-card] {
  padding: 10px;

  background: var(--ss-bg);
  border: 1px solid var(--ss-border-soft);
  border-radius: 16px;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

body[data-template="product_details"]
[data-products-carousel="related-products"]
[data-product-card]:hover {
  transform: translateY(-4px);

  box-shadow:
    0 12px 30px color-mix(in srgb, var(--primary) 9%, transparent);
}


/* ==========================================================================
   09) شريط الشراء الثابت
   ========================================================================== */

body[data-template="product_details"] #sticky-cta {
  padding-block: 10px !important;

  background: var(--ss-secondary) !important;
  border-color: var(--ss-border-soft) !important;

  box-shadow:
    0 -10px 32px color-mix(in srgb, var(--foreground) 8%, transparent);

  backdrop-filter: blur(12px);
}

body[data-template="product_details"]
#sticky-cta
[data-sticky-cta-image] {
  object-fit: contain !important;
  background: var(--ss-bg);
}

body[data-template="product_details"]
#sticky-cta
[data-sticky-cta-price] {
  color: var(--ss-primary) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}

body[data-template="product_details"]
#sticky-cta
[data-sticky-cta-add-to-cart] {
  min-width: 165px;
  min-height: 50px;

  background: var(--ss-primary) !important;
  color: var(--ss-primary-text) !important;
  border-color: var(--ss-primary) !important;
  border-radius: 12px !important;

  font-weight: 700 !important;
}


/* ==========================================================================
   10) استجابة صفحة المنتج للجوال
   ========================================================================== */

@media (max-width: 1023px) {
  body[data-template="product_details"]
  #product-main-section {
    gap: 24px !important;
  }

  body[data-template="product_details"]
  .product-details-column {
    padding: 22px !important;
  }

  body[data-template="product_details"]
  .product-gallery__slide
  img {
    max-height: none !important;
  }
}

@media (max-width: 767px) {
  body[data-template="product_details"] main#main {
    padding-bottom: 82px;
  }

  body[data-template="product_details"]
  main#main
  > section {
    padding-inline: 12px !important;
  }

  body[data-template="product_details"]
  nav[aria-label="breadcrumb"] {
    overflow-x: auto;
    padding: 10px 12px;
    border-radius: 12px;
  }

  body[data-template="product_details"]
  nav[aria-label="breadcrumb"]
  ol {
    flex-wrap: nowrap !important;
    width: max-content;
  }

  body[data-template="product_details"]
  .product-gallery {
    padding: 6px !important;
    border-radius: 16px !important;
  }

  body[data-template="product_details"]
  .product-gallery__slide,
  body[data-template="product_details"]
  .product-gallery__slide
  img {
    border-radius: 12px !important;
  }

  body[data-template="product_details"]
  .product-details-column {
    padding: 18px !important;
    border-radius: 16px !important;
  }

  body[data-template="product_details"]
  .product-details-column
  #header
  h1 {
    font-size: 25px !important;
  }

  body[data-template="product_details"]
  [data-product-price] {
    font-size: 29px !important;
  }

  body[data-template="product_details"]
  #product-form
  [data-quantity-wrapper] {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  body[data-template="product_details"]
  #product-form
  [data-quantity-wrapper]
  .qty-input {
    width: 100% !important;
    min-width: 0;
    justify-self: stretch;
  }

  body[data-template="product_details"]
  #features-details
  > div {
    padding: 18px !important;
  }

  body[data-template="product_details"]
  #features-details
  .prose {
    font-size: 14px !important;
    line-height: 2 !important;
  }

  body[data-template="product_details"]
  #reviews
  > .mt-6
  > h2
  + div {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 16px !important;
  }

  body[data-template="product_details"]
  #reviews
  .flex.justify-end
  > a {
    width: 100% !important;
  }

  body[data-template="product_details"] #sticky-cta {
    padding: 8px 10px !important;
  }

  body[data-template="product_details"]
  #sticky-cta
  > .theme-container
  > .flex
  > div:first-child {
    display: none !important;
  }

  body[data-template="product_details"]
  #sticky-cta
  [data-sticky-cta-name] {
    max-width: 115px;
  }

  body[data-template="product_details"]
  #sticky-cta
  [data-sticky-cta-price] {
    font-size: 15px !important;
  }

  body[data-template="product_details"]
  #sticky-cta
  [data-sticky-cta-add-to-cart] {
    min-width: 124px;
    min-height: 48px;
    padding-inline: 14px !important;
  }
}


/* ==========================================================================
   11) تقليل الحركة لمن يفضّل ذلك
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
  body[data-template="home"] *,
  body[data-template="product_details"] *,
  body[data-template="home"] *::before,
  body[data-template="home"] *::after,
  body[data-template="product_details"] *::before,
  body[data-template="product_details"] *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
/* ==========================================================================
   12) صفحة جميع المنتجات
   --------------------------------------------------------------------------
   الصفحة المستهدفة:
   body[data-template="list_products"]

   يشمل:
   - الهيدر
   - مسار التنقل
   - شريط الفلاتر والترتيب
   - شبكة المنتجات
   - بطاقات المنتجات
   - عرض القائمة
   - درج الفلاتر على الجوال
   - الترقيم أسفل الصفحة
   ========================================================================== */


/* --------------------------------------------------------------------------
   12.1) متغيرات الصفحة والأساس العام
   -------------------------------------------------------------------------- */

body[data-template="list_products"] {
  --lp-bg: var(--background);
  --lp-text: var(--foreground);
  --lp-primary: var(--primary);
  --lp-primary-text: var(--primary-foreground);
  --lp-secondary: var(--secondary);
  --lp-muted: var(--muted);
  --lp-border: var(--border);

  --lp-soft: color-mix(
    in srgb,
    var(--primary) 8%,
    var(--background)
  );

  --lp-soft-strong: color-mix(
    in srgb,
    var(--primary) 13%,
    var(--background)
  );

  --lp-border-soft: color-mix(
    in srgb,
    var(--border) 42%,
    transparent
  );

  --lp-shadow:
    0 16px 40px color-mix(in srgb, var(--primary) 8%, transparent),
    0 3px 10px color-mix(in srgb, var(--foreground) 4%, transparent);

  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--secondary) 52%, var(--background)) 0,
      var(--background) 340px
    );

  color: var(--lp-text);
}

body[data-template="list_products"] #main {
  min-height: 70vh;
}

body[data-template="list_products"] .theme-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
}


/* --------------------------------------------------------------------------
   12.2) الهيدر
   -------------------------------------------------------------------------- */

body[data-template="list_products"] > .sticky {
  z-index: 60;
}

body[data-template="list_products"] > .sticky > header {
  background: var(--secondary) !important;
  border-color: var(--lp-border-soft) !important;

  box-shadow:
    0 6px 18px color-mix(in srgb, var(--foreground) 5%, transparent);

  backdrop-filter: none;
}

body[data-template="list_products"] > .sticky > header nav {
  min-height: 66px;
}

body[data-template="list_products"] > .sticky > header nav ul a,
body[data-template="list_products"] > .sticky > header nav ul button {
  color: var(--lp-text) !important;
  font-weight: 500;
  text-decoration: none !important;

  transition:
    color 0.2s ease,
    opacity 0.2s ease;
}

body[data-template="list_products"] > .sticky > header nav ul a:hover,
body[data-template="list_products"] > .sticky > header nav ul button:hover {
  color: var(--lp-primary) !important;
}


/* --------------------------------------------------------------------------
   12.3) مسار التنقل كرأس للصفحة
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
#main
> section:first-child {
  padding-top: 28px !important;
  padding-bottom: 18px !important;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"] {
  position: relative;

  min-height: 108px;
  padding: 22px 26px !important;

  display: flex;
  align-items: flex-end;

  background:
    linear-gradient(
      135deg,
      var(--lp-soft-strong) 0%,
      color-mix(in srgb, var(--secondary) 76%, var(--background)) 100%
    );

  border: 1px solid var(--lp-border-soft);
  border-radius: 22px;

  box-shadow:
    0 12px 32px color-mix(in srgb, var(--primary) 7%, transparent);

  overflow: hidden;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]::after {
  content: "";

  position: absolute;
  inset-inline-end: -52px;
  inset-block-start: -72px;

  width: 190px;
  height: 190px;

  border: 34px solid
    color-mix(in srgb, var(--primary) 7%, transparent);

  border-radius: 50%;
  pointer-events: none;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]
ol {
  position: relative;
  z-index: 1;

  gap: 10px !important;
  align-items: baseline !important;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]
a {
  color: var(--lp-muted) !important;

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

  text-decoration: none !important;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]
a:hover {
  color: var(--lp-primary) !important;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]
li[role="presentation"] {
  color: color-mix(in srgb, var(--lp-muted) 70%, transparent);
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--lp-text) !important;

  font-size: clamp(25px, 2.4vw, 36px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;

  text-decoration: none !important;
}


/* --------------------------------------------------------------------------
   12.4) محتوى المنتجات
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
#main
> section:nth-child(2) {
  padding-top: 10px !important;
}

body[data-template="list_products"] #products-content {
  gap: 28px !important;
}


/* --------------------------------------------------------------------------
   12.5) شريط الفلاتر والترتيب
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
#products-content
> .flex.flex-col.gap-4 {
  gap: 16px !important;

  padding: 18px 20px !important;

  background: var(--lp-bg);
  border: 1px solid var(--lp-border-soft);
  border-radius: 18px;

  box-shadow:
    0 10px 28px color-mix(in srgb, var(--foreground) 5%, transparent);
}

body[data-template="list_products"]
#products-content
> .flex.flex-col.gap-4
> .flex.flex-wrap.items-center.justify-between {
  gap: 16px !important;
}


/* عبارة الفلاتر وعدد المنتجات */
body[data-template="list_products"]
#products-content
> .flex.flex-col.gap-4
.text-muted-foreground,
body[data-template="list_products"]
#products-content
> .flex.flex-col.gap-4
.text-muted {
  color: color-mix(in srgb, var(--lp-muted) 88%, var(--lp-text)) !important;
}


/* أزرار التوفر والسعر والترتيب */
body[data-template="list_products"]
#products-content
button[popovertarget="availability-popover"],
body[data-template="list_products"]
#products-content
button[popovertarget="price-popover"],
body[data-template="list_products"]
#sort-select
> button {
  min-height: 42px;

  padding: 8px 14px !important;

  background: var(--lp-soft) !important;
  color: var(--lp-text) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 999px !important;

  text-decoration: none !important;

  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}

body[data-template="list_products"]
#products-content
button[popovertarget="availability-popover"]:hover,
body[data-template="list_products"]
#products-content
button[popovertarget="price-popover"]:hover,
body[data-template="list_products"]
#sort-select
> button:hover {
  background: var(--lp-soft-strong) !important;

  border-color:
    color-mix(in srgb, var(--primary) 26%, var(--border)) !important;

  transform: translateY(-1px);
}


/* النوافذ الصغيرة للفلاتر والترتيب */
body[data-template="list_products"] #availability-popover,
body[data-template="list_products"] #price-popover,
body[data-template="list_products"] #sort-select el-options {
  padding: 12px !important;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 14px !important;

  box-shadow: var(--lp-shadow);
}


/* مدخلات السعر */
body[data-template="list_products"] #price-popover .form-input,
body[data-template="list_products"] #filters-drawer .form-input {
  min-height: 44px;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border) !important;
  border-radius: 10px !important;
}

body[data-template="list_products"] #price-popover .form-input:focus,
body[data-template="list_products"] #filters-drawer .form-input:focus {
  border-color: var(--lp-primary) !important;

  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--primary) 13%, transparent);
}


/* أزرار تبديل الشبكة والقائمة */
body[data-template="list_products"]
#products-content
.btn-group-separated {
  padding: 4px;

  background: var(--lp-soft);
  border: 1px solid var(--lp-border-soft);
  border-radius: 12px !important;
}

body[data-template="list_products"]
#products-content
.btn-group-item {
  width: 38px !important;
  height: 38px !important;

  color: var(--lp-muted) !important;
  background: transparent !important;

  border: 0 !important;
  border-radius: 9px !important;
}

body[data-template="list_products"]
#products-content
.btn-group-item:has(input:checked) {
  color: var(--lp-primary) !important;
  background: var(--lp-bg) !important;

  box-shadow:
    0 4px 12px color-mix(in srgb, var(--foreground) 7%, transparent);
}


/* --------------------------------------------------------------------------
   12.6) شبكة المنتجات
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
[data-grid-root="true"] {
  gap: 22px !important;
  align-items: stretch;
}

@media (min-width: 1180px) {
  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 900px) and (max-width: 1179px) {
  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 640px) and (max-width: 899px) {
  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}


/* --------------------------------------------------------------------------
   12.7) بطاقة المنتج في عرض الشبكة
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card] {
  height: 100% !important;
  min-width: 0;

  gap: 0 !important;
  padding: 9px !important;

  background: var(--lp-bg) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 18px !important;

  overflow: hidden !important;

  box-shadow:
    0 8px 24px color-mix(in srgb, var(--foreground) 5%, transparent);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

@media (hover: hover) {
  body[data-template="list_products"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]:hover {
    transform: translateY(-6px);

    border-color:
      color-mix(in srgb, var(--primary) 34%, var(--border)) !important;

    box-shadow:
      0 18px 40px color-mix(in srgb, var(--primary) 11%, transparent);
  }
}


/* رابط وصورة المنتج */
body[data-template="list_products"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> a:first-child {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;

  margin: 0 !important;

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

  background:
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    ) !important;

  border-radius: 14px !important;
  overflow: hidden !important;
}

body[data-template="list_products"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> a:first-child
> img {
  display: block !important;

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

  padding: 4px;

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

  transition: transform 0.35s ease;
}

@media (hover: hover) {
  body[data-template="list_products"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]:hover
  > a:first-child
  > img {
    transform: scale(1.025);
  }
}


/* شارات المنتج */
body[data-template="list_products"]
[data-product-card]
> a:first-child
> .absolute.top-4 {
  top: 10px !important;
  inset-inline-end: 10px !important;
  inset-inline-start: auto !important;

  max-width: calc(100% - 62px);
  gap: 6px !important;
}

body[data-template="list_products"]
[data-product-card]
> a:first-child
> .absolute.top-4
> span {
  max-width: 100%;

  padding: 5px 9px !important;
  border-radius: 999px !important;

  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  overflow: hidden;
  text-overflow: ellipsis;
}


/* المفضلة */
body[data-template="list_products"]
[data-product-card]
[data-wishlist-btn] {
  inset-block-end: 10px !important;
  inset-inline-start: 10px !important;
  inset-inline-end: auto !important;

  width: 42px !important;
  height: 42px !important;

  color: var(--lp-primary) !important;
  background:
    color-mix(in srgb, var(--background) 88%, transparent) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 50% !important;

  box-shadow:
    0 6px 18px color-mix(in srgb, var(--foreground) 9%, transparent);

  backdrop-filter: blur(8px);
}


/* معلومات المنتج */
body[data-template="list_products"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> a:first-child
+ div {
  flex: 1 1 auto;

  min-width: 0;
  padding: 15px 9px 10px !important;

  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
}


/* اسم المنتج */
body[data-template="list_products"]
[data-product-card]
h3 {
  min-height: 49px;
  margin: 0 !important;

  color: var(--lp-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;

  overflow: hidden;
}

body[data-template="list_products"]
[data-product-card]
h3
a {
  color: inherit !important;
  text-decoration: none !important;
}


/* النجوم */
body[data-template="list_products"]
[data-product-card]
.text-warning {
  color: #e6aa18 !important;
}

body[data-template="list_products"]
[data-product-card]
.text-warning
svg,
body[data-template="list_products"]
[data-product-card]
svg.text-warning {
  width: 15px !important;
  height: 15px !important;
}


/* عدد التقييمات */
body[data-template="list_products"]
[data-product-card]
.text-muted {
  color: color-mix(in srgb, var(--lp-muted) 86%, var(--lp-text)) !important;
  font-size: 12px !important;
}


/* السعر الحالي */
body[data-template="list_products"]
[data-product-card]
> div.flex.flex-1.flex-col.gap-3
> div.flex.flex-col.gap-1
> p.font-semibold {
  color: var(--lp-primary) !important;

  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}


/* السعر السابق */
body[data-template="list_products"]
[data-product-card]
span.line-through {
  color: var(--highlight-terracotta, #c67b54) !important;

  font-size: 13px !important;
  opacity: 0.82;
}


/* شارة الخصم */
body[data-template="list_products"]
[data-product-card]
span.text-success {
  padding: 5px 8px !important;

  color: var(--lp-primary) !important;
  background: var(--lp-soft-strong) !important;

  border-radius: 999px !important;

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


/* الجزء السفلي للبطاقة */
body[data-template="list_products"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> .mt-auto {
  width: 100% !important;

  margin-top: auto !important;
  padding: 0 9px 9px !important;
}


/* زر أضف للسلة */
body[data-template="list_products"]
[data-product-card]
[data-add-to-cart] {
  width: 100% !important;
  min-height: 50px !important;

  background: var(--lp-primary) !important;
  color: var(--lp-primary-text) !important;
  border-color: var(--lp-primary) !important;
  border-radius: 12px !important;

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

  box-shadow:
    0 8px 18px color-mix(in srgb, var(--primary) 18%, transparent);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    opacity 0.2s ease;
}

body[data-template="list_products"]
[data-product-card]
[data-add-to-cart]:hover {
  transform: translateY(-1px);

  box-shadow:
    0 12px 24px color-mix(in srgb, var(--primary) 24%, transparent);
}


/* التحكم بالكمية */
body[data-template="list_products"]
[data-product-card]
[data-quantity-section] {
  width: 100% !important;
}

body[data-template="list_products"]
[data-product-card]
.qty-input {
  width: 100% !important;
  min-height: 50px;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border) !important;
  border-radius: 12px !important;
}

body[data-template="list_products"]
[data-product-card]
.qty-input-btn {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;

  color: var(--lp-primary) !important;
}

body[data-template="list_products"]
[data-product-card]
.qty-input-field {
  font-size: 15px !important;
  font-weight: 700 !important;
}


/* --------------------------------------------------------------------------
   12.8) عرض القائمة
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
[data-grid-root="true"][data-grid="list"] {
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

body[data-template="list_products"]
[data-grid-root="true"][data-grid="list"]
[data-product-card] {
  width: 100%;
  min-height: 250px;

  padding: 12px !important;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 18px !important;

  box-shadow:
    0 8px 24px color-mix(in srgb, var(--foreground) 5%, transparent);

  overflow: hidden;
}

body[data-template="list_products"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
> a:first-child {
  width: 260px;
  max-width: 100%;

  background:
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    ) !important;

  border-radius: 14px !important;
}

body[data-template="list_products"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
> a:first-child
> img {
  width: 100% !important;
  height: 100% !important;

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

body[data-template="list_products"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
h3 {
  min-height: 0;
  font-size: 18px !important;
}

body[data-template="list_products"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
> .mt-auto {
  padding-bottom: 4px;
}


/* --------------------------------------------------------------------------
   12.9) الترقيم أسفل الصفحة
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
[data-pagination-root] {
  width: 100%;

  margin-top: 10px;
  padding: 16px 18px;

  justify-content: space-between !important;

  background: var(--lp-bg);
  border: 1px solid var(--lp-border-soft);
  border-radius: 16px;

  box-shadow:
    0 8px 22px color-mix(in srgb, var(--foreground) 4%, transparent);
}

body[data-template="list_products"]
[data-pagination-root]
a,
body[data-template="list_products"]
[data-pagination-root]
button {
  min-width: 38px;
  height: 38px;

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

  color: var(--lp-text) !important;
  background: var(--lp-soft) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 10px !important;

  text-decoration: none !important;
}

body[data-template="list_products"]
[data-pagination-root]
a:hover,
body[data-template="list_products"]
[data-pagination-root]
button:hover {
  color: var(--lp-primary) !important;
  background: var(--lp-soft-strong) !important;
}


/* --------------------------------------------------------------------------
   12.10) درج الفلاتر على الجوال
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
#filters-drawer
el-dialog-panel {
  max-width: 420px !important;
}

body[data-template="list_products"]
#filters-drawer
form {
  background: var(--lp-bg) !important;
}

body[data-template="list_products"]
#filters-drawer
#drawer-title {
  color: var(--lp-text) !important;

  font-size: 20px !important;
  font-weight: 700 !important;
  text-transform: none !important;
}

body[data-template="list_products"]
#filters-drawer
.disclosure-wrapper {
  padding: 4px 0;
}

body[data-template="list_products"]
#filters-drawer
.disclosure-wrapper
> label {
  min-height: 48px;
}

body[data-template="list_products"]
#filters-drawer
.disclosure-wrapper
> label
span {
  color: var(--lp-text) !important;
  font-weight: 600 !important;
}

body[data-template="list_products"]
#filters-drawer
.form-control {
  min-height: 42px;

  padding: 8px 10px;

  border-radius: 10px;
}

body[data-template="list_products"]
#filters-drawer
.form-control:hover {
  background: var(--lp-soft);
}

body[data-template="list_products"]
#filters-drawer
.btn-filled {
  background: var(--lp-primary) !important;
  color: var(--lp-primary-text) !important;
  border-color: var(--lp-primary) !important;

  border-radius: 12px !important;
}

body[data-template="list_products"]
#filters-drawer
.btn-outlined {
  background: var(--lp-bg) !important;
  color: var(--lp-primary) !important;
  border-color: var(--lp-primary) !important;

  border-radius: 12px !important;
}


/* --------------------------------------------------------------------------
   12.11) الجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template="list_products"] > .sticky > header {
    padding-inline: 12px !important;
  }

  body[data-template="list_products"]
  #main
  > section:first-child {
    padding: 14px 12px 12px !important;
  }

  body[data-template="list_products"]
  nav[aria-label="breadcrumb"] {
    min-height: 94px;

    padding: 18px !important;
    border-radius: 17px;
  }

  body[data-template="list_products"]
  nav[aria-label="breadcrumb"]
  ol {
    flex-wrap: wrap !important;
  }

  body[data-template="list_products"]
  nav[aria-label="breadcrumb"]
  [aria-current="page"] {
    font-size: 25px !important;
  }

  body[data-template="list_products"]
  #main
  > section:nth-child(2) {
    padding-inline: 12px !important;
    padding-bottom: 40px !important;
  }

  body[data-template="list_products"]
  #products-content
  > .flex.flex-col.gap-4 {
    padding: 12px !important;
    border-radius: 15px;
  }

  /* زر الفلاتر واضح بعرض مناسب */
  body[data-template="list_products"]
  #products-content
  button[commandfor="filters-drawer"] {
    min-height: 46px;

    padding-inline: 16px !important;

    background: var(--lp-primary) !important;
    color: var(--lp-primary-text) !important;
    border-color: var(--lp-primary) !important;
    border-radius: 12px !important;
  }

  /* منتجان في الصف على أغلب الجوالات */
  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body[data-template="list_products"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card] {
    padding: 6px !important;
    border-radius: 14px !important;
  }

  body[data-template="list_products"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]
  > a:first-child {
    border-radius: 11px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  > a:first-child
  > .absolute.top-4 {
    top: 7px !important;
    inset-inline-end: 7px !important;
    max-width: calc(100% - 48px);
  }

  body[data-template="list_products"]
  [data-product-card]
  > a:first-child
  > .absolute.top-4
  > span {
    padding: 4px 6px !important;
    font-size: 8.5px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  [data-wishlist-btn] {
    inset-block-end: 7px !important;
    inset-inline-start: 7px !important;

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

  body[data-template="list_products"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]
  > a:first-child
  + div {
    padding: 11px 6px 8px !important;
    gap: 7px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  h3 {
    min-height: 43px;

    font-size: 13px !important;
    line-height: 1.6 !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  .text-warning
  svg,
  body[data-template="list_products"]
  [data-product-card]
  svg.text-warning {
    width: 13px !important;
    height: 13px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  .text-muted {
    font-size: 10px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  > div.flex.flex-1.flex-col.gap-3
  > div.flex.flex-col.gap-1
  > p.font-semibold {
    font-size: 16px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  span.line-through {
    font-size: 11px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  span.text-success {
    padding: 4px 6px !important;
    font-size: 9px !important;
  }

  body[data-template="list_products"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]
  > .mt-auto {
    padding: 0 6px 6px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  [data-add-to-cart] {
    min-height: 44px !important;

    padding-inline: 7px !important;

    font-size: 12px !important;
    border-radius: 10px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  .qty-input {
    min-height: 44px;
    border-radius: 10px !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  .qty-input-btn {
    width: 38px !important;
    min-width: 38px !important;
    height: 42px !important;
  }

  body[data-template="list_products"]
  [data-pagination-root] {
    padding: 13px !important;

    flex-direction: column-reverse !important;
    align-items: stretch !important;

    border-radius: 14px;
  }
}


/* هاتف صغير جدًا: بطاقة واحدة لسهولة القراءة */
@media (max-width: 370px) {
  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: 1fr !important;
  }

  body[data-template="list_products"]
  [data-product-card]
  h3 {
    font-size: 14px !important;
  }
}


/* عرض القائمة على الجوال */
@media (max-width: 767px) {
  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="list"]
  [data-product-card] {
    min-height: 0;
    padding: 8px !important;
    border-radius: 14px !important;
  }

  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="list"]
  [data-product-card]
  > a:first-child {
    width: 100%;
    border-radius: 11px !important;
  }

  body[data-template="list_products"]
  [data-grid-root="true"][data-grid="list"]
  [data-product-card]
  h3 {
    font-size: 14px !important;
  }
}



body[data-template="list_products"] footer {
  background: color-mix(
    in srgb,
    var(--primary) 13%,
    var(--background)
  ) !important;

  border-top: 1px solid color-mix(
    in srgb,
    var(--primary) 22%,
    var(--border)
  ) !important;
}

body[data-template="list_products"] footer a {
  color: var(--foreground) !important;
  text-decoration: none !important;
}

body[data-template="list_products"] footer a:hover {
  color: var(--primary) !important;
}


/* --------------------------------------------------------------------------
   12.12) تقليل الحركة
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  body[data-template="list_products"] *,
  body[data-template="list_products"] *::before,
  body[data-template="list_products"] *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ==========================================================================
   13) الضبط النهائي للألوان وصفحة جميع المنتجات
   ========================================================================== */


/* --------------------------------------------------------------------------
   13.1) الهيدر والفوتر بنفس اللون تمامًا
   -------------------------------------------------------------------------- */

body[data-template="home"] > .sticky > header,
body[data-template="list_products"] > .sticky > header,
body[data-template="product_details"] > .sticky > header,
body[data-template="home"] footer,
body[data-template="list_products"] footer,
body[data-template="product_details"] footer {
  background: var(--secondary) !important;

  border-color: color-mix(
    in srgb,
    var(--border) 45%,
    transparent
  ) !important;

  backdrop-filter: none !important;
}


/* منع أي طبقة داخل الفوتر من إعطائه لونًا مختلفًا */
body[data-template="home"] footer > *,
body[data-template="list_products"] footer > *,
body[data-template="product_details"] footer > * {
  background-color: transparent !important;
}


/* --------------------------------------------------------------------------
   13.2) لون مستقل ومتناسق لقسم آراء العملاء
   -------------------------------------------------------------------------- */

body[data-template="home"] .section-testimonials,
body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"] {
  background: #fbf8f1 !important;

  border-top: 1px solid #eee9dc !important;
  border-bottom: 1px solid #eee9dc !important;
}


/* إزالة الخلفية الرمادية من طبقات السلايدر الداخلية */
body[data-template="home"] .section-testimonials .embla-wrapper,
body[data-template="home"] .section-testimonials .embla__viewport,
body[data-template="home"] .section-testimonials .embla__container,
body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
.embla-wrapper,
body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
.embla__viewport,
body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
.embla__container {
  background: transparent !important;
}


/* بطاقات الآراء تبقى بيضاء فوق الخلفية الكريمية */
body[data-template="home"] .section-testimonials article,
body[data-template="home"]
[section-id="01d995f8-4a97-4258-9808-ca3fa2b26100"]
article {
  background: var(--background) !important;

  border-color: #e7e3d7 !important;

  box-shadow:
    0 10px 26px rgba(62, 74, 44, 0.065) !important;
}


/* --------------------------------------------------------------------------
   13.3) تصغير عنوان جميع المنتجات
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
nav[aria-label="breadcrumb"] {
  min-height: 94px !important;
}

body[data-template="list_products"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  font-size: clamp(22px, 1.65vw, 28px) !important;
  line-height: 1.35 !important;
}


/* --------------------------------------------------------------------------
   13.4) إظهار أيقونة الشبكة عند اختيارها
   -------------------------------------------------------------------------- */

/* الخيار المحدد: خلفية خضراء وأيقونة بيضاء واضحة */
body[data-template="list_products"]
#products-content
.btn-group-item:has(input:checked) {
  color: var(--lp-primary-text) !important;
  background: var(--lp-primary) !important;

  box-shadow:
    0 5px 14px color-mix(
      in srgb,
      var(--primary) 22%,
      transparent
    ) !important;
}


/* إجبار الأيقونة المحددة على الظهور */
body[data-template="list_products"]
#products-content
.btn-group-item
> input:checked
+ svg {
  color: var(--lp-primary-text) !important;
  opacity: 1 !important;
  visibility: visible !important;
}


/* الخطوط داخل أيقونة الخيار المحدد */
body[data-template="list_products"]
#products-content
.btn-group-item
> input:checked
+ svg
path {
  stroke: var(--lp-primary-text) !important;
}


/* الأجزاء المعبأة داخل الأيقونة المحددة */
body[data-template="list_products"]
#products-content
.btn-group-item
> input:checked
+ svg
path[fill="currentColor"] {
  fill: var(--lp-primary-text) !important;
}


/* --------------------------------------------------------------------------
   13.5) موازنة اختيار عدد المنتجات في الصفحة
   -------------------------------------------------------------------------- */

body[data-template="list_products"]
[data-pagination-root] {
  width: 100% !important;
  min-height: 70px;

  padding: 12px 16px !important;

  align-items: center !important;
}


/* كتلة النص والعدد */
body[data-template="list_products"]
[data-pagination-root]
> .flex.items-center.gap-2 {
  min-height: 46px;

  padding: 5px 7px 5px 12px;

  background: transparent;
  border-radius: 12px;
}


/* زر الرقم 24 */
body[data-template="list_products"]
#per-page-select
> button {
  width: 62px !important;
  min-width: 62px !important;
  height: 42px !important;

  padding: 0 10px !important;

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

  color: var(--lp-text) !important;
  background: var(--lp-soft) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 11px !important;
}


/* إزالة الخط أسفل الرقم وتوسيطه */
body[data-template="list_products"]
#per-page-select
el-selectedcontent {
  min-width: 20px;

  color: var(--lp-text) !important;

  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
}


/* ضبط سهم القائمة بجانب الرقم */
body[data-template="list_products"]
#per-page-select
> button
svg {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px;

  color: var(--lp-primary) !important;
}


/* قائمة أعداد المنتجات */
body[data-template="list_products"]
#per-page-select
el-options {
  min-width: 90px !important;

  padding: 7px !important;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 12px !important;

  box-shadow: var(--lp-shadow);
}


/* --------------------------------------------------------------------------
   13.6) ضبط إضافي للجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template="list_products"]
  nav[aria-label="breadcrumb"] {
    min-height: 82px !important;
  }

  body[data-template="list_products"]
  nav[aria-label="breadcrumb"]
  [aria-current="page"] {
    font-size: 22px !important;
  }

  body[data-template="list_products"]
  [data-pagination-root] {
    min-height: 0;

    padding: 12px !important;
  }

  body[data-template="list_products"]
  [data-pagination-root]
  > .flex.items-center.gap-2 {
    width: 100%;

    justify-content: space-between;
  }
}

/* ==========================================================================
   14) أساس صفحة تفاصيل التصنيف
   --------------------------------------------------------------------------
   الصفحة المستهدفة:
   body[data-template="category_details"]

   يشمل:
   - الهيدر
   - مسار التنقل
   - شريط الفلاتر والترتيب
   - شبكة المنتجات
   - بطاقات المنتجات
   - عرض القائمة
   - درج الفلاتر على الجوال
   - الترقيم أسفل الصفحة
   ========================================================================== */


/* --------------------------------------------------------------------------
   12.1) متغيرات الصفحة والأساس العام
   -------------------------------------------------------------------------- */

body[data-template="category_details"] {
  --lp-bg: var(--background);
  --lp-text: var(--foreground);
  --lp-primary: var(--primary);
  --lp-primary-text: var(--primary-foreground);
  --lp-secondary: var(--secondary);
  --lp-muted: var(--muted);
  --lp-border: var(--border);

  --lp-soft: color-mix(
    in srgb,
    var(--primary) 8%,
    var(--background)
  );

  --lp-soft-strong: color-mix(
    in srgb,
    var(--primary) 13%,
    var(--background)
  );

  --lp-border-soft: color-mix(
    in srgb,
    var(--border) 42%,
    transparent
  );

  --lp-shadow:
    0 16px 40px color-mix(in srgb, var(--primary) 8%, transparent),
    0 3px 10px color-mix(in srgb, var(--foreground) 4%, transparent);

  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--secondary) 52%, var(--background)) 0,
      var(--background) 340px
    );

  color: var(--lp-text);
}

body[data-template="category_details"] #main {
  min-height: 70vh;
}

body[data-template="category_details"] .theme-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
}


/* --------------------------------------------------------------------------
   12.2) الهيدر
   -------------------------------------------------------------------------- */

body[data-template="category_details"] > .sticky {
  z-index: 60;
}

body[data-template="category_details"] > .sticky > header {
  background: var(--secondary) !important;
  border-color: var(--lp-border-soft) !important;

  box-shadow:
    0 6px 18px color-mix(in srgb, var(--foreground) 5%, transparent);

  backdrop-filter: none;
}

body[data-template="category_details"] > .sticky > header nav {
  min-height: 66px;
}

body[data-template="category_details"] > .sticky > header nav ul a,
body[data-template="category_details"] > .sticky > header nav ul button {
  color: var(--lp-text) !important;
  font-weight: 500;
  text-decoration: none !important;

  transition:
    color 0.2s ease,
    opacity 0.2s ease;
}

body[data-template="category_details"] > .sticky > header nav ul a:hover,
body[data-template="category_details"] > .sticky > header nav ul button:hover {
  color: var(--lp-primary) !important;
}


/* --------------------------------------------------------------------------
   12.3) مسار التنقل كرأس للصفحة
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#main
> section:first-child {
  padding-top: 28px !important;
  padding-bottom: 18px !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"] {
  position: relative;

  min-height: 108px;
  padding: 22px 26px !important;

  display: flex;
  align-items: flex-end;

  background:
    linear-gradient(
      135deg,
      var(--lp-soft-strong) 0%,
      color-mix(in srgb, var(--secondary) 76%, var(--background)) 100%
    );

  border: 1px solid var(--lp-border-soft);
  border-radius: 22px;

  box-shadow:
    0 12px 32px color-mix(in srgb, var(--primary) 7%, transparent);

  overflow: hidden;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]::after {
  content: "";

  position: absolute;
  inset-inline-end: -52px;
  inset-block-start: -72px;

  width: 190px;
  height: 190px;

  border: 34px solid
    color-mix(in srgb, var(--primary) 7%, transparent);

  border-radius: 50%;
  pointer-events: none;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol {
  position: relative;
  z-index: 1;

  gap: 10px !important;
  align-items: baseline !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
a {
  color: var(--lp-muted) !important;

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

  text-decoration: none !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
a:hover {
  color: var(--lp-primary) !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
li[role="presentation"] {
  color: color-mix(in srgb, var(--lp-muted) 70%, transparent);
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--lp-text) !important;

  font-size: clamp(25px, 2.4vw, 36px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;

  text-decoration: none !important;
}


/* --------------------------------------------------------------------------
   12.4) محتوى المنتجات
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#main
> section:nth-child(2) {
  padding-top: 10px !important;
}

body[data-template="category_details"] #products-content {
  gap: 28px !important;
}


/* --------------------------------------------------------------------------
   12.5) شريط الفلاتر والترتيب
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#products-content
> .flex.flex-col.gap-4 {
  gap: 16px !important;

  padding: 18px 20px !important;

  background: var(--lp-bg);
  border: 1px solid var(--lp-border-soft);
  border-radius: 18px;

  box-shadow:
    0 10px 28px color-mix(in srgb, var(--foreground) 5%, transparent);
}

body[data-template="category_details"]
#products-content
> .flex.flex-col.gap-4
> .flex.flex-wrap.items-center.justify-between {
  gap: 16px !important;
}


/* عبارة الفلاتر وعدد المنتجات */
body[data-template="category_details"]
#products-content
> .flex.flex-col.gap-4
.text-muted-foreground,
body[data-template="category_details"]
#products-content
> .flex.flex-col.gap-4
.text-muted {
  color: color-mix(in srgb, var(--lp-muted) 88%, var(--lp-text)) !important;
}


/* أزرار التوفر والسعر والترتيب */
body[data-template="category_details"]
#products-content
button[popovertarget="availability-popover"],
body[data-template="category_details"]
#products-content
button[popovertarget="price-popover"],
body[data-template="category_details"]
#sort-select
> button {
  min-height: 42px;

  padding: 8px 14px !important;

  background: var(--lp-soft) !important;
  color: var(--lp-text) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 999px !important;

  text-decoration: none !important;

  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}

body[data-template="category_details"]
#products-content
button[popovertarget="availability-popover"]:hover,
body[data-template="category_details"]
#products-content
button[popovertarget="price-popover"]:hover,
body[data-template="category_details"]
#sort-select
> button:hover {
  background: var(--lp-soft-strong) !important;

  border-color:
    color-mix(in srgb, var(--primary) 26%, var(--border)) !important;

  transform: translateY(-1px);
}


/* النوافذ الصغيرة للفلاتر والترتيب */
body[data-template="category_details"] #availability-popover,
body[data-template="category_details"] #price-popover,
body[data-template="category_details"] #sort-select el-options {
  padding: 12px !important;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 14px !important;

  box-shadow: var(--lp-shadow);
}


/* مدخلات السعر */
body[data-template="category_details"] #price-popover .form-input,
body[data-template="category_details"] #filters-drawer .form-input {
  min-height: 44px;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border) !important;
  border-radius: 10px !important;
}

body[data-template="category_details"] #price-popover .form-input:focus,
body[data-template="category_details"] #filters-drawer .form-input:focus {
  border-color: var(--lp-primary) !important;

  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--primary) 13%, transparent);
}


/* أزرار تبديل الشبكة والقائمة */
body[data-template="category_details"]
#products-content
.btn-group-separated {
  padding: 4px;

  background: var(--lp-soft);
  border: 1px solid var(--lp-border-soft);
  border-radius: 12px !important;
}

body[data-template="category_details"]
#products-content
.btn-group-item {
  width: 38px !important;
  height: 38px !important;

  color: var(--lp-muted) !important;
  background: transparent !important;

  border: 0 !important;
  border-radius: 9px !important;
}

body[data-template="category_details"]
#products-content
.btn-group-item:has(input:checked) {
  color: var(--lp-primary) !important;
  background: var(--lp-bg) !important;

  box-shadow:
    0 4px 12px color-mix(in srgb, var(--foreground) 7%, transparent);
}


/* --------------------------------------------------------------------------
   12.6) شبكة المنتجات
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
[data-grid-root="true"] {
  gap: 22px !important;
  align-items: stretch;
}

@media (min-width: 1180px) {
  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 900px) and (max-width: 1179px) {
  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 640px) and (max-width: 899px) {
  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}


/* --------------------------------------------------------------------------
   12.7) بطاقة المنتج في عرض الشبكة
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card] {
  height: 100% !important;
  min-width: 0;

  gap: 0 !important;
  padding: 9px !important;

  background: var(--lp-bg) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 18px !important;

  overflow: hidden !important;

  box-shadow:
    0 8px 24px color-mix(in srgb, var(--foreground) 5%, transparent);

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

@media (hover: hover) {
  body[data-template="category_details"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]:hover {
    transform: translateY(-6px);

    border-color:
      color-mix(in srgb, var(--primary) 34%, var(--border)) !important;

    box-shadow:
      0 18px 40px color-mix(in srgb, var(--primary) 11%, transparent);
  }
}


/* رابط وصورة المنتج */
body[data-template="category_details"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> a:first-child {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;

  margin: 0 !important;

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

  background:
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    ) !important;

  border-radius: 14px !important;
  overflow: hidden !important;
}

body[data-template="category_details"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> a:first-child
> img {
  display: block !important;

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

  padding: 4px;

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

  transition: transform 0.35s ease;
}

@media (hover: hover) {
  body[data-template="category_details"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]:hover
  > a:first-child
  > img {
    transform: scale(1.025);
  }
}


/* شارات المنتج */
body[data-template="category_details"]
[data-product-card]
> a:first-child
> .absolute.top-4 {
  top: 10px !important;
  inset-inline-end: 10px !important;
  inset-inline-start: auto !important;

  max-width: calc(100% - 62px);
  gap: 6px !important;
}

body[data-template="category_details"]
[data-product-card]
> a:first-child
> .absolute.top-4
> span {
  max-width: 100%;

  padding: 5px 9px !important;
  border-radius: 999px !important;

  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;

  overflow: hidden;
  text-overflow: ellipsis;
}


/* المفضلة */
body[data-template="category_details"]
[data-product-card]
[data-wishlist-btn] {
  inset-block-end: 10px !important;
  inset-inline-start: 10px !important;
  inset-inline-end: auto !important;

  width: 42px !important;
  height: 42px !important;

  color: var(--lp-primary) !important;
  background:
    color-mix(in srgb, var(--background) 88%, transparent) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 50% !important;

  box-shadow:
    0 6px 18px color-mix(in srgb, var(--foreground) 9%, transparent);

  backdrop-filter: blur(8px);
}


/* معلومات المنتج */
body[data-template="category_details"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> a:first-child
+ div {
  flex: 1 1 auto;

  min-width: 0;
  padding: 15px 9px 10px !important;

  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
}


/* اسم المنتج */
body[data-template="category_details"]
[data-product-card]
h3 {
  min-height: 49px;
  margin: 0 !important;

  color: var(--lp-text) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.65 !important;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;

  overflow: hidden;
}

body[data-template="category_details"]
[data-product-card]
h3
a {
  color: inherit !important;
  text-decoration: none !important;
}


/* النجوم */
body[data-template="category_details"]
[data-product-card]
.text-warning {
  color: #e6aa18 !important;
}

body[data-template="category_details"]
[data-product-card]
.text-warning
svg,
body[data-template="category_details"]
[data-product-card]
svg.text-warning {
  width: 15px !important;
  height: 15px !important;
}


/* عدد التقييمات */
body[data-template="category_details"]
[data-product-card]
.text-muted {
  color: color-mix(in srgb, var(--lp-muted) 86%, var(--lp-text)) !important;
  font-size: 12px !important;
}


/* السعر الحالي */
body[data-template="category_details"]
[data-product-card]
> div.flex.flex-1.flex-col.gap-3
> div.flex.flex-col.gap-1
> p.font-semibold {
  color: var(--lp-primary) !important;

  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}


/* السعر السابق */
body[data-template="category_details"]
[data-product-card]
span.line-through {
  color: var(--highlight-terracotta, #c67b54) !important;

  font-size: 13px !important;
  opacity: 0.82;
}


/* شارة الخصم */
body[data-template="category_details"]
[data-product-card]
span.text-success {
  padding: 5px 8px !important;

  color: var(--lp-primary) !important;
  background: var(--lp-soft-strong) !important;

  border-radius: 999px !important;

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


/* الجزء السفلي للبطاقة */
body[data-template="category_details"]
[data-grid-root="true"]:not([data-grid="list"])
[data-product-card]
> .mt-auto {
  width: 100% !important;

  margin-top: auto !important;
  padding: 0 9px 9px !important;
}


/* زر أضف للسلة */
body[data-template="category_details"]
[data-product-card]
[data-add-to-cart] {
  width: 100% !important;
  min-height: 50px !important;

  background: var(--lp-primary) !important;
  color: var(--lp-primary-text) !important;
  border-color: var(--lp-primary) !important;
  border-radius: 12px !important;

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

  box-shadow:
    0 8px 18px color-mix(in srgb, var(--primary) 18%, transparent);

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    opacity 0.2s ease;
}

body[data-template="category_details"]
[data-product-card]
[data-add-to-cart]:hover {
  transform: translateY(-1px);

  box-shadow:
    0 12px 24px color-mix(in srgb, var(--primary) 24%, transparent);
}


/* التحكم بالكمية */
body[data-template="category_details"]
[data-product-card]
[data-quantity-section] {
  width: 100% !important;
}

body[data-template="category_details"]
[data-product-card]
.qty-input {
  width: 100% !important;
  min-height: 50px;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border) !important;
  border-radius: 12px !important;
}

body[data-template="category_details"]
[data-product-card]
.qty-input-btn {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;

  color: var(--lp-primary) !important;
}

body[data-template="category_details"]
[data-product-card]
.qty-input-field {
  font-size: 15px !important;
  font-weight: 700 !important;
}


/* --------------------------------------------------------------------------
   12.8) عرض القائمة
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
[data-grid-root="true"][data-grid="list"] {
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

body[data-template="category_details"]
[data-grid-root="true"][data-grid="list"]
[data-product-card] {
  width: 100%;
  min-height: 250px;

  padding: 12px !important;

  background: var(--lp-bg) !important;
  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 18px !important;

  box-shadow:
    0 8px 24px color-mix(in srgb, var(--foreground) 5%, transparent);

  overflow: hidden;
}

body[data-template="category_details"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
> a:first-child {
  width: 260px;
  max-width: 100%;

  background:
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    ) !important;

  border-radius: 14px !important;
}

body[data-template="category_details"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
> a:first-child
> img {
  width: 100% !important;
  height: 100% !important;

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

body[data-template="category_details"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
h3 {
  min-height: 0;
  font-size: 18px !important;
}

body[data-template="category_details"]
[data-grid-root="true"][data-grid="list"]
[data-product-card]
> .mt-auto {
  padding-bottom: 4px;
}


/* --------------------------------------------------------------------------
   12.9) الترقيم أسفل الصفحة
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
[data-pagination-root] {
  width: 100%;

  margin-top: 10px;
  padding: 16px 18px;

  justify-content: space-between !important;

  background: var(--lp-bg);
  border: 1px solid var(--lp-border-soft);
  border-radius: 16px;

  box-shadow:
    0 8px 22px color-mix(in srgb, var(--foreground) 4%, transparent);
}

body[data-template="category_details"]
[data-pagination-root]
a,
body[data-template="category_details"]
[data-pagination-root]
button {
  min-width: 38px;
  height: 38px;

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

  color: var(--lp-text) !important;
  background: var(--lp-soft) !important;

  border: 1px solid var(--lp-border-soft) !important;
  border-radius: 10px !important;

  text-decoration: none !important;
}

body[data-template="category_details"]
[data-pagination-root]
a:hover,
body[data-template="category_details"]
[data-pagination-root]
button:hover {
  color: var(--lp-primary) !important;
  background: var(--lp-soft-strong) !important;
}


/* --------------------------------------------------------------------------
   12.10) درج الفلاتر على الجوال
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#filters-drawer
el-dialog-panel {
  max-width: 420px !important;
}

body[data-template="category_details"]
#filters-drawer
form {
  background: var(--lp-bg) !important;
}

body[data-template="category_details"]
#filters-drawer
#drawer-title {
  color: var(--lp-text) !important;

  font-size: 20px !important;
  font-weight: 700 !important;
  text-transform: none !important;
}

body[data-template="category_details"]
#filters-drawer
.disclosure-wrapper {
  padding: 4px 0;
}

body[data-template="category_details"]
#filters-drawer
.disclosure-wrapper
> label {
  min-height: 48px;
}

body[data-template="category_details"]
#filters-drawer
.disclosure-wrapper
> label
span {
  color: var(--lp-text) !important;
  font-weight: 600 !important;
}

body[data-template="category_details"]
#filters-drawer
.form-control {
  min-height: 42px;

  padding: 8px 10px;

  border-radius: 10px;
}

body[data-template="category_details"]
#filters-drawer
.form-control:hover {
  background: var(--lp-soft);
}

body[data-template="category_details"]
#filters-drawer
.btn-filled {
  background: var(--lp-primary) !important;
  color: var(--lp-primary-text) !important;
  border-color: var(--lp-primary) !important;

  border-radius: 12px !important;
}

body[data-template="category_details"]
#filters-drawer
.btn-outlined {
  background: var(--lp-bg) !important;
  color: var(--lp-primary) !important;
  border-color: var(--lp-primary) !important;

  border-radius: 12px !important;
}


/* --------------------------------------------------------------------------
   12.11) الجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template="category_details"] > .sticky > header {
    padding-inline: 12px !important;
  }

  body[data-template="category_details"]
  #main
  > section:first-child {
    padding: 14px 12px 12px !important;
  }

  body[data-template="category_details"]
  nav[aria-label="breadcrumb"] {
    min-height: 94px;

    padding: 18px !important;
    border-radius: 17px;
  }

  body[data-template="category_details"]
  nav[aria-label="breadcrumb"]
  ol {
    flex-wrap: wrap !important;
  }

  body[data-template="category_details"]
  nav[aria-label="breadcrumb"]
  [aria-current="page"] {
    font-size: 25px !important;
  }

  body[data-template="category_details"]
  #main
  > section:nth-child(2) {
    padding-inline: 12px !important;
    padding-bottom: 40px !important;
  }

  body[data-template="category_details"]
  #products-content
  > .flex.flex-col.gap-4 {
    padding: 12px !important;
    border-radius: 15px;
  }

  /* زر الفلاتر واضح بعرض مناسب */
  body[data-template="category_details"]
  #products-content
  button[commandfor="filters-drawer"] {
    min-height: 46px;

    padding-inline: 16px !important;

    background: var(--lp-primary) !important;
    color: var(--lp-primary-text) !important;
    border-color: var(--lp-primary) !important;
    border-radius: 12px !important;
  }

  /* منتجان في الصف على أغلب الجوالات */
  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body[data-template="category_details"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card] {
    padding: 6px !important;
    border-radius: 14px !important;
  }

  body[data-template="category_details"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]
  > a:first-child {
    border-radius: 11px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  > a:first-child
  > .absolute.top-4 {
    top: 7px !important;
    inset-inline-end: 7px !important;
    max-width: calc(100% - 48px);
  }

  body[data-template="category_details"]
  [data-product-card]
  > a:first-child
  > .absolute.top-4
  > span {
    padding: 4px 6px !important;
    font-size: 8.5px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  [data-wishlist-btn] {
    inset-block-end: 7px !important;
    inset-inline-start: 7px !important;

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

  body[data-template="category_details"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]
  > a:first-child
  + div {
    padding: 11px 6px 8px !important;
    gap: 7px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  h3 {
    min-height: 43px;

    font-size: 13px !important;
    line-height: 1.6 !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  .text-warning
  svg,
  body[data-template="category_details"]
  [data-product-card]
  svg.text-warning {
    width: 13px !important;
    height: 13px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  .text-muted {
    font-size: 10px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  > div.flex.flex-1.flex-col.gap-3
  > div.flex.flex-col.gap-1
  > p.font-semibold {
    font-size: 16px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  span.line-through {
    font-size: 11px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  span.text-success {
    padding: 4px 6px !important;
    font-size: 9px !important;
  }

  body[data-template="category_details"]
  [data-grid-root="true"]:not([data-grid="list"])
  [data-product-card]
  > .mt-auto {
    padding: 0 6px 6px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  [data-add-to-cart] {
    min-height: 44px !important;

    padding-inline: 7px !important;

    font-size: 12px !important;
    border-radius: 10px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  .qty-input {
    min-height: 44px;
    border-radius: 10px !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  .qty-input-btn {
    width: 38px !important;
    min-width: 38px !important;
    height: 42px !important;
  }

  body[data-template="category_details"]
  [data-pagination-root] {
    padding: 13px !important;

    flex-direction: column-reverse !important;
    align-items: stretch !important;

    border-radius: 14px;
  }
}


/* هاتف صغير جدًا: بطاقة واحدة لسهولة القراءة */
@media (max-width: 370px) {
  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="four"] {
    grid-template-columns: 1fr !important;
  }

  body[data-template="category_details"]
  [data-product-card]
  h3 {
    font-size: 14px !important;
  }
}


/* عرض القائمة على الجوال */
@media (max-width: 767px) {
  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="list"]
  [data-product-card] {
    min-height: 0;
    padding: 8px !important;
    border-radius: 14px !important;
  }

  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="list"]
  [data-product-card]
  > a:first-child {
    width: 100%;
    border-radius: 11px !important;
  }

  body[data-template="category_details"]
  [data-grid-root="true"][data-grid="list"]
  [data-product-card]
  h3 {
    font-size: 14px !important;
  }
}



body[data-template="category_details"] footer {
  background: color-mix(
    in srgb,
    var(--primary) 13%,
    var(--background)
  ) !important;

  border-top: 1px solid color-mix(
    in srgb,
    var(--primary) 22%,
    var(--border)
  ) !important;
}

body[data-template="category_details"] footer a {
  color: var(--foreground) !important;
  text-decoration: none !important;
}

body[data-template="category_details"] footer a:hover {
  color: var(--primary) !important;
}


/* --------------------------------------------------------------------------
   12.12) تقليل الحركة
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  body[data-template="category_details"] *,
  body[data-template="category_details"] *::before,
  body[data-template="category_details"] *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ==========================================================================
   15) الضبط المخصص لصفحة تفاصيل التصنيف
   --------------------------------------------------------------------------
   القالب الفعلي:
   body[data-template="category_details"]
   ========================================================================== */


/* الهيدر والفوتر بنفس لون بقية المتجر */
body[data-template="category_details"] > .sticky > header,
body[data-template="category_details"] footer {
  background: var(--secondary) !important;
  border-color: color-mix(
    in srgb,
    var(--border) 45%,
    transparent
  ) !important;
}


/* خلفية الصفحة */
body[data-template="category_details"] {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--secondary) 54%, var(--background)) 0,
      var(--background) 420px
    );
}


/* عنوان التصنيف */
body[data-template="category_details"]
#main
> section:first-child {
  position: relative;

  width: calc(100% - 32px);
  max-width: 1320px;
  min-height: 118px;

  margin: 28px auto 0 !important;
  padding: 26px 32px !important;

  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--primary) 11%, var(--background)) 0%,
      color-mix(in srgb, var(--secondary) 82%, var(--background)) 100%
    ) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--border) 38%,
    transparent
  );

  border-radius: 22px;
  overflow: hidden;

  box-shadow:
    0 14px 34px color-mix(in srgb, var(--primary) 8%, transparent);
}


/* إخفاء طبقة الخلفية القديمة */
body[data-template="category_details"]
#main
> section:first-child
> .absolute {
  display: none !important;
}


/* زخرفة خفيفة */
body[data-template="category_details"]
#main
> section:first-child::after {
  content: "";

  position: absolute;
  inset-inline-end: -42px;
  inset-block-start: -68px;

  width: 190px;
  height: 190px;

  border: 34px solid color-mix(
    in srgb,
    var(--primary) 7%,
    transparent
  );

  border-radius: 50%;
  pointer-events: none;
}


/* عنوان التصنيف */
body[data-template="category_details"]
#main
> section:first-child
h1 {
  position: relative;
  z-index: 1;

  margin: 0 !important;

  color: var(--foreground) !important;
  font-size: clamp(25px, 2vw, 32px) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}


/* إخفاء الوصف المكرر مثل: الباقات / الباقات */
body[data-template="category_details"]
#main
> section:first-child
p {
  display: none !important;
}


/* مسار التنقل */
body[data-template="category_details"]
#main
> section:nth-child(2) {
  padding: 14px 16px 20px !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"] {
  min-height: 0 !important;

  padding: 10px 14px !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]::after {
  display: none !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol {
  gap: 8px !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
a,
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

body[data-template="category_details"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--primary) !important;
  font-weight: 700 !important;
}


/* قسم المنتجات */
body[data-template="category_details"]
#main
> section:nth-child(3) {
  padding-top: 0 !important;
}


/* الجوال */
@media (max-width: 767px) {
  body[data-template="category_details"]
  #main
  > section:first-child {
    width: calc(100% - 24px);
    min-height: 94px;

    margin-top: 14px !important;
    padding: 20px !important;

    border-radius: 17px;
  }

  body[data-template="category_details"]
  #main
  > section:first-child
  h1 {
    font-size: 24px !important;
  }

  body[data-template="category_details"]
  #main
  > section:nth-child(2) {
    padding: 10px 12px 16px !important;
  }

  body[data-template="category_details"]
  #main
  > section:nth-child(3) {
    padding-inline: 12px !important;
    padding-bottom: 42px !important;
  }
}


/* ==========================================================================
   16) صفحة جميع التصنيفات
   --------------------------------------------------------------------------
   القالب الفعلي:
   body[data-template="list_categories"]
   ========================================================================== */


/* متغيرات الصفحة */
body[data-template="list_categories"] {
  --lc-bg: var(--background);
  --lc-text: var(--foreground);
  --lc-primary: var(--primary);
  --lc-secondary: var(--secondary);
  --lc-muted: var(--muted);

  --lc-soft: color-mix(
    in srgb,
    var(--primary) 9%,
    var(--background)
  );

  --lc-border-soft: color-mix(
    in srgb,
    var(--border) 40%,
    transparent
  );

  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--secondary) 54%, var(--background)) 0,
      var(--background) 430px
    );

  color: var(--lc-text);
}


/* الحاويات */
body[data-template="list_categories"] .theme-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
}


/* الهيدر والفوتر */
body[data-template="list_categories"] > .sticky > header,
body[data-template="list_categories"] footer {
  background: var(--secondary) !important;

  border-color: color-mix(
    in srgb,
    var(--border) 45%,
    transparent
  ) !important;
}


/* رأس الصفحة */
body[data-template="list_categories"]
#main
> section:first-child {
  position: relative;

  width: calc(100% - 32px);
  max-width: 1320px;
  min-height: 132px;

  margin: 28px auto 0 !important;
  padding: 28px 32px !important;

  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--primary) 11%, var(--background)) 0%,
      color-mix(in srgb, var(--secondary) 82%, var(--background)) 100%
    ) !important;

  border: 1px solid var(--lc-border-soft);
  border-radius: 22px;
  overflow: hidden;

  box-shadow:
    0 14px 34px color-mix(in srgb, var(--primary) 8%, transparent);
}


/* إزالة الخلفية القديمة */
body[data-template="list_categories"]
#main
> section:first-child
> .absolute {
  display: none !important;
}


/* زخرفة */
body[data-template="list_categories"]
#main
> section:first-child::after {
  content: "";

  position: absolute;
  inset-inline-end: -42px;
  inset-block-start: -68px;

  width: 190px;
  height: 190px;

  border: 34px solid color-mix(
    in srgb,
    var(--primary) 7%,
    transparent
  );

  border-radius: 50%;
  pointer-events: none;
}


/* عنوان الصفحة */
body[data-template="list_categories"]
#main
> section:first-child
h1 {
  position: relative;
  z-index: 1;

  margin: 0 !important;

  color: var(--lc-text) !important;
  font-size: clamp(26px, 2.2vw, 34px) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}


/* الوصف */
body[data-template="list_categories"]
#main
> section:first-child
p {
  position: relative;
  z-index: 1;

  max-width: 620px;
  margin: 8px 0 0 !important;

  color: color-mix(
    in srgb,
    var(--lc-muted) 82%,
    var(--lc-text)
  ) !important;

  font-size: 14px !important;
  line-height: 1.8 !important;
}


/* مسار التنقل */
body[data-template="list_categories"]
#main
> section:nth-child(2) {
  padding: 14px 16px 20px !important;
}

body[data-template="list_categories"]
nav[aria-label="breadcrumb"] {
  padding: 10px 14px !important;
}

body[data-template="list_categories"]
nav[aria-label="breadcrumb"]
ol {
  gap: 8px !important;
}

body[data-template="list_categories"]
nav[aria-label="breadcrumb"]
a {
  color: var(--lc-muted) !important;
  font-size: 13px !important;
  text-decoration: none !important;
}

body[data-template="list_categories"]
nav[aria-label="breadcrumb"]
a:hover {
  color: var(--lc-primary) !important;
}

body[data-template="list_categories"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--lc-primary) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}


/* قسم بطاقات التصنيفات */
body[data-template="list_categories"]
#main
> section:nth-child(3) {
  padding-top: 4px !important;
  padding-bottom: 64px !important;
}


/* عنوان تسوق حسب التصنيفات */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.theme-container
> .flex
> h2 {
  position: relative;

  margin: 0 0 6px !important;
  padding-inline-start: 16px;

  color: var(--lc-text) !important;
  font-size: clamp(23px, 1.8vw, 29px) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

body[data-template="list_categories"]
#main
> section:nth-child(3)
.theme-container
> .flex
> h2::before {
  content: "";

  position: absolute;
  inset-block: 5px;
  inset-inline-start: 0;

  width: 4px;

  background: var(--lc-primary);
  border-radius: 999px;
}


/* شبكة التصنيفات */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.theme-container
> .flex
> .grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
}


/* بطاقة التصنيف */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.theme-container
> .flex
> .grid
> a {
  min-width: 0;
  height: 100%;

  gap: 0 !important;
  padding: 9px !important;

  background: var(--lc-bg) !important;

  border: 1px solid var(--lc-border-soft);
  border-radius: 18px;

  box-shadow:
    0 8px 24px color-mix(in srgb, var(--foreground) 5%, transparent);

  overflow: hidden;

  text-decoration: none !important;

  transition:
    transform 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

@media (hover: hover) {
  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a:hover {
    transform: translateY(-6px);

    border-color: color-mix(
      in srgb,
      var(--primary) 34%,
      var(--border)
    );

    box-shadow:
      0 18px 38px color-mix(in srgb, var(--primary) 11%, transparent);
  }
}


/* منطقة الصورة */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.grid
> a
> div:first-child {
  position: relative;

  width: 100%;
  aspect-ratio: 4 / 3 !important;

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

  background:
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    ) !important;

  border-radius: 14px !important;
  overflow: hidden !important;
}


/* صور التصنيفات */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.grid
> a
> div:first-child
> img {
  display: block !important;

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

  padding: 12px;

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

  transition: transform 0.35s ease;
}

@media (hover: hover) {
  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a:hover
  > div:first-child
  > img {
    transform: scale(1.035);
  }
}


/* إزالة الطبقة البيضاء القديمة فوق الصورة */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.grid
> a
> div:first-child
> .pointer-events-none {
  background: transparent !important;
}


/* صورة بديلة للتصنيفات التي لا تملك صورة */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.grid
> a
> div:first-child:not(:has(img)) {
  background:
    url("https://media.zid.store/9441c87c-72ae-422b-88d2-1c8736f039d7/5525b88e-9668-4986-a9c2-62dc78f2dc99-200x.jpg")
    center / 112px auto no-repeat,
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    ) !important;
}


/* اسم التصنيف */
body[data-template="list_categories"]
#main
> section:nth-child(3)
.grid
> a
> h3 {
  min-height: 58px;

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

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

  color: var(--lc-text) !important;

  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.55 !important;
  text-align: center !important;
}


/* التابلت */
@media (min-width: 768px) and (max-width: 1099px) {
  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .theme-container
  > .flex
  > .grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}


/* الجوال */
@media (max-width: 767px) {
  body[data-template="list_categories"]
  #main
  > section:first-child {
    width: calc(100% - 24px);
    min-height: 112px;

    margin-top: 14px !important;
    padding: 20px !important;

    border-radius: 17px;
  }

  body[data-template="list_categories"]
  #main
  > section:first-child
  h1 {
    font-size: 24px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:first-child
  p {
    font-size: 13px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(2) {
    padding: 10px 12px 16px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3) {
    padding-inline: 12px !important;
    padding-bottom: 42px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .theme-container
  > .flex
  > h2 {
    padding-inline-start: 13px;
    font-size: 21px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .theme-container
  > .flex
  > .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a {
    padding: 6px !important;
    border-radius: 14px;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a
  > div:first-child {
    aspect-ratio: 1 / 1 !important;
    border-radius: 11px !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a
  > div:first-child
  > img {
    padding: 6px;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a
  > h3 {
    min-height: 52px;

    padding: 11px 5px 7px !important;

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


/* هاتف صغير جدًا */
@media (max-width: 370px) {
  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .theme-container
  > .flex
  > .grid {
    grid-template-columns: 1fr !important;
  }

  body[data-template="list_categories"]
  #main
  > section:nth-child(3)
  .grid
  > a
  > div:first-child {
    aspect-ratio: 4 / 3 !important;
  }
}


/* تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  body[data-template="category_details"] *,
  body[data-template="category_details"] *::before,
  body[data-template="category_details"] *::after,
  body[data-template="list_categories"] *,
  body[data-template="list_categories"] *::before,
  body[data-template="list_categories"] *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ==========================================================================
   17) توحيد صفحة التصنيف مع صفحة جميع المنتجات
   --------------------------------------------------------------------------
   الهدف:
   - نفس الخط
   - نفس بطاقة العنوان
   - نفس مسار التنقل
   - نفس شريط الفلاتر
   - نفس الترقيم أسفل المنتجات
   ========================================================================== */


/* --------------------------------------------------------------------------
   17.1) توحيد الخط في جميع الصفحات
   -------------------------------------------------------------------------- */

:root {
  --font-family: Cairo, sans-serif !important;
}

body[data-template="home"],
body[data-template="list_products"],
body[data-template="category_details"],
body[data-template="list_categories"],
body[data-template="product_details"] {
  font-family: var(--font-family) !important;
}


/* --------------------------------------------------------------------------
   17.2) إخفاء رأس التصنيف المنفصل
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#main
> section:first-child {
  display: none !important;
}


/* --------------------------------------------------------------------------
   17.3) تحويل مسار التصنيف إلى نفس بطاقة عنوان جميع المنتجات
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#main
> section:nth-child(2) {
  padding: 28px 16px 18px !important;
}

body[data-template="category_details"]
#main
> section:nth-child(2)
.theme-container {
  max-width: 1320px !important;
}


/* البطاقة */
body[data-template="category_details"]
nav[aria-label="breadcrumb"] {
  position: relative;

  min-height: 108px !important;
  padding: 22px 26px !important;

  display: flex !important;
  align-items: flex-end !important;

  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--primary) 13%, var(--background)) 0%,
      color-mix(in srgb, var(--secondary) 82%, var(--background)) 100%
    ) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--border) 42%,
    transparent
  ) !important;

  border-radius: 22px !important;

  box-shadow:
    0 14px 34px color-mix(in srgb, var(--primary) 8%, transparent) !important;

  overflow: hidden !important;
}


/* الزخرفة الدائرية */
body[data-template="category_details"]
nav[aria-label="breadcrumb"]::after {
  content: "";

  display: block !important;

  position: absolute;
  inset-inline-end: -52px;
  inset-block-start: -72px;

  width: 190px;
  height: 190px;

  border: 34px solid color-mix(
    in srgb,
    var(--primary) 7%,
    transparent
  );

  border-radius: 50%;
  pointer-events: none;
}


/* ترتيب عناصر المسار */
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol {
  position: relative;
  z-index: 1;

  width: 100%;

  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
}


/* إخفاء كلمة "التصنيفات" والفاصل الثاني */
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol
> li:nth-child(3),
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol
> li:nth-child(4) {
  display: none !important;
}


/* الرئيسية */
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol
> li:first-child
a {
  color: var(--muted) !important;

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

  text-decoration: none !important;
}


/* الفاصل */
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
ol
> li:nth-child(2) {
  color: color-mix(
    in srgb,
    var(--muted) 70%,
    transparent
  ) !important;
}


/* اسم التصنيف كعنوان كبير */
body[data-template="category_details"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--foreground) !important;

  font-size: clamp(22px, 1.65vw, 28px) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}


/* --------------------------------------------------------------------------
   17.4) جعل بداية المحتوى مساوية لصفحة جميع المنتجات
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#main
> section:nth-child(3) {
  padding-top: 10px !important;
  padding-bottom: 64px !important;
}


/* نفس عرض شريط الفلاتر */
body[data-template="category_details"]
#products-content
> .flex.flex-col.gap-4 {
  width: 100% !important;
}


/* --------------------------------------------------------------------------
   17.5) توحيد حالة أيقونة الشبكة
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
#products-content
.btn-group-item:has(input:checked),
body[data-template="list_products"]
#products-content
.btn-group-item:has(input:checked) {
  color: var(--primary-foreground) !important;
  background: var(--primary) !important;

  box-shadow:
    0 5px 14px color-mix(
      in srgb,
      var(--primary) 22%,
      transparent
    ) !important;
}

body[data-template="category_details"]
#products-content
.btn-group-item
> input:checked
+ svg,
body[data-template="list_products"]
#products-content
.btn-group-item
> input:checked
+ svg {
  color: var(--primary-foreground) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body[data-template="category_details"]
#products-content
.btn-group-item
> input:checked
+ svg
path,
body[data-template="list_products"]
#products-content
.btn-group-item
> input:checked
+ svg
path {
  stroke: var(--primary-foreground) !important;
}


/* --------------------------------------------------------------------------
   17.6) توحيد ترقيم وعدد المنتجات في الصفحة
   -------------------------------------------------------------------------- */

body[data-template="category_details"]
[data-pagination-root],
body[data-template="list_products"]
[data-pagination-root] {
  width: 100% !important;
  min-height: 70px;

  margin-top: 10px !important;
  padding: 12px 16px !important;

  align-items: center !important;

  background: var(--background) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--border) 42%,
    transparent
  ) !important;

  border-radius: 16px !important;

  box-shadow:
    0 8px 22px color-mix(
      in srgb,
      var(--foreground) 4%,
      transparent
    ) !important;
}


/* عندما يوجد عنصر واحد فقط، اجعله في يمين البطاقة */
body[data-template="category_details"]
[data-pagination-root]:has(> :only-child),
body[data-template="list_products"]
[data-pagination-root]:has(> :only-child) {
  justify-content: flex-start !important;
}


/* كتلة عدد المنتجات */
body[data-template="category_details"]
[data-pagination-root]
> .flex.items-center.gap-2,
body[data-template="list_products"]
[data-pagination-root]
> .flex.items-center.gap-2 {
  min-height: 46px;

  padding: 5px 7px 5px 12px !important;

  background: transparent !important;
  border: 0 !important;
}


/* زر الرقم 24 */
body[data-template="category_details"]
#per-page-select
> button,
body[data-template="list_products"]
#per-page-select
> button {
  width: 62px !important;
  min-width: 62px !important;
  height: 42px !important;

  padding: 0 10px !important;

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

  color: var(--foreground) !important;
  background: color-mix(
    in srgb,
    var(--primary) 8%,
    var(--background)
  ) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--border) 42%,
    transparent
  ) !important;

  border-radius: 11px !important;
}


/* --------------------------------------------------------------------------
   17.7) الجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template="category_details"]
  #main
  > section:nth-child(2) {
    padding: 14px 12px 12px !important;
  }

  body[data-template="category_details"]
  nav[aria-label="breadcrumb"] {
    min-height: 82px !important;

    padding: 18px !important;
    border-radius: 17px !important;
  }

  body[data-template="category_details"]
  nav[aria-label="breadcrumb"]
  [aria-current="page"] {
    font-size: 22px !important;
  }

  body[data-template="category_details"]
  #main
  > section:nth-child(3) {
    padding-inline: 12px !important;
    padding-bottom: 42px !important;
  }

  body[data-template="category_details"]
  [data-pagination-root],
  body[data-template="list_products"]
  [data-pagination-root] {
    min-height: 0;

    padding: 12px !important;
  }

  body[data-template="category_details"]
  [data-pagination-root]
  > .flex.items-center.gap-2,
  body[data-template="list_products"]
  [data-pagination-root]
  > .flex.items-center.gap-2 {
    width: 100%;
    justify-content: space-between;
  }
}

/* ==========================================================================
   18) الفوتر المنظم الجديد
   --------------------------------------------------------------------------
   يطبق على جميع صفحات المتجر التي تستخدم الفوتر القياسي:
   - الرئيسية
   - جميع المنتجات
   - التصنيفات
   - تفاصيل المنتج
   - السلة
   ========================================================================== */


/* --------------------------------------------------------------------------
   18.1) الخلفية والمساحة العامة
   -------------------------------------------------------------------------- */

body[data-template] footer {
  position: relative;

  padding: 42px 16px 18px !important;

  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--secondary) 92%, var(--background)) 0%,
      color-mix(in srgb, var(--primary) 10%, var(--background)) 100%
    ) !important;

  border-top: 1px solid color-mix(
    in srgb,
    var(--primary) 18%,
    var(--border)
  ) !important;

  overflow: hidden;
}


/* زخرفة خفيفة في الخلفية */
body[data-template] footer::before {
  content: "";

  position: absolute;
  inset-inline-end: -90px;
  inset-block-start: -100px;

  width: 260px;
  height: 260px;

  border: 42px solid color-mix(
    in srgb,
    var(--primary) 6%,
    transparent
  );

  border-radius: 50%;
  pointer-events: none;
}

body[data-template] footer::after {
  content: "";

  position: absolute;
  inset-inline-start: -80px;
  inset-block-end: -110px;

  width: 220px;
  height: 220px;

  background: color-mix(
    in srgb,
    var(--highlight-terracotta, #C67B54) 6%,
    transparent
  );

  border-radius: 50%;
  pointer-events: none;
}


/* الحاوية */
body[data-template] footer .theme-container {
  position: relative;
  z-index: 1;

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

  margin-inline: auto !important;
}


/* --------------------------------------------------------------------------
   18.2) الصف العلوي للفوتر
   -------------------------------------------------------------------------- */

/* يدعم الحاوية سواء كانت grid أو أول عنصر داخل theme-container */
body[data-template] footer .theme-container > .grid,
body[data-template] footer .theme-container > div:first-child {
  display: grid !important;

  grid-template-columns:
    minmax(300px, 1.35fr)
    minmax(190px, 0.72fr)
    minmax(230px, 0.86fr) !important;

  align-items: stretch !important;
  gap: 18px !important;

  padding: 0 !important;
}


/* كل عمود داخل بطاقة مستقلة */
body[data-template] footer .theme-container > .grid > div,
body[data-template] footer .theme-container > div:first-child > div {
  min-width: 0;

  padding: 24px !important;

  background: color-mix(
    in srgb,
    var(--background) 76%,
    transparent
  ) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--border) 34%,
    transparent
  ) !important;

  border-radius: 18px !important;

  box-shadow:
    0 8px 24px color-mix(
      in srgb,
      var(--foreground) 4%,
      transparent
    );

  text-align: right !important;
}


/* --------------------------------------------------------------------------
   18.3) عمود العلامة التجارية
   -------------------------------------------------------------------------- */

body[data-template] footer img[alt*="الشيا"],
body[data-template] footer img[src*="5525b88e"] {
  display: block !important;

  width: auto !important;
  max-width: 112px !important;
  max-height: 100px !important;

  margin: 0 0 16px auto !important;

  object-fit: contain !important;
}


/* وصف العلامة */
body[data-template] footer p {
  margin: 0 !important;

  color: color-mix(
    in srgb,
    var(--foreground) 84%,
    var(--muted)
  ) !important;

  font-size: 13px !important;
  line-height: 1.95 !important;
}


/* --------------------------------------------------------------------------
   18.4) العناوين والروابط
   -------------------------------------------------------------------------- */

body[data-template] footer h2,
body[data-template] footer h3,
body[data-template] footer h4 {
  position: relative;

  margin: 0 0 16px !important;
  padding-bottom: 10px;

  color: var(--foreground) !important;

  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
}

body[data-template] footer h2::after,
body[data-template] footer h3::after,
body[data-template] footer h4::after {
  content: "";

  position: absolute;
  inset-inline-start: 0;
  inset-block-end: 0;

  width: 34px;
  height: 3px;

  background: var(--primary);
  border-radius: 999px;
}


/* قوائم الروابط */
body[data-template] footer ul,
body[data-template] footer nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

body[data-template] footer a {
  color: color-mix(
    in srgb,
    var(--foreground) 88%,
    var(--muted)
  ) !important;

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

  text-decoration: none !important;

  transition:
    color 0.2s ease,
    transform 0.2s ease,
    opacity 0.2s ease;
}

body[data-template] footer a:hover {
  color: var(--primary) !important;
  transform: translateX(-2px);
}


/* --------------------------------------------------------------------------
   18.5) التواصل وأيقونات الشبكات
   -------------------------------------------------------------------------- */

body[data-template] footer a[href^="mailto:"],
body[data-template] footer a[href^="tel:"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;

  width: fit-content;

  min-height: 36px;
  padding: 6px 10px !important;

  background: color-mix(
    in srgb,
    var(--primary) 7%,
    var(--background)
  );

  border: 1px solid color-mix(
    in srgb,
    var(--primary) 12%,
    transparent
  );

  border-radius: 10px;
}


/* حاوية أيقونات التواصل */
body[data-template] footer [class*="social"],
body[data-template] footer .flex:has(a[href*="instagram"]),
body[data-template] footer .flex:has(a[href*="tiktok"]),
body[data-template] footer .flex:has(a[href*="snapchat"]) {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;

  margin-top: 14px !important;
}


/* أيقونة اجتماعية */
body[data-template] footer a[href*="instagram"],
body[data-template] footer a[href*="facebook"],
body[data-template] footer a[href*="twitter"],
body[data-template] footer a[href*="x.com"],
body[data-template] footer a[href*="snapchat"],
body[data-template] footer a[href*="tiktok"] {
  width: 38px !important;
  height: 38px !important;

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

  padding: 0 !important;

  color: var(--primary) !important;
  background: var(--background) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--primary) 16%,
    transparent
  ) !important;

  border-radius: 50% !important;

  box-shadow:
    0 5px 14px color-mix(
      in srgb,
      var(--foreground) 5%,
      transparent
    );
}

body[data-template] footer a[href*="instagram"]:hover,
body[data-template] footer a[href*="facebook"]:hover,
body[data-template] footer a[href*="twitter"]:hover,
body[data-template] footer a[href*="x.com"]:hover,
body[data-template] footer a[href*="snapchat"]:hover,
body[data-template] footer a[href*="tiktok"]:hover {
  color: var(--primary-foreground) !important;
  background: var(--primary) !important;

  transform: translateY(-2px);
}


/* --------------------------------------------------------------------------
   18.6) الصف السفلي: الحقوق والدفع والرقم الضريبي
   -------------------------------------------------------------------------- */

body[data-template] footer .theme-container > div:last-child {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;

  gap: 14px 24px !important;

  margin-top: 18px !important;
  padding: 18px 20px !important;

  background: color-mix(
    in srgb,
    var(--background) 70%,
    transparent
  ) !important;

  border: 1px solid color-mix(
    in srgb,
    var(--border) 30%,
    transparent
  ) !important;

  border-radius: 15px !important;
}


/* نص الحقوق والرقم الضريبي */
body[data-template] footer .theme-container > div:last-child p,
body[data-template] footer .theme-container > div:last-child span {
  color: color-mix(
    in srgb,
    var(--foreground) 78%,
    var(--muted)
  ) !important;

  font-size: 11.5px !important;
  line-height: 1.7 !important;
}


/* شعارات الدفع */
body[data-template] footer .theme-container > div:last-child img {
  width: auto !important;
  height: 28px !important;
  max-width: 54px !important;

  padding: 3px;

  background: var(--background);
  border: 1px solid color-mix(
    in srgb,
    var(--border) 28%,
    transparent
  );

  border-radius: 7px;

  object-fit: contain !important;
}


/* الحاوية التي تضم شعارات الدفع */
body[data-template] footer .theme-container > div:last-child > div,
body[data-template] footer .theme-container > div:last-child .flex {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
}


/* --------------------------------------------------------------------------
   18.7) إزالة المساحات غير الضرورية
   -------------------------------------------------------------------------- */

body[data-template] footer .theme-container > *:empty {
  display: none !important;
}

body[data-template] footer br + br {
  display: none !important;
}


/* --------------------------------------------------------------------------
   18.8) التابلت
   -------------------------------------------------------------------------- */

@media (min-width: 768px) and (max-width: 1023px) {
  body[data-template] footer .theme-container > .grid,
  body[data-template] footer .theme-container > div:first-child {
    grid-template-columns: 1.2fr 0.8fr !important;
  }

  body[data-template] footer .theme-container > .grid > div:last-child,
  body[data-template] footer .theme-container > div:first-child > div:last-child {
    grid-column: 1 / -1;
  }
}


/* --------------------------------------------------------------------------
   18.9) الجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template] footer {
    padding: 28px 12px 14px !important;
  }

  body[data-template] footer .theme-container > .grid,
  body[data-template] footer .theme-container > div:first-child {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body[data-template] footer .theme-container > .grid > div,
  body[data-template] footer .theme-container > div:first-child > div {
    padding: 18px !important;
    border-radius: 15px !important;
  }

  body[data-template] footer img[alt*="الشيا"],
  body[data-template] footer img[src*="5525b88e"] {
    margin-inline: auto !important;
  }

  body[data-template] footer .theme-container > .grid > div:first-child,
  body[data-template] footer .theme-container > div:first-child > div:first-child {
    text-align: center !important;
  }

  body[data-template] footer .theme-container > .grid > div:first-child h2::after,
  body[data-template] footer .theme-container > .grid > div:first-child h3::after,
  body[data-template] footer .theme-container > div:first-child > div:first-child h2::after,
  body[data-template] footer .theme-container > div:first-child > div:first-child h3::after {
    inset-inline-start: 50%;
    transform: translateX(50%);
  }

  body[data-template] footer .theme-container > div:last-child {
    flex-direction: column !important;
    align-items: stretch !important;

    padding: 15px !important;
    text-align: center !important;
  }

  body[data-template] footer .theme-container > div:last-child > div,
  body[data-template] footer .theme-container > div:last-child .flex {
    justify-content: center !important;
  }

  body[data-template] footer .theme-container > div:last-child img {
    height: 25px !important;
    max-width: 48px !important;
  }
}

/* ==========================================================================
   19) تحسين شعار الفوتر وصفحة السلة
   ========================================================================== */


/* --------------------------------------------------------------------------
   19.1) إبراز شعار الفوتر بدون تغيير الشعار نفسه
   -------------------------------------------------------------------------- */

body[data-template] footer img[alt*="الشيا"],
body[data-template] footer img[src*="5525b88e"] {
  display: block !important;

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

  max-width: 122px !important;
  max-height: 110px !important;

  margin: 0 0 18px auto !important;
  padding: 12px !important;

  background:
    linear-gradient(
      145deg,
      #fffefb 0%,
      #faf6ed 100%
    ) !important;

  border: 1px solid #e7dfcf !important;
  border-radius: 16px !important;

  box-shadow:
    0 8px 22px rgba(62, 74, 44, 0.07),
    inset 0 0 0 1px rgba(255, 255, 255, 0.72) !important;

  object-fit: contain !important;
}


/* جعل عمود العلامة التجارية أدفأ قليلًا */
body[data-template] footer .theme-container > .grid > div:last-child,
body[data-template] footer .theme-container > div:first-child > div:last-child {
  background:
    linear-gradient(
      145deg,
      #fffefb 0%,
      #fbf8f1 100%
    ) !important;
}


/* --------------------------------------------------------------------------
   19.2) متغيرات صفحة السلة
   -------------------------------------------------------------------------- */

body[data-template="cart_page"] {
  --cart-bg: var(--background);
  --cart-text: var(--foreground);
  --cart-primary: var(--primary);
  --cart-primary-text: var(--primary-foreground);
  --cart-secondary: var(--secondary);
  --cart-border: color-mix(
    in srgb,
    var(--border) 42%,
    transparent
  );

  --cart-soft: color-mix(
    in srgb,
    var(--primary) 8%,
    var(--background)
  );

  --cart-soft-strong: color-mix(
    in srgb,
    var(--primary) 13%,
    var(--background)
  );

  --cart-shadow:
    0 16px 40px color-mix(
      in srgb,
      var(--primary) 8%,
      transparent
    );

  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--secondary) 55%, var(--background)) 0,
      var(--background) 420px
    );

  color: var(--cart-text);
  font-family: var(--font-family, Cairo, sans-serif) !important;
}


/* الهيدر والفوتر */
body[data-template="cart_page"] > .sticky > header,
body[data-template="cart_page"] footer {
  background: var(--secondary) !important;
  border-color: var(--cart-border) !important;
}


/* الحاويات */
body[data-template="cart_page"] .theme-container {
  width: 100%;
  max-width: 1320px;
  margin-inline: auto;
}


/* --------------------------------------------------------------------------
   19.3) مسار التنقل
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
#main
> section:first-child {
  padding-top: 26px !important;
  padding-bottom: 14px !important;
}

body[data-template="cart_page"]
nav[aria-label="breadcrumb"] {
  min-height: 72px;
  padding: 18px 22px !important;

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      135deg,
      var(--cart-soft-strong) 0%,
      color-mix(in srgb, var(--secondary) 82%, var(--background)) 100%
    );

  border: 1px solid var(--cart-border);
  border-radius: 18px;

  box-shadow:
    0 10px 28px color-mix(
      in srgb,
      var(--primary) 6%,
      transparent
    );
}

body[data-template="cart_page"]
nav[aria-label="breadcrumb"]
ol {
  gap: 9px !important;
}

body[data-template="cart_page"]
nav[aria-label="breadcrumb"]
a {
  color: var(--muted) !important;
  text-decoration: none !important;
}

body[data-template="cart_page"]
nav[aria-label="breadcrumb"]
[aria-current="page"] {
  color: var(--cart-text) !important;
  font-weight: 700 !important;
}


/* --------------------------------------------------------------------------
   19.4) المنطقة الرئيسية للسلة
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
#main
> section:nth-child(2) {
  padding-top: 8px !important;
}

body[data-template="cart_page"]
.cart-with-products
> .grid {
  gap: 26px !important;
}

@media (min-width: 1024px) {
  body[data-template="cart_page"]
  .cart-with-products
  > .grid {
    grid-template-columns:
      minmax(0, 1.65fr)
      minmax(330px, 0.75fr) !important;
  }

  body[data-template="cart_page"]
  .cart-with-products
  > .grid
  > div:first-child {
    grid-column: auto !important;
  }

  body[data-template="cart_page"]
  .cart-with-products
  > .grid
  > div:last-child {
    grid-column: auto !important;
  }
}


/* عنوان السلة */
body[data-template="cart_page"]
.cart-with-products
h1 {
  margin: 0 0 18px !important;

  color: var(--cart-text) !important;
  font-size: clamp(25px, 2vw, 32px) !important;
  font-weight: 700 !important;
}


/* --------------------------------------------------------------------------
   19.5) شريط الشحن المجاني
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
[data-free-shipping-bar] {
  margin-top: 0 !important;
  padding: 18px 20px !important;

  background:
    linear-gradient(
      135deg,
      var(--cart-soft) 0%,
      color-mix(in srgb, var(--secondary) 78%, var(--background)) 100%
    ) !important;

  border: 1px solid var(--cart-border);
  border-radius: 16px !important;

  box-shadow:
    0 8px 22px color-mix(
      in srgb,
      var(--foreground) 4%,
      transparent
    );
}

body[data-template="cart_page"]
[data-free-shipping-message] {
  color: var(--cart-text) !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
  text-transform: none !important;
}

body[data-template="cart_page"]
[data-free-shipping-progress-bar],
body[data-template="cart_page"]
[data-free-shipping-truck] {
  background: var(--accent) !important;
}


/* --------------------------------------------------------------------------
   19.6) عناوين أعمدة المنتجات
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
.border-border-light.text-foreground.text-xs.uppercase {
  margin-top: 20px !important;
  padding: 14px 16px !important;

  background: var(--cart-soft);
  border: 0 !important;
  border-radius: 12px;

  color: color-mix(
    in srgb,
    var(--cart-text) 82%,
    var(--muted)
  ) !important;

  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: none !important;
}


/* --------------------------------------------------------------------------
   19.7) بطاقة المنتج داخل السلة
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
[data-cart-products-list] {
  margin-top: 14px !important;
}

body[data-template="cart_page"]
.cart-product-item {
  position: relative;

  padding: 18px !important;
  gap: 18px !important;

  background: var(--cart-bg);

  border: 1px solid var(--cart-border);
  border-radius: 18px;

  box-shadow:
    0 10px 28px color-mix(
      in srgb,
      var(--foreground) 5%,
      transparent
    );
}


/* صورة المنتج */
body[data-template="cart_page"]
.cart-product-item
> a:first-child {
  width: 116px !important;
  height: 116px !important;

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

  background:
    linear-gradient(
      145deg,
      #fbfaf6 0%,
      color-mix(in srgb, var(--secondary) 84%, var(--background)) 100%
    );

  border: 1px solid var(--cart-border);
  border-radius: 14px !important;
}

body[data-template="cart_page"]
.cart-product-item
> a:first-child
img {
  width: 100% !important;
  height: 100% !important;

  padding: 7px;

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


/* اسم المنتج */
body[data-template="cart_page"]
.cart-product-item
a.text-foreground.text-sm.font-medium {
  color: var(--cart-text) !important;

  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.7 !important;

  text-decoration: none !important;
}


/* السعر الحالي */
body[data-template="cart_page"]
.cart-product-item
p.text-foreground.text-sm.font-medium {
  color: var(--cart-primary) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}


/* السعر السابق */
body[data-template="cart_page"]
.cart-product-item
p.text-destructive {
  color: var(--highlight-terracotta, #C67B54) !important;
  font-size: 12px !important;
}


/* عداد الكمية */
body[data-template="cart_page"]
.cart-product-item
.qty-input {
  width: 174px !important;
  min-height: 48px;

  background: var(--cart-bg) !important;
  border: 1px solid var(--cart-border) !important;
  border-radius: 12px !important;

  overflow: hidden;
}

body[data-template="cart_page"]
.cart-product-item
.qty-input-btn {
  width: 50px !important;
  height: 46px !important;

  color: var(--cart-primary) !important;
}

body[data-template="cart_page"]
.cart-product-item
.qty-input-field {
  font-size: 15px !important;
  font-weight: 700 !important;
}


/* المفضلة والحذف */
body[data-template="cart_page"]
.cart-product-item
[data-wishlist-btn],
body[data-template="cart_page"]
.cart-product-item
[data-action="product-remove"] {
  width: 36px !important;
  height: 36px !important;

  color: var(--cart-primary) !important;
  background: var(--cart-soft) !important;

  border: 1px solid var(--cart-border);
  border-radius: 10px !important;
}

body[data-template="cart_page"]
.cart-product-item
[data-action="product-remove"]:hover {
  color: var(--highlight-terracotta, #C67B54) !important;
  background: color-mix(
    in srgb,
    var(--highlight-terracotta, #C67B54) 8%,
    var(--background)
  ) !important;
}


/* متابعة التسوق */
body[data-template="cart_page"]
.cart-with-products
a[href="https://softshea.sa/"].text-foreground {
  margin-top: 18px !important;
  padding: 10px 14px !important;

  color: var(--cart-primary) !important;
  background: var(--cart-soft);

  border: 1px solid var(--cart-border);
  border-radius: 11px !important;

  font-weight: 600 !important;
  text-decoration: none !important;
}


/* --------------------------------------------------------------------------
   19.8) ملخص الطلب وكود الخصم
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
.cart-with-products
> .grid
> div:last-child
> .sticky {
  top: 92px !important;

  padding: 20px !important;

  background: var(--cart-bg);

  border: 1px solid var(--cart-border);
  border-radius: 18px;

  box-shadow: var(--cart-shadow);
}

body[data-template="cart_page"]
[data-coupon-section],
body[data-template="cart_page"]
[data-order-summary-section] {
  padding-block: 0 !important;
}

body[data-template="cart_page"]
[data-coupon-section]
h3,
body[data-template="cart_page"]
[data-order-summary-section]
h3 {
  margin-bottom: 8px !important;

  color: var(--cart-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: none !important;
}


/* حقل الخصم */
body[data-template="cart_page"]
[data-coupon-input] {
  min-height: 50px;

  background: var(--cart-bg) !important;
  border: 1px solid var(--cart-border) !important;
  border-radius: 12px !important;
}

body[data-template="cart_page"]
[data-coupon-input]:focus {
  border-color: var(--cart-primary) !important;

  box-shadow:
    0 0 0 3px color-mix(
      in srgb,
      var(--primary) 12%,
      transparent
    );
}


/* زر تطبيق الخصم */
body[data-template="cart_page"]
[data-coupon-submit-btn] {
  min-width: 92px;
  min-height: 50px;

  background: var(--cart-primary) !important;
  color: var(--cart-primary-text) !important;
  border-color: var(--cart-primary) !important;
  border-radius: 12px !important;

  font-weight: 700 !important;
}

body[data-template="cart_page"]
[data-coupon-submit-btn]:disabled {
  opacity: 0.42;
}


/* ملخص الطلب */
body[data-template="cart_page"]
[data-order-summary] {
  padding: 18px !important;

  background:
    linear-gradient(
      145deg,
      var(--cart-soft) 0%,
      color-mix(in srgb, var(--secondary) 75%, var(--background)) 100%
    ) !important;

  border: 1px solid var(--cart-border);
  border-radius: 14px !important;
}

body[data-template="cart_page"]
[data-cart-totals]
> div:last-child {
  padding-top: 13px;

  border-top: 1px solid var(--cart-border);
}

body[data-template="cart_page"]
[data-cart-totals]
> div:last-child
span {
  color: var(--cart-text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}


/* زر إتمام الطلب */
body[data-template="cart_page"]
[data-checkout-buttons]
a[href="/checkout"] {
  min-height: 56px;

  background: var(--cart-primary) !important;
  color: var(--cart-primary-text) !important;
  border-color: var(--cart-primary) !important;
  border-radius: 13px !important;

  font-size: 16px !important;
  font-weight: 700 !important;

  box-shadow:
    0 10px 24px color-mix(
      in srgb,
      var(--primary) 22%,
      transparent
    );

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

body[data-template="cart_page"]
[data-checkout-buttons]
a[href="/checkout"]:hover {
  transform: translateY(-2px);

  box-shadow:
    0 14px 28px color-mix(
      in srgb,
      var(--primary) 28%,
      transparent
    );
}


/* أدوات الدفع */
body[data-template="cart_page"]
[data-payment-widgets],
body[data-template="cart_page"]
#apple_pay_quick_checkout_widget {
  margin-top: 12px !important;

  border-radius: 12px;
  overflow: hidden;
}


/* --------------------------------------------------------------------------
   19.9) السلة الفارغة إن ظهرت
   -------------------------------------------------------------------------- */

body[data-template="cart_page"]
.cart-empty,
body[data-template="cart_page"]
[data-empty-cart] {
  max-width: 720px;

  margin: 30px auto !important;
  padding: 42px 24px !important;

  background: var(--cart-bg);
  border: 1px solid var(--cart-border);
  border-radius: 20px;

  box-shadow: var(--cart-shadow);

  text-align: center;
}


/* --------------------------------------------------------------------------
   19.10) الجوال
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
  body[data-template="cart_page"]
  #main
  > section:first-child {
    padding: 14px 12px 10px !important;
  }

  body[data-template="cart_page"]
  nav[aria-label="breadcrumb"] {
    min-height: 62px;
    padding: 15px !important;
    border-radius: 15px;
  }

  body[data-template="cart_page"]
  #main
  > section:nth-child(2) {
    padding-inline: 12px !important;
    padding-bottom: 38px !important;
  }

  body[data-template="cart_page"]
  .cart-with-products
  h1 {
    font-size: 24px !important;
  }

  body[data-template="cart_page"]
  .cart-product-item {
    padding: 12px !important;
    gap: 12px !important;
    border-radius: 15px;
  }

  body[data-template="cart_page"]
  .cart-product-item
  > a:first-child {
    width: 88px !important;
    height: 88px !important;
    border-radius: 12px !important;
  }

  body[data-template="cart_page"]
  .cart-product-item
  a.text-foreground.text-sm.font-medium {
    font-size: 13px !important;
  }

  body[data-template="cart_page"]
  .cart-product-item
  .qty-input {
    width: 152px !important;
    min-height: 44px;
  }

  body[data-template="cart_page"]
  .cart-product-item
  .qty-input-btn {
    width: 44px !important;
    height: 42px !important;
  }

  body[data-template="cart_page"]
  .cart-with-products
  > .grid
  > div:last-child
  > .sticky {
    position: static !important;

    margin-top: 8px;
    padding: 16px !important;

    border-radius: 16px;
  }

  body[data-template="cart_page"]
  [data-coupon-form] {
    align-items: stretch !important;
  }

  body[data-template="cart_page"]
  [data-coupon-submit-btn] {
    min-width: 78px;
  }
}


/* تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  body[data-template="cart_page"] *,
  body[data-template="cart_page"] *::before,
  body[data-template="cart_page"] *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}