/* ===================================================================
   checkout.css — Camisetas Frikis (Arcade Neón)
   Scoped under .cf-cart / .cf-checkout / .cf-thankyou.
   Auto-loaded by functions.php (assets/css/*.css glob).
   DO NOT edit tokens here — they live in style.css :root.
=================================================================== */

/* ───────────────────────────────────────────────────────────────────
   SHARED: STEPS INDICATOR
─────────────────────────────────────────────────────────────────── */
.cf-checkout-steps {
	padding: 22px 0 0;
}
.cf-steps {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--f-head);
	font-size: 13px;
}
.cf-step {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--muted);
	text-decoration: none;
}
.cf-step--done {
	color: var(--accent);
}
.cf-step--active {
	color: var(--accent);
	font-weight: 600;
}
.cf-step--pending {
	color: var(--faint);
}
.cf-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1.5px solid currentColor;
	font-size: 11px;
	font-weight: 700;
}
.cf-step--done .cf-step__num { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.cf-step--active .cf-step__num { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.cf-step__divider {
	color: var(--line-4);
	font-size: 11px;
	letter-spacing: -.05em;
}

/* ───────────────────────────────────────────────────────────────────
   SHARED: COUPON ROW
─────────────────────────────────────────────────────────────────── */
.cf-coupon-row {
	display: flex;
	gap: 8px;
}
.cf-coupon-form__input {
	flex: 1;
}
.cf-coupon-form__btn {
	flex: none;
}

/* ───────────────────────────────────────────────────────────────────
   CART PAGE  (.cf-cart)
─────────────────────────────────────────────────────────────────── */

/* Hero / title */
.cf-cart-hero {
	padding: 32px var(--pad) 4px;
}
.cf-cart-title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: clamp(28px, 5vw, 42px);
	line-height: 1;
	letter-spacing: -.01em;
	margin: 10px 0 0;
}
.cf-cart-count-label {
	color: var(--muted);
	font-size: 22px;
	font-weight: 400;
}

/* Body grid */
.cf-cart-body {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 34px;
	align-items: start;
	padding-top: 22px;
	padding-bottom: 56px;
}
.cf-cart-left {
	min-width: 0;
}

/* Free shipping progress bar */
.cf-ship-bar {
	background: linear-gradient(120deg, #13251f, #11141f);
	border: 1px solid var(--neon-1);
	border-radius: var(--r-14);
	padding: 18px 22px;
	margin-bottom: 20px;
}
.cf-ship-bar__msg {
	font-size: 14px;
	color: var(--text-2);
	margin-bottom: 12px;
	min-height: 20px;
}
.cf-ship-bar__accent {
	color: var(--accent);
	font-family: var(--f-head);
}
.cf-ship-bar__track {
	height: 7px;
	background: var(--line-3);
	border-radius: var(--pill);
	overflow: hidden;
}
.cf-ship-bar__fill {
	height: 100%;
	background: linear-gradient(90deg, var(--accent), var(--violet));
	border-radius: var(--pill);
	transition: width .4s ease;
	min-width: 0;
}

/* Cart column headers */
.cf-cart-thead {
	display: grid;
	grid-template-columns: 1fr 120px 110px 40px;
	gap: 14px;
	padding: 0 4px 12px;
	border-bottom: 1px solid var(--line-2);
	font-family: var(--f-head);
	font-size: 11.5px;
	letter-spacing: .1em;
	color: var(--muted);
	text-transform: uppercase;
}
.cf-cart-thead__qty  { text-align: center; }
.cf-cart-thead__price { text-align: right; }

/* Cart line item */
.cf-cart-item {
	display: grid;
	grid-template-columns: 1fr 120px 110px 40px;
	gap: 14px;
	align-items: center;
	padding: 18px 4px;
	border-bottom: 1px solid #ffffff10;
	transition: background .15s;
}
.cf-cart-item__info {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}
.cf-cart-item__thumb {
	flex: none;
	width: 74px;
	height: 88px;
	border-radius: var(--r-11);
	background: linear-gradient(160deg, var(--surface-3), #0e1119);
	border: 1px solid var(--line-2);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cf-cart-item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.cf-cart-item__meta { min-width: 0; }
.cf-cart-item__cat {
	font-family: var(--f-head);
	font-size: 11px;
	letter-spacing: .08em;
	color: var(--violet);
	text-transform: uppercase;
	margin-bottom: 3px;
}
.cf-cart-item__name {
	font-family: var(--f-head);
	font-weight: 600;
	font-size: 15px;
	color: var(--text);
	line-height: 1.2;
}
.cf-cart-item__name a { color: inherit; }
.cf-cart-item__name a:hover { color: var(--accent); }
.cf-cart-item__variation {
	font-size: 12.5px;
	color: var(--muted);
	margin-top: 5px;
}
/* WC outputs variation as <dl> */
.cf-cart-item__variation dl { margin: 0; display: flex; gap: 6px; flex-wrap: wrap; }
.cf-cart-item__variation dt,
.cf-cart-item__variation dd { font-size: 12.5px; color: var(--muted); margin: 0; }
.cf-cart-item__variation dt::after { content: ":"; }

/* Qty stepper */
.cf-cart-item__qty {
	display: flex;
	align-items: center;
	justify-content: center;
}
.cf-qty {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--line-3);
	border-radius: var(--r-9);
	overflow: hidden;
}
.cf-qty-minus,
.cf-qty-plus {
	width: 32px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: none;
	border: 0;
	color: var(--text-2);
	font-size: 16px;
	cursor: pointer;
	transition: background .15s, color .15s;
	padding: 0;
	line-height: 1;
}
.cf-qty-minus:hover,
.cf-qty-plus:hover {
	background: #43f5b012;
	color: var(--accent);
}
.cf-qty input.qty {
	width: 34px !important;
	text-align: center;
	background: none !important;
	border: 0 !important;
	border-left: 1px solid var(--line-2) !important;
	border-right: 1px solid var(--line-2) !important;
	border-radius: 0 !important;
	color: var(--text);
	font-family: var(--f-head);
	font-weight: 600;
	font-size: 14px;
	padding: 0 !important;
	-moz-appearance: textfield;
	height: 38px;
	box-shadow: none !important;
}
.cf-qty input.qty::-webkit-inner-spin-button,
.cf-qty input.qty::-webkit-outer-spin-button { -webkit-appearance: none; }
.cf-cart-item__qty-single {
	font-family: var(--f-head);
	font-size: 14px;
	color: var(--text-2);
}

/* Line price */
.cf-cart-item__price {
	text-align: right;
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 16px;
	color: var(--accent);
}
.cf-cart-item__unit {
	display: block;
	font-size: 11.5px;
	color: var(--muted);
	font-weight: 400;
	margin-top: 2px;
}

/* Remove button */
.cf-cart-item__rm { text-align: center; }
.cf-cart-item__rm-btn {
	color: var(--muted);
	font-size: 17px;
	cursor: pointer;
	transition: color .15s;
	text-decoration: none;
}
.cf-cart-item__rm-btn:hover { color: var(--magenta); }

/* Cart actions bar */
.cf-cart-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 22px;
	flex-wrap: wrap;
}
.cf-cart-continue { font-size: 13.5px; }

/* WC coupon form (inside cart <form>) — hide it; we render in summary */
.woocommerce-cart-form .checkout_coupon { display: none; }

/* Empty state */
.cf-cart-empty {
	text-align: center;
	padding: 60px 20px;
}
.cf-cart-empty__icon { font-size: 40px; margin-bottom: 16px; }
.cf-cart-empty__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 22px;
	color: var(--text);
	margin-bottom: 10px;
}
.cf-cart-empty__txt { color: var(--muted); font-size: 14px; margin-bottom: 22px; }

/* Summary card */
.cf-cart-summary {
	position: sticky;
	top: 90px;
}
.cf-cart-summary__card {
	padding: 26px 24px;
}
.cf-cart-summary__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 20px;
	margin-bottom: 20px;
	color: var(--text);
}

/* WC cart totals block reset (inside .cf-wc-totals) */
.cf-wc-totals .cart_totals { margin: 0; }
.cf-wc-totals .cart_totals h2 { display: none; } /* we show our own title */
.cf-wc-totals table.shop_table {
	width: 100%;
	border-collapse: collapse;
	margin: 12px 0 0;
}
.cf-wc-totals table.shop_table th,
.cf-wc-totals table.shop_table td {
	padding: 9px 0;
	font-size: 14px;
	color: var(--text-2);
	border: 0;
	background: none;
}
.cf-wc-totals table.shop_table th {
	font-family: var(--f-body);
	font-weight: 400;
	text-align: left;
}
.cf-wc-totals table.shop_table td {
	font-family: var(--f-head);
	text-align: right;
}
.cf-wc-totals table.shop_table .order-total th,
.cf-wc-totals table.shop_table .order-total td {
	border-top: 1px solid var(--line-2);
	padding-top: 16px;
	font-weight: 700;
}
.cf-wc-totals table.shop_table .order-total td {
	font-size: 26px;
	color: var(--accent);
}
.cf-wc-totals .woocommerce-shipping-destination { font-size: 12px; color: var(--muted); }
/* Hide WC's own proceed button — we use .cf-cart-checkout-btn instead */
.cf-wc-totals .wc-proceed-to-checkout { display: none; }

.cf-cart-checkout-btn {
	margin-top: 18px;
	font-size: 15px;
	padding: 16px 26px;
}
.cf-cart-pays { justify-content: center; margin-top: 14px; }
.cf-cart-trust {
	text-align: center;
	font-size: 12px;
	color: var(--muted);
	margin-top: 12px;
}

/* Mini-trust tiles */
.cf-cart-trust-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	margin-top: 14px;
}
.cf-cart-trust-tile {
	background: var(--surface);
	border: 1px solid var(--line-2);
	border-radius: var(--r-12);
	padding: 14px;
	text-align: center;
}
.cf-cart-trust-tile__ico { font-size: 17px; display: block; }
.cf-cart-trust-tile__label {
	font-family: var(--f-head);
	font-size: 11px;
	color: var(--text-2);
	display: block;
	margin-top: 5px;
}

/* Cross-sells */
.cf-cart-cross { padding-top: 10px; }
.cf-cart-cross .cf-h2 { margin-bottom: 22px; }
/* WC cross-sells outputs ul.products — already styled globally. */
.cf-cart-cross ul.products {
	grid-template-columns: repeat(4, 1fr);
}

/* Cart responsive */
@media (max-width: 900px) {
	.cf-cart-body { grid-template-columns: 1fr; }
	.cf-cart-summary { position: static; }
	.cf-cart-cross ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.cf-cart-thead { display: none; }
	.cf-cart-item {
		grid-template-columns: 1fr auto;
		grid-template-rows: auto auto;
		gap: 10px;
	}
	.cf-cart-item__info { grid-column: 1 / -1; }
	.cf-cart-item__qty { justify-content: flex-start; }
	.cf-cart-item__price { text-align: left; }
	.cf-cart-item__rm { grid-row: 2; }
	.cf-cart-cross ul.products { grid-template-columns: 1fr 1fr; }
}

/* ───────────────────────────────────────────────────────────────────
   CHECKOUT PAGE  (.cf-checkout)
─────────────────────────────────────────────────────────────────── */

.cf-checkout-body {
	display: grid;
	grid-template-columns: 1fr 380px;
	gap: 38px;
	align-items: start;
	padding-top: 22px;
	padding-bottom: 60px;
}
.cf-checkout-left { min-width: 0; }

/* Numbered sections */
.cf-checkout-section {
	margin-bottom: 28px;
}
.cf-checkout-section__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 16px;
	flex-wrap: wrap;
}
.cf-checkout-section__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 20px;
	color: var(--text);
	margin: 0;
}
.cf-checkout-section__num {
	color: var(--accent);
	margin-right: 4px;
}
.cf-checkout-section__aside {
	font-size: 12.5px;
	color: var(--muted);
}
.cf-checkout-login-link {
	color: var(--accent);
	font-family: var(--f-head);
}
.cf-checkout-login-link:hover { text-decoration: underline; }

/* Marketing optin */
.cf-checkout-optin {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 12px;
	font-size: 13px;
	color: var(--text-2);
	cursor: pointer;
}
.cf-checkout-optin input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}
.cf-checkout-optin__check {
	flex: none;
	width: 18px;
	height: 18px;
	border-radius: 5px;
	border: 1.5px solid var(--line-4);
	background: var(--surface);
	display: flex;
	align-items: center;
	justify-content: center;
	color: transparent;
	font-size: 11px;
	font-weight: 700;
	transition: background .15s, border-color .15s, color .15s;
}
.cf-checkout-optin input:checked ~ .cf-checkout-optin__check {
	background: var(--accent);
	border-color: var(--accent);
	color: var(--accent-ink);
}
/* Foco visible para teclado (el input real está oculto). */
.cf-checkout-optin input:focus-visible ~ .cf-checkout-optin__check {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

/* WC billing/shipping fields override */
.woocommerce-billing-fields,
.woocommerce-shipping-fields {
	margin: 0;
}
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3 {
	display: none; /* section title already shown in .cf-checkout-section__title */
}
/* Field layout (WC adds .form-row-first / .form-row-last) */
.woocommerce-checkout .form-row { margin: 0 0 12px; }
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
	float: none;
	width: auto;
}
/* Two-column sub-grid for first/last name */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}
/* Full-width rows */
.woocommerce-checkout .form-row-wide {
	grid-column: 1 / -1;
}
/* Postal / city / state sub-row: WC outputs them as individual .form-row */
/* Use a sub-grid trick inside the field-wrapper to keep 3-col for postcode/city/state */
.woocommerce-checkout p#billing_postcode_field,
.woocommerce-checkout p#shipping_postcode_field {
	grid-column: span 1;
}
.woocommerce-checkout p#billing_city_field,
.woocommerce-checkout p#shipping_city_field {
	grid-column: span 1;
}
.woocommerce-checkout p#billing_state_field,
.woocommerce-checkout p#shipping_state_field {
	grid-column: span 2;
}
.woocommerce-checkout p#billing_address_2_field,
.woocommerce-checkout p#shipping_address_2_field {
	grid-column: span 2;
}

/* Label → cf-label style */
.cf-checkout .woocommerce-checkout label {
	display: block;
	font-family: var(--f-head);
	font-size: 12px;
	letter-spacing: .06em;
	color: var(--muted);
	text-transform: uppercase;
	margin-bottom: 7px;
}
/* Inputs → cf-input style */
.cf-checkout .woocommerce-checkout input[type="text"],
.cf-checkout .woocommerce-checkout input[type="email"],
.cf-checkout .woocommerce-checkout input[type="tel"],
.cf-checkout .woocommerce-checkout input[type="number"],
.cf-checkout .woocommerce-checkout input[type="password"],
.cf-checkout .woocommerce-checkout select,
.cf-checkout .woocommerce-checkout textarea {
	width: 100%;
	background: var(--bg);
	border: 1px solid var(--line-3);
	border-radius: var(--r-11);
	padding: 13px 16px;
	color: var(--text);
	font-size: 14px;
	font-family: var(--f-body);
	transition: border-color .15s, box-shadow .15s;
	-webkit-appearance: none;
}
.cf-checkout .woocommerce-checkout input:focus,
.cf-checkout .woocommerce-checkout select:focus,
.cf-checkout .woocommerce-checkout textarea:focus {
	outline: none;
	border-color: var(--neon-3);
	box-shadow: 0 0 0 3px #43f5b01f;
}
.cf-checkout .woocommerce-checkout input::placeholder,
.cf-checkout .woocommerce-checkout textarea::placeholder { color: var(--faint); }
/* Validation states */
.cf-checkout .woocommerce-checkout .woocommerce-invalid input,
.cf-checkout .woocommerce-checkout .woocommerce-invalid select { border-color: var(--magenta); }
.cf-checkout .woocommerce-checkout .woocommerce-validated input { border-color: var(--neon-3); }
/* Select arrow */
.cf-checkout .woocommerce-checkout select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237c83a0' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 38px;
}
/* Error notices */
.cf-checkout .woocommerce-checkout .woocommerce-error { margin-bottom: 16px; }

/* Shipping methods in checkout */
.cf-shipping-methods { display: flex; flex-direction: column; gap: 10px; }
/* WC ships .shipping_method radio inside a .cf-shipping-methods > ul */
.cf-shipping-methods ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.cf-shipping-methods li {
	display: flex;
	align-items: center;
	gap: 14px;
	background: var(--surface);
	border: 1px solid var(--line-3);
	border-radius: var(--r-12);
	padding: 16px 18px;
	cursor: pointer;
	transition: border-color .15s, background .15s;
}
.cf-shipping-methods li:has(input:checked),
.cf-shipping-methods li.selected {
	background: #43f5b00f;
	border-color: var(--neon-3);
}
.cf-shipping-methods input[type="radio"] {
	flex: none;
	width: 20px;
	height: 20px;
	accent-color: var(--accent);
	cursor: pointer;
}
.cf-shipping-methods label {
	flex: 1;
	cursor: pointer;
	font-family: var(--f-head) !important;
	font-size: 14.5px !important;
	font-weight: 600 !important;
	color: var(--text) !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	margin: 0 !important;
}

/* WC payment gateway block */
#order_review.cf-payment-block { margin-top: 0; }
.cf-payment-block #payment {
	background: none;
	border-radius: 0;
	padding: 0;
}
.cf-payment-block #payment ul.payment_methods { list-style: none; display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 16px; }
.cf-payment-block #payment ul.payment_methods li.payment_method {
	flex: 1 1 120px;
}
.cf-payment-block #payment ul.payment_methods li label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: var(--surface);
	border: 1px solid var(--line-3);
	border-radius: var(--r-11);
	padding: 14px 10px;
	font-family: var(--f-head);
	font-weight: 600;
	font-size: 13px;
	color: var(--text-2);
	cursor: pointer;
	transition: border-color .15s, color .15s, background .15s;
	text-align: center;
}
.cf-payment-block #payment ul.payment_methods li.payment_method:has(input:checked) label {
	border-color: var(--accent);
	color: var(--accent);
	background: #43f5b00f;
}
.cf-payment-block #payment ul.payment_methods input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}
.cf-payment-block #payment ul.payment_methods img { height: 22px; width: auto; }
/* Payment gateway panels */
.cf-payment-block #payment .payment_box {
	background: var(--surface);
	border: 1px solid var(--line-2);
	border-radius: var(--r-14);
	padding: 20px;
	margin-bottom: 16px;
}
.cf-payment-block #payment .payment_box p { color: var(--text-2); font-size: 13.5px; line-height: 1.5; }
.cf-payment-block #payment .payment_box input[type="text"],
.cf-payment-block #payment .payment_box input[type="tel"],
.cf-payment-block #payment .payment_box input[type="number"] {
	width: 100%;
	background: var(--bg);
	border: 1px solid var(--line-3);
	border-radius: var(--r-10);
	padding: 13px 15px;
	color: var(--text);
	font-size: 14px;
	font-family: var(--f-body);
	margin-bottom: 12px;
}
/* Elemento de tarjeta de WooCommerce Payments (Stripe UPE): que nunca desborde. */
.cf-payment-block #payment .wcpay-upe-element,
.cf-payment-block #payment .wcpay-upe-form,
.cf-payment-block #payment .wc-payment-form {
	max-width: 100%;
	box-sizing: border-box;
}
/* Casilla «Guardar la información de pago para futuras compras».
   WCPay la pinta con checkbox inline-block + label display:inline en MAYÚSCULAS,
   lo que en móvil se ve como una caja apretada y desencajada. La reconvertimos
   en una fila flex limpia: checkbox fijo arriba-izquierda, texto que envuelve. */
.cf-payment-block #payment .woocommerce-SavedPaymentMethods-saveNew {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: 14px 0 0;
	padding: 12px 14px;
	background: var(--bg);
	border: 1px solid var(--line-3);
	border-radius: var(--r-10);
	box-sizing: border-box;
	max-width: 100%;
}
.cf-payment-block #payment .woocommerce-SavedPaymentMethods-saveNew input[type="checkbox"] {
	flex: 0 0 auto;
	/* !important para vencer los estilos inline de WCPay (width:auto; position:relative; bottom:1px). */
	width: 18px !important;
	height: 18px !important;
	min-width: 18px;
	margin: 1px 0 0 !important;
	position: static !important;
	bottom: auto !important;
	accent-color: var(--accent);
	cursor: pointer;
}
.cf-payment-block #payment .woocommerce-SavedPaymentMethods-saveNew label {
	display: block !important; /* anula el inline display:inline de WCPay */
	margin: 0;
	flex: 1 1 auto;
	min-width: 0;
	font-family: var(--f-body);
	font-weight: 500;
	font-size: 12.5px;
	line-height: 1.45;
	text-transform: none;      /* fuera el grito en mayúsculas, se lee mejor */
	letter-spacing: 0;
	color: var(--text-2);
	cursor: pointer;
}
/* Place order button (from WC) — style as .cf-btn */
.cf-payment-block #payment #place_order,
.cf-payment-block #payment .button.alt {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	background: var(--accent);
	color: var(--accent-ink);
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .04em;
	padding: 16px 26px;
	border-radius: var(--r-12);
	border: none;
	cursor: pointer;
	transition: transform .15s ease, box-shadow .2s ease;
	text-align: center;
}
.cf-payment-block #payment #place_order:hover,
.cf-payment-block #payment .button.alt:hover {
	transform: translateY(-2px);
	box-shadow: var(--glow-cta);
}

/* Checkout order review (right sidebar) */
.cf-checkout-summary {
	position: sticky;
	top: 24px;
}
.cf-checkout-summary__card {
	padding: 24px 22px;
}
.cf-checkout-summary__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 18px;
	color: var(--text);
	margin-bottom: 18px;
}
/* WC order review table in checkout summary */
.cf-checkout-summary .woocommerce-checkout-review-order-table,
.cf-checkout-summary table.shop_table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 16px;
}
.cf-checkout-summary table.shop_table th,
.cf-checkout-summary table.shop_table td {
	padding: 9px 0;
	font-size: 13.5px;
	color: var(--text-2);
	border: 0;
	background: none;
}
.cf-checkout-summary table.shop_table th {
	font-family: var(--f-body);
	font-weight: 400;
	text-align: left;
}
.cf-checkout-summary table.shop_table td { font-family: var(--f-head); text-align: right; }
.cf-checkout-summary table.shop_table .cart_item td.product-name { font-family: var(--f-head); font-weight: 600; font-size: 13px; color: var(--text); text-align: left; }
.cf-checkout-summary table.shop_table .cart_item td.product-total { color: var(--text); }
.cf-checkout-summary table.shop_table tfoot tr.order-total th,
.cf-checkout-summary table.shop_table tfoot tr.order-total td {
	border-top: 1px solid var(--line-2);
	padding-top: 14px;
	font-weight: 700;
}
.cf-checkout-summary table.shop_table tfoot tr.order-total td {
	font-size: 25px;
	color: var(--accent);
}
.cf-checkout-coupon { margin: 0 0 16px; }
.cf-checkout-trust-row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin-top: 16px;
	color: var(--muted);
	font-size: 12px;
}
.cf-checkout-terms {
	text-align: center;
	font-size: 11.5px;
	color: var(--muted);
	margin-top: 12px;
	line-height: 1.5;
}
.cf-checkout-terms a { color: var(--muted); }
.cf-checkout-terms a:hover { color: var(--accent); }

/* Checkout responsive */
@media (max-width: 900px) {
	.cf-checkout-body {
		grid-template-columns: 1fr;
	}
	.cf-checkout-summary {
		position: static;
		order: -1; /* summary above form on mobile */
	}
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
	.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper {
		grid-template-columns: 1fr;
	}
	.woocommerce-checkout .form-row-wide,
	.woocommerce-checkout p#billing_state_field,
	.woocommerce-checkout p#shipping_state_field {
		grid-column: span 1;
	}
}
@media (max-width: 560px) {
	.cf-payment-block #payment ul.payment_methods { flex-direction: column; }
	.cf-payment-block #payment ul.payment_methods li label { justify-content: flex-start; }
	/* Más aire en móvil: menos padding en el panel y en la casilla de guardar tarjeta. */
	.cf-payment-block #payment .payment_box { padding: 16px 14px; }
	.cf-payment-block #payment .woocommerce-SavedPaymentMethods-saveNew { padding: 11px 12px; }
}

/* ───────────────────────────────────────────────────────────────────
   THANK-YOU PAGE  (.cf-thankyou)
─────────────────────────────────────────────────────────────────── */

/* Hero */
.cf-thankyou-hero {
	position: relative;
	padding: 48px var(--pad) 8px;
	text-align: center;
	overflow: hidden;
}
.cf-thankyou-hero__mesh {
	position: absolute;
	inset: 0;
	background-image:
		linear-gradient(#ffffff07 1px, transparent 1px),
		linear-gradient(90deg, #ffffff07 1px, transparent 1px);
	background-size: 26px 26px;
	-webkit-mask-image: radial-gradient(60% 100% at 50% 0%, #000, transparent 75%);
	mask-image: radial-gradient(60% 100% at 50% 0%, #000, transparent 75%);
	pointer-events: none;
}

/* Animated check */
.cf-thankyou-hero__check-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 24px;
}
.cf-thankyou-hero__ring {
	position: absolute;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	border: 2px solid var(--accent);
	animation: cf-ring 1.8s ease-out infinite;
}
.cf-thankyou-hero__check {
	width: 88px;
	height: 88px;
	border-radius: 50%;
	background: var(--accent);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 42px;
	color: var(--accent-ink);
	box-shadow: 0 0 40px #43f5b066;
	animation: cf-pop .5s ease-out both;
	position: relative;
	z-index: 1;
}

/* Hero content */
.cf-thankyou-hero__content {
	position: relative;
	animation: cf-float .5s ease-out .15s both;
}
/* reuse cf-eyebrow — already defined in style.css */
.cf-thankyou-hero__h1 {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: clamp(28px, 6vw, 44px);
	line-height: 1.05;
	letter-spacing: -.01em;
	margin: 10px 0 0;
}
.cf-thankyou-hero__sub {
	font-size: 16px;
	color: var(--text-2);
	margin: 14px auto 0;
	max-width: 520px;
}
.cf-thankyou-hero__order-num {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
	background: var(--surface);
	border: 1px solid var(--line-2);
	border-radius: var(--r-11);
	padding: 12px 20px;
	font-family: var(--f-head);
}
.cf-thankyou-hero__order-label {
	font-size: 12px;
	color: var(--muted);
	letter-spacing: .06em;
	text-transform: uppercase;
}
.cf-thankyou-hero__order-val {
	font-weight: 700;
	font-size: 16px;
	color: var(--accent);
}

/* Body grid */
.cf-thankyou-body {
	display: grid;
	grid-template-columns: 1fr 360px;
	gap: 30px;
	align-items: start;
	padding-top: 32px;
	padding-bottom: 60px;
}
.cf-thankyou-left { min-width: 0; }

/* 4-phase tracker */
.cf-tracker {
	margin-bottom: 20px;
}
.cf-tracker__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 17px;
	color: var(--text);
	margin-bottom: 6px;
}
.cf-tracker__sub {
	font-size: 13.5px;
	color: var(--muted);
	margin-bottom: 24px;
	line-height: 1.5;
}
.cf-tracker__accent { color: var(--accent); }
.cf-tracker__steps {
	display: flex;
	align-items: flex-start;
	position: relative;
}
.cf-tracker__line {
	position: absolute;
	left: 11px;
	right: 11px;
	top: 11px;
	height: 2px;
	background: var(--surface-2);
	z-index: 1;
}
.cf-tracker__line-fill {
	height: 100%;
	background: var(--accent);
	transition: width .6s ease;
}
.cf-tracker__step {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
	z-index: 2;
}
.cf-tracker__dot {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	border: 2px solid var(--surface-2);
	background: var(--surface);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	font-weight: 700;
	color: var(--accent-ink);
	transition: background .3s, border-color .3s;
}
.cf-tracker__step.is-done .cf-tracker__dot {
	background: var(--accent);
	border-color: var(--accent);
}
.cf-tracker__step-label {
	font-family: var(--f-head);
	font-size: 12px;
	color: var(--muted);
	margin-top: 10px;
	text-align: center;
}
.cf-tracker__step.is-done .cf-tracker__step-label,
.cf-tracker__step.is-active .cf-tracker__step-label { color: var(--accent); }
.cf-tracker__step-note {
	font-size: 11px;
	color: var(--faint);
	margin-top: 3px;
	text-align: center;
}

/* Order items block */
.cf-thankyou-items {
	margin-bottom: 20px;
}
.cf-thankyou-items__title {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 17px;
	color: var(--text);
	margin-bottom: 18px;
}
.cf-thankyou-item {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-bottom: 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--line-0);
}
.cf-thankyou-item:last-of-type { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.cf-thankyou-item__thumb {
	position: relative;
	flex: none;
	width: 58px;
	height: 70px;
	border-radius: var(--r-9);
	background: linear-gradient(160deg, var(--surface-3), #0e1119);
	border: 1px solid var(--line-2);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: visible; /* for badge */
}
.cf-thankyou-item__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: var(--r-9);
}
.cf-thankyou-item__qty-badge {
	position: absolute;
	top: -7px;
	right: -7px;
	width: 21px;
	height: 21px;
	border-radius: 50%;
	background: var(--accent);
	color: var(--accent-ink);
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 11px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--surface);
}
.cf-thankyou-item__meta { flex: 1; min-width: 0; }
.cf-thankyou-item__name {
	font-family: var(--f-head);
	font-weight: 600;
	font-size: 14.5px;
	line-height: 1.2;
	color: var(--text);
}
.cf-thankyou-item__variation {
	font-size: 12.5px;
	color: var(--muted);
	margin-top: 3px;
}
/* wc_display_item_meta() devuelve <ul class="wc-item-meta"> con <li> y <p>.
   Lo normalizamos a una línea compacta sin viñetas (Color: Navy · Size: S). */
.cf-thankyou-item__variation .wc-item-meta {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 1px 12px;
}
.cf-thankyou-item__variation .wc-item-meta li { margin: 0; }
.cf-thankyou-item__variation .wc-item-meta p { display: inline; margin: 0; }
.cf-thankyou-item__variation .wc-item-meta-label { font-weight: 600; color: var(--text-2); }
.cf-thankyou-item__price {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 15px;
	color: var(--text);
	white-space: nowrap;
}

/* Totals */
.cf-thankyou-totals { border-top: 1px solid var(--line-2); padding-top: 14px; margin-top: 14px; }
.cf-thankyou-totals__row {
	display: flex;
	justify-content: space-between;
	font-size: 13.5px;
	color: var(--text-2);
	margin-bottom: 10px;
}
.cf-thankyou-totals__val { font-family: var(--f-head); }
.cf-thankyou-totals__ship { color: var(--accent); }
.cf-thankyou-totals__free { color: var(--accent); }
.cf-thankyou-totals__total {
	border-top: 1px solid var(--line-2);
	padding-top: 14px;
	margin-top: 4px;
	font-weight: 700;
	font-size: 16px;
	color: var(--text);
}
.cf-thankyou-totals__vat { font-size: 12px; color: var(--muted); font-weight: 400; }
.cf-thankyou-totals__val--total {
	font-size: 24px;
	color: var(--accent);
}

/* Address + payment grid */
.cf-thankyou-details {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.cf-thankyou-detail__label {
	font-family: var(--f-head);
	font-size: 11px;
	letter-spacing: .1em;
	color: var(--muted);
	text-transform: uppercase;
	margin-bottom: 10px;
}
.cf-thankyou-detail__body {
	font-size: 13.5px;
	color: var(--text-2);
	line-height: 1.65;
	font-style: normal;
}
.cf-thankyou-detail__confirmed { color: var(--accent); }

/* Sidebar: club points */
.cf-club-points {
	background: var(--grad-club);
	border: 1px solid var(--neon-1);
	border-radius: var(--r-18);
	padding: 24px;
	margin-bottom: 16px;
	text-align: center;
}
.cf-club-points__star { font-size: 26px; display: block; }
.cf-club-points__heading {
	font-family: var(--f-head);
	font-weight: 700;
	font-size: 18px;
	margin-top: 8px;
	color: var(--text);
}
.cf-club-points__sub {
	font-size: 13px;
	color: var(--text-2);
	margin-top: 8px;
	line-height: 1.5;
}

/* CTAs card */
.cf-thankyou-ctas { }
.cf-thankyou-ctas__sec {
	margin-top: 10px;
	display: flex;
}
.cf-thankyou-ctas__divider {
	border: 0;
	border-top: 1px solid var(--line-2);
	margin: 18px 0 14px;
}
.cf-thankyou-ctas__help {
	font-size: 12.5px;
	color: var(--muted);
	line-height: 1.6;
	text-align: center;
	margin: 0;
}
.cf-thankyou-ctas__contact-link {
	color: var(--accent);
	font-family: var(--f-head);
}
.cf-thankyou-ctas__contact-link:hover { text-decoration: underline; }

/* Upsell section */
.cf-thankyou-upsell { padding-top: 6px; }
.cf-thankyou-upsell .cf-h2 { margin-bottom: 20px; }
.cf-thankyou-upsell ul.products {
	grid-template-columns: repeat(4, 1fr);
}

/* No-order fallback */
.cf-thankyou-noorder { padding: 60px var(--pad); }
.cf-thankyou-noorder__inner { max-width: 520px; margin: 0 auto; text-align: center; }
.cf-thankyou-noorder__inner h1 { margin-bottom: 14px; }
.cf-thankyou-noorder__inner p { color: var(--text-2); margin-bottom: 24px; }

/* Thank-you responsive */
@media (max-width: 900px) {
	.cf-thankyou-body { grid-template-columns: 1fr; }
	.cf-thankyou-aside { order: -1; }
	.cf-thankyou-upsell ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
	.cf-thankyou-details { grid-template-columns: 1fr; }
	.cf-tracker__step-label { font-size: 10px; }
	.cf-thankyou-upsell ul.products { grid-template-columns: 1fr 1fr; }
}