:root {
    /* Typography */
    --font-family: "Source Sans Pro", sans-serif;
    --fs-base: 16px;
    --title-font-size: 30px;
    --sidebar-font-size: 19px;
    --breadcrumbs-font-size: 20px;
    --fs-900: 2.1875rem; /* 35 px */
    --fs-800: 1.625rem; /* 26 px */
    --fs-700: 1.375rem; /* 22 px */
    /* Color Palette */
    --background-canvas: #ECEEF0;
    --card-bg: #FFFFFF;
    --sidebar-bg: #FFFFFF;
    --table-bg: #FFFFFF;
    --brand-primary: #164928; /* used for buttons, sidebar text, scrollbars, etc. */
    --brand-secondary: #164928;
    --accent-secondary: #efba0c; /* boolean checkmarks */
    --brand-primary-hover: #008c15; /* used for buttons, sidebar text, scrollbars, etc. */
    --accent-secondary-hover: #ffc600; /* boolean checkmarks */
    --standard-text: #666666;
    --title-color: #090B2A;
    --searchbar-border: #D8D8D8;
    --dropdown-icon-color: #8A8A8F;
    --highlighted-text-on-dark: #ffffff;
    /* Layout & Style */
    --card-radius: 20px;
    --sidebar-radius: 28px;
    --card-box-shadow: 1px 0px 0px #EFEFF4;
    /* Breadcrumbs */
    --breadcrumbs-color: #008c15;
    --breadcrumbs-active-font: 700; /* Bold */

    --bs-gutter-x: 15px;
    /* Palette */
    --grey-100: #F9FAFC;
    --grey-200: #E5E8EE;
    --grey-300: #dadef0;
    --success: #ffc600;
    --font-color: #252525;
    --danger: #dc3545;
    --danger-btn: #EB3331;
    --active-input: #A6CBF3;
    --active-border: #A6CBF3 1px solid;
    --readonly-background: #F7F9FC !important;
    --readonly-color: #808D95 !important;
    --readonly-border: 1px solid #CED4DA;
    --success-border: #28A745 1px solid;
    --error-danger-border: #DC3545 1px solid;
    --box-shadow-standard: #D1D5DF80 0px 10px 30px;
    --headline-1-font-weight: normal;
    --headline-1-font-size: 30px;
    --headline-1-line-height: 1.19px;
    --headline-1-color: #090B2A;
    --headline-2-font-weight: Bold;
    --headline-2-font-size: 26px;
    --headline-2-line-height: 1.2px;
    --headline-2-color: #090B2A;
    --headline-3-font-weight: Bold;
    --headline-3-font-size: 28px;
    --headline-3-line-height: 1.3px;
    --headline-3-color: #090B2A;
    --headline-4-font-weight: Bold;
    --headline-4-font-size: 20px;
    --headline-4-line-height: 1.5px;
    --headline-4-color: #090B2A;
    --headline-5-font-weight: lighter;
    --headline-5-font-size: 17px;
    --headline-5-color: #090B2A;
    --headline-6-font-weight: lighter;
    --headline-6-font-size: 15px;
    --headline-6-line-height: 1.2px;
    --headline-6-color: #090B2A;
    --checkcircle-color: #96a1b8;
    --searchbar-border: #DADEF0;
    --bs-border-color: #DADEF0;
    --searchbar-placeholder: #6c7485;
    --org-bnr-wrapper-bak: #e1e1e1;
    /* Layout */
    --sidebar-width: 250px;
    --canvas-bg: #F2F4F7;
    --card-radius: 10px;
    /*table variables*/
    --tbl-header-bg: #EFEFF4;
    --tbl-header-color: #008c15;
    --tbl-cell-color: #FFFFFF;
    --tbl-font-size: 1rem; /* 16 px */
    --tbl-radius: 8px;
}   

.menu-container img {
        max-width: 140px;
        margin-bottom: 1rem;
    }

    .menu-container h5, .menu-container .nav-link {
        font-family: 'Montserrat', sans-serif;
    }

    .menu-container .nav-link {
        color: var(--brand-secondary);
        font-weight: 500;
        margin: 0.5rem 0;
        padding: 0.5rem 1rem;
        border-radius: 999px;
        display: flex;
        align-items: center;
        gap: 10px;
        transition: background 0.3s ease;
    }

        .menu-container .nav-link.active,
        .menu-container .nav-link:hover {
            background-color: var(--brand-secondary);
            color: white;
            padding-left: 2em !important;
            padding-right: 2em !important;
            text-decoration: none;
            /*transition:  0.50s ease;*/
            transition: ease-in-out 0.50s;
        }

        .menu-container .nav-link i {
            color: #282928;
        }

        .menu-container .nav-link.active i,
        .menu-container .nav-link:hover i {
            color: white;
        }

    .menu-container .logout {
        margin-top: auto;
        color: #666;
        font-size: 0.9rem;
        padding: 1rem 0;
    }