/*
 Theme Name: MeinAboWein Child
 Theme URI: https://meinabowein.de
 Description: Child-Theme für MeinAboWein – individueller Wein-Abo-Shop
 Author: MeinAboWein
 Template: astra
 Version: 2.4.5
 Text Domain: meinabowein-child
*/

/* ============================================================
 * Farben & Grundelemente
 * ============================================================ */
:root{
  --mab-farbe-gold:#C6A572;
  --mab-farbe-dunkel:#1F1F1F;

  /* Mobile Menü (immer lesbar) */
  --mab-menu-bg:#0f141a;
  --mab-menu-text:#ffffff;
  --mab-menu-muted:rgba(255,255,255,.72);
  --mab-menu-divider:rgba(255,255,255,.12);

  /* Auswahl / Active State (Dark Mode safe) */
  --mab-active-bg:rgba(198,165,114,.18);
  --mab-active-border:rgba(198,165,114,.92);
  --mab-active-glow:rgba(198,165,114,.32);
}

.mab-btn{
  display:inline-block;
  padding:12px 18px;
  border-radius:999px;
  text-decoration:none;
  border:1px solid var(--mab-farbe-dunkel);
}
.mab-btn--primär{
  background:var(--mab-farbe-gold);
  color:var(--mab-farbe-dunkel);
  border-color:var(--mab-farbe-gold);
}
.mab-btn--hell{
  background:transparent;
  color:var(--mab-farbe-dunkel);
}
.mab-abschnitt{padding:60px 0}
.mab-abschnitt h2{text-align:center;margin-bottom:20px}


/* ============================================================
 * FRAGEBOGEN – Auswahl IMMER sichtbar (Dark Mode Fix)
 * ============================================================ */

/* Default Rand */
.taste-quiz button,
.taste-quiz .button,
#mab_taste_quiz button,
#mab_taste_quiz .button,
.mab-taste-quiz button,
.mab-taste-quiz .button,
.mab-quiz button,
.mab-quiz .button,
.quiz button,
.quiz .button{
  border:1px solid rgba(255,255,255,.22);
}

/* ACTIVE / SELECTED */
.taste-quiz .active,
.taste-quiz .is-active,
.taste-quiz .selected,
#mab_taste_quiz .active,
#mab_taste_quiz .is-active,
#mab_taste_quiz .selected,
.mab-taste-quiz .active,
.mab-taste-quiz .is-active,
.mab-taste-quiz .selected,
.mab-quiz .active,
.mab-quiz .is-active,
.mab-quiz .selected,
.quiz .active,
.quiz .is-active,
.quiz .selected,
.taste-quiz [aria-pressed="true"],
#mab_taste_quiz [aria-pressed="true"],
.mab-taste-quiz [aria-pressed="true"],
.mab-quiz [aria-pressed="true"],
.quiz [aria-pressed="true"]{
  background:var(--mab-active-bg) !important;
  border-color:var(--mab-active-border) !important;
  box-shadow:0 0 0 2px var(--mab-active-glow) !important;
  color:#fff !important;
}

/* input:checked + label */
.taste-quiz input:checked + label,
#mab_taste_quiz input:checked + label,
.mab-taste-quiz input:checked + label,
.mab-quiz input:checked + label,
.quiz input:checked + label{
  background:var(--mab-active-bg) !important;
  border:1px solid var(--mab-active-border) !important;
  box-shadow:0 0 0 2px var(--mab-active-glow) !important;
  color:#fff !important;
}

/* Dark Mode extra Kontrast */
@media (prefers-color-scheme: dark){
  .taste-quiz .active,
  .taste-quiz .is-active,
  .taste-quiz .selected,
  #mab_taste_quiz .active,
  #mab_taste_quiz .is-active,
  #mab_taste_quiz .selected,
  .mab-taste-quiz .active,
  .mab-taste-quiz .is-active,
  .mab-taste-quiz .selected,
  .mab-quiz .active,
  .mab-quiz .is-active,
  .mab-quiz .selected,
  .quiz .active,
  .quiz .is-active,
  .quiz .selected,
  .taste-quiz [aria-pressed="true"],
  #mab_taste_quiz [aria-pressed="true"],
  .mab-taste-quiz [aria-pressed="true"],
  .mab-quiz [aria-pressed="true"],
  .quiz [aria-pressed="true"],
  .taste-quiz input:checked + label,
  #mab_taste_quiz input:checked + label,
  .mab-taste-quiz input:checked + label,
  .mab-quiz input:checked + label,
  .quiz input:checked + label{
    background:rgba(198,165,114,.22) !important;
    border-color:rgba(198,165,114,1) !important;
    box-shadow:0 0 0 2px rgba(198,165,114,.38) !important;
    color:#ffffff !important;
  }
}

/* Focus */
.taste-quiz button:focus,
#mab_taste_quiz button:focus,
.mab-taste-quiz button:focus,
.mab-quiz button:focus,
.quiz button:focus,
.taste-quiz a:focus,
#mab_taste_quiz a:focus,
.mab-taste-quiz a:focus,
.mab-quiz a:focus,
.quiz a:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(198,165,114,.45);
}


/* ============================================================
 * MOBILE TYPO + BASE (leicht größer, besser klickbar)
 * ============================================================ */
@media (max-width:768px){
  html{-webkit-text-size-adjust:100%}

  body{
    font-size:17px;
    line-height:1.45;
  }

  h1{font-size:1.62rem;line-height:1.18}
  h2{font-size:1.38rem;line-height:1.25}
  h3{font-size:1.18rem;line-height:1.30}

  p, li, input, select, textarea{font-size:1.05rem}

  button,
  .button,
  a.button,
  .wp-block-button__link,
  input[type="submit"],
  input[type="button"],
  .ast-button,
  .ast-custom-button{
    font-size:1.02rem;
    padding:12px 15px;
    border-radius:999px;
  }

  /* Forms: verhindert iOS Zoom */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  select,
  textarea{
    font-size:16px;
    padding:10px 12px;
    border-radius:12px;
  }

  /* Container Luft */
  .site-content,
  .ast-container,
  .content-area,
  main{
    padding-left:14px;
    padding-right:14px;
  }

  /* Hero/Slogan kleiner auf Mobile */
  .home h1,
  .home .entry-title,
  .home .ast-archive-title,
  .home .site-content h1:first-of-type{
    font-size:1.35rem !important;
    line-height:1.15 !important;
    letter-spacing:.2px;
  }
}

/* ============================================================
 * MOBILE LANDSCAPE (Querformat)
 * ============================================================ */
@media (max-width:900px) and (orientation:landscape){
  .site-header,
  .ast-primary-header-bar,
  .ast-main-header-bar-alignment,
  .ast-builder-grid-row{
    padding-top:6px !important;
    padding-bottom:6px !important;
    min-height:unset !important;
  }

  .site-branding img,
  .custom-logo-link img,
  .custom-logo{
    max-height:40px !important;
    width:auto !important;
  }

  .ast-above-header,
  .ast-below-header{
    display:none !important;
  }

  .ast-header-button-1 .ast-custom-button,
  .ast-header-button-2 .ast-custom-button{
    font-size:.85rem !important;
    padding:8px 12px !important;
  }

  .site-content,
  main,
  .content-area{
    padding-top:10px !important;
  }

  .home h1,
  .home .entry-title,
  .home .site-content h1:first-of-type{
    font-size:1.15rem !important;
    line-height:1.12 !important;
  }
}


/* ============================================================
 * HEADER: Desktop + Mobile sicher lesbar (gegen "weiß auf weiß")
 * ============================================================ */

/* Astra Header-Bar immer dark + Links immer sichtbar */
.site-header .ast-primary-header-bar{
  background:var(--mab-menu-bg) !important;
}
.site-header .ast-primary-header-bar a,
.site-header .ast-primary-header-bar .menu-link,
.site-header .ast-primary-header-bar .ast-header-html-1,
.site-header .ast-primary-header-bar .ast-header-html-2{
  color:#ffffff !important;
  opacity:1 !important;
}
.site-header .ast-primary-header-bar a:hover{
  color:var(--mab-farbe-gold) !important;
}

/* ============================================================
 * FINAL: Mobile Drawer + Header Tools (Dropdown + Account Icon)
 * ============================================================ */

/* Mobile Drawer: immer dunkel + lesbar */
body.ast-header-break-point .ast-mobile-popup-drawer,
body.ast-header-break-point .ast-mobile-popup-inner,
body.ast-header-break-point .ast-mobile-popup-content{
  background:var(--mab-menu-bg) !important;
  color:var(--mab-menu-text) !important;
}
body.ast-header-break-point .ast-mobile-popup-content a,
body.ast-header-break-point .ast-mobile-popup-content .menu-link,
body.ast-header-break-point .ast-mobile-popup-content .menu-item > a{
  color:var(--mab-menu-text) !important;
  opacity:1 !important;
  font-weight:650 !important;
}
body.ast-header-break-point .ast-mobile-popup-content .menu-item{
  border-bottom:1px solid var(--mab-menu-divider) !important;
}
body.ast-header-break-point .ast-mobile-popup-drawer .ast-mobile-popup-close{
  color:var(--mab-menu-text) !important;
  border-color:rgba(255,255,255,.18) !important;
}

/* Header rechts: Tools + Hamburger in einer Reihe */
@media (max-width:980px){
  .ast-header-break-point .ast-header-section-right{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    flex-wrap:nowrap !important;
    min-width:0 !important;
  }

  /* Tools Container (wird von JS direkt vor den Hamburger gesetzt) */
  .mab-header-tools{
    display:inline-flex !important;
    align-items:center !important;
    gap:10px !important;
    order:900 !important;
    z-index:1200 !important;
  }

  /* Language Dropdown */
  .mab-lang-dropdown{position:relative !important;z-index:2000 !important}
  .mab-lang-toggle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:36px !important;
    min-width:44px !important;
    padding:0 10px !important;
    border-radius:999px !important;
    border:1px solid rgba(255,255,255,.25) !important;
    background:rgba(0,0,0,.10) !important;
    color:#fff !important;
    font-weight:700 !important;
    font-size:12px !important;
    cursor:pointer !important;
  }
  .mab-lang-toggle:after{
    content:"▾";
    margin-left:6px;
    opacity:.85;
    font-size:12px;
  }

  .mab-lang-panel{
    position:absolute !important;
    top:calc(100% + 8px) !important;
    right:0 !important;
    width:190px !important;
    background:#0f141a !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    padding:8px !important;
    box-shadow:0 12px 30px rgba(0,0,0,.35) !important;
    display:none !important;
  }
  .mab-lang-dropdown.is-open .mab-lang-panel{display:block !important}

  .mab-lang-panel a{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    padding:10px 10px !important;
    border-radius:10px !important;
    color:#fff !important;
    text-decoration:none !important;
    font-weight:650 !important;
    opacity:1 !important;
  }
  .mab-lang-panel a:hover{background:rgba(198,165,114,.14) !important}
  .mab-lang-panel img{width:18px !important;height:auto !important;display:inline-block !important}

  /* Account Icon */
  .mab-login-icon{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:36px !important;
    width:44px !important;
    border-radius:999px !important;
    border:1px solid rgba(255,255,255,.25) !important;
    background:rgba(0,0,0,.10) !important;
    text-decoration:none !important;
    color:#fff !important;
    position:relative !important;
    z-index:2000 !important;
  }
  .mab-login-icon:before{content:"👤";font-size:18px;line-height:1}

  /* Hamburger immer sichtbar */
  .ast-header-break-point .menu-toggle,
  .ast-header-break-point .ast-builder-menu-mobile-toggle{
    color:#fff !important;
    z-index:1300 !important;
  }
  .ast-header-break-point .menu-toggle svg{fill:#fff !important}
}

/* ============================================================
 * HARD FIX: Astra Mobile Drawer immer dunkel + Links immer weiß
 * ============================================================ */

/* Drawer / Offcanvas Hintergrund (mehrere Astra Varianten) */
.ast-mobile-popup-drawer,
.ast-mobile-popup-inner,
.ast-mobile-popup-content,
.ast-mobile-popup-content .ast-builder-menu,
.ast-mobile-popup-content nav,
.ast-mobile-popup-content .main-header-menu{
  background:var(--mab-menu-bg) !important;
  color:var(--mab-menu-text) !important;
}

/* Links IMMER weiß + volle Opacity */
.ast-mobile-popup-content a,
.ast-mobile-popup-content a:visited,
.ast-mobile-popup-content a:active,
.ast-mobile-popup-content a:focus,
.ast-mobile-popup-content .menu-link,
.ast-mobile-popup-content .menu-item > a{
  color:var(--mab-menu-text) !important;
  opacity:1 !important;
}

/* Toggle/Dropdown Pfeil */
.ast-mobile-popup-content .ast-menu-toggle,
.ast-mobile-popup-content .ast-menu-toggle span,
.ast-mobile-popup-content .ast-menu-toggle svg{
  color:var(--mab-menu-muted) !important;
  fill:var(--mab-menu-muted) !important;
  opacity:1 !important;
}

/* Trennlinien */
.ast-mobile-popup-content .menu-item{
  border-bottom:1px solid var(--mab-menu-divider) !important;
}

/* Close (X) */
.ast-mobile-popup-close,
.ast-mobile-popup-drawer .ast-mobile-popup-close{
  color:var(--mab-menu-text) !important;
  border-color:rgba(255,255,255,.18) !important;
}

/* Falls Astra ein Overlay/Wrapper nutzt */
.ast-mobile-popup-overlay{
  background:rgba(0,0,0,.55) !important;
}

/* ============================================================
 * Desktop: Header Tools + Language Dropdown sichtbar + Flags
 * (Das war bei dir der Haupt-Fehler: Desktop fehlte fast komplett)
 * ============================================================ */

/* Tools sichtbar */
.mab-header-tools{
  display:inline-flex;
  align-items:center;
  gap:10px;
}

/* Desktop Dropdown komplett aktivieren (nicht nur mini-height) */
@media (min-width:981px){

  .mab-lang-dropdown{
    position:relative !important;
    z-index:2500 !important;
  }

  .mab-lang-toggle{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    height:34px !important;
    min-width:44px !important;
    padding:0 10px !important;
    border-radius:999px !important;
    border:1px solid rgba(255,255,255,.25) !important;
    background:rgba(0,0,0,.10) !important;
    color:#fff !important;
    font-weight:700 !important;
    font-size:12px !important;
    cursor:pointer !important;
  }

  .mab-lang-toggle:after{
    content:"▾";
    margin-left:6px;
    opacity:.85;
    font-size:12px;
  }

  .mab-lang-panel{
    position:absolute !important;
    top:calc(100% + 10px) !important;
    right:0 !important;
    width:200px !important;
    background:#0f141a !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:14px !important;
    padding:8px !important;
    box-shadow:0 12px 30px rgba(0,0,0,.35) !important;
    display:none !important;
  }

  .mab-lang-dropdown.is-open .mab-lang-panel{
    display:block !important;
  }

  .mab-lang-panel a{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    padding:10px 10px !important;
    border-radius:10px !important;
    color:#fff !important;
    text-decoration:none !important;
    font-weight:650 !important;
    opacity:1 !important;
  }

  .mab-lang-panel a:hover{
    background:rgba(198,165,114,.14) !important;
  }

  .mab-lang-panel img{
    width:18px !important;
    height:auto !important;
    display:inline-block !important;
  }

  .mab-login-icon{
    height:34px !important;
    width:44px !important;
  }
}

/* ============================================================
 * Polylang/Astra Menü-Flaggen: falls du die Polylang Menu-Item Flags nutzt
 * (Damit sie auf Desktop NICHT verschwinden)
 * ============================================================ */
.pll-parent-menu-item,
.menu-item-language{
  display:list-item !important;
  visibility:visible !important;
  opacity:1 !important;
}
.pll-parent-menu-item > a img,
.menu-item-language > a img{
  display:inline-block !important;
  width:18px !important;
  height:auto !important;
  margin-right:6px !important;
  vertical-align:middle !important;
}
.pll-parent-menu-item .sub-menu,
.menu-item-language .sub-menu{
  background:#0f141a !important;
  border:1px solid rgba(255,255,255,.14) !important;
}
.pll-parent-menu-item .sub-menu a,
.menu-item-language .sub-menu a{
  color:#fff !important;
}
/* === MAB: Language flags im Header immer sichtbar === */
.main-header-menu{
  flex-wrap:wrap !important;
  overflow:visible !important;
}

.main-header-menu .mab-lang-menu-item{
  display:inline-flex !important;
  align-items:center !important;
}

.main-header-menu .mab-lang-menu-item a{
  opacity:1 !important;
  visibility:visible !important;
}
/* ============================================================
 * MAB: Header Tools (Sprache + Account) – größer & perfekt platziert
 * ============================================================ */

/* Tools immer sichtbar */
.mab-header-tools{
  display:inline-flex !important;
  align-items:center !important;
  gap:12px !important;
  z-index:99999 !important;
}

/* Desktop: oben rechts im Header (egal wo es im DOM hängt) */
@media (min-width:981px){
  header.site-header,
  .site-header,
  .ast-primary-header-bar{
    position:relative !important;
  }

  .mab-header-tools{
    position:absolute !important;
    right:18px !important;
    top:18px !important;
    margin:0 !important;
  }

  /* etwas größer */
  .mab-lang-toggle{
    height:40px !important;
    min-width:54px !important;
    font-size:13px !important;
    padding:0 12px !important;
  }

  .mab-login-icon{
    height:40px !important;
    width:52px !important;
  }

  .mab-login-icon:before{font-size:19px !important}
}

/* Dropdown Panel */
.mab-lang-dropdown{position:relative !important;z-index:99999 !important}

.mab-lang-panel{
  position:absolute !important;
  top:calc(100% + 10px) !important;
  right:0 !important;
  width:220px !important;
  background:#0f141a !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:14px !important;
  padding:8px !important;
  box-shadow:0 12px 30px rgba(0,0,0,.35) !important;
  display:none !important;
}
.mab-lang-dropdown.is-open .mab-lang-panel{display:block !important}

.mab-lang-panel a{
  display:flex !important;
  gap:10px !important;
  padding:11px 10px !important;
  border-radius:10px !important;
  color:#fff !important;
  text-decoration:none !important;
  font-weight:650 !important;
}
.mab-lang-panel a:hover{background:rgba(198,165,114,.14) !important}

/* ============================================================
 * MAB: Header-Claim auf Mobile deutlich kleiner
 * ============================================================ */
@media (max-width:980px){
  /* Das ist der „Claim / Titelblock“ links im Header */
  .ast-site-identity,
  .site-branding{
    max-width:62vw !important;
  }

  .site-title,
  .ast-site-identity .site-title{
    font-size:14px !important;
    line-height:1.15 !important;
    margin:0 !important;
  }

  .site-description,
  .ast-site-identity .site-description{
    font-size:11px !important;
    line-height:1.1 !important;
    margin-top:2px !important;
    opacity:.9 !important;
  }

  /* Tools auf Mobile nicht oben „kleben“, sondern normal rechts neben Hamburger */
  .mab-header-tools{
    position:static !important;
    margin-left:10px !important;
  }
}
/* ===== MAB: Tools auf Mobile sichtbar links neben Hamburger ===== */
@media (max-width:980px){
  .ast-header-break-point .ast-header-section-right,
  .ast-header-break-point .ast-builder-layout-element.ast-header-section-right{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
  }

  .mab-header-tools{
    display:inline-flex !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
    z-index:99999 !important;
  }

  /* etwas größer/klickbarer */
  .mab-lang-toggle{
    height:38px !important;
    min-width:52px !important;
    font-size:13px !important;
    padding:0 12px !important;
  }

  .mab-login-icon{
    height:38px !important;
    width:48px !important;
  }
}
/* ===== MAB Header Tools: Desktop + Mobile stabil sichtbar ===== */
.mab-header-tools{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  z-index:99999 !important;
}

/* Desktop: immer oben rechts in der Header-Bar */
@media (min-width:981px){
  .ast-primary-header-bar,
  header.site-header,
  .site-header{
    position:relative !important;
  }

  .mab-header-tools{
    position:absolute !important;
    right:18px !important;
    top:18px !important;
  }

  .mab-lang-toggle{
    height:40px !important;
    min-width:56px !important;
    font-size:13px !important;
    padding:0 12px !important;
  }

  .mab-login-icon{
    height:40px !important;
    width:52px !important;
  }
}

/* Mobile: bleibt vor Hamburger, klein/clean */
@media (max-width:980px){
  .mab-lang-toggle{height:38px !important;min-width:52px !important}
  .mab-login-icon{height:38px !important;width:48px !important}
}
@media (min-width:981px){
  .mab-desktop-tools .mab-lang-toggle{height:42px !important;min-width:60px !important;font-size:13px !important}
  .mab-desktop-tools .mab-login-icon{height:42px !important;width:54px !important}
}
/* ============================================================
 * MAB: Desktop Tools links oben neben Logo (kollisionsfrei)
 * ============================================================ */

@media (min-width:981px){
  .ast-primary-header-bar,
  header.site-header,
  .site-header{
    position:relative !important;
  }

  /* Desktop Tools links oben */
  .mab-desktop-tools{
    position:absolute !important;
    left:18px !important;   /* links */
    top:18px !important;    /* oben */
    right:auto !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:10px !important;
    z-index:999999 !important;
    pointer-events:auto !important;
  }

  /* Etwas größer/edler */
  .mab-desktop-tools .mab-lang-toggle{
    height:40px !important;
    min-width:60px !important;
    font-size:13px !important;
    padding:0 12px !important;
  }

  .mab-desktop-tools .mab-login-icon{
    height:40px !important;
    width:52px !important;
  }

  /* Logo/Branding etwas nach rechts schieben, damit es nicht überlappt */
  .ast-site-identity,
  .site-branding{
    padding-left:120px !important;
  }
}

/* Auf Mobile weiterhin aus, Mobile-JS übernimmt */
@media (max-width:980px){
  .mab-desktop-tools{display:none !important}
}
/* ============================================================
 * MAB: Desktop Language Dropdown – immer weiß auf dunkel
 * ============================================================ */

@media (min-width:981px){

  /* Toggle Button: Text + Pfeil weiß */
  .mab-desktop-tools .mab-lang-toggle{
    color:#fff !important;
    border-color:rgba(255,255,255,.25) !important;
    background:rgba(0,0,0,.10) !important;
  }
  .mab-desktop-tools .mab-lang-toggle:after{
    color:#fff !important;
  }

  /* Panel: dunkler Hintergrund + weiße Links */
  .mab-desktop-tools .mab-lang-panel{
    background:#0f141a !important;
    border:1px solid rgba(255,255,255,.14) !important;
  }
  .mab-desktop-tools .mab-lang-panel a,
  .mab-desktop-tools .mab-lang-panel a:visited,
  .mab-desktop-tools .mab-lang-panel a:hover,
  .mab-desktop-tools .mab-lang-panel a:active{
    color:#ffffff !important;
    opacity:1 !important;
    text-decoration:none !important;
  }
  .mab-desktop-tools .mab-lang-panel a:hover{
    background:rgba(198,165,114,.14) !important;
  }

  /* Falls Astra Links im Header generell dunkel macht, härter überschreiben */
  .mab-desktop-tools,
  .mab-desktop-tools *{
    color:#fff !important;
  }
}
/* ============================================================
 * MAB FINAL OVERRIDE (Header Tools)
 * - überschreibt alle alten/doppelten Regeln
 * - Desktop: links oben, weiß, edel
 * - Mobile: vor Hamburger, weiß, klickbar
 * ============================================================ */

/* Beide Varianten (JS-Tools + PHP-Desktop-Tools) gleich behandeln */
.mab-header-tools,
.mab-desktop-tools{
  color:#fff !important;
  z-index:999999 !important;
  pointer-events:auto !important;
}

/* Toggle + Panel IMMER weiß auf dunkel */
.mab-header-tools .mab-lang-toggle,
.mab-desktop-tools .mab-lang-toggle{
  color:#fff !important;
  border:1px solid rgba(255,255,255,.25) !important;
  background:rgba(0,0,0,.12) !important;
  border-radius:999px !important;
  font-weight:700 !important;
}
.mab-header-tools .mab-lang-toggle:after,
.mab-desktop-tools .mab-lang-toggle:after{
  color:#fff !important;
}
.mab-header-tools .mab-lang-panel,
.mab-desktop-tools .mab-lang-panel{
  background:#0f141a !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:14px !important;
  box-shadow:0 12px 30px rgba(0,0,0,.35) !important;
}
.mab-header-tools .mab-lang-panel a,
.mab-desktop-tools .mab-lang-panel a{
  color:#fff !important;
  opacity:1 !important;
  text-decoration:none !important;
}
.mab-header-tools .mab-lang-panel a:hover,
.mab-desktop-tools .mab-lang-panel a:hover{
  background:rgba(198,165,114,.14) !important;
}

/* Account Icon immer sichtbar */
.mab-header-tools .mab-login-icon,
.mab-desktop-tools .mab-login-icon{
  color:#fff !important;
  border:1px solid rgba(255,255,255,.25) !important;
  background:rgba(0,0,0,.12) !important;
}

/* DESKTOP: links oben fest (kollisionsfrei) */
@media (min-width:981px){
  .ast-primary-header-bar,
  header.site-header,
  .site-header{position:relative !important}

  /* Wir platzieren BEIDE links oben – egal welche Variante aktiv ist */
  .mab-header-tools,
  .mab-desktop-tools{
    position:absolute !important;
    left:18px !important;
    top:18px !important;
    right:auto !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:10px !important;
  }

  /* Größen (edel & klickbar) */
  .mab-header-tools .mab-lang-toggle,
  .mab-desktop-tools .mab-lang-toggle{
    height:40px !important;
    min-width:64px !important;
    padding:0 12px !important;
    font-size:13px !important;
  }
  .mab-header-tools .mab-login-icon,
  .mab-desktop-tools .mab-login-icon{
    height:40px !important;
    width:54px !important;
  }

  /* Branding etwas nach rechts, damit nichts überlappt */
  .ast-site-identity,
  .site-branding{
    padding-left:120px !important;
  }
}

/* MOBILE: vor Hamburger, sichtbar */
@media (max-width:980px){
  .mab-desktop-tools{display:none !important} /* Desktop-Variante aus */

  .ast-header-break-point .ast-header-section-right,
  .ast-header-break-point .ast-builder-layout-element.ast-header-section-right{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
  }

  .mab-header-tools{
    position:static !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
  }

  .mab-header-tools .mab-lang-toggle{
    height:38px !important;
    min-width:56px !important;
    font-size:13px !important;
    padding:0 12px !important;
  }
  .mab-header-tools .mab-login-icon{
    height:38px !important;
    width:48px !important;
  }
}
/* ============================================================
 * MAB FINAL HEADER FIX (nur Header/Tools)
 * - Umschalter immer lesbar (weiß auf dunkel)
 * - Account Icon sichtbar
 * - Menü-Klickfläche = genau dort, wo der Text ist
 * ============================================================ */

/* ---------- Tools / Dropdown: immer weiß auf dunkel ---------- */
.mab-header-tools, .mab-desktop-tools{
  z-index:999999 !important;
  pointer-events:auto !important;
}

.mab-header-tools .mab-lang-toggle,
.mab-desktop-tools .mab-lang-toggle{
  color:#fff !important;
  background:rgba(0,0,0,.14) !important;
  border:1px solid rgba(255,255,255,.25) !important;
}

.mab-header-tools .mab-lang-panel,
.mab-desktop-tools .mab-lang-panel{
  background:#0f141a !important;
  border:1px solid rgba(255,255,255,.14) !important;
}

.mab-header-tools .mab-lang-panel a,
.mab-desktop-tools .mab-lang-panel a{
  color:#fff !important;
  opacity:1 !important;
}

.mab-header-tools .mab-lang-panel a:hover,
.mab-desktop-tools .mab-lang-panel a:hover{
  background:rgba(198,165,114,.14) !important;
}

/* Account Icon: IMMER sichtbar (dein "leeres Kästchen") */
.mab-login-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
}
.mab-login-icon:before{
  content:"👤" !important;
  font-size:18px !important;
  line-height:1 !important;
}

/* ---------- Menü: Klickfläche exakt auf Text ---------- */
/* Das beseitigt "1cm darunter klicken" */
.ast-primary-header-bar .main-header-menu > li > a{
  display:inline-flex !important;
  align-items:center !important;
  line-height:1.1 !important;
  padding:10px 14px !important;      /* Klickfläche = sichtbar */
  margin:0 !important;
  position:relative !important;
  top:0 !important;
}

.ast-primary-header-bar .main-header-menu > li{
  margin:0 !important;
  padding:0 !important;
  position:relative !important;
  top:0 !important;
}

/* Dropdown-Pfeile im Menü ebenfalls korrekt klickbar */
.ast-primary-header-bar .ast-menu-toggle,
.ast-primary-header-bar .ast-header-navigation-arrow,
.ast-primary-header-bar .dropdown-menu-toggle{
  position:relative !important;
  top:0 !important;
}

/* Sicherstellen, dass nix "transparent drüber" liegt */
.ast-primary-header-bar,
.ast-primary-header-bar *{
  pointer-events:auto !important;
}
/* ============================================================
 * MAB HEADER CLEAN (final)
 * - Desktop: nur .mab-desktop-tools sichtbar
 * - Mobile: nur .mab-header-tools sichtbar
 * - Tools edel & korrekt platziert
 * - Legal Links im Header ausblenden (AGB/Datenschutz/Widerruf/Impressum)
 * ============================================================ */

/* 1) Desktop/Mobile Umschaltung der beiden Tool-Systeme */
@media (min-width:981px){
  .mab-header-tools{display:none !important}   /* JS Tools aus */
  .mab-desktop-tools{display:inline-flex !important} /* PHP Tools an */
}
@media (max-width:980px){
  .mab-desktop-tools{display:none !important}  /* PHP Tools aus */
  .mab-header-tools{display:inline-flex !important}  /* JS Tools an */
}

/* 2) Desktop: Tools nicht ganz links, sondern neben Logo/Branding */
@media (min-width:981px){
  .ast-primary-header-bar{position:relative !important}

  /* neben dem Branding, nicht am Rand */
  .mab-desktop-tools{
    position:absolute !important;
    left:260px !important;   /* <-- feinjustierbar */
    top:18px !important;
    right:auto !important;
    align-items:center !important;
    gap:10px !important;
    z-index:999999 !important;
  }

  /* Branding braucht dann KEIN padding-left mehr */
  .ast-site-identity,
  .site-branding{
    padding-left:0 !important;
  }
}

/* 3) Tools Styling: immer weiß auf dunkel */
.mab-desktop-tools, .mab-header-tools{z-index:999999 !important}
.mab-desktop-tools .mab-lang-toggle,
.mab-header-tools .mab-lang-toggle{
  color:#fff !important;
  background:rgba(0,0,0,.14) !important;
  border:1px solid rgba(255,255,255,.25) !important;
  border-radius:999px !important;
  font-weight:700 !important;
}
.mab-desktop-tools .mab-lang-panel,
.mab-header-tools .mab-lang-panel{
  background:#0f141a !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:14px !important;
  box-shadow:0 12px 30px rgba(0,0,0,.35) !important;
}
.mab-desktop-tools .mab-lang-panel a,
.mab-header-tools .mab-lang-panel a{
  color:#fff !important;
  opacity:1 !important;
}
.mab-desktop-tools .mab-lang-panel a:hover,
.mab-header-tools .mab-lang-panel a:hover{
  background:rgba(198,165,114,.14) !important;
}

/* Account Icon sichtbar */
.mab-login-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#fff !important;
}
.mab-login-icon:before{
  content:"👤" !important;
  font-size:18px !important;
  line-height:1 !important;
}

/* 4) Legal-Links im Header ausblenden (Footer ja, Header nein) */
.ast-primary-header-bar .main-header-menu a[href*="agb"],
.ast-primary-header-bar .main-header-menu a[href*="datenschutz"],
.ast-primary-header-bar .main-header-menu a[href*="widerruf"],
.ast-primary-header-bar .main-header-menu a[href*="impressum"]{
  display:none !important;
}
/* ============================================================
 * MAB: wenn Seite NICHT live -> keine Konto/Anmelden Buttons im Header
 * ============================================================ */
.mab-site-not-live .mab-header-tools,
.mab-site-not-live .mab-desktop-tools,
.mab-site-not-live .mab-login-icon{
  display:none !important;
}

/* ============================================================
 * MAB 1.0.5 – Chrome-Klickfix für das Desktop-Menü
 *
 * Ursache:
 * .mab-desktop-tools konnte in Chrome als sehr breite,
 * unsichtbare Klickfläche über der Navigation liegen.
 *
 * Lösung:
 * - Wrapper auf die tatsächliche Inhaltsbreite begrenzen
 * - freie Wrapper-Fläche lässt Mausklicks durch
 * - Sprache, Konto-Icon und Sprachmenü bleiben anklickbar
 * ============================================================ */
@media (min-width:981px){

  .mab-desktop-tools{
    width:max-content !important;
    inline-size:max-content !important;
    min-width:0 !important;
    max-width:max-content !important;
    flex:0 0 auto !important;
    right:auto !important;
    bottom:auto !important;
    overflow:visible !important;
    pointer-events:none !important;
  }

  .mab-desktop-tools > *,
  .mab-desktop-tools .mab-lang-dropdown,
  .mab-desktop-tools .mab-lang-toggle,
  .mab-desktop-tools .mab-lang-panel,
  .mab-desktop-tools .mab-lang-panel *,
  .mab-desktop-tools .mab-login-icon{
    pointer-events:auto !important;
  }
}