body {
            padding-top: 70px;
            /* Adjust for fixed-top navbar height */
        }

        #mobile-menu-toggle.navbar-toggler .bi-list {
            color: var(--bs-navbar-toggler-icon-color, rgba(255, 255, 255, 0.75));
        }

        #mobile-menu-toggle.navbar-toggler:hover .bi-list {
            color: var(--bs-navbar-toggler-hover-icon-color, white);
        }

        @media (max-width: 991.98px) {
            #navbarNavDropdown {
                display: none !important;
            }
        }

        .flash-toast-container {
            position: fixed;
            top: 80px;
            /* Adjust to be below your fixed navbar */
            /* --- CHANGES FOR CENTERING --- */
            left: 50%;
            /* 1. Position the LEFT edge of the container at the 50% mark of the screen */
            transform: translateX(-50%);
            /* 2. Pull the container back to the LEFT by 50% of its OWN width */
            z-index: 1056;
            /* High z-index, above most content but below modals if needed */
            width: 100%;
            max-width: 380px;
            /* Max width for the toasts */
            display: flex;
            flex-direction: column;
            gap: 0.75rem;
            /* Space between multiple flash messages */
        }

        .flash-toast-container .alert {
            box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.1);
            /* Ensure text inside doesn't get too close to the close button */
            padding-right: 2.5rem;
        }

        #global-mobile-drawer {
            position: fixed;
            top: 0;
            left: 0;
            width: 280px;
            max-width: 80%;
            height: 100vh;
            background-color: var(--bs-body-bg, #fff);
            z-index: 1045;
            transform: translateX(-100%);
            transition: transform 0.3s ease-in-out;
            overflow-y: auto;
            padding-top: 1rem;
            box-shadow: 0.25rem 0 1rem rgba(0, 0, 0, 0.15);
        }

        #global-mobile-drawer.show {
            transform: translateX(0);
        }

        #global-mobile-drawer .drawer-header {
            padding: 0.5rem 1rem;
            margin-bottom: 0.5rem;
            font-size: 1.1rem;
            font-weight: 600;
            color: var(--text-primary);
            border-bottom: 1px solid var(--border-color);
        }

        #global-mobile-drawer .global-drawer-link {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            padding: 0.75rem 1rem;
            color: var(--text-primary);
            text-decoration: none;
            border-radius: 0.25rem;
            margin: 0 0.5rem 0.25rem 0.5rem;
        }

        #global-mobile-drawer .global-drawer-link:hover {
            background-color: var(--bs-secondary-bg, #e9ecef);
            color: var(--primary-color);
        }

        #global-mobile-drawer .global-drawer-link .bi {
            font-size: 1.1rem;
        }

        #global-mobile-drawer hr {
            margin: 0.75rem 1rem;
        }
         /* --- 7. Global Loader --- */
    /* ========================================================= */
/* ===   GLOBAL LOADER STYLES                            === */
/* ========================================================= */

.global-loader-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(17, 24, 39, 0.8);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 1051;
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.global-loader-overlay.show {
    opacity: 1;
    visibility: visible;
}

.loader-dots {
    display: flex;
    gap: 0.6rem;
}

.loader-dot {
    width: 1.5rem;
    height: 1.5rem;
    background-color: #38bdf8;
    border-radius: 50%;
    animation: bounce 1.4s infinite ease-in-out both;
}

.loader-dot:nth-child(1) {
    animation-delay: -0.32s;
}

.loader-dot:nth-child(2) {
    animation-delay: -0.16s;
}

.loader-text {
    margin-top: 1.5rem;
    color: #d1d5db;
    font-size: 1.25rem;
    font-weight: 500;
}

@keyframes bounce {
    0%,
    80%,
    100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1.0);
    }
}

#global-drawer-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1040;
            display: none;
            opacity: 0;
            transition: opacity 0.3s ease-in-out;
            /* backdrop-filter: blur(3px); /* Optional */
        }

        #global-drawer-overlay.show {
            display: block;
            opacity: 1;
        }