@extends('layouts.home')
@section('content')
<div class="mx-auto p-5 md:px-10 max-w-7xl">
    <div
        class="bg-gradient-to-r from-color2-300 via-color2-300 to-color2-300 dark:bg-none w-full h-[400px] absolute top-0 left-0">
    </div>
    <div class="relative">
        @include('includes.breadcrumb')
        <livewire:candidate.summary-header />
        <h1 class="text-4xl text-color2-400 my-5 text-center">
            @yield('title')
        </h1>
<!-- Sidebar -->
        <div class="flex">
            <div class="w-64 bg-slate-300 dark:bg-opacity-5 shadow-lg flex flex-col">
                <div class="h-16 flex items-center justify-center border-b">
                    <h1 class="text-xl font-bold">My Account</h1>
                </div>
                <nav class=" p-4">
                    <a href="{{ route('candidate.profile.show') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-user text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Profile</span>
                    </a>
                    <a href="{{ route('candidate.upload.resume') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-file-alt text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Upload Resume</span>
                    </a>
                    <a href="{{ route('candidate.make.resume.online') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-file-alt text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Make Resume Online</span>
                    </a>
                    <a href="{{ route('candidate.make.cover.letter') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-envelope text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Make Cover Letter</span>
                    </a>
                    <a href="{{ route('candidate.applied.jobs') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-thumbs-up text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Applied Jobs</span>
                    </a>
                    <a href="{{ route('candidate.favorite.jobs') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-heart text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Favorite Jobs</span>
                    </a>
                    <a href="{{ route('candidate.subscription') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-file-invoice text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Subscriptions</span>
                    </a>
                    <a href="{{ route('candidate.payment') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-indian-rupee-sign text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Trasactions</span>
                    </a>
                    <a href="{{ route('candidate.change.password.show') }}" class="flex items-center p-2 rounded-lg hover:bg-gray-200" wire:navigate>
                        <i class="fa fa-key text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Change Password</span>
                    </a>
                </nav>
                <div class="p-4 border-t">
                    <a href="{{ route('logout') }}" onclick="event.preventDefault();document.getElementById('logout-form').submit();" class="flex items-center p-2 rounded-lg hover:bg-gray-200">
                        <i class="fa fa-sign-out text-color2-400 dark:text-color2-400"></i><span class="ml-2"> Logout</span>
                    </a>
                </div>
            </div>
            <!-- Main Content -->
            <div class="flex-1 p-6">
                {{-- @include('errors.error') --}}
                @yield('contentInner')
            </div>
        </div>
    </div>
</div>
@endsection