@extends('layouts.app')

@section('title', 'Lists')

@section('content')
    <!-- [ page-header ] start -->
    <div class="page-header">
        <div class="page-header-left d-flex align-items-center">
            <div class="page-header-title">
                <h5 class="m-b-10">Lists</h5>
            </div>
            <ul class="breadcrumb">
                <li class="breadcrumb-item"><a href="{{ route('index') }}">Home</a></li>
                <li class="breadcrumb-item">Lists</li>
            </ul>
        </div>
        <div class="page-header-right ms-auto">
            <div class="page-header-right-items">
                <div class="d-flex d-md-none">
                    <a href="javascript:void(0)" class="page-header-right-close-toggle">
                        <i class="feather-arrow-left me-2"></i>
                        <span>Back</span>
                    </a>
                </div>
                <div class="d-flex align-items-center gap-2 page-header-right-items-wrapper">
                    <a href="javascript:void(0);" class="btn btn-icon btn-light-brand" data-bs-toggle="collapse"
                        data-bs-target="#collapseOne">
                        <i class="feather-bar-chart"></i>
                    </a>
                    <div class="dropdown">
                        <a class="btn btn-icon btn-light-brand" data-bs-toggle="dropdown" data-bs-offset="0, 10"
                            data-bs-auto-close="outside">
                            <i class="feather-filter"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-end">
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-eye me-3"></i>
                                <span>All</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-users me-3"></i>
                                <span>Group</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-flag me-3"></i>
                                <span>Country</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-dollar-sign me-3"></i>
                                <span>Invoice</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-briefcase me-3"></i>
                                <span>Project</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-user-check me-3"></i>
                                <span>Active</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="feather-user-minus me-3"></i>
                                <span>Inactive</span>
                            </a>
                        </div>
                    </div>
                    <div class="dropdown">
                        <a class="btn btn-icon btn-light-brand" data-bs-toggle="dropdown" data-bs-offset="0, 10"
                            data-bs-auto-close="outside">
                            <i class="feather-paperclip"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-end">
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="bi bi-filetype-pdf me-3"></i>
                                <span>PDF</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="bi bi-filetype-csv me-3"></i>
                                <span>CSV</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="bi bi-filetype-xml me-3"></i>
                                <span>XML</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="bi bi-filetype-txt me-3"></i>
                                <span>Text</span>
                            </a>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="bi bi-filetype-exe me-3"></i>
                                <span>Excel</span>
                            </a>
                            <div class="dropdown-divider"></div>
                            <a href="javascript:void(0);" class="dropdown-item">
                                <i class="bi bi-printer me-3"></i>
                                <span>Print</span>
                            </a>
                        </div>
                    </div>
                    {{-- <a href="{{ route('ticket-create') }}" class="btn btn-primary">
                        <i class="feather-plus me-2"></i>
                        <span>Create Ticket</span>
                    </a> --}}
                </div>
            </div>
            <div class="d-md-none d-flex align-items-center">
                <a href="javascript:void(0)" class="page-header-right-open-toggle">
                    <i class="feather-align-right fs-20"></i>
                </a>
            </div>
        </div>
    </div>
    <div class="row p-2">
        <!--calls tasks events -->
        <div class="col-xxl-6 col-lg-12 p-3">
            <div class="card stretch stretch-full">
                <div class="card-header">
                    <h5 class="card-title">Scheduled Lists</h5>
                    <div class="card-header-action">
                        <div class="card-header-btn">
                            <div data-bs-toggle="tooltip" title="Delete">
                                <a href="javascript:void(0);" class="avatar-text avatar-xs bg-danger"
                                    data-bs-toggle="remove"> </a>
                            </div>
                            <div data-bs-toggle="tooltip" title="Refresh">
                                <a href="javascript:void(0);" class="avatar-text avatar-xs bg-warning"
                                    data-bs-toggle="refresh"> </a>
                            </div>
                            <div data-bs-toggle="tooltip" title="Maximize/Minimize">
                                <a href="javascript:void(0);" class="avatar-text avatar-xs bg-success"
                                    data-bs-toggle="expand"> </a>
                            </div>
                        </div>
                        <div class="dropdown">
                            <a href="javascript:void(0);" class="avatar-text avatar-sm" data-bs-toggle="dropdown"
                                data-bs-offset="25, 25">
                                <div data-bs-toggle="tooltip" title="Options">
                                    <i class="feather-more-vertical"></i>
                                </div>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-at-sign"></i>New</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-calendar"></i>Event</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-bell"></i>Snoozed</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-trash-2"></i>Deleted</a>
                                <div class="dropdown-divider"></div>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-settings"></i>Settings</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i class="feather-life-buoy"></i>Tips
                                    & Tricks</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <!--calls !-->

                    @php
                        $futureActivities = $calls->filter(function ($call) {
                            $displayDate = $call->created_at;
                            return \Carbon\Carbon::parse($displayDate)->isFuture();
                        });

                        $bgClasses = [
                            'bg-soft-primary text-primary',
                            'bg-soft-warning text-warning',
                            'bg-soft-success text-success',
                            'bg-soft-danger text-danger',
                        ];
                    @endphp

                    @foreach ($futureActivities as $activity)
                        @php
                            $displayDate =
                                $activity->start_date ??
                                ($activity->due_date ?? ($activity->received_on ?? $activity->created_at));

                            $formattedDate = \Carbon\Carbon::parse($displayDate);
                            $classIndex = $loop->index % count($bgClasses);
                            $dynamicClasses = $bgClasses[$classIndex];
                        @endphp
                        <div class="p-3 border border-dashed rounded-3 mb-3">
                            <div class="d-flex justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <div
                                        class="wd-50 ht-50 {{ $dynamicClasses }} lh-1 d-flex align-items-center justify-content-center flex-column rounded-2 schedule-date">
                                        <span class="fs-18 fw-bold mb-1 d-block">{{ $formattedDate->format('d') }}</span>
                                        <span
                                            class="fs-10 fw-semibold text-uppercase d-block">{{ $formattedDate->format('M') }}</span>
                                    </div>
                                    <div class="text-dark">
                                        <a href="javascript:void(0);"
                                            class="fw-bold mb-2 text-truncate-1-line">{{ $activity->topic }}</a>
                                        <span class="fs-11 fw-normal text-muted text-truncate-1-line">
                                            {{ $formattedDate->format('Y-m-d, h:i A') }}
                                        </span>
                                    </div>
                                </div>
                                <div class="dropdown">
                                    <a href="javascript:void(0)" class="avatar-text avatar-md" data-bs-toggle="dropdown"
                                        data-bs-offset="0,21">
                                        <i class="feather feather-more-horizontal"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item"
                                                href="{{ route('call.edit') }}?id={{ $activity->id }}"><i
                                                    class="feather feather-edit-3 me-3"></i><span>Edit</span></a>
                                        </li>
                                        <li>
                                            <form action="{{ route('call.destroy', $activity->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this Activity?');"
                                                style="display: inline;">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="dropdown-item text-danger"
                                                    style="border: none; background: none; padding-left: 15px;">
                                                    <i class="feather feather-trash-2 me-3"></i><span>Delete</span>
                                                </button>
                                            </form>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @endforeach


                    <!--tasks !-->

                    @php
                        $futureActivities = $tasks->filter(function ($task) {
                            $displayDate = $task->due_date_time ?? $task->created_at;
                            return \Carbon\Carbon::parse($displayDate)->isFuture();
                        });

                        $bgClasses = [
                            'bg-soft-primary text-primary',
                            'bg-soft-warning text-warning',
                            'bg-soft-success text-success',
                            'bg-soft-danger text-danger',
                        ];
                    @endphp

                    @foreach ($futureActivities as $activity)
                        @php
                            $displayDate = $activity->due_date_time ?? $activity->created_at;

                            $formattedDate = \Carbon\Carbon::parse($displayDate);
                            $classIndex = $loop->index % count($bgClasses);
                            $dynamicClasses = $bgClasses[$classIndex];
                        @endphp
                        <div class="p-3 border border-dashed rounded-3 mb-3">
                            <div class="d-flex justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <div
                                        class="wd-50 ht-50 {{ $dynamicClasses }} lh-1 d-flex align-items-center justify-content-center flex-column rounded-2 schedule-date">
                                        <span class="fs-18 fw-bold mb-1 d-block">{{ $formattedDate->format('d') }}</span>
                                        <span
                                            class="fs-10 fw-semibold text-uppercase d-block">{{ $formattedDate->format('M') }}</span>
                                    </div>
                                    <div class="text-dark">
                                        <a href="javascript:void(0);"
                                            class="fw-bold mb-2 text-truncate-1-line">{{ $activity->topic }}</a>
                                        <span class="fs-11 fw-normal text-muted text-truncate-1-line">
                                            {{ $formattedDate->format('Y-m-d, h:i A') }}
                                        </span>
                                    </div>
                                </div>
                                <div class="dropdown">
                                    <a href="javascript:void(0)" class="avatar-text avatar-md" data-bs-toggle="dropdown"
                                        data-bs-offset="0,21">
                                        <i class="feather feather-more-horizontal"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item"
                                                href="{{ route('task.edit') }}?id={{ $activity->id }}"><i
                                                    class="feather feather-edit-3 me-3"></i><span>Edit</span></a>
                                        </li>
                                        <li>
                                            <form action="{{ route('task.destroy', $activity->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this Activity?');"
                                                style="display: inline;">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="dropdown-item text-danger"
                                                    style="border: none; background: none; padding-left: 15px;">
                                                    <i class="feather feather-trash-2 me-3"></i><span>Delete</span>
                                                </button>
                                            </form>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @endforeach


                    <!--events !-->

                    @php
                        $futureActivities = $events->filter(function ($event) {
                            $displayDate = $event->due_date_time ?? $event->created_at;
                            return \Carbon\Carbon::parse($displayDate)->isFuture();
                        });

                        $bgClasses = [
                            'bg-soft-primary text-primary',
                            'bg-soft-warning text-warning',
                            'bg-soft-success text-success',
                            'bg-soft-danger text-danger',
                        ];
                    @endphp

                    @foreach ($futureActivities as $activity)
                        @php
                            $displayDate = $displayDate = $activity->due_date_time ?? $activity->created_at;

                            $formattedDate = \Carbon\Carbon::parse($displayDate);
                            $classIndex = $loop->index % count($bgClasses);
                            $dynamicClasses = $bgClasses[$classIndex];
                        @endphp
                        <div class="p-3 border border-dashed rounded-3 mb-3">
                            <div class="d-flex justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <div
                                        class="wd-50 ht-50 {{ $dynamicClasses }} lh-1 d-flex align-items-center justify-content-center flex-column rounded-2 schedule-date">
                                        <span class="fs-18 fw-bold mb-1 d-block">{{ $formattedDate->format('d') }}</span>
                                        <span
                                            class="fs-10 fw-semibold text-uppercase d-block">{{ $formattedDate->format('M') }}</span>
                                    </div>
                                    <div class="text-dark">
                                        <a href="javascript:void(0);"
                                            class="fw-bold mb-2 text-truncate-1-line">{{ $activity->topic }}</a>
                                        <span class="fs-11 fw-normal text-muted text-truncate-1-line">
                                            {{ $formattedDate->format('Y-m-d, h:i A') }}
                                        </span>
                                    </div>
                                </div>
                                <div class="dropdown">
                                    <a href="javascript:void(0)" class="avatar-text avatar-md" data-bs-toggle="dropdown"
                                        data-bs-offset="0,21">
                                        <i class="feather feather-more-horizontal"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item"
                                                href="{{ route('event.edit') }}?id={{ $activity->id }}"><i
                                                    class="feather feather-edit-3 me-3"></i><span>Edit</span></a>
                                        </li>
                                        <li>
                                            <form action="{{ route('event.destroy', $activity->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this Activity?');"
                                                style="display: inline;">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="dropdown-item text-danger"
                                                    style="border: none; background: none; padding-left: 15px;">
                                                    <i class="feather feather-trash-2 me-3"></i><span>Delete</span>
                                                </button>
                                            </form>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
                <a href="javascript:void(0);" class="card-footer fs-11 fw-bold text-uppercase text-center py-4">Upcomming
                    Lists</a>
            </div>
        </div>

        <!-- expired calls tasks events -->

        <div class="col-xxl-6 col-lg-12 p-3">
            <div class="card stretch stretch-full">
                <div class="card-header">
                    <h5 class="card-title">Overdue Lists</h5>
                    <div class="card-header-action">
                        <div class="card-header-btn">
                            <div data-bs-toggle="tooltip" title="Delete">
                                <a href="javascript:void(0);" class="avatar-text avatar-xs bg-danger"
                                    data-bs-toggle="remove"> </a>
                            </div>
                            <div data-bs-toggle="tooltip" title="Refresh">
                                <a href="javascript:void(0);" class="avatar-text avatar-xs bg-warning"
                                    data-bs-toggle="refresh"> </a>
                            </div>
                            <div data-bs-toggle="tooltip" title="Maximize/Minimize">
                                <a href="javascript:void(0);" class="avatar-text avatar-xs bg-success"
                                    data-bs-toggle="expand"> </a>
                            </div>
                        </div>
                        <div class="dropdown">
                            <a href="javascript:void(0);" class="avatar-text avatar-sm" data-bs-toggle="dropdown"
                                data-bs-offset="25, 25">
                                <div data-bs-toggle="tooltip" title="Options">
                                    <i class="feather-more-vertical"></i>
                                </div>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-at-sign"></i>New</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-calendar"></i>Event</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-bell"></i>Snoozed</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-trash-2"></i>Deleted</a>
                                <div class="dropdown-divider"></div>
                                <a href="javascript:void(0);" class="dropdown-item"><i
                                        class="feather-settings"></i>Settings</a>
                                <a href="javascript:void(0);" class="dropdown-item"><i class="feather-life-buoy"></i>Tips
                                    & Tricks</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <!--calls !-->

                    @php
                        $futureActivities = $calls->filter(function ($call) {
                            $displayDate = $call->created_at;
                            return \Carbon\Carbon::parse($displayDate)->isPast();
                        });

                        $bgClasses = [
                            'bg-soft-primary text-primary',
                            'bg-soft-warning text-warning',
                            'bg-soft-success text-success',
                            'bg-soft-danger text-danger',
                        ];
                    @endphp

                    @foreach ($futureActivities as $activity)
                        @php
                            $displayDate =
                                $activity->start_date ??
                                ($activity->due_date ?? ($activity->received_on ?? $activity->created_at));

                            $formattedDate = \Carbon\Carbon::parse($displayDate);
                            $classIndex = $loop->index % count($bgClasses);
                            $dynamicClasses = $bgClasses[$classIndex];
                        @endphp
                        <div class="p-3 border border-dashed rounded-3 mb-3">
                            <div class="d-flex justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <div
                                        class="wd-50 ht-50 {{ $dynamicClasses }} lh-1 d-flex align-items-center justify-content-center flex-column rounded-2 schedule-date">
                                        <span class="fs-18 fw-bold mb-1 d-block">{{ $formattedDate->format('d') }}</span>
                                        <span
                                            class="fs-10 fw-semibold text-uppercase d-block">{{ $formattedDate->format('M') }}</span>
                                    </div>
                                    <div class="text-dark">
                                        <a href="javascript:void(0);"
                                            class="fw-bold mb-2 text-truncate-1-line">{{ $activity->topic }}</a>
                                        <span class="fs-11 fw-normal text-muted text-truncate-1-line">
                                            {{ $formattedDate->format('Y-m-d, h:i A') }}
                                        </span>
                                    </div>
                                </div>
                                <div class="dropdown">
                                    <a href="javascript:void(0)" class="avatar-text avatar-md" data-bs-toggle="dropdown"
                                        data-bs-offset="0,21">
                                        <i class="feather feather-more-horizontal"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item"
                                                href="{{ route('call.edit') }}?id={{ $activity->id }}"><i
                                                    class="feather feather-edit-3 me-3"></i><span>Edit</span></a>
                                        </li>
                                        <li>
                                            <form action="{{ route('call.destroy', $activity->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this Activity?');"
                                                style="display: inline;">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="dropdown-item text-danger"
                                                    style="border: none; background: none; padding-left: 15px;">
                                                    <i class="feather feather-trash-2 me-3"></i><span>Delete</span>
                                                </button>
                                            </form>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @endforeach


                    <!--tasks !-->

                    @php
                        $futureActivities = $tasks->filter(function ($task) {
                            $displayDate = $task->due_date_time ?? $task->created_at;
                            return \Carbon\Carbon::parse($displayDate)->isPast();
                        });

                        $bgClasses = [
                            'bg-soft-primary text-primary',
                            'bg-soft-warning text-warning',
                            'bg-soft-success text-success',
                            'bg-soft-danger text-danger',
                        ];
                    @endphp

                    @foreach ($futureActivities as $activity)
                        @php
                            $displayDate = $activity->due_date_time ?? $activity->created_at;

                            $formattedDate = \Carbon\Carbon::parse($displayDate);
                            $classIndex = $loop->index % count($bgClasses);
                            $dynamicClasses = $bgClasses[$classIndex];
                        @endphp
                        <div class="p-3 border border-dashed rounded-3 mb-3">
                            <div class="d-flex justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <div
                                        class="wd-50 ht-50 {{ $dynamicClasses }} lh-1 d-flex align-items-center justify-content-center flex-column rounded-2 schedule-date">
                                        <span class="fs-18 fw-bold mb-1 d-block">{{ $formattedDate->format('d') }}</span>
                                        <span
                                            class="fs-10 fw-semibold text-uppercase d-block">{{ $formattedDate->format('M') }}</span>
                                    </div>
                                    <div class="text-dark">
                                        <a href="javascript:void(0);"
                                            class="fw-bold mb-2 text-truncate-1-line">{{ $activity->topic }}</a>
                                        <span class="fs-11 fw-normal text-muted text-truncate-1-line">
                                            {{ $formattedDate->format('Y-m-d, h:i A') }}
                                        </span>
                                    </div>
                                </div>
                                <div class="dropdown">
                                    <a href="javascript:void(0)" class="avatar-text avatar-md" data-bs-toggle="dropdown"
                                        data-bs-offset="0,21">
                                        <i class="feather feather-more-horizontal"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item"
                                                href="{{ route('task.edit') }}?id={{ $activity->id }}"><i
                                                    class="feather feather-edit-3 me-3"></i><span>Edit</span></a>
                                        </li>
                                        <li>
                                            <form action="{{ route('task.destroy', $activity->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this Activity?');"
                                                style="display: inline;">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="dropdown-item text-danger"
                                                    style="border: none; background: none; padding-left: 15px;">
                                                    <i class="feather feather-trash-2 me-3"></i><span>Delete</span>
                                                </button>
                                            </form>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @endforeach


                    <!--events !-->

                    @php
                        $futureActivities = $events->filter(function ($event) {
                            $displayDate = $event->due_date_time ?? $event->created_at;
                            return \Carbon\Carbon::parse($displayDate)->isPast();
                        });

                        $bgClasses = [
                            'bg-soft-primary text-primary',
                            'bg-soft-warning text-warning',
                            'bg-soft-success text-success',
                            'bg-soft-danger text-danger',
                        ];
                    @endphp

                    @foreach ($futureActivities as $activity)
                        @php
                            $displayDate = $displayDate = $activity->due_date_time ?? $activity->created_at;

                            $formattedDate = \Carbon\Carbon::parse($displayDate);
                            $classIndex = $loop->index % count($bgClasses);
                            $dynamicClasses = $bgClasses[$classIndex];
                        @endphp
                        <div class="p-3 border border-dashed rounded-3 mb-3">
                            <div class="d-flex justify-content-between">
                                <div class="d-flex align-items-center gap-3">
                                    <div
                                        class="wd-50 ht-50 {{ $dynamicClasses }} lh-1 d-flex align-items-center justify-content-center flex-column rounded-2 schedule-date">
                                        <span class="fs-18 fw-bold mb-1 d-block">{{ $formattedDate->format('d') }}</span>
                                        <span
                                            class="fs-10 fw-semibold text-uppercase d-block">{{ $formattedDate->format('M') }}</span>
                                    </div>
                                    <div class="text-dark">
                                        <a href="javascript:void(0);"
                                            class="fw-bold mb-2 text-truncate-1-line">{{ $activity->topic }}</a>
                                        <span class="fs-11 fw-normal text-muted text-truncate-1-line">
                                            {{ $formattedDate->format('Y-m-d, h:i A') }}
                                        </span>
                                    </div>
                                </div>
                                <div class="dropdown">
                                    <a href="javascript:void(0)" class="avatar-text avatar-md" data-bs-toggle="dropdown"
                                        data-bs-offset="0,21">
                                        <i class="feather feather-more-horizontal"></i>
                                    </a>
                                    <ul class="dropdown-menu">
                                        <li><a class="dropdown-item"
                                                href="{{ route('event.edit') }}?id={{ $activity->id }}"><i
                                                    class="feather feather-edit-3 me-3"></i><span>Edit</span></a>
                                        </li>
                                        <li>
                                            <form action="{{ route('event.destroy', $activity->id) }}" method="POST"
                                                onsubmit="return confirm('Are you sure you want to delete this Activity?');"
                                                style="display: inline;">
                                                @csrf
                                                @method('DELETE')
                                                <button type="submit" class="dropdown-item text-danger"
                                                    style="border: none; background: none; padding-left: 15px;">
                                                    <i class="feather feather-trash-2 me-3"></i><span>Delete</span>
                                                </button>
                                            </form>
                                        </li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
                <a href="javascript:void(0);" class="card-footer fs-11 fw-bold text-uppercase text-center py-4">Overdue
                    Lists</a>
            </div>
        </div>



    </div>
    <!-- [ page-header ] end -->
    <!-- [ Main Content ] start -->

    <!-- [ Main Content ] end -->
@endsection
