@extends('layouts.user')
@section('content')
    <div class="relative flex items-center justify-between px-12 py-2">
        <a href="#" class="flex items-center justify-center">
            <img class="w-full h-16" src="{{ asset('assets/extra-logo.svg') }}" alt="extrasistem logo">
        </a>

        <div class="relative flex items-center justify-center gap-6">
            @if (Auth::user()->profile_img)
                <img src="{{ getCdnFile(Auth::user()->profile_img) }}"
                    class="profileButton w-12 h-12 object-cover rounded-full cursor-pointer">
            @else
                <img src="{{ getDefaultImage() }}" class="profileButton w-12 h-12 object-cover rounded-full cursor-pointer">
            @endif
        </div>
        <div class="hidden absolute top-[80px] right-1 w-52 z-10" id="subMenu">
            <div
                class="sub-menu rounded-3xl backdrop-blur-sm bg-theme_secondary_black p-4 border border-theme_secondary_gray bg-opacity-75 shadow-md shadow-theme_secondary_black">
                <h1 class="text-sm font-medium text-white border-b mb-2 pb-1">
                    {{ Auth::user()->full_name }}
                </h1>
                <form action="{{ route('logout') }}" method="POST" onsubmit="showLoading()">
                    @csrf
                    <button type="submit"
                        class="hover:scale-105 duration-100 transition-all flex gap-2 items-center text-sm text-theme_gray p-2">
                        <div
                            class="text-base text-gray-700 flex items-center justify-center w-[30px] h-[30px] bg-theme_gray rounded-full p-2">
                            <i class="fa-solid fa-right-from-bracket"></i>
                        </div>
                        <p class="w-full font-semibold">Çıkış Yap</p>
                    </button>
                </form>
            </div>
        </div>
    </div>
    <div class="container-user pb-5 pt-5">
        <form action="{{ route('user.userContract') }}" method="POST" onsubmit="showLoading()">
            @csrf
            <div class="text-gray-300">
                @include('components.workers.consentText')
            </div>
            <div class="text-gray-300">
                @include('components.workers.secretContract')
            </div>
            <div class="text-gray-300">
                @php
                    $category = Auth::user()->preMeeting->category;
                @endphp
                @include('components.workers.cleanerContract')
            </div>
            <div class="my-4">
                <button type="submit" class="button-2 w-full text-sm">Devam Et</button>
            </div>
        </form>
    </div>
    @if ($errors->any())
        @include('components.error-modal-second')
    @endif
    @if (session('error'))
        <x-toast color="red-700">
            <x-slot name="message">
                {{ session('error') }}
            </x-slot>
            <x-slot name="icon">
                <i class="fa-solid fa-exclamation"></i>
            </x-slot>
        </x-toast>
    @endif
    @if (session('success'))
        <x-toast color="green-700">
            <x-slot name="message">
                {{ session('success') }}
            </x-slot>
            <x-slot name="icon">
                <i class="fa-solid fa-check"></i>
            </x-slot>
        </x-toast>
    @endif
@endsection
@section('javascript')
    <script>
        $('.profileButton').click(function() {
            $('#subMenu').fadeToggle('300');
        })

        $(document).on('click', function(e) {
            if (!$(e.target).hasClass("profileButton") && $("#subMenu").has(e.target).length === 0) {
                $("#subMenu").fadeOut('fast');
            }
        });
    </script>
@endsection