:root {
    --bs-blue: #2D4F9E;
}

.text-blue {
    color: var(--bs-blue) !important;
}

.bg-blue {
    background-color: var(--bs-blue) !important;
}

.bg-blue-10 {
    background-color: #2D4F9E1A !important;
}

.border-blue {
    border: 1px solid var(--bs-blue) !important;
}

.border-blue-bottom {
    border-bottom: 1px solid var(--bs-blue) !important;
}

.nav.nav-pills .nav-item .active {
    background-color: var(--bs-blue) !important;
}

.nav.nav-pills .nav-item .nav-link:hover {
    color: var(--bs-blue) !important;
    background-color: #2D4F9E1A !important;
}

.nav.nav-pills .nav-item .active:hover {
    background-color: var(--bs-blue) !important;
    color: white !important;
}


.bg-success-10 {
    background-color: #28C76F1A !important;
}

.bg-danger-10 {
    background-color: #E74C3C14 !important;
}

.modal-xxl {
    --bs-modal-width: 87.5rem;
}

/* Sidebar styling - focus on appearance only */
#layout-menu.bg-menu-theme {
    background-color: #1A1D2C !important; /* Dark blue/black from Figma */
    color: #ffffff;
}

/* Menu item text color */
.layout-menu .menu-item .menu-link {
    color: #ffffff !important;
    padding: 0.625rem 1rem !important;
}

/* Parent menu styling */
.layout-menu .menu-inner > .menu-item > .menu-link {
    padding: 0.625rem 1.5rem !important; /* More left padding for parent items */
}

/* Child menu styling */
.menu-sub .menu-item .menu-link {
    padding-left: 3rem !important; /* Increased indent for child items */
}

/* Menu item hover/active state */
.layout-menu .menu-item.active > .menu-link,
.layout-menu .menu-item:hover > .menu-link {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Active menu item highlighting */
.menu-inner .menu-item.active .menu-link {
    background-color: #2662FF !important;
    color: #ffffff !important;
}

/* Brand text & logo */
.app-brand-text.demo {
    color: #ffffff !important;
}

.app-brand-logo.demo img {
    filter: brightness(1.5);
}

/* Menu icons color and spacing */
.menu-icon {
    color: #ffffff !important;
    margin-right: 0.75rem !important;
}

/* Menu arrow styling */
.menu-arrow {
    color: #ffffff !important;
    margin-left: auto !important;
}

/* Menu shadow */
.menu-inner-shadow {
    background: linear-gradient(#1A1D2C 41%, rgba(26, 29, 44, 0.11) 95%, rgba(26, 29, 44, 0));
}

/* Simply display sub-menus without animation */
/* REMOVED: Problematic rule that forced all submenus to always display */

/* Menu expansion styles */
.menu-item.open > .menu-sub {
    display: block;
}

/* Ensure menu toggle has proper cursor */
.menu-toggle {
    cursor: pointer;
}

/* Adjust menu item padding for better alignment */
.layout-menu .menu-inner > .menu-item > .menu-link {
    margin-left: -0.5rem !important; /* Move parent items slightly left */
    padding-left: 1.5rem !important;
}

/* Submenu items styling - indent them more */
.menu-sub .menu-item .menu-link {
    padding-left: 1rem !important;
}

/* Menu arrow rotation */
.menu-item.open > .menu-link > .menu-arrow {
    transform: rotate(180deg);
}

.menu-arrow {
    transition: transform 0.3s ease;
}

/* Menu item focus style */
.layout-menu .menu-link:focus {
    outline: none !important;
}

/* Critical fix for menu display */
.menu-vertical .menu-item.has-sub.open > .menu-sub {
    display: block !important;
}

/* Remove conflicting styles */
/* 
.menu-vertical .menu-item.has-sub > .menu-sub {
    display: none !important;
}
*/

/* Override any conflicting styles - REMOVED problematic rules */

/* Mobile menu fixes - COMPLETELY REVISED */
@media (max-width: 1199.98px) {
    /* Ensure menu is visible and properly styled */
    .layout-menu-expanded .layout-menu {
        transform: translateX(0) !important;
        left: 0 !important;
        visibility: visible !important;
    }
       
    .layout-menu {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        left: -100% !important; /* Hide off-screen when collapsed */
        height: 100% !important;
        width: 100% !important;
        max-width: 260px !important;
        z-index: 1100 !important;
        margin: 0 !important;
        padding: 0 !important;
        background-color: #1A1D2C !important;
        transition: left 0.3s ease !important, visibility 0.25s ease !important;
        visibility: hidden;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    /* Ensure all menu content is visible */
    .menu-inner {
        height: auto !important;
        overflow: visible !important;
        display: block !important;
    }

    /* Clear any max-height constraints */
    .menu-inner > .menu-item {
        height: auto !important;
    }
    
    /* Make menu items and text clearly visible */
    .layout-menu .menu-item .menu-link {
        color: #ffffff !important;
        padding: 0.625rem 1rem !important;
    }
    
    /* Make sure submenu items are visible - REMOVED problematic rule */
    
    /* Ensure overlay covers entire screen */
    .layout-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        height: 100vh !important;
        width: 100vw !important;
        display: none;
        background: rgba(0, 0, 0, 0.5);
        z-index: 1099;
    }
    
    .layout-menu-expanded .layout-overlay {
        display: block;
    }
    
    /* Address menu toggle button visibility */
    .layout-menu-toggle {
        display: block !important;
    }
    
    /* Ensure proper body class behavior */
    body.layout-menu-expanded {
        overflow: hidden; /* Prevent scrolling behind open menu */
    }
}

/* DIRECT FIX FOR MOBILE MENU - Using display properties instead of transforms */
@media (max-width: 1199.98px) {
    body.layout-menu-expanded {
        overflow: hidden;
    }

    body:not(.layout-menu-expanded) .layout-menu {
        display: none !important;
    }

    body.layout-menu-expanded .layout-menu {
        display: block !important;
        visibility: visible !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        height: 100vh !important;
        width: 260px !important;
        z-index: 1100 !important;
        background-color: #1A1D2C !important;
        overflow-y: auto !important;
    }

    /* Menu inner styling to ensure content is visible */
    .layout-menu .menu-inner {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .layout-menu .menu-item {
        display: block !important;
    }

    .layout-menu .menu-sub {
        display: block !important;
    }

    .layout-menu .menu-link {
        display: flex !important;
        align-items: center !important;
        padding: 0.625rem 1.25rem !important;
    }

    .layout-menu .menu-inner > .menu-item > .menu-link {
        padding-left: 1.25rem !important;
    }

    .layout-menu .menu-sub .menu-link {
        padding-left: 2.5rem !important;
    }

    /* Force menu text to be visible */
    .layout-menu .menu-text,
    .layout-menu .app-brand-text {
        display: inline-block !important;
        visibility: visible !important;
    }

    /* Dark overlay for mobile menu */
    .layout-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        height: 100vh;
        width: 100vw;
        background: rgba(0, 0, 0, 0.5);
        z-index: 1099;
        display: none;
    }
    
    body.layout-menu-expanded .layout-overlay {
        display: block;
    }
}

/* FINAL MOBILE MENU FIX - Forcing visibility with !important */
@media (max-width: 1199.98px) {
    /* Ensure immediate visibility */
    .layout-menu-expanded #layout-menu {
        transform: translateX(0) !important;
        left: 0 !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: 100vh !important;
        width: 260px !important;
        overflow-y: auto !important;
        z-index: 1100 !important;
    }

    /* Fix to ensure menu content is visible and selectable */
    .layout-menu-expanded #layout-menu .menu-inner {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* Ensure menu items are displayed without needing to click anywhere else */
    .layout-menu-expanded #layout-menu .menu-item {
        display: block !important;
        visibility: visible !important;
    }
    
    /* Ensure text is visible immediately */
    .layout-menu-expanded #layout-menu .menu-text,
    .layout-menu-expanded #layout-menu .app-brand-text {
        visibility: visible !important;
        opacity: 1 !important;
        display: inline-block !important;
    }
    
    /* Improved overlay with higher z-index for proper layering */
    .layout-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100vw;
        height: 100vh;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 1090;
        display: none;
    }
    
    .layout-menu-expanded .layout-overlay {
        display: block;
    }
}

/* Fix K-ONE brand text to ensure consistent display across ALL pages */
.app-brand-text.demo.menu-text.fw-bold {
  font-weight: 700 !important;
  font-size: 1.375rem !important;
  font-family: inherit !important;
}

/* Rest of your existing styles */