/* Sidebar Layout Styles */
@layer {
    body {
        margin: 0;
        padding: 0;
    }

    /* Container for the hybrid layout */
    .react-sidebar-container {
        display: flex;
        height: 100vh;
    }

    /* Sidebar area */
    .sidebar-area {
        flex-shrink: 0;
        height: 100vh;
        overflow-y: auto;
        z-index: 100;
    }

    /* App content area */
    .react-content-area {
        flex: 1;
        height: 100vh;
        overflow-y: auto;
        background-color: #f8f9fa;
    }

    /* App root container */
    #root {
        height: 100%;
        width: 100%;
    }

    /* Responsive design */
    /* @media (max-width: 768px) {
    .react-sidebar-container {
        flex-direction: column;
    }

    .sidebar-area {
        height: auto;
        max-height: 60vh;
    }

    .react-content-area {
        height: 40vh;
    }
} */

    .textImage {
        max-width: 96px !important;
    }

    :root {
        --activeColor: #0d41e1;
        --darkBlue: #07247c;
        --white: rgb(251, 251, 251);
        --grey: rgb(120, 117, 117);
        --light-royal-blue: #6999dc;
        --lightGrey: rgba(128, 128, 128, 0.8);
        --inputDivColor: rgba(133, 133, 133, 0.243);
        --lightBlue: #2196f3;
        --nightShade: #1e1f20;
        --skySapphire: #2c9bf4;
        --primalBlue: #21477d;
        --lightBlueTransparent: #2195f382;
        --veryLightBlue: #eaefff;
        --backgroundBlue: #e9f5ff;
        --gentelBlue: #cbd4f4;
        --borderBlue: #6cb7f5;
        --hoverColor: #e7ecfc;
        --dark: rgb(60, 60, 60);
        --gentelDark: rgba(128, 128, 128, 0.277);
        --veryGentelDark: rgba(128, 128, 128, 0.1);
        --red: #f71313;
        --orange: rgb(247 72 7);
        --green: #1e9319;
        --dusty-slate: #b6bac3;
        --ui-muted: #6b7280;
        --smoothGray: #383a42;
        --background-muted: #f0f0f0;
        --Inactive-noBG-secondary: #7c7474;
        --box-shadow: 0px 1px 1px 1px rgba(78, 78, 78, 0.14);
        --font-family: 'Poppins', sans-serif !important;
        --steelGrey: #8e95a2;
        --light-amber: #f3851e;
        --light-emerald: #00f281;
        --alertRed: #f54750;
        --periwinkle: #b9cfef;
        --steelTeal: #547A9;
    }
}