html {
  scroll-behavior: smooth;
}


.hero-bg {
    min-height: 100vh;
    background: linear-gradient(rgba(44, 44, 44, 0.6), rgba(253, 253, 253, 0.6)),
                url('/static/img/pmkb9.jpg') center/cover no-repeat fixed;
    display: flex;
    align-items: center;
    justify-content: center;
}

.navbar-container {
    margin-top: 0;
}

.navbar {
    /* border-radius: 40px; */
    margin-top: 20px;
    background-color: transparent;
    transition: background-color 0.3s ease;
    /* box-shadow: 0 4px 16px rgba(0,0,0,0.10), 0 1.5px 4px rgba(0,0,0,0.12); */
}

.navxup {
  margin-top: 20px;
}

.navbar .nav-item {
  color: rgb(255, 255, 255);
  text-shadow: #3a3a3a;
}

.navbar-dark .navbar-nav .nav-link {
  color: white;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: #ddd; /* warna hover teks jika ingin */
}

.navbar-dark .profile-btn .btn-outline-dark {
  color: white;
  border-color: white;
}

.navbar-dark .profile-btn .btn-outline-dark:hover {
  background-color: white;
  color: black;
}

@media (max-width: 1650px) {
  .navbar {
    margin-top: 0;
    background-color: rgba(0, 0, 0, 0.95) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  }
}

.navbar.scrolled {
  margin-top: 0;
  background-color: rgba(0, 0, 0, 0.95) !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}


.profile-btn .btn{
    border-radius: 20px;
}

/* .title {
    font-family: "Arial Rounded MT", Arial, Helvetica, sans-serif;
    color: rgb(255, 255, 255);
    font-size: 15px;
} */

.badge {
    font-size: 18px;
}

.formCek {
    border-radius: 30px;
}

.toast-container {
    top: 50px;
}

.card {
    max-width: 100%;   /* Batasi lebar max */
    margin: 0 auto;
}

.card-img img {
    max-height: 80px;  /* Ukuran gambar */
}

.card-title {
    font-size: 20px;
}

.card-info {
    font-size: 16px;
}

.card-text {
    font-size: 20px;
}


@media (max-width: 768px) {
    .card-body {
        padding: 1rem !important;  /* Padding lebih kecil mobile */
    }

    .card-img img {
        margin-top: -10px;
        max-height: 40px;  /* Gambar lebih kecil mobile */
    }

    .card-title {
        font-size: 16px;
    }

    .card-info {
        margin-top: -10px;
        font-size: 14px;
    }

    .card-text {
        font-size: 12px;
    }

}
