﻿/* ===== SIDEBAR POSITION ===== */
#sidebar-left {
    position: fixed;
    z-index: 1001;
    transition: width 0.25s ease;
    background: #262f41 !important;
}

html.sidebar-closing-for-navigation #sidebar-left {
    transition-duration: 0.45s;
}

.sidebar-left {
    background: #262f41 !important;
}

#sidebar-left .nano {
    transition: width 0.25s ease;
}

html.sidebar-closing-for-navigation #sidebar-left .nano {
    transition-duration: 0.45s;
}

.menuIcon {
    height: 5px;
}

/* ===== SIDEBAR TOGGLE BUTTON ===== */
.sidebar-toggle-btn {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    background: rgba(0, 0, 0, 0.18);
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    color: #aab5c0;
    padding: 9px 18px;
    cursor: pointer;
    outline: none;
    transition: background 0.2s, color 0.2s;
    box-sizing: border-box;
    flex-shrink: 0;
}

.sidebar-toggle-btn:hover {
    background: rgba(0, 0, 0, 0.32);
    color: #fff;
}

html.sidebar-left-collapsed .sidebar-toggle-btn {
    justify-content: center;
    padding: 9px 0;
}

.sidebar-toggle-icon {
    font-size: 13px;
    transition: transform 0.25s ease;
}

/* ===== DISABLE HOVER-TO-EXPAND ===== */
/* Override theme.css hover expand for fixed layout */
html.sidebar-left-collapsed.fixed .sidebar-left .nano:hover {
    width: 73px !important;
}

html.sidebar-left-collapsed.fixed .sidebar-left .nano:hover ul.nav-main li.nav-parent.nav-expanded > ul.nav-children {
    display: none !important;
}

html.sidebar-left-collapsed.fixed .sidebar-left .nano:hover .nav-main li.nav-parent a:after {
    display: none !important;
}

html.sidebar-left-collapsed.fixed .sidebar-left .nano:hover .nav-main li a span {
    visibility: hidden !important;
}

html.sidebar-left-collapsed.fixed .sidebar-left .nano:hover .sidebar-widget,
html.sidebar-left-collapsed.fixed .sidebar-left .nano:hover .separator {
    display: none !important;
}

/* ===== BODY CONTENT PUSH BEHAVIOR ===== */
/* Expanded (default): content pushed to 300px */
.bodyContainer {
    transition: margin-left 0.25s ease;
    overflow-x: hidden;
    margin-left: 300px !important;
}

html.sidebar-closing-for-navigation .bodyContainer {
    transition-duration: 0.45s;
}

/* Collapsed: content shrinks back to 73px */
html.sidebar-left-collapsed .bodyContainer {
    margin-left: 73px !important;
}

/* Mobile: no margin */
@media only screen and (max-width: 767px) {
    .bodyContainer {
        margin-left: 0 !important;
    }
}

/* ===== HEADERS - PUSH WITH SIDEBAR ===== */
/* Green main navbar - always full width, sidebar slides over it */
.firstheader {
    left: 0 !important;
    width: 100% !important;
}

/* Second navbar (menu bar) - pushes with sidebar */
.headerDiv {
    left: 300px !important;
    width: calc(100% - 300px) !important;
    transition: left 0.25s ease, width 0.25s ease;
}

html.sidebar-closing-for-navigation .headerDiv {
    transition-duration: 0.45s;
}

html.sidebar-left-collapsed .headerDiv {
    left: 73px !important;
    width: calc(100% - 73px) !important;
}

/* Breadcrumb bar - pushes with sidebar */
#agronet-breadcrumb-bar {
    left: 300px !important;
    transition: left 0.25s ease, width 0.25s ease;
}

html.sidebar-closing-for-navigation #agronet-breadcrumb-bar {
    transition-duration: 0.45s;
}

html.sidebar-left-collapsed #agronet-breadcrumb-bar {
    left: 73px !important;
}

@media only screen and (max-width: 767px) {
    .firstheader,
    .headerDiv,
    #agronet-breadcrumb-bar {
        left: 0 !important;
        width: 100% !important;
        margin-left: 0 !important;
    }
}

/* ===== ACTIVE NAV ITEM - GREEN ===== */
/* nav-active is added to the parent <li> that contains the active section */
/* li-active is added to the exact <li> the user is on */

#sidebar-left ul.nav-main li.nav-active > a,
#sidebar-left ul.nav-main li.nav-active > a:hover,
#sidebar-left ul.nav-main li.nav-active > a:focus {
    color: #4caf50 !important;
    box-shadow: 3px 0 0 #4caf50 inset !important;
}

#sidebar-left ul.nav-main li.li-active > a,
#sidebar-left ul.nav-main li.li-active > a:hover,
#sidebar-left ul.nav-main li.li-active > a:focus {
    color: #4caf50 !important;
}

/* Override grey color on nav-children active items */
#sidebar-left ul.nav-main li .nav-children li.nav-active > a,
#sidebar-left ul.nav-main li .nav-children li.nav-active > a:hover,
#sidebar-left ul.nav-main li .nav-children li.li-active > a,
#sidebar-left ul.nav-main li .nav-children li.li-active > a:hover {
    color: #4caf50 !important;
}
