/* =====================================================================
   PLAYBCN - FORMULARIOS DE DIRECCIÓN (30-10-2026)
   1) Checkout (móvil): todas las cajas del formulario del mismo ancho.
   2) Páginas "Cambiar dirección" (facturación y envío): mismo estilo que
      el checkout nuevo. Solo CSS: no cambia campos ni el envío del formulario.
   Para quitarlo, basta con borrar el archivo.
===================================================================== */

/* ---------- 1) Checkout en móvil: una sola columna ---------- */
@media only screen and (max-width: 767px) {
  body#onepagecheckoutBody #onePageCheckout ul.addressForm { grid-template-columns: minmax(0, 1fr) !important; }
  body#onepagecheckoutBody #onePageCheckout ul.addressForm li { grid-column: 1 / -1 !important; }
  body#onepagecheckoutBody #onePageCheckout ul.addressForm input[type=text],
  body#onepagecheckoutBody #onePageCheckout ul.addressForm input[type=email],
  body#onepagecheckoutBody #onePageCheckout ul.addressForm input[type=tel],
  body#onepagecheckoutBody #onePageCheckout ul.addressForm input[type=password],
  body#onepagecheckoutBody #onePageCheckout ul.addressForm select { width: 100% !important; max-width: none !important; box-sizing: border-box !important; }
}

/* ---------- 2) Cambiar dirección ---------- */
#checkoutpaymentaddressBody, #checkoutshippingaddressBody { background: #fff !important; margin: 0 !important; }
#checkoutpaymentaddressBody #main-container, #checkoutshippingaddressBody #main-container { background: transparent !important; margin: 0 auto !important; padding: 0 !important; width: 100% !important; max-width: none !important; }
#checkoutpaymentaddressBody #main-container > .col12, #checkoutshippingaddressBody #main-container > .col12 { margin: 0 !important; padding: 0 !important; width: 100% !important; float: none !important; }
#checkoutpaymentaddressBody #navBreadCrumb, #checkoutshippingaddressBody #navBreadCrumb { display: none !important; }

#checkoutPayAddressDefault, #checkoutShipAddressDefault {
  max-width: 620px !important; margin: 24px auto !important; padding: 0 12px !important; box-sizing: border-box;
  font-family: 'Lato', 'Helvetica Neue', Arial, sans-serif !important; color: #111;
}
#checkoutPayAddressDefault form, #checkoutShipAddressDefault form {
  display: block !important; background: #fff; border: 1px solid #e7e5e0; border-radius: 12px; padding: 24px 22px !important; margin: 0 !important; box-sizing: border-box;
}
#checkoutPayAddressDefault h1, #checkoutShipAddressDefault h1 {
  font-size: 22px !important; font-weight: 900 !important; letter-spacing: 0 !important; text-transform: none !important;
  text-align: left !important; margin: 0 0 6px !important; padding: 0 !important; line-height: 1.25 !important;
}
#checkoutPayAddressDefault h2, #checkoutShipAddressDefault h2 {
  font-size: 15px !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important;
  text-align: left !important; color: #5f5f5f !important; margin: 0 0 18px !important; padding: 0 !important; background: none !important; border: 0 !important;
}
#checkoutPayAddressDefault .address-wrap, #checkoutShipAddressDefault .address-wrap,
#checkoutPayAddressDefault #checkoutNewAddress, #checkoutShipAddressDefault #checkoutNewAddress,
#checkoutPayAddressDefault .changeAddressFormContainer, #checkoutShipAddressDefault .changeAddressFormContainer {
  background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 !important; width: auto !important; float: none !important; box-shadow: none !important;
}
#checkoutPayAddressDefault .alert.forward.required, #checkoutShipAddressDefault .alert.forward.required { display: none !important; }

/* Etiqueta e Instagram no hacen falta aquí */
#checkoutPayAddressDefault label[for=address_title], #checkoutPayAddressDefault #address_title,
#checkoutShipAddressDefault label[for=address_title], #checkoutShipAddressDefault #address_title,
#checkoutPayAddressDefault label[for=suburb], #checkoutPayAddressDefault #suburb,
#checkoutShipAddressDefault label[for=suburb], #checkoutShipAddressDefault #suburb { display: none !important; }

#checkoutPayAddressDefault label.inputLabel, #checkoutShipAddressDefault label.inputLabel {
  display: block !important; float: none !important; width: auto !important;
  font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important;
  color: #111 !important; margin: 14px 0 6px !important; padding: 0 !important; text-align: left !important;
}
#checkoutPayAddressDefault label.inputLabel .alert, #checkoutShipAddressDefault label.inputLabel .alert { color: #c0392b !important; }
#checkoutPayAddressDefault input[type=text], #checkoutShipAddressDefault input[type=text],
#checkoutPayAddressDefault select, #checkoutShipAddressDefault select {
  display: block !important; float: none !important; width: 100% !important; max-width: none !important; height: 52px !important;
  box-sizing: border-box !important; border: 1px solid #cfccc6 !important; border-radius: 8px !important; background: #fff !important;
  padding: 0 14px !important; margin: 0 !important; font-size: 16px !important; letter-spacing: 0 !important; color: #111 !important; box-shadow: none !important;
}
#checkoutPayAddressDefault input[type=text]:focus, #checkoutShipAddressDefault input[type=text]:focus,
#checkoutPayAddressDefault select:focus, #checkoutShipAddressDefault select:focus { border-color: #111 !important; outline: none; }
#checkoutPayAddressDefault br, #checkoutShipAddressDefault br { display: none; }
#checkoutPayAddressDefault select, #checkoutShipAddressDefault select { text-align: left !important; text-align-last: left !important; }
#checkoutPayAddressDefault label.inputLabel[for=suburb], #checkoutShipAddressDefault label.inputLabel[for=suburb],
#checkoutPayAddressDefault label.inputLabel:has(+ #address_title), #checkoutShipAddressDefault label.inputLabel:has(+ #address_title) { display: none !important; }

/* Lista de direcciones guardadas (si el cliente tiene varias) */
#checkoutPayAddressDefault .moduleRow, #checkoutPayAddressDefault .moduleRowSelected,
#checkoutShipAddressDefault .moduleRow, #checkoutShipAddressDefault .moduleRowSelected {
  border: 1px solid #d8d6d1 !important; border-radius: 10px !important; padding: 12px 14px !important; margin: 0 0 10px !important; background: #fff !important;
}
#checkoutPayAddressDefault .moduleRowSelected, #checkoutShipAddressDefault .moduleRowSelected { border: 2px solid #111 !important; }

/* Botón */
#checkoutPayAddressDefault .buttonRow, #checkoutShipAddressDefault .buttonRow { float: none !important; width: 100% !important; margin: 22px 0 0 !important; padding: 0 !important; text-align: center !important; }
#checkoutPayAddressDefault .buttonRow.back.nextstep, #checkoutShipAddressDefault .buttonRow.back.nextstep { display: none !important; }
#checkoutPayAddressDefault input[type=submit], #checkoutShipAddressDefault input[type=submit] {
  display: block !important; width: 100% !important; height: 56px !important; margin: 0 !important;
  background: #111 !important; color: #fff !important; border: 0 !important; border-radius: 8px !important;
  font-size: 16px !important; font-weight: 700 !important; letter-spacing: 1px !important; text-transform: uppercase !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.16) !important; cursor: pointer !important;
}
#checkoutPayAddressDefault input[type=submit]:hover, #checkoutShipAddressDefault input[type=submit]:hover { background: #333 !important; }

@media only screen and (max-width: 767px) {
  #checkoutpaymentaddressBody, #checkoutshippingaddressBody { padding-top: 0 !important; }
  #checkoutPayAddressDefault, #checkoutShipAddressDefault { margin: 10px auto !important; padding: 0 8px !important; }
  #checkoutPayAddressDefault form, #checkoutShipAddressDefault form { padding: 18px 14px !important; }
}
