<html>

<head>
    <title>Slip Gaji Karyawan</title>
    <style>
    #tabel {
        font-size: 15px;
        border-collapse: collapse;
    }

    #tabel td {
        padding-left: 5px;
        border: 1px solid black;
    }
    </style>
    <style>
    * {
        box-sizing: border-box;
    }

    .row {
        margin-left: -5px;
        margin-right: -5px;
    }

    .column {
        float: left;
        width: 50%;
    }

    /* Clearfix (clear floats) */
    .row::after {
        content: "";
        clear: both;
        display: table;
    }

    th,
    td {
        text-align: left;
    }

    /* Responsive layout - makes the two columns stack on top of each other instead of next to each other on screens that are smaller than 600 px */
    @media screen and (max-width: 600px) {
        .column {
            width: 100%;
        }
    }
    </style>
</head>

<body style='font-family:tahoma; font-size:12pt;'>
    <table cellspacing='0' style='width: 100%; font-size:12pt; font-family:calibri;  border-collapse: collapse;'
        border='0'>
        <tr>
            <td width='50%'><img src="<?= base_url('assets/') ?>img/logo_invoice.png" width="80%" alt="avatar"></td>
            <td></td>
            <td width='50%' style="text-align: right;"><b style="font-size: 25pt;">SLIP GAJI</b>
            </td>
        </tr>
        <!-- Rincian Data Beli -->
        <tr>
            <td width='50%'>
                Nama : <?= $login['nm_panggilan'] ?></br>
                NIK : <?= $identitas['nik'] ?>
            </td>
            <td></td>
            <td width='50%' style='text-align:right'>
                #<?= date('Y', strtotime($data_gaji['tgl_gaji']))  ?><?= date('m', strtotime($data_gaji['tgl_gaji']))  ?><?= $identitas['login_id'] ?></br>
                <?= $data_gaji['metode'] ?>
            </td>
        </tr>
    </table>
    <p>==============================================================================
    </p>
    <div class="row">
        <div class="column">
            <table>
                <tr>
                    <td colspan="3" class="text-center">BONUS / REWARD / GAJI</td>
                </tr>
                <tr>
                    <th colspan="2">Keterangan</th>
                    <th> </th>
                    <th>Nominal</th>
                </tr>
                <?php
                foreach ($bonus as $Bonus) :
                ?>
                <tr>
                    <td colspan="2"><?= $Bonus->ket_gaji ?></td>
                    <th> </th>
                    <td class="text-right"><?= number_format($Bonus->nominal, 0, ',', '.') ?>,-</td>
                </tr>
                <?php
                endforeach;
                ?>
            </table>
        </div>
        <div class="column">
            <table>
                <tr>
                    <td colspan="3" class="text-center">POTONGAN / PUNISHMENT</td>
                </tr>
                <tr>
                    <th colspan="2">Keterangan</th>
                    <th> </th>
                    <th>Nominal</th>
                </tr>
                <?php
                foreach ($potongan as $Potongan) :
                ?>
                <tr>
                    <td colspan="2"><?= $Potongan->ket_gaji ?></td>
                    <th> </th>
                    <td class="text-right"><?= number_format($Potongan->nominal, 0, ',', '.') ?>,-</td>
                </tr>
                <?php
                endforeach;
                ?>
            </table>
        </div>
    </div>
    <p>==============================================================================
    </p>
    <table cellspacing='0' style='width: 100%; font-size:12pt; font-family:calibri;  border-collapse: collapse;'
        border='0'>
        <!-- Rincian Data Beli -->
        <?php
        foreach ($netral as $Netral) :
        ?>
        <tr>
            <td colspan="2"><?= $Netral->ket_gaji ?></td>
            <th> </th>
            <td class="text-right"><?= number_format($Netral->nominal, 0, ',', '.') ?>,-</td>
        </tr>
        <?php
        endforeach;
        ?>
    </table>
    <p>==============================================================================
    </p>
    <table cellspacing='0' style='width: 100%; font-size:12pt; font-family:calibri;  border-collapse: collapse;'
        border='0'>
        <tr>
            <td style="text-align: center;"></td>
            <td>
                <div style='text-align:left'>Gaji Pokok : </div>
            </td>
            <td style='text-align:right'><?= number_format($data_gaji['gaji_pokok'], 0, ',', '.') ?>,-</td>
        </tr>
        <tr>
            <td style="text-align: center;"></td>
            <td>
                <div style='text-align:left'>Gaji Bonus / Reward : </div>
            </td>
            <td style='text-align:right'><?= number_format($data_gaji['ttl_bonus'], 0, ',', '.') ?>,-</td>
        </tr>
        <tr>
            <td style="text-align: center;"></td>
            <td>
                <div style='text-align:left'>Gaji Potongan : </div>
            </td>
            <td style='text-align:right'><?= number_format($data_gaji['ttl_potongan'], 0, ',', '.') ?>,-</td>
        </tr>
        <tr>
            <td style="text-align: center;"></td>
            <td>
                <div style='text-align:left'>Take Home Pay : </div>
            </td>
            <td style='text-align:right'><?= number_format($data_gaji['ttl_gaji'], 0, ',', '.') ?>,-</td>
        </tr>
    </table>
    <p>==============================================================================
    </p>
    <!-- Hapus -->
</body>

</html>