@extends('sg::layouts.main')

@section('content')
    <div class="careers-page-head">
        <div class="container">
            <div class="py-5">
                <div class="heading-h2">{{$careers->attributes['title']}}</div>
                <div class="f-80-bold">{{$careers->attributes['description']}}</div>
            </div>
        </div>
    </div>
    <div class="careers-page container-fluid px-0 d-none d-lg-block">
        <div class="row background">
            <div class="col-sm-6 yellow">

            </div>
            <div class="col-sm-6 red"></div>
        </div>
        <div class="container">
            <div class="row">
                <div class="col-md-6 py-5 d-flex flex-column">
                    <div class="d-flex flex-column h-100 mt-5">
                        <div class="heading-h2 mb-5">Benefit</div>
                        <div class="">
                            {!! $careers->content !!}
                        </div>
                        <div class="group-btn mt-5">
                            <i class="fa fa-paper-plane mr-3"></i>
                            <b class="text-black">To apply, please send your resume to:
                                <u><a class="text-black" href="mailto:{{$careers->attributes['email']}}?Subject=Apply%20job">{{$careers->attributes['email']}}</a></u>
                            </b>

                        </div>
                    </div>
                </div>
                <div class="col-md-6 py-5 d-flex flex-column">
                    @if(count($careers->positions))
                        <div class="wrap-content careers-position flex-grow-1 d-flex flex-column mt-5">
                            <div class="wrap-careers-item">
                                @foreach($careers->positions as $item)
                                        <div class="careers-position-group">
                                            <a class="d-flex careers-position-item careers-position-download" href="{{$item->attributes['document-link']}}" target="_blank">
                                                <span class="title">{{$item->title}}</span>
                                                @if(!empty($item->attributes['document-link']))
                                                    <span class="ml-2 careers-position-icon">
                                                        <i class="fa fa-file-pdf-o" aria-hidden="true"></i>
                                                    </span>
                                                @endif
                                            </a>
                                            @if(!empty($item->attributes['company-name']))
                                                <div class="careers-position-item uppercase">
                                                    {{$item->attributes['company-name']}}
                                                </div>
                                            @endif
                                            <div class="careers-position-item careers-position-info mb-0">
                                                @if(!empty($item->attributes['company-address']))
                                                    <span>{{$item->attributes['company-address']}}</span>
                                                @endif
                                                @if(!empty($item->attributes['job-type']))
                                                    <span>{{$item->attributes['job-type']}}</span>
                                                @endif
                                                @if(!empty($item->attributes['number-vacancies']))
                                                    <span>{{$item->attributes['number-vacancies']}} positions</span>
                                                @endif
                                            </div>
                                        </div>
                                    @endforeach
                            </div>
                        </div>
                    @else
                        <div class="flex-center" style="height: 100%">
                            <div>
                                <div class="text-center">
                                    <img style="max-width: 150px" src="@if($careers->empty_position['1'] ?? null){{asset($careers->empty_position['1'])}}@endif" alt="">
                                </div>
                                <div class="text-center mt-3" style="opacity: 0.5">
                                    {{ $careers->empty_position['0'] ?? '' }}
                                </div>
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
    <div class="col-12 mobile-careers d-lg-none">
        <div class="row wrap-careers mb-4">
            <div class="container mb-5">
                <div class="benefit">
                    <div class="heading-h2 mb-5">Benefit</div>
                    <div class="">
                        {!! $careers->content !!}
                    </div>

                    <p class="group-btn mt-5">
                        <i class="fa fa-paper-plane mr-3"></i>
                        <b class="text-black">To apply, please send your resume to:
                            <u><a class="text-black" href="mailto:{{$careers->attributes['email']}}?Subject=Apply%20job">{{$careers->attributes['email']}}</a></u>
                        </b>
                    </p>
                </div>
                <div class="position">
                    <div class="wrap-content careers-position flex-grow-1 d-flex flex-column">
                        <div class="wrap-careers-item">
                            @foreach($careers->positions as $item)
                                <div class="careers-position-group">
                                    <a class="d-flex careers-position-item careers-position-download" href="{{$item->attributes['document-link']}}" target="_blank">
                                        <span class="title">{{$item->title}}</span>
                                        @if(!empty($item->attributes['document-link']))
                                            <span class="ml-2 careers-position-icon">
                                                <i class="fa fa-file-pdf-o" aria-hidden="true"></i>
                                            </span>
                                        @endif
                                    </a>
                                    @if(!empty($item->attributes['company-name']))
                                        <div class="careers-position-item uppercase">
                                            {{$item->attributes['company-name']}}
                                        </div>
                                    @endif
                                    <div class="careers-position-item careers-position-info mb-0">
                                        @if(!empty($item->attributes['company-address']))
                                            <span>{{$item->attributes['company-address']}}</span>
                                        @endif
                                        @if(!empty($item->attributes['job-type']))
                                            <span>{{$item->attributes['job-type']}}</span>
                                        @endif
                                        @if(!empty($item->attributes['number-vacancies']))
                                            <span>{{$item->attributes['number-vacancies']}} positions</span>
                                        @endif
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@stop