/* Estilo para el teclado en una sola fila */
#virtual-keyboard {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background-color: white; /* Fondo negro */
    border-radius: 10px;
    width: 100%;
    overflow-x: auto; /* Permite desplazamiento si no cabe */
}

/* Estilo de las teclas */
.tecla {
    width: 6vw;  /* Tamaño relativo */
    height: 7vw;
    min-width: 100px;
    min-height: 90px;
    font-size: 1.5vw;
    text-align: center;
    background-color: #005EB8;  /* Color oscuro */
    color: white;  /* Texto blanco */
    border: 2px solid #555;  
    border-radius: 5px;
    cursor: pointer;
    padding: 10px;
}

.tecla:hover {
    background-color: green;
}

/* Ajuste para pantallas pequeñas */
@media (max-width: 600px) {
    .tecla {
        width: 10vw;
        height: 10vw;
        font-size: 3vw;
    }
}