@extends('layouts.master')

@section('body')
    <div class="flex justify-between">
        <h3 class="text-orange-400 text-base md:text-3xl font-medium">Şassi Möhürləri</h3>
    </div>
    <div class="flex flex-col mt-4">
        <div class="-my-2 py-2 overflow-x-auto sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8">
            <div class="align-middle inline-block min-w-full shadow overflow-hidden sm:rounded-lg border-b border-gray-200">
                <table class="min-w-full text-center">
                    <thead>
                        <tr>
                            <th
                                class="px-2 py-2 md:!px-6 md:!py-4 border-b border-gray-200 bg-gray-50 text-xs leading-4 font-normal md:font-medium text-gray-500 normal-case md:uppercase tracking-wider">
                                №
                            </th>
                            <th
                                class="px-2 py-2 md:!px-6 md:!py-4 border-b border-gray-200 bg-gray-50 text-xs leading-4 font-normal md:font-medium text-gray-500 normal-case md:uppercase tracking-wider">
                                Adı
                            </th>
                            <th
                                class="px-2 py-2 md:!px-6 md:!py-4 border-b border-gray-200 bg-gray-50 text-xs leading-4 font-normal md:font-medium text-gray-500 normal-case md:uppercase tracking-wider">
                                Quraşdırılma tarixi
                            </th>
                            <th
                                class="px-2 py-2 md:!px-6 md:!py-4 border-b border-gray-200 bg-gray-50 text-xs leading-4 font-normal md:font-medium text-gray-500 normal-case md:uppercase tracking-wider">
                                Çıxarılma tarixi
                            </th>
                        </tr>
                    </thead>

                    <tbody class="bg-white">
                        @foreach ($seals as $seal)
                            <tr>
                                <td
                                    class="px-2 py-2 md:!px-6 md:!py-4 text-xs md:text-base whitespace-no-wrap border-b border-gray-200 leading-5 md:font-bold">
                                    {{ $loop->index + 1 }}
                                </td>
                                <td
                                    class="px-2 py-2 md:!px-6 md:!py-4 text-xs md:text-base whitespace-no-wrap border-b border-gray-200 leading-5 md:font-bold">
                                    {{ $seal->name }}
                                </td>
                                <td
                                    class="px-2 py-2 md:!px-6 md:!py-4 text-xs md:text-base whitespace-no-wrap border-b border-gray-200 leading-5 md:font-bold">
                                    {{ $seal->created_at }}
                                </td>
                                <td
                                    class="px-2 py-2 md:!px-6 md:!py-4 text-xs md:text-base whitespace-no-wrap border-b border-gray-200 leading-5 md:font-bold">
                                    {{ $seal->removal_date ?? '' }}
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection