@extends('layouts.app')

@section('title', 'Pre-Start Check Berhasil')

@section('content')
<div style="background-color: #dcdcdc; min-height: 100vh; display: flex; align-items: center; justify-content: center; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; padding: 1rem;">
    <div style="background-color: white; padding: 3rem 2rem; text-align: center; border-radius: 10px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); max-width: 500px; width: 100%;">
        
        <div style="display: flex; justify-content: center; margin-bottom: 24px;">
            <div style="width: 80px; height: 80px; background-color: #10b981; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: white;">
                <svg fill="none" stroke="currentColor" viewBox="0 0 24 24" style="width: 48px; height: 48px;" xmlns="http://www.w3.org/2000/svg">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7"></path>
                </svg>
            </div>
        </div>

        <h1 style="font-size: 22px; font-weight: 700; color: #1f2937; margin: 0 0 12px 0;">
            @if(session('assigned_action') === 'close')
                Terima Kasih! 🙏
            @else
                Anda sudah mengisi list!
            @endif
        </h1>
        
        <p style="font-size: 15px; color: #4b5563; margin: 0 0 8px 0; line-height: 1.5;">
            @if(session('assigned_action') === 'close')
                Hati-hati di jalan. Laporan Anda telah tercatat dengan baik dalam sistem.
            @else
                Selamat bekerja. Laporan Anda telah tercatat dengan baik dalam sistem.
            @endif
        </p>

        @if(session('assigned_unit'))
            <div style="background-color: #f0fdf4; border: 1px solid #bbf7d0; color: #15803d; padding: 12px; border-radius: 8px; font-size: 14px; margin-bottom: 24px; font-weight: 600;">
                @if(session('assigned_action') === 'close')
                    @if(auth()->user()->role === 'mekanik')
                        ✅ Servis unit {{ session('assigned_unit') }} telah selesai. Menunggu konfirmasi Supervisor.
                    @else
                        ✅ Unit {{ session('assigned_unit') }} telah dilepas (Stand By).
                    @endif
                @else
                    @if(auth()->user()->role === 'mekanik')
                        🔧 Unit {{ session('assigned_unit') }} sedang dalam perbaikan oleh Anda.
                    @else
                        🚛 Unit {{ session('assigned_unit') }} sekarang aktif di bawah nama Anda.
                    @endif
                @endif
            </div>
        @endif

        <p style="font-size: 13px; color: #6b7280; margin: 0 0 24px 0;">
            Anda akan diarahkan ke halaman utama dalam <span id="countdown" style="font-weight: bold; color: #2563eb;">5</span> detik...
        </p>

        <a href="{{ route('dashboard') }}" style="display: inline-block; background-color: #2563eb; color: white; border: none; border-radius: 8px; padding: 12px 24px; font-size: 14px; font-weight: 500; text-decoration: none; cursor: pointer; box-shadow: 0 1px 2px rgba(0,0,0,0.05); transition: background-color 0.2s;">
            Kembali ke Home Sekarang
        </a>
    </div>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        let timeLeft = 5;
        const countdownElement = document.getElementById('countdown');
        
        const timer = setInterval(() => {
            timeLeft--;
            if (countdownElement) {
                countdownElement.textContent = timeLeft;
            }
            
            if (timeLeft <= 0) {
                clearInterval(timer);
                window.location.href = "{{ route('dashboard') }}";
            }
        }, 1000);
    });
</script>
@endsection