@extends('layouts.app')

@section('contents')
    <style>
        #sidebar-nav{

            font-family: "Poppins Medium";
            background: #4b4b4b !important;
        }
        .list-group-item{
            color: white !important;
            background: #4b4b4b !important;
            border: 1px solid rgb(255 255 255 / 13%);
        }

        .list-group-item.active {
            /* z-index: 2; */
            color: #fff;
            border: 0px !important;
            border-color:  #0a0a0a;
            background: #fab900 !important;
        }
        .card-header{
            background: white !important;
            border-bottom: 0px solid rgba(0,0,0,.125);

        }
        .offset-md-1 {
            margin-left: 4.333333%;
        }
    </style>

    <div class="container">
        <div class="row flex-nowrap">
            @include('layouts.common.left_bar')
            <main class="col-md-9  pt-2 mb-4 mx-4  ">
                <div class="page-header pt-3 mb-5">
                    <h2> {{$profile->data->profile->name}} Addresses</h2>
                </div>
                @if (session('success'))
                    <div class="alert alert-success">
                        {{ session('success') }}
                    </div>
                @endif
                @if (session('error'))
                    <div class="alert alert-danger">
                        {{ session('error') }}
                    </div>
                @endif

                @csrf
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group  pb-2">
                            <label for="first">Billing Address</label>
                            <textarea cols="50" rows="5"  class="form-control "  readonly name="billing_address" placeholder="Billing Address" id="first">{{$profile->data->profile->billing_address}}</textarea>
                        </div>
                    </div>
                    <!--  col-md-6   -->

                    <div class="col-md-6">
                        <div class="form-group pb-2">
                            <label for="first">Shipping Address</label>
                            <textarea cols="50" rows="5"  class="form-control " readonly name="shipping_address" placeholder="Shipping Address" id="first">{{$profile->data->profile->address}}</textarea>
                        </div>
                    </div>
                    <!--  col-md-6   -->
                </div>



                <!--  col-md-6   -->






                <div class=" gap-2 mt-3 mb-3 ">
                    <a href="{{route('client.edit_address')}}">  <button class="btn btn-warning" type="button">Edit Address</button></a>

                </div>
                <!--  row   -->
                </form>




            </main>
        </div>
    </div>
    <!--Container Main end-->

@endsection
@push('scripts')

    <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"></script>


    <script>
        $.validator.addMethod('captcha',
            function(value) {
                $result = ( parseInt($('#num1').val()) + parseInt($('#num2').val()) == parseInt($('#captcha').val()) ) ;
                $('#spambot').fadeOut('fast');
                return $result;
            },
            'Incorrect value, please try again.'
        );

        $('#get_quote').validate({
            debug: false,
            rules: {

                password: {
                    minlength: 8,
                },
                password_confirm: {
                    minlength: 8,
                    equalTo: "#password"
                }
            },

            highlight: function(element) {
                $(element).addClass('has-error');
            },
            unhighlight: function(element) {
                $(element).removeClass('has-error');
            },
            errorElement: 'span',
            errorClass: 'validation-error-message help-block form-helper bold',
            errorPlacement: function(error, element) {
                return true;
            }
        });

    </script>
@endpush