/* تصميم عام - الثيم */

/* خلفية الصفحة بالكامل */
body {
    background-color: #F2F2F2;
    color: #171149;
    font-family: 'Carlito', sans-serif !important; /* استخدمت Carlito البديل المتاح للويب مع إجبار التطبيق */
}

/* خلفيات البلوكات - بطاقات المنتجات - الأقسام */
.card, .product-card, .section, .content-wrapper {
    background-color: #FFFFFF;
    border: 1px solid #8299AE;
    border-radius: 8px;
    padding: 15px;
    color: #171149;
    font-family: 'Carlito', sans-serif !important;
}

/* العناوين الرئيسية */
h1, h2, h3 {
    color: #566B87;
    font-family: 'Carlito', sans-serif !important;
}

/* الأزرار الرئيسية */
button, .btn-primary {
    background-color: #171149 !important; /* غامق واضح */
    color: #FFFFFF !important; /* نص فاتح */
    border: 2px solid #171149;
    padding: 10px 20px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background-color 0.3s, color 0.3s;
    cursor: pointer;
    font-weight: bold;
    font-family: 'Carlito', sans-serif !important;
}

/* تأثير عند مرور الماوس */
button:hover, .btn-primary:hover {
    background-color: #566B87 !important; /* درجة أفتح عند المرور */
    color: #FFFFFF !important;
}

/* أيقونة القفل داخل الأزرار */
button i, .btn-primary i {
    font-size: 16px;
    color: #FFFFFF !important; /* لون الأيقونة نفس لون النص */
}

/* الروابط */
a {
    color: #8299AE;
    text-decoration: none;
    font-family: 'Carlito', sans-serif !important;
}

a:hover {
    color: #171149;
    text-decoration: underline;
}

/* الهيدر والفوتر */
.header, .footer {
    background-color: #8299AE;
    color: #FFFFFF;
    padding: 20px;
    font-family: 'Carlito', sans-serif !important;
}

/* شريط التنقل */
.navbar {
    background-color: #566B87;
}

.navbar a {
    color: #FFFFFF;
    font-family: 'Carlito', sans-serif !important;
}

.navbar a:hover {
    color: #F2F2F2;
}
/* زر واتساب متحرك */
.floating-whatsapp {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 9999;
    text-decoration: none;
    animation: moveWhatsapp 2.5s ease-in-out infinite;
    font-family: 'Carlito', sans-serif !important;
}

@keyframes moveWhatsapp {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}

.floating-whatsapp .whatsapp-btn {
    background-color: #171149;
    color: #FFFFFF;
    border-radius: 35px;
    padding: 8px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.floating-whatsapp .whatsapp-btn:hover {
    background-color: #566B87;
    transform: scale(1.05);
}

.floating-whatsapp img {
    filter: brightness(0) invert(1); /* جعل الأيقونة بيضاء */
}