@extends('layouts.app')

@section('content')
    <section class="header-inner ">
        <div class="container">
            <div class="row">
                <div class="col-12 col-md-10 mx-auto text-center text-lg-left">
                    <div class="row">
                        <div class="col-12 col-lg-10">
                            <h1>Choose your account type</h1>
                            <p>Our registration take less than 1 minute</p>
                        </div>
                        <div class="col-12 col-lg-2">
                            <img class="w-100 d-none d-lg-inline-block" src="{{ asset('storage/icons/svg/register.svg') }}" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="space-ptb bg-light">
        <div class="container">
            <div class="row">
                <div class="col-12 col-lg-9 mx-auto">
                    <ul class="nav nav-tabs nav-tabs-border nav-tabs-select-account flex-column flex-md-row">
                        <li class="nav-item mx-2 mb-3">
                            <a class="nav-link" href="{{ route('account.register') }}">
                                <div class="d-flex justify-content-center align-items-center">
                                    <div class="tab-icon">
                                        <i class="flaticon-users"></i>
                                    </div>
                                    <div class="ml-3">
                                        <h6 class="mb-0">Candidate</h6>
                                        <p class="mb-0">I want to discover new career opportunities</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="nav-item mx-2 mb-3">
                            <a class="nav-link" href="{{ route('account.company.register') }}">
                                <div class="d-flex justify-content-center align-items-center">
                                    <div class="tab-icon">
                                        <i class="flaticon-suitcase"></i>
                                    </div>
                                    <div class="ml-3">
                                        <h6 class="mb-0">Employer</h6>
                                        <p class="mb-0">I want to attract the best medical professionals</p>
                                    </div>
                                </div>
                            </a>
                        </li>
                    </ul>

                    <div class="mt-3">
                        <p class="text-center text-bold">Already have an account? <a class="btn btn-primary btn-sm mx-4 px-3" href="{{ route('account.login') }}">{{ __('Sign In') }}</a></p>
                    </div>
                </div>
            </div>
        </div>
    </section>

@endsection