:root {
    --emerald: #0f5132;
    --emerald-hover: #0a3622;
    --gold: #d4af37;
    --light-bg: #f4f7f6;
    --dark-card: #212529;
}

body {
    background-color: var(--light-bg);
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    overflow-x: hidden;
}

body.dark-mode {
    background-color: #121212;
    color: #e0e0e0;
}

body.dark-mode .card, 
body.dark-mode nav.sidebar,
body.dark-mode .modal-content {
    background-color: #1e1e1e !important;
    color: #fff;
    border-color: #333;
}

body.dark-mode .table {
    color: #e0e0e0;
}

.sidebar {
    background-color: var(--emerald);
    min-height: 100vh;
    color: white;
    box-shadow: 2px 0 10px rgba(0,0,0,0.1);
}

.sidebar .nav-link {
    color: rgba(255,255,255,0.8);
    border-radius: 8px;
    margin-bottom: 5px;
    transition: all 0.2s ease;
}

.sidebar .nav-link:hover, 
.sidebar .nav-link.active {
    background-color: rgba(255,255,255,0.15);
    color: #ffffff;
}

.stat-card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
    transition: transform 0.2s ease;
}

.stat-card:hover {
    transform: translateY(-3px);
}

.bg-emerald-gradient {
    background: linear-gradient(135deg, var(--emerald), #198754);
    color: white;
}

@media (max-width: 768px) {
    .sidebar {
        min-height: auto;
    }
}

@media print {
    .sidebar, .btn, .no-print, form, .modal {
        display: none !important;
    }
    .col-md-9, .col-lg-10 {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    
}
/* =========================================================================
   PEWARNAAN KOLOM VERTIKAL LAPORAN REKAPITULASI ARUS KAS
   ========================================================================= */

/* 1. Warna Default untuk Seluruh Sel Tabel */
.table tbody td {
    padding: 12px 10px !important;
    font-weight: 500 !important;
    color: #2d3748 !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    text-align: center;
}

/* 2. KOLOM 2 (Uraian / Keterangan) - Dibuat rata kiri agar rapi */
.table tbody td:nth-child(2) {
    text-align: left !important;
    background-color: rgba(255, 255, 255, 0.5) !important;
}

/* 3. KOLOM 3 (Pemasukan / Debit) - Diwarnai Hijau Muda Transparan */
.table tbody td:nth-child(3) {
    background-color: rgba(219, 242, 230, 0.7) !important; /* Hijau soft */
    color: #0f5132 !important; /* Teks hijau tua */
    font-weight: 600 !important;
    text-align: right !important;
}

/* 4. KOLOM 4 (Pengeluaran / Kredit) - Diwarnai Merah Muda Transparan */
.table tbody td:nth-child(4) {
    background-color: rgba(253, 234, 236, 0.7) !important; /* Merah/pink soft */
    color: #842029 !important; /* Teks merah tua */
    font-weight: 600 !important;
    text-align: right !important;
}

/* 5. KOLOM 5 (Saldo Akhir) - Diwarnai Biru Muda atau Kuning Lembut */
.table tbody td:nth-child(5) {
    background-color: rgba(232, 244, 252, 0.7) !important; /* Biru langit soft */
    color: #084298 !important; /* Teks biru tua */
    font-weight: 700 !important;
    text-align: right !important;
}

/* 6. Desain Header Tabel (Atas) Agar Tetap Tegas */
.table thead th {
    background: #0f5132 !important; /* Hijau Masjid Solid */
    color: #ffffff !important;
    font-weight: 600 !important;
    padding: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}