/**
 * PI Sticky Cart & Fast Checkout — cart page styling.
 *
 * Scoped to body.piscfc-cart-styled (added only when the cart styling is on).
 * Modern, comfortable look that works even on themes that don't style the cart
 * (e.g. Hello Elementor). Layout/appearance only — never touches prices,
 * totals or the update/checkout behaviour. Uses the same design tokens as the
 * checkout module for visual consistency.
 */

body.piscfc-cart-styled {
	--piscfc-c-radius: 12px;
	--piscfc-c-field-radius: 10px;
	--piscfc-c-border: #e2e2ea;
	--piscfc-c-border-strong: #c9c9d4;
	--piscfc-c-muted: #6b7280;
	--piscfc-c-panel: #ffffff;
	--piscfc-c-panel-alt: #f7f8fa;
	--piscfc-c-ink: #1f2430;
	--piscfc-c-shadow: 0 1px 2px rgba( 16, 24, 40, 0.04 ), 0 8px 24px rgba( 16, 24, 40, 0.06 );
}

/* Two-column layout on wide screens: items left, totals right (sticky). */
@media ( min-width: 900px ) {
	.piscfc-cart-styled.piscfc-cart-ready .woocommerce > .woocommerce-notices-wrapper {
		grid-column: 1 / -1;
	}
	.piscfc-cart-styled.piscfc-cart-ready form.woocommerce-cart-form {
		float: none;
		width: auto;
	}
	.piscfc-cart-styled.piscfc-cart-ready .cart-collaterals {
		float: none;
		width: auto;
	}
	.piscfc-cart-styled.piscfc-cart-ready .cart-collaterals .cart_totals {
		width: auto;
		float: none;
		position: sticky;
		top: 24px;
	}
}

/* Cart items table as a clean card. */
.piscfc-cart-styled table.shop_table.cart,
.piscfc-cart-styled .woocommerce-cart-form table.shop_table {
	border: 1px solid var( --piscfc-c-border ) !important;
	border-radius: var( --piscfc-c-radius ) !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden;
	background: var( --piscfc-c-panel );
	width: 100%;
}
.piscfc-cart-styled table.shop_table.cart thead th {
	background: var( --piscfc-c-panel-alt ) !important;
	color: var( --piscfc-c-ink ) !important;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	padding: 14px 16px !important;
	border: 0 !important;
	border-bottom: 1px solid var( --piscfc-c-border ) !important;
}
.piscfc-cart-styled table.shop_table.cart td {
	padding: 16px !important;
	border: 0 !important;
	border-bottom: 1px solid var( --piscfc-c-border ) !important;
	vertical-align: middle !important;
	color: var( --piscfc-c-ink );
}
.piscfc-cart-styled table.shop_table.cart .cart_item:last-child td {
	border-bottom: 1px solid var( --piscfc-c-border ) !important;
}
.piscfc-cart-styled table.shop_table.cart .product-thumbnail img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid var( --piscfc-c-border );
}
.piscfc-cart-styled table.shop_table.cart .product-name a {
	color: var( --piscfc-c-ink );
	font-weight: 600;
	text-decoration: none;
}
.piscfc-cart-styled table.shop_table.cart .product-name a:hover {
	text-decoration: underline;
}

/* Remove (×) button as a subtle circular control. */
.piscfc-cart-styled table.shop_table.cart .product-remove a.remove {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 999px !important;
	background: var( --piscfc-c-panel-alt ) !important;
	color: var( --piscfc-c-muted ) !important;
	font-size: 18px;
	line-height: 1;
	text-decoration: none !important;
}
.piscfc-cart-styled table.shop_table.cart .product-remove a.remove:hover {
	background: #fde8e8 !important;
	color: #dc2626 !important;
}

/* Quantity input. */
.piscfc-cart-styled table.shop_table.cart .quantity .qty {
	min-height: 44px;
	width: 72px;
	padding: 8px 10px;
	border: 1px solid var( --piscfc-c-border ) !important;
	border-radius: var( --piscfc-c-field-radius ) !important;
	background: #fff !important;
	color: var( --piscfc-c-ink ) !important;
	text-align: center;
}

/* Coupon + update row. */
.piscfc-cart-styled table.shop_table.cart td.actions {
	background: var( --piscfc-c-panel-alt ) !important;
	padding: 16px !important;
}
.piscfc-cart-styled td.actions .coupon {
	display: inline-flex;
	gap: 8px;
	align-items: center;
}
.piscfc-cart-styled td.actions .coupon .input-text {
	min-height: 44px;
	min-width: 180px;
	padding: 8px 12px;
	border: 1px solid var( --piscfc-c-border ) !important;
	border-radius: var( --piscfc-c-field-radius ) !important;
	background: #fff !important;
}
.piscfc-cart-styled td.actions .button {
	min-height: 44px;
	padding: 10px 18px !important;
	border-radius: var( --piscfc-c-field-radius ) !important;
	font-weight: 600;
	border: 1px solid var( --piscfc-c-border-strong );
	background: #fff;
	color: var( --piscfc-c-ink );
	cursor: pointer;
}
.piscfc-cart-styled td.actions button[name="apply_coupon"] {
	background: var( --piscfc-qc-accent, #081541 ) !important;
	color: #fff !important;
	border: 0 !important;
}

/* Totals card. */
.piscfc-cart-styled .cart_totals {
	background: var( --piscfc-c-panel );
	border: 1px solid var( --piscfc-c-border );
	border-radius: var( --piscfc-c-radius );
	padding: 24px;
	box-shadow: var( --piscfc-c-shadow );
}
.piscfc-cart-styled .cart_totals h2 {
	font-size: 18px;
	font-weight: 700;
	color: var( --piscfc-c-ink );
	margin: 0 0 16px;
}
.piscfc-cart-styled .cart_totals table.shop_table {
	border: 0 !important;
	width: 100%;
}
.piscfc-cart-styled .cart_totals table.shop_table th,
.piscfc-cart-styled .cart_totals table.shop_table td {
	padding: 12px 0 !important;
	border: 0 !important;
	border-bottom: 1px solid var( --piscfc-c-border ) !important;
	color: var( --piscfc-c-ink );
	background: transparent !important;
}
.piscfc-cart-styled .cart_totals .order-total th,
.piscfc-cart-styled .cart_totals .order-total td {
	font-size: 18px;
	font-weight: 700;
	border-bottom: 0 !important;
	padding-top: 16px !important;
}

/* Proceed-to-checkout button. */
.piscfc-cart-styled .wc-proceed-to-checkout {
	margin-top: 16px;
	padding: 0;
}
.piscfc-cart-styled .wc-proceed-to-checkout a.checkout-button {
	display: block;
	width: 100%;
	box-sizing: border-box;
	background: var( --piscfc-qc-accent, #081541 ) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: var( --piscfc-qc-btn-radius, 10px ) !important;
	padding: 16px 24px !important;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	box-shadow: 0 6px 16px color-mix( in srgb, var( --piscfc-qc-accent, #081541 ) 30%, transparent );
}
.piscfc-cart-styled .wc-proceed-to-checkout a.checkout-button:hover {
	filter: brightness( 0.95 );
}

@media ( max-width: 600px ) {
	.piscfc-cart-styled td.actions .coupon {
		display: flex;
		flex-wrap: wrap;
	}
	.piscfc-cart-styled td.actions .coupon .input-text {
		flex: 1 1 100%;
	}
}