@extends('errors.layout')
@section('title', __('We will be back soon'))

@section('content')
<div class="max-w-2xl mx-auto text-center">
    <div class="float-anim inline-block">
        <svg width="200" height="200" viewBox="0 0 200 200" fill="none" class="mx-auto">
            <circle cx="100" cy="100" r="92" fill="#fef3c7"/>
            <circle cx="100" cy="100" r="72" fill="#fff" stroke="#f59e0b" stroke-width="2" stroke-dasharray="4 6"/>
            <g transform="translate(100,100)" stroke="#0a1430" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" fill="none">
                <path d="M-22 -22 a16 16 0 0 1 22 0 l8 8 a16 16 0 0 1 0 22 L-2 36 a16 16 0 0 1-22 0 L-32 28 a16 16 0 0 1 0-22z" fill="#fff"/>
                <circle cx="0" cy="0" r="6" fill="#f59e0b"/>
            </g>
            <circle cx="40" cy="40" r="6" fill="#ff8a00"/>
            <circle cx="170" cy="60" r="4" fill="#f59e0b"/>
            <circle cx="160" cy="160" r="5" fill="#3b6df0"/>
        </svg>
    </div>

    <span class="inline-block mt-6 bg-amber-100 text-amber-800 text-[12px] font-bold uppercase tracking-wider px-3 py-1.5 rounded-full">
        ● {{ __('Scheduled maintenance') }}
    </span>

    <h1 class="font-display font-extrabold text-3xl lg:text-5xl mt-4 leading-tight">{{ __('We will be back soon') }}</h1>

    <div class="mt-4 text-slate-600 text-[15px] max-w-md mx-auto leading-relaxed">
        @if(!empty($row) && !empty($row->message))
            {!! $row->message !!}
        @else
            {{ __('Sorry for the inconvenience. The site is currently in maintenance mode. Please check back in a moment.') }}
        @endif
    </div>

    <div class="flex items-center justify-center gap-3 mt-7 flex-wrap">
        <a href="javascript:location.reload()" class="bg-brand-500 hover:bg-brand-600 text-white font-bold px-6 py-3 rounded-full transition-colors flex items-center gap-2">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 12a9 9 0 1 0 3-6.7"/><path d="M3 4v5h5"/></svg>
            {{ __('Try again') }}
        </a>
        @php $supportEmail = optional(\App\Genral::first())->email; @endphp
        @if($supportEmail)
            <a href="mailto:{{ $supportEmail }}" class="bg-white hover:bg-slate-50 border-2 border-slate-200 text-deep font-bold px-6 py-3 rounded-full transition-colors flex items-center gap-2">
                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2Z"/><path d="m22 6-10 7L2 6"/></svg>
                {{ __('Contact us') }}
            </a>
        @endif
    </div>

    <div class="mt-8 text-[12px] text-slate-400">
        {{ __('Auto-refreshes every 60 seconds') }}
    </div>
</div>

<script>setTimeout(function(){ location.reload(); }, 60000);</script>
@endsection