/* ===== SIDEBAR ===== */
.lv-sidebar {
    width: 243px;
    background: #e8e9ee;
    @media (max-width:1239px){
        margin-top:-122px;
    }
}

.lv-sidebar-inner {
    padding: 265px 22px 0px 23px;
    @media (max-width:1239px){
        padding: 265px 22px 94px 23px;
    }
}

.menu-group {
    position: relative;
    margin-bottom: 31px;
    overflow: hidden;
    background: #eaebf0;
    border-radius: 10px;
    box-shadow: -4px -5px 9px rgba(255, 255, 255, .86), 7px 7px 9px rgba(171, 176, 188, .68), inset 1px 1px 1px rgba(255, 255, 255, .45);
}

.dropdow-icon {
    transition: transform 0.2s ease;
}

.parent-item.submenu-open .dropdow-icon,
.menus-items.active-menu-sidebar .dropdow-icon {
    transform: rotate(180deg);
}

.menus-items {
    display: block;
    padding: 13.8px 21px 13.8px 18px;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.menus-items:has(label.switch) {
    padding: 12.5px 7.5px 12.5px 18px;
}

/* Hover parent menu: cùng nền hover như sub-menu-item (trước đây parent thiếu). */
.menus-items:hover {
    background: rgba(255, 255, 255, 0.4);
}

.menus-items.feature-disabled:hover {
    background: transparent;
}

.menus-items.active-menu-sidebar {
    background: #f8f9fa !important;
    font-family: 'SfproDisplay-Bold';
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.95), inset 2px 2px 2px rgba(255, 255, 255, 0.25);
}

.menus-items.active-menu-sidebar .menu-name {
    font-family: 'SfproDisplay-Bold';
}

.menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menu-name {
    color: #000;
    font-size: 13.6px;
    font-family: 'SfproDisplay-Regular';
    letter-spacing: 0.3px;
    white-space: nowrap; /* one line, e.g. "Advertising (LifeAds)" next to its switch */
}

.sub-menus-container {
    background: #eaebf0;
    border-top: 1px solid rgba(0,0,0,0.05);
}

a:focus{
    box-shadow:unset;
}

.sub-menu-item {
    position: relative;
    display: block;
    padding: 10px 16px 10px 19px;
    color: #000;
    text-decoration: none;
    font-size: 13.6px;
    font-family: 'SfproDisplay-Regular';
    border-bottom: 1px solid rgba(0,0,0,0.03);
    transition: all 0.2s;
}

.sub-menu-item:hover {
    background: rgba(255,255,255,0.4);
    color: #000;
}

.sub-menu-item.active-menu-sidebar {
    background: #f8f9fa !important;
    font-family: 'SfproDisplay-Bold';
    font-size:14px !important;
    padding-right: 0px;
}

/* Kiểu dáng nút Switch Neumorphic */
.switch {
    position: relative;
    display: inline-block;
    width: 42px;
    height: 23px;
    flex-shrink: 0;
    z-index: 9; 
    pointer-events: auto;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    border-radius: 30px;
    background-color: #eaebf0;
    box-shadow: -2px -1px 6px rgba(255, 255, 255, 0.95), 4px 1px 7px rgba(166, 175, 195, 0.45), 0px 0px 18px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.slider:before {
    position: absolute;
    content: "";
    height: 16.5px;
    width: 16.5px;
    left: 2.2px;
    bottom: 3.3px;
    border-radius: 50%;
    background-color: #f5f6f9;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
}

/* Trạng thái BẬT (Checked) - Màu vàng ánh kim */
.switch input:checked + .slider {
    background: linear-gradient(135deg, #d7c155 0%, #d8be28 100%);
}

.switch input:checked + .slider:before {
    transform: translateX(20px);
    background-color: #ffffff;
}