/* Importar fuente Roboto */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

/* Importar fuentes adicionales */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');

/* Desactivar scroll del body cuando está presente este módulo */
/*body:has(.hs-iframe) {
    overflow-y: hidden !important; 
    height: 100% !important;
}

html:has(.hs-iframe) {
    overflow-y: hidden !important; 
    height: 100% !important;
}*/

/* Reset y base */
* {
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}
button.main-boton-banrural {
    background: rgb(18, 71, 52) !important;
    color: #fff !important;
    border-radius: 8px !important;
}

.oj-flex,
.oj-flex > oj-module,
.oj-flex > oj-vb-content,
oj-module,
oj-vb-content,
.hs-iframe__wrap > html,
.hs-iframe__wrap > iframe,
.tracking-container,
.oj-web-applayout-body .vb-web-applayout-body {
  background: #fff !important;
}
/* Aplicar fuentes a elementos específicos */
.mensaje-token,
.agregar-token {
    font-family: 'Roboto', sans-serif;
}

/* Aplicar Inter a botones y elementos de formulario */
button,
input,
select,
textarea {
    font-family: 'Inter', sans-serif;
}

.hs-form{
    font-family: 'Inter', sans-serif !important;
}

.img-add-token{
max-width: 200px;
width: 100%;
max-height:200px;
 height: 100%;
  
}
.mensaje-token {
  max-width: 690px;
  margin: 100px auto;
  background: #fff;
  box-shadow: 0 4px 24px 0 rgba(0,0,0,0.10);
  padding: 35px 50px;
  height: 100%;
  justify-content:center;
  text-align: center;
}

.agregar-token{
  max-width: 1120px;
  justify-content: center;
  width: 100%;
  display: flex;
  margin: 60px auto;
  align-items: center;
  margin: 0;
}
.hs-iframe { 
    width: 100%; 
    margin: 0; 
}

.hs-iframe__wrap{
    position: relative;
    width: 100%;
    height: 400px;
    /*height: 100dvh;     ocupa el alto de la ventana */
    overflow: hidden;   /* evita barra del contenedor */
    /* border-radius: 8px;*/
    margin-top: 30px;
    /* box-shadow: 0 2px 10px rgba(0,0,0,.1);*/
    background: #fff !important;


}

.hs-iframe__wrap iframe{
    position: absolute; 
    inset: 0;
    width: 100%; 
    height: 100%;
    border: 0; 
    display: block;
  background: #fff !important;
}

@media (max-width: 768px){
    .hs-iframe__wrap{ 
        height: 400px; 
    }
}

button.hs-form__actions__submit {
    rgb(18, 71, 52) !important;
    border: none !important;
    border-radius: 8px !important;
    color: white !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    padding: 12px 24px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

/* Selector más específico por name attribute */
button[name="Enviar"],
button[name="enviar"],
input[name="Enviar"],
input[name="enviar"] {
    rgb(18, 71, 52) !important;
    border: none !important;
    border-radius: 8px !important;
    color: white !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    padding: 12px 24px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}