/**
 * Button icon styles
 *
 * Icons use CSS ::before/::after with mask and currentColor.
 * Parent must have has-icon-{name} and has-icon-before or has-icon-after.
 */

/* Base pseudo-element styles */
.has-icon-before .wp-block-button__link::before,
.has-icon-after .wp-block-button__link::after {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	vertical-align: middle;
}

.has-icon-before .wp-block-button__link::before {
	margin-inline-end: 8px;
}

.has-icon-after .wp-block-button__link::after {
	margin-inline-start: 8px;
}

/* Reduce right padding when icon is present (Figma: 28px vs 32px default) */
.has-icon-before .wp-block-button__link,
.has-icon-after .wp-block-button__link {
	padding-right: 28px;
}

/* Arrow left - 13.333px to match Figma icon size inside 20px wrapper */
.has-icon-arrow-left.has-icon-before .wp-block-button__link::before,
.has-icon-arrow-left.has-icon-after .wp-block-button__link::after {
	-webkit-mask-size: 13.333px 13.333px;
	mask-size: 13.333px 13.333px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 16L9.41 14.59L3.83 9L16 9V7L3.83 7L9.41 1.41L8 0L0 8L8 16Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 16L9.41 14.59L3.83 9L16 9V7L3.83 7L9.41 1.41L8 0L0 8L8 16Z' fill='black'/%3E%3C/svg%3E");
}

/*
 * Arrow right - 13.333px to match Figma icon size inside 20px wrapper.
 * .sshl-icon--arrow-right uses the same mask (reuse outside core/button).
 */
.has-icon-arrow-right.has-icon-before .wp-block-button__link::before,
.has-icon-arrow-right.has-icon-after .wp-block-button__link::after,
.sshl-icon.sshl-icon--arrow-right {
	-webkit-mask-size: 13.333px 13.333px;
	mask-size: 13.333px 13.333px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 0L6.59 1.41L12.17 7H0V9H12.17L6.59 14.59L8 16L16 8L8 0Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 0L6.59 1.41L12.17 7H0V9H12.17L6.59 14.59L8 16L16 8L8 0Z' fill='black'/%3E%3C/svg%3E");
}

.sshl-icon.sshl-icon--arrow-right {
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	flex-shrink: 0;
	vertical-align: middle;
}

/* External link */
.has-icon-external-link.has-icon-before .wp-block-button__link::before,
.has-icon-external-link.has-icon-after .wp-block-button__link::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
}

/* Download */
.has-icon-download.has-icon-before .wp-block-button__link::before,
.has-icon-download.has-icon-after .wp-block-button__link::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19 9H15V3H9V9H5L12 16L19 9ZM5 18V20H19V18H5Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19 9H15V3H9V9H5L12 16L19 9ZM5 18V20H19V18H5Z' fill='black'/%3E%3C/svg%3E");
}

/* Envelope */
.has-icon-envelope.has-icon-before .wp-block-button__link::before,
.has-icon-envelope.has-icon-after .wp-block-button__link::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/%3E%3Cpolyline points='22 6 12 13 2 6'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/%3E%3Cpolyline points='22 6 12 13 2 6'/%3E%3C/svg%3E");
}

/* Chevron left - 13.333px to match Figma icon size inside 20px wrapper */
.has-icon-chevron-left.has-icon-before .wp-block-button__link::before,
.has-icon-chevron-left.has-icon-after .wp-block-button__link::after {
	-webkit-mask-size: 13.333px 13.333px;
	mask-size: 13.333px 13.333px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15.41 16.59L10.83 12L15.41 7.41L14 6L8 12L14 18L15.41 16.59Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M15.41 16.59L10.83 12L15.41 7.41L14 6L8 12L14 18L15.41 16.59Z' fill='black'/%3E%3C/svg%3E");
}

/* Chevron right - 13.333px to match Figma icon size inside 20px wrapper */
.has-icon-chevron-right.has-icon-before .wp-block-button__link::before,
.has-icon-chevron-right.has-icon-after .wp-block-button__link::after {
	-webkit-mask-size: 13.333px 13.333px;
	mask-size: 13.333px 13.333px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8.59 16.59L13.17 12L8.59 7.41L10 6L16 12L10 18L8.59 16.59Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8.59 16.59L13.17 12L8.59 7.41L10 6L16 12L10 18L8.59 16.59Z' fill='black'/%3E%3C/svg%3E");
}

/* Unlock */
.has-icon-unlock.has-icon-before .wp-block-button__link::before,
.has-icon-unlock.has-icon-after .wp-block-button__link::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 18' fill='none'%3E%3Cpath d='M7.875 2.25C6.29297 2.25 5.0625 3.51562 5.0625 5.0625V6.75H13.5C14.7305 6.75 15.75 7.76953 15.75 9V15.75C15.75 17.0156 14.7305 18 13.5 18H2.25C0.984375 18 0 17.0156 0 15.75V9C0 7.76953 0.984375 6.75 2.25 6.75H2.8125V5.0625C2.8125 2.28516 5.0625 0 7.875 0C9.87891 0 11.6367 1.19531 12.4453 2.91797C12.6914 3.48047 12.4453 4.14844 11.8828 4.39453C11.3203 4.67578 10.6523 4.42969 10.4062 3.86719C9.94922 2.91797 8.96484 2.25 7.875 2.25ZM9 13.5C9.59766 13.5 10.125 13.0078 10.125 12.375C10.125 11.7773 9.59766 11.25 9 11.25H6.75C6.11719 11.25 5.625 11.7773 5.625 12.375C5.625 13.0078 6.11719 13.5 6.75 13.5H9Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 18' fill='none'%3E%3Cpath d='M7.875 2.25C6.29297 2.25 5.0625 3.51562 5.0625 5.0625V6.75H13.5C14.7305 6.75 15.75 7.76953 15.75 9V15.75C15.75 17.0156 14.7305 18 13.5 18H2.25C0.984375 18 0 17.0156 0 15.75V9C0 7.76953 0.984375 6.75 2.25 6.75H2.8125V5.0625C2.8125 2.28516 5.0625 0 7.875 0C9.87891 0 11.6367 1.19531 12.4453 2.91797C12.6914 3.48047 12.4453 4.14844 11.8828 4.39453C11.3203 4.67578 10.6523 4.42969 10.4062 3.86719C9.94922 2.91797 8.96484 2.25 7.875 2.25ZM9 13.5C9.59766 13.5 10.125 13.0078 10.125 12.375C10.125 11.7773 9.59766 11.25 9 11.25H6.75C6.11719 11.25 5.625 11.7773 5.625 12.375C5.625 13.0078 6.11719 13.5 6.75 13.5H9Z' fill='black'/%3E%3C/svg%3E");
	-webkit-mask-size: 15.75px 18px;
	mask-size: 15.75px 18px;
}

/* Gem */
.has-icon-gem.has-icon-before .wp-block-button__link::before,
.has-icon-gem.has-icon-after .wp-block-button__link::after {
	-webkit-mask-size: 18px 15.75px;
	mask-size: 18px 15.75px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 16' fill='none'%3E%3Cpath d='M13.2891 0L9 5.30859L4.67578 0H13.2891ZM18 5.625H10.1602L14.2031 0.667969L18 5.625ZM3.76172 0.667969L7.80469 5.625H0L3.76172 0.667969ZM8.57812 15.5742L0.0351562 6.75H17.9297L9.38672 15.5742C9.28125 15.7148 9.14062 15.75 9 15.75C8.82422 15.75 8.68359 15.7148 8.57812 15.5742Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 16' fill='none'%3E%3Cpath d='M13.2891 0L9 5.30859L4.67578 0H13.2891ZM18 5.625H10.1602L14.2031 0.667969L18 5.625ZM3.76172 0.667969L7.80469 5.625H0L3.76172 0.667969ZM8.57812 15.5742L0.0351562 6.75H17.9297L9.38672 15.5742C9.28125 15.7148 9.14062 15.75 9 15.75C8.82422 15.75 8.68359 15.7148 8.57812 15.5742Z' fill='black'/%3E%3C/svg%3E");
}

/* Eye */
.has-icon-eye.has-icon-before .wp-block-button__link::before,
.has-icon-eye.has-icon-after .wp-block-button__link::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14' fill='none'%3E%3Cpath d='M8.72656 4.03125C8.82031 4.03125 8.91406 4 9.00781 4C10.6641 4 12.0078 5.34375 12.0078 7C12.0078 8.65625 10.6641 10 9.00781 10C7.32031 10 6.00781 8.65625 6.00781 7C6.00781 6.9375 6.00781 6.84375 6.00781 6.75C6.28906 6.90625 6.63281 7 7.00781 7C8.10156 7 9.00781 6.125 9.00781 5C9.00781 4.65625 8.88281 4.3125 8.72656 4.03125ZM15.0078 2.53125C16.4766 3.875 17.4453 5.5 17.9141 6.625C18.0078 6.875 18.0078 7.15625 17.9141 7.40625C17.4453 8.5 16.4766 10.125 15.0078 11.5C13.5391 12.875 11.5078 14 9.00781 14C6.47656 14 4.44531 12.875 2.97656 11.5C1.50781 10.125 0.539062 8.5 0.0703125 7.40625C-0.0234375 7.15625 -0.0234375 6.875 0.0703125 6.625C0.539062 5.5 1.50781 3.875 2.97656 2.53125C4.44531 1.15625 6.47656 0 9.00781 0C11.5078 0 13.5391 1.15625 15.0078 2.53125ZM9.00781 2.5C6.50781 2.5 4.50781 4.53125 4.50781 7C4.50781 9.5 6.50781 11.5 9.00781 11.5C11.4766 11.5 13.5078 9.5 13.5078 7C13.5078 4.53125 11.4766 2.5 9.00781 2.5Z' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14' fill='none'%3E%3Cpath d='M8.72656 4.03125C8.82031 4.03125 8.91406 4 9.00781 4C10.6641 4 12.0078 5.34375 12.0078 7C12.0078 8.65625 10.6641 10 9.00781 10C7.32031 10 6.00781 8.65625 6.00781 7C6.00781 6.9375 6.00781 6.84375 6.00781 6.75C6.28906 6.90625 6.63281 7 7.00781 7C8.10156 7 9.00781 6.125 9.00781 5C9.00781 4.65625 8.88281 4.3125 8.72656 4.03125ZM15.0078 2.53125C16.4766 3.875 17.4453 5.5 17.9141 6.625C18.0078 6.875 18.0078 7.15625 17.9141 7.40625C17.4453 8.5 16.4766 10.125 15.0078 11.5C13.5391 12.875 11.5078 14 9.00781 14C6.47656 14 4.44531 12.875 2.97656 11.5C1.50781 10.125 0.539062 8.5 0.0703125 7.40625C-0.0234375 7.15625 -0.0234375 6.875 0.0703125 6.625C0.539062 5.5 1.50781 3.875 2.97656 2.53125C4.44531 1.15625 6.47656 0 9.00781 0C11.5078 0 13.5391 1.15625 15.0078 2.53125ZM9.00781 2.5C6.50781 2.5 4.50781 4.53125 4.50781 7C4.50781 9.5 6.50781 11.5 9.00781 11.5C11.4766 11.5 13.5078 9.5 13.5078 7C13.5078 4.53125 11.4766 2.5 9.00781 2.5Z' fill='black'/%3E%3C/svg%3E");
}