/* =========================================================================
   Packgens — WooCommerce pages the theme does not fully re-template
   (cart, checkout, account, notices).
   ========================================================================= */

.pg-wc {
	position: relative;
}

/* Cart, checkout and account share the standard page rhythm. */
.woocommerce-cart .pg-main,
.woocommerce-checkout .pg-main,
.woocommerce-account .pg-main {
	padding-bottom: var(--pg-section-y);
}

.woocommerce-cart .pg-wc,
.woocommerce-checkout .pg-wc,
.woocommerce-account .pg-wc {
	width: 100%;
	max-width: calc(var(--pg-container) + (var(--pg-gutter) * 2));
	margin-inline: auto;
	padding-inline: var(--pg-gutter);
	padding-top: var(--pg-section-y-sm);
}

/* -------------------------------------------------------------------------
   Notices
   ------------------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pg-space-sm);
	margin: 0 0 var(--pg-space-lg);
	padding: var(--pg-space-md) var(--pg-space-lg);
	border: 0;
	border-left: 4px solid var(--pg-blue);
	border-radius: var(--pg-radius-sm);
	background: var(--pg-gray-100);
	color: var(--pg-color-text);
	font-size: var(--pg-text-sm);
	list-style: none;
}

.woocommerce-message {
	border-left-color: var(--pg-green);
}

.woocommerce-error {
	border-left-color: var(--pg-red);
	background: rgba(217, 45, 32, 0.08);
}

.woocommerce-message .button,
.woocommerce-info .button {
	margin-left: auto;
}

/* -------------------------------------------------------------------------
   Buttons WooCommerce renders itself
   ------------------------------------------------------------------------- */

.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce #respond input#submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--pg-space-xs);
	min-height: 3rem;
	padding: 0.75rem 1.75rem;
	border: 0;
	border-radius: var(--pg-radius-pill);
	background: var(--pg-blue);
	color: var(--pg-white);
	font-family: var(--pg-font-body);
	font-size: var(--pg-text-base);
	font-weight: var(--pg-weight-medium);
	line-height: 1.25;
	transition: background-color var(--pg-duration) var(--pg-ease);
}

.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce #respond input#submit:hover {
	background: var(--pg-blue-deep);
	color: var(--pg-white);
}

.woocommerce .button.alt {
	background: var(--pg-green);
}

.woocommerce .button.alt:hover {
	background: var(--pg-green-dark);
}

/* -------------------------------------------------------------------------
   Cart and checkout tables
   ------------------------------------------------------------------------- */

.woocommerce table.shop_table {
	border: 1px solid var(--pg-color-border);
	border-radius: var(--pg-radius-md);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	font-size: var(--pg-text-sm);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	padding: var(--pg-space-md);
	border-bottom: 1px solid var(--pg-color-border);
	text-align: left;
	vertical-align: middle;
}

.woocommerce table.shop_table thead th {
	background: var(--pg-gray-100);
	font-family: var(--pg-font-body);
	font-weight: var(--pg-weight-semibold);
	color: var(--pg-color-heading);
}

.woocommerce table.shop_table tbody tr:last-child td {
	border-bottom: 0;
}

.woocommerce .cart_item img {
	width: 64px;
	height: auto;
	border-radius: var(--pg-radius-xs);
}

.woocommerce .quantity input.qty {
	max-width: 5rem;
	min-height: 2.75rem;
	text-align: center;
	border-radius: var(--pg-radius-pill);
}

.woocommerce-cart-form__cart-item .product-remove a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: var(--pg-radius-circle);
	background: var(--pg-gray-150);
	color: var(--pg-ink);
	text-decoration: none;
	font-size: 1.125rem;
	line-height: 1;
}

.woocommerce-cart-form__cart-item .product-remove a.remove:hover {
	background: var(--pg-red);
	color: var(--pg-white);
}

.cart-collaterals .cart_totals,
.woocommerce-checkout-review-order {
	padding: var(--pg-space-lg);
	border-radius: var(--pg-radius-md);
	background: var(--pg-gray-100);
}

.cart-collaterals h2,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading {
	font-size: var(--pg-text-h4);
	margin-bottom: var(--pg-space-md);
}

/* -------------------------------------------------------------------------
   Checkout and account forms
   ------------------------------------------------------------------------- */

.woocommerce form .form-row {
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
	margin: 0 0 var(--pg-space-md);
	padding: 0;
}

.woocommerce form .form-row label {
	font-size: var(--pg-text-xs);
	font-weight: var(--pg-weight-medium);
	color: var(--pg-color-heading);
}

.woocommerce form .form-row .required {
	color: var(--pg-red);
	text-decoration: none;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
	min-height: 2.875rem;
	padding: 0.625rem 1.125rem;
	border: 1px solid #c3c3c3;
	border-radius: var(--pg-radius-pill);
	background: var(--pg-white);
	font-size: var(--pg-text-sm);
}

.woocommerce form .form-row textarea {
	min-height: 7rem;
	border-radius: var(--pg-radius-md);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 1.6;
	padding-left: 0;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 100%;
	right: 0.75rem;
}

.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-form-coupon {
	padding: var(--pg-space-lg);
	border: 1px solid var(--pg-color-border);
	border-radius: var(--pg-radius-md);
}

/* Account navigation ------------------------------------------------------ */

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--pg-space-2xs);
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: var(--pg-space-sm) var(--pg-space-md);
	border-radius: var(--pg-radius-sm);
	color: var(--pg-color-heading);
	font-size: var(--pg-text-sm);
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation a:hover {
	background: var(--pg-blue);
	color: var(--pg-white);
}

@media (min-width: 768px) {
	.woocommerce-account .woocommerce-MyAccount-navigation {
		float: left;
		width: 25%;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		float: right;
		width: 72%;
	}
}

/* -------------------------------------------------------------------------
   Product reviews
   ------------------------------------------------------------------------- */

.woocommerce #reviews #comments ol.commentlist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--pg-space-lg);
}

.woocommerce #reviews .comment_container {
	display: flex;
	gap: var(--pg-space-md);
	padding: var(--pg-space-lg);
	border-radius: var(--pg-radius-md);
	background: var(--pg-white);
}

.woocommerce #reviews .comment_container img.avatar {
	width: 48px;
	height: 48px;
	border-radius: var(--pg-radius-circle);
}

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
	color: var(--pg-amber);
}
