/* Add custom CSS styles below */ 
.app-inner{
    background: white;
}

@media (min-width: 640px) {
    .s-block {
        margin-top: 1rem;
    }
} .s-block {
        margin-top: 1rem;
    }@media (min-width: 480px) {
    .navbar-brand img {
        max-width: 194px;
    }
}.navbar-brand img {
    max-height: 5rem;
    max-width: 100px;
    width: auto;
}.main-nav-container.fixed-pinned .navbar-brand img {
    max-height: 60px;
}
 .footer-is-light .store-footer .store-footer__inner {

    background-color: WHITE!IMPORTANT;
}.store-footer__inner {
   padding-bottom:1rem!IMPORTANT;
    padding-top: 0rem!IMPORTANT;
}


.footer-is-light .store-footer {
    --tw-bg-opacity: 1;
    background-color: #f9fafb;
    background-color: WHITE;
}
  store-footer {
    margin-top: -1rem;
}@media (min-width: 640px) {
  .INDEX .store-footer {
        margin-top: -2rem;
    }
}@media (min-width: 1024px) {
    .store-footer__inner {
        padding-bottom: 1rem;
        padding-top: 1rem;
    }
}

#main-content{
    BACKGROUND: WHITE;
}


.features-clean-section {
    padding: 60px 20px;
    background-color: #ffffff;
    direction: rtl;
    font-family: inherit; /* استخدام نفس خط المتجر الأساسي */
}

.features-clean-container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* توزيع متساوٍ على 5 أعمدة */
    gap: 30px;
}

.feature-item {
    text-align: center;
    background: transparent;
    padding: 10px;
    font-family: inherit;
}

/* الأيقونات بلون ذهبي هادئ وبسيط */
.feature-icon {
    color: #d4af37; 
    width: 36px;
    height: 36px;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature-icon svg {
    width: 100%;
    height: 100%;
}

.feature-item h3 {
    font-size: 16px;
    color: #111111;
    margin: 0 0 10px 0;
    font-weight: 600;
    font-family: inherit;
}

.feature-item p {
    font-size: 13.5px;
    color: #666666;
    line-height: 1.6;
    margin: 0;
    font-family: inherit;
}

/* التجاوب مع الشاشات المتوسطة والصغيرة */
@media (max-width: 1024px) {
    .features-clean-container {
        grid-template-columns: repeat(3, 1fr); /* 3 عناصر في الصف في الشاشات اللوحية */
    }
}

@media (max-width: 768px) {
    .features-clean-container {
        grid-template-columns: 1fr; /* عنصر واحد في الصف على الموبايل */
        gap: 40px;
    }
    
    .feature-item {
        max-width: 400px;
        margin: 0 auto;
    }
}

.features-clean-section {
    padding: 60px 20px;
    background-color: #ffffff;
    direction: rtl;
    font-family: inherit; /* يرث خط المتجر */
}

/* تنسيق العناوين الجديدة */
.section-header {
    text-align: center;
    margin-bottom: 50px;
    font-family: inherit;
}

.section-header h2 {
    font-size: 26px;
    color: #111111;
    margin: 0 0 10px 0;
    font-weight: 700;
    font-family: inherit;
}

.section-header p {
    font-size: 15px;
    color: #888888;
    margin: 0;
    font-family: inherit;
}

.features-clean-container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(5, 1fr); 
    gap: 20px;
}

.feature-item {
    text-align: center;
    background: transparent;
    padding: 15px 10px;
    font-family: inherit;
}

.feature-icon {
    color: #d4af37; /* ذهبي ناعم متناسق مع لوجو سيراز */
    width: 32px;
    height: 32px;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.feature-icon svg {
    width: 100%;
    height: 100%;
}

.feature-item h3 {
    font-size: 16px;
    color: #111111;
    margin: 0 0 8px 0;
    font-weight: 600;
    font-family: inherit;
}

.feature-item p {
    font-size: 13px;
    color: #666666;
    line-height: 1.5;
    margin: 0;
    font-family: inherit;
}

/* التجاوب */
@media (max-width: 1024px) {
    .features-clean-container {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
}

@media (max-width: 768px) {
    .section-header h2 { font-size: 22px; }
    .section-header p { font-size: 14px; }
    
    .features-clean-container {
        grid-template-columns: 1fr;
        gap: 35px;
    }.s-products-slider-card {
    max-width:200px;}

.s-product-card-entry {
    
    height:80%;}
}

.s-block {
    margin-top: 0rem;
}
.object-cover {
    -o-object-fit: cover;
    object-fit: contain;
    BACKGROUND: WHITE;
}


.index .s-product-card-content-subtitle {
    display: none;}


.s-product-card-content-title,
.s-product-card-content-title a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    max-width: 100%; /* لضمان عدم تجاوز العرض المتاح */
}
.s-user-menu-login-btn {  height: 1.5rem; width: 1.5rem;}
.header-btn__icon {

    height: 1.5rem;
    width: 1.5rem;}
.rtl\:mr-4:where([dir=rtl],[dir=rtl] *) {
    margin-right: 0.5rem;
    display: flex;
    align-items: center;
}.navbar-brand img {
    max-height: 4rem;
    max-width: 100px;
    width: auto;
}


.s-cart-summary-count {
  
    height: .75rem;
    width: .75rem;}


#slider-with-bg-5 .swiper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* يعطي تأثير النعومة والارتداد على هواتف آيفون */
    scroll-behavior: smooth;
}@media (max-width: 768px) {
    /* 1. تحويل السلايدر لتمرير حر وسريع في الموبايل */
    #slider-with-bg-5 .swiper {
        overflow-x: auto !important;
        scroll-behavior: smooth !important;
        -webkit-overflow-scrolling: touch !important; /* ميزة السرعة العالية والارتداد المرن على الآيفون والاندرويد */
    }

    /* 2. إلغاء القيود البرمجية التي تجبره على التوقف عند منتج واحد */
    #slider-with-bg-5 .swiper-wrapper {
        transform: none !important; 
        display: flex !important;
        width: max-content !important;
    }

    /* 3. إخفاء شريط التمرير (Scrollbar) المزعج في الأسفل ليظل المظهر نظيفاً */
    #slider-with-bg-5 .swiper::-webkit-scrollbar {
        display: none !important;
    }
}