<head>
    <title>Patch Updates</title>
    <link rel="stylesheet" type="text/css" href="css/ui-darkness/jquery-ui-1.8.12.custom.css">
    <script src="core/resource/sortTable.js"></script>
</head>
<style>
    .list-patch>tbody>tr>td,
    .list-patch>thead>tr>th {
        background-color: #F2F2F2;
        font-family: 'Arial, Helvetica, sans-serif';
        font-size: 1em;
    }

    .update-btn {
        background-color: #336699;
        padding: 5px 10px;
        color: #F2F2F2;
        border-radius: 10px;
        text-decoration: none;
        margin: 5px;
    }

    .update-btn:hover,
    .update-btn:active {
        background-color: #1a3855;
    }


    /* CSS */
    .button-80 {
        background: #fff;
        backface-visibility: hidden;
        border-radius: .375rem;
        border-style: solid;
        border-width: .125rem;
        box-sizing: border-box;
        color: #212121;
        cursor: pointer;
        display: inline-block;
        font-family: Circular, Helvetica, sans-serif;
        font-size: .8rem;
        font-weight: 700;
        letter-spacing: -.01em;
        line-height: 1.3;
        padding: .475rem .6rem;
        position: relative;
        text-align: left;
        text-decoration: none;
        transform: translateZ(0) scale(1);
        transition: transform .2s;
        user-select: none;
        -webkit-user-select: none;
        touch-action: manipulation;
    }

    .button-80:not(:disabled):hover {
        transform: scale(1.05);
        background-color: #e7e7e7
    }

    .button-80:not(:disabled):hover:active {
        transform: scale(1.05) translateY(.125rem);
        background-color: #e7e7e7
    }

    .button-80:focus {
        outline: 0 solid transparent;
        background-color: #e7e7e7
    }

    .button-80:focus:before {
        content: "";
        left: calc(-1*.375rem);
        pointer-events: none;
        position: absolute;
        top: calc(-1*.375rem);
        transition: border-radius;
        user-select: none;
    }

    .button-80:focus:not(:focus-visible) {
        outline: 0 solid transparent;
    }

    .button-80:focus:not(:focus-visible):before {
        border-width: 0;
    }

    .button-80:not(:disabled):active {
        transform: translateY(.125rem);
    }

    .button-2 {
        border-radius: 8px;
        border-width: 0;
        color: #292929;
        display: inline-block;
        font-size: 12px;
        font-weight: 500;
        line-height: 10px;
        list-style: none;
        margin: 0;
        padding: 5px 6px;
        text-align: center;
        transition: all 200ms;
        vertical-align: baseline;
        white-space: nowrap;
    }
</style>
<div class="card">
    {{-- @if ($cannotUpdateAll)
        <p class="text-danger">Not all updates can be applied due to version incompatibility.</p>
    @endif --}}
    @if ($pendingUpdates->isEmpty())
        <p>No updates available.</p>
    @else
        @php
            $tabID = 'table' . rand() + 50;
        @endphp
       <table aria-describedby="mydesc"  class="table list-patch bg-primary" id="{{ $tabID }}" width=100% nowrap='nowarp' cellpadding=6
            cellspacing=1 bgcolor='#DDDDDD'>
            <thead class='simpleThead'>
                <tr>
                    <th scope="col" >Patch Date</th>
                    <th scope="col" >Title</th>
                    <th scope="col" >Level</th>
                    <th scope="col" >Description</th>
                    <th scope="col" >Action</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($pendingUpdates as $update)
                    <tr>
                        <td>{{ $update->PatchDate }}</td>
                        <td>{{ $update->Title }}</td>
                        <td>{{ $update->Level }}</td>
                        <td>{{ $update->Description }}</td>
                        <td style="text-align: center;">
                            @if ($update->Action === 'Update')
                                @php
                                    $data = "$serverKeyClient|$update->PatchID|$clientVersion";
                                    $encryptedData = Crypt::encrypt($data);
                                @endphp
                                <a href="data_defaulttemplate.php?UID={{ $uId }}&UCODE={{ $uCode }}&SERVICENAME=IMCORESERVICE&ACTION=SMART_UPDATE&PATCHID={{ $update->PatchID }}"
                                    class="btn button-80">Update</a>
                            @else
                                <p class="button-2" >{{ $update->Action }}</p>
                            @endif
                        </td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    @endif
</div>
