/* ------- Navbar Theme (defaults remain) ------- */
:root{
  /* Defaults (used if brand vars are not provided) */
  --nav-bg: #ff9f43;
  --nav-text: #ffffff;
  --nav-text-dim: rgba(255,255,255,0.85);
  --nav-accent: #ffffff;
  --nav-hover-bg: rgba(255,255,255,0.22);
  --nav-border: rgba(255,255,255,0.25);
  --nav-shadow: 0 2px 6px rgba(0,0,0,0.18);
  --nav-shadow-strong: 0 10px 28px rgba(0,0,0,0.25);
  --nav-blur: 6px;

  /* Dropdown palette (light) */
  --dd-bg: #ffffff;
  --dd-text: #334155;          /* slate-700 */
  --dd-hover-bg: #f3f4f6;      /* gray-100 */
  --dd-border: rgba(0,0,0,0.08);
}

/* Allow runtime overrides via --brand-* with fallbacks to --nav-* */
.custom-navbar {
  /* Bootstrap var too, so the component respects the color */
  --bs-navbar-bg: var(--brand-bg, var(--nav-bg));
  background: var(--brand-bg, var(--nav-bg)) !important;
  color: var(--brand-text, var(--nav-text));
  border-bottom: 1px solid var(--brand-border, var(--nav-border));
  box-shadow: var(--nav-shadow);
  backdrop-filter: blur(var(--nav-blur));
  -webkit-backdrop-filter: blur(var(--nav-blur));
}

/* Brand */
.custom-navbar .navbar-brand,
.custom-navbar .navbar-brand:hover {
  color: var(--brand-accent, var(--nav-accent));
  font-weight: 600;
  letter-spacing: .2px;
  text-shadow: 0 1px 0 rgba(0,0,0,0.08);
}

/* Links */
.custom-navbar .nav-link {
  color: var(--brand-text-dim, var(--nav-text-dim));
  transition: all .18s ease, box-shadow .18s ease;
  border-radius: .5rem;
  padding: .5rem .75rem;
}
.custom-navbar .nav-link:hover,
.custom-navbar .nav-link:focus {
  color: var(--brand-text, var(--nav-text));
  background: var(--brand-hover-bg, var(--nav-hover-bg));
  text-decoration: none;
  box-shadow: 0 2px 10px rgba(0,0,0,.15) inset;
  outline: none;
}

/* Active link */
.custom-navbar .nav-link.active,
.custom-navbar .nav-link[aria-current="page"] {
  color: var(--brand-accent, var(--nav-accent)) !important;
  background: transparent;
  box-shadow: none;
}

/* Dropdowns */
.custom-navbar .dropdown-menu {
  background: var(--dd-bg);
  color: var(--dd-text);
  border-color: var(--dd-border);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}
.custom-navbar .dropdown-item { color: var(--dd-text); }
.custom-navbar .dropdown-item:hover,
.custom-navbar .dropdown-item:focus {
  color: #111827;              /* gray-900 */
  background: var(--dd-hover-bg);
}

/* Toggler */
.custom-navbar .navbar-toggler { border-color: var(--brand-border, var(--nav-border)); }
.custom-navbar .navbar-toggler-icon { filter: invert(1) contrast(100%); }

/* Badges */
.custom-navbar .badge {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.15);
  color: #fff;
}

/* Elevate on scroll */
.custom-navbar.is-scrolled { box-shadow: var(--nav-shadow-strong); }