.site-header {
  position: relative;
  z-index: 20;
}

.site-header-section {
  min-height: 100%;
}

.main-header-bar,
.ast-mobile-header-wrap .ast-primary-header-bar,
.ast-desktop-header-content {
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 46%, transparent);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 97%, transparent), color-mix(in srgb, var(--color-bg-elevated) 95%, transparent));
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
  backdrop-filter: blur(12px);
}

.main-header-bar {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

.site-primary-header-wrap {
  position: sticky;
  top: 0;
  z-index: 30;
}

.admin-bar .site-primary-header-wrap {
  top: 32px;
}

.site .main-header-menu > .menu-item > .menu-link,
.site .ast-builder-menu-1 > .menu-item > .menu-link,
.site .site-title a,
.site .ast-header-break-point .main-navigation ul .menu-item > .menu-link,
.site .ast-builder-menu-1 .sub-menu .menu-link,
.site .main-header-menu .sub-menu .menu-link {
  color: color-mix(in srgb, var(--color-text) 90%, transparent);
  transition:
    color var(--transition-fast),
    opacity var(--transition-fast);
}

.site .main-header-menu > .menu-item > .menu-link,
.site .ast-builder-menu-1 > .menu-item > .menu-link,
.site .site-title a {
  color: color-mix(in srgb, var(--color-text) 90%, transparent) !important;
}

.site .main-header-menu .sub-menu .menu-link,
.site .ast-builder-menu-1 .sub-menu .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item .menu-link {
  color: var(--color-text) !important;
}

.site .main-header-menu > .menu-item > .menu-link:hover,
.site .main-header-menu > .menu-item > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item > .menu-link:focus-visible,
.site .main-header-menu .sub-menu .menu-link:hover,
.site .main-header-menu .sub-menu .menu-link:focus-visible,
.site .ast-builder-menu-1 .sub-menu .menu-link:hover,
.site .ast-builder-menu-1 .sub-menu .menu-link:focus-visible,
.site .site-title a:hover,
.site .site-title a:focus-visible,
.site .ast-header-break-point .main-navigation ul .menu-item .menu-link:hover,
.site .ast-header-break-point .main-navigation ul .menu-item .menu-link:focus-visible {
  color: var(--color-accent) !important;
}

.site .main-header-menu > .menu-item.current-menu-item > .menu-link,
.site .main-header-menu > .menu-item.current-menu-ancestor > .menu-link,
.site .main-header-menu > .menu-item.current-page-ancestor > .menu-link,
.site .main-header-menu > .menu-item.current-menu-parent > .menu-link,
.site .main-header-menu > .menu-item.current_page_parent > .menu-link,
.site .main-header-menu > .menu-item.current-page-parent > .menu-link,
.site .main-header-menu > .menu-item.current_page_item > .menu-link,
.site .main-header-menu > .menu-item.current_page_ancestor > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-menu-item > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-menu-ancestor > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-page-ancestor > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-menu-parent > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current_page_parent > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-page-parent > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current_page_item > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current_page_ancestor > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-item > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-ancestor > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current-page-ancestor > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_item > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_ancestor > .menu-link {
  color: var(--color-warm);
}

.site .main-header-menu > .menu-item.current-menu-item > .menu-link,
.site .main-header-menu > .menu-item.current-menu-ancestor > .menu-link,
.site .main-header-menu > .menu-item.current-page-ancestor > .menu-link,
.site .main-header-menu > .menu-item.current-menu-parent > .menu-link,
.site .main-header-menu > .menu-item.current_page_parent > .menu-link,
.site .main-header-menu > .menu-item.current-page-parent > .menu-link,
.site .main-header-menu > .menu-item.current_page_item > .menu-link,
.site .main-header-menu > .menu-item.current_page_ancestor > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-menu-item > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-menu-ancestor > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-page-ancestor > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-menu-parent > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current_page_parent > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current-page-parent > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current_page_item > .menu-link,
.site .ast-builder-menu-1 > .menu-item.current_page_ancestor > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-item > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-ancestor > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current-page-ancestor > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_item > .menu-link,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_ancestor > .menu-link {
  color: var(--color-warm) !important;
}

.site .main-header-menu > .menu-item.current-menu-item > .menu-link:hover,
.site .main-header-menu > .menu-item.current-menu-item > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current-menu-ancestor > .menu-link:hover,
.site .main-header-menu > .menu-item.current-menu-ancestor > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current-page-ancestor > .menu-link:hover,
.site .main-header-menu > .menu-item.current-page-ancestor > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current-menu-parent > .menu-link:hover,
.site .main-header-menu > .menu-item.current-menu-parent > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current_page_parent > .menu-link:hover,
.site .main-header-menu > .menu-item.current_page_parent > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current-page-parent > .menu-link:hover,
.site .main-header-menu > .menu-item.current-page-parent > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current_page_item > .menu-link:hover,
.site .main-header-menu > .menu-item.current_page_item > .menu-link:focus-visible,
.site .main-header-menu > .menu-item.current_page_ancestor > .menu-link:hover,
.site .main-header-menu > .menu-item.current_page_ancestor > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current-menu-item > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current-menu-item > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current-menu-ancestor > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current-menu-ancestor > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current-page-ancestor > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current-page-ancestor > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current-menu-parent > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current-menu-parent > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current_page_parent > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current_page_parent > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current-page-parent > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current-page-parent > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current_page_item > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current_page_item > .menu-link:focus-visible,
.site .ast-builder-menu-1 > .menu-item.current_page_ancestor > .menu-link:hover,
.site .ast-builder-menu-1 > .menu-item.current_page_ancestor > .menu-link:focus-visible,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-item > .menu-link:hover,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-item > .menu-link:focus-visible,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-ancestor > .menu-link:hover,
.site .ast-header-break-point .main-navigation ul .menu-item.current-menu-ancestor > .menu-link:focus-visible,
.site .ast-header-break-point .main-navigation ul .menu-item.current-page-ancestor > .menu-link:hover,
.site .ast-header-break-point .main-navigation ul .menu-item.current-page-ancestor > .menu-link:focus-visible,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_item > .menu-link:hover,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_item > .menu-link:focus-visible,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_ancestor > .menu-link:hover,
.site .ast-header-break-point .main-navigation ul .menu-item.current_page_ancestor > .menu-link:focus-visible {
  color: var(--color-warm) !important;
}

.site-title a {
  font-weight: 700;
  letter-spacing: -0.03em;
}

.site-title {
  line-height: 1;
}

.site-title a,
.ast-site-identity .site-title a {
  font-size: clamp(1.05rem, 0.96rem + 0.35vw, 1.35rem);
}

.ast-builder-menu-1 .menu-item > .menu-link,
.main-header-menu > .menu-item > .menu-link {
  padding-left: 0.85rem;
  padding-right: 0.85rem;
  font-size: 0.95rem;
  font-weight: 600;
}

.site-header .ast-header-account-wrap,
.site-header [class*="ast-header-account"] {
  color: color-mix(in srgb, var(--color-text) 90%, transparent);
}

.site-header .ast-header-account-wrap a,
.site-header .ast-header-account-wrap .ast-header-account-text,
.site-header [class*="ast-header-account"] a,
.site-header [class*="ast-header-account"] .ast-header-account-text,
.site-header a[href*="/mein-konto"],
.site-header a[href*="/my-account"] {
  color: color-mix(in srgb, var(--color-text) 90%, transparent) !important;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.2;
}

.site-header .ast-header-account-wrap a:hover,
.site-header .ast-header-account-wrap a:focus-visible,
.site-header [class*="ast-header-account"] a:hover,
.site-header [class*="ast-header-account"] a:focus-visible,
.site-header a[href*="/mein-konto"]:hover,
.site-header a[href*="/mein-konto"]:focus-visible,
.site-header a[href*="/my-account"]:hover,
.site-header a[href*="/my-account"]:focus-visible {
  color: var(--color-accent) !important;
}

.site-header .ast-header-account-wrap svg,
.site-header .ast-header-account-wrap [class*="icon"],
.site-header [class*="ast-header-account"] svg,
.site-header [class*="ast-header-account"] [class*="icon"] {
  color: inherit;
  fill: currentColor;
}

.ast-builder-menu-1 .sub-menu,
.main-header-menu .sub-menu {
  border: 1px solid var(--color-border);
  border-radius: calc(var(--radius-md) - 0.125rem);
  background: color-mix(in srgb, var(--color-surface) 98%, transparent);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}

.ast-builder-menu-1 .sub-menu .menu-link,
.main-header-menu .sub-menu .menu-link {
  color: var(--color-text);
}

.ast-builder-layout-element[data-section="section-hb-social-icons-1"] .ast-builder-social-element {
  border-radius: 999px;
}

.ast-mobile-header-wrap .ast-button-wrap .menu-toggle.main-header-menu-toggle {
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-surface) 96%, transparent);
  color: var(--color-text);
}

.fvx-notification-anchor {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.45rem;
  pointer-events: none;
}

.fvx-notification-anchor > * {
  pointer-events: auto;
}

.fvx-notification-hint {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  max-width: min(300px, calc(100% - 28px));
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--color-surface) 98%, transparent);
  color: var(--color-text);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(12px);
  opacity: 0;
  transform: translateY(6px);
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.22s ease,
    transform 0.22s ease,
    visibility 0.22s ease;
}

.fvx-notification-hint.is-visible {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}

.fvx-notification-hint[hidden] {
  display: none !important;
}

.fvx-notification-hint__text {
  margin: 0;
  flex: 1 1 auto;
  font-size: 0.8rem;
  line-height: 1.35;
}

.fvx-notification-hint__dismiss {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.2rem 0.45rem;
  border: none;
  border-radius: 8px;
  background: color-mix(in srgb, var(--color-accent) 14%, transparent);
  color: var(--color-accent);
  font-size: 0.72rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.fvx-notification-hint__dismiss:hover,
.fvx-notification-hint__dismiss:focus-visible {
  background: color-mix(in srgb, var(--color-accent) 22%, transparent);
  outline: none;
}

.fvx-notification-badge-button {
  position: relative;
  display: inline-flex;
  overflow: visible;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-surface) 96%, transparent);
  color: var(--color-text);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(14px);
  text-decoration: none;
  transition:
    transform var(--transition-fast),
    border-color var(--transition-fast),
    box-shadow var(--transition-fast),
    color var(--transition-fast);
}

.fvx-notification-badge-button:hover,
.fvx-notification-badge-button:focus-visible {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--color-accent) 42%, transparent);
  color: var(--color-accent);
  box-shadow: var(--shadow-md);
  outline: none;
}

.fvx-notification-badge-button__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.fvx-notification-badge-button__badge {
  position: absolute;
  top: -3px;
  right: -3px;
  z-index: 1;
  display: inline-flex;
  min-width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  border: 2px solid var(--color-surface);
  border-radius: 999px;
  background: var(--color-danger, #ef4444);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 1;
  box-sizing: border-box;
}

/* display:inline-flex waere sonst spezifischer als HTML [hidden] — Badge blieb sichtbar (z. B. „0“). */
.fvx-notification-badge-button__badge[hidden] {
  display: none !important;
}

.fvx-notification-panel {
  width: min(360px, calc(100% - 28px));
  max-height: min(400px, 72vh);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.75rem 0.85rem 0.65rem;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--color-surface) 98%, transparent);
  color: var(--color-text);
  box-shadow: var(--shadow-lg);
  backdrop-filter: blur(16px);
}

/* display:flex würde sonst [hidden] überschreiben — Panel blieb sichtbar. */
.fvx-notification-panel[hidden] {
  display: none !important;
}

.fvx-notification-panel__head {
  padding-bottom: 0.15rem;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 55%, transparent);
  font-size: 0.95rem;
}

.fvx-notification-panel__summary {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.35;
  color: color-mix(in srgb, var(--color-text) 88%, transparent);
}

.fvx-notification-panel__list {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
  max-height: 220px;
}

.fvx-notification-panel__list > li {
  margin: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 40%, transparent);
}

.fvx-notification-panel__list > li:last-child {
  border-bottom: none;
}

.fvx-notification-panel__row-inner {
  display: flex;
  align-items: stretch;
  gap: 0.2rem;
}

.fvx-notification-panel__row-inner .fvx-notification-panel__item {
  flex: 1 1 auto;
  min-width: 0;
}

.fvx-notification-panel__dismiss {
  flex: 0 0 auto;
  align-self: flex-start;
  margin-top: 0.35rem;
  width: 1.85rem;
  height: 1.85rem;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: color-mix(in srgb, var(--color-text) 55%, transparent);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition:
    background var(--transition-fast),
    color var(--transition-fast);
}

.fvx-notification-panel__dismiss:hover,
.fvx-notification-panel__dismiss:focus-visible {
  background: color-mix(in srgb, var(--color-text) 10%, transparent);
  color: var(--color-text);
  outline: none;
}

.fvx-notification-panel__item {
  display: block;
  padding: 0.55rem 0.15rem;
  color: inherit;
  text-decoration: none;
  border-radius: 8px;
  transition:
    background var(--transition-fast),
    color var(--transition-fast);
}

.fvx-notification-panel__item:hover,
.fvx-notification-panel__item:focus-visible {
  background: color-mix(in srgb, var(--color-accent) 12%, transparent);
  color: var(--color-accent);
  outline: none;
}

.fvx-notification-panel__item.is-unread .fvx-notification-panel__item-title {
  font-weight: 700;
}

.fvx-notification-panel__item-title {
  display: block;
  font-size: 0.84rem;
  line-height: 1.3;
}

.fvx-notification-panel__item-excerpt {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.76rem;
  line-height: 1.35;
  color: color-mix(in srgb, var(--color-text) 72%, transparent);
}

.fvx-notification-panel__item:hover .fvx-notification-panel__item-excerpt,
.fvx-notification-panel__item:focus-visible .fvx-notification-panel__item-excerpt {
  color: color-mix(in srgb, var(--color-accent) 85%, transparent);
}

.fvx-notification-panel__item-time {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.68rem;
  color: color-mix(in srgb, var(--color-text) 58%, transparent);
}

.fvx-notification-panel__placeholder {
  margin: 0;
  padding: 0.35rem 0.15rem 0.5rem;
  font-size: 0.8rem;
  color: color-mix(in srgb, var(--color-text) 70%, transparent);
}

.fvx-notification-panel__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem 0.75rem;
  padding-top: 0.35rem;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 55%, transparent);
}

.fvx-notification-panel__all {
  display: inline-flex;
  align-items: center;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: none;
}

.fvx-notification-panel__all:hover,
.fvx-notification-panel__all:focus-visible {
  text-decoration: underline;
  outline: none;
}

.fvx-notification-panel__mark-all-read {
  margin-left: auto;
  padding: 0.2rem 0.35rem;
  border: none;
  border-radius: 8px;
  background: transparent;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  cursor: pointer;
  transition:
    background var(--transition-fast),
    color var(--transition-fast);
}

.fvx-notification-panel__mark-all-read:hover,
.fvx-notification-panel__mark-all-read:focus-visible {
  background: color-mix(in srgb, var(--color-accent) 12%, transparent);
  outline: none;
}

.fvx-notification-panel__mark-all-read[hidden] {
  display: none !important;
}

/*
 * Mitteilungszentrale: WooCommerce setzt u. a. .woocommerce-formavis-mitteilungen am body.
 * Zusätzlich zur PHP-Logik — falls Endpointerkennung dort fehlschlägt (Block-Konto, Cache).
 */
body.woocommerce-account.woocommerce-formavis-mitteilungen .fvx-notification-anchor {
  display: none !important;
}

/* Fallback, wenn WC-Body-Klassen fehlen (z. B. Block-Konto), Markup kommt von Account Experience. */
body:has(.fvx-account-endpoint.fvx-account-endpoint--notifications) .fvx-notification-anchor {
  display: none !important;
}

body.woocommerce-cart .fvx-notification-anchor,
body.woocommerce-checkout .fvx-notification-anchor {
  display: none !important;
}

@media (max-width: 782px) {
  .admin-bar .site-primary-header-wrap {
    top: 46px;
  }
}

@media (max-width: 768px) {
  .main-header-bar {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
  }

  .ast-builder-menu-mobile .main-navigation {
    padding-top: 0.6rem;
  }
}

@media (max-width: 480px) {
  .site-title a,
  .ast-site-identity .site-title a {
    font-size: 1rem;
  }
}
