/* PrittyWoman — winkelwagen (gescoped). */
.woocommerce-cart .sellabees-page { max-width: var(--pw-container); }
.woocommerce-cart .sellabees-entry__title { display: none; }  /* live toont geen winkelwagen-titel */

.woocommerce-cart table.shop_table {
	border: 1px solid var(--pw-line);
	border-radius: 4px;
	border-collapse: collapse;
	width: 100%;
}
.woocommerce-cart table.shop_table th {
	font-family: var(--pw-font-heading);
	font-weight: 600;
	text-transform: uppercase;
	font-size: 13px;
	color: var(--pw-text);
	padding: 14px 12px;
	border-bottom: 2px solid var(--pw-line);
	text-align: left;
}
.woocommerce-cart table.shop_table td { padding: 16px 12px; border-bottom: 1px solid var(--pw-line); vertical-align: middle; }
/* Geen los × meer: de prullenbak op de −-knop (bij aantal 1) verwijdert het item. */
.woocommerce-cart table.shop_table th.product-remove,
.woocommerce-cart td.product-remove { display: none; }
.woocommerce-cart table.shop_table td.product-thumbnail img { width: 70px; height: auto; border-radius: 3px; }
.woocommerce-cart table.shop_table .product-name a { color: var(--pw-text); text-decoration: none; font-weight: 500; }
.woocommerce-cart .quantity input.qty { width: 64px; padding: 8px; border: 1px solid #cfcfcf; border-radius: 3px; text-align: center; }

/* Aantal-stepper: − [input] +  (knoppen worden door theme.js toegevoegd). */
.woocommerce-cart .quantity.sellabees-qty--stepper {
	display: inline-flex;
	align-items: stretch;
	width: max-content;
	border: 1px solid var(--pw-line);
	border-radius: 4px;
	overflow: hidden;
	background: #fff;
}
.woocommerce-cart .quantity.sellabees-qty--stepper input.qty {
	width: 42px;
	border: 0;
	border-radius: 0;
	padding: 8px 2px;
	-moz-appearance: textfield;
}
.woocommerce-cart .quantity.sellabees-qty--stepper input.qty::-webkit-outer-spin-button,
.woocommerce-cart .quantity.sellabees-qty--stepper input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.woocommerce-cart .sellabees-qty__btn {
	-webkit-appearance: none;
	appearance: none;
	border: 0;
	background: var(--pw-cream);
	color: var(--pw-text);
	width: 36px;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}
.woocommerce-cart .sellabees-qty__btn:hover { background: var(--pw-gold); color: #fff; }
.woocommerce-cart .sellabees-qty__btn--minus { border-right: 1px solid var(--pw-line); }
.woocommerce-cart .sellabees-qty__btn--plus { border-left: 1px solid var(--pw-line); }
/* − toont een prullenbak zodra er nog 1 in de winkelwagen staat (klik = verwijderen). */
.woocommerce-cart .sellabees-qty__btn.is-remove svg { display: block; }
.woocommerce-cart .sellabees-qty__btn.is-remove:hover { background: #c0392b; color: #fff; }

.woocommerce-cart .cart-collaterals { margin-top: 36px; display: flex; justify-content: flex-end; }
.woocommerce-cart .cart_totals { width: 100%; max-width: 360px; }
/* Totalen-blok teruggebracht tot alléén de afrekenknop (kop/subtotaal/verzending/totaal weg). */
.woocommerce-cart .cart_totals > h2,
.woocommerce-cart .cart_totals table.shop_table { display: none; }
.woocommerce-cart .wc-proceed-to-checkout { margin: 0; }
.woocommerce-cart .wc-proceed-to-checkout .button { display: block; text-align: center; width: 100%; }

/* Onderste tabelrij: waardebon (links) + "winkelwagen bijwerken" (rechts).
   Géén display:flex op de <td> (dat breekt de tabel-cel → cel krimpt en de knop
   kan niet naar rechts). We gebruiken floats, zoals WooCommerce standaard doet. */
.woocommerce-cart table.shop_table td.actions { padding: 18px 12px; }
.woocommerce-cart table.shop_table td.actions::after { content: ""; display: table; clear: both; }
.woocommerce-cart td.actions .coupon { display: none; }   /* waardebon-veld verwijderd (op verzoek) */
.woocommerce-cart td.actions button[name="update_cart"] { float: right; white-space: nowrap; }

@media (max-width: 760px) {
	/* Minder ruimte aan de zijkant: smallere pagina-padding op de winkelwagen. */
	.woocommerce-cart .sellabees-container { padding-inline: 12px; }

	/* Elk winkelwagen-item = compacte kaart:
	   rij 1 = afbeelding + titel (titel rechtsboven, naast de foto),
	   rij 2 = prijs · aantal-stepper · subtotaal. */
	.woocommerce-cart table.shop_table { border-radius: 6px; }
	.woocommerce-cart table.shop_table thead { display: none; }
	.woocommerce-cart table.shop_table tbody { display: block; }
	.woocommerce-cart table.shop_table tr.cart_item {
		display: grid;
		grid-template-columns: 58px 1fr auto;
		grid-template-areas:
			"thumb name name"
			"price qty  subtotal";
		column-gap: 10px;
		row-gap: 8px;
		align-items: center;
		padding: 10px 8px;
		border-bottom: 1px solid var(--pw-line);
	}
	.woocommerce-cart table.shop_table tr.cart_item td { display: block; border: 0; padding: 0; text-align: left; }
	/* WooCommerce's shop_table_responsive zet op mobiel per cel een data-title-label
	   met float:left → standaard uit; hieronder zetten we alleen bij prijs + subtotaal
	   een nette eigen label terug. */
	.woocommerce-cart table.shop_table tr.cart_item td::before { content: none !important; }
	.woocommerce-cart td.product-thumbnail { grid-area: thumb; align-self: start; }
	.woocommerce-cart td.product-thumbnail img { width: 58px; }
	.woocommerce-cart td.product-name { grid-area: name; align-self: start; font-weight: 500; line-height: 1.35; }

	/* Tekst-label boven de prijs en het subtotaal (uit data-title), i.p.v. de kale
	   WooCommerce-float-labels. Hogere specificiteit dan de blanket-uit hierboven. */
	.woocommerce-cart table.shop_table tr.cart_item td.product-price::before,
	.woocommerce-cart table.shop_table tr.cart_item td.product-subtotal::before {
		content: attr(data-title) !important;
		display: block;
		float: none;
		font-family: var(--pw-font-heading);
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .03em;
		color: var(--pw-body);
		margin: 0 0 2px;
	}
	.woocommerce-cart td.product-price { grid-area: price; justify-self: start; color: var(--pw-text); font-size: 14px; }
	.woocommerce-cart td.product-quantity { grid-area: qty; justify-self: center; align-self: end; }
	.woocommerce-cart td.product-subtotal { grid-area: subtotal; justify-self: end; text-align: right; font-weight: 600; }

	/* Ruimere touch-targets voor de stepper op mobiel. */
	.woocommerce-cart .sellabees-qty__btn { width: 40px; }
	.woocommerce-cart .quantity.sellabees-qty--stepper input.qty { width: 46px; padding-block: 10px; }

	.woocommerce-cart .cart-collaterals { justify-content: stretch; margin-top: 24px; }
	.woocommerce-cart .cart_totals { max-width: none; }
	/* Mobiel: onder elkaar i.p.v. links/rechts (indien de actie-rij ooit terugkomt) */
	.woocommerce-cart td.actions .coupon { float: none; max-width: none; margin-bottom: 12px; }
	.woocommerce-cart td.actions button[name="update_cart"] { float: none; width: 100%; }
}