#page .wp-block-wpcomsp-donations-form[data-layout="extended"] .print-mag-donation-form-wrapper .wp-block-wpcomsp-donations-form__submit-button.wp-element-button.button.is-submitting,
.wc-block-components-checkout-place-order-button.is-submitting {
	position: relative;
	color: rgba(255, 255, 255, 0.5) !important;
	pointer-events: none;
	cursor: progress;
}

.wp-block-wpcomsp-donations-form__submit-button.wp-element-button.button.is-submitting::after,
.wc-block-components-checkout-place-order-button.is-submitting::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 22px !important;
	height: 22px !important;
	margin: -11px 0 0 -11px;
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-top-color: var(--color-white);
	border-radius: 50%;
	animation: pm-donation-spin 0.6s linear infinite;
}

.wp-block-wpcomsp-donations-form__submit-button.wp-element-button.button.is-submitting::after {
	top: 33%;
}

@keyframes pm-donation-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-wpcomsp-donations-form__submit-button.is-submitting::after,
	.wc-block-components-checkout-place-order-button.is-submitting::after {
		animation-duration: 1.5s;
	}
}

/*--------------------------------------------------------------
  ## Custom updates for Donation
--------------------------------------------------------------*/

/* Single Donation Pages */
.single.single-product .woocommerce-breadcrumb {
	display: none;
}
.woocommerce #content div.product div.summary, 
.woocommerce div.product div.summary, 
.woocommerce-page #content div.product div.summary, 
.woocommerce-page div.product div.summary {
	float: none;
	margin: 2rem auto 0;
}

/* Recurring Donation */
body.single-product #page #woocommerce-wrapper div.product form.cart .variations select {
	margin-right: 0.5rem;
    background: none;
}
body.single-product #page #woocommerce-wrapper div.product form.cart {
	flex-direction: column;
    align-items: flex-start;
}
body.single-product #page #woocommerce-wrapper div.product form.cart .reset_variations {
	font-family: var(--font-sans);
	font-size: 0.8rem;
}

/* Checkout Page Updates */
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image {
	display: none;
}

/* Cart Page */
.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	padding: 0.75rem 0;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	font-size: 1.5rem;
}

/**
 * Text needs to be replaced, due to a bug on WooCommerce.
 * See: https://github.com/woocommerce/woocommerce/pull/65658
 * Once this issue is fixed, the `font-size:0` and :after content can be removed.
 */
.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button--plus[class] {
	font-size: 0;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button--plus::after {
	content: "+";
	font-size: 1.5rem;
	display: block;
}

/* My Account */
body[class*="woocommerce"] .entry-content > .woocommerce {
	margin-left: 0;
	margin-right: 0;
}
.woocommerce-account .entry-content .woocommerce > h2, 
body[class*="woocommerce"] #page div[class*="woocommerce"] h2 {
    font-size: 2rem;
    font-weight: 500;
}

.woocommerce-account table.shop_table.subscription_details .button {
    font-size: 0.75rem !important;
    padding: 0.8rem 1.5rem !important;
}

body.woocommerce-downloads.woocommerce-page #page .site-content .entry-content .woocommerce-info a.button {
	display: none !important;
}

body.woocommerce-downloads.woocommerce-page .woocommerce-info::before {
    top: 1.25rem;
}

body[class*="woocommerce"] #page #add_payment_method #payment div.payment_box::before {
	display: none;
}
body[class*="woocommerce"] #page #add_payment_method #payment ul.payment_methods {
	border: 0;
}

@media screen and (min-width: 950px) {
	body.woocommerce-page #page .woocommerce-MyAccount-content {
		width: 77%;	
	}
	body.woocommerce-account.woocommerce-page .entry-header,
	body.woocommerce-account.woocommerce-page .entry-content {
		display: block;
		max-width: 59rem;
		width: 100%;
	}
	body.woocommerce-account.woocommerce-page .entry-content {
		margin-left: 0;
		margin-right: 0;
		justify-self: center;
	}
	body.woocommerce-account.woocommerce-page .entry-content #woocommerce-my-account-wrapper {
		max-width: none;
	}
}

