/* =========================================================================
   Pukka — Classic (shortcode) cart / basket, restyled to the modern Woo
   look: items list on the left, sticky totals card on the right.

   Sublium needs the classic [woocommerce_cart]; we keep the markup and only
   restyle. Subscription line items show their plan/frequency automatically
   in the product-name column (Woo's formatted item data). Token-driven.
   ========================================================================= */

.woocommerce-cart .woocommerce { max-width: var(--pk-header-max, 1320px); margin: 0 auto; }

/* ── Two-column layout (fluid; matches checkout breakpoint) ───────────── */
@media (min-width: 1000px) {
	.woocommerce-cart .woocommerce {
		display: grid;
		grid-template-columns: minmax(0, 1.4fr) minmax(360px, 1fr);
		column-gap: 32px;
		align-items: start;
	}
	.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
	.woocommerce-cart .woocommerce-cart-form { grid-column: 1; grid-row: 2; }
	.woocommerce-cart .cart-collaterals { grid-column: 2; grid-row: 2; position: sticky; top: 24px; width: 100%; }
}
.woocommerce-cart .cart-collaterals .cross-sells { display: none; } /* keep the summary column clean */

/* ── Items table → clean list ─────────────────────────────────────────── */
.woocommerce-cart table.cart {
	border: 0;
	margin: 0;
	background: transparent;
}
.woocommerce-cart table.cart thead th {
	border: 0;
	border-bottom: 1px solid var(--pk-line, #E5E7EB);
	padding: 0 0 12px;
	font-size: 12px;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--pk-mute, #6B7280);
	text-align: left;
}
.woocommerce-cart table.cart tbody tr.cart_item td {
	border: 0;
	border-bottom: 1px solid var(--pk-line, #E5E7EB);
	padding: 18px 12px 18px 0;
	vertical-align: middle;
	background: transparent;
}
.woocommerce-cart table.cart td.product-thumbnail { width: 90px; }
.woocommerce-cart table.cart td.product-thumbnail img {
	width: 72px; height: 72px;
	object-fit: cover;
	border-radius: var(--pk-radius-sm, 10px);
	background: var(--pk-soft, #F3F4F6);
}
.woocommerce-cart table.cart td.product-name a {
	color: var(--pk-ink, #0F172A);
	font-weight: 600;
	text-decoration: none;
	font-size: 15.5px;
}
.woocommerce-cart table.cart td.product-name a:hover { color: var(--pk-teal, #0E6B6B); }
/* Subscription/variation meta under the name (Sublium frequency etc). */
.woocommerce-cart table.cart td.product-name .variation,
.woocommerce-cart table.cart td.product-name dl {
	margin: 6px 0 0; font-size: 13px; color: var(--pk-teal, #0E6B6B);
}
.woocommerce-cart table.cart td.product-name dd { margin: 0; color: var(--pk-mute, #6B7280); }
.woocommerce-cart .product-price,
.woocommerce-cart .product-subtotal { color: var(--pk-ink, #0F172A); font-weight: 600; }

/* Quantity stepper */
.woocommerce-cart .quantity input.qty {
	width: 72px; height: 44px;
	border: 1px solid var(--pk-line, #E5E7EB);
	border-radius: var(--pk-radius-sm, 10px);
	text-align: center;
	font-size: 15px;
	color: var(--pk-ink, #0F172A);
}

/* Remove (×) */
.woocommerce-cart table.cart td.product-remove a.remove,
.woocommerce-cart a.remove {
	display: inline-flex; align-items: center; justify-content: center;
	width: 28px; height: 28px;
	border-radius: 50%;
	color: var(--pk-mute, #6B7280) !important;
	background: var(--pk-soft, #F3F4F6);
	font-size: 18px; line-height: 1;
	transition: background .15s ease, color .15s ease;
}
.woocommerce-cart a.remove:hover { background: var(--pk-red, #EF4444); color: #fff !important; }

/* ── Actions row (coupon + update) ────────────────────────────────────── */
.woocommerce-cart table.cart td.actions {
	border-bottom: 0;
	padding: 20px 0 0;
}
.woocommerce-cart .coupon { display: inline-flex; gap: 8px; }
.woocommerce-cart .coupon .input-text {
	height: 46px; min-width: 180px;
	border: 1px solid var(--pk-line, #E5E7EB);
	border-radius: var(--pk-radius-sm, 10px);
	padding: 0 14px; font-size: 14.5px;
}
.woocommerce-cart td.actions .button {
	height: 46px;
	border-radius: var(--pk-radius-sm, 10px);
	border: 1px solid var(--pk-line, #E5E7EB);
	background: #fff;
	color: var(--pk-ink, #0F172A);
	font-weight: 600;
	padding: 0 18px;
	cursor: pointer;
}
.woocommerce-cart td.actions button[name="apply_coupon"] {
	background: var(--pk-ink, #0F172A); color: #fff; border-color: var(--pk-ink, #0F172A);
}

/* ── Totals card (right) ──────────────────────────────────────────────── */
.woocommerce-cart .cart_totals {
	/* Override Woo's default float:right / width:48% which left the card thin
	   inside the grid column. */
	width: 100% !important;
	float: none !important;
	background: var(--pk-soft, #F3F4F6);
	border: 1px solid var(--pk-line, #E5E7EB);
	border-radius: var(--pk-radius, 16px);
	padding: 22px;
}
.woocommerce-cart .cart_totals h2 {
	font-size: 18px; font-weight: 700; margin: 0 0 16px;
	padding-bottom: 12px; border-bottom: 1px solid var(--pk-line, #E5E7EB);
	color: var(--pk-ink, #0F172A);
}
.woocommerce-cart .cart_totals table { border: 0; margin: 0; }
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td {
	border: 0;
	border-bottom: 1px solid var(--pk-line, #E5E7EB);
	padding: 12px 0;
	font-size: 14.5px;
	text-align: left;
}
.woocommerce-cart .cart_totals table td { text-align: right; }
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
	font-size: 18px; font-weight: 800; border-bottom: 0; padding-top: 16px;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout { padding: 18px 0 0; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	display: flex; align-items: center; justify-content: center;
	width: 100%;
	min-height: 54px;
	padding: 14px 20px;
	line-height: 1.3;
	white-space: normal;          /* let "Proceed to Checkout" wrap instead of clipping */
	text-align: center;
	background: var(--pk-teal, #0E6B6B) !important;
	color: #fff !important;
	border-radius: var(--pk-radius-sm, 10px);
	font-size: 16px; font-weight: 700;
	text-decoration: none;
	transition: background .15s ease;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { background: var(--pk-teal-dark, #0A5454) !important; }

/* ── Responsive ───────────────────────────────────────────────────────── */
@media (max-width: 999px) {
	.woocommerce-cart .cart-collaterals { position: static; margin-top: 28px; }
	.woocommerce-cart table.cart td.product-thumbnail { width: 70px; }
}