.wp-block-yoast-faq-block {
    display: flex;
    flex-direction: column;
    gap: var(--wp--preset--spacing--20);
}

.wp-block-yoast-faq-block .schema-faq-section {
    padding: 0;
    border: none;
    border-bottom: 1px solid color-mix(in srgb, currentColor, transparent 85%);
}

.wp-block-yoast-faq-block .schema-faq-question {
    padding: var(--wp--preset--spacing--30) 0;
    gap: var(--wp--preset--spacing--20);
    display: block;
    width: 100%;
    cursor: pointer;

    &::after {
        content: "";
        display: inline-block;
        width: 20px;
        height: 20px;
        background-color: var(--wp--preset--color--accent-variant);
        -webkit-mask: var(--wp--custom--icon--icomoon--plus) center / contain no-repeat;
        mask: var(--wp--custom--icon--icomoon--plus) center / contain no-repeat;
        float: right;
        transition: transform 0.3s ease;
    }
}

.wp-block-yoast-faq-block .schema-faq-section--open .schema-faq-question::after,
.wp-block-yoast-faq-block.is-selected .schema-faq-question::after {
    transform: rotate(45deg);
}

.wp-block-yoast-faq-block .schema-faq-answer {
    margin: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    padding: 0;
}

.wp-block-yoast-faq-block .schema-faq-section--open .schema-faq-answer,
.wp-block-yoast-faq-block.is-selected .schema-faq-answer {
    max-height: 9999px;
    padding-bottom: var(--wp--preset--spacing--30);
}

/* Exceptions for steps block style */

.wp-block-yoast-faq-block.is-style-steps {
    counter-reset: faq-steps;
}

.wp-block-yoast-faq-block.is-style-steps .schema-faq-question::before {
    counter-increment: faq-steps;
    content: counter(faq-steps) ".";
    margin-right: var(--wp--preset--spacing--20);
}

/* Exceptions for use in section styles */