:root {
            --kaauh-teal: #00636e;
            --kaauh-teal-dark: #004a53;
            --kaauh-light-bg: #f9fbfd;
            --kaauh-border: #eaeff3;
        }

        /* NEW CLASS FOR WIDER CONTENT */
        .max-width-1600 {
            max-width: 1600px;
            margin-right: auto;
            margin-left: auto;
            /* Ensure mobile padding is present */
            padding-right: var(--bs-gutter-x, 0.75rem);
            padding-left: var(--bs-gutter-x, 0.75rem);
        }

        /* === Top Bar - CORRECTED SIZE AND PADDING === */
        .top-bar {
            background-color: white;
            border-bottom: 1px solid var(--kaauh-border);
            font-size: 0.825rem;
            padding: 0.25rem 0;
        }

        /* New class for ultra-small text, making the header much tighter */
        .text-xs {
            font-size: 0.65rem;
            line-height: 1.2;
        }

        /* Ensure logo images are smaller */
        .top-bar .logo-container img {
            height: 35px;
            max-width: 40px;
            object-fit: contain;
        }

        .top-bar .hospital-text {
            text-align: initial !important;
        }

        /* Hide the text for the non-current language */
        html[dir="rtl"] .top-bar .hospital-text .en { display: none; }
        html[dir="ltr"] .top-bar .hospital-text .ar { display: none; }

        @media (max-width: 767.98px) {
            .top-bar { display: none !important; } /* Use !important to ensure hiding */
        }

        /* === Navbar === */
        .navbar-dark {
            background-color: var(--kaauh-teal) !important;
            box-shadow: 0 2px 6px rgba(0,0,0,0.12);
        }

        /* New class for smaller mobile logo */
        .navbar-brand-mobile {
            height: 40px;
            width: auto;
        }

        /* FIX: Constrain SVG icons inside nav links to prevent them from being huge on mobile */
        .nav-link svg, .nav-link .size-6 {
            width: 1.25rem; /* 20px */
            height: 1.25rem; /* 20px */
            flex-shrink: 0; /* Prevents icons from shrinking when text is long */
            stroke-width: 2;
        }

        .nav-link {
            font-weight: 500;
            transition: all 0.2s ease;
            /* Increased mobile/collapsed menu padding for touch targets */
            padding: 0.75rem 1rem;
        }

        @media (min-width: 992px) { /* Restore desktop padding */
             .nav-link {
                padding: 0.5rem 0.75rem;
            }
        }

        .nav-link:hover,
        .nav-link.active {
            color: white !important;
            background: rgba(255,255,255,0.12) !important;
            border-radius: 4px;
        }

        /* Profile Avatar */
        .profile-avatar {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: var(--kaauh-teal);
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: bold;
            font-size: 0.85rem;
            transition: transform 0.1s ease;
        }
        /* Language Toggle Button Style */
        .language-toggle-btn {
            color: white !important;
            background: none !important;
            border: none !important;
            display: flex;
            align-items: center;
            gap: 0.3rem;
            padding: 0.5rem 0.75rem !important;
            font-weight: 500;
            transition: all 0.2s ease;
        }
        .language-toggle-btn:hover {
            background: rgba(255,255,255,0.12) !important;
            border-radius: 4px;
        }

        /* Dropdown Menu styling */
        .dropdown-menu {
            backdrop-filter: blur(4px);
            background-color: rgba(255, 255, 255, 0.98);
            border: 1px solid var(--kaauh-border);
            box-shadow: 0 6px 20px rgba(0,0,0,0.12);
            border-radius: 8px;
            padding: 0.5rem 0;
            min-width: 200px;
        }
        .dropdown-item {
            padding: 0.5rem 1.25rem;
            transition: background-color 0.15s;
        }

        /* === RTL Support Overrides (Complete Section) === */
        html[dir="rtl"] {
            text-align: right;
            direction: rtl;
        }

        /* Bootstrap's RTL CSS is loaded, but we must override hardcoded LTR utility class usage */
        html[dir="rtl"] .me-auto { margin-right: 0 !important; margin-left: auto !important; }
        html[dir="rtl"] .ms-auto { margin-left: 0 !important; margin-right: auto !important; }

        /* Use lg breakpoint for margins to allow compact mobile navigation */
        html[dir="rtl"] .me-lg-4 { margin-right: 0 !important; margin-left: 1.5rem !important; }
        html[dir="rtl"] .ms-lg-4 { margin-left: 0 !important; margin-right: 1.5rem !important; }
        html[dir="rtl"] .me-lg-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
        html[dir="rtl"] .ms-lg-2 { margin-left: 0 !important; margin-right: 0.5rem !important; }

        /* FIX: Profile UL margin spacing for RTL (ms-4) to create margin-right */
        .navbar-nav.ms-4 {
            margin-left: 0 !important;
            margin-right: 1.5rem !important; /* New margin-end (right) in RTL */
        }

        /* Icon spacing inside dropdowns */
        html[dir="rtl"] .dropdown-item i.me-3 { margin-right: 0 !important; margin-left: 1rem !important; }
        html[dir="rtl"] .dropdown-item .me-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
        html[dir="rtl"] .dropdown-item .ms-3 { margin-left: 0 !important; margin-right: 1rem !important; }

        /* FIX: Ensure avatar is visible in the dropdown header */
        html[dir="rtl"] .d-flex .me-3 { margin-right: 0 !important; margin-left: 1rem !important; }

      .text-teal {
    color: #008080 !important;
}

/* Target the specific class on your dropdown links */
.dropdown-item.text-decoration-none {
    /* Set the default text color (often black or dark gray) */
    color: inherit;
}

/* 1. Prevent visited links from turning purple/blue */
.dropdown-item.text-decoration-none:visited {
    color: inherit; /* Keeps the link color the same as the unvisited state */
}

/* 2. Prevent the link from turning blue while actively being clicked */
.dropdown-item.text-decoration-none:active {
    color: inherit; /* Keeps the link color the same as the unvisited state */
}

/* Optional: To ensure the icon color remains teal on all states */
.dropdown-item:visited .text-teal,
.dropdown-item:active .text-teal,
.dropdown-item:hover .text-teal {
    color: #008080 !important; /* Re-applies the custom teal color */
}

/* Final Rule: Keep the text-decoration-none class to remove the underline */
.dropdown-item.text-decoration-none,
.dropdown-item.text-decoration-none:hover,
.dropdown-item.text-decoration-none:focus {
    text-decoration: none !important;
}


.text-teal-primary{
  color:#004a53;
}