/* Add custom CSS styles below */ 
/* -------------------------------------------------- */
/* تحسين شريط التنقل العلوي (Header/Navbar) */
/* -------------------------------------------------- */

/* جعل شريط التنقل العلوي ثابتًا (Sticky) عند التمرير مع ظل عميق */
.s-header-main,
.header-main {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background-color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important; /* ظل عميق وواضح */
    transition: all 0.3s ease !important;
}

/* تنسيق شريط البحث ليكون أكثر وضوحًا */
.s-search-input,
input[type="search"] {
    border-radius: 50px !important; /* حواف مستديرة بالكامل */
    border: 1px solid #e0e0e0 !important;
    padding: 10px 20px !important;
    transition: border-color 0.3s ease !important;
}

/* تأثير عند التركيز على شريط البحث */
.s-search-input:focus,
input[type="search"]:focus {
    border-color: #007bff !important; /* لون أزرق عند التركيز */
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25) !important;
}

/* تنسيق أيقونات السلة والحساب */
.s-header-icon {
    color: #333333 !important; /* لون أيقونات داكن */
    transition: color 0.3s ease !important;
}

.s-header-icon:hover {
    color: #D90000 !important; /* لون أحمر عند التحويم */
}