/*
Theme Name:   Lazurowe Wakacje
Theme URI:    https://lazurowewakacje.pl
Description:  Autorski projekt przygotowany dla lazurowewakacje.pl
Author:       Dawid Nizioł
Author URI:   https://dawniz.link
Template:     blockbase
Version:      1.0.0
Text Domain:  lazurowewakacje
*/
html {
    overflow-x: hidden;
}

main {
    z-index: 1;
}

.wp-site-blocks .site-header,
.wp-site-blocks .site-footer {
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: 0 !important;
    margin-right: 0 !important;
    z-index: 1000;
    flex-wrap: nowrap;


    & .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item a {
        background-color: var(--wp--preset--color--dark);
    }

    & .wp-block-navigation__responsive-container.is-menu-open {
        position: fixed !important;
        top: 0 !important;
        height: 100vh;
        padding-top: 2rem;
        z-index: 1000;

        & .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
            margin-top: .5rem;
            margin-right: 1rem;
            padding: 0 !important;

            &>.wp-block-navigation-item>.wp-block-navigation-item__content {
                padding: 0 !important;
            }
        }

        .wp-block-navigation__responsive-container-content {
            align-items: flex-end;

            & .wp-block-woocommerce-cart-link a.wc-block-cart-link {
                &:hover {

                    & svg,
                    & span {
                        color: var(--wp--preset--color--primary);
                    }
                }

                & svg,
                & span {
                    color: var(--wp--preset--color--text);
                    transition: color 300ms;
                }
            }
        }

    }

    & ul:not(.wp-block-navigation__submenu-container)>li>a,
    & .wp-block-navigation__responsive-container.is-menu-open ul>li>a {
        display: block;
        position: relative;
        transition: color 300ms;

        &::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 0.1em;
            background-color: var(--wp--preset--color--primary);
            opacity: 0;
            transition: opacity 300ms, transform 300ms;
            opacity: 1;
            transform: scale(0);
            transform-origin: center;
        }

        &:hover {
            color: var(--wp--preset--color--primary);
        }

        &:hover::after,
        &:focus::after {
            opacity: 1;
            transform: translate3d(0, 0.2em, 0);
            transform: scale(1);
        }
    }

    & .wp-block-navigation-item:is(.current-menu-item) a {
        color: var(--wp--preset--color--primary);

        &::after {
            opacity: 1 !important;
            transform: translate3d(0, 0.2em, 0) !important;
            transform: scale(1) !important;
        }
    }

    & .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
        border-radius: 1rem;
        border: none;
        overflow: hidden !important;
        text-align: center;

        &>li>a {
            display: block;
            position: relative;
            transition: color 300ms, background-color 300ms;
            overflow: hidden;

            &:hover {
                color: var(--wp--preset--color--primary);
                background-color: var(--wp--preset--color--dark)
            }
        }
    }
}

@media (max-width: 1050px) {
    html:has(.wp-block-navigation__responsive-container.is-menu-open) .wp-site-blocks .site-header {
        transform: none;
        left: 0;
        width: 100%;
    }

    .footer-logo img {
        max-width: 30%;
    }

    .wp-block-columns {
        flex-wrap: wrap !important;
    }

    .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column {
        flex-basis: 100% !important;
    }
}

@media (max-width: 780px) {
    .footer-logo img {
        max-width: 50%;
    }
}

.homepage-hero.wp-block-cover {
    align-items: center;
}

.homepage-hero .wp-block-cover__inner-container {
    position: static;
}

.header-homepage {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}

.site-footer .wp-block-group .alignwide {
    margin-left: auto;
    margin-right: auto;
    max-width: var(--wp--style--global--wide-size);
}

.wp-site-blocks .site-footer {
    margin-left: 0 !important;
    margin-right: 0 !important;

    & .has-background {
        padding: 0 !important;
    }

    & .wp-block-group.has-background,
    & .wp-block-column.has-bg-color {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    &>.wp-block-group {
        max-width: 100vw;
    }
}

.wp-block-button__link,
:where(.wp-element-button, .wp-block-button__link) {
    transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.wp-block-button__link:hover,
:where(.wp-element-button, .wp-block-button__link):hover {
    color: var(--wp--preset--color--dark) !important;
    border-color: var(--wp--preset--color--dark) !important;
    text-decoration: underline !important;
}

.wp-block-button.is-style-shadow .wp-block-button__link:hover {
    background-color: transparent !important;
    color: var(--wp--preset--color--primary) !important;
    border-color: transparent !important;
}

.card {
    border-radius: 1rem;
    background-color: var(--wp--preset--color--dark);
    padding: 2rem;
    overflow: hidden;
}

.forminator-field {

    & input,
    & textarea {
        border-color: var(--wp--preset--color--dark);
        border-radius: .5rem !important;
    }
}

.svg-alignment {
    align-items: start;

    & svg {
        width: 50% !important;
    }
}

.p-0 {
    padding: 0 !important;
}

.m-0 {
    margin: 0 !important;
}

.full-width {
    width: 100%;
}

.gap-0 {
    gap: 0;
}

.gap-1 {
    gap: calc(var(--wp--custom--gap--baseline));
}

.justify-self-end {
    justify-self: end;
}

.align-self-center {
    align-self: center;
}

@media (max-width: 600px) {
    .wp-site-blocks .site-header .site-brand {
        display: flex !important;
    }

    .wp-site-blocks .site-header .wp-block-site-logo {
        margin-bottom: 0 !important;
        margin-top: 0 !important;
    }
}

.card-with-shadow {
    & .wp-block-sliderberg-sliderberg {
        & .sliderberg-slides-container {
            padding-bottom: 1.1rem;

            & .sliderberg-slide {
                box-shadow: var(--wp--preset--shadow--card);
            }
        }
    }

}

@media (max-width: 1050px) {
    .site-footer {
        & .wp-block-navigation-link {
            justify-content: center;
            flex-basis: 100%;
        }

        & .wp-block-navigation .wp-block-navigation__container {
            justify-content: center;
            flex-direction: column;
            align-items: center;
        }
    }

    .mobile-order-1 {
        order: 1;
    }

    .mobile-order-2 {
        order: 2;
    }
}

@media (max-width: 780px) {
    .site-footer {

        & .pre-footer {
            padding-bottom: 30px !important;
        }
    }

    .about-me__image-column {
        padding-top: 0 !important;
    }

    .mobile-order-1 {
        order: 1;
    }

    .mobile-order-2 {
        order: 2;
    }
}

@media (max-width: 1200px) {
    .wp-block-sliderberg-sliderberg {
        padding: 0 1rem;
    }
}

.cards-with-shadow {
    & .stk-block-carousel__buttons {
        margin-right: 1.2rem;
        margin-left: 1.2rem;
    }

    & .stk-block-carousel__slider {
        padding-bottom: 1.2rem;
        padding-right: 1.2rem;
        padding-left: 1.2rem;

        & .stk-column {
            box-shadow: var(--wp--preset--shadow--card);

            &::before {
                content: '';
                z-index: 1;
                width: 100%;
                height: 100%;
                display: block;
                position: absolute;
                background: linear-gradient(0deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 50%);
            }
        }
    }
}

.offer-with-slider {
    & .sliderberg-nav-button:focus {
        outline: 1px solid currentcolor;
    }

    & .sliderberg-slide {
        border-radius: 1rem;
        transition: width 0.3s ease-in-out;

        &::before {
            content: '';
            z-index: 1;
            width: 100%;
            height: 100%;
            display: block;
            position: absolute;
            background: linear-gradient(0deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 50%);
        }

        &:hover {
            width: 25%;
        }

        & .sliderberg-slide-content {
            width: 100%;
            padding: .3rem;
        }

        & .sliderberg-slide-inner {
            & h2 {
                /* font-family: var(--wp--font-family--prompt);
                font-size: 3rem; */
                text-transform: uppercase;
                color: var(--wp--preset--color--bg);
            }
        }
    }
}

.testimonials {
    & .sliderberg-slide-content {
        padding: 0;
        max-width: none;
        height: 100%;

        & .sliderberg-slide-inner {
            height: 100%;

            &>div {
                height: 100%;

                &>*:first-child {
                    flex-grow: 1;
                    align-self: center;
                    padding: 2rem;
                    padding-bottom: 3.5rem;
                }

                &>*:last-child {
                    align-self: end;
                    padding: 0;
                    max-height: 5rem;

                    & p {
                        margin-left: auto;
                    }

                    & figure {
                        align-self: end;
                        margin-left: auto;
                        width: 8rem;
                        height: auto;
                    }
                }
            }
        }
    }
}

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

    .wp-block-navigation__responsive-container:not(.is-menu-open) {
        bottom: 0;
        display: none !important;
        left: 0;
        position: fixed !important;
        right: 0;
        top: 0;
    }
}