/* Add custom CSS styles below */ 
/* تطبيق الخط على جميع عناصر الموقع */
body, h1, h2, h3, h4, h5, h6, p, span, a, li, button {
    font-family: 'Cairo', sans-serif !important;
  
}


/* تنسيق كلمة "القائمة" في الهيدر */
.mburger p.da-tm {
    color: rgb(198, 162, 113) !important;
}

/* تنسيق أيقونة القائمة (الثلاث خطوط) */
.mburger i.sicon-menu {
    color: rgb(198, 162, 113) !important;
}

/* تنسيق زر العودة (السهم) في الجوال */
#back-Btn, #back-Btn i {
    color: rgb(198, 162, 113) !important;
}

/* اختيار اختياري: تغيير اللون عند تمرير الماوس ليعطي إيحاء بالتفاعل */
.mburger:hover p, .mburger:hover i, #back-Btn:hover i {
    filter: brightness(1.2);
    transition: 0.3s;
}

/* تنسيق أيقونة البحث */
.search-btn i.sicon-search {
    color: rgb(198, 162, 113) !important;
}

/* في حال أردت إزالة اللون الأسود الافتراضي تماماً */
.search-btn i.text-black {
    color: rgb(198, 162, 113) !important;
}

/* تنسيق زر السلة بالكامل */

/* 1. أيقونة السلة (الرسمة) */
.header-cart i.sicon-cart2, 
.header-cart i.s-cart-summary-icon svg path {
    color: rgb(198, 162, 113) !important;
    fill: rgb(198, 162, 113) !important; /* خاص بملفات الـ SVG */
}

/* 2. رقم عدد المنتجات (فوق السلة) */
.s-cart-summary-count {
    background-color: rgb(198, 162, 113) !important; /* لون خلفية الدائرة */
    color: #fff !important; /* لون الرقم داخل الدائرة (أبيض للوضوح) */
}



/* تحريك شعار جرام للأعلى */
.navbar-brand img.logo-light {
    position: relative;
    top: -40px !important; 
    transition: all 0.3s ease;
}

/* ضبط المسافات في الجوال لضمان عدم تداخل الشعار مع شريط الإعلانات الأسود */
@media (max-width: 768px) {
    .navbar-brand img.logo-light {
        top: -25px !important;
        height: 6.5rem !important; /* تصغير بسيط ليناسب الهيدر في الجوال */
    }
}


/*سناب شات*/



.snap-follow-bar {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%); 
    background-color: #000;
    color: #fff;
    text-decoration: none !important;
    display: flex;
    align-items: center;
    padding: 12px 25px;
    border-radius: 50px; 
    z-index: 999999;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid #fffc00;
    transition: all 0.5s ease; 
    direction: ltr;
    animation: slideDown 0.5s ease-out; 
}


@keyframes slideDown {
    from { transform: translate(-50%, -100%); opacity: 0; }
    to { transform: translate(-50%, 0); opacity: 1; }
}

.snap-content {
    display: flex;
    align-items: center;
    gap: 12px;
}

.snap-logo {
    width: 25px;
    height: 25px;
}

.snap-text {
    font-size: 14px;
    font-family: 'Arial', sans-serif;
    white-space: nowrap;
}

.snap-text strong {
    color: #fffc00;
}


@media (max-width: 768px) {
    .snap-follow-bar {
        width: 90%;
        top: 10px;
        padding: 10px;
    }
    .snap-text {
        font-size: 12px;
    }
}





.snap-follow-bar {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #000;
    color: #fff;
    text-decoration: none !important;
    display: flex;
    align-items: center;
    padding: 10px 22px;
    border-radius: 50px;
    z-index: 999999;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    border: 1px solid #fffc00;
    transition: all 0.5s ease;
    direction: ltr;
    animation: slideDown 0.5s ease-out;
}

@keyframes slideDown {
    from { transform: translate(-50%, -100%); opacity: 0; }
    to { transform: translate(-50%, 0); opacity: 1; }
}

.snap-content {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* تصميم الأيقونة داخل وسم i */
.snap-icon-i {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-color: #fffc00; /* لون سناب شات الأصفر */
    mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c-4.418 0-8 3.582-8 8 0 2.21.9 4.21 2.343 5.657L12 22l5.657-6.343C19.1 14.21 20 12.21 20 10c0-4.418-3.582-8-8-8z'/%3E%3C/svg%3E") no-repeat center;
    -webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2c-3.5 0-6.5 2.5-6.5 6s3 6 6.5 6s6.5-2.5 6.5-6s-3-6-6.5-6zM12 16c-4 0-8 2-8 5v1h16v-1c0-3-4-5-8-5z'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}

/* إذا كنت تملك مكتبة Font Awesome في موقعك، يمكنك استبدال ما سبق بـ: */
/* .snap-icon-i { font-style: normal; } .snap-icon-i::before { content: '\f2ad'; font-family: 'Font Awesome 5 Brands'; color: #fffc00; } */

.snap-text {
    font-size: 14px;
    font-family: sans-serif;
    white-space: nowrap;
}

.snap-text strong {
    color: #fffc00;
}

@media (max-width: 768px) {
    .snap-follow-bar {
        width: 85%;
        top: 15px;
        padding: 8px 15px;
    }
}