@extends('frontend.layouts.app')
<style>
    .form-check {
        margin: 0 auto 20px 0!important;
    }
</style>
@section('frontend-content')

    <div class="content-wrapper">
        <div class="page-header">
            <h3 class="page-title"> {{ trans('main-sidebar.all_teams') }} </h3>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"> <a href="{{ url('/') }}">{{ trans('main-sidebar.dashboard') }}</a> </li>
                    <li class="breadcrumb-item active" aria-current="page"> {{ trans('main-sidebar.all_teams') }} </li>
                </ol>
            </nav>
        </div>
        <div class="row">
            <div class="col-12">
                @foreach($teams as $team)
                <div class="card">
                    <div class="card-body">
                        <div class="mt-4 border-top border-bottom">
                            <table class="table">
                                <thead>
                                    <tr style="background-color: #67e0e1;color: #fff;">
                                        <th>#</th>
                                        <th>{{ trans('main-sidebar.team_name') }}</th>
                                        <th>{{ trans('main-sidebar.number_of_employees') }}</th>
                                        <th>{{ trans('main-sidebar.category') }}</th>
                                        <th>{{ trans('main-sidebar.date') }}</tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>{{ $loop->index +1 }}</td>
                                        <td>{{ $team->name }}</td>
                                        <td>{{ $team->number_of_exams }}</td>
                                        <td>{{ $team->teamCategory->name }}</td>
                                        <td>{{ $team->created_at }}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                @endforeach

            </div>
        </div>


    </div>
    <!-- content-wrapper ends -->
    <!-- partial:partials/_footer.html -->

    <!-- partial -->
@endsection

@push('frontend-script')

@endpush