/* =============================================
   HEADER — styles/header.css  (nach main-new.css laden)
   ============================================= */
:root {
  --hdr-height: 170px;
  --hdr-radius: 10px;
  --hdr-tr: 0.22s cubic-bezier(0.4,0,0.2,1);
}

#site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 5000;
  width: 100%;
  background: rgba(var(--bg), 0.92);
  backdrop-filter: blur(18px) saturate(180%);
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  border-bottom: 1px solid rgba(var(--bg), 0.18);
  box-shadow: var(--shadow);
  transition: box-shadow var(--hdr-tr), background var(--hdr-tr);
}
#site-header.scrolled { box-shadow: 0 4px 32px rgba(0,0,0,0.22); }

.header-inner {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) !important;
  align-items: center !important;
  justify-content: initial !important;
  height: var(--hdr-height) !important;
  max-width: 1400px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  gap: 8px !important;
  position: static !important;
  box-sizing: border-box !important;
}

.header-logo {
  display: flex; align-items: center; justify-content: center; text-decoration: none;
}
.header-logo img { height: 140px; width: auto; }
.logo-light { display:block; }
.logo-dark  { display:none; }
html.dark .logo-light { display:none; }
html.dark .logo-dark  { display:block; }
.logo-wordmark { font-size:1.25rem; font-weight:700; color:var(--text); letter-spacing:-0.02em; white-space:nowrap; }
.logo-dot { color:var(--accent); }

.header-inner > nav {
  display: flex; align-items: center; justify-content: flex-end;
  overflow: hidden; min-width: 0;
}

.header-right-group {
  display: flex; align-items: center; width: 100%; overflow: visible;
}
.header-right-group > nav {
  flex: 1 1 0%; min-width: 0; display: flex; align-items: center; overflow: hidden;
}

/* ── KERN-FIX: Actions niemals kleiner, niemals umbrechen, main-new.css override ── */
.header-actions {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
}
/* Überschreibt main-new.css @media(max-width:767px){flex-wrap:wrap} */
@media (max-width: 768px) {
  #site-header .header-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
  }
}

.nav-left,.nav-right {
  display:flex; align-items:center; gap:2px;
  list-style:none; margin:0; padding:0; flex-shrink:0;
}
.nav-left  { justify-content:flex-end; }
.nav-right { justify-content:flex-start; }

.nav-link {
  display:inline-flex !important; align-items:center;
  padding:7px 13px; border-radius:var(--hdr-radius);
  font-size:0.875rem; font-weight:500; color:var(--muted) !important;
  text-decoration:none !important; white-space:nowrap;
  background:transparent !important;
  transition:color var(--hdr-tr), background var(--hdr-tr) !important;
}
.nav-link:hover  { color:var(--text)   !important; background:var(--accent-hover) !important; }
.nav-link.active { color:var(--accent) !important; background:var(--accent-hover) !important; }

@media (max-width:1100px) { .nav-item[data-overflow="4"] { display:none !important; } }
@media (max-width: 920px) { .nav-item[data-overflow="3"],.nav-item[data-overflow="4"] { display:none !important; } }
@media (max-width: 740px) { .nav-item[data-overflow="2"],.nav-item[data-overflow="3"],.nav-item[data-overflow="4"] { display:none !important; } }
@media (max-width: 640px) { .nav-item { display:none !important; } }

.action-btn {
  display:inline-flex !important; align-items:center; justify-content:center;
  gap:7px; height:36px; padding:0 12px; border:none;
  border-radius:var(--hdr-radius); background:var(--glass) !important;
  color:var(--muted); font-family:inherit; font-size:0.8rem; font-weight:600;
  cursor:pointer; white-space:nowrap; flex-shrink:0;
  transition:background var(--hdr-tr), color var(--hdr-tr), transform var(--hdr-tr);
}
.action-btn:hover { background:var(--accent-hover) !important; color:var(--text); transform:translateY(-1px); }
.action-btn svg { flex-shrink:0; }

/* ── Konto-Button ──────────────────────────────────────────── */
.account-hdr-btn { text-decoration:none; padding:0 10px; }
.account-hdr-initial {
  display:none;
  width:22px; height:22px; border-radius:50%;
  background:var(--accent); color:#fff;
  font-size:0.72rem; font-weight:700;
  align-items:center; justify-content:center;
}
.account-hdr-btn.is-logged-in svg         { display:none; }
.account-hdr-btn.is-logged-in .account-hdr-initial { display:flex; }

/* Sprache + Theme verschwinden GLEICHZEITIG mit letzten Nav-Items bei 640px */
@media (max-width:640px) {
  .lang-wrapper.desktop-only { display:none !important; }
  .action-btn.desktop-only   { display:none !important; }
}

.lang-wrapper { position:relative; flex-shrink:0; }
.lang-btn-flag { width:18px; height:18px; border-radius:3px; object-fit:cover; flex-shrink:0; }

.lang-dropdown {
  position:absolute; top:calc(100% + 10px); right:0; min-width:170px;
  background:rgba(var(--bg),0.96); backdrop-filter:blur(16px) saturate(160%);
  border:1px solid rgba(var(--bg),0.25); border-radius:14px;
  box-shadow:var(--shadow); padding:6px;
  opacity:0; transform:translateY(-8px) scale(0.97); pointer-events:none;
  transition:opacity var(--hdr-tr), transform var(--hdr-tr); z-index:6000;
}
.lang-dropdown::before {
  content:""; position:absolute; top:-9px; right:18px;
  border:9px solid transparent; border-top:none;
  border-bottom-color:rgba(var(--bg),0.96);
}
.lang-wrapper.open .lang-dropdown { opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.lang-option {
  display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:10px;
  font-size:0.875rem; font-weight:500; color:var(--muted); cursor:pointer;
  transition:background var(--hdr-tr), color var(--hdr-tr);
}
.lang-option:hover    { background:var(--accent-hover); color:var(--text); }
.lang-option.active   { color:var(--accent); font-weight:600; }
.lang-option.disabled { opacity:0.45; cursor:default; pointer-events:none; }
.lang-option .flag    { width:20px; height:20px; border-radius:4px; object-fit:cover; flex-shrink:0; }

.burger-btn {
  width:38px !important; height:36px !important; padding:0 !important;
  flex-direction:column !important; gap:5px !important;
  justify-content:center !important;
  border-radius:var(--hdr-radius);
  background:var(--glass) !important;
}
.burger-btn .bar {
  display:block; width:18px; height:2px; background:currentColor;
  border-radius:2px; flex-shrink:0;
  transition:transform 0.28s cubic-bezier(0.4,0,0.2,1), opacity 0.2s;
}
.burger-btn.open .bar:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger-btn.open .bar:nth-child(2) { opacity:0; transform:scaleX(0); }
.burger-btn.open .bar:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.burger-panel {
  position:absolute; top:calc(100% + 12px); right:0; width:220px;
  background:rgba(var(--bg),0.96); backdrop-filter:blur(16px) saturate(160%);
  border:1px solid rgba(var(--bg),0.25); border-radius:14px;
  box-shadow:var(--shadow); padding:8px;
  opacity:0; transform:translateY(-10px) scale(0.97); pointer-events:none;
  transition:opacity var(--hdr-tr), transform var(--hdr-tr); z-index:6000;
}
.header-actions.burger-open .burger-panel {
  opacity:1 !important; transform:translateY(0) scale(1) !important; pointer-events:auto !important;
}
.burger-panel-nav { list-style:none; margin:0; padding:0; }
.burger-panel-nav + .burger-panel-nav { margin-top:6px; padding-top:6px; border-top:1px solid rgba(var(--bg),0.25); }
.burger-panel-nav .nav-link { display:flex !important; width:100%; padding:9px 12px; border-radius:10px; font-size:0.9rem; }

@media (max-width:600px) {
  .nav-left,.nav-right { display:none !important; }
  .burger-panel        { display:none !important; }
}
@media (min-width:601px) { .mobile-panel { display:none !important; } }

.mobile-panel { overflow:hidden; max-height:0; transition:max-height 0.4s cubic-bezier(0.4,0,0.2,1); }
.mobile-panel-inner { padding:0 24px 20px; max-width:1400px; margin:0 auto; }
.mobile-actions-row {
  display:flex; justify-content:center; gap:10px;
  padding:16px 0 14px; border-bottom:1px solid rgba(var(--bg),0.2); margin-bottom:10px;
}
.mobile-actions-row .action-btn { min-width:90px; justify-content:center; }
.mobile-nav { list-style:none; margin:0; padding:0; }
.mobile-nav .nav-link { display:flex !important; width:100%; padding:12px; font-size:1rem; border-radius:var(--hdr-radius); border-bottom:1px solid rgba(var(--bg),0.15); }
.mobile-nav li:last-child .nav-link { border-bottom:none; }
#mobileLangWrapper .lang-dropdown { right:auto; left:0; }
#mobileLangWrapper .lang-dropdown::before { display:none; }
