/* ==========================================================================
   Dafoimagen - WooCommerce Cart + Checkout brand restyle  (v1.2)
   v1.3 (2026-06-26): fix borde interno card "Tu pedido" -> box-shadow de Astra
     Modern Checkout sobre table.woocommerce-checkout-review-order-table (10.6).
   v1.2 (2026-06-26): fixes de checkout (Astra "Modern Checkout") -> seccion 10.
     padding interno de "Tu pedido", cantidad inline, select2 Pais/Estado
     (label arriba + valor centrado + asterisco en su lugar), alturas coherentes.
   Markup: CLASSIC shortcodes ([woocommerce_cart] / [woocommerce_checkout]).
   Coherente con tutor-single-course.css y dafo-dashboard.css.
   Tokens de marca (SIN ROSA):
     Deep Twilight #04044A | Navy #000877 | Blue Bell #00A3FF
     Icy #AFE2FF | Ghost White #F7F8FC | Texto #141414 | Borde #E6EDF5
   Tipografia: titulos "adineue PRO" / cuerpo "Gotham".
   Scope: encolado condicional solo en is_cart() || is_checkout().
   NOTA: WooCommerce/Astra cargan su CSS DESPUES de este archivo -> las
   propiedades de tarjetas/inputs/tablas usan !important para ganar la cascada.
   Agente Gestor 2026-06-26.
   ========================================================================== */

:root {
	--dafo-deep:   #04044A;
	--dafo-navy:   #000877;
	--dafo-blue:   #00A3FF;
	--dafo-icy:    #AFE2FF;
	--dafo-bg:     #F7F8FC;
	--dafo-text:   #141414;
	--dafo-border: #E6EDF5;
	--dafo-line:   #F0F4F9;
	--dafo-white:  #FFFFFF;
	--dafo-shadow: 0 1px 2px rgba(0,0,0,.05);
	--dafo-head: "adineue PRO","Space Grotesk",Montserrat,sans-serif;
	--dafo-body: "Gotham",Montserrat,sans-serif;
}

/* ======================================================================
   0. FONDO DE PAGINA (Ghost White) + tipografia base del area WC
   ====================================================================== */
body.woocommerce-cart,
body.woocommerce-checkout { background: var(--dafo-bg); }

.woocommerce-cart #content,
.woocommerce-checkout #content,
.woocommerce-cart .site-content,
.woocommerce-checkout .site-content,
.woocommerce-cart #primary,
.woocommerce-checkout #primary { background: var(--dafo-bg); }

.woocommerce-cart .woocommerce,
.woocommerce-checkout .woocommerce {
	font-family: var(--dafo-body);
	color: var(--dafo-text);
}

/* Titulo de pagina (Carrito / Finalizar compra) en adineue + deep */
.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title,
.woocommerce-cart .ast-single-entry-title,
.woocommerce-checkout .ast-single-entry-title {
	font-family: var(--dafo-head);
	font-weight: 400;
	letter-spacing: 0.4px;
	color: var(--dafo-deep);
}

/* ======================================================================
   1. NOTICES / MENSAJES WC -> tonos de marca
   ====================================================================== */
.woocommerce-cart .woocommerce-message,
.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-checkout .woocommerce-info {
	background: #F0F8FF !important;
	border: 1px solid var(--dafo-icy) !important;
	border-top: 3px solid var(--dafo-blue) !important;
	border-radius: 12px !important;
	color: var(--dafo-deep) !important;
	font-family: var(--dafo-body);
	font-size: 13px;
	box-shadow: none !important;
}
.woocommerce-cart .woocommerce-message::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-cart .woocommerce-info::before,
.woocommerce-checkout .woocommerce-info::before { color: var(--dafo-blue) !important; }

.woocommerce-cart .woocommerce-error,
.woocommerce-checkout .woocommerce-error {
	background: #FFF5F5 !important;
	border: 1px solid #FBD5D5 !important;
	border-top: 3px solid #DC2626 !important;
	border-radius: 12px !important;
	color: #7A1212 !important;
	box-shadow: none !important;
}
.woocommerce-cart .woocommerce-error::before,
.woocommerce-checkout .woocommerce-error::before { color: #DC2626 !important; }

.woocommerce-cart .woocommerce-info a,
.woocommerce-checkout .woocommerce-info a,
.woocommerce-cart .woocommerce-message a:not(.button),
.woocommerce-checkout .woocommerce-message a:not(.button) {
	color: var(--dafo-navy);
	font-weight: 600;
	text-decoration: underline;
}
.woocommerce-cart .woocommerce-info a:hover,
.woocommerce-checkout .woocommerce-info a:hover { color: var(--dafo-blue); }

/* ======================================================================
   2. BOTONES DE MARCA
   ====================================================================== */
.woocommerce-cart .woocommerce a.button,
.woocommerce-cart .woocommerce button.button,
.woocommerce-cart .woocommerce input.button,
.woocommerce-cart .woocommerce a.button.alt,
.woocommerce-cart .woocommerce button.button.alt,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout .woocommerce a.button,
.woocommerce-checkout .woocommerce button.button,
.woocommerce-checkout .woocommerce input.button,
.woocommerce-checkout .woocommerce a.button.alt,
.woocommerce-checkout .woocommerce button.button.alt,
.woocommerce-checkout #place_order {
	background: var(--dafo-navy) !important;
	background-image: none !important;
	color: #fff !important;
	font-family: var(--dafo-body) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0.6px !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	border: 0 !important;
	border-radius: 8px !important;
	padding: 13px 22px !important;
	line-height: 1.2 !important;
	box-shadow: none !important;
	text-shadow: none !important;
	cursor: pointer;
	transition: background .2s ease, transform .2s ease !important;
}
.woocommerce-cart .woocommerce a.button:hover,
.woocommerce-cart .woocommerce button.button:hover,
.woocommerce-cart .woocommerce input.button:hover,
.woocommerce-cart .woocommerce a.button.alt:hover,
.woocommerce-cart .woocommerce button.button.alt:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-checkout .woocommerce a.button:hover,
.woocommerce-checkout .woocommerce button.button:hover,
.woocommerce-checkout .woocommerce input.button:hover,
.woocommerce-checkout .woocommerce a.button.alt:hover,
.woocommerce-checkout .woocommerce button.button.alt:hover,
.woocommerce-checkout #place_order:hover {
	background: var(--dafo-deep) !important;
	color: #fff !important;
	transform: translateY(-1px);
}
.woocommerce-cart .woocommerce button.button:disabled,
.woocommerce-cart .woocommerce button.button[disabled],
.woocommerce-checkout .woocommerce button.button:disabled {
	opacity: .5 !important;
	transform: none !important;
	cursor: not-allowed;
}

/* ======================================================================
   3. CARRITO - tabla del carrito como card
   ====================================================================== */
.woocommerce-cart .woocommerce-cart-form {
	background: var(--dafo-white) !important;
	border: 1px solid var(--dafo-border) !important;
	border-radius: 16px !important;
	box-shadow: var(--dafo-shadow);
	padding: 8px 20px;
	margin-bottom: 28px;
}
.woocommerce-cart .woocommerce-cart-form table.shop_table {
	border: 0 !important;
	border-radius: 0 !important;
	margin: 0 !important;
	background: transparent !important;
}
.woocommerce-cart .woocommerce-cart-form table.shop_table thead th {
	border: 0 !important;
	border-bottom: 1px solid var(--dafo-border) !important;
	font-family: var(--dafo-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(4,4,74,.6) !important;
	padding: 16px 12px;
}
.woocommerce-cart .woocommerce-cart-form table.shop_table td {
	border: 0 !important;
	border-bottom: 1px solid var(--dafo-line) !important;
	padding: 18px 12px;
	vertical-align: middle;
	font-size: 14px;
	color: var(--dafo-text);
	background: transparent !important;
}
.woocommerce-cart .woocommerce-cart-form table.shop_table tr:last-child td { border-bottom: 0 !important; }
.woocommerce-cart .cart_item .product-thumbnail img {
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid var(--dafo-border);
}
.woocommerce-cart .cart_item .product-name a {
	color: var(--dafo-navy) !important;
	font-weight: 600;
	text-decoration: none;
}
.woocommerce-cart .cart_item .product-name a:hover { color: var(--dafo-blue) !important; }
.woocommerce-cart .cart_item .product-price,
.woocommerce-cart .cart_item .product-subtotal { color: var(--dafo-text); font-weight: 600; }

/* ======================================================================
   FIX PRECIO EN 1 LINEA (carrito + checkout)
   CAUSA REAL (verificada con dev tools): la fuente "Gotham" tiene el glifo
   del ESPACIO DURO U+00A0 ( ) ROTO -> lo renderiza ~345px de ancho.
   WooCommerce arma el precio como $<span.currencySymbol>&nbsp;200,00, asi que
   ese nbsp infla cada importe a ~410px y lo parte en 2 lineas / desborda.
   Comprobado: "a&nbsp;b" en Gotham = 367px vs "a b" = 22px; los digitos y el
   espacio normal en Gotham SON normales (solo el nbsp esta roto).
   FIX: renderizar SOLO el importe con Montserrat (fallback de marca, nbsp OK)
   + white-space:nowrap. NO toca el precio del curso (.dafo-price-amount, otro
   markup) ni el resto del texto en Gotham. Reemplaza el viejo hack de
   overflow:hidden + inline-block (que clipeaba sin evitar el wrap). */
.woocommerce-cart .woocommerce-Price-amount,
.woocommerce-cart .woocommerce-Price-amount bdi,
.woocommerce-checkout .woocommerce-Price-amount,
.woocommerce-checkout .woocommerce-Price-amount bdi {
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif !important;
	white-space: nowrap !important;
}
.woocommerce-cart .woocommerce-Price-amount .woocommerce-Price-currencySymbol,
.woocommerce-checkout .woocommerce-Price-amount .woocommerce-Price-currencySymbol {
	display: inline;
	float: none;
}
/* El boton #place_order incluye el total como TEXTO PLANO ("Place Order $&nbsp;200,00",
   sin span de precio), asi que arrastra el mismo nbsp roto de Gotham y se parte en 2
   lineas en mobile. Render del label con Montserrat + nowrap (va despues de la regla
   de botones de la seccion 2, asi gana en orden de cascada). */
.woocommerce-checkout #place_order {
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif !important;
	white-space: nowrap !important;
}

/* Reparto de columnas en desktop: nombre amplio, montos compactos.
   Solo >768px -> en mobile WC apila la tabla (shop_table_responsive). */
@media (min-width: 769px) {
	.woocommerce-cart .woocommerce-cart-form table.shop_table { table-layout: fixed; width: 100%; }
	.woocommerce-cart .woocommerce-cart-form table.shop_table .product-remove { width: 44px; }
	.woocommerce-cart .woocommerce-cart-form table.shop_table .product-thumbnail { width: 96px; }
	.woocommerce-cart .woocommerce-cart-form table.shop_table .product-price { width: 130px; }
	.woocommerce-cart .woocommerce-cart-form table.shop_table .product-quantity { width: 120px; }
	.woocommerce-cart .woocommerce-cart-form table.shop_table .product-subtotal { width: 130px; }
	.woocommerce-cart .cart_item .product-name { word-break: break-word; }
}

/* Quitar item (x) */
.woocommerce-cart .cart_item .product-remove a.remove {
	color: rgba(4,4,74,.5) !important;
	font-size: 18px;
	width: 22px;
	height: 22px;
	line-height: 20px;
	border-radius: 9999px;
	transition: background .2s ease, color .2s ease;
}
.woocommerce-cart .cart_item .product-remove a.remove:hover {
	background: #FEEAEA !important;
	color: #DC2626 !important;
}

/* Cantidad */
.woocommerce-cart .quantity input.qty {
	border: 1px solid var(--dafo-border) !important;
	border-radius: 8px !important;
	padding: 8px 6px;
	background: #fff !important;
	color: var(--dafo-text);
	font-family: var(--dafo-body);
}
.woocommerce-cart .quantity input.qty:focus {
	border-color: var(--dafo-navy) !important;
	outline: 0;
	box-shadow: 0 0 0 3px rgba(0,8,119,.12);
}

/* Fila de acciones (cupon + actualizar) */
.woocommerce-cart .woocommerce-cart-form .actions { padding: 18px 0 8px; }
.woocommerce-cart .woocommerce-cart-form .coupon { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.woocommerce-cart .woocommerce-cart-form .coupon #coupon_code {
	border: 1px solid var(--dafo-border) !important;
	border-radius: 8px !important;
	padding: 12px 14px;
	min-width: 180px;
	background: #fff !important;
	font-family: var(--dafo-body);
	font-size: 13px;
	color: var(--dafo-text);
}
.woocommerce-cart .woocommerce-cart-form .coupon #coupon_code:focus {
	border-color: var(--dafo-navy) !important;
	outline: 0;
	box-shadow: 0 0 0 3px rgba(0,8,119,.12);
}

/* ======================================================================
   4. CARRITO - Totales del carrito como card
   ====================================================================== */
.woocommerce-cart .cart-collaterals .cart_totals {
	background: var(--dafo-white) !important;
	border: 1px solid var(--dafo-border) !important;
	border-radius: 16px !important;
	box-shadow: var(--dafo-shadow);
	padding: 24px;
	float: right;
}
.woocommerce-cart .cart_totals h2 {
	font-family: var(--dafo-head);
	font-weight: 400;
	font-size: 20px;
	letter-spacing: 0.3px;
	color: var(--dafo-deep) !important;
	margin: 0 0 16px;
}
.woocommerce-cart .cart_totals table.shop_table { border: 0 !important; margin: 0 !important; }
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
	border: 0 !important;
	border-bottom: 1px solid var(--dafo-line) !important;
	padding: 14px 0;
	background: transparent !important;
	font-size: 14px;
	color: var(--dafo-text);
}
.woocommerce-cart .cart_totals table.shop_table th {
	font-family: var(--dafo-body);
	font-weight: 600;
	color: rgba(4,4,74,.75);
}
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
	border-bottom: 0 !important;
	padding-top: 16px;
}
.woocommerce-cart .cart_totals .order-total th { color: var(--dafo-deep); font-weight: 700; }
.woocommerce-cart .cart_totals .order-total td,
.woocommerce-cart .cart_totals .order-total .amount {
	color: var(--dafo-navy) !important;
	font-weight: 700;
	font-size: 18px;
}
.woocommerce-cart .wc-proceed-to-checkout { padding-top: 18px !important; }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	display: block;
	width: 100%;
	text-align: center;
	font-size: 14px !important;
}

/* ======================================================================
   5. CHECKOUT - headings de seccion
   ====================================================================== */
.woocommerce-checkout .woocommerce h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-additional-fields > h3,
.woocommerce-checkout .woocommerce-shipping-fields h3 {
	font-family: var(--dafo-head) !important;
	font-weight: 400 !important;
	font-size: 18px;
	letter-spacing: 0.3px;
	color: var(--dafo-deep) !important;
}

/* ======================================================================
   6. CHECKOUT - campos de formulario
   ====================================================================== */
.woocommerce-checkout .woocommerce form .form-row label {
	font-family: var(--dafo-body);
	font-size: 12px;
	font-weight: 600;
	color: var(--dafo-deep) !important;
	letter-spacing: 0.2px;
	margin-bottom: 6px;
}
.woocommerce-checkout .woocommerce form .form-row .required,
.woocommerce-checkout .woocommerce form .form-row abbr.required {
	color: var(--dafo-blue) !important;
	border: 0;
	text-decoration: none;
}
.woocommerce-checkout .woocommerce form .form-row input.input-text,
.woocommerce-checkout .woocommerce form .form-row textarea,
.woocommerce-checkout .woocommerce form .form-row select,
.woocommerce-checkout .woocommerce-checkout select {
	border: 1px solid var(--dafo-border) !important;
	border-radius: 8px !important;
	padding: 12px 14px !important;
	background: #fff !important;
	font-family: var(--dafo-body);
	font-size: 14px;
	color: var(--dafo-text);
	box-shadow: none !important;
	line-height: 1.3;
}
.woocommerce-checkout .woocommerce form .form-row input.input-text:focus,
.woocommerce-checkout .woocommerce form .form-row textarea:focus,
.woocommerce-checkout .woocommerce form .form-row select:focus {
	border-color: var(--dafo-navy) !important;
	outline: 0;
	box-shadow: 0 0 0 3px rgba(0,8,119,.12) !important;
}
.woocommerce-checkout .woocommerce form .form-row input.input-text::placeholder,
.woocommerce-checkout .woocommerce form .form-row textarea::placeholder { color: rgba(4,4,74,.4); }

/* select2 (Pais / Provincia) */
.woocommerce-checkout .select2-container--default .select2-selection--single {
	border: 1px solid var(--dafo-border) !important;
	border-radius: 8px !important;
	height: 46px !important;
	background: #fff !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 44px !important;
	padding-left: 14px;
	color: var(--dafo-text);
	font-family: var(--dafo-body);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height: 44px !important; }
.woocommerce-checkout .select2-container--open .select2-selection--single { border-color: var(--dafo-navy) !important; box-shadow: 0 0 0 3px rgba(0,8,119,.12); }
.select2-dropdown { border-color: var(--dafo-border); }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--dafo-navy) !important; }

/* ======================================================================
   7. CHECKOUT - "Tu pedido" / order review como card
   ====================================================================== */
.woocommerce-checkout #order_review,
.woocommerce-checkout .woocommerce-checkout-review-order {
	background: var(--dafo-white) !important;
	border: 1px solid var(--dafo-border) !important;
	border-radius: 16px !important;
	box-shadow: var(--dafo-shadow);
	padding: 24px;
	overflow: hidden;
}
.woocommerce-checkout #order_review_heading { margin-top: 0; }
.woocommerce-checkout .woocommerce-checkout-review-order-table {
	border: 0 !important;
	margin: 0 0 8px !important;
	width: 100% !important;
	table-layout: fixed;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table td {
	border: 0 !important;
	border-bottom: 1px solid var(--dafo-line) !important;
	padding: 12px 0 !important;
	font-size: 13px;
	color: var(--dafo-text);
	background: transparent !important;
	word-break: break-word;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
	font-family: var(--dafo-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(4,4,74,.6) !important;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table .product-total,
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total { text-align: right; white-space: nowrap; width: 38%; }
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
	font-family: var(--dafo-body);
	font-weight: 600;
	color: rgba(4,4,74,.78);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th { color: var(--dafo-deep) !important; font-weight: 700; }
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total .amount {
	color: var(--dafo-navy) !important;
	font-weight: 700;
	font-size: 18px;
}

/* ======================================================================
   8. CHECKOUT - caja de pago (#payment)
   ====================================================================== */
.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-checkout-payment {
	background: #fff !important;
	border: 1px solid var(--dafo-border) !important;
	border-radius: 12px !important;
	margin-top: 18px;
	padding: 6px 4px;
}
.woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 1px solid var(--dafo-line) !important;
	padding: 8px 16px;
}
.woocommerce-checkout #payment ul.payment_methods li {
	font-family: var(--dafo-body);
	color: var(--dafo-text);
}
.woocommerce-checkout #payment ul.payment_methods li label {
	font-weight: 600;
	color: var(--dafo-deep) !important;
}
.woocommerce-checkout #payment input[type="radio"] { accent-color: var(--dafo-navy); }
.woocommerce-checkout #payment div.payment_box {
	background: #F0F8FF !important;
	border-radius: 8px !important;
	color: rgba(4,4,74,.78);
	font-size: 13px;
}
.woocommerce-checkout #payment div.payment_box::before {
	border-bottom-color: #F0F8FF !important;
}
.woocommerce-checkout #payment .place-order { padding: 16px; }
.woocommerce-checkout #place_order { display: block; width: 100%; text-align: center; }

/* Terminos y condiciones */
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { color: rgba(4,4,74,.75); font-size: 13px; }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a { color: var(--dafo-navy); font-weight: 600; }
.woocommerce-checkout form.checkout #payment input#terms { accent-color: var(--dafo-navy); }

/* Toggle de cupon en checkout */
.woocommerce-checkout form.checkout_coupon {
	background: #fff !important;
	border: 1px solid var(--dafo-border) !important;
	border-radius: 12px !important;
	box-shadow: var(--dafo-shadow);
}
.woocommerce-checkout form.checkout_coupon .form-row input.input-text {
	border: 1px solid var(--dafo-border) !important;
	border-radius: 8px !important;
}

/* Login toggle (por si guest checkout muestra login) */
.woocommerce-checkout form.login,
.woocommerce-checkout form.register {
	background: #fff !important;
	border: 1px solid var(--dafo-border) !important;
	border-radius: 12px !important;
	box-shadow: var(--dafo-shadow);
}

/* ======================================================================
   9. RESPONSIVE - mobile sin overflow (WC apila la tabla en <=768px)
   ====================================================================== */
@media (max-width: 768px) {
	.woocommerce-cart .cart-collaterals .cart_totals { float: none; width: 100%; }
	.woocommerce-cart .woocommerce-cart-form { padding: 4px 14px; }
	.woocommerce-cart .woocommerce-cart-form .coupon { width: 100%; }
	.woocommerce-cart .woocommerce-cart-form .coupon #coupon_code { flex: 1 1 auto; min-width: 0; }
	.woocommerce-cart .woocommerce-cart-form .coupon button { flex: 0 0 auto; }
	.woocommerce-checkout #order_review,
	.woocommerce-checkout .cart_totals,
	.woocommerce-checkout #payment { border-radius: 14px !important; }
	.woocommerce-cart .cart_totals { padding: 18px; }
	.woocommerce-checkout #order_review { padding: 18px; }
}
@media (max-width: 480px) {
	.woocommerce-cart .cart_item .product-thumbnail img { width: 48px; height: 48px; }
	.woocommerce-cart .woocommerce-cart-form table.shop_table th,
	.woocommerce-cart .woocommerce-cart-form table.shop_table td { padding: 12px 8px; }
}

/* ======================================================================
   10. CHECKOUT v1.2 - fixes para Astra "Modern Checkout" (ast-modern-checkout)
       Agente Gestor 2026-06-26. El theme usa el layout de 2 columnas de Astra
       Pro; estas reglas resuelven lo que el restyle base (secciones 6-7) no
       contemplaba de ese layout. Van al final -> ganan la cascada.
   ====================================================================== */

/* 10.1 Card "Tu pedido": el padding de la seccion 7 NO llevaba !important y
   Astra modern-checkout lo pisaba a 0 -> la tarjeta quedaba apretada. */
.woocommerce-checkout .woocommerce-checkout-review-order {
	padding: 26px 28px !important;
}

/* 10.2 Fila del producto en "Tu pedido": cantidad inline (no en lineas sueltas).
   Causa real: ".product-quantity" lleva "x&nbsp;1" y el &nbsp; en Gotham mide
   ~345px (mismo glifo roto que el fix de precios de la seccion FIX PRECIO),
   inflando la celda y partiendo la fila; ademas hay un &nbsp; suelto en la td.
   Fix: render del bloque del producto con Montserrat (nbsp OK) + thumbnail
   flotado y nombre/cantidad en flujo inline. El NOMBRE vuelve a Gotham; solo
   la cantidad y el nbsp suelto quedan en Montserrat. */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name {
	display: block !important;
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif !important;
	line-height: 1.4;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .ast-product-image { display: inline !important; }
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .ast-product-thumbnail { float: left; margin: 0 12px 0 0; }
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .ast-product-thumbnail img {
	width: 48px; height: 48px; object-fit: cover;
	border-radius: 8px; border: 1px solid var(--dafo-border); display: block;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .ast-product-name {
	display: inline !important;
	font-family: var(--dafo-body) !important;
	font-size: 13px; color: var(--dafo-text); font-weight: 600;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name .product-quantity {
	display: inline-block;
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif !important;
	white-space: nowrap !important;
	font-size: 11px; font-weight: 700;
	color: var(--dafo-navy);
	background: var(--dafo-bg);
	border: 1px solid var(--dafo-border);
	border-radius: 999px;
	padding: 1px 8px; margin-left: 6px;
	vertical-align: middle;
}
/* Mismo fix de cantidad en la review mobile colapsable de Astra */
.woocommerce-checkout .ast-mobile-order-review-wrap > div:last-child { padding: 0 20px 20px !important; }

/* 10.3 select2 Pais / Estado (form-row "ast-animate-input"): la "floating label"
   de Astra NO flota en select2 -> la label quedaba encimada arriba, el valor
   caia debajo del box y el asterisco (precedido de &nbsp; en Gotham, ~345px)
   flotaba a la derecha. Fix: label estatica ARRIBA en Montserrat (neutraliza el
   nbsp y deja el asterisco en su lugar) + valor verticalmente centrado dentro
   del box (height fija + flex; Astra metia padding-top ~24px que tiraba el valor
   fuera del box). */
.woocommerce-checkout #billing_country_field,
.woocommerce-checkout #billing_state_field,
.woocommerce-checkout .woocommerce form .form-row.ast-animate-input:has(.select2-container) {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.woocommerce-checkout #billing_country_field > label,
.woocommerce-checkout #billing_state_field > label,
.woocommerce-checkout .woocommerce form .form-row.ast-animate-input:has(.select2-container) > label {
	position: static !important;
	transform: none !important;
	pointer-events: auto !important;
	display: block !important;
	width: auto !important;
	padding: 0 !important;
	margin: 0 0 6px !important;
	font-family: Montserrat, "Helvetica Neue", Arial, sans-serif !important;
	font-size: 12px !important;
	line-height: 1.3 !important;
	background: transparent !important;
	white-space: normal !important;
	overflow: visible !important;
	text-overflow: clip !important;
}
.woocommerce-checkout #billing_country_field > label .required,
.woocommerce-checkout #billing_state_field > label .required,
.woocommerce-checkout .woocommerce form .form-row.ast-animate-input:has(.select2-container) > label .required {
	position: static !important;
	float: none !important;
	right: auto !important;
	margin-left: 2px !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single {
	height: 46px !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center !important;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 1.2 !important;
	padding: 0 30px 0 14px !important;
	margin: 0 !important;
	flex: 1 1 auto;
	min-width: 0;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 44px !important;
	top: 1px !important;
}

/* 10.4 Inputs y selects del checkout a la misma altura de marca (~46px). */
.woocommerce-checkout .woocommerce form .form-row input.input-text,
.woocommerce-checkout .woocommerce form .form-row select {
	min-height: 46px !important;
}

/* 10.5 Mobile (<=600px): apilar a ancho completo las filas en columnas
   (Nombre/Apellidos, Direccion 50/50 y Localidad/Estado/CP al 33%). En el
   modern-checkout de Astra esas filas seguian en columnas de ~116px en el
   telefono -> labels y el valor del select2 ("Buenos Aires") se cortaban. */
@media (max-width: 600px) {
	.woocommerce-checkout .woocommerce form .form-row.form-row-first,
	.woocommerce-checkout .woocommerce form .form-row.form-row-last,
	.woocommerce-checkout .woocommerce form .form-row[class*="ast-column-"] {
		float: none !important;
		clear: both !important;
		width: 100% !important;
		max-width: 100% !important;
		flex: 0 0 100% !important;
		margin-right: 0 !important;
	}
}


/* 10.6 Table 'Tu pedido' (order review table): Astra Modern Checkout aplica
   box-shadow:0 0 0 1px rgb(209,213,219) creando un rectangulo INTERNO dentro del
   card exterior. border:0!important (seccion 7) no lo elimina porque box-shadow es
   una propiedad distinta. Agente Gestor 2026-06-26. */
.woocommerce-checkout table.woocommerce-checkout-review-order-table {
	box-shadow: none !important;
}

/* wmc-title fw400 */
.wmc-title{font-weight:400 !important;}