/* Travel Pass 34 — checkout vertical y optimizado para celular */

/* Los cinco datos se presentan siempre en una secuencia vertical clara. */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper{display:flex!important;flex-direction:column!important;gap:0;width:100%;min-width:0}
.woocommerce-checkout form.checkout .tp-checkout-field,
.woocommerce-checkout form.checkout .form-row-first.tp-checkout-field,
.woocommerce-checkout form.checkout .form-row-last.tp-checkout-field,
.woocommerce-checkout form.checkout .form-row-wide.tp-checkout-field{display:block!important;float:none!important;clear:both!important;width:100%!important;max-width:100%!important;margin:0 0 17px!important;padding:0!important}
.woocommerce-checkout form.checkout .tp-checkout-field input,
.woocommerce-checkout form.checkout .tp-checkout-field .input-text{display:block!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}

/* Evita que cualquier contenido interno ensanche las dos tarjetas. */
.woocommerce-checkout form.checkout,
.woocommerce-checkout form.checkout #customer_details,
.woocommerce-checkout form.checkout #order_review,
.woocommerce-checkout form.checkout .col2-set,
.woocommerce-checkout form.checkout .col-1,
.woocommerce-checkout form.checkout .woocommerce-billing-fields{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
.woocommerce-checkout form.checkout #customer_details .col-1{display:block!important;width:100%!important;float:none!important}
.woocommerce-checkout form.checkout #customer_details .col-2{display:none!important}

@media(max-width:1180px){
  /* Restablece filas además de columnas: sin esto ambas tarjetas se solapaban. */
  .woocommerce-checkout form.checkout{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto!important;gap:22px!important;width:100%!important}
  .woocommerce-checkout form.checkout #customer_details{grid-column:1!important;grid-row:1!important;margin:0!important}
  .woocommerce-checkout form.checkout #order_review_heading{display:none!important;grid-column:1!important;grid-row:auto!important}
  .woocommerce-checkout form.checkout #order_review{grid-column:1!important;grid-row:2!important;position:static!important;margin:0!important;width:100%!important}
}

@media(max-width:600px){
  .woocommerce-checkout .tp-wc-hero-compact{padding:34px 0!important}
  .woocommerce-checkout .tp-wc-hero h1{font-size:clamp(2.15rem,11vw,2.8rem)!important}
  .woocommerce-checkout .tp-wc-hero p{font-size:.88rem!important;line-height:1.55}
  .woocommerce-checkout .tp-wc-main{padding:28px 0 68px!important}
  .woocommerce-checkout .tp-wc-page-main>.tp-container{width:calc(100% - 20px)!important}
  .woocommerce-checkout .tp-checkout-intro{margin-bottom:18px!important;padding:21px 16px!important;border-radius:18px!important}
  .woocommerce-checkout .tp-checkout-intro h2{font-size:1.65rem!important;line-height:1.12!important}
  .woocommerce-checkout .tp-checkout-intro>p{margin-bottom:16px!important;font-size:.86rem!important;line-height:1.55!important}
  .woocommerce-checkout .tp-commerce-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%;gap:4px!important}
  .woocommerce-checkout .tp-commerce-steps span{min-width:0;padding:7px 3px!important;font-size:.5rem!important;white-space:nowrap}
  .woocommerce-checkout .tp-commerce-steps b{width:18px;height:18px;flex:0 0 18px}

  .woocommerce-checkout form.checkout{gap:16px!important}
  .woocommerce-checkout form.checkout #customer_details,
  .woocommerce-checkout form.checkout #order_review{padding:19px 14px!important;border-radius:18px!important;overflow:hidden!important}
  .woocommerce-checkout form.checkout #customer_details:before{font-size:1.45rem!important}
  .woocommerce-checkout #customer_details h3{margin-bottom:18px!important}
  .woocommerce-checkout #customer_details h3:after{font-size:.82rem!important;line-height:1.55!important}
  .woocommerce-checkout form.checkout .tp-checkout-field{margin-bottom:14px!important}
  .woocommerce-checkout form .tp-checkout-field label{margin-bottom:6px!important;font-size:.78rem!important}
  .woocommerce-checkout form .tp-checkout-field input.input-text{height:50px!important;min-height:50px!important;padding:0 13px!important;border-radius:11px!important;font-size:16px!important}

  .woocommerce-checkout #order_review table.shop_table{width:100%!important;table-layout:fixed!important;margin-bottom:16px!important}
  .woocommerce-checkout #order_review table.shop_table th,
  .woocommerce-checkout #order_review table.shop_table td{padding:11px 8px!important;font-size:.75rem!important;line-height:1.45!important;word-break:break-word}
  .woocommerce-checkout #order_review table.shop_table .product-name{width:66%!important;text-align:left!important}
  .woocommerce-checkout #order_review table.shop_table .product-total{width:34%!important;text-align:right!important}
  .woocommerce-checkout #payment ul.payment_methods{padding:15px 12px!important}
  .woocommerce-checkout #payment div.payment_box{margin:12px 0 0!important;padding:12px!important;font-size:.78rem!important;line-height:1.55!important}
  .woocommerce-checkout #payment .place-order{padding:14px 12px!important}
  .woocommerce-checkout #payment .woocommerce-privacy-policy-text{font-size:.74rem!important;line-height:1.55!important}
  .woocommerce-checkout #payment #place_order{width:100%!important;min-height:54px!important;margin:10px 0 0!important;padding:12px!important;font-size:.88rem!important;white-space:normal!important}

  .woocommerce-checkout .woocommerce-error,
  .woocommerce-checkout .woocommerce-info,
  .woocommerce-checkout .woocommerce-message{padding:15px 13px 15px 42px!important;font-size:.8rem!important;line-height:1.5!important}
}

@media(max-width:380px){
  .woocommerce-checkout .tp-commerce-steps span{display:grid!important;justify-items:center;gap:3px!important;white-space:normal;text-align:center}
  .woocommerce-checkout .tp-checkout-intro h2{font-size:1.5rem!important}
  .woocommerce-checkout form.checkout #customer_details,
  .woocommerce-checkout form.checkout #order_review{padding:17px 12px!important}
}