/* Header Background */
.custom-header {
  background-color: #000000de;
  padding: 0px;
}

/* Logo */
.navbar-brand {
  width: 15%;
}

.navbar-brand img {
  width: 40%;
  height: auto;
}

/* Mobile Toggler */
.navbar-toggler {
  border-color: white;
}

.navbar-toggler-icon {
  filter: invert(1);
}

/* Nav Links */
.nav-link {
  font-size: 14px;
  font-weight: 500;
  color: #cfcdcd;
  transition: 0.3s ease;
}

/* Active Link (also applies to the Spaces parent when a child page is open) */
.active-link {
  color: #d36b2c !important;
}

/* Hover Effect */
.nav-link:hover,
.nav-link.show {
  color: #d36b2c;
}

/* Dropdown arrow follows link colour */
.dropdown-toggle::after {
  vertical-align: 0.15em;
}

/* Dropdown Menu */
.custom-dropdown {
  background-color: #000000f2;
  border: 1px solid #d36b2c55;
  border-radius: 8px;
  padding: 8px 0;
  min-width: 190px;
  margin-top: 0;
}

.custom-dropdown .dropdown-item {
  font-size: 14px;
  font-weight: 500;
  color: #cfcdcd;
  padding: 9px 20px;
  transition: 0.3s ease;
}

.custom-dropdown .dropdown-item:hover,
.custom-dropdown .dropdown-item:focus {
  background-color: #d36b2c1f;
  color: #d36b2c;
}

/* Current page inside dropdown */
.custom-dropdown .dropdown-item.active-item {
  background-color: transparent;
  color: #d36b2c;
}

/* Book Now Button */
.book-btn {
  background-color: #c0bebe;
  color: #000;
  border-radius: 30px;
  font-size: 14px;
  padding: 8px 22px;
  transition: 0.3s ease;
}

.book-btn:hover {
  background-color: #d36b2c;
  color: #fff;
}

/* Keyboard focus */
.nav-link:focus-visible,
.dropdown-item:focus-visible,
.book-btn:focus-visible,
.navbar-toggler:focus-visible {
  outline: 2px solid #d36b2c;
  outline-offset: 2px;
}

/* Desktop: open dropdown on hover */
@media (min-width: 992px) {
  .custom-header .dropdown:hover > .dropdown-menu {
    display: block;
  }
}

/* Mobile Alignment */
@media (max-width: 991px) {
  .navbar-brand {
    width: 40%;
  }

  .navbar-brand img {
    width: 100%;
  }

  .navbar-nav {
    margin-top: 15px;
  }

  .nav-item {
    margin-bottom: 10px;
  }

  .custom-dropdown {
    background-color: transparent;
    border: 0;
  }
}