/*
Theme Name:   Crawford Retirement Group 2023
Author:       The Relish Jar
Author URI:   https://therelishjar.com
Template:     twentytwentyfour
Version:      2024.03.04
*/

/*
body {
    --wp--style--root--padding-top: 0;
    --wp--style--root--padding-bottom: 0;
    /* --global-transition: all .15s cubic-bezier(.07,.95,0,1); *\/
    --global-transition: all 0.1s ease-in;
}
*/

/*
|--------------------------------------------------------------------------
| Custom Classes
|--------------------------------------------------------------------------
*/
.wp-block-image.hero-logo {
    max-width: 800px;
    margin: 0 auto;
}

@media (min-width: 782px) {
    .half-green-right {
        position: relative;
    }

    .half-green-right::before {
        position: absolute;
        background: var(--wp--preset--color--contrast);
        content: '';
        width: 40%;
        height: 90%;
        top: 5%;
        right: 0;
    }
}

.sticky-column {
    top: calc(0px + var(--wp-admin--admin-bar--position-offset, 0px));
    position: sticky;
    z-index: 10;
}

/*
|--------------------------------------------------------------------------
| Groups / Columns / Backgrounds
|--------------------------------------------------------------------------
*/
main .entry-content > .has-background:not(.wp-block-separator) {
    padding-top: var(--wp--preset--spacing--30);
    padding-bottom: var(--wp--preset--spacing--30);
}

/* manually correct styles for full-width background sections */
.has-global-padding > .alignfull.has-background {
    padding-right: var(--wp--style--root--padding-right) !important;
    padding-left: var(--wp--style--root--padding-left) !important;
}

.has-green-white-edge-gradient-background {
    padding-top: var(--wp--preset--spacing--30);
    padding-bottom: var(--wp--preset--spacing--30);
}

/* remove gap between adjacent background sections */
.alignfull + .alignfull {
    margin-block-start: 0;
}

/*
|--------------------------------------------------------------------------
| Typography
|--------------------------------------------------------------------------
*/
main :where(.has-contrast-background-color,
main .has-green-white-edge-gradient-background),
main .has-contrast-background-color :where(h1, h2, h3, h4, h5, h6, a),
main .has-green-white-edge-gradient-background :where(h1, h2, h3, h4, h5, h6, a) {
    color: var(--wp--preset--color--base-2) !important;
}

/* undo block gap for paragraphs & lists */
:where(body .is-layout-flow, .alignfull, .alignfull > .wp-block-group) > :where(p, ol, ul) {
    /* margin-block-start: 1.5rem; */
}

:where(h1, h2, h3, h4, h5, h6) + :where(p, ol, ul) {
    margin-block-start: 1.4rem;
}

/*
|--------------------------------------------------------------------------
| Buttons
|--------------------------------------------------------------------------
*/
.wp-block-button img {
    vertical-align: text-top;

    /* There's no way to do this if the image is the only child because :only-child doesn't detect inline text */
    /* margin-right: var(--wp--preset--spacing--10); */
}

.wp-block-button__link:not(.has-background-color) {

}

.wp-block-button__link:not(.has-background-color):hover {
    background-color: var(--wp--preset--color--accent) !important;
    color: var(--wp--preset--color--accent-4) !important;
}

.wp-block-button__link.has-accent-background-color {
    color: var(--wp--preset--color--accent-4);
}

.wp-block-button__link.has-accent-background-color:hover {
    background-color: var(--wp--preset--color--contrast-3) !important;
    color: var(--wp--preset--color--base-2) !important;
}


/*
.wp-block-button__link.has-tertiary-background-color {
    transition: var(--global-transition);
}

.wp-block-button__link.has-tertiary-background-color:hover {
    background-color: var(--wp--preset--color--secondary) !important;
}
*/

/*
|--------------------------------------------------------------------------
| Header / Nav
|--------------------------------------------------------------------------
*/
.wp-block-navigation__responsive-container {
    background-color: var(--wp--preset--color--base) !important;
    color: var(--wp--preset--color--contrast) !important;
}

@media (min-width: 940px) {
    .wp-block-navigation {
        gap: 3px;
        margin-right: calc(var(--wp--preset--spacing--10) * -1);
    }

    .wp-block-navigation a {
        text-decoration: none !important;
    }

    .wp-block-navigation > .wp-block-navigation-item.wp-block-navigation-submenu,
    .wp-block-navigation > .wp-block-navigation-item:not(.wp-block-navigation-submenu) a {
        padding: calc(var(--wp--preset--spacing--10) * 0.3) var(--wp--preset--spacing--10);
        background: transparent;
    }

    .wp-block-navigation > .wp-block-navigation-item.wp-block-navigation-submenu:hover,
    .wp-block-navigation > .wp-block-navigation-item:not(.wp-block-navigation-submenu):hover a,
    .wp-block-navigation > .wp-block-navigation-item.wp-block-navigation-submenu.current-menu-item,
    .wp-block-navigation > .wp-block-navigation-item:not(.wp-block-navigation-submenu).current-menu-item a {
        background-color: var(--wp--preset--color--base-2);
        color: var(--wp--preset--color--contrast);
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    }
    /* separate selector because firefox ignores the entire style otherwise */
    .wp-block-navigation > .wp-block-navigation-item.wp-block-navigation-submenu:has(.current-menu-ancestor) {
        background-color: var(--wp--preset--color--base-2);
        color: var(--wp--preset--color--contrast);
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    }

    .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
        border: 0;
    }

    .wp-block-navigation .has-child .wp-block-navigation__submenu-container > :where(.wp-block-navigation-item.current-menu-item, .wp-block-navigation-item:hover) > .wp-block-navigation-item__content {
        background-color: var(--wp--preset--color--contrast-3);
        color: var(--wp--preset--color--base-2);
    }

    /* mock the shadow for the first child */
    .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container > li:first-child a {
        /* box-shadow: inset 0 4px 3px rgba(0, 0, 0, 0.16); */
        box-shadow: inset 0px 4px 4px -3px rgba(0,0,0,0.16);
    }

    /* fix bad style from wordpress which adds padding to submenus when the page contains a list */
    .wp-block-navigation__submenu-container {
        padding: 0 !important;
    }
}

@media (max-width: 939.98px) {
    .current-menu-item > a {
        text-decoration: underline !important;
    }
}

body.home header .wp-block-site-logo {
    visibility: hidden;
    pointer-events: none;
}

@media (max-width: 1139.8px) {
    .wp-block-site-logo img {
        max-width: 200px; /*240px;*/
        width: 100%;
    }
}

@media (max-width: 1060px) and (min-width: 940px) {
    header .wp-block-navigation {
        font-size: 90%;
    }
}

/*
@media (max-width: 840px) {
    .wp-block-site-logo img {
        max-width: 200px;
        width: 100%;
    }
}
*/

.wp-block-navigation__submenu-container {
    padding-top: 0 !important;
}


/*
|--------------------------------------------
| Breakpoint reset
|--------------------------------------------
*/
/* copy of wp default css to a 1000px media query */
@media (min-width: 940px) {
    .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: none !important;
    }

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

/* neutralize the wp default for 600px */
@media (min-width: 600px) {
    .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex;
    }
    .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
        display: none;
    }
}

/*
|--------------------------------------------------------------------------
| Footer
|--------------------------------------------------------------------------
*/
/* add footer spacing back when it's not an element with a bg */
main .entry-content > :last-child:not(.has-background),
main .entry-content > :last-child:where(.shadow, .shadow-md, .shadow-lg) {
    margin-bottom: 3rem;
}
footer {
    margin-block-start: 0;
}

/*
|--------------------------------------------------------------------------
| Forms
|--------------------------------------------------------------------------
*/
.gform_wrapper:first-child, script:first-child + .gform_wrapper {
    margin-block-start: 0 !important;
}

/*
.gfield--type-section {
    border: 0 !important;
    padding: 0 !important;
    margin-bottom: calc(-1 * var(--gform-theme-form-col-gap)) !important;
}
.gsection_title {
    /* color: var(--wp--preset--color--primary); *\/
    margin: 0;
}
*/

/*
|--------------------------------------------------------------------------
| Custom Block Styles
|--------------------------------------------------------------------------
*/
/*
|--------------------------------------------
| Headings
|--------------------------------------------
*/
.is-style-bottom-line::after {
    content: '';
    height: 1px;
    background: currentColor;
    display: block;
    position: relative;
    bottom: -0.2rem; /*-0.5rem*/
    width: 100%;
}


/*
|--------------------------------------------
| Groups
|--------------------------------------------
*/
.is-style-icon-overlay-dark,
.is-style-icon-overlay-light {
    background-size: auto 110% !important;
    background-repeat: no-repeat;
    background-position: left center;
}

.is-style-icon-overlay-light-right {
    background-size: auto 100% !important;
    background-repeat: no-repeat;
    background-position: right center;
}


.is-style-icon-overlay-dark {
    background-image: url(./assets/images/icon-dark-mask.png);
}
.is-style-icon-overlay-light {
    background-image: url(./assets/images/icon-light-mask.png);
}
.is-style-icon-overlay-light-right {
    background-image: url(./assets/images/icon-light-right-mask.png);
}

/*
|--------------------------------------------
| Images
|--------------------------------------------
*/
.wp-block-image.is-style-bordered {
    padding: var(--wp--preset--spacing--20);
    border: 2px solid var(--wp--preset--color--accent-3);
}

.wp-block-image.is-style-bordered-offset {
    position: relative;
}
.wp-block-image.is-style-bordered-offset::after {
    content: '';
    /* width: 100%; */
    /* height: 100%; */
    position: absolute;
    top: var(--wp--preset--spacing--20);
    right: calc(var(--wp--preset--spacing--20) * -1);
    bottom: var(--wp--preset--spacing--20);
    left: var(--wp--preset--spacing--20);
    border: 2px solid var(--wp--preset--color--accent-3);
    user-select: none;
}

.wp-block-image:where(.is-style-bordered, .is-style-bordered-offset) img {
    box-shadow: var(--wp--preset--shadow--natural);
}