/* ── Dropdown navigation ─────────────────────────────────── */

.nav-dropdown {
  position: relative;
  list-style: none;
}

.nav-drop-btn {
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 500;
  color: var(--text-2);
  border-radius: 6px;
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: default;
  white-space: nowrap;
  user-select: none;
  transition: color .15s, background .15s;
}

.nav-dropdown:hover .nav-drop-btn,
.nav-dropdown.open .nav-drop-btn,
.nav-drop-btn.active {
  color: var(--text);
  background: rgba(255,255,255,.05);
}

.nav-drop-btn.active {
  color: var(--gold);
  background: rgba(200,155,60,.1);
}

.nav-drop-caret {
  font-size: 8px;
  opacity: .45;
  display: inline-block;
  transition: transform .2s;
}

.nav-dropdown:hover .nav-drop-caret,
.nav-dropdown.open .nav-drop-caret {
  transform: rotate(180deg);
}

/* Hidden by default */
.nav-drop-menu {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%) translateY(-6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;

  background: #0c1120;
  border: 1px solid rgba(200,155,60,.18);
  border-radius: 12px;
  padding: 6px;
  min-width: 220px;
  z-index: 9999;
  box-shadow: 0 16px 48px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.04);
}

.nav-dropdown:hover .nav-drop-menu,
.nav-dropdown.open .nav-drop-menu {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

/* Small triangle pointer */
.nav-drop-menu::before {
  content: '';
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top: none;
  border-bottom-color: rgba(200,155,60,.18);
}
.nav-drop-menu::after {
  content: '';
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top: none;
  border-bottom-color: #0c1120;
}

/* Separator line between items */
.nav-drop-sep {
  height: 1px;
  background: rgba(255,255,255,.06);
  margin: 4px 8px;
}

/* Each link in the menu */
.nav-drop-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  font-size: 13px;
  font-weight: 500;
  color: #7A90B0;
  text-decoration: none;
  border-radius: 8px;
  transition: color .12s, background .12s;
}

.nav-drop-menu a:hover {
  color: #E0D8CC;
  background: rgba(255,255,255,.07);
}

.nav-drop-menu a.active {
  color: #C89B3C;
}

.drop-icon {
  font-size: 15px;
  width: 22px;
  text-align: center;
  flex-shrink: 0;
  opacity: .85;
}

.drop-label {
  flex: 1;
}

.drop-desc {
  font-size: 11px;
  color: #3D526A;
  display: block;
  margin-top: 1px;
}