{{-- Setup Introduction --}}
<div class="setup-wrapper-contents active">
    <div class="flex flex-wrap items-start justify-between gap-2 mb-6">
        <h2 class="text-[20px] leading-6 font-bold text-[#1f2937]">{{ __('Service Intro') }}</h2>
        <a href="{{ !empty(request()->get('return')) ? url('/'.request()->get('return')) : route('homepage') }}"
            class="text-[15px] font-medium text-[#334155] hover:text-primary transition">{{ get_static_option('account_page_skip_title') ?? __('Skip') }}</a>
    </div>

    <div class="mb-6">
        <label for="title" class="form-label">{{ get_static_option('professional_title') ?? __('Tell us what professional title describes you?') }}</label>
        <input type="text" name="title" id="title"
            value="{{ $user_introduction->title ?? '' }}"
            placeholder="{{ __('Enter Your Title') }}"
            class="form-input" />
    </div>

    <div class="mb-3">
        <label for="description" class="form-label">{{ get_static_option('intro_title') ?? __('Provide an intro yourself') }}</label>
        <textarea name="description" id="description" rows="5" class="form-textarea"
            placeholder="{{ __('I am a professional develop...') }}">{{ $user_introduction->description ?? '' }}</textarea>
        <div class="mt-2 text-right text-[14px] font-medium text-[#334155]">
            <span id="intro_char_count">{{ strlen($user_introduction->description ?? '') }}</span>/1500 max
        </div>
    </div>
</div>