@extends('layouts.main')

@section('header')
    @include('inc.banner_top')
@endsection

@section('content')

    <h1 class="text-center mb-4 text-uppercase">Contact</h1>
    
    <div class="row">
        <div class="col-sm-6 pt-4 pe-4">
            <div class="d-flex flex-column flex-sm-row text-center text-sm-start mb-4">
                <i class="fab fa-facebook pt-2 text-blue contact-icons mb-3 mb-sm-0" ></i>
                <p class="ms-3 fs-6 text-secondary text-center text-sm-justify">Daca ai intrebari despre rezultatele tale, echipa noastra de psihologi iti va raspunde pe facebook </p>
            </div>

            <div class="d-flex flex-column flex-sm-row text-center text-sm-start mb-4">
                <i class="fas fa-question-circle pt-2 text-blue contact-icons mb-3 mb-sm-0"></i>
                <div class="ms-3">
                    <p class="text-secondary text-center text-sm-justify">Daca ai intrebari sau sugestii privind interactiunea cu site-ul, contacteaza-ne aici</p>
                    <p class="text-blue contact-email">0729 136 401</p>
                </div>
            </div>

            <div class="d-flex flex-column flex-sm-row text-center text-sm-start mb-4">
                <i class="fas fa-history pt-2 text-blue contact-icons mb-3 mb-sm-0" ></i>
                <p class="ms-3 fs-5 text-secondary text-center text-sm-justify">RASPUNS IN MAXIM <br>24 DE ORE.  </p>
            </div>
        </div>
        <div class="col-sm-6">
            @if (session('email'))
                <x-alert type="success" message="{{ session('email') }}" />
            @endif

            @if ($errors->any())
                <x-alert type="danger" message="Câmpurile evidențiate mai jos conțin erori!" />
            @endif

            <form action="contact" method="post">
                
                @csrf

                <div class="mb-3 has-validation">
                    <label for="nume" class="form-label" >Nume</label>
                    <input type="text" name="name" class="form-control  @error('name') is-invalid @enderror" id="nume">
                </div>

                <div class="mb-3 has-validation">
                  <label for="email" class="form-label">Email address</label>
                  <input type="email" name="email" class="form-control @error('email') is-invalid @enderror" id="email" >
                </div>

                <div class="mb-3 has-validation">
                  <label for="telefon" class="form-label">Telefon</label>
                  <input type="text" name="telephone" class="form-control @error('telephone') is-invalid @enderror" id="telefon">
                </div>

                <div class="mb-3 has-validation">
                    <label for="feedback" class="form-label">Feedback</label>
                    <textarea name="feedback" id="feedback" class="form-control @error('feedback') is-invalid @enderror" cols="30" rows="5"></textarea>
                </div>
                
                <input type="hidden" name="action" value="Trimite" >
                <button type="submit" class="btn btn-pemeserie rounded-pill">Trimite</button>
              </form>
        </div>

    </div>
@endsection