I added a font path to the table style. But the font does not apply. I feel there is a problem with my code and how to address it. Please check the code and find the problem.

<script>

    function printDiv() {
        var divToPrint = document.querySelectorAll('.print-table');
        var htmlToPrint = '' +
            '<style type="text/css">' +
            'table th, table td {' +
            '@@font-face{font-family: Vazir  !important ;src: url("~/dist/fonts/Vazir-Medium.ttf") format("truetype");}' +
            'font-family:Vazir;' +
            'border:1px solid #000;' +
            'padding:0.5em;' +
            '}' +
            '</style>';

        divToPrint.forEach((item) => {
            htmlToPrint += item.outerHTML;
        })
        newWin = window.open("");

        newWin.document.write(htmlToPrint);
        newWin.print();

        newWin.close();
    }

    var elem = document.getElementById("intro");
    elem.style.textAlign = "center";

</script>