/* ---------------------------------------
 Section Styles: Light Warm
 --------------------------------------- */

body .is-style-section-warm-light {
    --theme-color-primary: var(--wp--preset--color--primary, #9c7162);
    --theme-color-secondary: var(--wp--preset--color--secondary, #ce9582);
    --loading-progress-colour: var(--theme-color-primary);

    /* Custom theme colours for icons */
    .primary-theme-color {
        color: var(--theme-color-primary, #9c7162);
    }

    .secondary-theme-color {
        color: var(--theme-color-secondary, #ce9582);
    }

    /* Button Variations -- Unable to target these in section-styles.json */
    .wp-block-buttons {
        .wp-block-button {
            .wp-block-button__link.wp-element-button {
                background-color: var(--theme-color-secondary);
                border: 1px solid var(--theme-color-secondary);
                color: var(--wp--preset--color--white);

                &:hover {
                    background-color: var(--theme-color-primary);
                    border: 1px solid var(--theme-color-primary);
                    color: var(--wp--preset--color--white);
                }
            }

            &.is-style-icon-link {
                .wp-block-button__link.wp-element-button {
                    background-color: transparent;
                    border: 0;
                    color: var(--theme-color-primary);

                    &.wp-element-button--has-icon {
                        filter: brightness(0) saturate(100%) invert(51%) sepia(23%) saturate(583%) hue-rotate(330deg) brightness(89%) contrast(87%);
                    }
                }
            }

            &.is-style-outline {
                .wp-block-button__link.wp-element-button {
                    background-color: transparent;
                    border: 1px solid var(--theme-color-primary) !important;
                    color: var(--theme-color-primary) !important;

                    &.has-white-color {
                        border: 1px solid var(--wp--preset--color--white);

                        &:hover {
                            background-color: var(--wp--preset--color--transparent);
                            border: 1px solid var(--theme-color-secondary);
                            color: var(--theme-color-secondary);
                        }
                    }

                    &:hover {
                        background-color: var(--theme-color-secondary) !important;
                        border: 1px solid var(--theme-color-secondary) !important;
                        color: var(--wp--preset--color--white) !important;
                    }
                }
            }
        }
    }

    /* List styles */
    ul.wp-block-list > li::before {
        filter: brightness(0) saturate(100%) invert(51%) sepia(23%) saturate(583%) hue-rotate(330deg) brightness(89%) contrast(87%);
    }

    /* ACF Basic Slider */
    .wp-block-acf-slider .wp-block-slider-buttons {
        .wp-block-slider-button:focus,
        .wp-block-slider-button:hover {
            background-color: var(--theme-color-secondary);
        }
    }

    /* Splide Carousel */
    .wp-block-splide-carousel,
    .slider-wrapper {
        & .splide__arrow {
            background-color: var(--theme-color-secondary);
        }

        & .splide__arrows .splide__arrow {
            background-color: var(--theme-color-secondary);
            box-shadow: var(--theme-color-primary);
        }

        & .splide__pagination {
            .splide__pagination__page {
                &.is-active,
                &:hover {
                    background-color: var(--theme-color-secondary);
                }
            }
        }
    }

    .wp-block-splide-carousel .splide__pagination {
        button.splide__pagination__page {
            background-color: var(--wp--preset--color--secondary);
        }
    }
}