/* Pasos por Amor - formulario de aportes mensuales v1.3.0 */

/* Selector de métodos: mantiene la apariencia tipo píldora del formulario original. */
.pasos-monthly-method > .gfield_label{display:none!important}
.pasos-method-column{display:block;width:100%;margin:0 0 22px}
.pasos-method-group-title{margin:0 0 9px;font-weight:700;line-height:1.35;color:inherit}
.pasos-method-options{display:block}
.pasos-method-options>div,.pasos-method-options>li{display:block;width:100%;margin:0 0 8px!important;padding:0!important;list-style:none}
.pasos-method-options input[type=radio]{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;margin:0!important}
.pasos-method-options label{display:inline-block!important;max-width:100%;box-sizing:border-box;padding:7px 14px!important;border:0!important;border-radius:999px!important;background:#e7e7e9!important;color:#303744!important;font-weight:400!important;line-height:1.25!important;text-align:left!important;white-space:normal!important;cursor:pointer!important;box-shadow:none!important}
.pasos-method-options input[type=radio]:checked+label{background:#3f9de5!important;color:#fff!important}
.pasos-method-options input[type=radio]:focus+label{outline:2px solid rgba(63,157,229,.28)!important;outline-offset:2px!important}

/* Los campos tradicionales usan la cuadrícula nativa de Gravity Forms. */
.pasos-legacy-amount input[readonly]{background:inherit;color:inherit;cursor:default}

/* Interfaz de autorización de los métodos automáticos. */
.pasos-method-panel{margin:14px 0;padding:16px;border:1px solid #d9d9df;border-radius:8px;background:#fff}
.pasos-method-panel>p:first-child{margin-top:0}
.gf-wompi-contracts{margin:16px 0;padding:14px 16px;border:1px solid #d9d9df;border-radius:8px;background:#fafafa}
.gf-wompi-contracts label{display:block;margin:9px 0;line-height:1.45}
.gf-wompi-contracts input[type=checkbox]{margin-right:7px}
.gf-wompi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:8px 0 14px}
.gf-wompi-grid label,.pasos-method-panel>label{display:block;font-weight:600}
.gf-wompi-grid input,.pasos-method-panel>label input{display:block;box-sizing:border-box;width:100%;margin-top:6px}
.gf-wompi-auto-note{margin:10px 0 0;color:#575d63;font-size:.94em;line-height:1.45}
.gf-wompi-sandbox-note{margin:12px 0;padding:10px 12px;border:1px solid #dba617;border-radius:6px;background:#fff8e5}
.gf-wompi-sandbox-note code{white-space:nowrap}
#wompi-monthly-payment-status{min-height:22px;margin:12px 0 2px;font-weight:600;line-height:1.45}
#wompi-monthly-payment-status.is-error{color:#b32d2e}
#wompi-monthly-payment-status.is-ok{color:#16722f}
#wompi-monthly-payment-status.is-waiting{color:#646970}
#pasos-daviplata-otp{margin-top:14px}
#pasos-daviplata-otp label{display:block;font-weight:600}
#pasos-daviplata-code{display:block;width:180px;max-width:100%;margin:6px 0 10px}
.pasos-3ds{margin:14px 0;padding:14px;border:1px solid #d9d9df;border-radius:8px;background:#fff}
#pasos-3ds-frame{display:block;width:100%;min-height:470px;border:0;background:#fff}

.donacion-wompi-pendiente,.donacion-wompi-aprobada,.donacion-wompi-error,.donacion-pendiente{padding:20px;border:1px solid #d9d9df;border-radius:8px;background:#fff}
.donacion-wompi-aprobada{border-color:#91c59d}
.donacion-wompi-error,.donacion-wompi-pendiente.is-error{border-color:#c62828}
.gf-wompi-spinner{width:28px;height:28px;margin-top:14px;border:3px solid #ddd;border-top-color:#555;border-radius:50%;animation:gfWompiSpin .8s linear infinite}
.gf-wompi-error-detail,.gf-wompi-diagnostic{overflow-wrap:anywhere}
.gf-wompi-error-detail{font-family:monospace;font-size:12px}
@keyframes gfWompiSpin{to{transform:rotate(360deg)}}

@media(max-width:600px){
  .gf-wompi-grid{grid-template-columns:1fr}
  #pasos-3ds-frame{min-height:560px}
}


/* Ajustes visuales v1.3.1: selector en una sola columna y restaurar alineación original */
.pasos-monthly-method .ginput_container_radio,
.pasos-monthly-method #input_7_34,
.pasos-monthly-method [id^="input_"] {
  display:block !important;
  clear:both !important;
}
.pasos-method-column{display:block !important;width:100% !important;float:none !important;clear:both !important;margin:0 0 18px !important}
.pasos-method-group-title{display:block !important;width:100% !important;clear:both !important}
.pasos-method-options{display:block !important;width:100% !important;clear:both !important}
.pasos-method-options > div,.pasos-method-options > li{display:block !important;width:100% !important;clear:both !important}

@media (min-width: 641px) {
  /* Base: los campos tradicionales usan dos columnas limpias */
  .gform_wrapper .pasos-legacy-bank-account,
  .gform_wrapper .pasos-legacy-bank-name,
  .gform_wrapper .pasos-legacy-bank-type,
  .gform_wrapper .pasos-legacy-card-number,
  .gform_wrapper .pasos-legacy-card-franchise,
  .gform_wrapper .pasos-legacy-amount {
    width: 100% !important;
    float: left !important;
    clear: none !important;
    box-sizing: border-box !important;
    margin: 0 0 16px 0 !important;
  }
  .gform_wrapper .pasos-legacy-bank-account,
  .gform_wrapper .pasos-legacy-bank-type,
  .gform_wrapper .pasos-legacy-card-number,
  .gform_wrapper.pasos-method-debito_tarjeta_bancolombia .pasos-legacy-card-franchise {
    clear: both !important;
    margin-right: 4% !important;
  }
  .gform_wrapper .pasos-legacy-bank-name,
  .gform_wrapper.pasos-method-tarjeta_exterior .pasos-legacy-card-franchise,
  .gform_wrapper .pasos-legacy-amount {
    margin-right: 0 !important;
  }
  /* Débito a cuenta bancaria: 68|62 y 63|69 */
  .gform_wrapper.pasos-method-debito_cuenta .pasos-legacy-bank-account{clear:both !important;margin-right:4% !important}
  .gform_wrapper.pasos-method-debito_cuenta .pasos-legacy-bank-name{clear:none !important;margin-right:0 !important}
  .gform_wrapper.pasos-method-debito_cuenta .pasos-legacy-bank-type{clear:both !important;margin-right:4% !important}
  .gform_wrapper.pasos-method-debito_cuenta .pasos-legacy-amount{clear:none !important;margin-right:0 !important}

  /* Tarjeta Bancolombia: 67|69 */
  .gform_wrapper.pasos-method-debito_tarjeta_bancolombia .pasos-legacy-card-franchise{width:100% !important;float:left !important;clear:both !important;margin-right:4% !important}
  .gform_wrapper.pasos-method-debito_tarjeta_bancolombia .pasos-legacy-amount{width:100% !important;float:left !important;clear:none !important;margin-right:0 !important}

  /* Tarjeta exterior: 70|67 y luego 69 abajo a la izquierda */
  .gform_wrapper.pasos-method-tarjeta_exterior .pasos-legacy-card-number{width:100% !important;float:left !important;clear:both !important;margin-right:4% !important}
  .gform_wrapper.pasos-method-tarjeta_exterior .pasos-legacy-card-franchise{width:100% !important;float:left !important;clear:none !important;margin-right:0 !important}
  .gform_wrapper.pasos-method-tarjeta_exterior .pasos-legacy-amount{width:100% !important;float:left !important;clear:both !important;margin-right:4% !important}

  /* Campos que deben ocupar toda la fila debajo */
  .gform_wrapper #field_7_60,
  .gform_wrapper #field_7_64,
  .gform_wrapper #field_7_65,
  .gform_wrapper #field_7_71,
  .gform_wrapper #field_7_72,
  .gform_wrapper #field_7_73,
  .gform_wrapper #field_7_74 {
    clear: both !important;
    width: 100% !important;
    float: none !important;
  }
}

@media (max-width: 640px) {
  .gform_wrapper .pasos-legacy-bank-account,
  .gform_wrapper .pasos-legacy-bank-name,
  .gform_wrapper .pasos-legacy-bank-type,
  .gform_wrapper .pasos-legacy-card-number,
  .gform_wrapper .pasos-legacy-card-franchise,
  .gform_wrapper .pasos-legacy-amount {
    width: 100% !important;
    float: none !important;
    clear: both !important;
    margin-right: 0 !important;
  }
}


/* Ajustes visuales v1.3.2: forzar una sola columna y alineación exacta de campos tradicionales */
.pasos-method-column{display:block!important;width:100%!important;float:none!important;clear:both!important;margin:0 0 18px!important}
.pasos-method-options>div,.pasos-method-options>li{display:block!important;width:100%!important;clear:both!important;margin:0 0 8px!important}

@media (min-width: 641px) {
  /* patrones de dos columnas */
  .gform_wrapper .pasos-legacy-bank-account,
  .gform_wrapper .pasos-legacy-bank-name,
  .gform_wrapper .pasos-legacy-bank-type,
  .gform_wrapper .pasos-legacy-card-number,
  .gform_wrapper .pasos-legacy-card-franchise,
  .gform_wrapper .pasos-legacy-amount {
    float:left !important;
    width:100% !important;
    box-sizing:border-box !important;
    margin:0 0 18px 0 !important;
    clear:none !important;
  }
  .gform_wrapper .pasos-legacy-bank-account,
  .gform_wrapper .pasos-legacy-bank-type,
  .gform_wrapper .pasos-legacy-card-number,
  .gform_wrapper.pasos-method-debito_tarjeta_bancolombia .pasos-legacy-card-franchise {
    clear:both !important;
    margin-right:4% !important;
  }
  .gform_wrapper .pasos-legacy-bank-name,
  .gform_wrapper .pasos-legacy-amount,
  .gform_wrapper.pasos-method-tarjeta_exterior .pasos-legacy-card-franchise {
    clear:none !important;
    margin-right:0 !important;
  }
  /* full width blocks below */
  .gform_wrapper #field_7_60,
  .gform_wrapper #field_7_64,
  .gform_wrapper #field_7_65 {
    clear:both !important;
    float:none !important;
    width:100% !important;
    margin:0 0 18px 0 !important;
  }
}
@media (max-width: 640px) {
  .gform_wrapper .pasos-legacy-bank-account,
  .gform_wrapper .pasos-legacy-bank-name,
  .gform_wrapper .pasos-legacy-bank-type,
  .gform_wrapper .pasos-legacy-card-number,
  .gform_wrapper .pasos-legacy-card-franchise,
  .gform_wrapper .pasos-legacy-amount {
    float:none !important;
    width:100% !important;
    clear:both !important;
    margin-right:0 !important;
  }
}


/* Ajuste puntual v1.3.3: los controles ocupan el 100% de su columna. */
@media (min-width: 641px) {
  .gform_wrapper .pasos-legacy-bank-account .ginput_container,
  .gform_wrapper .pasos-legacy-bank-name .ginput_container,
  .gform_wrapper .pasos-legacy-bank-type .ginput_container,
  .gform_wrapper .pasos-legacy-card-number .ginput_container,
  .gform_wrapper .pasos-legacy-card-franchise .ginput_container,
  .gform_wrapper .pasos-legacy-amount .ginput_container {
    width: 100% !important;
    max-width: none !important;
  }

  .gform_wrapper .pasos-legacy-bank-account input,
  .gform_wrapper .pasos-legacy-bank-name input,
  .gform_wrapper .pasos-legacy-bank-type select,
  .gform_wrapper .pasos-legacy-card-number input,
  .gform_wrapper .pasos-legacy-card-franchise select,
  .gform_wrapper .pasos-legacy-amount input {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}


/* v1.3.4 - columnas reales: cada campo ocupa 100% de su columna, sin width:48% */
@media (min-width: 641px) {
  #gform_page_7_3 .gform_page_fields > .gform_fields,
  #gform_page_7_3 .gform_fields {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 0 !important;
  }

  #gform_page_7_3 .gform_fields > .gfield {
    grid-column: 1 / -1;
    width: 100% !important;
    max-width: none !important;
    float: none !important;
    clear: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Débito a cuenta: 68|62 y 63|69 */
  .pasos-method-debito_cuenta #field_7_68,
  .pasos-method-debito_cuenta #field_7_63 { grid-column: 1 !important; }
  .pasos-method-debito_cuenta #field_7_62,
  .pasos-method-debito_cuenta #field_7_69 { grid-column: 2 !important; }

  /* Tarjeta Bancolombia: 67|69 */
  .pasos-method-debito_tarjeta_bancolombia #field_7_67 { grid-column: 1 !important; }
  .pasos-method-debito_tarjeta_bancolombia #field_7_69 { grid-column: 2 !important; }

  /* Tarjeta exterior: 70|67 y valor debajo a la izquierda */
  .pasos-method-tarjeta_exterior #field_7_70 { grid-column: 1 !important; }
  .pasos-method-tarjeta_exterior #field_7_67 { grid-column: 2 !important; }
  .pasos-method-tarjeta_exterior #field_7_69 { grid-column: 1 !important; }

  /* Inputs/selects llenan por completo su celda */
  #gform_page_7_3 .pasos-legacy-bank-account .ginput_container,
  #gform_page_7_3 .pasos-legacy-bank-name .ginput_container,
  #gform_page_7_3 .pasos-legacy-bank-type .ginput_container,
  #gform_page_7_3 .pasos-legacy-card-number .ginput_container,
  #gform_page_7_3 .pasos-legacy-card-franchise .ginput_container,
  #gform_page_7_3 .pasos-legacy-amount .ginput_container,
  #gform_page_7_3 .pasos-legacy-bank-account input,
  #gform_page_7_3 .pasos-legacy-bank-name input,
  #gform_page_7_3 .pasos-legacy-bank-type select,
  #gform_page_7_3 .pasos-legacy-card-number input,
  #gform_page_7_3 .pasos-legacy-card-franchise select,
  #gform_page_7_3 .pasos-legacy-amount input {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}