document.addEventListener('DOMContentLoaded', function () {
const tasa = 109.7724;
const input = document.getElementById('hiloval_multiplicador_input');
const output = document.getElementById('hiloval_multiplicador_resultado');
const clearBtn = document.getElementById('hiloval_clear_btn');
input.addEventListener('input', function () {
const valor = parseFloat(this.value.replace(',', '.'));
if (!isNaN(valor) && valor > 0) {
const calculado = valor * tasa;
output.textContent = '= Bs ' + calculado.toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
} else {
output.textContent = '';
}
clearBtn.style.visibility = this.value ? 'visible' : 'hidden';
});
clearBtn.addEventListener('click', function () {
input.value = '';
output.textContent = '';
clearBtn.style.visibility = 'hidden';
input.focus();
});
});
.hiloval-multiplicador-box {
display: inline-flex;
flex-direction: row;
align-items: center;
gap: 12px;
font-family: inherit;
font-size: 1rem;
color: inherit;
padding: 6px 0;
}
.input-wrapper {
position: relative;
display: inline-block;
}
.hiloval-multiplicador-box input[type="text"] {
appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
padding: 6px 12px;
font-size: 0.8rem;
line-height: 1.5;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 4px;
width: 110px;
background-color: #fff;
color: #333;
text-align: center;
}
.hiloval-multiplicador-box input[type="text"]:focus {
border-color: #0057b8;
outline: none;
}
.clear-btn {
position: absolute;
right: 6px;
top: 50%;
transform: translateY(-50%);
font-size: 16px;
color: #888;
cursor: pointer;
user-select: none;
visibility: hidden;
padding: 0 4px;
line-height: 1;
}
.clear-btn:hover {
color: #cc0000;
}
.hiloval-multiplicador-box strong {
font-weight: 600;
font-size: 1rem;
line-height: 1.5;
color: #005e20;
min-width: 130px;
display: inline-block;
position: relative;
top: -6px;
}