Filippo - Calcolo Multe

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>

        function vai(){
            var multa = document.getElementById("multa").value;
            var numeroGiorni = document.getElementById("numeroGiorni").value;
            if(multa<0 || numeroGiorni<0){
                alert("Attenzione! I valori inseriti non solo validi.");
                reset();
            }else{
                if(numeroGiorni>60){
                    alert("Attenzione! È consentito il calcolo dell'incremento fino a 60 giorni.");
                    reset();
                }else{
                    calcolaImporto();
                }
            }
        }

        function calcolaImporto(){
            document.getElementById("testoVerde").innerHTML = '';
            document.getElementById("testoBlu").innerHTML = '';
            document.getElementById("testoRosso").innerHTML = '';

            var multa = document.getElementById("multa").value;
            var numeroGiorni = document.getElementById("numeroGiorni").value;
            var incremento = 0;

            var totaleUno = multa;
            var totaleDue = (multa*1+multa*10/100);
            var totaleTre = (multa*1+multa*30/100);

            if(multa>20){
                if(numeroGiorni>=7){
                    if(numeroGiorni>14){
                        // Più di 14 giorni => testo rosso
                        document.getElementById("testoRosso").innerHTML = totaleTre;
                    }else{
                        // Tra i 7 ed i 14 giorni => testo blu
                        document.getElementById("testoBlu").innerHTML = totaleDue;
                    }
                }else{
                    // Meno di 7 giorni => testo verde
                    document.getElementById("testoVerde").innerHTML = totaleUno;
                }
            }else{
                // Multa minore di 20€ = importo invariato = testo verde
                document.getElementById("testoVerde").innerHTML = totaleUno;
            }

            document.getElementById("imp1").innerHTML = totaleUno;
            document.getElementById("imp2").innerHTML = totaleDue;
            document.getElementById("imp3").innerHTML = totaleTre;

        }

        function reset(){
            document.getElementById("multa").value = '';
            document.getElementById("numeroGiorni").value = '';
            document.getElementById("testoVerde").innerHTML = '';
            document.getElementById("testoBlu").innerHTML = '';
            document.getElementById("testoRosso").innerHTML = '';
            document.getElementById("imp1").innerHTML = '';
            document.getElementById("imp2").innerHTML = '';
            document.getElementById("imp3").innerHTML = '';
        }

        </script>
        <style>
            .div1 {
                width: 1200px;
                height: 800px;
                margin: auto;
                border: 1px solid black;
                background-color: orange;
            }

            .div2 {
                width: 700px;
                height: 400px;
                border: 1px solid black;
            }

            table,
            th,
            td {
                heught: 200 px;
                border-collapse: collapse;
                text-align: center;
                padding;
                30px;
            }
        </style>
    </head>
    <body>
        <div class="div1">

            <h1>Calcolo maggiorazione multe</h1>
            <p>Inserisci l'importo della multa in Euro
                <input type="text" id="multa" size="10">
            </p>
            <p>Inserisci dopo quanti giorni è stata pagata la multa
                <input type="text" id="numeroGiorni" size="10">
            </p>

            <button onclick="vai()"> Vai</button>
            <button onclick="reset()"> Cancella</button>

            <p>L'importo finale della multa è <span style="color:green" id="testoVerde"></span><span style="color:blue" id="testoBlu"></span><span style="color:red" id="testoRosso"></span>
            </p>
            <div class="div2">
                <table border 5>
                    <tr>
                        <th style="background-color: red">Importo 1-7 giorni</th>
                        <th style="background-color: green">Importo 8-14 giorni</th>
                        <th style="background-color: yellow">Importo 15-60 giorni</th>
                    </tr>
                    <tr>
                        <th style="background-color: red" id="imp1"> </th>
                        <th style="background-color: green" id="imp2"> </th>
                        <th style="background-color: yellow" id="imp3"> </th>
                    </tr>

                </table>


            </div>
        </div>
    </body>
</html>