/* تعريف الخط "Inter" */
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
        body {
            font-family: 'Inter', sans-serif;
            background-color: #ffffff; /* خلفية بيضاء لجميع الصفحات */
            color: #333;
        }
        /* لإخفاء وإظهار القوائم المنسدلة باستخدام CSS فقط للشاشات الكبيرة */
        .dropdown-menu {
            display: none;
        }
        .group:hover .dropdown-menu {
            display: block;
        }
        .nested-dropdown .nested-dropdown-menu {
            display: none;
            right: 100%; /* تظهر القائمة المتداخلة على يسار القائمة الأصلية */
            top: 0;
        }
        .nested-dropdown:hover .nested-dropdown-menu {
            display: block;
        }

        /* تعديلات على الأزرار والأيقونات لجعل الألوان تظهر */
        .btn-primary {
            @apply bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-md shadow-md transition duration-300 ease-in-out;
        }
        .icon-btn {
            @apply text-gray-700 hover:text-blue-600 transition duration-300 ease-in-out;
        }

        /* Mobile menu styles */
        .mobile-menu {
            transform: translateX(100%); /* Start off-screen to the right */
            transition: transform 0.3s ease-in-out;
        }
        .mobile-menu.active {
            transform: translateX(0); /* Slide in */
        }
        /* Overlay for mobile menu */
        .overlay {
            display: none;
            background-color: rgba(0, 0, 0, 0.5);
            z-index: 40; /* Below mobile menu, above main content */
        }
        .overlay.active {
            display: block;
        }

        /* Styles for mobile dropdowns (toggle on click) */
        .mobile-dropdown-menu {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-out;
        }
        .mobile-dropdown-menu.active {
            max-height: 500px; /* Adjust as needed to fit content */
        }
        .mobile-nested-dropdown-menu {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease-out;
        }
        .mobile-nested-dropdown-menu.active {
            max-height: 500px; /* Adjust as needed to fit content */
        }
        .swiper-slide {
    position: relative;
}

.swiper-slide .content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent overlay */
    color: white;
    padding: 1rem;
}