@extends('layouts.repository')

@section('title', $item->title)

@section('styles')
<style>
    .item-thumbnail {
        background: linear-gradient(135deg, #e8f0fe 0%, #d2e3fc 100%);
    }
    .metadata-table tr:nth-child(even) { background-color: #f8fafc; }
</style>
@endsection

@section('content')
<!-- Breadcrumb Bar -->
<div class="bg-primary/5 border-b border-primary/10 py-5">
    <div class="container mx-auto px-4">
        <div class="flex items-center gap-2 text-xs font-bold text-slate-400 uppercase tracking-widest flex-wrap">
            <a href="{{ url('/') }}" class="hover:text-primary transition-colors">Home</a>
            <span class="material-icons text-sm">chevron_right</span>
            @if($item->collection && $item->collection->community)
                <a href="{{ route('communities.show', $item->collection->community->slug) }}" class="hover:text-primary transition-colors">
                    {{ Str::limit($item->collection->community->name, 35) }}
                </a>
                <span class="material-icons text-sm">chevron_right</span>
                <span class="text-primary">{{ Str::limit($item->collection->name, 30) }}</span>
            @else
                <span class="text-primary">Item Detail</span>
            @endif
        </div>
    </div>
</div>

<div class="container mx-auto px-4 py-12">
    <div class="grid lg:grid-cols-3 gap-12">

        <!-- LEFT COLUMN: Document Preview + Quick Actions -->
        <aside class="lg:col-span-1 space-y-6">
            <!-- Document Thumbnail -->
            <div class="item-thumbnail rounded-3xl p-10 flex flex-col items-center justify-center text-center shadow-sm border border-blue-100 min-h-64">
                @php $thumb = $item->bitstreams->where('bundle', 'THUMBNAIL')->first(); @endphp
                @if($thumb)
                    <img src="{{ Storage::disk('public')->url($thumb->file_path) }}" class="max-h-48 rounded-xl shadow-lg border border-slate-100 object-cover" alt="Cover Image">
                @else
                    <div class="w-24 h-24 bg-white rounded-2xl shadow-xl flex items-center justify-center mb-6">
                        <span class="material-icons text-primary text-4xl">picture_as_pdf</span>
                    </div>
                    <span class="text-xs font-black uppercase tracking-widest text-slate-500">Full Text Available</span>
                @endif
            </div>

            <!-- Download Box -->
            <div class="bg-white rounded-3xl shadow-sm border border-slate-100 p-6">
                <h3 class="text-xs font-black uppercase tracking-widest text-slate-400 mb-5">Files in this Item</h3>
                @php $originalFiles = $item->bitstreams->where('bundle', 'ORIGINAL'); @endphp
                @if($originalFiles && $originalFiles->count() > 0)
                    @foreach($originalFiles as $bs)
                        <a href="{{ route('bitstreams.download', $bs->id) }}" class="w-full flex items-center gap-4 p-4 bg-primary/5 hover:bg-primary hover:text-white rounded-2xl transition-all group mb-3">
                            <span class="material-icons text-primary group-hover:text-white">download</span>
                            <div class="flex-grow text-left">
                                <p class="text-xs font-bold">{{ $bs->file_name }}</p>
                                <p class="text-[10px] text-slate-400 group-hover:text-white/70">{{ number_format($bs->file_size / 1024, 1) }} KB</p>
                            </div>
                        </a>
                    @endforeach
                @else
                    <div class="text-center p-6 border-2 border-dashed border-slate-100 rounded-2xl">
                        <span class="material-icons text-slate-300 text-3xl mb-2">lock</span>
                        <p class="text-xs font-bold text-slate-400">Access Restricted or No File Uploaded</p>
                    </div>
                @endif
            </div>

            <!-- Handle / Identifier -->
            <div class="bg-slate-900 rounded-3xl p-6 text-white">
                <h3 class="text-[10px] font-black uppercase tracking-widest text-primary mb-4">Persistent Identifier</h3>
                <p class="text-xs font-mono text-slate-400 break-all">MTU/{{ $item->uuid }}</p>
                <button onclick="navigator.clipboard.writeText('{{ url('/item/' . $item->uuid) }}')" class="mt-4 w-full py-3 border border-slate-700 rounded-xl text-xs font-bold uppercase tracking-widest hover:bg-slate-800 hover:border-slate-600 transition-all flex items-center justify-center gap-2">
                    <span class="material-icons text-sm">content_copy</span>
                    Copy Permalink
                </button>
            </div>
        </aside>

        <!-- RIGHT COLUMN: Full Metadata -->
        <div class="lg:col-span-2">
            <!-- Header -->
            <div class="mb-8">
                @if($item->category)
                    <span class="inline-block bg-blue-100 text-blue-600 text-[10px] font-black uppercase tracking-widest px-3 py-1.5 rounded-lg mb-4">{{ $item->category }}</span>
                @endif
                <h1 class="text-3xl font-black text-slate-800 tracking-tight leading-tight mb-4">
                    {{ $item->title }}
                </h1>
                <div class="flex items-center gap-2 text-slate-500 font-medium">
                    <span class="material-icons text-primary/70 text-base">person</span>
                    <span class="text-sm">{{ $item->author }}</span>
                </div>
            </div>

            <!-- Abstract -->
            @if($item->abstract)
                <div class="bg-slate-50 border-l-4 border-primary rounded-r-2xl p-6 mb-10">
                    <h3 class="text-[10px] font-black uppercase tracking-widest text-primary mb-3">Abstract</h3>
                    <p class="text-sm text-slate-600 leading-relaxed font-medium">{{ $item->abstract }}</p>
                </div>
            @endif

            <!-- Keywords -->
            @if($item->subject)
                <div class="mb-10">
                    <h3 class="text-[10px] font-black uppercase tracking-widest text-slate-400 mb-4">Keywords & Subjects</h3>
                    <div class="flex flex-wrap gap-2">
                        @foreach(explode(',', $item->subject) as $tag)
                            <a href="{{ route('items.index', ['query' => trim($tag)]) }}" class="px-4 py-2 bg-white border border-primary/20 text-primary text-xs font-bold rounded-full hover:bg-primary hover:text-white transition-all shadow-sm">
                                {{ trim($tag) }}
                            </a>
                        @endforeach
                    </div>
                </div>
            @endif

            <!-- Full Dublin Core Metadata Table -->
            <div>
                <h3 class="text-[10px] font-black uppercase tracking-widest text-slate-400 mb-4">Dublin Core Metadata</h3>
                <div class="bg-white rounded-2xl shadow-sm border border-slate-100 overflow-hidden">
                    <table class="w-full text-sm metadata-table">
                        <tbody>
                            @foreach($item->metadata->sortBy('field.element') as $meta)
                                <tr>
                                    <td class="px-6 py-3 text-[10px] font-black text-slate-400 uppercase tracking-widest w-1/3 border-r border-slate-100">
                                        dc.{{ $meta->field->element }}
                                        @if($meta->field->qualifier !== 'none').{{ $meta->field->qualifier }}@endif
                                    </td>
                                    <td class="px-6 py-3 text-slate-700 font-medium">{{ $meta->text_value }}</td>
                                </tr>
                            @endforeach
                            <tr>
                                <td class="px-6 py-3 text-[10px] font-black text-slate-400 uppercase tracking-widest border-r border-slate-100">dc.identifier.uri</td>
                                <td class="px-6 py-3 text-primary font-medium text-xs font-mono">{{ url('/item/' . $item->uuid) }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>

            <!-- How to Cite -->
            <div class="mt-10 bg-primary/5 border border-primary/10 rounded-2xl p-6">
                <h3 class="text-[10px] font-black uppercase tracking-widest text-primary mb-3">Suggested Citation</h3>
                <p class="text-sm text-slate-600 italic leading-relaxed">
                    {{ $item->author }} ({{ optional($item->issued_at)->format('Y') ?: 'n.d.' }}) '{{ $item->title }}'. 
                    Mountain Top University Institutional Repository. Available at: {{ url('/item/' . $item->uuid) }}
                </p>
            </div>
        </div>
    </div>
</div>
@endsection