/* Scoped: avoids overriding page-specific cards, menus and typography. */
.valup-nav{--nav-blue:#1c386d;--nav-hover:#111d35;--nav-border:#e2e6f0;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fff;border:1px solid var(--nav-border);border-radius:14px;padding:12px 20px;margin-bottom:20px;position:relative;z-index:1000;box-shadow:0 3px 12px #13172207;font-family:Inter,Arial,sans-serif}
.valup-nav *{box-sizing:border-box}
.valup-nav .nav-brand{display:inline-flex;align-items:center;gap:9px;color:#131722;text-decoration:none;white-space:nowrap;font-size:1.18rem;font-weight:800;letter-spacing:-.5px}
.valup-nav .brand-word small{font-size:.72rem;font-weight:400;color:#6a7181;letter-spacing:0;margin-left:5px}
.valup-nav .nav-links{display:flex;align-items:center;gap:4px}
.valup-nav .nav-item{appearance:none;border:0;background:transparent;color:#6a7181;font:600 .86rem Inter,Arial,sans-serif;text-decoration:none;padding:10px 13px;border-radius:8px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.valup-nav .nav-item:hover,.valup-nav .nav-item:focus-visible{background:#1c386d10;color:var(--nav-blue)}
.valup-nav .nav-item.active,.valup-nav .nav-dropdown.active>.nav-item{background:var(--nav-blue);color:#fff}
.valup-nav .nav-dropdown{position:relative}
.valup-nav .dropdown-toggle:after{content:'▾';font-size:.7rem;opacity:.7}
.valup-nav .dropdown-menu{display:none;position:absolute;top:100%;left:0;min-width:205px;padding:7px;background:#fff;border:1px solid var(--nav-border);border-radius:10px;box-shadow:0 12px 28px #13172218;z-index:1010}
.valup-nav .nav-dropdown:hover>.dropdown-menu,.valup-nav .nav-dropdown:focus-within>.dropdown-menu,.valup-nav .nav-dropdown.open>.dropdown-menu{display:block}
.valup-nav .dropdown-item{display:block;width:100%;border:0;background:none;text-align:left;padding:10px 12px;border-radius:7px;font:500 .84rem Inter,Arial,sans-serif;color:#596273;text-decoration:none;cursor:pointer}
.valup-nav .dropdown-item:hover,.valup-nav .dropdown-item:focus-visible{background:#1c386d0d;color:var(--nav-blue)}
.valup-nav .dropdown-item.active{color:var(--nav-blue);font-weight:800;background:#1c386d0b}
.valup-nav .nav-login{border:1px solid var(--nav-border);margin-left:8px}
.valup-nav .nav-account{border-left:1px solid var(--nav-border);padding-left:10px;margin-left:5px}
.valup-nav .nav-account>.dropdown-menu{left:auto;right:0}
.valup-nav .nav-logout{color:#c52e41;border-top:1px solid var(--nav-border)}
.valup-nav .hamburger{display:none;flex-direction:column;gap:5px;padding:8px;border:0;background:transparent;cursor:pointer}
.valup-nav .hamburger span{width:23px;height:2.5px;border-radius:3px;background:#1c386d}
@media(max-width:1100px){.valup-nav .nav-brand span span:last-child{display:inline}.valup-nav .nav-item{padding:9px 10px}}
@media(max-width:900px){.valup-nav{flex-wrap:wrap}.valup-nav .hamburger{display:flex;margin-left:auto}.valup-nav .nav-links{display:none;position:absolute;top:calc(100% + 7px);left:0;right:0;background:#fff;border:1px solid var(--nav-border);border-radius:12px;padding:10px;box-shadow:0 12px 28px #13172220;flex-direction:column;align-items:stretch;max-height:75vh;overflow-y:auto}.valup-nav .nav-links.show{display:flex}.valup-nav .nav-dropdown{width:100%}.valup-nav .nav-item{width:100%;justify-content:space-between;padding:12px}.valup-nav .dropdown-menu{display:none!important;position:static;box-shadow:none;border:0;background:#f5f7fb;padding:4px 8px;margin:3px 0 8px}.valup-nav .nav-dropdown.open>.dropdown-menu{display:block!important}.valup-nav .nav-login,.valup-nav .nav-account{margin:0;border-left:0;padding-left:0}.valup-nav .nav-account>.dropdown-menu{right:auto}}
@media(prefers-reduced-motion:reduce){.valup-nav *{scroll-behavior:auto}}

/* Branding exakt wie dashboard.html: Logo 20px, Wortmarke und Claim nebeneinander. */
.valup-nav .nav-brand{display:flex;align-items:baseline;gap:10px;font-weight:700;font-size:1.1rem;letter-spacing:-.5px;flex-shrink:0}
.valup-nav .nav-brand svg{width:20px;height:20px;flex-shrink:0}
.valup-nav .nav-brand>div{display:flex;align-items:baseline;gap:8px}
@media(max-width:1100px){.valup-nav .nav-brand>div span:last-child{display:inline!important}}

/* ===== Look & Feel Update (nur CSS, Markup und JS unverändert) ===== */
.valup-nav{background:linear-gradient(180deg,#fff,#fafbff);border-radius:16px;box-shadow:0 4px 16px #1317220a}
.valup-nav .nav-item{border-radius:10px;transition:background .2s,color .2s,box-shadow .2s}
.valup-nav .nav-item:hover,.valup-nav .nav-item:focus-visible{background:linear-gradient(135deg,#2962ff14,#1c386d0d);color:var(--nav-blue)}
.valup-nav .nav-item.active,.valup-nav .nav-dropdown.active>.nav-item{background:linear-gradient(135deg,#2a4f9a,#1c386d);color:#fff;box-shadow:0 4px 12px #1c386d40}
.valup-nav .dropdown-toggle:after{transition:transform .2s}
.valup-nav .nav-dropdown:hover>.dropdown-toggle:after,.valup-nav .nav-dropdown.open>.dropdown-toggle:after{transform:rotate(180deg)}
.valup-nav .dropdown-item{border-radius:9px;transition:background .15s,color .15s}
.valup-nav .dropdown-item:hover,.valup-nav .dropdown-item:focus-visible{background:linear-gradient(135deg,#2962ff14,#1c386d0d)}
.valup-nav .nav-login{background:linear-gradient(135deg,#2962ff,#1c386d);color:#fff;border-color:transparent;padding-left:18px;padding-right:18px;box-shadow:0 4px 12px #2962ff40;transition:transform .2s,box-shadow .2s}
.valup-nav .nav-login:hover,.valup-nav .nav-login:focus-visible{background:linear-gradient(135deg,#3d73ff,#1c386d);color:#fff;transform:translateY(-1px);box-shadow:0 8px 18px #2962ff50}

/* Dropdown weich einblenden (nur Desktop; Mobile bleibt wie bisher) */
@media(min-width:901px){
  .valup-nav .dropdown-menu{display:block;visibility:hidden;opacity:0;pointer-events:none;top:calc(100% + 8px);border-radius:14px;box-shadow:0 18px 40px #13172222;transform:translateY(6px);transition:opacity .2s,transform .22s,visibility 0s .22s}
  .valup-nav .dropdown-menu:before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
  .valup-nav .nav-dropdown:hover>.dropdown-menu,.valup-nav .nav-dropdown:focus-within>.dropdown-menu,.valup-nav .nav-dropdown.open>.dropdown-menu{visibility:visible;opacity:1;pointer-events:auto;transform:none;transition-delay:0s}
}
@media(prefers-reduced-motion:reduce){.valup-nav *{transition:none!important}}

/* Root-Fix: markets.html enthält noch eigene .top-nav-Regeln (später im Cascade). 
   nav.valup-nav ist spezifischer und gewinnt damit sicher. */
nav.valup-nav{background:linear-gradient(180deg,#fff,#fafbff);border:1px solid var(--nav-border);border-radius:16px;padding:12px 20px;margin-bottom:22px;box-shadow:0 4px 16px #1317220a}
@media(max-width:900px){nav.valup-nav{padding:10px 16px}}

/* ===== Globale Ticker-Suche in der Navigation ===== */
.valup-nav .nav-search-wrapper {
  flex: 1;
  margin: 0 16px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
}
.valup-nav .header-search.nav-search {
  width: 100%;
  max-width: 290px;
  position: relative;
  display: flex;
  align-items: center;
}
.valup-nav .header-search.nav-search input {
  width: 100%;
  padding: 8px 48px 8px 14px;
  border: 1px solid var(--nav-border);
  border-radius: 20px;
  font-size: 0.84rem;
  outline: none;
  transition: all 0.2s ease;
  font-family: Inter, Arial, sans-serif;
  background-color: #f4f6f9;
  color: #131722;
}
.valup-nav .header-search.nav-search input:focus {
  border-color: var(--nav-blue);
  box-shadow: 0 0 0 3px rgba(28, 56, 109, 0.1);
  background-color: #fff;
}
.valup-nav .kbd-shortcut {
  position: absolute;
  right: 10px;
  font-size: 0.65rem;
  font-weight: 700;
  color: #6a7181;
  background: #e8ecf4;
  padding: 2px 6px;
  border-radius: 5px;
  pointer-events: none;
}
.valup-nav .nav-search .clear-search-btn {
  position: absolute;
  right: 10px;
  font-size: 0.9rem;
  color: #6a7181;
  cursor: pointer;
  display: none;
  z-index: 2;
  background: transparent;
  padding: 0 4px;
}
.valup-nav .search-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--nav-border);
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(19, 23, 34, 0.14);
  max-height: 280px;
  overflow-y: auto;
  z-index: 1020;
}
.valup-nav .search-result-item {
  padding: 10px 15px;
  border-bottom: 1px solid var(--nav-border);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.valup-nav .search-result-item:last-child { border-bottom: none; }
.valup-nav .search-result-item:hover { background: #f8f9fa; }
.valup-nav .search-result-ticker { font-weight: 700; color: var(--nav-blue); font-size: 0.82rem; flex-shrink: 0; }
.valup-nav .search-result-name {
  font-size: 0.74rem;
  color: #6a7181;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.valup-nav .mobile-search-icon {
  display: none;
  cursor: pointer;
  font-size: 1.15rem;
  color: #6a7181;
  padding: 6px;
}

@media (max-width: 900px) {
  .valup-nav .nav-search-wrapper {
    margin: 0 6px 0 auto;
    justify-content: flex-end;
    flex: 0 1 auto;
    position: static;
  }
  .valup-nav .hamburger {
    margin-left: 0;
  }
  .valup-nav .mobile-search-icon {
    display: inline-flex;
    align-items: center;
  }
  .valup-nav .kbd-shortcut {
    display: none !important;
  }
  .valup-nav .header-search.nav-search {
    display: none;
    position: absolute;
    top: calc(100% + 7px);
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    background: #fff;
    border: 1px solid var(--nav-border);
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(19, 23, 34, 0.14);
    z-index: 1015;
    margin-left: 0;
  }
  .valup-nav .header-search.nav-search.active {
    display: flex;
  }
}

/* ===== FIX: Layout-Shift & Springen auf Desktop verhindern ===== */

/* 1. Verhindert das 15px-Hin-und-Herspringen durch die Browser-Scrollbar beim Seitenwechsel */
html {
  overflow-y: scroll;
  scrollbar-gutter: stable;
}

/* 2. Fixiert die Geometrie der Navbar gegen konkurrierende Inline-Styles der Unterseiten */
nav.top-nav.valup-nav {
  min-height: 62px !important;
  padding: 10px 20px !important;
  margin-bottom: 20px !important;
  box-sizing: border-box !important;
  align-items: center !important;
}

/* 3. Verhindert Breiten-Sprünge der Menü-Buttons durch unterschiedliche Paddings/Schriftgrössen */
nav.top-nav.valup-nav .nav-links {
  gap: 4px !important;
  flex-shrink: 0;
}

nav.top-nav.valup-nav .nav-item {
  padding: 9px 13px !important;
  font-size: 0.86rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

/* 4. Verhindert Zucken beim Klick in ein Dropdown-Menü auf Desktop */
@media (min-width: 901px) {
  .valup-nav .nav-dropdown:focus-within:not(:hover):not(.open) > .dropdown-menu {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
}

/* ===== FIX: Navigation springt beim Login / beim Wechsel E-Mail -> Name ===== */
/* 1. Login-/Konto-Umschaltung schon vor dem ersten Paint (Klasse kommt aus navigation.html) */
html.valup-auth .valup-nav .nav-login { display: none !important; }
html.valup-auth .valup-nav .nav-account { display: inline-block !important; }

/* 2. Konto-Button hat eine FESTE Breite, unabhängig vom Inhalt (Konto / Name / E-Mail):
      Egal welches Skript den Text ändert, die Navigation bewegt sich nicht. */
nav.top-nav.valup-nav #nav-username {
  display: inline-block;
  position: relative;
  width: 156px; min-width: 156px; max-width: 156px;
  padding: 9px 26px 9px 13px !important;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center;
  visibility: visible; /* gewinnt gegen seitenspezifische "visibility:hidden"-Regeln */
}
nav.top-nav.valup-nav #nav-username::after {
  position: absolute; right: 11px; top: 0; bottom: 0; display: flex; align-items: center;
}

@media (max-width: 900px) {
  html.valup-auth .valup-nav .nav-account { display: block !important; }
  nav.top-nav.valup-nav #nav-username {
    display: inline-flex; width: 100%; min-width: 0; max-width: none; text-align: left;
    padding: 12px !important; overflow: visible; justify-content: space-between;
  }
  nav.top-nav.valup-nav #nav-username::after { position: static; display: inline; }
}