@extends('layouts.app')
@section('content')
    <div class="container my-5 px-5">
        <div class="row">
            <div class="row mt-4">
                <div class="col-lg-4 col-md-5 col-sm-8 col-10 mx-auto ">
                    <div class="card bg-white boxShadow px-4 py-3 ">
                        <form action="{{ route('cleaning-store') }}" method="POST" enctype="multipart/form-data">
                            @csrf
                            <p class="f_14 mb-1 text-dark">Property*</p>
                            <select class="form-select" name="property" aria-label="Default select example">
                                <option selected>6 HEDLEY STREET - GATESHEAD...</option>
                                <option value="1">One</option>
                                <option value="2">Two</option>
                                <option value="3">Three</option>
                            </select>

                            <div class="row mt-3">
                                <div class="col-md-6">
                                    <p class="f_14 mb-2 pb-1 text-dark">Clean Date*</p>
                                    <select class="form-select" name="clean_date" aria-label="Default select example">
                                        <option selected>12.05.2024</option>
                                        <option value="1">12.05.2024</option>
                                        <option value="2">13.05.2024</option>
                                        <option value="3">14.05.2024</option>
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <div class="mb-3">
                                        <label for="meterReading" class="form-label f_14">Meter Reading*</label>
                                        <input type="text" class="form-control" id="meterReading" name="meter_reading"
                                            placeholder="11111111">
                                    </div>
                                </div>
                            </div>

                            <div class="mb-3">
                                <label for="generalCleanliness" class="form-label f_14">General Cleanliness Of The
                                    Property*</label>
                                <input type="text" class="form-control" id="generalCleanliness"
                                    name="general_cleanliness" placeholder="Clean all ok">
                            </div>

                            <div class="mb-3">
                                <label for="lightingInSpace" class="form-label f_14">Lighting in the Communal Space</label>
                                <input type="text" class="form-control" id="lightingInSpace" name="lighting_in_space"
                                    placeholder="Description of any issue">
                            </div>

                            <p class="f_14 text-dark">Run Machine through a quick 65 Degree Wash</p>
                            <div class="d-flex">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" name="run_machine_wash" value="1"
                                        id="runMachineYes">
                                    <label class="form-check-label" for="runMachineYes">
                                        Yes
                                    </label>
                                </div>

                                <div class="form-check ms-4">
                                    <input class="form-check-input" type="checkbox" name="run_machine_wash" value="0"
                                        id="runMachineNo">
                                    <label class="form-check-label" for="runMachineNo">
                                        No
                                    </label>
                                </div>
                            </div>

                            <p class="f_14 text-dark mt-3">Boiler Pressure Check (Between 1-2 Bar)</p>
                            <div class="d-flex">
                                <div class="form-check">
                                    <input class="form-check-input" type="checkbox" name="boiler_pressure" value="1"
                                        id="boilerPressureYes">
                                    <label class="form-check-label" for="boilerPressureYes">
                                        Yes
                                    </label>
                                </div>

                                <div class="form-check ms-4">
                                    <input class="form-check-input" type="checkbox" name="boiler_pressure" value="0"
                                        id="boilerPressureNo">
                                    <label class="form-check-label" for="boilerPressureNo">
                                        No
                                    </label>
                                </div>
                            </div>

                            <div class="mb-3 mt-3">
                                <label for="photos" class="form-label">Photos</label>
                                <input class="form-control" type="file" id="photos" name="photos">
                            </div>

                            <div class="mb-3">
                                <label for="cleanerNotes" class="form-label f_14">Cleaner Notes*</label>
                                <input type="text" class="form-control" id="cleanerNotes" name="cleaner_notes"
                                    placeholder="Write text here">
                            </div>

                            <div>
                                <button type="submit" class="btn btn-primary gap-2 align-items-center">
                                    Submit
                                    <svg width="19" height="19" viewBox="0 0 19 19" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <path d="M6.93896 4.33112L12.2016 9.59374L6.93896 14.8564" stroke="white"
                                            stroke-width="2.25541" stroke-linecap="round" stroke-linejoin="round" />
                                    </svg>
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection