/*
Theme Name:   Wagner Child
Theme URI:    https://diewagners.at
Description:  Custom Theme für Wagner
Author:       Life Design
Author URI:   https://diewagners.at
Template:     shehran
Version:      1.0.0
*/

.logo-white img {
    filter: brightness(0) invert(1);
}


@media (min-width: 1201px) {
    .menu-item-11234, 
    .menu-item-11235 { /* Hier die Nummer des anderen Punktes */
        display: none !important;
    }
}


/*---------------------------------Header Menü Hover Animation-----------------------------------*/

/* ============================================================
   ANIMATION: Sweep to Right (CSS Klasse: meine-menu-animation)
   ============================================================ */

/* 1. Theme-Bereinigung: Alte Striche entfernen */
/* Wir verstecken alle ::before und ::after Elemente, die das Theme
   normalerweise hinzufügt, damit nichts doppelt ist oder falsch hängt. */
.meine-menu-animation .menu-item > a::before,
.meine-menu-animation .menu-item > a::after,
.meine-menu-animation .menu-item.active > a::before,
.meine-menu-animation .menu-item.active > a::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
}

/* 2. Text-Container vorbereiten */
.meine-menu-animation .pxl-menu-item-text {
    position: relative !important;
    display: inline-block !important; /* Strich wird so breit wie der Text */
    text-decoration: none !important;
}

/* 3. Der animierte Strich (::after) */
.meine-menu-animation .pxl-menu-item-text::after {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    
    /* ABSTAND: Hier einstellen, wie nah der Strich am Text ist */
    bottom: 30px !important; 
    
    /* OPTIK */
    width: 100% !important;
    height: 1px !important;         /* Dicke */
    background-color: #ffffff !important; /* Farbe Weiß */
    
    /* ANIMATION START (Unsichtbar) */
    transform: scaleX(0) !important;
    
    /* LOGIK FÜR DAS RAUSFAHREN:
       Wenn die Maus weggeht, zieht sich der Strich nach RECHTS zusammen. */
    transform-origin: bottom right !important;
    
    transition: transform 0.3s ease-out !important;
    pointer-events: none !important;
}

/* 4. Hover-Effekt */
.meine-menu-animation .menu-item:hover .pxl-menu-item-text::after {
    /* Strich wird sichtbar */
    transform: scaleX(1) !important;
    
    /* LOGIK FÜR DAS REINFAHREN:
       Wenn die Maus kommt, wächst der Strich von LINKS nach rechts. */
    transform-origin: bottom left !important;
}

/* 5. Aktiver Menüpunkt (Kein dauerhafter Strich) */
/* Dieser Block verhindert, dass "Catering" dauerhaft unterstrichen ist.
   Es wird nur unterstrichen, wenn man die Maus drüber bewegt. */
.meine-menu-animation .menu-item.current-menu-item .pxl-menu-item-text::after {
    transform: scaleX(0) !important;
}
/* Aber wenn man über den aktiven Punkt hovert, soll der Strich kommen: */
.meine-menu-animation .menu-item.current-menu-item:hover .pxl-menu-item-text::after {
    transform: scaleX(1) !important;
    transform-origin: bottom left !important;
}




/*-----------------------------------Reservierungs Formular-----------------------------------------*/

/* Erlaubt, dass das Dropdown über den Rand hinausgehen darf */
.wrap-form, 
.wrap-ctf-1, 
.input-filled, 
.wpcf7-form-control-wrap {
    overflow: visible !important;
}

/* Stellt sicher, dass das Dropdown im Vordergrund ist */
.wpcf7-form-control-wrap select {
    position: relative;
    z-index: 100;
}




/*--------------------------------------Header Mobile Menü Hover---------------------------------------*/

/* Mobile Menü: Active/Current NICHT rot (nur Hover rot) */
.pxl-header-nav .pxl-menu-primary li.current-menu-item > a,
.pxl-header-nav .pxl-menu-primary li.current_page_item > a,
.pxl-header-nav .pxl-menu-primary li.current-menu-item > a span,
.pxl-header-nav .pxl-menu-primary li.current_page_item > a span {
    color: #222 !important;
}

/* Mobile Menü: Hover rot */
.pxl-header-nav .pxl-menu-primary li > a:hover,
.pxl-header-nav .pxl-menu-primary li > a:hover span {
    color: #A32834 !important;
    transition: color 0.2s ease !important;
}

/* Normalzustand (falls du weiß willst, sonst weglassen) */
.pxl-header-nav .pxl-menu-primary li > a,
.pxl-header-nav .pxl-menu-primary li > a span {
    transition: color 0.2s ease !important;
}



/*-----------------------------------------Header Menükarte Button------------------------*/


/* Definiert den Übergang für das Icon-Element */
.hover-icon-down .pxl-icon-list {
    transition: transform 0.3s ease-in-out;
}

/* Bewegt das Icon beim Drüberfahren um 7px nach unten */
.hover-icon-down:hover .pxl-icon-list {
    transform: translateY(8px);
}