/*
 * header - margin and padding
 */

#navbar-top,
#navbar-main {
	background-color: #000000 ;
}


/*
 * header - styles for title
 */

#block-music-god-customheadertitle a:link,
#block-music-god-customheadertitle a:active,
#block-music-god-customheadertitle a:visited {
	text-decoration: none ;
	font-weight: 300 ;
	font-size: 1.4em ;
	transition: .15s ease-in-out ;
}

#block-music-god-customheadertitle a:hover {
	color: #ffffff ;
	text-decoration: none ;
}

/*
 * header - styles for menu
 */

#navbar-main .navbar-collapse {
	justify-content: center !important ;
}

#navbar-main .nav-link {
  padding: .5rem 1rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #ffffff ;
  font-weight: 400;
  font-size: 1.12em ;
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease;
}

#navbar-main .nav-link:hover,
#navbar-main .nav-link:focus,
#navbar-main .nav-link.active,
#navbar-main .nav-link.is-active {
  background: #0071b3 ;
  color: #fff;
  text-decoration: none ;
}

/* White toggler + icon */
#navbar-main .navbar-toggler {
  color: #fff;
  background: transparent;
  border-color: rgba(255,255,255,.35);
}
#navbar-main .navbar-toggler .navbar-toggler-icon {
  width: 1.5em; height: 1.5em;
  background-repeat: no-repeat; background-position: center; background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
#navbar-main .navbar-toggler:hover { border-color: rgba(255,255,255,.6); }
#navbar-main .navbar-toggler:focus-visible {
  outline: 0; box-shadow: 0 0 0 .15rem rgba(255,255,255,.35);
}

/* MOBILE (≤991.98px): center the toggler; give collapse base padding to avoid flash */
@media (max-width: 991.98px) {
  #navbar-main .navbar-toggler {
    margin-left: auto; margin-right: auto; display: block;
  }
  #navbar-main .navbar-collapse {
    flex-basis: 100%; width: 100%;
    background: var(--bs-dark, #212529);
    padding: .5rem 1rem;   /* padding present before .show → no flash */
  }
  #navbar-main .navbar-nav {
    width: 100%; flex-direction: column; align-items: stretch; gap: .25rem;
  }
  #navbar-main .nav-link { padding: .625rem .75rem; }
}

/* DESKTOP (≥992px): safety net to ensure button is hidden and menu is visible */
@media (min-width: 992px) {
  #navbar-main .navbar-toggler { display: none !important; }
  #navbar-main .navbar-collapse { display: flex; flex-basis: auto; }
}
