/* POS EWS Update 013 — Sidebar hijau daun saja.
 * Tidak mengubah mode warna halaman, form, tabel, modal, atau komponen lainnya.
 */

:root {
    --ews-sidebar-green-top: #2f7d32;
    --ews-sidebar-green-mid: #246b2a;
    --ews-sidebar-green-bottom: #174d21;
    --ews-sidebar-active-bg: #f0f8ee;
    --ews-sidebar-active-text: #174d21;
}

.app-sidebar {
    background:
        radial-gradient(circle at 12% 6%, rgba(172, 224, 160, .22), transparent 30%),
        linear-gradient(165deg, var(--ews-sidebar-green-top) 0%, var(--ews-sidebar-green-mid) 55%, var(--ews-sidebar-green-bottom) 100%) !important;
    border-right-color: rgba(11, 58, 24, .22) !important;
    box-shadow: 8px 0 28px rgba(20, 78, 32, .16);
    color: #fff;
}

.app-sidebar .app-brand,
.app-sidebar .app-brand:hover,
.app-sidebar .app-brand:focus {
    color: #fff !important;
    text-decoration: none;
}

.app-sidebar .app-brand > span {
    background: rgba(255, 255, 255, .16) !important;
    border-color: rgba(255, 255, 255, .20) !important;
    color: #fff !important;
}

.app-sidebar .app-nav {
    gap: .2rem;
}

.app-sidebar .app-nav .nav-link {
    color: rgba(255, 255, 255, .82) !important;
    border-radius: .7rem;
    transition: background-color .16s ease, color .16s ease, transform .16s ease;
}

.app-sidebar .app-nav .nav-link:hover,
.app-sidebar .app-nav .nav-link:focus-visible {
    color: #fff !important;
    background: rgba(255, 255, 255, .11) !important;
    transform: translateX(2px);
}

.app-sidebar .app-nav .nav-link.active:not(button) {
    color: var(--ews-sidebar-active-text) !important;
    background: var(--ews-sidebar-active-bg) !important;
    box-shadow: 0 7px 18px rgba(7, 46, 17, .22);
    font-weight: 700;
}

.app-sidebar .app-nav button.nav-link.active {
    color: #fff !important;
    background: rgba(255, 255, 255, .14) !important;
    box-shadow: none;
}

.app-sidebar .app-nav .collapse {
    border-left-color: rgba(255, 255, 255, .20) !important;
}

.app-sidebar .app-nav button.nav-link .bi-chevron-down {
    transition: transform .16s ease;
}

.app-sidebar .app-nav button.nav-link[aria-expanded="true"] .bi-chevron-down {
    transform: rotate(180deg);
}

.app-sidebar .sidebar-user {
    background: rgba(255, 255, 255, .10) !important;
    border-color: rgba(255, 255, 255, .15) !important;
    color: #fff !important;
}

.app-sidebar .sidebar-user .small,
.app-sidebar .sidebar-user .text-secondary {
    color: rgba(255, 255, 255, .72) !important;
}

.app-sidebar .sidebar-user .btn-outline-secondary {
    --bs-btn-color: #fff;
    --bs-btn-border-color: rgba(255, 255, 255, .42);
    --bs-btn-hover-color: #174d21;
    --bs-btn-hover-bg: #fff;
    --bs-btn-hover-border-color: #fff;
    --bs-btn-active-color: #174d21;
    --bs-btn-active-bg: #fff;
    --bs-btn-active-border-color: #fff;
}

.app-sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .25);
}