<html>
<head>
    <!-- CSS only -->
    <link href="{$path}/oscopic/print/bootstrap.css" rel="stylesheet">

    <!-- JavaScript Bundle with Popper -->

    <script src="{$path}/oscopic/print/bootstrap.js"></script>
    <style>
        @media print {
            select {
                background-color: transparent !important;
                border: 0 !important
            }

            .form-select {
                background-image: none !important
            }
        }

        table {
            width: 100%;
        }

        table, th, td {
            border: 1px solid black;
            border-collapse: collapse;
            padding: 4px 10px;
        }

        .royal1 {
            margin: 0;
        }

        .royal1 .header img.logo {
            float: right;
        }

        table tr.odd {
            background-color: #d3dcdc;
        }

        .center-img {
            text-align: center;
            margin: 10px auto;
        }

        .findings th, .findings tr td {
            border: 1px solid #fff
        }

        .findings thead th {
            border: 2px solid #fff;
        }

        .findings thead {
            background-color: #19325c;
            color: #fff
        }

        .findings tr.even, .main-data tr.even {
            background-color: #ffdbdd;
        }

        .findings tr.odd, .main-data tr.odd {
            background-color: #ffefef;
        }

        .findings tr th {
            color: #595959;
            padding: 5px 10px;
            font-size: 15px;
        }

        .findings thead th {
            color: #fff;
            text-align: center;
            font-size: 17px;
            padding: 7px;
        }

        .recommendition {
            margin: 16px 0 10px;
        }

        .social ul {
            display: flex;
            margin-left: -35px;
            margin-bottom: 0;
        }

        .social ul li {
            list-style-type: none;
            float: left;
            margin: 0 5px;
        }

        .social a {
            text-decoration: auto;
            color: #445866;
            font-size: 15px;
        }

        .footer p.info {
            text-align: right;
            line-height: 1.2;
            font-size: 17px;
            color: #445866
        }

        .footer {
            border-top: 1px solid #ddd;
            padding: 7px 0 0;
            margin-top: 0px;
        }

        .footer .phone {
            text-align: center;
        }

        .recommendition tr {
            height: 88px;
        }

        .recommendition td, .recommendition th {
            border: 1px solid #fff;
            background-color: #ef5473;
            color: #fff;
        }

        .recommendition tr th {
            background-color: #19325c;
            width: 20%;
        }

        .header .logo-en {
            margin-top: 20px;
        }

        .header {
            margin-bottom: 5px;
        }

        .main-data tr th {
            background-color: #19325c;
            color: #fff;
            width: 12%;
        }

        .main-data tr.odd {
            background-color: #f8bfcd;
            /*color: #fff;*/
        }

        .main-data td, .main-data th {
            border: 1px solid #fff !important;
            padding: 7px;
        }

        body {
            /*background-image: url({$path}/oscopic/print/bg.png);*/
            background-repeat: no-repeat;
            margin-top: -42px;
            background-position: 28% -237px;
            -webkit-print-color-adjust: exact !important;
        }

        .no-border, .no-border td {
            border: 0 !important
        }
    </style>
</head>
<body class="royal1">

<div class="container">
    <div class="header">
        <table class="no-border">
            <tr>
                <td><img src="{$path}/oscopic/print/logo-en3.png" width="300" class="logo-en"></td>
<!--                <td><img class="logo" src="{$path}/oscopic/print/logo.png" width="300"></td>-->

            </tr>
        </table>
    </div>


    <table class="main-data">
        <tr class="even">
            <th class="dark">Name</th>
            <td colspan="2">
                {if $oscopic_report->husband eq 1}
                    {$patient_info->husdandname}
                {else}
                    {$patient_info->wifename}
                {/if}
            </td>
            <th>Age</th>
            <td colspan="2">{$new_dateofbirth_calc} سنه</td>
        </tr>
        <tr class="odd">
            <th>Doctor</th>
            <td colspan="2">{$doctor_info->name}</td>
            <th>Date</th>
            <td colspan="2">{$oscopic_report->created_at}</td>
        </tr>
        <tr class="even">
            <th>Diagnosis</th>
            <td colspan="5">
                {foreach $allDiagnosis as $data}
                {if $data->id|in_array:$oscopic_report->diagnosis}{$data->name} ||{/if}
                {/foreach}
                {$oscopic_report->diagnosis_text}
            </td>
        </tr>
        <tr class="odd">
            <th>Operation</th>
            <td colspan="5">
                <!--{foreach $oscopic_operations as $single}
                {if $single->id eq $oscopic_report->operation_id}{$single->name}{/if}
                {/foreach}-->
                {$oscopic_report->operation_text}
            </td>
        </tr>
        <tr class="even">
            <th>Required <br>
                Examination
            </th>
            <td colspan="5">
                <!--{foreach $oscopic_required_examinations as $single}
                {if $single->id eq $oscopic_report->required_examination_id}{$single->name}{/if}
                {/foreach}-->
                {$oscopic_report->required_examination_text}
            </td>
        </tr>
        <tr class="odd">
            <th>Specimen</th>
            <td colspan="5">
                <!--{foreach $oscopic_specimens as $single}
                {if $single->id eq $oscopic_report->specimen_id}{$single->name}{/if}
                {/foreach}-->
                {$oscopic_report->specimen_text}
            </td>
        </tr>
    </table>


    <!--<div class="footer">
        <table class="no-border">
            <tr>
                <td>
                    <div class="social">
                        <ul>
                            <li><a href="">
                                <img src="{$path}/oscopic/print/face.png" width="25">
                            </a></li>
                            <li><a href="">
                                <img src="{$path}/oscopic/print/youtube.png" width="25">
                            </a></li>
                            <li><a href="">
                                <img src="{$path}/oscopic/print/insta.png" width="25">
                            </a></li>
                        </ul>
                        <a class="site">www.royal.com</a>
                    </div>
                </td>
                <td>
                    <div class="phone">
                        <img src="{$path}/oscopic/print/phone.png" width="100">
                    </div>
                </td>
                <td>
                    <p class="info">
                        امتداد المشاية السفليه <br>
                        المركز الطبى العالمى <br>
                        المنصورة
                    </p>
                </td>
            </tr>
        </table>

    </div>-->

</div>

<script type="text/javascript">
    window.print();
    window.onfocus = function () {
        window.close();
    }
</script>


</body>

</html>