:root {
    --header-height: 80px; /* default desktop */
}

@media (max-width: 768px) {
    :root {
        --header-height: 100px; /* mobile */
    }

    #dashboardWrapper {
        width: 100%;
        padding-left: 10px;   /* lebih lega */
        padding-right: 10px;  /* lebih lega */
    }

    body.logged-in {
        --header-height: 180px;
    }
}

/* Gunakan variabel ini di navbar dan card */
.fixed-top.card,
.responsive-navbar {
    height: var(--header-height);
}

body {
    margin: 0 !important;
    padding-top: var(--header-height);
}

/* Footer logos responsive */
.footer-logos {
    flex-direction: column; /* default mobile */
    align-items: center;
    gap: 10px; /* jarak antar logo */
}

@media (min-width: 768px) {
    .footer-logos {
        flex-direction: row; /* horizontal di desktop */
        justify-content: center;
        gap: 30px; /* jarak antar logo desktop */
    }
}

.row.map-panel {
    align-items: stretch;
}

.card-body.overflow-auto-fixed {
    height: 220px;
    overflow-y: auto;
}

#map { height: 50vh; }

.right-panel {
    display: flex;
    flex-direction: column;
    gap: 25px; /* jarak antar LIST */
}

/* CSS Kustom Minimal untuk Warna Spesifik */
.text-custom-green {
    color: #0c9f1a; /* Hijau yang lebih gelap seperti di gambar */
}
.bg-light-green {
    background-color: #e6ffe6; /* Latar belakang hijau muda */
}
.status-badge {
    background-color: #aaffaa;
    color: #0c9f1a;
    padding: 3px 8px;
    border-radius: 5px;
    font-weight: bold;
}

.btn-masuk {
    /* Menambahkan Gradient Hijau */
    background: linear-gradient(to right, #4CAF50, #3e8e41);
    /* Anda bisa menyesuaikan warna di atas. Contoh: #4CAF50 (hijau medium) ke #3e8e41 (hijau gelap) */

    border-color: #3e8e41; /* Gunakan warna border yang seragam atau lebih gelap */
    color: white !important;
    padding: 10px 20px; /* Sedikit menambah padding agar tombol lebih besar */
    margin: 0 !important;
    font-size: 1.1rem; /* Sedikit menambah ukuran font */
    font-weight: 500;

    /* Menambah border-radius agar sudut lebih membulat */
    border-radius: 8px;

    /* Menghilangkan border default dan box-shadow ringan */
    border: none;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

    /* Memastikan ikon dan teks sejajar di tengah (jika ada) */
    display: inline-flex;
    align-items: center;
}

/*!* Pertahankan hover state untuk pengalaman yang baik *!*/
/*.btn-masuk:hover {*/
/*    background: linear-gradient(to right, #3e8e41, #317034); !* Gradient yang sedikit lebih gelap saat hover *!*/
/*    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);*/
/*    color: white;*/

/*    !* Responsive navbar padding *!*/
/*    @media (max-width: 768px) {*/
/*        .responsive-navbar {*/
/*            padding-top: 3rem !important; !* py-5 ≈ 3rem *!*/
/*            padding-bottom: 3rem !important;*/
/*        }*/
/*    }*/
/*}*/