@layer utilities {

    .content-wrapper {
        a:not([class]) {
            @apply underline;
        }

        p > a {
            @apply wrap-anywhere;
        }

        p:not([class]) {
            @apply text-p-md/[1.4] font-light;
        }

        p:has(+ p) {
            @apply mb-(--modular-md);
        }

        :is(h1,h2,h3,h4,h5,h6){
            @apply mb-(--modular-md);
        }

        p + :is(h1,h2,h3,h4,h5,h6){
            @apply mt-(--modular-lg);
        }

        p + .wp-block-buttons {
            @apply mt-(--modular-md);
        }
    
        ol.wp-block-list {
            @apply list-decimal;
    
            li::marker {
                @apply font-bold;
            }
        }
    
        ul.wp-block-list {
            @apply list-disc;
        }
    
        ol.wp-block-list,ul.wp-block-list {
            @apply ml-6 my-(--modular-md);
    
            li {
                @apply mb-4;
            }

            .wp-block-list {
                @apply my-4;
            }
        }
    }

    .has-text-align-center {
        @apply text-center;
    }
    .has-text-align-right {
        @apply text-right;
    }
    .has-text-align-left {
        @apply text-left;
    }
    

    .alignwide {
        @apply -mx-4;
    }
    
    .alignfull, .w-container {
        margin-left: calc(-100vw / 2 + 100% / 2);
        margin-right: calc(-100vw / 2 + 100% / 2);
        max-width:100vw;
    }

    .wp-block-separator {
        @apply my-12 border-gray-300 border-t-2;
    }

    .wp-block-embed.is-type-video {
        @apply my-0 max-w-5xl mx-auto;

        .wp-block-embed__wrapper {
            @apply bg-gray-500 aspect-[16/9] my-(--modular-xl) rounded-lg overflow-hidden;
        }
    
        .wp-block-embed__wrapper iframe {
            @apply w-full h-full;
        }
    }

    .wp-block-buttons {
        @apply flex flex-wrap gap-4;
    }
    
    .wp-block-button{
        .wp-block-button__link.wp-element-button {
            @apply btn;
        }
    }

    .wp-block-column.is-vertically-aligned-center {
        @apply self-center;
    }
    .wp-block-column {
        @apply w-full;
    }
    .is-layout-flex.wp-block-columns {
        @apply flex-wrap! md:flex-nowrap!;
    }

    .wp-block-media-text {
        @apply gap-x-12 gap-y-6 mb-12;

        &>.wp-block-media-text__content {
            @apply px-0;
        }
    }

    .block-accordion ~ .block-accordion {
        @apply mt-4!;
    }

    .block-accordion:not(:has(~.block-accordion)) {
        @apply mb-12;
    }

    .block-hero, .block-hero-contact {
        &.is-style-1{
            @apply bg-primary-1 text-gray-700;

            #hero-shape {
                @apply text-primary-2;
            }
        }
        &.is-style-2{
            @apply bg-primary-2 text-gray-700;
            #hero-shape {
                @apply text-primary-1;
            }
        }
        &.is-style-3{
            @apply bg-primary-4 text-white;
            
            .btn {
                @apply text-primary-1 border-primary-1 hover:bg-primary-1 hover:text-primary-4;
            }

            #hero-shape{
                @apply text-gray-700;
            }
            
        }
        &.is-style-4{
            @apply bg-gray-700 text-white;

            #hero-shape{
                @apply text-gray-700;
            }

            .btn {
                @apply text-primary-1 border-primary-1 hover:bg-primary-1 hover:text-primary-4;
            }
        }
        &.is-style-teal{
            @apply bg-light-teal text-gray-600;

            :is(h1, h2){
                @apply text-dark-teal;
            }

            #hero-shape{
                @apply text-teal;
            }
        }

        &.is-style-yellow{
            @apply bg-light-yellow text-gray-600;

            :is(h1, h2){
                @apply text-dark-yellow;
            }

            #hero-shape{
                @apply text-yellow;
            }
        }
    }

    .block-media-text-group {
        @apply relative;

        .media-text-group-wrapper {
            &.contained {
                @apply my-(--modular-xl);

                .block-media--image > div {
                    @apply h-full;
                }

                img {
                    @apply object-cover;
                }

                .block-wrapper {
                    @apply rounded-lg overflow-hidden;

                    .block-media--text {
                        @apply px-9 py-9 flex items-center;
                    } 
                }
            }
            &.default {
                @apply py-(--modular-xl);

                .block-wrapper > .acf-innerblocks-container {
                    @apply items-center gap-9;
                }
            }
            &.full-height {
                .block-wrapper {
                    @apply py-(--modular-xl) md:py-48 2xl:relative;
                }

                .block-wrapper > .acf-innerblocks-container {
                    @apply gap-18;
                }

                .block-media--image > div {
                    @apply md:!absolute top-0 bottom-0 left-0 right-1/2 !p-0;

                    img {
                        @apply !object-cover;
                    }
                }

                .block-media--text ~ .block-media--image > div {
                    @apply left-1/2 right-0;
                }
            }
        }

        &.is-style-default {
            .media-text-group-wrapper:not(.contained) {
                @apply bg-gray-100;
            }
            .media-text-group-wrapper.contained .block-wrapper {
                @apply bg-gray-100;
            }

            :is(h1, h2, h3, h4, h5, h6){
                @apply text-primary-4
            }
        }

        &.is-style-1{
            .media-text-group-wrapper:not(.contained) {
                @apply bg-primary-1 text-gray-700;
            }
            .media-text-group-wrapper.contained .block-wrapper {
                @apply bg-primary-1 text-gray-700;
            }
        }
        &.is-style-2{
            .media-text-group-wrapper:not(.contained) {
                @apply bg-primary-2 text-gray-700;
            }
            .media-text-group-wrapper.contained .block-wrapper {
                @apply bg-primary-2 text-gray-700;
            }   
        }
        &.is-style-3{
            .media-text-group-wrapper:not(.contained) {
                @apply bg-primary-4 text-white;
            }
            .media-text-group-wrapper.contained .block-wrapper {
                @apply bg-primary-4 text-white;
            }
            .wp-block-button .wp-block-button__link.wp-element-button {
                @apply text-primary-1 border-primary-1 hover:bg-primary-1 hover:text-primary-4;
            }
        }
        &.is-style-4{
            .media-text-group-wrapper:not(.contained) {
                @apply bg-gray-700 text-white;
            }
            .media-text-group-wrapper.contained .block-wrapper {
                @apply bg-gray-700 text-white;
            }

            .wp-block-button .wp-block-button__link.wp-element-button {
                @apply text-primary-1 border-primary-1 hover:bg-primary-1 hover:text-primary-4;
            }
        }
        &.is-style-teal{
            .media-text-group-wrapper:not(.contained) {
                @apply bg-light-teal text-gray-600;

                :is(h1, h2){
                    @apply text-dark-teal;
                }

                .wp-block-button .wp-block-button__link.wp-element-button {
                    @apply text-dark-teal border-dark-teal hover:bg-dark-teal hover:text-white;
                }
            }

            .media-text-group-wrapper.contained .block-wrapper {
                @apply bg-light-teal text-gray-600;

                :is(h1, h2){
                    @apply text-dark-teal;
                }
            }

        }

        .block-wrapper > .acf-innerblocks-container {
            @apply grid md:grid-cols-2;
        }
    }

    .block-media-text-group:has(.contained) ~ .block-media-text-group:has(.contained) {
        @apply mt-[-45px];
    }

    .block-container {
        &.is-style-1{
            @apply bg-gray-100 text-gray-700;
        }
        &.is-style-2{
            @apply bg-gray-200 text-gray-700;
        }
        &.is-style-3{
            @apply bg-primary-4 text-white;  
        }
        &.is-style-4{
            @apply bg-gray-700 text-white;
        }
        &.is-style-teal{
            @apply bg-light-teal text-gray-600;

            :is(h1, h2){
                @apply text-dark-teal;
            }
        }

        &.is-style-dark-teal{
            @apply bg-dark-teal text-light-teal;

            :is(h1, h2){
                @apply text-light-teal;
            }
        }

        &.is-style-yellow{
            @apply bg-light-yellow text-gray-600;

            :is(h1, h2){
                @apply text-dark-yellow;
            }
        }
    }

    .block-highlights {
        @apply bg-gray-100;
        --card-bg: var(--color-gray-200);

        &.is-style-1 {
            @apply bg-gray-200;
            --card-bg: var(--color-gray-100);
        }
    }

    .wp-block-table {
        @apply mb-(--modular-lg);

        table td {
            @apply p-2 border border-solid border-gray-500;
        }
    }

}