/* ============================================================
   Panier et commande.

   `woocommerce-layout` retiré : les deux colonnes du checkout et la table du
   panier sont posées ici, en grille, sur les classes NATIVES. Aucun
   `cart.php` ni `form-checkout.php` copié — donc aucune dette `@version`.
   ============================================================ */

/* --- Table du panier --------------------------------------------- */

.woocommerce table.shop_table {
	border: 1px solid var(--bepc-border);
	border-radius: var(--bepc-radius);
	border-collapse: separate;
	border-spacing: 0;
	background: var(--bepc-surface);
}

.woocommerce table.shop_table th {
	padding: var(--bepc-s-4);
	background: var(--bepc-surface-soft);
	color: var(--bepc-encre);
	font-family: var(--bepc-font-body);
	font-weight: 650;
	font-size: 0.9rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.woocommerce table.shop_table td {
	padding: var(--bepc-s-4);
	border-top: 1px solid var(--bepc-border);
	vertical-align: middle;
}

.woocommerce table.cart img {
	width: 68px;
	border-radius: var(--bepc-radius-sm);
}

.woocommerce a.remove {
	color: var(--bepc-rupture) !important;
	font-weight: 700;
}

.woocommerce a.remove:hover {
	background: var(--bepc-rupture);
	color: #fff !important;
}

/* --- Totaux ------------------------------------------------------- */

.woocommerce .cart-collaterals {
	margin-top: var(--bepc-s-10);
	display: grid;
	justify-content: end;
}

.woocommerce .cart-collaterals .cart_totals {
	width: min(420px, 100%);
	float: none;
	padding: var(--bepc-s-6);
	background: var(--bepc-miel-pale);
	border: 1px solid var(--bepc-border);
	border-radius: var(--bepc-radius);
}

.woocommerce .cart-collaterals .cart_totals h2 {
	margin: 0 0 var(--bepc-s-4);
	font-size: 1.25rem;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table {
	border: 0;
	background: transparent;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table th,
.woocommerce .cart-collaterals .cart_totals table.shop_table td {
	padding-inline: 0;
	background: transparent;
	text-transform: none;
}

.woocommerce .wc-proceed-to-checkout {
	padding: 0;
	margin-top: var(--bepc-s-5);
}

.woocommerce .wc-proceed-to-checkout a.checkout-button {
	display: block;
	text-align: center;
}

/* --- Commande : deux colonnes ------------------------------------ */

/* Zones nommées, pas un placement automatique : le bloc client est plus haut
   que le titre « Votre commande ». Placé sur une seule ligne, il repoussait le
   récapitulatif sur la ligne suivante, donc sous tout le formulaire. Ici, le
   client occupe les deux lignes de la colonne 1 et le récapitulatif reste en
   haut de la colonne 2. Ligne `avis` : là où WooCommerce insère ses erreurs
   de validation, en tête du formulaire. Écart vertical nul, puisqu'une ligne
   vide garderait sinon son espacement. */
.woocommerce form.checkout {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
	grid-template-areas:
		"avis   avis"
		"client titre"
		"client recap";
	grid-template-rows: auto auto 1fr;
	column-gap: var(--bepc-s-12);
	align-items: start;
}

.woocommerce form.checkout .woocommerce-NoticeGroup {
	grid-area: avis;
}

.woocommerce form.checkout .col2-set {
	grid-area: client;
	width: auto;
}

.woocommerce form.checkout .col2-set .col-1,
.woocommerce form.checkout .col2-set .col-2 {
	width: auto;
	float: none;
}

.woocommerce form.checkout #order_review_heading,
.woocommerce form.checkout #order_review {
	width: auto;
	float: none;
}

.woocommerce form.checkout #order_review_heading { grid-area: titre; }
.woocommerce form.checkout #order_review { grid-area: recap; }

.woocommerce form.checkout #order_review {
	position: sticky;
	top: calc(var(--bepc-header-h) + var(--bepc-s-5));
	padding: var(--bepc-s-6);
	background: var(--bepc-surface);
	border: 1px solid var(--bepc-border);
	border-radius: var(--bepc-radius);
	box-shadow: var(--bepc-shadow-sm);
}

.woocommerce form.checkout h3,
.woocommerce form.checkout #order_review_heading {
	margin: 0 0 var(--bepc-s-5);
	font-size: 1.3rem;
}

/* --- Champs ------------------------------------------------------- */

.woocommerce form .form-row {
	margin-bottom: var(--bepc-s-4);
	padding: 0;
}

.woocommerce form .form-row label {
	margin-bottom: var(--bepc-s-2);
	font-weight: 600;
}

.woocommerce form .form-row .required {
	color: var(--bepc-rupture);
	text-decoration: none;
}

/* Le champ « Classe » porte l'information qui permet de livrer : on le
   distingue visuellement du reste du formulaire. */
#billing_classe_field {
	padding: var(--bepc-s-4);
	background: var(--bepc-miel-pale);
	border: 1px solid var(--bepc-sable);
	border-radius: var(--bepc-radius);
}

/* --- Moyen de paiement -------------------------------------------- */

.woocommerce #payment {
	background: transparent;
	border-radius: 0;
}

.woocommerce #payment ul.payment_methods {
	padding: 0;
	border-bottom: 0;
}

.woocommerce #payment div.payment_box {
	background: var(--bepc-surface-soft);
	color: var(--bepc-text-2);
	font-size: 0.95rem;
}

.woocommerce #payment div.payment_box::before {
	border-bottom-color: var(--bepc-surface-soft);
}

.woocommerce #payment .form-row.place-order {
	padding: 0;
	margin-top: var(--bepc-s-5);
}

.woocommerce #payment #place_order {
	width: 100%;
}

/* --- Panier vide --------------------------------------------------- */

.woocommerce .cart-empty {
	font-size: 1.15rem;
}

.woocommerce .return-to-shop {
	margin-top: var(--bepc-s-5);
}

@media (max-width: 860px) {
	.woocommerce form.checkout {
		grid-template-columns: 1fr;
		grid-template-areas:
			"avis"
			"client"
			"titre"
			"recap";
		grid-template-rows: auto;
	}

	.woocommerce form.checkout .col2-set {
		margin-bottom: var(--bepc-s-8);
	}

	.woocommerce form.checkout #order_review {
		position: static;
	}

	.woocommerce table.shop_table td {
		padding: var(--bepc-s-3);
	}
}