/* ============================================================
   Odinswacht Final Dropdown Menu
   Nutzt nur bestehende :root Farben.
   ============================================================ */

.topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 9000 !important;
  overflow: visible !important;
}

.topbar .nav {
  position: relative !important;
  width: min(1320px, calc(100% - 32px)) !important;
  min-height: 78px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  overflow: visible !important;
}

.topbar .logo {
  margin-right: auto !important;
  flex: 0 0 auto !important;
}

.topbar .nav-actions {
  order: 50 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 0 0 auto !important;
}

.topbar .ow-real-menu {
  order: 40 !important;
  position: relative !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  z-index: 9500 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.topbar .ow-real-menu > summary {
  list-style: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  min-height: 46px !important;
  border-radius: 999px !important;
  padding: 11px 18px !important;
  border: 1px solid var(--ow-border) !important;
  background: var(--ow-bg-card-soft) !important;
  color: var(--ow-gold-light) !important;
  font-weight: 950 !important;
  cursor: pointer !important;
  box-shadow: 0 16px 42px var(--ow-shadow) !important;
  user-select: none !important;
}

.topbar .ow-real-menu > summary::-webkit-details-marker {
  display: none !important;
}

.topbar .ow-real-menu[open] > summary,
.topbar .ow-real-menu > summary:hover {
  background: var(--ow-gold) !important;
  color: var(--ow-text-dark) !important;
  border-color: var(--ow-gold-light) !important;
}

.topbar .ow-real-menu-panel {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  right: 0 !important;
  left: auto !important;
  z-index: 99999 !important;
  display: block !important;
  width: 430px !important;
  max-width: calc(100vw - 36px) !important;
  max-height: calc(100vh - 110px) !important;
  overflow-y: auto !important;
  padding: 14px !important;
  border-radius: 26px !important;
  border: 1px solid var(--ow-border) !important;
  background: var(--ow-bg-card) !important;
  color: var(--ow-text-main) !important;
  box-shadow: 0 32px 90px var(--ow-shadow) !important;
}

.topbar .ow-real-menu:not([open]) .ow-real-menu-panel {
  display: none !important;
}

.topbar .ow-real-menu-header {
  display: grid !important;
  gap: 4px !important;
  padding: 8px 8px 13px !important;
  margin-bottom: 10px !important;
  border-bottom: 1px solid var(--ow-border-soft) !important;
}

.topbar .ow-real-menu-header strong {
  display: block !important;
  color: var(--ow-gold-light) !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
}

.topbar .ow-real-menu-header span {
  display: block !important;
  color: var(--ow-text-muted) !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
}

.topbar .ow-real-menu-section {
  display: grid !important;
  gap: 7px !important;
  margin-top: 12px !important;
}

.topbar .ow-real-menu-section-title {
  display: block !important;
  padding: 0 7px !important;
  color: var(--ow-text-muted) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

.topbar .ow-real-menu-link {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  min-height: 46px !important;
  border-radius: 17px !important;
  padding: 10px 12px !important;
  background: var(--ow-bg-card-soft) !important;
  color: var(--ow-text-main) !important;
  border: 1px solid var(--ow-border-soft) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
}

.topbar .ow-real-menu-link:hover {
  background: var(--ow-gold-dark) !important;
  color: var(--ow-gold-light) !important;
  border-color: var(--ow-border) !important;
}

.topbar .ow-real-menu-link.active {
  background: var(--ow-gold) !important;
  color: var(--ow-text-dark) !important;
  border-color: var(--ow-gold-light) !important;
}

.topbar .ow-real-menu-left {
  display: inline-flex !important;
  align-items: center !important;
  gap: 11px !important;
  min-width: 0 !important;
}

.topbar .ow-real-menu-icon {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 31px !important;
  height: 31px !important;
  border-radius: 12px !important;
  background: var(--ow-bg-dark) !important;
  color: var(--ow-gold-light) !important;
  border: 1px solid var(--ow-border-soft) !important;
  font-weight: 950 !important;
}

.topbar .ow-real-menu-arrow {
  color: var(--ow-text-muted) !important;
  font-size: 22px !important;
  line-height: 1 !important;
}

/* Alte Menü-Systeme komplett ausblenden */
.topbar .nav-links,
.topbar .nav-menu-toggle,
.nav-menu-backdrop {
  display: none !important;
  pointer-events: none !important;
}

body.nav-menu-is-open {
  overflow: auto !important;
}

@media (max-width: 780px) {
  .topbar .nav {
    width: min(100%, calc(100% - 16px)) !important;
    min-height: 68px !important;
    gap: 8px !important;
  }

  .topbar .logo span:last-child,
  .topbar .ow-real-menu-summary-text {
    display: none !important;
  }

  .topbar .ow-real-menu {
    margin-left: auto !important;
  }

  .topbar .ow-real-menu-panel {
    position: fixed !important;
    top: 76px !important;
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100vh - 92px) !important;
  }

  .topbar .nav-actions .btn {
    min-height: 40px !important;
    padding: 9px 11px !important;
    font-size: 13px !important;
  }
}