@extends('layouts.app')
<style>
    body {
        font-family: Arial, sans-serif;
        margin: 0;
        padding: 0;
        background-color: #f5f5f5;
    }

    .container {
        max-width: 1000px;
        margin: 20px auto;
        padding: 20px;
        background-color: #fff;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        border-radius: 5px;
    }

    h1 {
        color: #333;
    }

    p {
        color: #666;
    }


    .event-info {
        margin-bottom: 20px;
    }

    .event-info p {
        margin: 10px 0;
    }

    .event-description {
        border-top: 1px solid #ddd;
        padding-top: 20px;
    }

    .event-description h2 {
        margin-top: 0;
        color: #333;
    }

    .event-description p {
        color: #666;
        line-height: 1.6;
    }
</style>
@section('content')
    <div class="page-wrapper">
        <!-- Page-header start -->
        <div class="page-header">
            <div class="row align-items-end">
                <div class="col-lg-8">
                    <div class="page-header-breadcrumb">
                        <ul class="breadcrumb-title">
                            <li class="breadcrumb-item">
                                <a href="{{ url('') }}"> <i class="feather icon-home"></i> </a>
                            </li>
                            <li class="breadcrumb-item">Interview / Schedule Details</li>
                        </ul>
                    </div>
                    <div style="clear: both"></div>
                    <div class="page-header-title">
                        <div class="d-inline">
                            <h4>Schedule Details</h4>
                        </div>

                    </div>
                </div>

            </div>
        </div>
        <!-- Page-header end -->

        <!-- Page-body start -->
        <div class="page-body">
            <div class="row">
                <div class="col-sm-12">
                    <div class="card">
                        <div class="card-block">
                            <div class="row">
                                <div class="mx-5">
                                    <div class="event-info">
                                        <p><b>Title:</b> {{ $leads->event_name }}</p>
                                        <p><b>Date:</b> {{ date('d-m-Y', strtotime($leads->start_date)) }}</p>
                                        <p><b>Time:</b> {{ date('h:i A', strtotime($leads->start_date)) }} -
                                            {{ date('h:i A', strtotime($leads->end_date)) }}</p>
                                        <p><b>Meeting Link:</b> {{ $leads->meetlink }}</p>
                                        <p><b>Description:</b> {{ $leads->summary }}</p>
                                    </div>
                                </div>
                                
                            </div>
                            <br>
                            <div class="row mx-4">
                                @php
                                $i = 0;
                            @endphp
                            
                            <h5>Guest List</h5>
                            <br>
                            <table id="simpletable" class="table table-striped table-bordered nowrap ">
                                <thead>
                                    <tr>
                                        <th width="8%">Sr. No.</th>
                                        <th width="15%">Name</th>
                                        <th width="10%">E-mail</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @if (count($guest) > 0)
                                        @foreach ($guest as $key => $item)
                                            <tr>
                                                <td>{{ ++$i }}</td>
                                                <td>{{ $item->display_name }}</td>
                                                <td>{{ $item->guest_email }}</td>
                                            </tr>
                                        @endforeach
                                    @endif
                                </tbody>
                            </table>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Page-body end -->
    </div>

    <script src="{{ asset('bower_components\datatables.net\js\jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('bower_components\datatables.net-buttons\js\dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('bower_components\datatables.net-bs4\js\dataTables.bootstrap4.min.js') }}"></script>


    <script></script>
@endsection
<!-- data-table js -->