/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/


.swliste ul {
	list-style: none;
	padding-left: 1.2em;
}

.swliste ul li {
	position: relative;
}

.swliste ul li::before {
	content: "";
	position: absolute;
	left: -1.2em;
	top: 0.4em;
	width: 0.75em;
	height: 0.75em;
	background-color: #4C9E4A;
}


/* =========================
   NAVIGATION LOGIK
   - animierter Unterstrich
   - Parent aktiv bei Submenu
   - CPT Rückblicke aktiv
   - Mobile Dropdown Anpassungen
   ========================= */

/* ======================================
   NAVIGATION – GRUNDLAGE
   ====================================== */

/* Grundzustand */
.elementor-nav-menu a {
    position: relative;
    text-decoration: none;
}

/* Animierter Strich vorbereiten */
.elementor-nav-menu a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -4px;
    width: 100%;
    height: 2px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

/* Hover */
.elementor-nav-menu a:hover::after {
    transform: scaleX(1);
}

/* Aktive Seite / aktive Menüpunkte */
.elementor-nav-menu .current-menu-item > a::after,
.elementor-nav-menu .current-menu-parent > a::after,
.elementor-nav-menu .current-menu-ancestor > a::after {
    transform: scaleX(1);
}


/* ======================================
   DESKTOP / ALLGEMEINE ACTIVE-LOGIK
   ====================================== */

/* Parent-Menüpunkt rot, sobald im Submenü ein aktiver Punkt sitzt */
.elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a.elementor-item,
.elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a {
    color: #c00000 !important;
}

/* Strich dazu ebenfalls rot + sichtbar */
.elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a::after {
    background: #c00000 !important;
    transform: scaleX(1) !important;
}

/* Dropdown-Pfeil rot */
.elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) .sub-arrow {
    color: #c00000 !important;
}


/* ======================================
   CPT / RÜCKBLICKE
   ====================================== */

/* Einzelner Rückblick geöffnet -> Menüpunkt Rückblicke markieren */
body.ruckblick-template-default li.nav-rueckblicke > a.elementor-item {
    color: #c00000 !important;
}

body.ruckblick-template-default li.nav-rueckblicke > a.elementor-item::after {
    background: #c00000 !important;
    transform: scaleX(1) !important;
}

body.ruckblick-template-default li.nav-rueckblicke .sub-arrow {
    color: #c00000 !important;
}


/* ======================================
   MOBILE / HAMBURGER-MENÜ
   ====================================== */

@media (max-width: 767px) {

    /* Im mobilen Dropdown keinen animierten Unterstrich verwenden */
    .elementor-nav-menu--dropdown a::after {
        display: none !important;
    }

    /* Wenn ein Parent-Menüpunkt aufgeklappt ist:
       Schrift weiß, damit sie auf rotem Hintergrund lesbar bleibt */
    .elementor-nav-menu--dropdown li.menu-item-has-children > a[aria-expanded="true"],
    .elementor-nav-menu--dropdown li.menu-item-has-children > a.highlighted,
    .elementor-nav-menu--dropdown .elementor-item.elementor-item-active {
        color: #ffffff !important;
    }

    /* Pfeil im geöffneten Zustand ebenfalls weiß */
    .elementor-nav-menu--dropdown li.menu-item-has-children > a[aria-expanded="true"] .sub-arrow,
    .elementor-nav-menu--dropdown li.menu-item-has-children > a.highlighted .sub-arrow,
    .elementor-nav-menu--dropdown .elementor-item.elementor-item-active .sub-arrow {
        color: #ffffff !important;
    }

    /* Falls Elementor dem geöffneten Parent rot gibt,
       bleibt der Text damit lesbar */
    .elementor-nav-menu--dropdown li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a.elementor-item,
    .elementor-nav-menu--dropdown li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a {
        color: #ffffff !important;
    }

    .elementor-nav-menu--dropdown li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) .sub-arrow {
        color: #ffffff !important;
    }

    /* Rückblicke im mobilen Menü ebenfalls lesbar halten */
    body.ruckblick-template-default .elementor-nav-menu--dropdown li.nav-rueckblicke > a.elementor-item {
        color: #ffffff !important;
    }

    body.ruckblick-template-default .elementor-nav-menu--dropdown li.nav-rueckblicke .sub-arrow {
        color: #ffffff !important;
    }
}

@media (max-width: 767px) {

    /* Oberer Parent-Menüpunkt in der mobilen Hauptleiste:
       bei aktiver Unterseite nicht rot, sondern weiß */
    .elementor-menu-toggle,
    .elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a.elementor-item,
    .elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a {
        color: #ffffff !important;
    }

    /* Pfeil dazu ebenfalls weiß */
    .elementor-nav-menu li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) .sub-arrow {
        color: #ffffff !important;
    }

    /* Rückblicke ebenfalls in der mobilen Hauptleiste weiß */
    body.ruckblick-template-default li.nav-rueckblicke > a.elementor-item {
        color: #ffffff !important;
    }

    body.ruckblick-template-default li.nav-rueckblicke .sub-arrow {
        color: #ffffff !important;
    }
}

@media (max-width: 767px) {

    /* Hauptmenü oben (nicht das Dropdown) wieder rot */
    .elementor-nav-menu:not(.elementor-nav-menu--dropdown)
    li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a.elementor-item,
    .elementor-nav-menu:not(.elementor-nav-menu--dropdown)
    li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) > a {
        color: #c00000 !important;
    }

    /* Pfeil ebenfalls rot */
    .elementor-nav-menu:not(.elementor-nav-menu--dropdown)
    li.menu-item-has-children:has(ul.sub-menu li.current-menu-item) .sub-arrow{
        color: #c00000 !important;
    }

    /* Rückblicke-Menüpunkt im Hauptmenü */
    body.ruckblick-template-default
    .elementor-nav-menu:not(.elementor-nav-menu--dropdown)
    li.nav-rueckblicke > a.elementor-item{
        color:#c00000 !important;
    }

}



/* =========================================================
   MEILENSTEINE / HISTORIE
   ========================================================= */

@media (max-width: 767px) {
    .meilenstein-mobile-inhalt {
        width: calc(100% - 20px) !important;
        max-width: calc(100% - 20px) !important;
        min-width: 0;
        box-sizing: border-box;
    }
}

/* =========================================================
   MEILENSTEINE / HISTORIE
   ========================================================= */

