﻿/* ===== BOX LOOK ===== */
.sidebar {
    background: #fff;
    /*border: 1px solid #B1DC98;*/
    padding: 0;
}

/* ALL ITEMS */
.menu-item,
.submenu3 a {
    border-bottom: 1px solid #eaeaea;
    
    padding: 6px 10px;
    font-size: 11px;
    background: #fff;
    color: #000;
}

    /* MAIN + INNER HEADERS */
    .menu-item.toggle {
        font-weight: 700;
        cursor: pointer;
        display: flex;
        align-items: center;
        font-size: 15px;
        color: #008000;
    }
        .menu-item.toggle:hover {
            color: #000000;
        }
    /* LEVEL INDENTS */
    .menu-item.inner {
        /*padding-left: 18px;*/
        font-size: 13px;
        color: green;
    }

    .menu-item.level-3 {
        /*padding-left: 28px;*/
        font-size: 13px;
    }

.submenu3.level-4 a {
    /*padding-left: 42px;*/
}

/* REMOVE GREEN UI STYLES */
.menu-item.active {
    /*background: #f5f5f5 !important;*/
    color: green;
}

/* LINKS */
.submenu3 a {
    text-decoration: none;
}

    .submenu3 a:hover {
        background: #eee;
    }

    /* ACTIVE PAGE */
    .submenu3 a.active-link {
        background: #d9ffd9;
        /*font-weight: 700;*/
        position: relative;
    }

     /* RIGHT VERTICAL BAR */
 .submenu3 a.active-link::after {
     content: "";
     position: absolute;
     top: 4px;
     bottom: 4px;
     right: 2px;
     width: 4px;
     background: #2f7d32; /* change color if needed */
     border-radius: 2px 0 0 2px;
 }

/* ===== ARROWS (TEXT BASED) ===== */
.menu-item.toggle::before {
    content: "";
    margin-right: 6px;
    transition: transform 0.2s ease;
}

.menu-item.toggle.active::before {
    transform: rotate(90deg);
}

/* NESTED ARROWS */
.menu-item.inner::before {
    content: ">";
}

.menu-item.level-3::before {
    content: ">>";
}

.submenu3.level-4 a::before {
    content: ">>>";
    margin-right: 6px;
}

/* ===== SUBMENUS ===== */
.submenu3 {
    display: none;
    padding: 0;
    margin: 0;
    border: none;
}

/* RESET all menu items to normal */
.menu-item {
    font-weight: 400;
}

/* ONLY top-level parents bold */
.menu > .menu-item.toggle {
    font-weight: 700;
    background-color: green;
    color: #fff;
}

/* Ensure inner & level-3 are NOT bold */
.menu-item.inner,
.menu-item.level-3 {
    font-weight: 400 !important;
}

/* ===============================
   SCROLLBAR
================================ */
.side-menu::-webkit-scrollbar {
    width: 6px;
}

.side-menu::-webkit-scrollbar-thumb {
    background: #1c7606;
    border-radius: 8px;
}



/* ===============================
   COLOR VARIABLES
================================ */
/*:root {
    --green-dark: #1f5e26;
    --green-main: #2f7d32;
    --green-soft: #e8f3ec;
    --green-accent: #4caf50;
    --gray-light: #f7f9f8;
    --gray-border: #d6e2db;
    --text-dark: #1b1b1b;
}*/

/* ===============================
   SIDEBAR
================================ */
/*.sidebar {
    background: var(--green-main);
    padding: 6px;
    min-height: 100vh;
}*/

/* ===============================
   LEVEL 1
================================ */
/*.menu-item.toggle {
    background: var(--green-dark);
    color: #ffffff;
    padding: 9px 12px;
    margin-bottom: 2px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

    .menu-item.toggle:hover {
        background: #184b1f;
    }

    .menu-item.toggle.active {
        background: #143f19;
    }*/

    /* ===============================
   LEVEL 2
================================ */
    /*.menu-item.toggle.inner {
        background: var(--green-soft);
        color: var(--text-dark);
        margin: 4px 3px;
        padding: 2px 5px;
        font-size: 11.6px;
    }

        .menu-item.toggle.inner.active {
            background: #d5eadc;
            font-weight: 700;
        }*/

    /* ===============================
   LEVEL 3
================================ */
    /*.menu-item.toggle.level-3 {
        background: var(--gray-light);
        color: var(--text-dark);
        margin: 3px 4px;
        padding: 6px 6px;
        font-size: 12.1px;
    }

        .menu-item.toggle.level-3.active {
            background: #e8edea;*/
            /*border-left: 3px solid var(--green-accent);*/
        /*}*/

/* ===============================
   SUBMENUS
================================ */
/*.submenu3 {
    display: none;
    background: #ffffff;
    border: 1px solid var(--gray-border);
    border-radius: 4px;
    margin: 4px 0 6px;
    padding: 4px 0;
}

    .submenu3.nested {
        margin: 4px 8px;
    }*/

    /* ===============================
   LINKS (LEVEL 4)
================================ */
    /*.submenu3 a {
        padding: 4px 3px;
        font-size: 12.2px;
        color: var(--text-dark);
        text-decoration: none;
        display: block;
        border-left: 3px solid transparent;
    }

        .submenu3 a:hover {
            background: #f1f6f3;
        }*/

        /* ACTIVE PAGE */
        /*.submenu3 a.active-link {
            background: #eaf6ef;
            color: #0f3d1a;
            font-weight: 700;
            border-left-color: #e33a07;
        }*/

/* ===============================
   ARROW MARKERS (SUBTLE)
================================ */
/*.menu-item.toggle::before {
    content: "▸";*/
    /*margin-right: 8px;*/
    /*font-size: 12px;
    opacity: 0.8;
}

.menu-item.toggle.active::before {
    content: "▾";
}*/

/* ===============================
   SCROLLBAR
================================ */
/*.side-menu::-webkit-scrollbar {
    width: 6px;
}

.side-menu::-webkit-scrollbar-thumb {
    background: #9fcfa8;
    border-radius: 8px;
}*/


/* Red dot indicator – far RIGHT */
/*.submenu3 a.active-link::after {
    content: "";
    margin-left: auto;*/ /* pushes to right end */
    /*width: 6px;
    height: 6px;
    background-color: #ff0000;
    border-radius: 50%;
}*/
