@extends('layouts.admin')

@section('content')
    <section class="d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3 mb-4">
        <div>
            <p class="small text-success fw-bold text-uppercase mb-2" style="letter-spacing: .08em;"><span data-admin-en="Details" data-admin-as="বিৱৰণ">Details</span></p>
            <h1 class="h3 fw-bold admin-text mb-1"><span data-admin-en="Gallery Image" data-admin-as="গেলাৰী ছবি">Gallery Image</span> #{{ $record->id }}</h1>
            <p class="small admin-muted mb-0"><span data-admin-en="Full database record for gallery images." data-admin-as="গেলাৰী ছবিৰ সম্পূৰ্ণ ডাটাবেছ ৰেকৰ্ড।">Full database record for gallery images.</span></p>
        </div>
        <a class="btn glass-card admin-text rounded-4 px-3 fw-semibold d-inline-flex align-items-center gap-2" href="{{ route('admin.gallery-images.index') }}">
            <i data-lucide="arrow-left" width="16" height="16"></i>
            <span data-admin-en="Back" data-admin-as="উভতি যাওক">Back</span>
        </a>
    </section>

    <section class="glass-card rounded-4 p-3 p-lg-4">
        <div class="row g-3">
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Title" data-admin-as="শিৰোনাম">Title</span></p>
                            @php
                                $valueEn = $record->title_en ?: '-';
                                $valueAs = $record->title_as ?: $valueEn;
                            @endphp
                            <div class="admin-text" style="white-space: pre-line;" data-admin-en="{{ $valueEn }}" data-admin-as="{{ $valueAs }}">{{ $valueEn }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Album" data-admin-as="এলবাম">Album</span></p>
                            @php
                                $valueEn = $record->album?->title_en ?: '-';
                                $valueAs = $record->album?->title_as ?: $valueEn;
                            @endphp
                            <div class="admin-text" data-admin-en="{{ $valueEn }}" data-admin-as="{{ $valueAs }}">{{ $valueEn }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Image" data-admin-as="ছবি">Image</span></p>
                            @php
                                $valueEn = $record->image?->title_en ?: '-';
                                $valueAs = $record->image?->title_as ?: $valueEn;
                            @endphp
                            <div class="admin-text" data-admin-en="{{ $valueEn }}" data-admin-as="{{ $valueAs }}">{{ $valueEn }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Status" data-admin-as="স্থিতি">Status</span></p>
                            @php
                                $statusEn = str($record->status ?? '-')->replace('_', ' ')->title()->toString();
                                $statusAs = $selectOptionLabelsAs[$record->status ?? ''] ?? $statusEn;
                            @endphp
                            <div class="admin-text" data-admin-en="{{ $statusEn }}" data-admin-as="{{ $statusAs }}">{{ $statusEn }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Sort Order" data-admin-as="ক্ৰম">Sort Order</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->sort_order ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Album" data-admin-as="এলবাম">Album</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->album_id ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Category" data-admin-as="শ্ৰেণী">Category</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->category_id ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Image" data-admin-as="ছবি">Image</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->image_id ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Title (English)" data-admin-as="শিৰোনাম (ইংৰাজী)">Title (English)</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->title_en ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Title (Assamese)" data-admin-as="শিৰোনাম (অসমীয়া)">Title (Assamese)</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->title_as ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Caption (English)" data-admin-as="কেপচন (ইংৰাজী)">Caption (English)</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->caption_en ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Caption (Assamese)" data-admin-as="কেপচন (অসমীয়া)">Caption (Assamese)</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->caption_as ?? '-' }}</div>
                    </div>
                </div>
                <div class="col-12 col-lg-6">
                    <div class="rounded-4 p-3 h-100" style="background: var(--admin-input); border: 1px solid var(--admin-border);">
                        <p class="small text-uppercase admin-muted-strong fw-bold mb-2"><span data-admin-en="Status" data-admin-as="স্থিতি">Status</span></p>
<div class="admin-text" style="white-space: pre-line;">{{ $record->status ?? '-' }}</div>
                    </div>
                </div>
        </div>
    </section>
@endsection