/* ==========================================================================
   ENV Navigation Widget – Version 2.0
   ========================================================================== */

/* Container */
.env-menu {
    position: relative;
    z-index: 2000;
}

/* Overlay */
.env-navigation-overlay {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.9);
    display: none;
    z-index: 2001;
}

.env-navigation-overlay.active {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- Menücontainer --- */
.env-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: var(--env-menu-width, 220px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    background: var(--env-menu-bg, #ffffff);
    z-index: 2001;
    display: none;
}

/* Alignment für Menü */
.env-navigation.align-center .env-menu {
    left: 50%;
    transform: translateX(-50%);
}
.env-navigation.align-right .env-menu {
    left: auto;
    right: 0;
}

/* --- Menüliste + Einträge --- */
.env-menu-list {
    list-style: none;
    margin: 0;
    padding: 12px 18px;
}

.env-menu-list .menu-item {
    margin: 0;
    padding: 0;
}

.env-menu-list .menu-item a {
    display: block;
    padding: 10px 6px;
    text-decoration: none;
    color: inherit;
    border-bottom: var(--env-divider-width, 0px) var(--env-divider-style, solid) var(--env-divider-color, transparent);
    font-size: var(--env-menu-font-size, 16px);
    font-family: var(--env-menu-font-family, inherit);
    font-weight: var(--env-menu-font-weight, normal);
    line-height: var(--env-menu-line-height, 1.4);
}

/* Letzter Menüpunkt ohne Linie */
.env-menu-list .menu-item:last-child a {
    border-bottom: none;
}

/* ==========================================================================
   Haupt- und Zusatzbuttons
   ========================================================================== */

.env-nav-toggle,
.env-extra-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    background-color: var(--env-icon-bg, #d4af37);
    color: var(--env-icon-color, #fff);
    transition: all 0.3s ease;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
    font-size: 24px;
    padding: 0;
}

/* Sticky-Verhalten */
.env-navigation.sticky .env-nav-toggle.main {
    position: fixed;
    right: 0;
    top: var(--env-sticky-top, 20px);
    z-index: 2002;
}

/* Zusatz-Icons Container */
.env-extra-icons {
    position: fixed;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px; /* ✅ gleichmäßiger vertikaler Abstand */
    z-index: 2002;
}

/* Icon-Bilder */
.env-extra-icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    display: block;
}

/* Hover */
.env-nav-toggle:hover,
.env-extra-icon:hover {
    color:#3A434B;
    opacity: 0.95;
}

/* ==========================================================================
   Animation / Editor
   ========================================================================== */

.env-navigation-menu {
    opacity: 0;
    transform: translateY(-10px);
    transition: all 0.3s ease;
}

.env-navigation-overlay.active .env-navigation-menu {
    opacity: 1;
    transform: translateY(0);
}

.elementor-editor-active .env-nav-toggle {
    display: inline-flex !important;
}

/* dezente Hover-Transformation für alle Icon-Buttons */
.env-nav-toggle,
.env-extra-icon {
    transition: transform 0.25s ease;
}

/* sanfter Vergrößerungseffekt beim Hover */
.env-nav-toggle:hover,
.env-extra-icon:hover {
    transform: scale(1.08);
}

/* Kontakt-Popup */
.env-contact-popup {
    position: fixed;
    top: 50px; /* JS wird das später korrekt setzen */
    background: #fff;
    padding: 12px 16px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    border-radius: 6px;
    display: none;
    z-index: 10005;
}

.env-contact-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.env-contact-item:last-child {
    margin-bottom: 0;
}

.env-contact-icon {
    width: var(--contact-icon-size, 34px);
    margin-right: var(--contact-icon-gap, 8px);
}
/* Overlay für Popups */
.env-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: none;
    z-index: 10; /* Zwischen Button und Popup */
}