/**
 * HKS Auto — Habillage du panier WooCommerce
 *
 * Tout est scopé sous body.hks-crt (ajoutée uniquement sur /mon-panier/).
 * Aucun template n'est remplacé : on habille le balisage natif du panier
 * (table.cart, .cart_totals, .coupon, etc.), les mêmes classes que celles
 * documentées par WooCommerce et utilisées par les extensions de transport
 * (Relais Colis, Chronopost, Mondial Relay).
 */

body.hks-crt {
	--hkscrt-red: #e4032e;
	--hkscrt-red-ink: #b3021f;
	--hkscrt-ink: #121519;
	--hkscrt-line: #dfe3e6;
	--hkscrt-border: #c8ced3;
	--hkscrt-muted: #5a636b;   /* 6,1:1 sur blanc */
	--hkscrt-green: #127a4e;
	--hkscrt-focus: #171b20;
}

body.hks-crt .woocommerce { max-width: 1300px; margin-inline: auto; }

/* Bandeau « X a été ajouté à votre panier » : posé côté PHP uniquement
   quand ?add-to-cart=ID est présent dans l'URL (hks-crt-added, cf. PHP),
   donc sans jamais masquer d'autres messages (code promo appliqué, etc.)
   qui partagent la même classe .woocommerce-message. */
body.hks-crt-added .woocommerce-notices-wrapper { display: none !important; }

/* Titre de page natif du thème (« Mon Panier », h2 sans classe, injecté
   par le thème avant le contenu) : redondant avec notre propre en-tête
   .hkscrt-top ci-dessous, on le masque. Sélecteur d'enfant direct de
   .page-content pour ne jamais toucher un autre h2 de la page (dont notre
   propre titre récapitulatif ou celui des cross-sells). */
body.hks-crt .page-content > h2 { display: none; }
body.hks-crt .woocommerce :focus-visible { outline: 3px solid var(--hkscrt-focus); outline-offset: 2px; }

/* ---------- En-tête ---------- */
body.hks-crt .hkscrt-top {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	margin-bottom: 30px;
}
body.hks-crt .hkscrt-eyebrow {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 10px;
	color: var(--hkscrt-muted);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 1.2px;
	text-transform: uppercase;
}
body.hks-crt .hkscrt-eyebrow::before { content: ""; width: 22px; height: 2px; background: var(--hkscrt-red); }
body.hks-crt .hkscrt-title h1 {
	margin: 0;
	font-size: clamp(32px, 4vw, 52px);
	line-height: 1.05;
	letter-spacing: -.035em;
	color: var(--hkscrt-ink);
}
body.hks-crt .hkscrt-continue {
	padding-bottom: 5px;
	border-bottom: 1px solid var(--hkscrt-red);
	color: var(--hkscrt-ink);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .6px;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}
body.hks-crt .hkscrt-continue span { margin-left: 8px; color: var(--hkscrt-red-ink); }

/* ---------- Grille deux colonnes ---------- */
body.hks-crt .woocommerce-cart-form,
body.hks-crt .hkscrt-compat,
body.hks-crt .cross-sells,
body.hks-crt .cart-empty,
body.hks-crt .return-to-shop { max-width: 820px; }
body.hks-crt .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
	gap: 24px;
	align-items: start;
}
/* Tout ce qui n'est pas le récapitulatif reste dans la colonne de gauche.
   .hkscrt-compat et .cross-sells ne sont plus des enfants directs de
   .woocommerce : cart-skin.js les déplace À L'INTÉRIEUR du formulaire
   (juste après la carte panier), qui est lui-même en colonne 1 — ils en
   héritent automatiquement, aucune règle grid-column dédiée nécessaire. */
body.hks-crt .woocommerce > .hkscrt-top,
body.hks-crt .woocommerce > form.woocommerce-cart-form,
body.hks-crt .woocommerce > .cart-empty,
body.hks-crt .woocommerce > p.return-to-shop { grid-column: 1; }
body.hks-crt .hkscrt-top { grid-column: 1 / -1; }
body.hks-crt .woocommerce-cart-form,
body.hks-crt .hkscrt-compat,
body.hks-crt .cross-sells,
body.hks-crt .cart-empty,
body.hks-crt .return-to-shop { max-width: none; }

/* Le total du panier (colonne récap) : le thème peut le flotter comme il
   flotte d'autres blocs WooCommerce — même piège déjà rencontré sur le
   checkout, on neutralise par précaution. */
body.hks-crt .cart-collaterals,
body.hks-crt .cart_totals {
	grid-column: 2;
	display: block !important;
	float: none !important;
	width: 100% !important;
	clear: both !important;
	position: sticky;
	top: 24px;
}

/* ---------- Carte panier ---------- */
body.hks-crt .hkscrt-card {
	border: 1px solid var(--hkscrt-line);
	border-radius: 11px;
	background: #fff;
	overflow: hidden;
}
body.hks-crt table.cart,
body.hks-crt table.shop_table.cart { margin: 0; border: 0; }
body.hks-crt table.cart thead th {
	padding: 16px 20px;
	border-bottom: 1px solid var(--hkscrt-line);
	color: var(--hkscrt-muted);
	font-size: 12px;
	font-weight: 900;
	letter-spacing: .6px;
	text-transform: uppercase;
	text-align: left;
}
body.hks-crt table.cart thead th.product-quantity,
body.hks-crt table.cart thead th.product-price,
body.hks-crt table.cart thead th.product-subtotal { text-align: center; }

body.hks-crt table.cart td { padding: 20px; border-top: 0; border-bottom: 1px solid var(--hkscrt-line); vertical-align: middle; }
body.hks-crt table.cart tr:last-of-type td { border-bottom: 0; }
/* Le thème ajoute un fond gris (7% opacité) sur les lignes du panier, y
   compris au survol : on le neutralise, la ligne reste blanche uniforme. */
body.hks-crt table.cart tr.cart_item,
body.hks-crt table.cart tr.cart_item td,
body.hks-crt table.cart tr.cart_item:hover,
body.hks-crt table.cart tr.cart_item:hover td { background: transparent !important; }

/* Miniature produit */
body.hks-crt td.product-thumbnail {
	width: 90px;
	padding-right: 0;
}
body.hks-crt td.product-thumbnail img {
	display: block;
	width: 78px;
	height: 78px;
	border: 1px solid #e0e4e7;
	border-radius: 8px;
	object-fit: cover;
}
body.hks-crt td.product-name {
	color: var(--hkscrt-ink);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
}
body.hks-crt td.product-name a { color: inherit; text-decoration: none; }
body.hks-crt td.product-name a:hover { color: var(--hkscrt-red-ink); }
body.hks-crt td.product-name dl.variation,
body.hks-crt td.product-name .wc-item-meta {
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
	color: var(--hkscrt-muted);
	font-size: 13px;
	line-height: 1.6;
}
body.hks-crt td.product-name dl.variation dt { font-weight: 700; display: inline; }
body.hks-crt td.product-name dl.variation dd { display: inline; margin: 0 12px 0 4px; }

/* Référence (SKU) + disponibilité réelle */
body.hks-crt .hkscrt-itemmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; }
body.hks-crt .hkscrt-sku { color: var(--hkscrt-muted); font-size: 13px; }
body.hks-crt .hkscrt-sku b { color: var(--hkscrt-ink); font-weight: 700; }
body.hks-crt .hkscrt-itemmeta .stock {
	display: inline-block;
	margin: 0;
	padding: 4px 8px;
	border-radius: 4px;
	background: #eef7f1;
	color: var(--hkscrt-green);
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}
body.hks-crt .hkscrt-itemmeta .stock.out-of-stock { background: #fbeaec; color: var(--hkscrt-red-ink); }

body.hks-crt td.product-price,
body.hks-crt td.product-subtotal {
	text-align: center;
	color: var(--hkscrt-ink);
	font-size: 15px;
	font-weight: 800;
	white-space: nowrap;
}

/* Quantité : champ natif + boutons +/- ajoutés en JS */
body.hks-crt td.product-quantity { text-align: center; }
body.hks-crt .quantity { display: inline-flex; }
body.hks-crt .hkscrt-qtybox {
	display: inline-grid;
	grid-template-columns: 34px 46px 34px;
	height: 40px;
	border: 1px solid var(--hkscrt-border);
	border-radius: 7px;
	overflow: hidden;
}
body.hks-crt .hkscrt-qtybtn {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	line-height: 1;
	height: 100%;
	box-sizing: border-box;
	border: 0;
	background: #f4f5f6;
	color: var(--hkscrt-ink);
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}
body.hks-crt .hkscrt-qtybtn:hover { background: var(--hkscrt-ink); color: #fff; }
body.hks-crt .hkscrt-qtybtn:disabled { opacity: .4; cursor: not-allowed; }
body.hks-crt .quantity input.qty {
	width: 100%;
	height: 100%;
	padding: 0;
	line-height: normal;
	min-height: 0;
	border: 0;
	border-left: 1px solid var(--hkscrt-border);
	border-right: 1px solid var(--hkscrt-border);
	outline: none;
	text-align: center;
	font-size: 15px;
	font-weight: 800;
	color: var(--hkscrt-ink);
	/* 16px minimum sur mobile pour éviter le zoom automatique iOS */
	font-size: max(15px, 16px);
	/* Flèches natives du champ number masquées : redondantes avec nos
	   propres boutons +/-, et visuellement différentes d'un navigateur
	   à l'autre. */
	-moz-appearance: textfield;
}
body.hks-crt .quantity input.qty::-webkit-outer-spin-button,
body.hks-crt .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Suppression d'un article : lien natif WooCommerce (AJAX géré par WC lui-même) */
body.hks-crt td.product-remove { width: 44px; text-align: center; }
body.hks-crt td.product-remove a.remove {
	display: inline-grid !important;
	place-items: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--hkscrt-border);
	border-radius: 7px;
	background: #fff;
	color: var(--hkscrt-muted) !important;
	font-size: 16px;
	line-height: 1 !important;
}
body.hks-crt td.product-remove a.remove:hover {
	border-color: var(--hkscrt-red);
	background: var(--hkscrt-red) !important;
	color: #fff !important;
}

/* Ligne « code promo / actualiser le panier », dans le pied du tableau natif */
body.hks-crt tr td.actions { padding: 18px 20px; background: #fafbfb; border-bottom: 0; }
body.hks-crt .coupon { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
body.hks-crt .coupon label { display: none; }
body.hks-crt .coupon input#coupon_code {
	min-width: 200px;
	flex: 1 1 200px;
	height: 44px;
	padding: 0 14px;
	border: 1px solid var(--hkscrt-border);
	border-radius: 7px;
	outline: none;
	font-size: 15px;
}
body.hks-crt .coupon input#coupon_code:focus { border-color: var(--hkscrt-red); }
body.hks-crt .coupon button[name="apply_coupon"],
body.hks-crt button[name="update_cart"] {
	height: 44px;
	padding: 0 18px;
	border: 1px solid var(--hkscrt-ink);
	border-radius: 7px;
	background: var(--hkscrt-ink);
	color: #fff;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .4px;
	text-transform: uppercase;
	cursor: pointer;
}
body.hks-crt .coupon button[name="apply_coupon"]:hover { background: var(--hkscrt-red); border-color: var(--hkscrt-red); }
body.hks-crt button[name="update_cart"] {
	margin-left: auto;
	background: #fff;
	color: var(--hkscrt-ink);
	border-color: var(--hkscrt-border);
}
body.hks-crt button[name="update_cart"]:hover { border-color: var(--hkscrt-ink); }
body.hks-crt button[name="update_cart"]:disabled { opacity: .5; cursor: not-allowed; }

/* ---------- Panneau réductions : code promo + points fidélité ---------- */
/* Regroupe deux formulaires natifs distincts (.coupon de WooCommerce,
   .hks-pf-cartbox de l'extension Points Fidélité) sous deux onglets, sans
   jamais les recréer — seuls leur position et leur habillage changent, les
   soumissions restent celles d'origine. Un seul panneau ouvert à la fois,
   aucun ouvert par défaut : ce sont des actions secondaires, la lecture de
   la page va d'abord au bouton « Passer la commande ». */
body.hks-crt .hkscrt-discounts {
	margin-top: 16px;
	border: 1px solid var(--hkscrt-line);
	border-radius: 11px;
	background: #fff;
	overflow: hidden;
}
body.hks-crt .hkscrt-discounts-tabs { display: flex; }
body.hks-crt .hkscrt-dtab {
	flex: 1 1 0;
	padding: 15px 16px;
	border: 0;
	border-right: 1px solid var(--hkscrt-line);
	background: #fafbfb;
	color: var(--hkscrt-muted);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .3px;
	cursor: pointer;
	transition: .15s;
}
body.hks-crt .hkscrt-dtab:last-child { border-right: 0; }
body.hks-crt .hkscrt-dtab:hover { color: var(--hkscrt-ink); }
body.hks-crt .hkscrt-dtab.is-active { background: #fff; color: var(--hkscrt-red-ink); box-shadow: inset 0 -2px 0 var(--hkscrt-red); }

body.hks-crt .hkscrt-dpanel { display: none; padding: 18px; border-top: 1px solid var(--hkscrt-line); }
body.hks-crt .hkscrt-dpanel.is-open { display: block; }

/* Le formulaire code promo natif, replacé dans son nouveau panneau */
body.hks-crt .hkscrt-dpanel .coupon { display: flex; flex-wrap: nowrap; gap: 10px; }

/* L'encart Points fidélité perd son propre cadre : le panneau parent en
   fournit déjà un, superposer les deux ferait un double encadré. */
body.hks-crt .hkscrt-dpanel .hks-pf-cartbox {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-size: 14px;
	color: var(--hkscrt-muted);
}
body.hks-crt .hks-pf-cartbox .button {
	margin-top: 10px;
	padding: 9px 14px;
	border: 1px solid var(--hkscrt-ink);
	border-radius: 6px;
	background: var(--hkscrt-ink);
	color: #fff;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .3px;
	box-shadow: none;
}
body.hks-crt .hks-pf-cartbox .button:hover { background: var(--hkscrt-red); border-color: var(--hkscrt-red); }
body.hks-crt .hks-pf-cartbox input[type="number"],
body.hks-crt .hks-pf-cartbox input[type="text"] {
	padding: 10px 12px;
	border: 1px solid var(--hkscrt-border);
	border-radius: 6px;
	font-size: 15px;
}

/* ---------- Bandeau compatibilité ---------- */
body.hks-crt .hkscrt-compat {
	display: flex;
	align-items: flex-start;
	gap: 15px;
	margin-top: 16px;
	padding: 18px 20px;
	border: 1px solid var(--hkscrt-line);
	border-left: 4px solid var(--hkscrt-red);
	border-radius: 8px;
	background: #fff;
	flex-wrap: wrap;
}
/* !important : le thème force display:block + line-height hérité sur les
   <span> génériques (même piège que .hkscrt-compat-icon, .hkscrt-num
   ailleurs) — sans forçage, le « ! » se cale en haut à gauche de la bulle
   au lieu d'être centré. */
body.hks-crt .hkscrt-compat-icon {
	display: grid !important;
	place-items: center !important;
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #fbeaec;
	color: var(--hkscrt-red-ink);
	font-size: 15px;
	font-weight: 900;
	line-height: 1 !important;
	text-align: center !important;
}
body.hks-crt .hkscrt-compat strong { display: block; font-size: 14px; color: var(--hkscrt-ink); }
body.hks-crt .hkscrt-compat span { display: block; margin-top: 5px; color: var(--hkscrt-muted); font-size: 13px; line-height: 1.55; }
body.hks-crt .hkscrt-compat a {
	margin-left: auto;
	flex: none;
	color: var(--hkscrt-red-ink);
	font-size: 13px;
	font-weight: 800;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
}

/* ---------- Cross-sells (produits complémentaires réels) ---------- */
body.hks-crt .cross-sells {
	margin-top: 16px;
	padding: 20px;
	border: 1px solid var(--hkscrt-line);
	border-radius: 11px;
	background: #fff;
}
body.hks-crt .cross-sells > h2 {
	margin: 0 0 16px;
	font-size: 16px;
	color: var(--hkscrt-ink);
}
/* Une ligne horizontale par produit (miniature + infos + bouton), pleine
   largeur — plutôt qu'une grille de cartes qui, avec un seul cross-sell
   (le cas le plus fréquent), laisse une grande zone vide à droite.
   !important par précaution : le thème flotte les listes de produits
   WooCommerce ailleurs sur ce site (même piège que .cart_totals plus haut
   et que .customer_details/.order_review sur le checkout) — sans forçage,
   les lignes se contractent et s'empilent au lieu de s'aligner. */
body.hks-crt .cross-sells ul.products {
	display: flex !important;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
	float: none !important;
}
body.hks-crt .cross-sells ul.products li.product {
	display: flex !important;
	align-items: center;
	gap: 16px;
	float: none !important;
	width: 100% !important;
	padding: 14px;
	border: 1px solid var(--hkscrt-border);
	border-radius: 8px;
}
/* Image, titre et prix sont réunis par WooCommerce dans UN SEUL lien
   (.woocommerce-loop-product__link) : sans le mettre lui aussi en ligne, il
   reste un bloc vertical unique face au bouton, largeur écrasée à ~35px. */
body.hks-crt .cross-sells ul.products .woocommerce-loop-product__link {
	display: flex !important;
	align-items: center;
	gap: 14px;
	flex: 1 1 auto;
	min-width: 0;
	text-decoration: none;
}
body.hks-crt .cross-sells ul.products img {
	flex: none !important;
	width: 56px !important;
	height: 56px !important;
	border-radius: 6px;
	object-fit: cover;
	margin: 0;
}
body.hks-crt .cross-sells ul.products .woocommerce-loop-product__title {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	font-size: 14px;
	font-weight: 700;
	/* Troncature propre plutôt qu'un retour à la ligne qui écraserait la
	   largeur du titre à 0 (constaté en test) sur les noms de produit longs. */
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--hkscrt-ink);
}
body.hks-crt .cross-sells ul.products .price {
	flex: none;
	margin: 0;
	color: var(--hkscrt-ink);
	font-weight: 800;
	font-size: 15px;
	white-space: nowrap;
}
/* Pas de survol / surbrillance : couleurs fixes, aucune transition. */
body.hks-crt .cross-sells ul.products .button {
	flex: none;
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid var(--hkscrt-red);
	border-radius: 6px;
	background: #fff;
	color: var(--hkscrt-red-ink);
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	text-decoration: none;
}
/* Neutralise tout effet natif du thème (zoom, ombre, changement de couleur
   au survol) sur la ligne, l'image et le bouton. */
body.hks-crt .cross-sells ul.products li.product,
body.hks-crt .cross-sells ul.products li.product:hover,
body.hks-crt .cross-sells ul.products img,
body.hks-crt .cross-sells ul.products li.product:hover img {
	box-shadow: none !important;
	transform: none !important;
	transition: none !important;
}
body.hks-crt .cross-sells ul.products .button:hover,
body.hks-crt .cross-sells ul.products .button:focus {
	background: #fff;
	color: var(--hkscrt-red-ink);
}
body.hks-crt .cross-sells ul.products .woocommerce-loop-product__title:hover,
body.hks-crt .cross-sells ul.products a:not(.button):hover {
	color: var(--hkscrt-ink);
	text-decoration: none;
}

/* ---------- Récapitulatif ---------- */
body.hks-crt .cart_totals {
	border: 1px solid var(--hkscrt-border);
	border-radius: 11px;
	background: #fff;
	box-shadow: 0 25px 55px rgba(31, 40, 49, .09);
	padding: 20px 21px;
}
/* :not(.hkscrt-totals-heading) est indispensable : notre propre titre de
   remplacement est LUI AUSSI un <h2> enfant direct de .cart_totals — sans
   cette exclusion, la règle masque les deux d'un coup. */
body.hks-crt .cart_totals > h2:not(.hkscrt-totals-heading) { display: none; }
body.hks-crt .hkscrt-totals-heading { margin: 0 0 16px; font-size: 19px; color: var(--hkscrt-ink); }

body.hks-crt .cart_totals table.shop_table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
}
/* Le thème force flex-direction:column sur <tr> — même piège que partout
   ailleurs sur ce site : ça empile libellé et valeur au lieu de les mettre
   côte à côte. On restaure l'affichage tableau natif. */
body.hks-crt .cart_totals table.shop_table tr { display: table-row !important; }
body.hks-crt .cart_totals table.shop_table th,
body.hks-crt .cart_totals table.shop_table td {
	display: table-cell !important;
	padding: 10px 0;
	border: 0;
	border-bottom: 1px solid var(--hkscrt-line);
	color: var(--hkscrt-muted);
	font-size: 15px;
	text-align: left;
	vertical-align: top;
}
body.hks-crt .woocommerce-shipping-methods { margin: 0; padding: 0; list-style: none; }
body.hks-crt .woocommerce-shipping-destination { margin: 6px 0 0; color: var(--hkscrt-muted); font-size: 13px; }
body.hks-crt .cart_totals table.shop_table td { text-align: right; color: var(--hkscrt-ink); font-weight: 700; }
body.hks-crt .cart_totals table.shop_table tr.order-total th,
body.hks-crt .cart_totals table.shop_table tr.order-total td {
	padding-top: 16px;
	border-bottom: 0;
	color: var(--hkscrt-ink);
	font-size: 16px;
	font-weight: 800;
}
body.hks-crt .cart_totals table.shop_table tr.order-total .amount { font-size: 26px; letter-spacing: -.02em; }
/* Le thème teinte la ligne « Total » en bleu (19% opacité) et applique un
   fond gris (7%) aux autres lignes, y compris au survol. On les repasse en
   blanc uniforme. */
body.hks-crt .cart_totals table.shop_table tr,
body.hks-crt .cart_totals table.shop_table tr th,
body.hks-crt .cart_totals table.shop_table tr td,
body.hks-crt .cart_totals table.shop_table tr:hover,
body.hks-crt .cart_totals table.shop_table tr:hover th,
body.hks-crt .cart_totals table.shop_table tr:hover td { background: transparent !important; }
body.hks-crt .woocommerce-shipping-totals select,
body.hks-crt .woocommerce-shipping-totals input {
	width: 100%;
	margin-top: 8px;
	padding: 10px 12px;
	border: 1px solid var(--hkscrt-border);
	border-radius: 6px;
	font-size: 15px;
}
body.hks-crt .woocommerce-shipping-calculator a {
	color: var(--hkscrt-red-ink);
	font-size: 13px;
	font-weight: 700;
}

body.hks-crt .wc-proceed-to-checkout { padding: 0; margin-top: 4px; }
body.hks-crt .wc-proceed-to-checkout a.checkout-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: 16px 18px;
	border: 1px solid var(--hkscrt-red);
	border-radius: 7px;
	background: var(--hkscrt-red);
	color: #fff !important;
	font-size: 14px;
	font-weight: 900;
	letter-spacing: .8px;
	text-transform: uppercase;
	text-decoration: none;
}
body.hks-crt .wc-proceed-to-checkout a.checkout-button:hover { background: #171b20; border-color: #171b20; }

body.hks-crt .hkscrt-payment-note {
	margin: 14px 0 0;
	color: var(--hkscrt-muted);
	font-size: 13px;
	line-height: 1.6;
	text-align: center;
}
body.hks-crt .hkscrt-trust {
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin-top: 16px;
	border-top: 1px solid var(--hkscrt-line);
}
body.hks-crt .hkscrt-trust div { padding: 14px 6px 0; text-align: center; }
body.hks-crt .hkscrt-trust div:first-child { border-right: 1px solid var(--hkscrt-line); }
body.hks-crt .hkscrt-trust strong { display: block; font-size: 13px; }
body.hks-crt .hkscrt-trust small { display: block; margin-top: 5px; color: var(--hkscrt-muted); font-size: 12px; line-height: 1.5; }

/* ---------- Panier vide (template natif WooCommerce, non remplacé) ---------- */
body.hks-crt .cart-empty.woocommerce-info {
	grid-column: 1 / -1;
	max-width: 620px;
	margin: 20px auto;
	padding: 40px 30px;
	border: 1px solid var(--hkscrt-line);
	border-radius: 11px;
	background: #fff;
	color: var(--hkscrt-ink);
	font-size: 16px;
	text-align: center;
}
body.hks-crt .cart-empty.woocommerce-info::before { display: none; }
body.hks-crt p.return-to-shop {
	grid-column: 1 / -1;
	max-width: 620px;
	margin: 0 auto;
	text-align: center;
}
body.hks-crt p.return-to-shop a.button {
	display: inline-flex;
	padding: 15px 22px;
	border: 1px solid var(--hkscrt-red);
	border-radius: 7px;
	background: var(--hkscrt-red);
	color: #fff;
	font-size: 13px;
	font-weight: 900;
	letter-spacing: .6px;
	text-transform: uppercase;
	text-decoration: none;
}
body.hks-crt p.return-to-shop a.button:hover { background: #171b20; border-color: #171b20; }

/* ---------- Messages (coupon appliqué, erreurs) ---------- */
body.hks-crt .woocommerce-message,
body.hks-crt .woocommerce-error,
body.hks-crt .woocommerce-info {
	grid-column: 1 / -1;
	border-top-color: var(--hkscrt-red);
	font-size: 15px;
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
	body.hks-crt .woocommerce { grid-template-columns: 1fr; }
	body.hks-crt .cart_totals { position: static; grid-column: 1; }
	body.hks-crt table.cart thead { display: none; }
	body.hks-crt table.cart, body.hks-crt table.cart tbody, body.hks-crt table.cart tr, body.hks-crt table.cart td { display: block; width: 100%; }
	body.hks-crt table.cart tr { position: relative; padding: 18px 50px 18px 18px; }
	body.hks-crt table.cart td { padding: 4px 0; border: 0; }
	body.hks-crt td.product-thumbnail { display: inline-block; vertical-align: top; margin-right: 14px; }
	body.hks-crt td.product-name { display: inline-block; width: calc(100% - 95px); }
	body.hks-crt td.product-price { display: none; }
	body.hks-crt td.product-quantity,
	body.hks-crt td.product-subtotal { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; text-align: left; }
	body.hks-crt td.product-quantity::before { content: "Quantité"; color: var(--hkscrt-muted); font-size: 12px; font-weight: 800; text-transform: uppercase; }
	body.hks-crt td.product-subtotal::before { content: "Sous-total"; color: var(--hkscrt-muted); font-size: 12px; font-weight: 800; text-transform: uppercase; }
	body.hks-crt td.product-remove { position: absolute; top: 18px; right: 18px; width: auto; }
	body.hks-crt tr td.actions { flex-wrap: wrap; }
	/* Cible tactile 44px minimum recommandée sur mobile */
	body.hks-crt .hkscrt-qtybox { grid-template-columns: 44px 52px 44px; height: 46px; }
	body.hks-crt .hkscrt-qtybtn { font-size: 18px; }
}
@media (max-width: 600px) {
	body.hks-crt .hkscrt-top { flex-direction: column; align-items: flex-start; gap: 14px; }
	body.hks-crt .coupon { width: 100%; }
	body.hks-crt .coupon input#coupon_code { min-width: 0; }
	body.hks-crt button[name="update_cart"] { margin-left: 0; width: 100%; }
	body.hks-crt .hkscrt-compat { align-items: flex-start; }
	body.hks-crt .hkscrt-compat a { margin-left: 49px; }
}

@media (prefers-reduced-motion: reduce) { body.hks-crt * { transition: none !important; } }