/* ------------------------------ */
/*
/*      Block: Navigation
/*
/* ------------------------------ */


/* ------------------------------ */
/* Site Header / 
/* Main Navigation
/* ------------------------------ */
header.site-header {

    /* Remove default block spacing */
    > .wp-block-group > .wp-block-group {
        margin-top: 0;
    }

    /* Align top row (utility/search/donate) and give search field all available width */
    > .wp-block-group > .wp-block-group:first-child {
        nav {
            flex: 1;
        }
        .seventy__site-header__search-donate {
            flex: 2;
            justify-content: flex-end;
            flex-flow: row wrap;
            form {
                flex: 2;
                .wp-block-search__inside-wrapper {
                    justify-content: flex-end;
                    align-items: center;
                }
            }
        }
    }

    /* Style the search form and search toggle button */
    .seventy__site-header__search-donate {
        .wp-block-search__button,
        .wp-block-button {
            line-height: var(--wp--custom--line-height--body-small);
        }

        .wp-block-search__button {
            cursor: pointer;
            border-color: transparent;
            background-color: transparent;
            background-image: url(/app/themes/seventy/assets/images/icon-search.svg);
            background-position: var(--wp--preset--spacing--small) center;
            background-repeat: no-repeat;
            border-radius: var(--wp--preset--border-radius--small);
            padding-top: var(--wp--preset--spacing--small);
            padding-bottom: var(--wp--preset--spacing--small);
            padding-left: 2.5rem;
            padding-right: var(--wp--preset--spacing--medium);
            color: var(--wp--preset--color--teal-darker);
            font-size: var(--wp--preset--font-size--small);

            &:focus,
            &:focus-visible {
                background-color: var(--wp--custom--color-semantic--text-link-focus);
            }
            &:active {
                background-color: var(--wp--custom--color-semantic--text-link-active);
            }
        }

        form:not(.wp-block-search__searchfield-hidden) .wp-block-search__button,
        .wp-block-search__button:hover {
            background-color: var(--wp--custom--color-semantic--button-background-default);
        }

        form:not(.wp-block-search__searchfield-hidden) .wp-block-search__button,
        .wp-block-search__button:hover,
        .wp-block-search__button:focus,
        .wp-block-search__button:focus-visible,
        .wp-block-search__button:active {
            background-image: url(/app/themes/seventy/assets/images/icon-search-hover.svg);
            color: var(--wp--custom--color-semantic--button-text-default);
        }
    }

    form:not(.wp-block-search__searchfield-hidden) input[type="search"] {
        margin-right: var(--wp--preset--spacing--small);
    }
}

@media only screen and (max-width: 1000px) {
    header.site-header {
        > .wp-block-group > .wp-block-group:first-child {
            & > .wp-block-group > .wp-block-group {
                flex-flow: row nowrap;
            }
            .seventy__site-header__search-donate {
                /* justify-content: space-between; */
                flex: auto;
                form {
                    flex: auto;
                }
            }
        }
        figure {
            max-width: 10rem;
            flex-basis: auto;
        }
    }
}
@media only screen and (max-width: 600px) {
header.site-header > .wp-block-group > .wp-block-group:first-child > .wp-block-group > .wp-block-group {
        flex-flow: column nowrap;
    }
}

/* ------------------------------ */
/* Site Footer
/* ------------------------------ */
footer.site-footer {
    .wp-block-columns {
        gap: var(--wp--preset--spacing--five-x-large);
    }
    .wp-block-column:first-child {
        flex: 2;
        figure {
            max-width: 20rem;
            margin-bottom: var(--wp--preset--spacing--five-x-large);
        }
    }
    .wp-block-column:nth-child(2),
    .wp-block-column:nth-child(3) {
        flex: 1;
    }
    a,
    a:link,
    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
        color: var(--wp--preset--color--neutral-white);
    }
    a:hover,
    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:hover {
        color: var(--wp--preset--color--teal-lighter);
    }
    a:active,
    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:active {
        color: var(--wp--preset--color--teal-light);
    }
    a:focus,
    a:focus-visible,
    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:focus,
    .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content:focus-visible {
        color: var(--wp--preset--color--teal-light);
    }
}

@media only screen and (min-width: 1000px) {
    footer.site-footer {
        .wp-block-columns {
            padding-right: var(--wp--preset--spacing--four-x-large);
            padding-left: var(--wp--preset--spacing--four-x-large);
        }
        .wp-block-column:first-child {
            padding-right: 10rem;
        }
    }
}
