:root {
    /* تعريف الألوان الأساسية */
    --main-color: #bb5882; /* لون افتراضي */    --primary-color: #007BFF;
    --secondary-color: #0056b3;
    --light-color: rgba(0, 123, 255, 0.1);
    --lighter-color: rgba(0, 123, 255, 0.2);
    --text-color: #212529;
    --background-color: #F8F9FA;
    --transition-speed: 0.3s ease;
    --font-family: 'Cairo', sans-serif;

    /* أحجام النصوص */
    --font-size-small: 0.875rem;
    --font-size-medium: 1rem;
    --font-size-large: 1.25rem;
    --font-size-xlarge: 1.5rem;

    /* مسافات */
    --spacing-small: 8px;
    --spacing-medium: 16px;
    --spacing-large: 24px;
    --spacing-xlarge: 32px;

    --icon-size-small: 16px;
    --icon-size-medium: 24px;
    --icon-size-large: 32px;

}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html,
body,
button,
input,
textarea,
select {
    font-family: 'Cairo', sans-serif !important;
    -webkit-text-size-adjust: 100%;
}

body {
    line-height: 1.6; /* تحسين المسافات بين النصوص */
    color: var(--text-color, #333); /* لون النص */
    background-color: var(--background-color, #fff); /* خلفية الموقع */
    font-size: clamp(14px, 1rem, 18px); /* حجم النص الأساسي متجاوب */
    overflow-x: hidden; /* إخفاء التمرير الأفقي */
    /* padding-right: 400px !important;
    padding-left: 400px !important; */
}

/* العناوين */
h1 {
    font-size: clamp(2rem, 5vw, 3rem); /* عنوان كبير ومتجاوب */
    line-height: 1.3; /* تحسين المسافة بين الأسطر */
}

h2 {
    font-size: clamp(1.75rem, 4.5vw, 2.5rem);
}

h3 {
    font-size: clamp(1.5rem, 4vw, 2rem);
}

h4, h5, h6 {
    font-size: clamp(1.25rem, 3vw, 1.75rem);
}

/* النصوص العادية */
p, li, a {
    font-size: clamp(12px, 1.2rem, 16px); /* حجم نص مناسب ومتجاوب */
}

/* النصوص الصغيرة */
.small-text {
    font-size: clamp(10px, 1rem, 12px); /* نص صغير متجاوب */
}

.mega-menu-title{
    font-size: clamp(10px, 1.2rem, 14px); /* حجم نص مناسب ومتجاوب */
}

.mega-sub-title{
    font-size: clamp(10px, 1.2rem, 14px);
}

.fa-icon {
    font-size: var(--icon-size-medium); /* حجم افتراضي */
}

.fa-icon-small {
    font-size: var(--icon-size-small);
}

.fa-icon-large {
    font-size: var(--icon-size-large);
}

.custom-container {
    width: 100%;
    padding: 0 var(--spacing-medium);
    margin-right: auto;
    margin-left: auto;

    /* @media (min-width: 576px) {
        max-width: 540px;
    } */
    
    @media (min-width: 768px) {
        max-width: 760px;
    }
    @media (min-width: 992px) {
        max-width: 960px;
    }
    @media (min-width: 1200px) {
        max-width: 1140px;
    }
    @media (min-width: 1400px) {
        max-width: 1320px;
    }
}

/* الترويسة */
.header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: transparent;
    z-index: 1000;
    /* margin: 0 auto; */
    margin: 0;
    padding: 0;
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--spacing-small) 0;
    margin: 15px 0;
}

/* حجم الصورة للشاشات الكبيرة (أكبر من 991.11px) */
@media (min-width: 991.12px) {
    .logo img {
        height: 65px; /* الحجم للشاشات الكبيرة */
        max-width: 100%; /* التأكد من أن الصورة لا تتجاوز عرض الحاوية */
    }
}

/* حجم الصورة للشاشات الصغيرة (أقل من 991.11px) */
@media (max-width: 991.11px) {
    .logo img {
        height: 50px; /* الحجم للشاشات الصغيرة */
        max-width: 100%; /* التأكد من أن الصورة لا تتجاوز عرض الحاوية */
    }
}

.logo img {
    transition: height 0.3s ease; /* تأثير سلس لتغيير الحجم */
}

.language-switcher .btn {
    font-size: 1.5rem; /* حجم الخط */
    color: #fff; /* لون النص أبيض */
    background: rgba(255, 255, 255, 0.1); /* خلفية شفافة مع لون أبيض خفيف */
    backdrop-filter: blur(5px); /* تأثير بلور بسيط */
    border: 1px solid #fff; /* حدود بيضاء */
    padding: var(--spacing-small); /* المساحة الداخلية */
    border-radius: 5px; /* استدارة الزوايا */
    text-decoration: none; /* إزالة التسطير من النص */
    display: flex; /* لجعل العناصر داخل الزر تترتب بشكل أفقي */
    align-items: center; /* محاذاة العناصر عموديًا */
    justify-content: center; /* محاذاة العناصر أفقيًا */
    transition: all var(--transition-speed); /* تأثير انتقال سلس */
    gap: var(--spacing-small); /* المسافة بين العناصر داخل الزر */
    width: 50px; /* عرض ثابت */
    height: 50px; /* ارتفاع ثابت */
}

.language-switcher .btn:hover {
    background: rgba(255, 255, 255, 0.2); /* خلفية أكثر إضاءة عند التمرير */
    transform: scale(1.05); /* تكبير خفيف عند التمرير */
}