@extends('layouts.panel')
@section('content')
    <link rel="stylesheet" href="{{ url('css/clientes-form.css') }}">

    <div class="form-clientes-container">
        <div class="form-clientes-header">
            <h2>Formulario de registro Clientes</h2>
        </div>

        <form action="{{ route('clientes.store') }}" method="POST">
            @csrf
            <div class="form-clientes-body">
                <div class="was-validated">
                    <div class="form-row">
                        <div class="col-12 col-md-6 mb-3">
                            <label for="validationSample01">NOMBRE</label>
                            <input type="text" name="nombre" class="form-control" id="validationSample01"
                                placeholder="nombre" required="">
                            <div class="invalid-feedback">Por favor proporcione un nombre.</div>
                            <div class="valid-feedback">¡Se ve bien!</div>
                        </div>
                        <div class="col-12 col-md-6 mb-3">
                            <label for="validationSample02">APELLIDO</label>
                            <input type="text" name="apellido" class="form-control" id="validationSample02"
                                placeholder="Apellido" required="">
                            <div class="invalid-feedback">Por favor proporcione un Apellido.</div>
                            <div class="valid-feedback">¡Se ve bien!</div>
                        </div>
                    </div>
                    <div class="form-row">
                        <div class="col-12 col-md-6 mb-3">
                            <label for="validationSample04">CELULAR</label>
                            <input type="number" name="celular" class="form-control" id="validationSample04"
                                placeholder="celular" required="">
                            <div class="invalid-feedback">Por favor proporcione un Celular.</div>
                            <div class="valid-feedback">¡Se ve bien!</div>
                        </div>

                        <div class="col-12 col-md-6 mb-3">
                            <label for="validationSample03">CORREO</label>
                            <input type="text" name="correo" class="form-control" id="validationSample03"
                                placeholder="correo" required="">
                            <div class="invalid-feedback">Por favor proporcione un correo.</div>
                            <div class="valid-feedback">¡Se ve bien!</div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="form-clientes-actions">
                <button class="btn btn-guardar-cliente" type="submit">
                    <i class="material-icons">save</i> Guardar cliente
                </button>
                <a class="btn btn-volver-listado" href="{{ url('clientes') }}">
                    <i class="material-icons">arrow_back</i> Volver al listado de clientes
                </a>
            </div>
        </form>
    </div>
@endsection