{{-- resources/views/auth/set_petugas.blade.php --}}
@extends('layouts.app')

@section('title', 'Identifikasi Petugas')

@section('content')

<section class="section dark-background" style="padding-top: 140px; padding-bottom: 80px;">
  <div class="container text-center" data-aos="fade-in">
    <h1 class="fw-bold mb-0">Login Sistem</h1>
    <p class="mb-0">
      SMP Al Idrus
    </p>
  </div>
</section>

<section class="contact section light-background">

  <div class="container section-title" data-aos="fade-up">
    <h2>Identifikasi Petugas</h2>
    <p>
      Silakan masukkan nama Anda untuk sesi jaga ini<br>
      Halo, <strong>Panitia PPDB</strong>. Sistem membutuhkan nama Anda.
    </p>
  </div>

  <div class="container" data-aos="fade-up" data-aos-delay="100">
    <div class="row gy-4 justify-content-center">
      <div class="col-lg-6">

        @if ($errors->any())
          <div class="alert alert-danger">
            @foreach ($errors->all() as $err)
              <div>{{ $err }}</div>
            @endforeach
          </div>
        @endif

        <form method="POST"
              action="{{ route('panitia.store-petugas') }}"
              class="shadow p-4 bg-white rounded">
          @csrf

          <div class="mb-4">
            <label class="form-label fw-semibold">
              Nama Petugas Jaga
            </label>
            <input type="text"
                   name="petugas_name"
                   value="{{ old('petugas_name') }}"
                   class="form-control @error('petugas_name') is-invalid @enderror"
                   placeholder="Contoh: Pak Budi"
                   required
                   autofocus>
            <div class="form-text mt-2">
                <small class="text-muted">* Nama ini akan tercatat pada riwayat verifikasi pembayaran.</small>
            </div>
          </div>

          <div class="text-center mt-4">
            <button type="submit" class="btn btn-primary px-5 py-2">
              Masuk Dashboard <i class="bi bi-arrow-right ms-2"></i>
            </button>
          </div>
        </form>
      </div>
    </div>
  </div>

</section>
@endsection