@extends('employee.layouts.app')
@section('title', 'Laboratorium | Career Development and Consultation (CDC)')
@section('navigation')
    <h1 class="my-1 d-flex align-items-center text-dark fw-bolder fs-3">Teori
        <span class="mx-2 border-gray-200 h-20px border-start ms-3"></span>
        <small class="my-1 text-muted fs-7 fw-bold ms-1">Laboratorium</small>
    </h1>
@endsection
@section('content')
    <div class="card">
        <div class="card-body p-lg-20 pb-lg-0">
            <div class="mb-17">
                <div class="mb-8">
                    <span class="text-dark text-hover-primary fs-1 fw-bolder">Lab</span>
                    <div class="my-5 border-2 separator"></div>
                </div>
                <form action="{{ route('labor.calculator') }}" method="POST" class="form" enctype="multipart/form-data">
                    @csrf
                    @foreach ($quests as $index => $quest)
                        <div class="mb-6 fv-row">
                            <label class="mb-3 form-label fs-6 fw-bolder">{{ $index + 1 }}.
                                {{ $quest->statement }}</label>
                            <div class="d-flex align-items-center">
                                <label class="form-check form-check-custom form-check-solid me-10">
                                    <input class="form-check-input h-20px w-20px" type="radio" value="{{ $quest->id }}"
                                        name="{{ $quest->statement_code }}" required />
                                    <span class="form-check-label fw-bold">Ya</span>
                                </label>
                                <label class="form-check form-check-custom form-check-solid">
                                    <input class="form-check-input h-20px w-20px" type="radio"
                                        name="{{ $quest->statement_code }}" required />
                                    <span class="form-check-label fw-bold">Tidak</span>
                                </label>
                            </div>
                        </div>
                    @endforeach
                    <div class="d-flex justify-content-end">
                        <button type="reset" class="px-6 btn btn-color-gray-400 btn-active-light-primary">Kembali</button>
                        <button type="submit" class="px-6 btn btn-primary me-2">Selesai</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection