button {
	-webkit-transition: var(--transition);
	transition: var(--transition);
	cursor: pointer;
}

/* Button default style */
.btn{
	font-size: 13px;
	text-transform: uppercase;
	padding: 8px 16px;
	min-height: 40px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
	text-align: center;
	border-radius: 0;
	-webkit-transition: var(--transition);
	transition: var(--transition);
	cursor: pointer;
}

/* Button primary — for primary elements to click */
.btn,
.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
	color: #ffffff;
    background-color: var(--color-pink);
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.8rem;
    font-weight: 600;
    border-radius: 0;
	transition: var(--transition);
	cursor: pointer;
}

.btn:hover,
.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background-color: var(--color-primary);
	color: #FFF;
}

.woocommerce div.product form.cart .button.loading,
.woocommerce div.product form.cart .button.added,
.woocommerce a.button.added{
	padding-right: 10px;
}

.woocommerce div.product form.cart .button span{
	width: 195px;
    max-width: 100%;
}

.woocommerce #respond input#submit.alt.disabled,
.woocommerce #respond input#submit.alt.disabled:hover,
.woocommerce #respond input#submit.alt:disabled,
.woocommerce #respond input#submit.alt:disabled:hover,
.woocommerce #respond input#submit.alt:disabled[disabled],
.woocommerce #respond input#submit.alt:disabled[disabled]:hover,
.woocommerce a.button.alt.disabled,
.woocommerce a.button.alt.disabled:hover,
.woocommerce a.button.alt:disabled,
.woocommerce a.button.alt:disabled:hover,
.woocommerce a.button.alt:disabled[disabled],
.woocommerce a.button.alt:disabled[disabled]:hover,
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt.disabled:hover,
.woocommerce button.button.alt:disabled,
.woocommerce button.button.alt:disabled:hover,
.woocommerce button.button.alt:disabled[disabled],
.woocommerce button.button.alt:disabled[disabled]:hover,
.woocommerce input.button.alt.disabled,
.woocommerce input.button.alt.disabled:hover,
.woocommerce input.button.alt:disabled,
.woocommerce input.button.alt:disabled:hover,
.woocommerce input.button.alt:disabled[disabled],
.woocommerce input.button.alt:disabled[disabled]:hover {
	background-color: var(--color-primary);
	color: #fff;
}

/* .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.single_add_to_cart_button.loading::after, 
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.ajax_add_to_cart.loading::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.single_add_to_cart_button.loading::after, 
:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.ajax_add_to_cart.loading::after,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.ajax_add_to_cart.add_to_cart_button.added::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.ajax_add_to_cart.add_to_cart_button.added::after,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.ajax_add_to_cart.add_to_cart_button.added::after,
:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.ajax_add_to_cart.add_to_cart_button.added::after{
	position: relative;
    top: unset;
    right: unset;
	transform: unset;
	transform-origin: center; 
	margin-left: 10px;
} */

body:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.loading::after{
	top: 13px;
    right: 7px;
}

body:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.added::after{
	position: absolute;
	top: 13px;
    right: 7px;
}

.woocommerce ul.products li.product a.added_to_cart{
	display: none;
}

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button:disabled, 
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button:disabled[disabled]{
	padding: 0.6rem 1.8rem;
}

.woocommerce #review_form #respond .form-submit input{
	border-radius: 30px;
}

/* Button outline */
a.button.button-outline{
	background-color: transparent;
    color: var(--color-primary);
    border: 2px solid var(--color-primary);
    max-width: 210px;
    border-radius: 30px;
    font-size: 0.87rem;
    font-weight: 600;
    padding-inline: 40px;
	cursor: pointer;
}

a.button.button-outline:hover{
	background-color: var(--color-primary);
	color: #fff;
}

/* Link with Arrow */
a.arrow{
	position: relative;
}

a.arrow:after{
	content: '';
	display: inline-block;
	-webkit-mask-image: url('../../icons/chevron-forward-outline.svg');
	mask-image: url('../../icons/chevron-forward-outline.svg');
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-size: contain;
	-webkit-mask-size: contain;
	background-color: currentColor;
	width: 20px;
	height: 20px;
}

/* Button secondary style — for secondary elements */
.btn--secondary{
	border: var(--border);
	border-radius: var(--border-radius);
}

/* Back button */
.btn--back{
	display: flex;
    align-items: center;
	font-family: var(--font-family-text);
	font-size: 1rem;
    font-weight: 600;
    font-style: normal;
	cursor: pointer;
}

.link--back:before,
.btn--back:before{
	content: '';
	-webkit-mask-image: url('../../icons/chevron-back-outline.svg');
	mask-image: url('../../icons/chevron-back-outline.svg');
	background-color: currentColor;
	width: 20px;
	height: 20px;
	display: inline-block;
	margin-right: 10px;
}

/* Back link */
.link--back{
	display: flex;
    align-items: center;
	cursor: pointer;
	-webkit-transition: var(--transition);
	transition: var(--transition);

}
.link--back:hover{
	color: var(--color-primary);
}

.wp-block-button__link{
    background-color: var(--color-primary);
    border-radius: 30px;
    margin-top: 15px;
    padding: 12px 32px;
    text-transform: uppercase;
    font-family: var(--font-family-headline);
    font-size: 0.8rem;
    font-weight: 600;
    color: #fff;
}

.wp-block-button__link:hover{
	color: #fff;
	background-color: var(--color-text);
}

.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button:where(.is-style-outline)>.wp-block-button__link.wp-element-butto:not(.has-text-color),
.wp-block-button:where(.is-style-outline)>.wp-block-button__link:not(.has-background){
	border-color: var(--color-pink);
    color: var(--color-pink);
    text-transform: none;
    font-weight: 700;
    padding-inline: 40px;
	background-color: transparent;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button:where(.is-style-outline)>.wp-block-button__link.wp-element-butto:not(.has-text-color):hover,
.wp-block-button:where(.is-style-outline)>.wp-block-button__link:not(.has-background):hover{
	background-color: var(--color-pink);
	color: #fff;
}


@media screen and (max-width: 480px){
	.woocommerce div.product form.cart .button,
	.woocommerce div.product form.cart .button span{
		width: 100%;
	}
	body:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.added::after,
	body:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.loading::after{
		right: 13px;
	}
}