@extends('admin.layout')
@section('title', $site->name . ' - Medya Kütüphanesi')
@section('content')
<div class="site-tabs">
    <a href="{{ route('admin.home.edit', $site) }}">Ana Sayfa</a>
    <a href="{{ route('admin.pages.index', $site) }}">Sayfalar</a>
    <a href="{{ route('admin.media.index', $site) }}" class="active">Medya Kütüphanesi</a>
</div>

<h1>{{ $site->name }} — Medya Kütüphanesi</h1>

<div style="background:#fff;border:1px solid #ddd;padding:16px;margin-bottom:24px;max-width:460px;">
    <strong>Yeni Görsel Yükle</strong>
    @if($errors->any())<p style="color:#c0392b;font-size:13px;">{{ $errors->first() }}</p>@endif
    <form method="POST" action="{{ route('admin.media.upload', $site) }}" enctype="multipart/form-data" style="margin-top:10px;">
        @csrf
        <input type="file" name="image" accept="image/*" required style="margin-bottom:10px;">
        <input type="text" name="name" placeholder="Görsel adı (opsiyonel)">
        <input type="text" name="alt_text" placeholder="Alt metin (opsiyonel)">
        <button class="btn" type="submit">Yükle</button>
    </form>
</div>

<form method="GET" style="margin-bottom:14px;">
    <input type="text" name="q" placeholder="Ara (isim / alt metin)..." value="{{ request('q') }}" style="width:280px;display:inline-block;">
    <button class="btn secondary" type="submit">Ara</button>
</form>

<div class="media-grid">
    @foreach($images as $img)
    <div class="media-card">
        @if($img->local_path)
            <img src="{{ $img->local_path }}">
        @endif
        <form method="POST" action="{{ route('admin.media.update', $img) }}">
            @csrf
            <input type="text" name="name" value="{{ $img->name }}" placeholder="Görsel adı">
            <input type="text" name="alt_text" value="{{ $img->alt_text }}" placeholder="Alt metin">
            <button class="btn" style="padding:4px 10px;font-size:12px;">Kaydet</button>
        </form>
        <div style="display:flex;gap:6px;margin-top:6px;align-items:center;">
            <form method="POST" action="{{ route('admin.media.toggleHero', $img) }}">
                @csrf
                <button class="btn secondary" style="padding:3px 8px;font-size:11px;">
                    {{ $img->is_hero ? 'Slider\'dan Çıkar' : 'Slider\'a Ekle' }}
                </button>
            </form>
            @if($img->is_hero)
                <span class="badge badge-ok">slider</span>
                <form method="POST" action="{{ route('admin.media.up', $img) }}"><button class="btn secondary" style="padding:3px 6px;">↑</button></form>
                <form method="POST" action="{{ route('admin.media.down', $img) }}"><button class="btn secondary" style="padding:3px 6px;">↓</button></form>
            @endif
        </div>
    </div>
    @endforeach
</div>
<div style="margin-top:20px;">{{ $images->links() }}</div>
@endsection