@extends('layouts.app')

@section('page-title', 'Choose-Meking Entries')

@section('content')
<div class="container">
    <h2 class="mb-4">Choose Meking Entries</h2>

    <a href="{{ route('choose.create') }}" class="btn btn-success mb-3">Add New Entry</a>

    <div class="row">
        @foreach($items as $key => $item)
        <div class="col-lg-6 mb-4">
            <div class="card shadow-sm">
                {{-- Top Box --}}
                <div class="card-header bg-light text-center">
                    <div class="mb-2">
                        @if($item->image)
                            <img src="{{ asset('uploads/choose_meking/'.$item->image) }}" alt="Image" class="img-fluid" style="max-height:150px;">
                        @endif
                    </div>
                    <h5>{{ $item->heading }}</h5>
                    <p>{{ $item->sub_heading }}</p>
                </div>

                {{-- Bottom Box --}}
                <div class="card-body">
                    <div class="mb-2"><strong>Title:</strong> {{ $item->title }}</div>
                    <div class="mb-2"><strong>Description:</strong> {{ $item->desc }}</div>
                    <div class="mb-2"><strong>Order No:</strong> {{ $item->order_no }}</div>
                    <div class="mb-2">
                        @if($item->icon)
                            <img src="{{ asset('uploads/choose_meking/'.$item->icon) }}" alt="Icon" style="max-width:50px;">
                        @endif
                    </div>
                    {{-- Actions --}}
                    <div class="mt-3">
                        <a href="{{ route('choose.edit', $item->id) }}" class="btn btn-primary btn-sm">Edit</a>
                        <form action="{{ route('choose.delete', $item->id) }}" method="POST" style="display:inline-block;">
                            @csrf
                            @method('DELETE')
                            <button type="submit" class="btn btn-danger btn-sm"
                                    onclick="return confirm('Are you sure to delete this entry?')">Delete</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        @endforeach
    </div>
</div>
@endsection