/* Sidebar hover styles */
@media (min-width: 1029px){

body[data-leftbar-size="sm-hover"] .leftside-menu {
    width: 70px;
    transition: ease-in-out;
    background-color: var(--primary-color) !important;
    position: fixed !important;
    z-index: 1000 !important; /* Ensure it's above other elements */
    top: 0 !important;
    bottom: 0 !important; /* Ensures it extends to bottom of viewport */
    left: 0 !important;
    height: 100vh !important; /* Forces full viewport height */
    min-height: 100% !important;
    max-height: 100% !important;/* Additional height enforcement */
    transform: translateZ(0) !important; /* Hardware acceleration */
    backface-visibility: hidden !important; /* Prevents flickering in some browsers */
    -webkit-backface-visibility: hidden !important;
    will-change: transform !important; /* Hints to browser about animation */
}

body[data-leftbar-size="sm-hover"] .leftside-menu:hover {
    width: 260px !important;
    background-color: var(--primary-color) !important;
}

/* Content page transition - this is the key part */
body[data-leftbar-size="sm-hover"] .content-page {
    margin-left: 70px !important;
}

body[data-leftbar-size="sm-hover"] .leftside-menu:hover ~ .content-page {
    margin-left: 260px !important;
}

/* Hide text in condensed mode */
body[data-leftbar-size="sm-hover"] .leftside-menu .side-nav .side-nav-link span,
body[data-leftbar-size="sm-hover"] .leftside-menu .logo-lg {
    opacity: 0;
    display: none;
}

body[data-leftbar-size="sm-hover"] .leftside-menu .logo-sm.collapse-logo {
    display: block;
}

/* Show text when sidebar is hovered */
body[data-leftbar-size="sm-hover"]
    .leftside-menu:hover
    .side-nav
    .side-nav-link
    span {
    opacity: 1;
    display: inline;
}

body[data-leftbar-size="sm-hover"] .leftside-menu:hover .logo-lg {
    opacity: 1;
    display: block;
}

body[data-leftbar-size="sm-hover"] .leftside-menu:hover .logo-sm {
    display: none;
}

/* Ensure submenu items are properly styled */
body[data-leftbar-size="sm-hover"] .leftside-menu .side-nav-second-level {
    padding-left: 0;
}

/* Ensure submenus are hidden in condensed mode */
body[data-leftbar-size="sm-hover"] .leftside-menu:not(:hover) .collapse {
    display: none !important;
}

/* Show submenus when parent is active and sidebar is expanded */
body[data-leftbar-size="sm-hover"]
    .leftside-menu:hover
    .side-nav-item
    .collapse.show
    span {
    display: block !important;
}

/* Green theme styling to match the image */
body[data-leftbar-theme="dark"] .leftside-menu {
    background-color: var(--primary-color);
}

body[data-leftbar-theme="dark"] .side-nav .side-nav-link {
    color: #fff !important;
}

body[data-leftbar-theme="dark"] .side-nav .side-nav-link:hover,
body[data-leftbar-theme="dark"] .side-nav .side-nav-link:focus,
body[data-leftbar-theme="dark"] .side-nav .side-nav-link.active {
    color: #fff !important;
}

body[data-leftbar-theme="dark"] .side-nav .side-nav-link em {
    color: #fff !important;
}

body[data-leftbar-theme="dark"] .side-nav-second-level li a {
    color: #fff !important;
}

body[data-leftbar-theme="dark"] .side-nav-second-level li a:hover,
body[data-leftbar-theme="dark"] .side-nav-second-level li a:focus {
    color: #fff !important;
}

body[data-leftbar-size="sm-hover"].sidebar-enable.left-side-menu-condensed
    .leftside-menu
    .side-nav
    .side-nav-link
    em,
body[data-leftbar-size="sm-hover"].left-side-menu-condensed
    .leftside-menu
    .side-nav
    .side-nav-link
    em,
body[data-leftbar-size="sm-hover"].sidebar-enable
    .leftside-menu
    .side-nav
    .side-nav-link
    em{
    margin-top: 6px !important;
    font-size: 1.1rem !important;
}

body.sidebar-enable.left-side-menu-condensed
    .leftside-menu:hover
    .side-nav
    .side-nav-link
    em,
body.left-side-menu-condensed
    .leftside-menu:hover
    .side-nav
    .side-nav-link
    em,
body.sidebar-enable
    .leftside-menu:hover
    .side-nav
    .side-nav-link
    em{
    margin-top: 0 !important;
}

/* Styles for sm-hover-active state */
body[data-leftbar-size="sm-hover-active"] .leftside-menu {
    width: 260px !important;
}

body[data-leftbar-size="sm-hover-active"] .content-page {
    margin-left: 260px !important;
}

/* Show text and logo in sm-hover-active state */
body[data-leftbar-size="sm-hover-active"]
    .leftside-menu
    .side-nav
    .side-nav-link
    span,
body[data-leftbar-size="sm-hover-active"] .leftside-menu .menu-arrow {
    opacity: 1;
    display: inline !important;
}

body[data-leftbar-size="sm-hover-active"] .leftside-menu .logo-lg {
    opacity: 1;
    display: block;
}

body[data-leftbar-size="sm-hover-active"] .leftside-menu .logo-sm {
    display: none;
}

/* Ensure submenus are properly displayed in sm-hover-active state */
body[data-leftbar-size="sm-hover-active"]
    .leftside-menu
    .side-nav-second-level {
    padding-left: 0;
    display: block;
}

/* Show the checkbox when sidebar is pinned */
body[data-leftbar-size="sm-hover-active"] .circular-checkbox {
    opacity: 1;
}

/* Prevent sidebar from collapsing when links are clicked in pinned state */
body[data-leftbar-size="sm-hover-active"] .leftside-menu {
    width: 260px !important;
}

body[data-leftbar-size="sm-hover-active"] .content-page {
    margin-left: 260px !important;
}

/* Show text and logo in sm-hover-active state */
body[data-leftbar-size="sm-hover-active"]
    .leftside-menu
    .side-nav
    .side-nav-link
    span,
body[data-leftbar-size="sm-hover-active"] .leftside-menu .menu-arrow {
    opacity: 1 !important;
    display: inline !important;
}

body[data-leftbar-size="sm-hover-active"] .leftside-menu .logo-lg {
    opacity: 1 !important;
    display: block !important;
}

body[data-leftbar-size="sm-hover-active"] .leftside-menu .logo-sm {
    display: none !important;
}

/* Ensure submenus are properly displayed in sm-hover-active state */
body[data-leftbar-size="sm-hover-active"]
    .leftside-menu
    .side-nav-second-level {
    padding-left: 0;
    display: block !important;
}

body[data-leftbar-size="sm-hover"] .navbar-custom {
    left: 70px !important;
    transition: left ease-in-out;
}

body[data-leftbar-size="sm-hover"]
    .leftside-menu:hover
    ~ .content-page
    .navbar-custom {
    left: 260px !important;
}

body[data-leftbar-size="sm-hover-active"] .navbar-custom {
    left: 260px !important;
}

body[data-leftbar-size="sm-hover"] .leftside-menu:not(:hover) ~ .content-page .footer {
    left: 56px !important;
}

body[data-leftbar-size="sm-hover"] .leftside-menu:hover ~ .content-page .footer {
    left: 248px !important;
}
}
/* Tablet-specific styles */
@media (min-width: 768px) and (max-width: 1024px) {
    .side-nav .side-nav-link {
        margin-left: 4px !important;
      }
      
    body[data-leftbar-compact-mode=condensed]:not(.authentication-bg) .wrapper .leftside-menu {
        padding-top: 49px !important;
        z-index: 500 !important;
    }
    body[data-leftbar-size="sm-hover"] .content-page {
        margin-left: 70px !important;
    }
    body[data-leftbar-compact-mode=condensed]:not(.authentication-bg) .wrapper .footer {
        left: 60px !important;
    }
    body[data-leftbar-compact-mode=condensed]:not(.authentication-bg) .side-nav .side-nav-item:hover .side-nav-link[aria-controls="sidebarsettings"] {
        width: 257px;
    }
}