<html>

<head>
    <meta charset="UTF-8" />
    <style>
        body {
            padding: 2rem 3rem;
        }
        table {
            width: 100%;
            border-collapse: collapse
        }
        td {
            vertical-align: top;
        }
        .border-table,
        .border-table td,
        .border-table th {
            border: 1px solid black;
        }
        .section-title {
            margin-top: 1rem;
            margin-bottom: 0rem;
        }
        .data-label {            
            width: 9rem;
        }
        .data-colon {            
            width: 0.1234rem;
        }
    </style>
</head>

<body style="font-family: Arial, sans-serif; line-height: 1.4">
    <!-- Tanggal Terbit (top-right) -->
    <div style="
        text-align: right; 
        margin-right: 2rem; 
        font-size: 0.95rem;
        margin-top: 0.5rem;
    ">
        Tanggal Terbit : {{ .IssuedDate }}
    </div>

    <!-- Patient Info Box -->
    <table 
        style="
            margin-top: 1rem;
            margin-left: auto;
            margin-right: 2rem;   /* space from right like example */
            border: 1px solid #000;
            padding: 0.5rem 1rem;
            border-collapse: separate;
            border-spacing: 0.3rem 0.2rem;
            width: auto;
        "
    >
        <tr>
            <td style="width: 9rem;"><b>No. RM</b></td>
            <td class="data-colon">:</td>
            <td><b>{{ .MedicalRecord }}</b></td>
        </tr>
        <tr>
            <td><b>Nama</b></td>
            <td class="data-colon">:</td>
            <td><b>{{ .Name }}</b></td>
        </tr>
        <tr>
            <td><b>Tanggal Lahir</b></td>
            <td class="data-colon">:</td>
            <td>{{ .BirthDate }}</td>
        </tr>
    </table>

    <hr style="margin: 20px 0" />
    <h1 style="
        text-align: center;
        font-weight: bold;
        font-size: 1rem;
        margin: 0;
    ">
        FORM A
    </h1>

    <section>
        <h4 class="section-title">Kajian Awal Medis:</i></h4>
        <table style="margin-top: 0.3rem;">

        {{ if gt (len .EarlyMedic) 0 }}
            {{ range .EarlyMedic }}
            <tr>
                <td>
                    &#9745; {{ . }}
                </td>
            </tr>
            {{ end }}
        {{ else }}
            <tr>
                <td></td>
            </tr>
        {{ end }}

    </table>
    </section>

    <section>
        <h4 class="section-title">ASSESMEN:</h4>
        <table style="margin-top: 0.3rem;">
            <tr>
                <td>
                    {{ .Assessment }}
                </td>
            </tr>
        </table>
    </section>

    <section>
        <h4 class="section-title">IDENTIFIKASI MASALAH:</h4>
        <table style="margin-top: 0.3rem;">
        {{ if gt (len .ProblemIdentification) 0 }}
            {{ range .ProblemIdentification }}
            <tr>
                <td>
                    &#9745; {{ . }}
                </td>
            </tr>
            {{ end }}
        {{ else }}
            <tr>
                <td></td>
            </tr>
        {{ end }}

    </table>
    </section>

    <section>
        <h4 class="section-title">PERENCANAAN:</h4>
        <table style="margin-top: 0.3rem;">
            <tr>
                <td>
                    {{ .Planning }}
                </td>
            </tr>
        </table>
    </section>

    <table style="margin-top: 3rem;">
        <tr>
            <td></td>
            <td style="text-align: center; width: 15rem;">
                {{ .Date }}<br>
            </td>
        </tr>
        <tr><td style="height: 7rem;"></td></tr>
        <tr>
            <td></td>
            <td style="text-align: center; width: 15rem;">
                ({{ .Employee_Name }})
            </td>
        </tr>
    </table>

    <div style="height: 3rem;"></div>
</body>

</html>