<style>
    body {
        background-color: transparent;
        font-family: 'verdana';
    }

    .id-card-holder {
        justify-content: center;
        margin: 5px;
        padding: 2px;
        margin-left: 10px;
        margin-right: 10px;
        background-color: #1f1f1f;
        border-radius: 5px;
        position: relative;
        width: calc(25% - 24px);
    }

    .id-card {
        background-color: #fff;
        padding: 10px;
        border-radius: 10px;
        box-shadow: 0 0 1.5px 0px #b9b9b9;
    }

    .flex-container {
        display: flex;
        flex-wrap: wrap;
    }

    table,
    td {
        border: 1px solid lightgray;
        border-collapse: unset;
        border-spacing: 10px !important;
    }
    table{
        border: none;
    }
</style>
<div class="flex-container" dir="rtl">
    {for $i = 1 to $counter}
    <div class="id-card-holder">
        <div class="id-card">
            <table>
                <tr>
                    <td>{$name}</td>
                </tr>
                <tr>
                    <td style="border: none;">الرقم الموحد: {$internal_entry_data.patient_id} </td>
                </tr>
                <tr>
                    <td>رقم التذكرة : {$internal_entry_data.ticket_no} </td>
                </tr>
            </table>
        </div>
    </div>
    {/for}
</div>