@extends('frontend.layouts.app')
@section('title', 'Ödeme Başarısız | Animexe')

@push('styles')
<style>
.ck-result{max-width:480px;margin:80px auto;text-align:center;padding:0 16px}
.ck-result-icon{font-size:4rem;margin-bottom:20px;color:#ff4d6d}
.ck-result h1{font-size:1.5rem;font-weight:800;margin-bottom:10px}
.ck-result p{color:rgba(255,255,255,.55);margin-bottom:28px;line-height:1.6}
.ck-result-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.ck-result-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:10px;font-weight:700;text-decoration:none;transition:opacity .15s}
.ck-result-btn.primary{background:linear-gradient(135deg,#00f5ff,#b84dff);color:#fff}
.ck-result-btn.secondary{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7)}
.ck-result-btn:hover{opacity:.85;color:inherit}
</style>
@endpush

@section('content')
<div class="ck-result">
    <div class="ck-result-icon"><i class="bi bi-x-circle-fill"></i></div>
    <h1>Ödeme Başarısız</h1>
    <p>
        Ödeme işlemi tamamlanamadı. Kart bilgilerini kontrol edip tekrar deneyebilirsin
        veya farklı bir kart kullanabilirsin.
    </p>
    <div class="ck-result-btns">
        <a href="{{ route('premium.plans') }}" class="ck-result-btn primary">
            <i class="bi bi-arrow-repeat"></i> Tekrar Dene
        </a>
        <a href="{{ route('anime.index') }}" class="ck-result-btn secondary">
            <i class="bi bi-house"></i> Ana Sayfa
        </a>
    </div>
</div>
@endsection