@section('title', 'Brand Videos')

<div>
    <div class="card">
        <div class="card-header">
            <h5>Manage Videos</h5>
        </div>
        <div class="card-body">
            @if (session()->has('message'))
                <div class="alert alert-success">{{ session('message') }}</div>
            @endif

            <form wire:submit.prevent="addVideo" class="row align-items-end mb-4">
                <div class="col-md-8">
                    <label class="form-label">YouTube Video Link or ID</label>
                    <input type="text" class="form-control" wire:model="brand_video_link" placeholder="e.g. https://www.youtube.com/watch?v=dQw4w9WgXcQ">
                    @error('brand_video_link') <span class="text-danger">{{ $message }}</span> @enderror
                </div>
                <div class="col-md-4">
                    <button type="submit" class="btn btn-primary w-100">Add Video</button>
                </div>
            </form>

            <div class="row">
                @foreach ($videos as $video)
                    <div class="col-md-4 mb-4">
                        <div class="card h-100">
                            <div class="ratio ratio-16x9">
                                <iframe src="https://www.youtube.com/embed/{{ $video->brand_video_link }}" allowfullscreen></iframe>
                            </div>
                            <div class="card-body text-center">
                                <button class="btn btn-danger btn-sm" wire:click="deleteVideo({{ $video->brands_videos_id }})" onclick="return confirm('Are you sure?')">
                                    <i class="ti ti-trash"></i> Delete
                                </button>
                            </div>
                        </div>
                    </div>
                @endforeach
                @if($videos->isEmpty())
                    <div class="col-12 text-center py-5 text-muted">No videos found.</div>
                @endif
            </div>

            <div class="mt-3">
                <a href="{{ route('data-entry.dashboard', $brandId) }}" class="btn btn-secondary">Back to Dashboard</a>
            </div>
        </div>
    </div>
</div>