:where([class^="ri-"])::before {
    content: "\f3c2";
}
body {
    font-family: 'Roboto', 'Tajawal', sans-serif;
    background-color: white !important; 
}
.rtl {
    direction: rtl;
    text-align: right;
}
.ltr {
    direction: ltr;
    text-align: left;
}
.hospitals-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.5rem;
    padding: 1rem;
}
.hospital-card {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
    border-top: 4px solid #00695C; /* Primary color */
    transition: transform 0.2s, box-shadow 0.2s;
    min-height: 400px; /* Ensures taller card */
}
.hospital-card:hover {
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}
.hospital-content {
    display: flex;
    flex-direction: column; /* Stack vertically */
    gap: 1rem;
}
.hospital-content img {
    width: 350px; /* Square image */
    height: 180px; /* Square image */
    object-fit: cover;
    border-radius: 0; /* Remove rounding */
    align-self: center; /* Center the image */
}
.hospital-info h3 {
    font-size: 1.25rem;
    font-weight: bold;
    color: #1F2937;
}
.hospital-info p {
    color: #4B5563;
    margin-top: 0.5rem; /* Space between name and intro */
}
.hospital-info .text-primary {
    color: #00695C; /* Primary color */
}
.hospital-info .text-secondary {
    color: #FFB300; /* Secondary color */
}
.hospital-buttons {
    margin-top: 1.5rem; /* Increased spacing above button */
}
.learn-more {
    display: block;
    background: #FFB300; /* Secondary color */
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    transition: background 0.3s;
}
.learn-more:hover {
    background: #E0A800; /* Darker secondary shade */
}
.no-results {
    text-align: center;
    padding: 2rem;
    width: 100%;
}
.no-results-icon {
    font-size: 50px;
    color: #FFB300; /* Secondary color */
    margin-bottom: 20px; /* Increased by 10px */
}
.no-results p {
    font-size: 16px;
    color: #4B5563;
}
.faq-toggle {
    transition: transform 0.3s ease;
}

.language-switcher {
    position: relative;
}
.ltr {
    direction: ltr;
    text-align: left;
}
.language-dropdown {
    min-width: 80px; /* Adjusted for shorter labels */
    top: 100%; /* Positions it directly below the toggle */
    right: 0; /* Aligns to the right of the toggle */
}

.language-dropdown button {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    padding: 0.25rem 0.75rem; /* Reduced padding for compactness */
}

.language-dropdown .ri-english-input,
.language-dropdown .ri-arabic-input {
    font-size: 0.875rem; /* Smaller icons */
}
.whatsapp-button {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 50;
}
.rtl .whatsapp-button {
    right: auto;
    left: 24px;
}
@media (max-width: 1024px) {
    .desktop-menu {
        display: none;
    }
}
@media (min-width: 1025px) {
    .mobile-menu-button {
        display: none;
    }
}
/* Footer */
footer {
    background-color: #00695C;
    color: white;
    padding: 25px 20px;
    margin-top: 35px; /* 35px spacing above footer */
    border-top: 5px solid #FFB300;
}