@extends('frontend.layouts.applayout')
@section('main-content')
    <div class="container py-5">
        <div class="row mb-5">
            <div class="col-lg-12 text-center">
                <h1>Contact Us</h1>
            </div>
        </div>

        <div class="row bg-light p-4 rounded">
            <div class="col-lg-6 col-md-6 mb-4">
                <div class="contact_wrapper mt-4">
                    <address>
                        <strong style="font-size:24px;">Address :</strong>
                        <div class="address" style="font-size:22px;">
                            {!! Doaba::settings()->address !!}<br>
                        </div>

                    </address>
                </div>
                <div class="contact_wrapper">
                    <strong style="font-size:24px;">Hours:</strong>
                    <div class="working-hours" style="margin-left:60px; font-size:22px; line-height:2em;">
                        {!! Doaba::settings()->working_hours !!}
                    </div>
                </div>
                <strong style="font-size: 24px;">Email :</strong> <a href="mailto:{{ Doaba::settings()->admin_mails }}"
                    contenteditable="false"
                    style="cursor: pointer; font-size:22px;">{{ Doaba::settings()->admin_mails }}</a><br>
                <strong style="font-size: 24px;">Tel :</strong> <a href="tel:{{ Doaba::settings()->phone }}"
                    contenteditable="false" style="cursor: pointer; font-size:22px;">{{ Doaba::settings()->phone }}</a>
            </div>

            <div class="col-lg-6 col-md-6">
                <div class="contact_wrapper_1">

                    <form action="{{ route('guest.contact') }}" method="post">
                        @csrf

                        <div class="form-group mb-3">
                            <label for="name">Name <span class="text-danger">*</span></label>
                            <input type="text" id="name" name="name" class="form-control"
                                placeholder="Enter your name" required>
                        </div>

                        <div class="form-group mb-3">
                            <label for="email">Email <span class="text-danger">*</span></label>
                            <input type="email" id="email" name="email" class="form-control"
                                placeholder="Enter your email" required>

                        </div>

                        <div class="form-group mb-3">
                            <label for="phone">Phone <span class="text-danger">*</span></label>
                            <input type="text" id="phone" name="phone" class="form-control"
                                placeholder="Enter your phone number" minlength="10" maxlength="15"
                                oninput="this.value = this.value.replace(/\D/g, '')" required>
                        </div>

                        <div class="form-group mb-3">
                            <label for="message">Comments <span class="text-danger">*</span></label>
                            <textarea name="message" id="message" class="form-control" rows="4" placeholder="Your message" required></textarea>
                        </div>

                        <div class="text-center">
                            <button type="submit" class="btn btn-primary px-5">Submit <i
                                    class="bx bx-right-arrow-alt"></i></button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <style>
        address p {
            margin: 0;
        }
    </style>
@endsection