/* Accordion pattern: icon + behavior */

.pattern-accordion-with-icon .wp-block-accordion-heading__toggle {
    display: flex;
    align-items: center;
    width: 100%;
}

/* Icon replacement */
.pattern-accordion-with-icon .wp-block-accordion-heading__toggle-icon {
    margin-left: auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 1em;
    height: 1em;

    text-indent: 100%;
    white-space: nowrap;
    color: transparent;

    background-image: url("icon.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

    transition: transform 0.2s ease;
}

/* Rotate icon when open */
.pattern-accordion-with-icon
.wp-block-accordion-item.is-open
> .wp-block-accordion-heading
.wp-block-accordion-heading__toggle-icon {
    transform: rotate(180deg);
}

/* Prevent underline on hover */
.pattern-accordion-with-icon
.wp-block-accordion-heading__toggle:hover
.wp-block-accordion-heading__toggle-title {
    text-decoration: none;
}

/* Add a visual cue on hover */
.wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
    color: var(--wp--preset--color--accent-2);
}