@extends('master')

@section('title', $vacancy->translation->meta_title != '' ? $vacancy->translation->meta_title : $vacancy->translation->name .' | '. config('site.company_name'))

@section('content')

	<div class="c-page-title">
		<h1 class="c-page-title__heading">@lang('vacancy.thanks.title')</h1>
	</div>

	<div class="l-contain  u-spacing-mt6  u-spacing-mb4">
		<h2>@lang('vacancy.thanks.heading')</h2>
	</div>
	<div class="o-thanks">
		<div class="o-thanks__left">
			<ul class="c-toggle">
				<li class="c-toggle__item">
					<h2 class="c-toggle__title">
						<span class="c-toggle__icon  check">@include('components.icons.check')</span>
						<span class="c-toggle__label">@lang('vacancy.thanks.you_applied')</span>
					</h2>
				</li>
				@foreach($vacancyProcess as $key => $step)
					<li class="c-toggle__item" data-id="step-item-{{ $loop->iteration }}">
						<h2 class="c-toggle__title  js-toggle-trigger @if($loop->iteration == 2) is-active @endif" data-toggle-id="toggle-label-{{ $loop->iteration }}">
							<span class="c-toggle__icon  plus">@include('components.icons.plus')</span>
							<span class="c-toggle__icon  minus" hidden>@include('components.icons.minus')</span>
							<span class="c-toggle__label">{{ $step->translation->name ?? '' }}</span>
						</h2>
						<div class="c-toggle__content  js-toggle-target" data-toggle-id="toggle-label-{{ $loop->iteration }}">
							{!! $step->translation->description ?? '🤷🏻' !!}
						</div>
					</li>
				@endforeach
			</ul>
		</div>
		<div class="o-thanks__right">
{{--			<h2 class="u-spacing-mb4">@lang('vacancy.thanks.heading_servicepoint')</h2>--}}

{{--			@include('components.servicePoint', [--}}
{{--				'cardView' => false,--}}
{{--			])--}}
		</div>

	</div>


@endsection