/* ==========================================================================
   Button Icons
   ========================================================================== */

:root {
    --batao-icon-size: 16px;
    --batao-icon-gap: 0.5em;
}

/* Base icon styles */
.wp-block-button[class*='icon-'] .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--batao-icon-gap);
}

.wp-block-button[class*='icon-'] .wp-block-button__link::after {
    content: '';
    flex-shrink: 0;
    width: var(--batao-icon-size);
    height: var(--batao-icon-size);
    background-color: currentColor;
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
}

/* Icon position: left */
.wp-block-button.icon-left[class*='icon-'] .wp-block-button__link {
    flex-direction: row-reverse;
}

/* Icon definitions */
.wp-block-button.icon-arrow-right .wp-block-button__link::after {
    mask-image: url('../icons/arrow-right-sharp-solid-full.svg');
}

.wp-block-button.icon-arrow-left .wp-block-button__link::after {
    mask-image: url('../icons/arrow-left-sharp-solid-full.svg');
}

.wp-block-button.icon-check .wp-block-button__link::after {
    mask-image: url('../icons/check-solid-full.svg');
}

.wp-block-button.icon-chevron-down .wp-block-button__link::after {
    mask-image: url('../icons/chevron-down-regular-full.svg');
}

.wp-block-button.icon-chevron-up .wp-block-button__link::after {
    mask-image: url('../icons/chevron-up-regular-full.svg');
}

.wp-block-button.icon-facebook .wp-block-button__link::after {
    mask-image: url('../icons/facebook-f-brands-solid-full.svg');
}

.wp-block-button.icon-instagram .wp-block-button__link::after {
    mask-image: url('../icons/instagram-brands-solid-full.svg');
}

.wp-block-button.icon-linkedin .wp-block-button__link::after {
    mask-image: url('../icons/linkedin-in-brands-solid-full.svg');
}
