/* Add custom CSS styles below */ 
/* ---------------------------------------------------
   1. الهيدر والفوتر (الخلفية الكحلية والنصوص البيضاء)
-----------------------------------------------------*/
.store-header, 
.store-header .top-navbar, 
.store-header .main-nav-container, 
.store-footer,
.store-footer__inner {
    background-color: #051433 !important;
    border: none !important;
}

.store-header *, 
.store-footer * {
    color: #ffffff !important;
}

.s-search-input {
    background-color: #ffffff !important;
    color: #051433 !important;
}
.s-search-icon svg {
    fill: #051433 !important;
}

/* ---------------------------------------------------
   2. توسيط اللوقو في الهيدر
-----------------------------------------------------*/
.store-header .navbar-brand {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
}

/* ---------------------------------------------------
   3. إضافة اللوقو أعلى الفوتر
-----------------------------------------------------*/
.store-footer__inner::before {
    content: "";
    display: block;
    width: 250px;
    height: 70px;
    margin: 0 auto 40px auto;
    background-image: url('https://cdn.files.salla.network/theme/907078123/7bd386ac-28d3-424a-b88c-201768813694_500x133.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ---------------------------------------------------
   4. الأيقونات (حل نهائي للتكرار وضبط المحاذاة)
-----------------------------------------------------*/
.s-cart-summary-wrapper, 
.s-user-menu-login-btn {
    height: 40px !important;
    width: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* إخفاء كل ما هو موجود داخل حاويات الأيقونات */
.s-cart-summary-wrapper #s-cart-icon,
.s-cart-summary-wrapper slot-fb,
.s-cart-summary-wrapper .header-btn__icon,
.s-cart-summary-wrapper .s-cart-summary-icon,
.s-user-menu-login-btn svg {
    display: none !important;
}

/* إضافة أيقونة السلة كخلفية مباشرة */
.s-cart-summary-wrapper {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"></path><line x1="3" y1="6" x2="21" y2="6"></line><path d="M16 10a4 4 0 0 1-8 0"></path></svg>') no-repeat center center !important;
    background-size: 24px !important;
}

/* إضافة أيقونة الملف الشخصي كخلفية مباشرة */
.s-user-menu-login-btn {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>') no-repeat center center !important;
    background-size: 24px !important;
}

/* ضبط عداد السلة */
.s-cart-summary-count {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    background: #ff4d4d !important;
    color: #ffffff !important;
    font-size: 9px !important;
    border-radius: 50% !important;
    min-width: 15px !important;
    height: 15px !important;
    line-height: 15px !important;
    text-align: center !important;
    padding: 0 !important;
}

.s-cart-summary-content { display: none !important; }

/* ---------------------------------------------------
   5. خلفية الموقع (لون بيج فاخر)
-----------------------------------------------------*/
body, main, .app-inner {
    background-color: #F6EFDF !important;
}

.style attribute {
    --vertical-offset: -80px;
    --bg-color: #e6d3b5;
    --title-color: #0a1533;
    --desc-color: #fffefd;
    --card-bg: #ffffff;
    --card-name: #0a1533;
    --card-hover: #ffffff;
    --border-color: #f1f1f1;
}
.section-padding {
   
    background-color: rgb(230 211 181);
}
.offset-wrapper {background-color: #e6d3b5;
    padding: 4rem 1rem;
}
/* ---------------------------------------------------
   6. لمسات إضافية احترافية
-----------------------------------------------------*/
.s-product-card, .card {
    background-color: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(5, 20, 51, 0.05) !important;
    border: 1px solid #eaeaea !important;
    transition: transform 0.3s ease !important;
}

.s-product-card:hover, .card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(5, 20, 51, 0.1) !important;
}

.btn-add, .s-button-element, button.btn {
    background-color: #051433 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    border: none !important;
}
    .s-block {
        margin-top: 0rem;
    }
}