/*
Theme Name: Klimagarten Schwerte
Theme URI: 
Author: Sprawsm Dev Teeam
Author URI: https://sprawsm.com/
Description: 
Requires at least: 6.0
Tested up to: 6.5.2
Requires PHP: 5.7
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: spectra-one
Text Domain: klimagarten-schwerte
Tags: blog, news, portfolio, full-site-editing, full-width-template, rtl-language-support, theme-options, translation-ready, 
*/

.invis-link-dropdown {
    position: absolute !important;
    top: 0px;
    left: 14px;
    z-index: 100;
    a {
        height: 40px;
        width: 191px;
    } 
}

/* Header */
header {
    
    .wp-block-navigation-item {
        width: 90px;

        &:last-child {
            
            width: 60px;
        }

        a {
            margin-left: auto;
            margin-right: auto;
        }

        &:hover {
            font-weight: 700;
        }

        &:focus {
            font-weight: 700;
        }
    }

    .current-menu-item {
        font-weight: 700;
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
        
        .wp-block-navigation__responsive-dialog {
            margin-top: 4px;

            @media (min-width: 768px) {
                margin-top: 14px;
            }
           
            padding: 14px !important;

            &:before {
                content: "";
                background:url("assets/images/Klimagarten\ logo.svg") no-repeat;
                width: 200px;
                height: 50px;
                top: 0px;
                left: 14px;
                position: absolute; 
            }

            ul {
                margin-top: 50px;
                width: 100%;
                margin-left: auto;
                margin-right: auto;
                align-items: flex-start;
                row-gap: 10px;
                

                .current-menu-item {
                    font-weight: 700;
                }

                li {
                    font-size: 54px !important;
                    width: auto;

                    &:hover {
                        
                    }
                }
            }
        }
    }

    .wp-block-navigation__responsive-container-close {
        top: 8px !important;
        right: 14px;
    }
}

@media (max-width: 900px) {
    .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex !important;
    }
} 

@media (max-width: 900px) {
    .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
        background-color: inherit !important;
        display: none !important;
        position: relative !important;
        width: 100% !important;
        z-index: auto !important;
    }
}

/* Cta Container */
.cta-max-width {
    max-width: 730px !important;
    h2 {
        max-width: 470px;
        align-self: flex-start;
    }
    p {
        @media(max-width: 768px) {
            padding-top:24px !important;
            padding-bottom: 24px !important;
        }
    }
}

/* Homepage - posts */
.homepage-post-grid {
    .uagb-text-link {
        padding-left: 27px !important;
        position: relative;

        &:before {
            content: "";
            background: url("assets/images/arrow-right-dark.svg") no-repeat;
            width: 20px;
            height: 20px;
            left: 0px;
            top: 5px;
            position: absolute;

            @media (min-width: 768px) {
                top: 2px;
            }
        }

        &:hover {
            &:before {
                background: url("assets/images/arrow-right-hover-red.svg") no-repeat;  
            }
        }
    }
}

/* Download button - specific styles (custom icon cant be added via spectra) */
.download-button {
    width: 80px !important;
    height: 50px !important;
    a {
        width: 80px !important;
        height: 50px !important;
        padding: 10px 2px 10px 5px ;
        &:before {
            content: "";
            background:url("assets/images/dl-button-icon-light.svg") no-repeat;
            width: 35px;
            height: 29px;
            position: absolute;
        }
    }
}

/* Aktuelles (blog listing) custom position test */
.aktuelles-post-listing {
    .uagb-loop-post:nth-child(odd) {
        .uagb-container-inner-blocks-wrap {
            flex-direction: row-reverse !important;
        }
    }
}

/* Webcam embed style custom  */
#iframewebcam {
    max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
}


.homepage-hero-background {
    @media(max-width: 768px) {
        background-image: none !important;
    }
}