@extends('layouts.auth')

@section('title')
    Add Store Name
@endsection

@section('content')

<div class="my-auto" style="margin-top: 100px !important;">

    <div>
        <div class="mx-auto mt-5 mb-3 text-center rounded-full">
        <a href="{{ url('/') }}"><img src="{{ asset('images/logo-dark.png') }}" style="height: 40px;" alt="" class="mx-auto mb-6"></a>
        </div>
    </div>

    <div class="text-center">
        <h5 class="text-lg font-bold text-gray-600 dark:text-gray-100 montserrat">Setup Your <span class="text-orange-500">C2C </Colg>Store Name</span></h5>
    </div>

    <!-- card body -->
    <div class="p-6 text-center text-gray-600 dark:text-gray-100">
            
        <!-- content goes here -->
        We're Almost there {{ auth()->user()->first_name }}! <br>
        Now that you've created your store, let's add a store name. That is the name you'll be seen as on the platform.
    </div>

    <div class="">
        <img src="{{ asset('images/store-1-old.png') }}" class="mx-auto h-28" alt="store"/>
    </div>

    <form class="d-inline max-w-[400px] p-6 mx-auto" method="POST" action="{{ route('create-store') }}">
        @csrf
        <div class="grid grid-cols-1">
            <div class="mb-4">
                <label class="font-semibold" for="LoginEmail">C2C Store Name:</label>
                <input id="username" name="username" type="text" class="w-full h-10 px-3 py-2 mt-2 bg-transparent border border-gray-100 rounded outline-none dark:bg-slate-900 dark:text-slate-200 dark:border-gray-800 focus:ring-0" placeholder="Enter Your Store Name">
                @error('username')
                    <span class="mx-auto text-red-600 invalid-feedback" role="alert">
                        <small class="text-center">{{ $message }}</small>
                    </span>
                @enderror
            </div>
        </div>

        <!-- card footer -->
        <div class="p-6 text-center border-gray-200">
            <!-- button link -->
            <button class="w-full px-3 py-3 mt-4 mb-2 font-semibold text-white bg-orange-500 rounded-md" 
            type="submit">Add Store Name +</button>
        </div>
    </form>

</div>


@endsection
