body {
    box-sizing: border-box;
}

.sidebar-transition {
    transition: transform 0.3s ease-in-out;
}

.content-transition {
    transition: margin-left 0.3s ease-in-out;
}

.card-hover {
    transition: all 0.3s ease;
}

.card-hover:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* ==== GAYA MENU SIDEBAR UTAMA ==== */

/* Gaya dasar untuk semua item menu di sidebar */
aside .nav-item {
    transition: all 0.2s ease;
    position: relative;
}

/* Efek Hover untuk menu utama */
aside .nav-item:hover {
    transform: translateX(4px);
    background: rgba(255, 255, 255, 0.1);
}

/* Garis aksen di kiri saat hover */
aside .nav-item:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 4px; /* Sedikit lebih tebal agar terlihat jelas */
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    border-radius: 0 4px 4px 0;
    transform: scaleY(0);
    transition: transform 0.2s ease;
    transform-origin: center;
}

aside .nav-item:hover:before {
    transform: scaleY(0.75); /* Aksen tidak setinggi menu agar lebih elegan */
}


/* ==== GAYA MENU AKTIF (STATE) ==== */

/* Gaya untuk SEMUA item menu yang aktif */
aside .nav-item.active {
    background: #1d4ed8; /* Warna biru solid yang kuat */
    color: white;
    font-weight: 600;
    transform: translateX(4px);
}

/* Menampilkan garis aksen pada menu yang aktif */
aside .nav-item.active:before {
    transform: scaleY(1);
}

/* PENGECUALIAN: Gaya spesial hanya untuk Dashboard yang aktif */
aside .nav-item[data-section="sections/dashboard.php"].active {
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    box-shadow: 0 4px 12px -1px rgba(0, 0, 0, 0.2);
}

/* ==== GAYA SUBMENU (di dalam Pengaturan) ==== */

/* Gaya dasar link di dalam submenu */
aside .submenu .nav-item {
    color: rgba(255, 255, 255, 0.8);
}

/* Hover untuk link di dalam submenu */
aside .submenu .nav-item:hover {
    background: rgba(255, 255, 255, 0.15);
    color: white;
    transform: translateX(2px); /* Gerakan lebih halus untuk submenu */
}

/* Link submenu yang sedang aktif */
aside .submenu .nav-item.active {
    background: white;
    color: #1e40af; /* Warna biru tua agar kontras */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Menghilangkan garis aksen untuk submenu */
aside .submenu .nav-item:before {
    display: none;
}
/* Gaya untuk SEMUA item menu yang aktif */
aside .nav-item.active {
    background: #1d4ed8; /* Warna biru solid yang kuat */
    color: white;
    font-weight: 600;
    transform: translateX(4px);
}

/* Menampilkan garis aksen pada menu yang aktif */
aside .nav-item.active:before {
    transform: scaleY(1);
}

/* PENGECUALIAN: Gaya spesial hanya untuk Dashboard yang aktif */
aside .nav-item[data-section="sections/dashboard.php"].active {
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    box-shadow: 0 4px 12px -1px rgba(0, 0, 0, 0.2);
}

/* Link submenu yang sedang aktif */
aside .submenu .nav-item.active {
    background: white;
    color: #1e40af; /* Warna biru tua agar kontras */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}