/*
 * Panier et checkout (WooCommerce Blocks) — Ceyssat Ma Bougie.
 * Chargée UNIQUEMENT sur le panier et le checkout (inc/commande.php), après main-<version>.css dont elle
 * reprend les jetons (--cmb-*). Source canonique : commande.css ; artefact servi : commande-<version>.css
 * (copie exacte, jamais modifiée une fois servie).
 *
 * Habillage seulement, par-dessus les blocs natifs (aucun gabarit ni script) : boutons du thème, focus
 * visible, cibles de 44 px, nom des bougies comme dans la Boutique, options choisies plus nettes que les
 * autres. Montants, livraison, retrait, remises, paiements et messages restent ceux de WooCommerce et cmb-core.
 *
 * Sommaire
 * 1. Boutons « Valider la commande » et « Commander »
 * 2. Panier : lignes, quantité, suppression
 * 3. Codes promo
 * 4. Checkout : options (livraison / retrait, lieux, paiement) et focus clavier
 */

/* ==========================================================================
   1. Boutons principaux : le bouton du thème (charbon, pilule), à la place de l'ardoise WooCommerce.
   Préfixe body : les feuilles des blocs WooCommerce sont chargées APRÈS celle du thème.
   ========================================================================== */

body .wc-block-components-button.wc-block-cart__submit-button,
body .wc-block-components-button.wc-block-components-checkout-place-order-button {
	min-height: 3.25rem;
	padding: 0.875rem 1.75rem;
	background: var(--cmb-color-charcoal);
	color: var(--cmb-color-white);
	font-family: var(--cmb-font-body);
	font-size: var(--cmb-text-base);
	font-weight: var(--cmb-weight-semibold);
	letter-spacing: var(--cmb-tracking-wide);
	line-height: 1.2;
	border: 0;
	border-radius: var(--cmb-radius-pill);
	box-shadow: none;
	transition: background-color var(--cmb-duration-fast) var(--cmb-ease);
}

body .wc-block-components-button.wc-block-cart__submit-button:hover,
body .wc-block-components-button.wc-block-components-checkout-place-order-button:not(:disabled):hover {
	background: var(--cmb-color-accent-strong);
	color: var(--cmb-color-on-accent);
}

/* WooCommerce remplace le contour par un anneau bleu hors charte (règle « body:not(…) …:not(.is-link):focus ») :
   contour de focus du thème, même spécificité, feuille chargée après. */
body .wc-block-components-button.wc-block-cart__submit-button:not(.is-link):focus-visible,
body .wc-block-components-button.wc-block-components-checkout-place-order-button:not(.is-link):focus-visible {
	outline: 2px solid var(--cmb-color-focus);
	outline-offset: 3px;
	box-shadow: none;
}

/* ==========================================================================
   2. Panier : nom de la bougie comme les cartes de la Boutique, quantité et suppression à 44 px.
   ========================================================================== */

.wc-block-cart-items .wc-block-components-product-name {
	color: var(--cmb-color-text);
	font-family: var(--cmb-font-heading);
	font-size: var(--cmb-text-lg);
	font-weight: var(--cmb-weight-regular);
	line-height: var(--cmb-leading-snug);
	text-decoration: none;
}

.wc-block-cart-items .wc-block-components-product-name:hover {
	text-decoration-line: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.wc-block-components-quantity-selector {
	min-height: var(--cmb-tap-target);
	border-color: var(--cmb-color-border-strong);
	border-radius: var(--cmb-radius-m);
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: var(--cmb-tap-target);
	min-height: calc(var(--cmb-tap-target) - 2px);
	color: var(--cmb-color-text);
	font-size: var(--cmb-text-lg);
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__input {
	min-height: calc(var(--cmb-tap-target) - 2px);
	font-family: var(--cmb-font-body);
	font-size: var(--cmb-text-base);
	font-variant-numeric: tabular-nums;
}

/* Petits téléphones (< 384 px) : la grille native (vignette 80 px + colonne FIXE de 132 px) débordait de
   16 px à 320 px ; vignette de 64 px et colonne fluide : quantité et poubelle gardent 44 px, sans défilement. */
@media (max-width: 23.99em) {
	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
		grid-template-columns: 4rem minmax(0, 1fr);
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image {
		padding-right: 0.75rem;
	}
}

/* Focus de la quantité : contour du thème (WooCommerce : simple filet intérieur de 1 px, peu visible). */
body .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:focus-visible,
body .wc-block-components-quantity-selector .wc-block-components-quantity-selector__input:focus-visible {
	outline: 2px solid var(--cmb-color-focus);
	outline-offset: -2px;
	box-shadow: none;
}

/* Poubelle : même icône, zone cliquable de 44 px. */
.wc-block-cart-item__remove-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--cmb-tap-target);
	min-height: var(--cmb-tap-target);
}

/* ==========================================================================
   3. Codes promo : panneau secondaire, mais déplié d'un geste (zone de 44 px).
   ========================================================================== */

.wc-block-components-totals-coupon .wc-block-components-panel__button {
	min-height: var(--cmb-tap-target);
}

/* ==========================================================================
   4. Checkout : options non choisies en filet beige, option choisie en charbon (le choix reste net).
   ========================================================================== */

.wc-block-checkout__shipping-method-option {
	border-radius: var(--cmb-radius-m);
}

.wc-block-checkout__shipping-method-option:not(.wc-block-checkout__shipping-method-option--selected) {
	border-color: var(--cmb-color-border);
}

.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option,
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option {
	box-shadow: inset 0 0 0 1px var(--cmb-color-border);
	border-radius: var(--cmb-radius-m);
}

.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option-checked,
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option:has(.wc-block-components-radio-control__option-checked) {
	box-shadow: inset 0 0 0 1.5px var(--cmb-color-charcoal);
}

/* Focus clavier : la bascule Expédier / Retrait n'en a aucun ; cases et radios n'ont qu'un filet de 1 à 1,5 px. */
body .wc-block-checkout__shipping-method-option:focus-visible {
	outline: 2px solid var(--cmb-color-focus);
	outline-offset: 2px;
}

body .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:focus-visible,
body .wc-block-components-radio-control .wc-block-components-radio-control__input:focus-visible {
	outline: 2px solid var(--cmb-color-focus);
	outline-offset: 2px;
}
