@extends('layouts.admin')

@section('title', 'System Maintenance')
@section('header', 'System Maintenance')

@section('content')
<div class="space-y-8">
    <div class="flex flex-col gap-1">
        <h2 class="text-2xl font-bold text-slate-800">System Maintenance</h2>
        <p class="text-sm text-slate-500 font-medium">Critical tools for system optimization and database synchronization</p>
    </div>

    @include('partials.admin._breadcrumbs', [
        'breadcrumbs' => [
            ['name' => 'Dashboard', 'url' => route('admin.dashboard')],
            ['name' => 'System Maintenance', 'url' => route('admin.system.maintenance.index')]
        ]
    ])

    @if(session('status'))
        <div class="p-4 bg-green-50 border border-green-200 text-green-700 rounded-xl flex items-center gap-3">
            <svg class="h-5 w-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
            </svg>
            <span class="text-sm font-medium">{{ session('status') }}</span>
        </div>
    @endif

    @if(session('error'))
        <div class="p-4 bg-red-50 border border-red-200 text-red-700 rounded-xl flex items-center gap-3">
            <svg class="h-5 w-5 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
            </svg>
            <span class="text-sm font-medium">{{ session('error') }}</span>
        </div>
    @endif

    <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
        <!-- Clear Caches -->
        <div class="bg-white p-8 rounded-[2.5rem] border border-slate-100 shadow-sm flex flex-col items-center text-center space-y-6 hover:shadow-md transition-shadow">
            <div class="h-20 w-20 bg-blue-50 rounded-3xl flex items-center justify-center text-blue-500">
                <svg class="h-10 w-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/>
                </svg>
            </div>
            <div class="space-y-2">
                <h3 class="text-xl font-bold text-slate-800">Clear Caches</h3>
                <p class="text-sm text-slate-400 leading-relaxed max-w-[200px] mx-auto">Optimize performance by clearing application, route, view, and config caches.</p>
            </div>
            <form action="{{ route('admin.system.maintenance.clear-cache') }}" method="POST" class="w-full">
                @csrf
                <button type="submit" class="w-full py-4 bg-blue-500 text-white rounded-2xl font-bold uppercase tracking-wider text-xs hover:bg-blue-600 shadow-lg shadow-blue-200 transition-all">
                    Execute Optimization
                </button>
            </form>
        </div>

        <!-- Run Migrations -->
        <div class="bg-white p-8 rounded-[2.5rem] border border-slate-100 shadow-sm flex flex-col items-center text-center space-y-6 hover:shadow-md transition-shadow">
            <div class="h-20 w-20 bg-purple-50 rounded-3xl flex items-center justify-center text-purple-500">
                <svg class="h-10 w-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"/>
                </svg>
            </div>
            <div class="space-y-2">
                <h3 class="text-xl font-bold text-slate-800">Run Migrations</h3>
                <p class="text-sm text-slate-400 leading-relaxed max-w-[200px] mx-auto">Synchronize database schema with the latest application models and structures.</p>
            </div>
            <form action="{{ route('admin.system.maintenance.run-migrations') }}" method="POST" class="w-full" onsubmit="return confirm('Are you sure you want to run migrations? This could affect database consistency.')">
                @csrf
                <button type="submit" class="w-full py-4 bg-[#a855f7] text-white rounded-2xl font-bold uppercase tracking-wider text-xs hover:bg-purple-600 shadow-lg shadow-purple-200 transition-all">
                    Sync Database Schema
                </button>
            </form>
        </div>

        <!-- Database Seeding -->
        <div class="bg-white p-8 rounded-[2.5rem] border border-slate-100 shadow-sm flex flex-col items-center text-center space-y-6 hover:shadow-md transition-shadow">
            <div class="h-20 w-20 bg-orange-50 rounded-3xl flex items-center justify-center text-orange-400">
                <svg class="h-10 w-10" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
                </svg>
            </div>
            <div class="space-y-2">
                <h3 class="text-xl font-bold text-slate-800">Database Seeding</h3>
                <p class="text-sm text-slate-400 leading-relaxed max-w-[200px] mx-auto">Populate database tables with master data and essential system definitions.</p>
            </div>
            <form action="{{ route('admin.system.maintenance.seed-database') }}" method="POST" class="w-full" onsubmit="return confirm('Database seeding will populate tables with default data. Proceed?')">
                @csrf
                <button type="submit" class="w-full py-4 bg-[#f97316] text-white rounded-2xl font-bold uppercase tracking-wider text-xs hover:bg-orange-600 shadow-lg shadow-orange-200 transition-all">
                    Populate Master Data
                </button>
            </form>
        </div>
    </div>

    <!-- Warning Box -->
    <div class="bg-white p-10 rounded-[2.5rem] border border-slate-50 flex items-center gap-6 shadow-sm">
        <div class="text-orange-400 bg-orange-50 p-3 rounded-xl">
            <svg class="h-8 w-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
            </svg>
        </div>
        <p class="text-sm italic text-slate-400 font-medium leading-relaxed">
            "Executing database modifications or system-wide cache purges during peak operational hours may cause temporary terminal latency. High-level security clearance required for these actions."
        </p>
    </div>

    <div class="text-xs text-slate-400 font-bold tracking-widest pt-8 uppercase">
        © {{ date('Y') }} BUSAUTO DIGITAL. ALL RIGHTS RESERVED.
    </div>
</div>
@endsection