#fw-section-product-product-default {

.badge--PROMOTION {
  display: none !important;
}

/* --- للتحكم في عنوان المنتج --- */
.product-info__title {
  font-size: 20px; /* <-- غيّر هذا الرقم لتكبير أو تصغير العنوان */
  font-weight: bold;
}


.product-info__title + div {
  margin-top: 5px !important;
  margin-bottom: 20px !important;
}

/* --- للتحكم في سعر المنتج --- */
.product-info__price--original {
  font-size: 18px; /* <-- غيّر هذا الرقم لتكبير أو تصغير السعر */
  font-weight: semi bold; /* هذا السطر يجعل السعر عريضاً (Bold) */
}

/* --- إخفاء النص الأصلي للعروض الترويجية --- */
.product-info__promotion-description {
  /* نجعل الخط بحجم صفر لإخفاء النص الأصلي بالكامل */
  font-size: 0;
  color: transparent; /* نزيد من التأكيد بإخفاء لون الخط */
}

/* --- إضافة النص الجديد الذي تريده --- */
.product-info__promotion-description::after {
  /* النص الجديد الذي سيتم عرضه */
  content: "Exclusive of tax. Shipping costs are calculated at checkout.";
  /* إعادة حجم الخط إلى الحجم الطبيعي للنص الجديد */
  font-size: 14px; /* <-- يمكنك تغيير حجم الخط هذا ليتناسب مع تصميمك */
  color: #666; /* <-- يمكنك تغيير لون الخط هذا ليتناسب مع تصميمك */
}
}










#fw-section-footer {
--color-primary: #ffffff;
--color-primary-rgb: 255, 255, 255;
--color-background: #000000;
--color-background-rgb: 0, 0, 0;
--color-on-primary: #000000;
--color-on-primary-rgb: 0, 0, 0;
--color-on-background: #ffffff;
--color-on-background-rgb: 255, 255, 255;
--color-product-image-background: #f7f7f7;
--color-background-brightness: 0;
background-color: var(--color-background);
color: var(--color-on-background);

}


#fw-section-hero-0 {


@media screen and (max-width: 768px) {


  .hero {
    aspect-ratio: 4 / 5 !important;
    height: auto !important;
    /* تأكد من أن الحاوية هي المرجع للعناصر بداخلها */
    position: relative !important; 
    overflow: hidden !important;
  }

  /* 2. الحل النهائي لمشكلة الصورة بناءً على اكتشافك */
  /* هذا الكود يجبر حاوية الصورة على أن تملأ البانر بالكامل */
  .section-background {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 260% !important;
  }

  /* 1. نجعل الحاوية الرئيسية مرنة (Flexbox) */
  .hero__cta-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    width: 100% !important; /* نضمن أن الحاوية تأخذ العرض الكامل */
  }

  /* 2. نستهدف الأغلفة الخفية مباشرة (هذا هو الجزء الجديد والحاسم) */
  .hero__cta-container > * {
    flex: 0 1 auto !important; /* نجبر الغلاف على أن يكون مرنًا ولا ينمو */
    width: auto !important;
  }

  /* 3. نضبط تصميم الأزرار الداخلية كالمعتاد */
  .button {
    margin: 5px !important;
    padding: 8px 15px !important;
    font-size: 14px !important;
    background-color: #000 !important;
    color: #fff !important;
    border: 1px solid #000 !important;
  }
  
  /* --- (إضافة جديدة) لوضع المحتوى في المنتصف عموديًا --- */
  .hero__inner {
    position: absolute !important;
    top: 130% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 90% !important; /* لمنع المحتوى من لمس الحواف */
  }
}



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

  /* استهداف الأزرار داخل البانر على الشاشات الكبيرة فقط */
  .hero .button {
    /* 1. توحيد لون الخلفية والنص لجميع الأزرار */
    background-color: #000 !important;
    color: #fff !important;
    
    /* 2. تصغير ارتفاع الأزرار عبر التحكم في الـ padding */
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    
    /* 3. (اختياري) توحيد شكل الحدود */
    border: 1px solid #000 !important;
  }
  
}
}
#fw-section-announcement-bar-74e83046-c79c-44aa-bfa6-fb8cc10ffcd7 {

.announcement-bar {
  /* للتحكم في الارتفاع */
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  min-height: 0 !important;
  line-height: 0.6 !important;
  
  /* (إضافة جديدة) للتحكم في حجم النص */
  font-size: 14px !important; /* يمكنك تغيير قيمة 14px حسب رغبتك */
}
}








#fw-section-featured-collection-c13f7ee2-258e-4ce0-bccc-bc8068ef0d58 {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-featured-collection-7b757163-d647-4d65-8310-ae60e6bd7b0e {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-hero-3ca5f6b1-59db-486d-b281-0854735468ff {


@media screen and (max-width: 768px) {


  .hero {
    aspect-ratio: 4 / 5 !important;
    height: auto !important;
    /* تأكد من أن الحاوية هي المرجع للعناصر بداخلها */
    position: relative !important; 
    overflow: hidden !important;
  }

  /* 2. الحل النهائي لمشكلة الصورة بناءً على اكتشافك */
  /* هذا الكود يجبر حاوية الصورة على أن تملأ البانر بالكامل */
  .section-background {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 260% !important;
  }

  /* 1. نجعل الحاوية الرئيسية مرنة (Flexbox) */
  .hero__cta-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    width: 100% !important; /* نضمن أن الحاوية تأخذ العرض الكامل */
  }

  /* 2. نستهدف الأغلفة الخفية مباشرة (هذا هو الجزء الجديد والحاسم) */
  .hero__cta-container > * {
    flex: 0 1 auto !important; /* نجبر الغلاف على أن يكون مرنًا ولا ينمو */
    width: auto !important;
  }


  /* --- (إضافة جديدة) لوضع المحتوى في المنتصف عموديًا --- */
  .hero__inner {
    position: absolute !important;
    top: 130% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 90% !important; /* لمنع المحتوى من لمس الحواف */
  }
}

}
#fw-section-hero-fdb1dbb2-694e-4a84-84b8-bf5deac2180a {


@media screen and (max-width: 768px) {


  .hero {
    aspect-ratio: 4 / 5 !important;
    height: auto !important;
    /* تأكد من أن الحاوية هي المرجع للعناصر بداخلها */
    position: relative !important; 
    overflow: hidden !important;
  }

  /* 2. الحل النهائي لمشكلة الصورة بناءً على اكتشافك */
  /* هذا الكود يجبر حاوية الصورة على أن تملأ البانر بالكامل */
  .section-background {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 260% !important;
  }

  /* 1. نجعل الحاوية الرئيسية مرنة (Flexbox) */
  .hero__cta-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    width: 100% !important; /* نضمن أن الحاوية تأخذ العرض الكامل */
  }

  /* 2. نستهدف الأغلفة الخفية مباشرة (هذا هو الجزء الجديد والحاسم) */
  .hero__cta-container > * {
    flex: 0 1 auto !important; /* نجبر الغلاف على أن يكون مرنًا ولا ينمو */
    width: auto !important;
  }


  /* --- (إضافة جديدة) لوضع المحتوى في المنتصف عموديًا --- */
  .hero__inner {
    position: absolute !important;
    top: 130% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 90% !important; /* لمنع المحتوى من لمس الحواف */
  }
}

}
#fw-section-featured-collection-e3456ac1-9a91-4ae8-ad97-1b8a4c443a0f {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-featured-collection-a38204a8-fa69-491a-a94e-9a2ef74f38ea {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-featured-collection-e2e9ab3f-090f-4918-8d14-b2610b54cd32 {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-featured-collection-951d9884-c6d2-4a24-9ef0-15484a330904 {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-featured-collection-b9a93678-1f28-4a00-895e-520a74bdd363 {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-collection-template-collection-default {

/* --- Adjusting the Featured Collection Title --- */
.collection-template__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}
}
#fw-section-featured-collection-8791739c-028a-4d03-9f40-5dfa3f322a4a {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 18px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-product-recommendations-product-default {

/* --- للتحكم في عنوان قسم المنتجات المقترحة --- */
.product-recommendations .section-header__heading {
  text-align: left; /* <-- هذا السطر يجعل العنوان على اليسار */
  font-size: 22px;  /* <-- غيّر هذا الرقم لتكبير أو تصغير حجم الخط */
}


/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}

}
#fw-section-featured-collection-66cbf30b-e41c-41c8-8cb5-1950b190fac3 {

/* --- Adjusting the Featured Collection Title --- */
.featured-collection .section-header__heading {
  /* 1. To align the title to the left */
  text-align: left !important;

  /* 2. To control the font size */
  font-size: 20px !important; /* You can change the 28px value as you wish */
}

/* This controls the font size of the product title */
.tile__heading {
  font-size: 12px !important; /* You can change the 16px value */
}

/* This controls the font size of the product price */
.tile__price {
  font-size: 13px !important; /* You can change the 14px value */
}
}