/**
 * Blocksy Extension – Button Icons
 *
 * Add one of the blocksy-icon-* classes to a Blocksy header/footer button.
 * Optionally add blocksy-icon-right to place the icon after the label.
 */

.ct-button[class*="blocksy-icon-"] {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
}

.ct-button[class*="blocksy-icon-"]::before {
	content: "";
	display: inline-block;

	position: static;
	z-index: auto;
	inset: auto;
	opacity: 1;

	width: 1.1em;
	height: 1.1em;
	flex: 0 0 1.1em;

	background: currentColor;
	border-radius: 0;
	filter: none;
	transition: none;

	transform: translateY(-2px);

	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	mask-mode: alpha;
}

.ct-button.blocksy-icon-right::before {
    order: 2;
}

.ct-button.blocksy-icon-calendar::before {
    -webkit-mask-image: url("../icons/calendar.svg");
    mask-image: url("../icons/calendar.svg");
}

.ct-button.blocksy-icon-ticket::before {
    -webkit-mask-image: url("../icons/ticket.svg");
    mask-image: url("../icons/ticket.svg");
}

.ct-button.blocksy-icon-mail::before {
    -webkit-mask-image: url("../icons/mail.svg");
    mask-image: url("../icons/mail.svg");
}

.ct-button.blocksy-icon-phone::before {
    -webkit-mask-image: url("../icons/phone.svg");
    mask-image: url("../icons/phone.svg");
}

.ct-button.blocksy-icon-user::before {
    -webkit-mask-image: url("../icons/user.svg");
    mask-image: url("../icons/user.svg");
}

.ct-button.blocksy-icon-cart::before {
    -webkit-mask-image: url("../icons/cart.svg");
    mask-image: url("../icons/cart.svg");
}

.ct-button.blocksy-icon-external-link::before {
    -webkit-mask-image: url("../icons/external-link.svg");
    mask-image: url("../icons/external-link.svg");
}

.ct-button.blocksy-icon-download::before {
    -webkit-mask-image: url("../icons/download.svg");
    mask-image: url("../icons/download.svg");
}

.ct-button.blocksy-icon-map-pin::before {
    -webkit-mask-image: url("../icons/map-pin.svg");
    mask-image: url("../icons/map-pin.svg");
}

.ct-button.blocksy-icon-arrow-right::before {
    -webkit-mask-image: url("../icons/arrow-right.svg");
    mask-image: url("../icons/arrow-right.svg");
}