﻿

/* bỏ dấu chấm đen */
        .sidebar .nav.sub-menu .nav-item::before {
            display: none !important;
        }

/* reset padding mặc định gây thụt sâu */
.sidebar .nav.sub-menu {
    padding-left: 0.75rem;
}

/* =====================================================
   MÀU CHỦ ĐẠO (ANT / MATERIAL)
===================================================== */
:root {
    --primary: #4d83ff;
    --primary-soft: rgba(77, 131, 255, 0.1);
    --text-main: #1f2937;
    --text-sub: #6b7280;
    --border-soft: #9ca3af;
}

/* =====================================================
   LEVEL 1 (MENU CHA)
===================================================== */
.sidebar .nav > .nav-item > .nav-link {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-main);
}

    /* hover level 1 */
    .sidebar .nav > .nav-item > .nav-link:hover {
        color: var(--primary);
    }

    /* active level 1 */
    .sidebar .nav > .nav-item > .nav-link.parent-active {
        color: var(--primary) !important;
/*        font-weight: 600;*/
    }

/* =====================================================
   LEVEL 2
===================================================== */
.sidebar .nav.sub-menu > .nav-item > .nav-link {
    padding-left: 2rem;
    font-size: 0.88rem;
    color: var(--text-sub);
    border-radius: 6px;
    position: relative;
}

    /* hover level 2 */
    .sidebar .nav.sub-menu > .nav-item > .nav-link:hover {
        color: var(--primary);
        background: var(--primary-soft);
    }

    /* parent active level 2 */
    .sidebar .nav.sub-menu > .nav-item > .nav-link.parent-active {
        color: var(--primary);
        font-weight: 500;
    }

/* =====================================================
   LEVEL 3 – MATERIAL STYLE
===================================================== */
.sidebar .nav.sub-menu .sub-menu .nav-link {
    padding-left: 3rem; /* ❗ KHÔNG THỤT SÂU */
    font-size: 0.82rem;
    color: var(--text-sub);
    border-radius: 6px;
    position: relative;
}

    /* line phân cấp tinh tế */
/*    .sidebar .nav.sub-menu .sub-menu .nav-link::before {
        content: '';
        position: absolute;
        left: 3rem;
        top: 50%;
        width: 8px;
        height: 1.5px;
        background: var(--border-soft);
    }*/

    /* hover level 3 */
    .sidebar .nav.sub-menu .sub-menu .nav-link:hover {
        color: var(--primary);
        background: var(--primary-soft);
    }

    /* active level 3 */
    .sidebar .nav.sub-menu .sub-menu .nav-link.active {
        color: var(--primary);
        background: var(--primary-soft);
    }

/* =====================================================
   ACTIVE CHUNG (JS ĐANG DÙNG)
===================================================== */
.sidebar .nav-link.active,
.sidebar .nav-link.parent-active {
    color: var(--primary) !important;
}

    /* icon + arrow theo màu */
    .sidebar .nav-link.active i,
    .sidebar .nav-link.parent-active i {
        color: inherit;
    }

/* =====================================================
   HIỆU ỨNG MƯỢT – KHÔNG GIẬT
===================================================== */
.sidebar .nav-link {
    transition: color 0.2s ease, background 0.2s ease;
}

.sidebar .collapse {
    transition: all 1s ease-in-out;
}

/* arrow mượt */
.sidebar .nav-link i.menu-arrow:before {
    transition: transform 0.25s ease;
}
/* =====================================================
   FIX KHOẢNG CÁCH MENU CHA ↔ MENU CON
===================================================== */

/* 1️⃣ bỏ padding top của collapse */
.sidebar .collapse.show {
    padding-top: 0;
}

/* 2️⃣ reset padding sub-menu gốc (rất quan trọng) */
.sidebar .nav.sub-menu {
    padding-top: 0 !important;
    padding-bottom: 0.25rem;
}

    /* 3️⃣ giảm chiều cao item menu con */
    .sidebar .nav.sub-menu .nav-link {
        padding-top: 0.45rem;
        padding-bottom: 0.45rem;
    }

/*.sidebar .nav.sub-menu {
    border-top: 1px solid #f1f3f5;
}*/
