/**
 * Cart page (Wooptima E-commerce / WooCommerce) — Bozpo theme styling.
 * Two-column layout (items + coupon | summary), checkout step bar and a
 * free-shipping progress bar, adapted to the Bozpo brand tokens.
 */

.woocommerce-cart {
	font-family: var(--font-body);
	color: var(--color-text);
}

.woocommerce-cart .wooptima-notices-wrapper { max-width: 1180px; margin: 0 auto; padding: 0 var(--wrap-pad); }

/* --------------------------------------------------- Page title (h1 "Košík") */
.woocommerce-cart .entry-header {
	max-width: 1180px;
	margin: 0 auto;
	padding: var(--space-24, 24px) var(--wrap-pad) 0;
}

.woocommerce-cart .entry-title {
	margin: 0;
	font-family: var(--font-display);
	font-size: var(--text-30, 30px);
	font-weight: 700;
	letter-spacing: .01em;
	color: var(--color-text);
}

/* WooCommerce notices (WC default CSS is dequeued on the cart) */
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-error {
	max-width: 1180px;
	margin: var(--space-16, 16px) auto;
	padding: 12px 16px;
	display: flex;
	align-items: center;
	gap: var(--space-8, 8px);
	font-size: var(--text-14, 14px);
	color: var(--color-text);
	background: var(--surface-soft);
	border: 1px solid var(--color-border);
	border-left: 3px solid var(--c-brand);
	border-radius: var(--radius-10);
	list-style: none;
}

.woocommerce-cart .woocommerce-message { border-left-color: var(--c-ok); background: var(--c-success-bg); }
.woocommerce-cart .woocommerce-error { border-left-color: #d63638; background: #fdf3f3; }
.woocommerce-cart .woocommerce-info a,
.woocommerce-cart .woocommerce-message a { color: var(--c-brand); font-weight: 600; }

/* Step bar styles live in components/checkout-steps.css (shared with checkout). */

/* ============================================================ Two columns */
.woocommerce-cart-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	grid-template-areas:
		"table   summary"
		"coupon  summary";
	gap: var(--space-20, 20px) var(--space-28, 28px);
	align-items: start;
	max-width: 1180px;
	margin: var(--space-16, 16px) auto 0;
	padding: 0 var(--wrap-pad);
}

.woocommerce-cart-form > .shop_table { grid-area: table; margin: 0; }
.woocommerce-cart-form > .wa-cart-actions { grid-area: summary; margin: 0; }
.woocommerce-cart-form > .wa-coupons-wrapper { grid-area: coupon; margin: 0; display: none; }

/* --------------------------------------------------------------- Table */
.woocommerce-cart-form .shop_table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-14, 14px);
	box-shadow: var(--shadow);
	overflow: hidden;
}

.woocommerce-cart-form .shop_table thead th {
	padding: var(--space-14, 14px) var(--space-16, 16px);
	text-align: left;
	font-family: var(--font-display);
	font-size: var(--text-12-5, 12.5px);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--color-muted);
	background: var(--surface-soft);
	border-bottom: 1px solid var(--color-border);
}

.woocommerce-cart-form .shop_table td {
	padding: var(--space-16, 16px);
	vertical-align: middle;
	border-bottom: 1px solid var(--color-border);
}

.woocommerce-cart-form .cart_item:last-child td { border-bottom: 0; }

.woocommerce-cart-form table.cart td.product-thumbnail img {
	width: 64px;
	height: 64px;
	object-fit: contain;
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-8);
}

.woocommerce-cart-form .product-name a {
	color: var(--color-text);
	font-weight: 600;
	font-size: var(--text-14-5, 14.5px);
	text-decoration: none;
}
.woocommerce-cart-form .product-name a:hover { color: var(--color-addtocart); }
.woocommerce-cart-form .backorder_notification { margin: 4px 0 0; font-size: var(--text-12); color: var(--color-muted); }

/* Variation attributes (Farba, Veľkosť obuvi, …) */
.woocommerce-cart-form .product-name .variation {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 2px 8px;
	margin: 6px 0 0;
	font-size: var(--text-13, 13px);
	line-height: 1.4;
}
.woocommerce-cart-form .product-name .variation dt {
	margin: 0;
	font-weight: 500;
	color: var(--color-muted);
}
.woocommerce-cart-form .product-name .variation dd {
	margin: 0;
	color: var(--color-text);
}
.woocommerce-cart-form .product-name .variation dd p { margin: 0; }

.woocommerce-cart-form .product-price,
.woocommerce-cart-form .product-subtotal { font-weight: 700; color: var(--color-text); white-space: nowrap; }
.woocommerce-cart-form .product-subtotal { color: var(--color-addtocart); }

/* Subtotal: amount + "(s DPH)" read as one right-aligned unit. */
.woocommerce-cart-form .shop_table thead th.product-subtotal,
.woocommerce-cart-form .product-subtotal { text-align: right; }
.woocommerce-cart-form .product-subtotal .tax_label {
	font-weight: 500;
	color: var(--color-muted);
	white-space: nowrap;
}

/* Remove (×) */
.woocommerce-cart-form .product-remove .remove {
	display: inline-grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: var(--radius-circle);
	background: var(--surface-soft);
	color: var(--color-muted) !important;
	font-size: 18px;
	line-height: 1;
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.woocommerce-cart-form .product-remove .remove:hover { background: var(--color-addtocart); color: #fff !important; }

/* Quantity stepper (− / +) */
.woocommerce-cart-form .quantity {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-10);
	overflow: hidden;
	background: var(--surface);
}
.woocommerce-cart-form .quantity input.qty {
	width: 46px;
	padding: 9px 4px;
	text-align: center;
	font-size: var(--text-14);
	font-weight: 600;
	border: 0;
	border-left: 1px solid var(--color-border);
	border-right: 1px solid var(--color-border);
	background: transparent;
	-moz-appearance: textfield;
}
.woocommerce-cart-form .quantity input.qty::-webkit-outer-spin-button,
.woocommerce-cart-form .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.woocommerce-cart-form .bozpo-qty-btn {
	width: 36px;
	border: 0;
	background: var(--surface-soft);
	color: var(--color-text);
	font-size: 18px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	display: grid;
	place-items: center;
	transition: background .15s ease, color .15s ease;
}
.woocommerce-cart-form .bozpo-qty-btn:hover { background: var(--color-addtocart); color: #fff; }
.woocommerce-cart-form .bozpo-qty-btn:active { transform: scale(.94); }

/* Row being updated */
.woocommerce-cart-form .bozpo-row-loading { opacity: .55; pointer-events: none; }

/* Extra services (amtc) under a product name */
.amtc-cart-services { margin: 8px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; }
.amtc-cart-services__item { display: flex; align-items: center; gap: 8px; font-size: var(--text-12-5); color: var(--color-muted); }
.amtc-cart-services__price { font-weight: 600; color: var(--color-text); }

/* ============================================= Right column: summary card */
.wa-cart-actions .wa-cart-sticky-wrapper {
	display: flex;
	flex-direction: column;
	gap: var(--space-14, 14px);
}

.wa-cart-price-and-btn {
	background: var(--surface-soft);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-14, 14px);
	padding: var(--space-22, 22px);
}

.wa-cart-totals-wrapper {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px;
}

.wa-cart-total-label {
	font-family: var(--font-display);
	font-size: var(--text-20, 20px);
	font-weight: 600;
	color: var(--color-text);
}

.wa-cart-total-amount,
.wa-cart-total-amount .woocommerce-Price-amount {
	font-family: var(--font-display);
	font-size: var(--text-28, 28px);
	font-weight: 700;
	color: var(--color-addtocart);
}

.wa-cart-price-and-btn_disclaimer {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: var(--space-8, 8px);
	font-size: var(--text-12-5, 12.5px);
	color: var(--color-muted);
}
/* The Oxygen sprite info icon isn't present here — hide the broken glyph. */
.wa-cart-price-and-btn_disclaimer .ct-fancy-icon { display: none; }

/* Proceed to checkout */
.wa-cart-actions .checkout-button.button,
.wa-cart-actions a.checkout-button {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: var(--space-8, 8px);
	margin-top: var(--space-16, 16px);
	padding: 15px 24px;
	font-family: var(--font-display);
	font-size: var(--text-16, 16px);
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--on-primary) !important;
	background: var(--color-addtocart);
	border: 0;
	border-radius: var(--radius-10);
	text-decoration: none;
	box-shadow: var(--shadow-addcart);
	transition: background .15s ease, box-shadow .15s ease;
}
.wa-cart-actions .checkout-button.button:hover,
.wa-cart-actions a.checkout-button:hover { background: var(--color-addtocart-strong); box-shadow: var(--shadow-addcart-hover); }

/* ------------------------------------------------- Free-shipping progress bar */
.wa-cart-actions__free-shipping-bar {
	background: var(--surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-12, 12px);
	padding: var(--space-14, 14px) var(--space-16, 16px);
}

.wa-free-shipping-notice { display: flex; flex-direction: column; gap: 10px; }

.wa-free-shipping-notice__row {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--text-13-5, 13.5px);
	font-weight: 600;
	color: var(--color-text);
}

.wa-free-shipping-notice__icon { display: inline-flex; color: var(--c-brand); flex: 0 0 auto; }
.wa-free-shipping-notice__icon svg { width: 26px; height: 26px; }

.wa-free-shipping-notice__track {
	height: 8px;
	border-radius: var(--radius-pill);
	background: var(--surface-soft2);
	overflow: hidden;
}

.wa-free-shipping-notice__progress-bar {
	height: 100%;
	width: var(--free-shipping-progress, 0%);
	background: linear-gradient(90deg, var(--color-addtocart-strong), var(--color-addtocart));
	border-radius: var(--radius-pill);
	transition: width .6s ease;
}

/* Reached state: keep the text dark/readable — only the icon and bar go green. */
.wa-free-shipping-notice.is-reached .wa-free-shipping-notice__row { color: var(--color-text); }
.wa-free-shipping-notice.is-reached .wa-free-shipping-notice__icon { color: var(--c-ok); }
.wa-free-shipping-notice.is-reached .wa-free-shipping-notice__progress-bar { background: var(--c-ok); }

/* --------------------------------------------------------------- Coupon */
.wa-coupons-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-12, 12px);
	align-items: center;
	background: var(--surface-soft);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-14, 14px);
	padding: var(--space-16, 16px);
}

.wa-coupons-wrapper .coupon {
	display: flex;
	flex: 1 1 100%;
	flex-wrap: wrap;
	gap: var(--space-12, 12px);
	align-items: center;
}

.wa-coupons-wrapper .coupon label { display: none; }

.wa-coupons-wrapper .coupon input#coupon_code {
	flex: 1 1 220px;
	padding: 13px 15px;
	font-size: var(--text-14);
	background: var(--surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-10);
}
.wa-coupons-wrapper .coupon input#coupon_code:focus {
	outline: none;
	border-color: var(--color-addtocart);
	box-shadow: 0 0 0 3px rgba(0, 160, 227, .16);
}

.wa-coupons-wrapper .coupon .button {
	padding: 13px 26px;
	font-family: var(--font-display);
	font-size: var(--text-14, 14px);
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--on-primary);
	background: var(--color-addtocart);
	border: 0;
	border-radius: var(--radius-10);
	cursor: pointer;
	box-shadow: var(--shadow-addcart);
	transition: background .15s ease;
}
.wa-coupons-wrapper .coupon .button:hover { background: var(--color-addtocart-strong); }

/* "Update cart" — secondary */
.wa-coupons-wrapper > button[name="update_cart"] {
	padding: 11px 18px;
	font-family: var(--font-display);
	font-weight: 600;
	color: var(--color-text);
	background: var(--surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-10);
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
.wa-coupons-wrapper > button[name="update_cart"]:hover { background: var(--surface-soft2); border-color: var(--c-border-hover); }
.wa-coupons-wrapper > button[name="update_cart"][disabled] { opacity: .5; cursor: default; }

.cart-collaterals:empty { display: none; }

/* --------------------------------------------------- Responsive (mobile) */
@media (max-width: 900px) {
	.woocommerce-cart-form {
		grid-template-columns: 1fr;
		grid-template-areas:
			"table"
			"summary"
			"coupon";
	}
}

@media (max-width: 720px) {
	.woocommerce-cart-form .shop_table.shop_table_responsive thead { display: none; }
	.woocommerce-cart-form .shop_table.shop_table_responsive tr { display: block; }
	.woocommerce-cart-form .shop_table.shop_table_responsive td {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--space-12, 12px);
		padding: var(--space-8, 8px) var(--space-16, 16px);
		border-bottom: 0;
		text-align: right;
	}
	.woocommerce-cart-form .shop_table.shop_table_responsive td::before {
		content: attr(data-title);
		font-weight: 600;
		color: var(--color-muted);
		text-align: left;
	}
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-thumbnail { justify-content: flex-start; }
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-remove::before { content: ""; }
	.woocommerce-cart-form .cart_item { border-bottom: 1px solid var(--color-border); }

	/* Subtotal row: label stays left; amount + "(s DPH)" group together on the
	   right (instead of spreading into three separate columns). */
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-subtotal { gap: 6px; }
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-subtotal .amount { margin-left: auto; }

	/* Product cell: stack name, attributes and availability under each other. */
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-name {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 6px;
		text-align: left;
	}
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-name::before { display: none; }
	.woocommerce-cart-form .shop_table.shop_table_responsive td.product-name .variation {
		width: 100%;
		margin: 0;
	}
}
