/* assets/css/user/main.css atau assets/css/user/home.css */
/* assets/css/user/main.css */

body {
    padding-top: 80px; /* Nilai ini disesuaikan dengan tinggi navbar Anda */
    /* Anda bisa mulai dengan 56px, lalu sesuaikan jika masih ada tumpang tindih */
}

/* Jika Anda ingin padding yang berbeda untuk ukuran layar yang berbeda (lebih responsif) */
@media (min-width: 992px) { /* Untuk desktop (layar large dan di atasnya) */
    body {
        padding-top: 89px; /* Sesuaikan */
    }
}

@media (max-width: 991.98px) { /* Untuk tablet dan ponsel (layar di bawah large) */
    body {
        padding-top: 70px; /* Navbar mungkin sedikit lebih tinggi saat collapse, sesuaikan */
    }
}

/* assets/css/user/main.css */

/* ... Kode CSS yang sudah ada (font, ukuran, dll.) ... */

.nav-custom .navbar-nav .nav-link {
    /* Properti yang sudah ada (font-family, font-size, font-weight, padding) */
    font-family: 'Poppins', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    padding: 0.5rem 1rem; /* Sesuaikan padding agar ada ruang untuk "box" */
    border-radius: 0.3rem; /* Sedikit lengkungan pada sudut box */
    transition: background-color 0.3s ease, color 0.3s ease; /* Efek transisi halus */
    display: inline-block; /* Penting agar padding dan background berfungsi seperti box */
}

/* Efek hover untuk link "Beranda" dan "Konsultasi" */
.nav-custom .navbar-nav .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.2); /* Contoh: background putih transparan */
    color: #fff; /* Warna teks putih saat hover */
    /* Anda bisa mencoba warna lain, misalnya: */
    /* background-color: #007bff; */ /* Biru primer */
    /* color: #fff; */
}

/* Jika ada link aktif, pastikan warnanya tetap menonjol */
.nav-custom .navbar-nav .nav-link.active {
    background-color: #007bff; /* Contoh: Warna biru primer untuk yang aktif */
    color: #fff; /* Warna teks putih */
    /* box-shadow: 0 0 10px rgba(0, 123, 255, 0.5); */ /* Opsional: bayangan */
}

/* Jika navbar Anda gelap, pastikan warna default link juga terlihat */
.nav-custom .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.75); /* Warna teks link default (putih agak transparan) */
}

.nav-custom {
    background-color: #345eeb !important; /* Contoh warna biru tua Bootstrap */
    /* Anda bisa mengganti #343a40 dengan kode warna lain, misalnya: */
    /* background-color: #007bff !important;  biru primer */
    /* background-color: #6f42c1 !important;  ungu */
    /* background-color: #20c997 !important;  hijau tosca */
}

/* Jika Anda menggunakan navbar-light, teksnya mungkin gelap.
   Jika background Anda gelap, Anda mungkin perlu mengubah warna teks link */
.nav-custom .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.75); /* Warna teks link putih transparan */
}

.nav-custom .navbar-nav .nav-link:hover {
    color: rgba(255, 255, 255, 1); /* Warna teks link putih penuh saat hover */
}

.nav-custom .navbar-brand span { /* Untuk teks "E-Shorof" atau "Sistem Pakar..." */
    color: white; /* Warna teks brand putih */
}

.nav-custom .navbar-toggler-icon {
    filter: invert(1); /* Untuk membuat ikon hamburger menjadi putih */
}


/* assets/css/user/main.css */

/* ... Kode CSS yang sudah ada (font, ukuran, dll.) ... */

.nav-custom .navbar-nav .nav-link {
    /* Properti yang sudah ada (font-family, font-size, font-weight, padding) */
    font-family: 'Poppins', sans-serif;
    font-size: 1.1rem;
    font-weight: 500;
    padding: 0.5rem 1rem; /* Sesuaikan padding agar ada ruang untuk "box" */
    border-radius: 0.3rem; /* Sedikit lengkungan pada sudut box */
    transition: background-color 0.3s ease, color 0.3s ease; /* Efek transisi halus */
    display: inline-block; /* Penting agar padding dan background berfungsi seperti box */
}

/* Efek hover untuk link "Beranda" dan "Konsultasi" */
.nav-custom .navbar-nav .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.2); /* Contoh: background putih transparan */
    color: #fff; /* Warna teks putih saat hover */
    /* Anda bisa mencoba warna lain, misalnya: */
    /* background-color: #007bff; */ /* Biru primer */
    /* color: #fff; */
}

/* Jika ada link aktif, pastikan warnanya tetap menonjol */
.nav-custom .navbar-nav .nav-link.active {
    background-color: #007bff; /* Contoh: Warna biru primer untuk yang aktif */
    color: #fff; /* Warna teks putih */
    /* box-shadow: 0 0 10px rgba(0, 123, 255, 0.5); */ /* Opsional: bayangan */
}

/* Jika navbar Anda gelap, pastikan warna default link juga terlihat */
.nav-custom .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.75); /* Warna teks link default (putih agak transparan) */
}