/* ============================================================
   CHECKOUT - Carrito, Envio, Pago, Confirmacion.
   Se carga solo en is_cart() / is_checkout() (ver inc/enqueue.php).
   Se completa en el modulo de Checkout.
   ============================================================ */

/* Carrito y Checkout (con productos) - misma "capa transaccional" clara
   que ya usa el Personalizador (fondo oscuro de marca reservado para
   Home/Categoria/Producto). Reutiliza los MISMOS valores del tema claro
   que ya existen en base.css (":root[data-theme='light']", hoy inerte/
   sin usar) en vez de inventar colores nuevos - al redefinir aqui las
   mismas variables (--bg, --ink, etc.) que ya usa todo el CSS del sitio,
   el fondo Y el texto (encabezados, precios, tabla de productos, campos
   del formulario nativo de WooCommerce) cambian juntos a la version
   clara y legible, sin tocar la estructura/funcionalidad de la pagina
   real de WooCommerce. Escopado a las clases que WooCommerce ya agrega
   el solo a esas 2 paginas especificas - no afecta ninguna otra. */
  body.woocommerce-cart,
  body.woocommerce-checkout{
    --bg:#f7f3ea;
    --bg-raised:#ffffff;
    /* Gris "plomo" en vez del crema/mostaza original (pedido del cliente
       2026-08-26: "esa estetica no me gusta... un color un poquito mas
       plomo") - afecta el recuadro de "Envio por [metodo]" y la caja del
       cupon, que son los 2 que uso como referencia. --line tambien pasa
       de un tinte dorado a gris neutro, ya que son los bordes de esas
       mismas cajas. */
    --bg-raised-2:#eef0f2;
    --ink:#1b160e;
    --ink-muted:#5d5340;
    --line:rgba(30,30,30,0.14);
  }

/* Checkout: fondo blanco (no crema/mostaza) y sin naranja (pedido del
   cliente 2026-08-21: "somos Premium... solamente paginas blancas y
   negras") - mismo patron ya probado en el Carrito (forzar la propiedad
   "background" real en vez de confiar solo en la variable "--bg", que
   alguna otra regla del tema ya pisaba). La variable "--flow-orange" se
   redefine SOLO para este body - todo lo que ya la usa mas abajo en este
   archivo (boton "Continuar con el pago", "Editar mis datos") cambia
   junto, sin tocar el valor global (usado en Personalizador para cosas
   que el cliente no pidio cambiar). */
  body.woocommerce-checkout,
  body.woocommerce-checkout #content,
  body.woocommerce-checkout .container,
  body.woocommerce-checkout .site-content{background:#ffffff !important;}
  body.woocommerce-checkout{--flow-orange:#1b160e;--flow-orange-dark:#3a3a3a;}

/* Recordatorio de envio arriba de "Tu pedido" (pedido del cliente
   2026-08-21). */
  body.woocommerce-checkout .tf-pay-summary-head{
    max-width:640px;margin:0 auto 18px;
  }
  body.woocommerce-checkout .tf-pay-summary-eta{
    display:flex;align-items:center;gap:10px;
    background:var(--bg-raised-2);border-radius:6px;padding:12px 16px;margin:0;
    font-family:'Barlow';font-size:13px;font-weight:600;color:var(--ink);
  }
  body.woocommerce-checkout .tf-pay-summary-eta svg{width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.6;flex-shrink:0;}

/* Cupon reubicado DENTRO de la tabla de "Tu pedido", justo despues de
   los productos y antes del Subtotal/Total (fila propia
   "tf-pay-coupon-row", ver inc/woocommerce.php) - estilo AliExpress
   ("Cupón de descuento" + flechita, pedido del cliente 2026-08-21: "no
   preguntes si tienes un cupon... quiero que sea como AliExpress, el
   cliente machuca la flechita y se despliega abajo"). El texto/icono
   real los reemplaza assets/js/checkout.js (el link ".showcoupon"
   original de WooCommerce NUNCA se destruye, solo se le cambia el
   contenido visual, para no perder su propio manejador de clic ya
   delegado por WooCommerce). */
  .tf-pay-coupon-row td{padding:0 !important;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .tf-pay-coupon-row .woocommerce-info{background:none;border:0;padding:0;margin:0;font-size:0;}
  /* "#order_review" (ID) en el selector a proposito - confirmado en vivo
     el 2026-08-21 que Woodmart trae ":root :is(.woocommerce-form-coupon-toggle,
     ...) > div :is(.showlogin,.showcoupon){color:var(--wd-primary-color)
     !important}", con 3 clases de especificidad contra las 2 mias -
     empate perdido incluso con !important de los 2 lados. Un ID le gana
     a cualquier cantidad de clases, sin depender del orden de carga. */
  /* Reforzado 2026-08-26: un cliente real ("Sebastian...") no encontro
     donde poner su codigo de descuento en una compra real - el link de
     texto plano de 13px se perdia junto al resto del contenido. Pedido
     explicito del cliente: mantener el estilo compacto tipo AliExpress
     (sigue siendo UNA fila con flechita, nunca un campo de formulario
     grande) pero mucho mas notorio - fondo propio tipo "tarjeta" (mismo
     "--bg-raised-2" ya usado en tf-pay-summary-eta/tf-earned-coupon-btn,
     no color nuevo), icono de etiqueta + texto mas grande, para que el
     ojo lo detecte sin tener que leer todo el checkout. Paleta blanco/
     negro respetada (pedido del cliente 2026-08-21: "somos Premium...
     solo paginas blancas y negras") - nada de dorado/naranja aqui. */
  #order_review .tf-pay-coupon-row a.showcoupon{
    display:flex;align-items:center;justify-content:space-between;width:100%;
    background:var(--bg-raised-2);border:1px solid var(--line);border-radius:6px;
    padding:14px 16px;margin:14px 0;
    font-family:'Oswald';font-weight:700;font-size:15px;letter-spacing:.02em;text-transform:uppercase;
    color:var(--ink) !important;text-decoration:none;
  }
  .tf-coupon-label{display:flex;align-items:center;gap:10px;}
  /* Rebote sutil del icono al cargar la pagina (pedido del cliente
     2026-08-26: "un movimiento para que enganche al cliente") - corre
     solo 3 veces con un pequeño delay y despues se detiene solo, para
     llamar la atencion sin quedar parpadeando todo el checkout (se veria
     poco profesional en una marca "Premium"). Se apaga por completo una
     vez que el cliente ya abrio el cupon (aria-expanded="true") - ya
     cumplio su función. */
  @keyframes tfCouponBounce{
    0%, 100%{transform:translateY(0);}
    20%{transform:translateY(-4px);}
    40%{transform:translateY(0);}
    60%{transform:translateY(-3px);}
    80%{transform:translateY(0);}
  }
  .tf-coupon-label svg{
    width:20px;height:20px;stroke:var(--ink);fill:none;stroke-width:1.8;flex-shrink:0;
    /* Pedido del cliente 2026-08-27: "que rebote siempre, no solo 2 veces,
       para llamar la atencion" - de 3 repeticiones a infinito. */
    animation:tfCouponBounce 1.6s ease-in-out 1s infinite;
  }
  .tf-pay-coupon-row a.showcoupon[aria-expanded="true"] .tf-coupon-label svg{animation:none;}
  .tf-coupon-chevron svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:2;transition:transform .15s ease;flex-shrink:0;}
  .tf-pay-coupon-row a.showcoupon[aria-expanded="true"] .tf-coupon-chevron svg{transform:rotate(180deg);}
  .tf-pay-coupon-row .woocommerce-form-coupon{margin:0 0 14px;}

/* Lista de codigos ganados por reseñas (pedido del cliente 2026-08-23:
   "que le haga ahí una lista, y él seleccione su código", no que lo
   escriba) - vive DENTRO del mismo desplegable nativo de cupon (arriba
   del campo de texto real), para clientes con sesion iniciada que ya
   ganaron alguno. */
  .tf-earned-coupons{margin-top:14px;}
  .tf-earned-coupons-title{font-family:'Oswald';font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 8px;}
  .tf-earned-coupon-btn{
    display:flex;align-items:center;justify-content:space-between;width:100%;
    background:var(--bg-raised-2);border:1px solid var(--line);border-radius:4px;
    padding:11px 14px;margin-bottom:8px;cursor:pointer;text-align:left;
    font-family:'Oswald';font-size:13px;color:var(--ink);
  }
  .tf-earned-coupon-btn:hover{border-color:var(--ink);}
  .tf-earned-coupon-code{font-weight:600;letter-spacing:.03em;}
  .tf-earned-coupon-pct{font-weight:700;color:var(--ink);}
  .tf-earned-coupons-note{font-family:'Barlow';font-size:11.5px;color:var(--ink-muted);margin:2px 0 0;}

/* Franjas de confianza tipo AliExpress ("Entrega rapida"/"Seguridad y
   Privacidad") - antes de los metodos de pago nativos. */
  body.woocommerce-checkout .tf-pay-trust{
    max-width:640px;margin:0 auto 18px;display:flex;flex-direction:column;gap:14px;
  }
  body.woocommerce-checkout .tf-pay-trust-block{
    border:1px solid var(--line);border-radius:6px;padding:14px 16px;
  }
  body.woocommerce-checkout .tf-pay-trust-block strong{
    display:block;font-family:'Oswald';font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);margin-bottom:8px;
  }
  body.woocommerce-checkout .tf-pay-trust-block span{
    display:flex;align-items:center;gap:8px;font-family:'Barlow';font-size:12.5px;color:var(--ink-muted);margin-top:6px;
  }
  body.woocommerce-checkout .tf-pay-trust-block span:first-of-type{margin-top:0;}
  body.woocommerce-checkout .tf-pay-trust-block svg{width:15px;height:15px;stroke:#2f9e5c;fill:none;stroke-width:2;flex-shrink:0;}

/* Cajas de "Confirma tus datos" (incluye adentro "Detalles de Agencia" -
   confirmado en vivo el 2026-08-21 que "#custom_shipping_agency_fields"
   vive DENTRO de ".customer-details", no al lado - por eso NO lleva su
   propia tarjeta, se veria "caja dentro de caja") y "Tu pedido" pegadas
   de borde a borde (pedido del cliente: "quita mucha credibilidad") -
   mismo ancho/tarjeta (borde + esquinas redondeadas + relleno) que ya
   usan las pantallas de Envio (.env-main, envio.css), para que se sienta
   como la MISMA pantalla en vez de una distinta. */
  body.woocommerce-checkout .customer-details,
  body.woocommerce-checkout .checkout-order-review{
    max-width:640px;margin:0 auto 22px;padding:28px 30px;
    border:1px solid var(--line);border-radius:6px;background:var(--bg-raised);
  }
  /* ".checkout-order-review" ya tiene su propio borde negro definido mas
     abajo en este archivo (regla preexistente) - no se repite aqui. */
  @media (max-width:640px){
    body.woocommerce-checkout .customer-details,
    body.woocommerce-checkout .checkout-order-review{padding:22px 18px;}
  }

/* Precios del Checkout - Woodmart trae su propio color global (amarillo)
   para .woocommerce-Price-amount; se sobreescribe en toda la pagina
   (pedido del cliente 2026-08-21: "no quiero ningun precio en
   amarillo"). */
  body.woocommerce-checkout .woocommerce-Price-amount,
  body.woocommerce-checkout .amount{color:var(--ink) !important;}

/* Carrito vacio - WooCommerce/Woodmart traen su fuente serif y colores
   oscuros por defecto pensados para fondo blanco; con el fondo oscuro ya
   forzado (ver pages.css, seccion de fondos oscuros) esos colores quedan
   invisibles - se fuerzan aqui a los mismos que usa el resto del sitio.
   Escopado solo al estado vacio (no a ".woocommerce" en general) para no
   arriesgar el layout de la tabla del carrito/checkout cuando SI hay
   productos - eso todavia no se revisa en este modulo. */
  .cart-empty.wd-empty-page{
    max-width:1080px;margin:64px auto 0;padding:0 28px;text-align:center;
    font-family:'Anton';font-size:clamp(26px,3.4vw,36px);color:var(--ink) !important;
  }
  .wd-empty-page-text{color:var(--ink-muted) !important;font-size:14.5px;max-width:44ch;margin:14px auto 28px;text-align:center;}
  .return-to-shop{text-align:center;padding-bottom:90px;}
  .return-to-shop .button.wc-backward{
    display:inline-flex;align-items:center;justify-content:center;
    background:var(--gold);color:#1b1305;border:1px solid var(--gold);
    font-family:'Oswald';font-weight:600;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
    padding:14px 28px;cursor:pointer;transition:background .15s,color .15s;
  }
  .return-to-shop .button.wc-backward:hover{background:transparent;color:var(--gold);}

/* Checkout con productos (Pago) - no repetir datos ya capturados en
   Envio-Datos/Detalle. Los campos obsoletos de abajo (sistema manual de
   un desarrollador anterior para Shalom/Olva: nombre de agencia escrito a
   mano + subir una captura del sitio web) se OCULTAN, nunca se editan -
   se reemplazan por el buscador real de Envio-Detalle. Ojo: la subida de
   captura SI es obligatoria del lado del plugin (confirmado en vivo el
   2026-08-05 - bloqueaba el pedido con "Por favor, sube la captura...")
   pese a estar oculta aqui; ver tf_child_checkout_strip_redundant_field_errors()
   en inc/woocommerce.php, que limpia ese aviso especifico. */
  #shalom_agency_field,
  #olva_agency_field,
  .shalom-agency-screenshot-wrap,
  .olva-agency-screenshot-wrap{display:none !important;}
  label[for="shalom_agency_screenshot"],
  label[for="olva_agency_screenshot"],
  #shalom_agency_screenshot,
  #olva_agency_screenshot{display:none !important;}

/* Departamento/Provincia/Distrito/Calle (plugin "Ubigeo Peru", campos
   "billing_departamento"/"billing_provincia"/"billing_distrito"/
   "billing_address_1" - NO son lo mismo que "billing_state" nativo de
   WooCommerce, que ya viene oculto solo) - SIEMPRE duplican lo que ya se
   capturo en Envio-Datos, sin importar el metodo (Motorizado incluido, a
   pedido explicito del cliente). ".tf-envio-{metodo}" en el body lo
   agrega tf_child_checkout_body_class() (inc/woocommerce.php) segun el
   metodo real en sesion - sin esa clase (nunca se eligio un metodo) se
   dejan visibles, como venian por defecto. */
  body.woocommerce-checkout.tf-envio-shalom #billing_departamento_field,
  body.woocommerce-checkout.tf-envio-shalom #billing_provincia_field,
  body.woocommerce-checkout.tf-envio-shalom #billing_distrito_field,
  body.woocommerce-checkout.tf-envio-shalom #billing_address_1_field,
  body.woocommerce-checkout.tf-envio-olva #billing_departamento_field,
  body.woocommerce-checkout.tf-envio-olva #billing_provincia_field,
  body.woocommerce-checkout.tf-envio-olva #billing_distrito_field,
  body.woocommerce-checkout.tf-envio-olva #billing_address_1_field,
  body.woocommerce-checkout.tf-envio-bus #billing_departamento_field,
  body.woocommerce-checkout.tf-envio-bus #billing_provincia_field,
  body.woocommerce-checkout.tf-envio-bus #billing_distrito_field,
  body.woocommerce-checkout.tf-envio-bus #billing_address_1_field,
  body.woocommerce-checkout.tf-envio-motorizado #billing_departamento_field,
  body.woocommerce-checkout.tf-envio-motorizado #billing_provincia_field,
  body.woocommerce-checkout.tf-envio-motorizado #billing_distrito_field,
  body.woocommerce-checkout.tf-envio-motorizado #billing_address_1_field{display:none !important;}

/* Campos ya capturados en Envio (ver assets/js/checkout.js, que agrega
   "readonly" + esta clase) - se ven como texto plano de resumen, no como
   un campo de formulario editable. "readonly" (no "disabled") para que
   el valor SI se siga enviando al completar el pedido - cero riesgo para
   el pedido real/Culqi, solo cambia como se ve. */
  .tf-readonly-field{
    background:var(--bg-raised) !important;border-color:var(--line) !important;
    color:var(--ink) !important;cursor:default !important;box-shadow:none !important;
  }
  .tf-readonly-field:focus{outline:none !important;}

/* Caja de resumen del metodo de envio elegido (tf_child_render_checkout_shipping_summary()
   en inc/woocommerce.php) - misma "capa transaccional" clara del resto
   del flujo de compra. */
  .tf-checkout-summary{
    background:var(--bg-raised);border:1px solid var(--line);border-radius:6px;
    padding:16px 18px;margin-bottom:22px;
  }
  .tf-checkout-summary-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px;}
  .tf-checkout-summary-label{font-family:'Oswald';font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-muted);}
  .tf-checkout-summary strong{font-family:'Oswald';font-size:14px;color:var(--ink);}
  .tf-checkout-summary p{margin:0;font-family:'Barlow';font-size:13px;color:var(--ink-muted);}
  .tf-checkout-summary-time{margin-top:4px !important;color:var(--ink) !important;font-weight:600;}

/* Link "Editar mis datos" inyectado por assets/js/checkout.js junto al
   titulo nuevo de la seccion de facturacion. */
  .tf-checkout-edit-link{
    font-family:'Oswald';font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;
    color:var(--ink);text-decoration:none;margin-left:12px;
  }
  .tf-checkout-edit-link:hover{text-decoration:underline;}

/* "Detalles de Agencia" (del desarrollador anterior, "#custom_shipping_agency_fields")
   - sus divs internos por metodo ("conditional-field", ej. shalom_agency
   ya oculto por CSS mas arriba) quedan vacios visualmente, se ocultan
   por completo. El resumen real (tf-checkout-summary, reubicado aqui
   por JS) y los botones de paso 2 los reemplazan. */
  #custom_shipping_agency_fields .conditional-field,
  #custom_shipping_agency_fields .example-image{display:none !important;}
  #custom_shipping_agency_fields h3{font-family:'Anton';font-size:17px;color:var(--ink);margin-bottom:14px;}

/* Paso 2 dentro del mismo Checkout (sin pagina nueva): "Continuar con el
   pago" oculta el formulario de Datos/Agencia y muestra el resumen del
   pedido + metodos de pago (#order_review, ya nativo de WooCommerce,
   nunca se toca su contenido) - ver assets/js/checkout.js. */
  .tf-checkout-step-actions{display:flex;align-items:center;gap:16px;margin-top:18px;}
  /* ".tf-checkout-step-actions" de mas en el selector (no solo la clase
     del boton sola) para ganarle a Woodmart - trae su propio
     ":is(.btn,.button,button,[type=submit],[type=button]){background:
     var(--btn-bgcolor,#F3F3F3)}" con la MISMA especificidad que un
     selector de una sola clase, y gana el empate por cargar despues -
     confirmado en vivo el 2026-08-06 (el boton salia gris claro de
     fabrica, no dorado/naranja). Mismo patron ya usado antes para el
     boton "Continuar" de Envio-Metodo. */
  .tf-checkout-step-actions .tf-checkout-continue-payment{
    background:var(--flow-orange,var(--gold)) !important;
    border:1px solid var(--flow-orange-dark,var(--gold-dim)) !important;
    color:#fff !important;
    font-family:'Oswald';font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
    padding:13px 30px;border-radius:4px;cursor:pointer;
  }
  /* "Editar mis datos" junto al boton de arriba - pedido del cliente el
     2026-08-06: mismo tratamiento de recuadro/borde visible que el
     boton de al lado, en vez de quedar como texto suelto (se ve como
     boton secundario, no como el CTA principal). Solo en ESTE lugar
     puntual (".tf-checkout-step-actions") - el mismo link se reusa
     tambien junto al titulo "Confirma tus datos...", donde se queda
     como texto simple, sin tocar ese otro uso. */
  .tf-checkout-step-actions .tf-checkout-edit-link{
    display:inline-flex;align-items:center;justify-content:center;
    border:1px solid var(--ink);border-radius:4px;
    padding:12px 24px;margin-left:0;
  }
  .tf-checkout-back-link{
    display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:0;margin-bottom:16px;
    font-family:'Oswald';font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;
    color:var(--ink-muted);cursor:pointer;
  }
  .tf-checkout-back-link:hover{color:var(--ink);}
  .tf-step-hidden{display:none !important;}

/* "Tu pedido" (resumen del pedido) - de fabrica su fondo (rgb(247,247,247))
   se mezclaba con el fondo claro de la pagina. Se agrega un borde recto
   en los 4 lados. El "boleto perforado" de Woodmart (::before/::after con
   un radial-gradient que recorta circulos) se dejo intacto en la entrega
   anterior a pedido del cliente, pero esos mismos pseudo-elementos quedan
   POSICIONADOS ENCIMA del borde superior/inferior (absolute, top:-10px /
   bottom:-10px) - confirmado en vivo el 2026-08-06: tapaban visualmente
   esas 2 lineas del borde nuevo, dejando solo los lados visibles. Pedido
   de la misma fecha, corregido: se quitan esos 2 pseudo-elementos del
   todo, para que el borde recto se vea completo en los 4 lados. */
  body.woocommerce-checkout .checkout-order-review{
    border:1px solid var(--ink) !important;
  }
  body.woocommerce-checkout .checkout-order-review::before,
  body.woocommerce-checkout .checkout-order-review::after{
    content:none !important;
  }

/* Paso 1 (Detalles de Agencia): un divisor simple ocupa el lugar de
   "Tu pedido" (ver assets/js/checkout.js, tfSetupCheckoutSteps()) -
   antes ese titulo se colaba solo (sin su tabla) en esta pantalla,
   duplicado/fuera de lugar, porque el titulo y la tabla son hermanos, no
   el titulo dentro de la tabla - confirmado en vivo el 2026-08-06. */
  .tf-checkout-step1-divider{
    border:0;border-top:1px solid var(--line);margin:28px 0 0;
  }

/* Formulario de tarjeta de Culqi (Numero de tarjeta/Fecha de caducidad/
   Codigo de seguridad) apareciendo visible ANTES de tiempo, reportado
   por el cliente el 2026-08-09 - confirmado en vivo que NO hay una
   segunda pasarela de Culqi (una sola, "fullculqi", bien configurada) y
   que el tema no toca nada de metodos de pago (grep completo, cero
   coincidencias). El propio plugin de Culqi SI lo esconde - se
   confirmo en vivo un estilo inline muy agresivo aplicado por su JS
   ("display:none!important;visibility:hidden!important;opacity:0
   !important;position:absolute!important;left:-9999px!important") -
   pero al venir de JS (no de una hoja de estilos), tarda en aplicarse
   hasta que ese script corre, dejando una ventana donde el formulario
   pinta visible sin estilo antes de que ese script lo esconda (mas
   probable con "cargar JS diferido/async" activo en LiteSpeed Cache).
   Esta regla es una red de seguridad real via CSS (que SI carga antes
   que cualquier JS diferido) - esconde este bloque especifico desde el
   primer pintado, sin depender de que el JS del plugin llegue a tiempo.
   Escopado solo a "payment_method_fullculqi" (no a CUALQUIER
   ".payment_box" del Checkout) para no esconder por accidente los
   campos de una futura pasarela distinta que si deba mostrarse inline. */
  /* Reforzado el 2026-08-25: "display" solo no bastaba en todos los
     casos (si algun script de terceros hace show()/hide() con jQuery,
     una asignacion directa - no "setProperty" con importancia - PUEDE
     borrar el "!important" puesto antes sobre esa MISMA propiedad,
     dejandolo visible de nuevo). Se agregan propiedades REDUNDANTES que
     ningun show()/hide() estandar toca (altura, overflow, posicion) -
     aunque "display" se llegue a revertir por fuera, el bloque sigue sin
     ocupar espacio ni poder verse. */
  body.woocommerce-checkout .payment_method_fullculqi .payment_box{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    position:absolute !important;
    pointer-events:none !important;
  }

  /* Reforzado el 2026-08-27 - CAUSA RAIZ REAL encontrada en vivo: el
     formulario de tarjeta que el cliente seguia viendo NO vive dentro de
     ".payment_box" (esa si estaba bien escondida, confirmado
     inspeccionando el DOM real del Checkout) - Culqi lo inyecta en un
     bloque HERMANO, directo dentro del <li> del metodo de pago
     (".gw-builder-form" > ".cardContainer" > "form.card-form"), que la
     regla de arriba nunca cubria. Mismas 7 propiedades redundantes que ya
     probaron ser necesarias arriba, aplicadas ahora al contenedor
     correcto. */
  body.woocommerce-checkout .payment_method_fullculqi .gw-builder-form,
  body.woocommerce-checkout .payment_method_fullculqi .cardContainer{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    max-height:0 !important;
    overflow:hidden !important;
    position:absolute !important;
    pointer-events:none !important;
  }