@extends('client.raffles.layouts.app')
@section('content')
    <div class="p-20 ">
        <div class="h-175 rounded-10 bg-after relative">
            <img class="h-full w-full rounded-30 object-cover"
                src="{{ asset('raffles/assets/images/general/about-banner.png') }}" alt="">
            <div
                class="flex justify-center flex-col text-center items-center w-70percent mx-auto absolute top-20percent left-15percent z-30">
                <h2 class="md:text-40 text-94 text-white">Career-Details</h2>

            </div>
        </div>


    </div>
    <section class="pt-60 career-details ">
        <div class="container">
            <div class="row">
                <div class="col col col-12">
                    <div class="relative line-through">
                        <div class="position ">
                            <h4 class="text-brand">Available Position</h4>
                        </div>

                    </div>

                </div>

                <div class="col col col-12 ">

                    <div class="d-flex gap-5 pt-5">
                        <div class="career-img">
                            <img class="w-full" src="assets/images/icons/team.svg" alt="">
                        </div>
                        <div>
                            <h3 class="text-brand">{{ $career->job_title }}</h3>
                            <p>{{ setting('location') }}</p>
                        </div>

                    </div>
                    <div class="py-5 ">

                        <div class="flex gap-10">
                            <div class="text-12">
                                <i class="fa-solid fa-money-bill-wave"></i> {{ $career->salary_range }}
                            </div>
                            <div class="text-12">
                                <i class="fa-solid fa-location-dot"></i> {{ $career->location }}
                            </div>
                            <div class="text-12">
                                <i class="fa-solid fa-briefcase"></i> {{ $career->position }}
                            </div>
                        </div>
                    </div>
                    <div class="row justify-between">
                        <div class="col col-12 col-md-6 pt-5">
                            <h5>Job Description</h5>
                            <p>{{ $career->job_description }}
                            </p>

                            <h6 class="py-3">Key Responsibilities (JD):</h6>
                            {{-- <ul>
                                <li>1. Creative Design Development: Conceptualize and create high-quality designs for
                                    digital and print media, including websites, social media, brochures, and promotional
                                    materials.</li>
                                <li>2. BTL Marketing Designs: Design engaging visual materials for BTL marketing campaigns,
                                    such as posters, banners, and standees, ensuring alignment with brand guidelines.</li>

                                <li>3. Layout and Page Design: Plan and design page layouts for print media such as
                                    brochures, pamphlets, and magazines, ensuring an eye-catching yet functional structure.
                                </li>
                                <li>4. Brand Identity Development: Work on visual brand identity projects, creating logos,
                                    color schemes, and overall brand guidelines that resonate with target audiences.</li>
                                <li>5. Client Collaboration: Collaborate with clients to understand their design
                                    requirements and deliver solutions that meet their objectives.</li>
                                <li>6. Cross-Departmental Collaboration: Work closely with the marketing and production
                                    teams to deliver cohesive and integrated creative projects.</li>
                                <li>7. Design for Digital Campaigns: Create digital assets for social media, websites, and
                                    online campaigns, ensuring visual consistency across all platforms.</li>
                                <li>8. Quality Control: Ensure the highest standards of quality and consistency across all
                                    creative outputs, adhering to timelines and project goals.</li>
                                <li>9. Software Proficiency: Utilize design tools such as Adobe Creative Suite (Photoshop,
                                    Illustrator, InDesign, etc.) to produce creative assets with speed and precision.</li>
                                <li>10. Mentorship and Team Leadership: Guide and mentor junior designers, providing
                                    feedback and support to ensure continuous growth and improvement within the team.</li>
                            </ul> --}}
                            {!! $career->job_requirements !!}
                        </div>
                        <div class="col col-12 col-md-5">
                            <div class=" form ">
                                <h2 class="text-26 mb-30 text-brand text-center">Quick Apply</h2>
                                <form action="{{ route('vacancy.store') }}" method="post" id="vacancy-form">
                                    @csrf
                                    <input type="hidden" name="career_id" value="{{ $career->id }}">
                                    <div class="flex gap-20">
                                        <input class="w-full mb-30 rounded-6 py-15 text-14 px-10" type="text"
                                            name="first_name" id="" placeholder="First Name">
                                        <input class="w-full mb-30 rounded-6 py-15 text-14 px-10" type="text"
                                            name="last_name" id="" placeholder="Last Name">
                                    </div>

                                    <div class="flex gap-20">
                                        <input class="w-full mb-30 rounded-6 py-15 text-14 px-10" type="email"
                                            name="email" id="" placeholder="Email">

                                        <input class="w-full mb-30 rounded-6 py-15 text-14 px-10" type="tel"
                                            name="phone" id="" placeholder="Phone Number">
                                    </div>


                                    <input class="w-full mb-30 rounded-6 py-15 text-14 px-10" type="text"
                                        name="qualification" id="" placeholder="Your Qualification">





                                    <textarea class="w-full mb-10 rounded-6 py-15 text-14 px-10" name="description" id=""
                                        placeholder="Short description about you"></textarea>
                                    <label class="text-16" for="">Please Upload Your CV</label>
                                    <input class="mb-20" type="file" name="document" id="">
                                    <button type="submit" id="vacancy-submit-btn"
                                        class="button-hover px-30 py-10 bg-sec text-white rounded-30 text-14 border-0 mt-20 ">Submit</button>
                                </form>

                            </div>
                        </div>

                    </div>


                </div>
            </div>


        </div>





    </section>
@endsection