<style>
    .pageContent {
        display: block;
        border: 1px solid #DCE6ED;
        /* padding: 5px; */
        margin-top: 5px;
        width: 100%;
        height: 400px;
        overflow: auto;
    }

    .pageContent2 {
        display: block;
        border: 1px solid #DCE6ED;
        /* padding: 5px; */
        /* margin-top: 5px; */
        width: 100%;
        height: 250px;
        overflow: auto;
    }

    .pageContent3 {
        display: block;
        border: 1px solid #DCE6ED;
        /* padding: 5px; */
        /* margin-top: 5px; */
        width: 100%;
        height: 350px;
        overflow: auto;
    }

    /* Menambahkan gaya untuk wadah tabel */
    .table-container {
        max-height: 400px;
        /* Tentukan tinggi wadah */
        overflow-y: auto;
        /* Membuat scroll ketika konten melebihi batas */
        border: 1px solid #ccc;
        margin: 15px 0;
    }

    /* Gaya untuk tabel */
    .tableStyle {
        width: 100%;
        border-collapse: collapse;
        font-size: 9pt;
    }

    /* Gaya untuk header tabel agar tetap di atas */
    thead {
        position: sticky;
        top: 0;
        background-color: #f1f1f1;
        /* Warna latar belakang header */
        z-index: 1;
        /* Menjaga header tetap di atas konten saat scroll */
    }

    th,
    td {
        padding: 6px;
        text-align: left;
        border: 1px solid #ddd;
    }

    th {
        background-color: #4CAF50;
        color: white;
    }
</style>
<div class="content-wrapper">
    <section class="content-header">
        <h1>
            <?= $judul; ?>
            <small>
                <?= $abdulradjak['NamaPerusahaan']; ?> -
                <?= $abdulradjak['KodePPK']; ?>
            </small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Lab</a></li>
            <li class="active">Worklist</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">

        <div class="box">
            <div class="box-body">
                <div class="row">
                    <div class="col-md-3">
                        <div class="pageContent bg-primary" style="padding: 9px;">
                            <label for="">No.MR</label>
                            <input type="text" class="form-control" autocomplete="off" id="nomr">

                            <label for="">Case ID</label>
                            <input type="text" class="form-control" autocomplete="off" id="caseid">

                            <label for="">Tanggal</label>
                            <input type="date" class="form-control" autocomplete="off" id="tgl">

                            <br>
                            <div style="text-align: right;">
                                <button type="button" onclick="reset()" class="btn btn-sm btn-warning"><i class="fa fa-fw fa-refresh"></i> Reset</button>
                                <button type="button" onclick="cariPasien()" class="btn btn-sm btn-success"><i class="fa fa-fw fa-search"></i> Cari</button>
                            </div>

                            <br><br>

                            <div style="padding: 5px; color:black; background-color: rgb(255, 251, 123);"><b>Ket. Background : </b> Hasil sudah diisi</div>

                            <div id="i_editNormal" style="display: none; background-color: #DCE6ED;">
                                <div class="input-group">
                                    <span class="input-group-addon"><b>Normal Value</b></span>
                                    <input type="text" id="editNormal" class="form-control" autocomplete="off">
                                </div>
                                <div style="text-align: right;">
                                    <span id="idDetail" style="display: none;"></span>
                                    <button type="button" onclick="simpanEditNormal()" style="margin-top: 5px; margin-bottom: 5px;" class="btn btn-sm btn-success"><i class="fa fa-refresh"></i></button>
                                    <button type="button" onclick="batalEdit()" style="margin-top: 5px; margin-bottom: 5px; margin-right: 5px;" class="btn btn-sm  btn-danger"><i class="fa fa-remove"></i></button>
                                </div>
                            </div>

                            <div id="i_editNormalPilihan" style="display: none; background-color: #DCE6ED;">
                                <div class="input-group">
                                    <span class="input-group-addon"><b>Normal Value</b></span>
                                    <select class="form-control" id="editNormalPilihan"></select>
                                </div>
                                <div style="text-align: right;">
                                    <span id="idDetail" style="display: none;"></span>
                                    <button type="button" onclick="simpanEditNormalPilihan()" style="margin-top: 5px; margin-bottom: 5px;" class="btn btn-sm btn-success"><i class="fa fa-refresh"></i></button>
                                    <button type="button" onclick="batalEdit()" style="margin-top: 5px; margin-bottom: 5px; margin-right: 5px;" class="btn btn-sm  btn-danger"><i class="fa fa-remove"></i></button>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="col-md-9">
                        <div id="data">
                            <?php
                            $this->load->view('worklist/data');
                            ?>
                        </div>

                        <div id="form" style="display: none;">
                            <?php
                            $this->load->view('worklist/form');
                            ?>
                        </div>
                    </div>
                </div>

            </div>
            <div class="overlay loadingPasien" style="display: none;">
                <i class="fa fa-fw fa-spinner fa-spin"></i>
            </div>
        </div>

    </section><!-- /.content -->
</div><!-- /.content-wrapper -->