@extends('layout.master')
@section('courses', 'active')


@section('content')

<style>
    .table {
        width: 100%;
        border-collapse: collapse;
    }

    .table td,
    .table th {
        padding: 12px 15px;
        border: 1px solid #ddd;
        text-align: center;
        font-size: 14px;
    }

    .table th {
        background-color: #060606;
        color: #ffffff;
    }

    .table tbody tr:nth-child(even) {
        background-color: #d1e8f5;
    }

    /*responsive*/

    @media (max-width: 500px) {
        .table thead {
            display: none;
        }

        .table,
        .table tbody,
        .table tr,
        .table td {
            display: block;
            width: 100%;
        }

        .table tr {
            margin-bottom: 15px;
        }

        .table td {
            padding-left: 50% !important;
            text-align: left;
            position: relative;
        }

        .table td::before {
            content: attr(data-label);
            position: absolute;
            left: 0;
            width: 50%;
            padding-left: 15px;
            font-size: 15px;
            font-weight: bold;
            text-align: left;
        }
    }
    </style>

        <div class="page-content instructor-page-content">
            <div class="container">
                <div class="row">

                @include('user.templates.user-sidebar')

                    <div class="col-xl-9 col-lg-8 col-md-12">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="settings-widget">
                                    <div class="settings-inner-blk p-0">
                                        <div class="sell-course-head comman-space">
                                            <h3>Courses</h3>
                                        </div>
                                        <div class="comman-space pb-0">

                                            <div class="settings-tickets-blk course-instruct-blk table-responsive">


                                                <table class="table">
                                                    <thead>

                                                        <th>Courses</th>
                                                        <th>University</th>
                                                        <th>Duration</th>


                                                    </thead>
                                                    <tbody>
@forelse ($orders as $item)
<tr>

    <td data-label="Courses">
       {{$item->course_sub_category_item}}
    </td>
    <td data-label="University">
        {{$item->university_name}}
     </td>
    <td data-label="Duration"> {{$item->time}}</td>


</tr>
@empty
<tr>
    <td colspan="3">
        Yet Enrolled
    </td>
</tr>
@endforelse





                                                    </tbody>
                                                </table>




                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
@endsection