/* wg-cart.css · Cart page — site-wide, rules scoped to the cart's own classes. Site-wide for the same Barba reason as
   wg-products. Markup: Zeyna's woocommerce/cart/cart.php plus this theme's cart-totals.php, cart-empty.php and
   proceed-to-checkout-button.php, and the .wg-cart-head heading from functions.php.
   Same look as the login page (wg-account.css): Quanta heading, Sandstone summary card, underline input, pill button
   with a round icon that turns orange on hover; Zeyna's dark mode (body.layout--switched) gets Gold accents.
   Zeyna's cart CSS (woo-styles.css) has no phone layout, so the columns stack here below 1025px, and its totals rules
   use six-class selectors (and !important on the coupon button), hence the long selectors below. 2026-10-26 */

.wg-cart-head,
.wg-cart-empty,
.zeyna--cart--section {
	--wgc-accent: #FC4521;
	--wgc-hover: var(--wg-header-orange, #FC3D19);
	--wgc-on-accent: #FFFFFF;
	--wgc-ink: #191919;
	--wgc-body: #3A3A3A;
	--wgc-muted: #6E645F;
	--wgc-card: #E8DFD0;
	--wgc-thumb: #E8DFD0;
	--wgc-line: rgba(25, 25, 25, .14);
	--wgc-line-strong: rgba(25, 25, 25, .4);
	--wgc-btn: #191919;
	--wgc-btn-ink: #FFFFFF;
	--wgc-btn-hover: var(--wg-header-orange, #FC3D19);
	--wgc-btn-hover-ink: #FFFFFF;
	--wgc-icon: #FC4521;
	--wgc-icon-ink: #FFFFFF;
	--wgc-icon-hover: #FFFFFF;
	--wgc-icon-hover-ink: var(--wg-header-orange, #FC3D19);
	--wgc-glow: rgba(252, 61, 25, .28);
}

body.layout--switched .wg-cart-head,
body.layout--switched .wg-cart-empty,
body.layout--switched .zeyna--cart--section {
	--wgc-accent: #F1C36D;
	--wgc-hover: #F1C36D;
	--wgc-on-accent: #191919;
	--wgc-ink: #F1F1F1;
	--wgc-body: rgba(241, 241, 241, .72);
	--wgc-muted: #B5A898;
	--wgc-card: #191919;
	--wgc-thumb: #191919;
	--wgc-line: rgba(241, 241, 241, .14);
	--wgc-line-strong: rgba(241, 241, 241, .4);
	--wgc-btn: #F1C36D;
	--wgc-btn-ink: #191919;
	--wgc-btn-hover: #FFF0D9;
	--wgc-btn-hover-ink: #191919;
	--wgc-icon: #191919;
	--wgc-icon-ink: #F1C36D;
	--wgc-icon-hover: #191919;
	--wgc-icon-hover-ink: #F1C36D;
	--wgc-glow: rgba(241, 195, 109, .22);
}

/* ── Heading (cart with items: .wg-cart-head; empty cart: .wg-cart-empty) ── */
.wg-cart-head {
	max-width: 1180px;
	margin: 0 auto;
	padding: clamp(32px, 6vh, 72px) 0 clamp(28px, 4vh, 48px);
	font-family: 'DM Sans', sans-serif;
	color: var(--wgc-ink);
}

.wg-cart-head .wg-cart__eyebrow,
.wg-cart-empty .wg-cart__eyebrow {
	margin: 0 0 16px;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wgc-muted);
}

.wg-cart-head h1.wg-cart__title,
.wg-cart-empty h1.wg-cart__title {
	margin: 0 0 16px;
	font-family: 'QuantaGroteskPro-Medium-BF6459a54ca605a', 'DM Sans', sans-serif;
	font-size: clamp(36px, 4vw, 56px);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: .02em;
	text-transform: none;
	color: var(--wgc-ink);
}

.wg-cart-head h1.wg-cart__title span,
.wg-cart-empty h1.wg-cart__title span { color: var(--wgc-accent); }

.wg-cart-head .wg-cart__lede,
.wg-cart-empty .wg-cart__lede {
	margin: 0;
	font-size: 18px;
	line-height: 1.5;
	color: var(--wgc-body);
}

/* ── Layout: items left, summary card right; stacked below 1025px ── */
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
	align-items: start;
	gap: clamp(32px, 5vw, 72px);
	max-width: 1180px;
	margin: 0 auto clamp(64px, 10vh, 120px);
	padding: 0;
	font-family: 'DM Sans', sans-serif;
	color: var(--wgc-ink);
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper > .form--col,
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper > .cart--totals--col {
	width: auto;
	min-width: 0;
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper > .cart--totals--col {
	position: sticky;
	top: 110px;
}

/* ── Items ── */
.zeyna--cart--section .woocommerce-cart-form .woocommerce-cart-form__contents {
	display: block;
	border-top: 1px solid var(--wgc-line);
}

.zeyna--cart--section .woocommerce-cart-form__contents .woocommerce-cart-form__cart-item.cart_item {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr) auto;
	grid-template-areas: "thumb name sub";
	align-items: stretch;
	gap: 24px;
	padding: 24px 0;
	border-bottom: 1px solid var(--wgc-line);
	border-radius: 0;
	background: none;
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-thumbnail {
	grid-area: thumb;
	width: 120px;
	height: 120px;
	overflow: hidden;
	border-radius: 10px;
	background: var(--wgc-thumb);
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-thumbnail > a,
.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-thumbnail img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-name {
	grid-area: name;
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: auto;
	min-width: 0;
	padding: 0;
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-name h6 {
	margin: 0;
	font-family: 'DM Sans', sans-serif;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.35;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wgc-ink);
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-name h6 a {
	color: inherit;
	text-decoration: none;
	transition: color .25s ease;
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-name h6 a:hover { color: var(--wgc-hover); }

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-name p.cart--item--price {
	margin: auto 0 0;
	font-size: 14px;
	color: var(--wgc-muted);
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-subtotal {
	grid-area: sub;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
	width: auto;
	padding: 0;
	text-align: right;
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-subtotal > .woocommerce-Price-amount.amount {
	font-size: 18px;
	font-weight: 500;
	color: var(--wgc-ink);
}

.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-subtotal .wg-usd-ref {
	font-size: 13px;
	opacity: 1;
	color: var(--wgc-muted);
}

/* Quantity: Zeyna's stepper always prints; hide it when WooCommerce made the quantity a hidden field
   (products sold one per order, such as PowerTranz). */
.zeyna--cart--section .product-subtotal:has(.quantity input[type="hidden"]) .zeyna--quantity--control { display: none; }

.zeyna--cart--section .zeyna--quantity--control > span:not(.current--quantity) {
	border-color: var(--wgc-line-strong);
	border-radius: 50px;
	transition: border-color .25s ease, background-color .25s ease;
}

.zeyna--cart--section .zeyna--quantity--control > span:not(.current--quantity):hover { border-color: var(--wgc-hover); }
.zeyna--cart--section .zeyna--quantity--control > span > svg { fill: var(--wgc-ink); }

/* Remove: a round icon button (WooCommerce paints a.remove red with !important) */
.zeyna--cart--section .product-subtotal .product-remove { margin: auto 0 0 auto; }

.zeyna--cart--section .product-subtotal .product-remove a.remove {
	--radius: 50%;
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: transparent !important;
	box-shadow: inset 0 0 0 1px var(--wgc-line);
	color: var(--wgc-ink) !important;
	transition: background-color .25s ease, box-shadow .25s ease;
}

.zeyna--cart--section .product-subtotal .product-remove a.remove svg {
	width: 18px;
	height: 18px;
	fill: var(--wgc-ink);
	transition: fill .25s ease;
}

.zeyna--cart--section .product-subtotal .product-remove a.remove:hover,
.zeyna--cart--section .product-subtotal .product-remove a.remove:focus-visible {
	background: var(--wgc-hover) !important;
	box-shadow: none;
}

.zeyna--cart--section .product-subtotal .product-remove a.remove:hover svg,
.zeyna--cart--section .product-subtotal .product-remove a.remove:focus-visible svg { fill: var(--wgc-on-accent); }

/* ── Order summary card ── */
/* pe-core's .pe--styled--object sets border-radius: var(--radius) !important (0 here), so the radius goes through --radius */
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals {
	--radius: 10px;
	padding: clamp(24px, 3vw, 36px);
	border-radius: 10px;
	background: var(--wgc-card);
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary > div {
	padding-left: 0;
	padding-right: 0;
}

.zeyna--cart--section .cart_totals h2.wg-cart-summary-title {
	margin: 0 0 20px;
	font-family: 'DM Sans', sans-serif;
	font-size: 22px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
	color: var(--wgc-ink);
}

/* Coupon: underline input + small outline pill (Zeyna sets the button with !important) */
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary > div.zeyna--coupon--register { margin: 0 0 12px; }

.zeyna--cart--section .cart_totals .zeyna--coupon {
	align-items: center;
	gap: 12px;
	border: 0;
	border-bottom: 1px solid var(--wgc-line-strong);
	white-space: normal;
}

.zeyna--cart--section .cart_totals .zeyna--coupon:has(input:focus) { border-color: var(--wgc-accent) !important; }

.zeyna--cart--section .cart_totals .zeyna--coupon input.input-text {
	flex: 1;
	min-width: 0;
	padding: 10px 0 12px;
	border: 0;
	background: transparent;
	box-shadow: none;
	outline: none;
	font-family: 'DM Sans', sans-serif;
	font-size: 16px;
	color: var(--wgc-ink);
}

.zeyna--cart--section .cart_totals .zeyna--coupon input.input-text::placeholder { color: var(--wgc-muted); opacity: 1; }

.zeyna--cart--section .cart_totals .zeyna--coupon button.button {
	flex: none;
	padding: 8px 16px !important;
	border: 1px solid var(--wgc-line-strong);
	border-radius: 50px !important;
	background: transparent !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 1;
	text-transform: none !important;
	color: var(--wgc-ink) !important;
	transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}

.zeyna--cart--section .cart_totals .zeyna--coupon button.button:hover,
.zeyna--cart--section .cart_totals .zeyna--coupon button.button:focus-visible {
	border-color: var(--wgc-hover);
	background: var(--wgc-hover) !important;
	color: var(--wgc-on-accent) !important;
}

/* Rows */
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid var(--wgc-line);
	font-size: 15px;
	font-weight: 400;
	line-height: 1.4;
	text-transform: none;
	color: var(--wgc-ink);
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row.zeyna--coupon--register {
	display: block;
	padding: 0;
	border-bottom: 0;
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row .cart-label { color: var(--wgc-body); }
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row .cart-value { text-align: right; }

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row.order-total {
	align-items: flex-start;
	padding: 16px 0;
	border-top: 0;
	border-bottom: 1px solid var(--wgc-line-strong);
	font-size: 16px;
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row.order-total .cart-label {
	font-weight: 500;
	color: var(--wgc-ink);
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .cart-summary div.cart-row.order-total .cart-value strong {
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
}

.zeyna--cart--section .cart_totals .cart-row.order-total .cart-value br { display: none; }

.zeyna--cart--section .cart_totals .cart-row.order-total .wg-ttd-note {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	line-height: 1.4;
	opacity: 1;
	color: var(--wgc-muted);
}

/* Recurring totals (WooCommerce Subscriptions' table rows, wrapped in table.wg-cart-rows by cart-totals.php) */
.zeyna--cart--section .cart_totals table.wg-cart-rows {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	background: none;
	font-size: 14px;
	line-height: 1.4;
}

.zeyna--cart--section .cart_totals table.wg-cart-rows th,
.zeyna--cart--section .cart_totals table.wg-cart-rows td {
	width: auto;
	padding: 10px 0;
	border: 0;
	border-bottom: 1px solid var(--wgc-line);
	background: none;
	font-weight: 400;
	vertical-align: top;
	color: var(--wgc-ink);
}

.zeyna--cart--section .cart_totals table.wg-cart-rows th {
	text-align: left;
	color: var(--wgc-body);
}

.zeyna--cart--section .cart_totals table.wg-cart-rows td { text-align: right; }

.zeyna--cart--section .cart_totals table.wg-cart-rows tr.recurring-totals th {
	padding: 20px 0 6px;
	border-bottom: 0;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--wgc-muted);
}

.zeyna--cart--section .cart_totals table.wg-cart-rows .first-payment-date {
	padding: 0;
	margin-top: 4px;
}

.zeyna--cart--section .cart_totals table.wg-cart-rows .first-payment-date small {
	font-size: 12px;
	color: var(--wgc-muted);
}

/* ── Buttons: proceed to checkout (full width in the card) and the empty cart's browse button ── */
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .wc-proceed-to-checkout {
	margin: 24px 0 0;
	padding: 0;
}

.wg-cart-empty a.wg-cart__button,
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .wc-proceed-to-checkout a.wg-cart__button {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	width: auto;
	min-height: 52px;
	margin: 0;
	padding: 5px 28px 5px 5px;
	border: 0;
	border-radius: 50px;
	background: var(--wgc-btn);
	font-family: 'DM Sans', sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	color: var(--wgc-btn-ink);
	transition: background-color .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}

.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .wc-proceed-to-checkout a.wg-cart__button {
	display: flex;
	justify-content: center;
	width: 100%;
	padding: 5px 56px;
}

.zeyna--cart--section .wc-proceed-to-checkout a.wg-cart__button .wg-cart__button-icon {
	position: absolute;
	top: 5px;
	left: 5px;
}

.wg-cart__button .wg-cart__button-icon {
	display: grid;
	place-items: center;
	flex: none;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--wgc-icon);
	transition: background-color .3s ease;
}

.wg-cart__button .wg-cart__button-icon svg {
	width: 20px;
	height: 20px;
	fill: var(--wgc-icon-ink);
	transition: fill .3s ease, transform .3s ease;
}

.wg-cart-empty a.wg-cart__button:hover,
.wg-cart-empty a.wg-cart__button:focus-visible,
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .wc-proceed-to-checkout a.wg-cart__button:hover,
.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .wc-proceed-to-checkout a.wg-cart__button:focus-visible {
	background: var(--wgc-btn-hover);
	box-shadow: 0 6px 16px var(--wgc-glow);
	color: var(--wgc-btn-hover-ink);
	transform: translateY(-2px);
}

.wg-cart__button:hover .wg-cart__button-icon,
.wg-cart__button:focus-visible .wg-cart__button-icon { background: var(--wgc-icon-hover); }

.wg-cart__button:hover .wg-cart__button-icon svg,
.wg-cart__button:focus-visible .wg-cart__button-icon svg {
	fill: var(--wgc-icon-hover-ink);
	transform: translateX(2px);
}

.wg-cart__button:focus-visible {
	outline: 2px solid var(--wgc-accent);
	outline-offset: 3px;
}

/* ── Empty cart ── */
.wg-cart-empty {
	max-width: 640px;
	margin: 0 auto;
	padding: clamp(48px, 12vh, 140px) 0 clamp(80px, 14vh, 160px);
	font-family: 'DM Sans', sans-serif;
	text-align: center;
	color: var(--wgc-ink);
}

.wg-cart-empty .wg-cart__lede {
	max-width: 44ch;
	margin: 0 auto 32px;
	text-wrap: balance;
}

/* ── Narrower screens ── */
@media (max-width: 1024px) {
	.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper { grid-template-columns: minmax(0, 1fr); }

	.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper > .cart--totals--col { position: static; }
}

@media (max-width: 600px) {
	.zeyna--cart--section .woocommerce-cart-form__contents .woocommerce-cart-form__cart-item.cart_item {
		grid-template-columns: 72px minmax(0, 1fr);
		grid-template-areas: "thumb name" "thumb sub";
		gap: 12px 16px;
		padding: 20px 0;
	}

	.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-thumbnail {
		width: 72px;
		height: 72px;
	}

	.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-name h6 { font-size: 16px; }

	.zeyna--cart--section .woocommerce-cart-form__cart-item.cart_item .product-subtotal {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-start;
		gap: 6px 12px;
		text-align: left;
	}

	.zeyna--cart--section .product-subtotal .product-remove { margin: 0 0 0 auto; }

	.zeyna--cart--section .pe-wrapper.zeyna--cart--wrapper .cart_totals .wc-proceed-to-checkout a.wg-cart__button {
		padding: 5px 16px 5px 56px;
		white-space: nowrap;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wg-cart-empty *,
	.zeyna--cart--section * { transition: none !important; }

	.wg-cart__button:hover { transform: none !important; }
}