@extends('front.layout')
@section('custom-style')
<style>

     .active{
            color:#292826!important;
        }
        .pages-content
        {
            color:#292826!important;
            margin:0px 50px;
        }

        .breadcrump-section
        {
            padding-top:70px;
            background: #000f1e!important;
        }



        .nav-tabs .nav-item {
            margin-right: 10px;
        }

        .tab-content
        {
            background: #fff;
            padding:30px 50px;
            color:#000;
        }

        .change-password-link
        {
            color:#000!important;
            text-decoration: underline!important;
            margin-left: 20px;
        }

        input
        {
            margin-bottom: 15px;
        }
</style>
@endsection
@section('content')
    <main id="content">



        <section class="breadcrump-section">
            <div class="bg-gray-1000 py-6 pt-lg-9 pb-lg-11 mb-lg-10" style="margin-bottom: 0px!important;padding:20px 0px!important; background:rgb(221,150,10);">
                <div class="container px-md-5 mb-lg-2">
                    <h6 class="font-size-30 font-weight-semi-bold text-center mb-1">Profile</h6>
                    <nav aria-label="breadcrumb">
                    <ol class="breadcrumb justify-content-center p-0">

                    <li class="breadcrumb-item active" aria-current="page">Edit Your Profile</li>

                    </ol>
                    </nav>
                 </div>

            </div>
        </section>



    <!--overlay-->

    <div class="bg-gray-1100 space-1">
        <div class="container px-md-6 px-xl-7 px-wd-6 pb-3 pt-1">
            <div class="pb-4">
                <div class="border-g-1200-op mb-1 pb-3">
                    <div class="dark">

                        @include('front.my-account.tabs')
                          <div class="tab-content">
                            <h3>Edit your details:</h3>
                            @if(\Session::has('error'))
                                <div class="col-xs-12">
                                    <li class="alert alert-danger">{!! \Session::get('error') !!}</li>
                                </div>
                            @endif

                            @if(\Session::has('success'))
                                <div class="col-xs-12">
                                    <li class="alert alert-success">{!! \Session::get('success') !!}</li>
                                </div>
                            @endif

                            @if ($errors->any())
                                <div class="col-xs-12">
                                    @foreach ($errors->all() as $error)
                                        <li class="alert alert-danger">{{ $error }}</li>
                                    @endforeach
                                </div>
                            @endif

                            <form method="post">
                                {{ csrf_field() }}
                                <label>Your name*</label>
                                <input name="name" class="form-control" type="text" value="{{ Auth::user()->name }}" required>
                                
                                <label>Surname*</label>
                                <input name="surname" class="form-control" type="text" value="{{ Auth::user()->surname }}" required>

                                <label>Your phone*</label>
                                <input name="phone" class="form-control" type="number" value="{{ Auth::user()->phone }}" required>

                                <label>Your email*</label>
                                <input name="email" class="form-control" type="email" value="{{ Auth::user()->email }}" required>

                                <button class="btn btn-primary" type="submit">Update Details</button>
                            </form>




                          </div>

                    </div>
                </div>
            </div>
            <!--Dakar Section End-->




        </div>
    </div>


    </main>
@endsection

@section('custom-script')
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

@endsection