/**
 * Navbar: hamburger brand + auth mobile (Profil/Keluar di offcanvas saat <=991px)
 * Sinkron dengan id/class baru (Berjodoh-*) dan kompatibel dengan nama lama (asa-*).
 */

/* Tombol menu - palet Berjodoh */
.fbs__net-navbar .fbs__net-navbar-toggler {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: linear-gradient(155deg, var(--bs-primary) 0%, #5a262e 100%);
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow: 0 4px 16px rgba(114, 47, 55, 0.28);
  display: none;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.fbs__net-navbar .fbs__net-navbar-toggler:hover {
  background: linear-gradient(155deg, var(--bs-primary-hover, #6a040f) 0%, var(--bs-primary) 100%);
  box-shadow: 0 6px 20px rgba(114, 47, 55, 0.35);
  transform: translateY(-1px);
}

.fbs__net-navbar .fbs__net-navbar-toggler:active {
  transform: translateY(0);
}

.fbs__net-navbar .fbs__net-navbar-toggler .fbs__net-icon-menu,
.fbs__net-navbar .fbs__net-navbar-toggler .fbs__net-icon-close {
  stroke: currentColor;
}

@media (max-width: 991.98px) {
  .fbs__net-navbar .fbs__net-navbar-toggler {
    display: flex;
  }
}

/* Saat login: sembunyikan Profil + Keluar di bar atas pada mobile */
@media (max-width: 991.98px) {
  body.Berjodoh-logged-in .fbs__net-navbar .header-social > a.btn-primary,
  body.Berjodoh-logged-in .fbs__net-navbar .header-social > button#Berjodoh-header-logout,
  body.asa-logged-in .fbs__net-navbar .header-social > a.btn-primary,
  body.asa-logged-in .fbs__net-navbar .header-social > button#asa-header-logout {
    display: none !important;
  }
}

.Berjodoh-offcanvas-auth,
.asa-offcanvas-auth {
  display: none;
  flex-direction: column;
  gap: 0.65rem;
  padding-top: 1rem;
  margin-top: 0.5rem;
  border-top: 1px solid rgba(18, 40, 83, 0.1);
}

@media (max-width: 991.98px) {
  body.Berjodoh-logged-in .Berjodoh-offcanvas-auth,
  body.asa-logged-in .asa-offcanvas-auth {
    display: flex;
  }
}

/* Desktop: blok auth di offcanvas disembunyikan agar tidak dobel */
@media (min-width: 992px) {
  #Berjodoh-offcanvas-auth.Berjodoh-offcanvas-auth,
  #asa-offcanvas-auth.asa-offcanvas-auth {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    pointer-events: none !important;
  }
}

/* Profil link offcanvas */
.fbs__net-navbar.dark .Berjodoh-offcanvas-auth__link,
#Berjodoh-offcanvas-auth .Berjodoh-offcanvas-auth__link,
.fbs__net-navbar.dark .asa-offcanvas-auth__link,
#asa-offcanvas-auth .asa-offcanvas-auth__link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1rem;
  border-radius: 12px;
  font-weight: 600;
  text-decoration: none !important;
  background: var(--bs-primary);
  color: #fff !important;
  border: 1px solid transparent;
}

.fbs__net-navbar.dark .Berjodoh-offcanvas-auth__link:hover,
.fbs__net-navbar.dark .Berjodoh-offcanvas-auth__link:focus,
#Berjodoh-offcanvas-auth .Berjodoh-offcanvas-auth__link:hover,
#Berjodoh-offcanvas-auth .Berjodoh-offcanvas-auth__link:focus,
.fbs__net-navbar.dark .asa-offcanvas-auth__link:hover,
.fbs__net-navbar.dark .asa-offcanvas-auth__link:focus,
#asa-offcanvas-auth .asa-offcanvas-auth__link:hover,
#asa-offcanvas-auth .asa-offcanvas-auth__link:focus {
  background: var(--bs-primary-hover, #6a040f);
  color: #fff !important;
}

.Berjodoh-offcanvas-auth__logout,
.asa-offcanvas-auth__logout {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0.75rem 1rem;
  border-radius: 12px;
  font-weight: 600;
  border: 1px solid rgba(18, 40, 83, 0.18);
  background: #fff;
  color: rgba(73, 75, 91, 0.95);
  cursor: pointer;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.Berjodoh-offcanvas-auth__logout:hover,
.asa-offcanvas-auth__logout:hover {
  border-color: rgba(114, 47, 55, 0.35);
  color: var(--bs-primary);
  background: rgba(114, 47, 55, 0.05);
}