@extends('frontend.layouts.app')

@section('seo')
<title>Careers | eg APPAREL</title>
<meta property="og:locale"          content="en_US" />
<meta property="og:url"             content="" />
<meta property="og:type"            content="website" />
<meta property="og:title"           content="Careers | eg APPAREL" />
<meta property="og:description"     content="" />
<meta property="og:site_name"       content="Careers | eg APPAREL" />
<meta property="og:image"           content="{{ asset('resources/web_thumb.jpg') }}" />
<meta property="og:thumbnail"           content="{{ asset('resources/web_thumb.jpg') }}" />
@endsection

@section('content')
<div class="container py-5">

  <div class="row w-100 d-flex justify-content-center">
    <div class="col-12 col-sm-12 col-md-12 col-lg-9">
      <div>
        <div class="row mb-5">
          <div class="col-4 col-sm-4 col-md-4 col-lg-2">
            <div class="bg-white rounded-circle py-1 text-center border-type px-3">
              <span>Full Time</span>
            </div>
          </div>
        </div>
      
        <div class="mb-5">
          <h1>{{ $careers->title }}</h1>
          <span><i class="fa-solid fa-location-dot fs-6"></i> {{ $careers->location }}</span>
        </div>

        <p>{!! $careers->description !!}</p>
      
        {{-- <h2 class="fw-bold mb-5">Job Description:</h2>
        
        <div class="lh-lg mb-5">
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span><br>
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span><br>
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span><br>
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span><br>
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span>
        </div>
      
        <div class="lh-lg mb-5">
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span><br>
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span><br>
          <span>
            Lorem ipsum dolor sit amet consectetur, adipisicing elit. Esse ab ullam modi quidem nesciunt.
          </span>
        </div>
      
        <h2 class="fw-bold">Requirements:</h2>
        <div class="row g-2 mb-5">
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
        </div>

        <h2 class="fw-bold">Qualifications:</h2>
        <div class="row g-2 mb-5">
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Qualifications</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
          <div class="col-6 col-sm -6 col-md-6 col-lg-12">
            <span><i class="fa-regular fa-circle-dot"></i> Sample Requirements</span>
          </div>
        </div> --}}

        <div class="center mt-3">
          <a href="mailto:mail@companyname.com">
            <button class="btn btn-primary bg-transparent rounded-circle text-black py-2 px-4 align-bottom button-alt type1-alt">
              <span class="btn-text">Apply</span>
            </button>
          </a>
        </div>
      </div>
    </div>
  </div>

</div>
@endsection