@extends('admin.layouts.app')
@section('title', 'Üyelik Planları')
@section('page-title', 'Üyelik Planları')

@section('content')

<div class="page-header">
    <div>
        <h5 style="font-size:18px;font-weight:700;color:var(--text);margin:0">Üyelik Planları</h5>
        <div style="font-size:13px;color:var(--text2);margin-top:2px">{{ $plans->count() }} plan tanımlı</div>
    </div>
    <a href="{{ route('admin.plans.create') }}" class="btn btn-primary btn-sm">
        <i class="bi bi-plus-lg"></i> Plan Ekle
    </a>
</div>

@if($plans->isEmpty())
<div class="card">
    <div class="card-body">
        <div class="empty-state">
            <i class="bi bi-star"></i>
            <h6>Henüz plan eklenmemiş</h6>
            <p>İlk üyelik planınızı oluşturun.</p>
            <a href="{{ route('admin.plans.create') }}" class="btn btn-primary btn-sm mt-2">
                <i class="bi bi-plus-lg"></i> Plan Ekle
            </a>
        </div>
    </div>
</div>
@else
<div class="row g-3">
    @foreach($plans as $plan)
    <div class="col-xl-3 col-md-4 col-sm-6">
        <div class="card h-100" style="transition:border-color .15s">
            <div class="card-body" style="padding:22px">
                {{-- Header --}}
                <div class="d-flex align-items-start justify-content-between gap-2 mb-3">
                    <div>
                        <div style="font-size:16px;font-weight:800;color:var(--text)">{{ $plan->name }}</div>
                        <div style="font-size:12px;color:var(--text2);margin-top:2px">
                            <i class="bi bi-calendar3 me-1"></i>{{ $plan->duration_days }} gün
                        </div>
                    </div>
                    <span class="badge {{ $plan->is_active ? 'bg-success' : 'bg-secondary' }}">
                        {{ $plan->is_active ? 'Aktif' : 'Pasif' }}
                    </span>
                </div>

                {{-- Fiyat --}}
                <div style="font-size:28px;font-weight:800;color:var(--warning);letter-spacing:-0.5px;margin-bottom:14px">
                    {{ number_format($plan->price, 2) }}
                    <span style="font-size:14px;font-weight:600;color:var(--text2)">₺</span>
                </div>

                @if($plan->description)
                    <div style="font-size:12.5px;color:var(--text2);margin-bottom:12px;line-height:1.5">
                        {{ $plan->description }}
                    </div>
                @endif

                {{-- Özellikler --}}
                @if($plan->features)
                <div style="margin-bottom:16px">
                    @foreach($plan->features as $feature)
                    <div style="display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text);padding:4px 0;border-bottom:1px solid var(--border)">
                        <i class="bi bi-check-circle-fill" style="color:var(--success);font-size:12px;flex-shrink:0"></i>
                        {{ $feature }}
                    </div>
                    @endforeach
                </div>
                @endif

                {{-- Aksiyonlar --}}
                <div class="d-flex gap-2 mt-auto">
                    <a href="{{ route('admin.plans.edit', $plan) }}" class="btn btn-secondary btn-sm flex-grow-1">
                        <i class="bi bi-pencil"></i> Düzenle
                    </a>
                    <form method="POST" action="{{ route('admin.plans.destroy', $plan) }}"
                          onsubmit="return confirm('{{ addslashes($plan->name) }} planını silmek istediğinize emin misiniz?')">
                        @csrf @method('DELETE')
                        <button type="submit" class="btn btn-sm btn-outline-danger">
                            <i class="bi bi-trash3"></i>
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
    @endforeach
</div>
@endif

@endsection