.wa-s-n {
  display: none !important;
}
.wa-selia {
    bottom: 80px;
}
@media (max-width: 767px) {
    .is-sticky-product-bar.has-bottom-nav.product-single .phone-selia:not(.wa-enabled), .is-sticky-product-bar.has-bottom-nav.product-single .scroll-to-top, .is-sticky-product-bar.has-bottom-nav.product-single .wa-selia {
        bottom: 125px !important ;
    }
}


#selia-close-discount-popup {
    right: 12px !important;
    left: auto !important;
}

/* ==========================================
   1. تحميل خطوط النصوص والوصف (ثمانية Sans)
   ========================================== */
@font-face { font-family: 'Thmanyah Sans'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahsans-Light.woff2') format('woff2'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Thmanyah Sans'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahsans-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Thmanyah Sans'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahsans-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Thmanyah Sans'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahsans-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Thmanyah Sans'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahsans-Black.woff2') format('woff2'); font-weight: 900; font-display: swap; }

/* ==========================================
   2. تحميل خطوط العناوين الفخمة (ثمانية Serif)
   ========================================== */
@font-face { font-family: 'Thmanyah Serif'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahserifdisplay-Light.woff2') format('woff2'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Thmanyah Serif'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahserifdisplay-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Thmanyah Serif'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahserifdisplay-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Thmanyah Serif'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahserifdisplay-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Thmanyah Serif'; src: url('https://cdn.jsdelivr.net/gh/hamzaabido/fonts@main/thmanyahserifdisplay-Black.woff2') format('woff2'); font-weight: 900; font-display: swap; }

/* ==========================================
   3. التطبيق الأساسي (Thmanyah Sans) لكامل المتجر
   ========================================== */
:root {
    --font-main: 'Thmanyah Sans', sans-serif !important;
    --font-primary: 'Thmanyah Sans', sans-serif !important;
}

*, body, html, p, span, a, div, button, input {
    font-family: 'Thmanyah Sans', sans-serif !important;
}

/* ==========================================
   4. تطبيق خط العناوين (Thmanyah Serif) للعناوين فقط
   ========================================== */
h1, h2, h3, h4, h5, h6, 
.custom-products__title, 
.home-block-title h2, 
.product-card__title a,
.post-entry__title a {
    font-family: 'Thmanyah Serif', serif !important;
    /* تفعيل الاستطالات والزخارف الجمالية للعناوين */
    font-feature-settings: "swsh" 1, "cswh" 1, "salt" 1, "ss01" 1, "ss02" 1, "ss03" 1, "liga" 1, "dlig" 1, "jalt" 1 !important;
    font-variant-alternates: swash(1);
}

/* ==========================================
   5. استثناء الأرقام لتبقى واضحة وعصرية
   ========================================== */
.s-count-down-item-value,
.product-card__price .total-price,
.product-card__price .before-price,
.s-cart-summary-total {
    font-family: 'Thmanyah Serif', sans-serif !important;
    
}

/* Top NavBar */
/* تغيير الشعار قبل السكرول فقط */
/*header.store-header #mainnav:not(.fixed-header):not(.fixed-pinned) .navbar-brand img.logo-normal {
    content: url('https://i.ibb.co/8gZVCnRN/image.webp') !important;
}*/
.main-nav-container .inner {
  padding-top : 20px;
  padding-bottom: 20px;
  background: transparent;
}
.main-nav-container.fixed-header .inner {
        top: 0;
        transform: none;
        padding: 20px 0px;
      border-radius: 0px 0px 15px 15px;
      border-bottom: solid 1px silver;
    }
/* Top NavBar */

#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > main > section.s-block.s-block--square-links.square-links-2.force-center {
      margin-top: 0px;
    background: #1c1c1c;
}







/* Bottom NavBar */
@media (max-width: 767px) {
    .has-bottom-nav {
      padding-bottom: 0px; 
    }
}
@media (max-width: 767px) {
    .is-sticky-product-bar.has-bottom-nav.product-single .sticky-product-bar {
        bottom: 0px !important;
    }
}
.selia-bottom-nav-items {
  justify-content: space-evenly;
}
.selia-bottom-nav-icon {
  width: 2rem;
  height: 2rem;
}
.selia-bottom-nav-icon span,
.selia-bottom-nav-user span,
li.selia-bottom-nav-button.selia-bottom-nav-cart {
  display: none;
}
.selia-bottom-nav {
  border-radius: 50px;
    bottom: 15px;
    margin-left: 20px;
    margin-right: 20px;
    padding: 5px;
    background: transparent;
    backdrop-filter: blur(10px);
    border: solid 0.5px silver;
}
/* Bottom NavBar */
/* Products*/
.custom-products__view-all-wrap .h-px {
  display: none !important;
}
.custom-products__view-all-wrap a[data-selia="home-custom-products-view-all"] {
  width: 100% !important;
  flex: 1 1 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}
[dir=rtl] .htv--underline-offset .home-block-title h2:after {
  right: 0%;
  
}
.htv--underline-offset .home-block-title h2:after {
  border-radius: 0px;
  width: 100%;
}
.simplified-products .s-products-list-wrapper .product-card--simplified .product-card__mini-cart button, .simplified-products .s-products-slider-card .product-card--simplified .product-card__mini-cart button, salla-offer .product-card--simplified .product-card__mini-cart button {
  border-radius: 0px;
        border: solid 1px #ededed;
}
/*button.s-button-element .s-button-text {
  font-size: 0px !important;
  font-family: 'Thmanyah Serif', serif !important;
}*/
.product-card button.s-button-element .s-button-text {
  font-size: 0px !important;
  font-family: 'Thmanyah Serif', serif !important;
}
body:not(.enhanced_add_btn_in_mobile) .simplified-products .s-products-list-wrapper .product-card--simplified .product-card__content, body:not(.enhanced_add_btn_in_mobile) .simplified-products .s-products-slider-card .product-card--simplified .product-card__content, body:not(.enhanced_add_btn_in_mobile) salla-offer .product-card--simplified .product-card__content {
  display: flex !important;
        flex-direction: row-reverse !important;
          align-items: end;
  padding-top: 12px !important;
    padding-bottom: 12px !important;
  
}
.simplified-products .s-products-list-wrapper .product-card--simplified .product-card__mini-cart .s-button-text, .simplified-products .s-products-slider-card .product-card--simplified .product-card__mini-cart .s-button-text, salla-offer .product-card--simplified .product-card__mini-cart .s-button-text {
  gap: 0px;
}
.product-card__title {
  text-align: left;
  padding-left: 4px;
}
.product-card__price .total-price {
  color: #eb7626;
      line-height: 0;
}
.price_is_on_sale {
      flex-direction: row-reverse;
  padding-left: 4px;
}
.simplified-products .s-products-list-wrapper .product-card--simplified .product-card__content .product-card__price .text-red-400, .simplified-products .s-products-list-wrapper .product-card--simplified .product-card__content .product-card__price span, .simplified-products .s-products-slider-card .product-card--simplified .product-card__content .product-card__price .text-red-400, .simplified-products .s-products-slider-card .product-card--simplified .product-card__content .product-card__price span, salla-offer .product-card--simplified .product-card__content .product-card__price span {
  font-size: 9px;
          margin: 0;
}


@media (max-width: 767px) {
    body:not(.free-images-height) .simplified-products .s-products-list-wrapper .product-card--simplified .product-card__image, body:not(.free-images-height) .simplified-products .s-products-slider-card .product-card--simplified .product-card__image, body:not(.free-images-height) salla-offer .product-card--simplified .product-card__image {
        max-height: 14rem !important;
    }
}
@media (max-width: 767px) {
    .simplified-products .s-products-list-wrapper .product-card--simplified .product-card__image, .simplified-products .s-products-slider-card .product-card--simplified .product-card__image, salla-offer .product-card--simplified .product-card__image {
        height: 14rem !important;
    }
}
@media (max-width: 991px) {
    .simplified-products .s-products-slider-card, salla-offer .s-products-slider-card {
        width: 200px !important;
    }
}


/* السماح للعناصر بالالتفاف داخل حاوية السعر */
custom-salla-product-card[id*="product-"] .product-card__price {
    flex-wrap: wrap !important;
    justify-content: end;
}

/* إضافة أيقونات الدفع في سطر جديد أسفل السعر مباشرة */
custom-salla-product-card[id*="product-"] .product-card__price::after {
  margin-left : 4px !important;
    content: "" !important;
    display: block !important;
    width: 100% !important; /* إجبار الصورة على النزول لسطر جديد */
    height: 8px !important; /* ارتفاع الأيقونات */
    background-image: url('https://i.ibb.co/hJBnF3P1/image.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left !important; /* توسيط الصورة تحت السعر */
  
}
/* Products*/

/* 
========================================================
Header
======================================================== 
*/

.advanced-slider__caption__inner--center {
  display: none;
}
@media (max-width: 768px) {
.advanced-slider__caption__inner--center {
  display: flex;
    justify-content: center;
    padding-bottom: 35vh;
}
}
.advanced-slider__caption__inner__content__button span {
  color: black !important;
}
/* 
========================================================
Header
======================================================== 
*/


.s-block--offer-countdown salla-count-down .s-count-down-list .s-count-down-item {
  height: 5rem;
  border: solid 1px #c0c0c066;
}
.s-block--offer-countdown .offer-countdown-title {
  color: #ff9852;
}
.s-block--offer-countdown .offer-countdown-subtitle {
  opacity: 50%;
  font-weight: 200;
}
.s-block--offer-countdown.s-block--has-media .offer-countdown-bg-wrapper .offer-countdown-overlay {
  /*background: linear-gradient(180deg, rgba(255, 255, 255, 0) 50%, rgb(0 0 0 / 85%) 100%);*/
}

div.about__content.w-full.md\:w-7\/12 > h2 {
  text-align: center !important;
}
div.about__content.w-full.md\:w-7\/12 > p {
  text-align: center !important;
}
.about__media {
  height: 25vh;
}
.about__row {
    border: solid 1px #d2d2d2;
    padding: 14px;
}
#about-14 > div > div > div.about__content.w-full.md\:w-7\/12 > a {
  width: -webkit-fill-available;
    background: transparent;
    border: solid 1px #ff9852;
    color: #eb7626;
      margin: 0;
}
#about-14 img {
    object-fit: cover;
    object-position: top !important;
}





























@media (max-width: 991px) {
    .s-block--enhanced-features.mini-features .s-block--enhanced-features__item {
        padding: 1rem !important;
    }
}
.s-block--enhanced-features__item .feature-icon {
  margin-bottom: 0px;
}
.s-block--enhanced-features__item .feature-icon {
      height: 2rem;
}
.s-block--enhanced-features__item .feature-icon i {
  font-size: 1.5rem;
}











/* 1. إضافة مساحات تنفس حول القسم بالكامل */
.s-block--compare {
    padding: 3rem 1rem;
}

/* 2. تحسين المسافة بين العنوان والسلايدر */
.s-block--compare .home-block-title {
    margin-bottom: 1.5rem;
}
section.s-block.s-block--compare.compare-9.s-block,
section.s-block.s-block--bundle-html-content {
  margin-top: 0px !important;
}
/* 3. تحسين شكل السلايدر (منع التمدد المبالغ فيه وإضافة لمسة جمالية) */
#compare-slider-9 {
    max-width: 900px !important; /* تقييد العرض الأقصى لكي لا تبدو الصور عملاقة على الكمبيوتر */
    margin: 0 auto; /* توسيط السلايدر في منتصف الشاشة */
    border-radius: 16px; /* حواف دائرية ناعمة */
    box-shadow: 0 15px 35px rgb(0 0 0 / 31%); /* ظل ناعم يعطي بروزاً وعمقاً للقسم */
    border: 4px solid #e67a30; /* إطار أبيض أنيق يحيط بالصور */
    overflow: hidden; /* إخفاء أي أطراف بارزة للصورة خارج الحواف الدائرية */
    display: block;
    
    /* تحسين شكل المقبض والخط الفاصل */
    --divider-width: 3px;
    --divider-color: #ffffff;
    --default-handle-color: #ffffff;
    --default-handle-shadow: 0px 4px 10px rgba(0,0,0,0.4);
    --divider-shadow: 0px 0px 8px rgba(0,0,0,0.3);
    outline: none !important;
}

/* 4. إزالة الهوامش الافتراضية من الصور */
#compare-slider-9 figure {
    margin: 0 !important;
}

/* 5. منع تشوه الصور (التمطيط) وضبط أبعادها */
#compare-slider-9 img {
    width: 100% !important;
    height: auto !important;
    max-height: 600px; /* حد أقصى للارتفاع */
    object-fit: cover !important; /* يمنع انضغاط أو تمطيط الصورة */
    display: block;
    
    /* إذا كانت الصورتين مختلفتين في المقاس، احذف علامة التعليق عن السطر التالي لتوحيد مقاسهما */
    /* aspect-ratio: 16/9; */
}
/* 3. تحسين شكل السلايدر (منع التمدد المبالغ فيه وإضافة لمسة جمالية) */
.product-single img-comparison-slider {
    max-width: 900px !important; /* تقييد العرض الأقصى لكي لا تبدو الصور عملاقة على الكمبيوتر */
    margin: 0 auto !important; /* توسيط السلايدر في منتصف الشاشة */
    border-radius: 16px !important; /* حواف دائرية ناعمة */
    box-shadow: 0 15px 35px rgb(0 0 0 / 31%) !important; /* ظل ناعم يعطي بروزاً وعمقاً للقسم */
    border: 4px solid #e67a30 !important; /* إطار أنيق يحيط بالصور */
    overflow: hidden !important; /* إخفاء أي أطراف بارزة للصورة خارج الحواف الدائرية */
    display: block !important;
    
    /* تحسين شكل المقبض والخط الفاصل */
    --divider-width: 3px;
    --divider-color: #ffffff;
    --default-handle-color: #ffffff;
    --default-handle-shadow: 0px 4px 10px rgba(0,0,0,0.4);
    --divider-shadow: 0px 0px 8px rgba(0,0,0,0.3);
    outline: none !important;
}

/* 4. إزالة الهوامش الافتراضية من الصور */
.product-single img-comparison-slider figure {
    margin: 0 !important;
}

/* 5. منع تشوه الصور (التمطيط) وضبط أبعادها */
.product-single img-comparison-slider img {
    width: 100% !important;
    height: auto !important;
    max-height: 600px !important; /* حد أقصى للارتفاع */
    object-fit: cover !important; /* يمنع انضغاط أو تمطيط الصورة */
    display: block !important;
    
    /* إذا كانت الصورتين مختلفتين في المقاس، احذف علامة التعليق عن السطر التالي لتوحيد مقاسهما */
    /* aspect-ratio: 16/9 !important; */
}

/* تنسيق العنوان (عدسات القيادة الليلية): تصغير الحجم وتقليل سماكة الخط ليكون ناعماً */
.product-single .home-block-title .compare__title {
    font-size: 24px !important; /* حجم خط أصغر */
    font-weight: 500 !important; /* سماكة متوسطة بدلاً من العريض جداً */
    line-height: 1.5 !important;
    
}

/* إخفاء الخط السفلي للعنوان */
.product-single .home-block-title .enhanced-title-border {
    display: none !important;
}

/* تنسيق النص الوصفي (الوصف أسفل العنوان) */
.product-single .home-block-title .compare__description {
    font-size: 12px !important; /* حجم صغير */
    font-weight: 400 !important; /* خط عادي وناعم */
    color: #666 !important; /* لون رمادي ناعم مريح للعين */
    margin-top: 12px !important;
  line-height: 1.5rem;
}

/* تنسيق خلفية القسم */
.product-single section.s-block--compare {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 60%, rgba(0, 0, 0, 0.05) 100%) !important;
  margin-top: 0;
    padding-top: 0;
}
.product-single #btn-show-more {
    border: solid 1px;
    width: 100%;
    text-align: center;
    font-weight: 500;
    padding: 12px 12px;
    box-shadow: -4px 4px;
}
.product-single-top-description {
  margin-top: 10px;
  padding: 10px
}
#product-form > div.s-blocks-wrapper.s-after-related {
  margin-top: 0px !important;
}
#product-form > div.s-blocks-wrapper.s-after-related > section {
  border: solid 1px #d6d3d0;
    border-radius: 10px;
    padding: 14px 4px;
      margin-top: 0px !important;
}
#product-form > div.s-blocks-wrapper.s-after-related > section > div > div > h2 {
  font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
  text-align: left !important;
      margin: 0;
}
#product-form > div.s-blocks-wrapper.s-after-related > section > div > div > p {
  font-size: 12px !important;
    font-weight: 400 !important;
    color: #666 !important;
    margin-top: 12px !important;
    line-height: 1.5rem;
      text-align: right;
}

.lensfeature .about__row {
  border-radius: 15px;
    border: solid 2px #e67a30;
    box-shadow: 0 15px 20px rgb(0 0 0 / 14%) !important;
}
.lensfeature .about__media {
      height: 18vh;
}
.lensfeature .about__row .container {
  padding : 0 4rem !important;
}
.lensfeature .about__subtitle {
  text-align: center;
  font-size: 14px !important;
}
.lensfeature .btn {
  width: 100%;
  background: transparent;
  color: #e7692a;
  border: solid 1px #e7692a;
  border-radius: 15px !important;
  margin-top: 0px !important;
}
.lensfeature .about__title {
  font-size: 24px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
   color: black;
  font-feature-settings: normal !important;
  background: linear-gradient(45deg, #000000 35%, #ff7a00 100%) !important;
  
    
    /* 2. قص الخلفية لتكون داخل حدود الحروف فقط */
    -webkit-background-clip: text !important;
    background-clip: text !important;
    
    /* 3. جعل لون النص الأساسي شفافاً ليظهر التدرج من خلفه */
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
  margin-bottom: 0px;
}
.lensfeature .about__description {
      font-size: 12px !important;
    font-weight: 400 !important;
    color: #666 !important;
    margin-top: 12px !important;
    line-height: 1.5rem;
}
.lensfeature .about__media img {
  
}














@media (max-width: 767px) {
    .index.mobile_small_blocks_titles .home-block-title h2+p {
        font-size: .7rem;
        margin-top: 16px;
    }
}







/* 
========================================================
Footer
======================================================== 
*/

@media (max-width: 768px) {
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div.lg\:-mt-\[45px\].relative.z-\[1\].lg\:col-\[2\] > div.footer-badges.flex.justify-center.items-center > div > a {
  display : none;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div.lg\:-mt-\[45px\].relative.z-\[1\].lg\:col-\[2\] > div.footer-badges.flex.justify-center.items-center > salla-trust-badges > img {
  display : none;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div:nth-child(3) {
  display : none;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.footer-bottom > div > salla-payments {
  display : none;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__contacts-row > selia-contacts {
  display : none;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > svg > path {
  display : none;
}

#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div.text-center.order-1.lg\:order-\[unset\] > ul > li {
  opacity : 50%;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div.lg\:-mt-\[45px\].relative.z-\[1\].lg\:col-\[2\] > div.footer-badges.flex.justify-center.items-center > salla-trust-badges > div > b,
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div.lg\:-mt-\[45px\].relative.z-\[1\].lg\:col-\[2\] > div.footer-badges.flex.justify-center.items-center > div > div > b {
  opacity : 50%;
}

#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.footer-bottom > div > span > p {
  opacity :50%;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__contacts-row:before {
  content : 'تواصل معنا';
  display: flex;
  flex-direction: column;
  align-items: center;
}
#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner {
  padding-bottom : 0;
}


#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.store-footer__inner > div > div.lg\:-mt-\[45px\].relative.z-\[1\].lg\:col-\[2\] > div.footer-badges.flex.justify-center.items-center > div > div > p {
  text-align : center;
}


#app > div.app-inner.flex.flex-col.min-h-full.bg-storeBG > footer > div > div.footer-bottom > div > span > p {
  font-size: 0; /* إخفاء النص القديم "جميع الحقوق محفوظة" */
}








.store-footer:not(.basic-footer) .footer-description, .store-footer:not(.basic-footer) .footer-description p, .store-footer:not(.basic-footer) .footer-description+p {
    font-size: 12px;
    margin-bottom: 20px;
    text-align: center;
    opacity: 50%;
}

/* 4. تحسين شارة السجل التجاري لتبرز فوق الصورة */
.store-footer .s-trust-badges-wrapper {
    background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 12px !important;
    padding: 10px 15px !important;
    backdrop-filter: blur(5px) !important;
}

.store-footer .s-trust-badges-label, 
.store-footer .s-trust-badges-number {
    color: #ffffff !important;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8) !important;
}

/* 1. إضافة الصورة للفوتر وجعله شفافاً بالأساس */
footer.store-footer {
    background-image: linear-gradient(rgb(0 0 0 / 0%), rgb(0 0 0)), url("") !important;
    mix-blend-mode: luminosity;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: #000000 !important;
    border: none !important;
}

/* 2. إزالة أي لون خلفية من العناصر الداخلية حتى لا تغطي الصورة */
footer.store-footer > div,
.store-footer__inner,
.footer-bottom,
.store-footer__bottom-inner,
.footer-is-custom .store-footer .store-footer__contacts-row {
    background-color: #000000 !important;
    background: #0000002b !important;
}

/* 1. إخفاء الشعار القديم تماماً */
.store-footer__logo-link img {
    display: none !important;
}

/* 2. إضافة الشعار الجديد كخلفية */
.store-footer__logo-link {
    background-image: url('https://i.ibb.co/yBFvhLNy/image.webp') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    display: block !important;
    height: 40px !important; /* يمكنك تعديل ارتفاع الشعار من هنا */
    width: 100% !important;
    max-width: 200px !important; /* أقصى عرض للشعار */
    margin: 0 auto !important; /* لضمان توسيط الشعار */
}










.product-single .product-features-item, .s-product-options-wrapper {
  border: solid 1px silver;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 60%, rgba(0, 0, 0, 0.05) 100%) !important;

  border: solid 1px #e7692a;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 10%, rgb(255 125 0) 110%) !important;
}
#product-form > section.sticky-product-bar.bg-storeBG.p-5.md.rounded-md.rounded-b-none > salla-add-product-button > div > salla-button > button {
  color: white;
}


.s-product-options-option-content {
    overflow: visible;
}
/* --- 1. توزيع المساحات بشكل متساوي (Equal Fill) --- */
.s-product-options-grid-mode {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.s-product-options-grid-mode label {
    flex: 1 1 0% !important; /* هذا السطر يجبر الخيارات على ملء المساحة بالتساوي */
    min-width: 140px !important; /* يمنع الخيارات من الانكماش الزائد في الجوال */
    margin: 0 !important;
}

/* --- 2. تصميم واضح وثابت (بدون تأثيرات Hover) --- */
.s-product-options-grid-mode-span {
    display: flex !important;
    flex-direction: column !important; /* لعرض السعر تحت النص */
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 16px 12px !important;
    background: #fdfdfd !important;
    border: 1px solid #e5e5e5 !important; /* حدود واضحة وسميكة */
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: #444 !important;
    height: 100% !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
  background: #fdfdfd4f !important;
    border: 1px solid #ffffff !important;
  color: black !important;
  box-shadow: 0px 5px 10px #ff87004f;
    /* تمت إزالة أي تأثيرات Hover */
}

/* إخفاء دوائر التحديد الافتراضية بشكل كامل */
.s-product-options-grid-mode input[type="radio"],
.s-product-options-grid-mode input[type="checkbox"] {
    display: none !important;
}

/* --- 3. حالة التحديد (واضحة جداً وعالية التباين) --- */
.s-product-options-grid-mode input:checked + .s-product-options-grid-mode-span {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
    box-shadow: inset 0 0 0 1px #000000 !important; /* زيادة سماكة الحد من الداخل للتأكيد */
}

/* --- 4. تنسيق السعر المنفصل (يعمل مع كود الـ JS أدناه) --- */
.option-price {
    display: inline-block !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    color: #e7692a !important;
    margin-top: 8px !important;
    background: #eb762612 !important; /* خلفية مميزة للسعر */
    padding: 4px 10px !important;
    border-radius: 6px !important;
  color: #ff7834 !important;
    margin-top: 8px !important;
    background: #ffffff2b !important;
    border: solid 1px #ffffff87;
}

/* تغيير شكل السعر عند تحديد الخيار */
.s-product-options-grid-mode input:checked + .s-product-options-grid-mode-span .option-price {
    background: #e7692a !important;
    color: #ffffff !important;
}









/* ========================================= */
/* 1. إعداد الحاوية الخارجية (للعنوان والنجمة) */
/* ========================================= */
/*.s-product-options-wrapper {
  margin-top: 60px !important;
}*/
salla-product-options.s-product-options-wrapper {
    position: relative;
    display: block;
    padding-top: 65px !important; /* مساحة علوية للعنوان والنجمة */
    padding-left: 0px;
    padding-right: 0px;
      margin-bottom: 0px !important;
    margin-top: 10px;
    /* تأكيد إزالة أي إطار أو خلفية من الحاوية الخارجية حتى لا يغلف العنوان */
    border: none !important;
    background: transparent !important;
}

/* عنوان خيارات الطلب */
salla-product-options.s-product-options-wrapper::before {
    content: "خيارات العدسات";
    position: absolute;
    top: 0px; 
    color: #333333; 
    font-size: 18px;
    font-weight: bold;
    right: 34px; /* إزاحة النص لتوفير مساحة للنجمة */
    color: #ffffff00; 
  background-image: linear-gradient(49deg, var(--token-a378a457-09c9-4e21-8971-31a4dc6ae8ea, rgb(17, 16, 17)) 0%, var(--token-77abf34c-bfd0-46e4-bdc5-396472ca5ca6, rgba(17, 16, 17, 0.6)) 100%) !important;
  background-clip: text !important;
    font-size: 30px;
    font-weight: 900;
  padding : 16px 12px;
      font-feature-settings: "swsh" 1, "cswh" 1, "salt" 1, "ss01" 1, "ss02" 1, "ss03" 1, "liga" 1, "dlig" 1, "jalt" 1 !important;
}

/* النجمة الدوارة ✱ */
salla-product-options.s-product-options-wrapper::after {
    content: "\2731"; 
    position: absolute;
    top: 8px;
    
    font-size: 45px; 
    color: #ff9800; 
    width: 45px; 
    height: 45px; 
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0; 
    transform-origin: center center; 
    animation: spinPerfectly 4s linear infinite; 
}

@keyframes spinPerfectly {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* ========================================= */
/* 2. تصميم الصندوق الداخلي (الذي يحوي الخيارات) */
/* ========================================= */
/* نقلنا تصميمك للإطار والخلفية إلى العنصر الداخلي salla-conditional-fields */
.product-single .product-features-item, 
salla-product-options salla-conditional-fields {
    display: block;
    border: solid 1px #e7692a !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 10%, rgb(255 125 0) 110%) !important;
    padding: 15px !important; /* مساحة داخلية حتى لا تلتصق الخيارات بالإطار */
    border-radius: 8px !important; /* حواف دائرية للصندوق */
}


/* ========================================= */
/* 3. أكوادك السابقة المتبقية (كما هي تماماً)  */
/* ========================================= */
#product-form > section.sticky-product-bar.bg-storeBG.p-5.md.rounded-md.rounded-b-none > salla-add-product-button > div > salla-button > button {
    color: white;
}

.s-product-options-option-content {
    overflow: visible;
}

/* توزيع المساحات بشكل متساوي (Equal Fill) */
.s-product-options-grid-mode {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.s-product-options-grid-mode label {
    flex: 1 1 0% !important;
    min-width: 140px !important;
    margin: 0 !important;
}

/* تصميم واضح وثابت (بدون تأثيرات Hover) */
.s-product-options-grid-mode-span {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 16px 12px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    height: 100% !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    background: #fdfdfd4f !important;
    border: 1px solid #ffffff !important;
    color: black !important;
    box-shadow: 0px 5px 10px #ff87004f;
}

/* إخفاء دوائر التحديد الافتراضية بشكل كامل */
.s-product-options-grid-mode input[type="radio"],
.s-product-options-grid-mode input[type="checkbox"] {
    display: none !important;
}

/* حالة التحديد (واضحة جداً وعالية التباين) */
.s-product-options-grid-mode input:checked + .s-product-options-grid-mode-span {
    background: #ffffff !important;
    border-color: #000000 !important;
    color: #000000 !important;
    box-shadow: inset 0 0 0 1px #000000 !important;
}

/* تنسيق السعر المنفصل */
.option-price {
    display: inline-block !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    color: #ff7834 !important;
    margin-top: 8px !important;
    background: #ffffff2b !important;
    border: solid 1px #ffffff87;
}

/* تغيير شكل السعر عند تحديد الخيار */
.s-product-options-grid-mode input:checked + .s-product-options-grid-mode-span .option-price {
    background: #e7692a !important;
    color: #ffffff !important;
}