/* ================================
   Navbar Hijau Seperti Tombol Search
   ================================ */

/* Ubah warna latar belakang navbar */
.navbar.bg-primary,
.navbar.navbar-expand-lg.bg-primary {
  background-color: #20c997 !important;  /* hijau muda seperti tombol search */
  border-color: #20c997 !important;
}

/* Jika tema memakai variabel Bootstrap 5, override juga */
:root {
  --bs-primary: #20c997 !important;
  --bs-navbar-color: #ffffff !important;
  --bs-navbar-hover-color: #e8f8f5 !important;
  --bs-navbar-active-color: #ffffff !important;
}

/* Warna teks dan link di navbar */
.navbar a.nav-link,
.navbar .navbar-brand {
  color: #ffffff !important;
  transition: color 0.3s ease;
}

.navbar a.nav-link:hover,
.navbar .navbar-brand:hover {
  color: #e8f8f5 !important; /* lebih terang saat hover */
}

/* Toggle button (tombol menu di mobile) */
.navbar-toggler {
  border-color: rgba(255, 255, 255, 0.5) !important;
}

.navbar-toggler-icon {
  background-image: none !important;
  position: relative;
}

.navbar-toggler-icon::before,
.navbar-toggler-icon::after,
.navbar-toggler-icon span {
  content: "";
  display: block;
  width: 22px;
  height: 2px;
  background: #ffffff;
  margin: 5px auto;
}

/* Pastikan dropdown menu juga serasi */
.navbar .dropdown-menu {
  background-color: #20c997 !important;
  border: none !important;
}

.navbar .dropdown-item {
  color: #ffffff !important;
}

.navbar .dropdown-item:hover {
  background-color: #17a589 !important;
}