@extends('site.layout.layout')
@section('url'){{Request::fullUrl()}}@stop

@section('css')
<style>
    body .prow.exp .pdet-btn{
        left: calc(44px + 2rem) !important;
        top:270px !important;
    padding: .45rem 0.8rem !important;
}

[data-theme=dark] .sps-card .sps-title a {
    color:#fff !important;
}
</style>


@if(App::getLocale() == 'en')
<style>
    body .prow.exp .pdet-btn{
        left: unset !important;
    }
</style>
@endif
@endsection

@section('content')
<main id="main">
<section class="hero" id="hero" aria-label="قسم الترحيب">
  <div class="hero-diag-line" aria-hidden="true"></div>

 @php $lang = app()->getLocale(); @endphp

<section class="hero" id="hero" aria-label="قسم الترحيب">
  <div class="hero-diag-line" aria-hidden="true"></div>

  @foreach($data['sliders'] as $i => $slider)
    @php
        $wordClasses = ['wt', 'wo', 'wg', 'wr'];

       $lines = preg_split('/<br\s*\/?>/i', trim($slider->details ?? ''));
        $ci = 0; // عدّاد عام للكلاسات يستمر عبر الأسطر

        $animatedWords = is_array($slider->animated_words)
            ? $slider->animated_words
            : (json_decode($slider->animated_words, true) ?: []);
    @endphp

    <div class="hslide @if($i === 0) on @endif">
      <div class="him">
        <img src="{{ asset('uploads/'.$slider->main_image) }}"
             alt="{{ strip_tags($slider->details) }}"
             @if($i === 0) fetchpriority="high" @else loading="lazy" @endif
             decoding="async">
      </div>

      <div class="hco">
        <h1 class="kh">
            
          @foreach($lines as $key=>$line)
            @php $words = preg_split('/\s+/', trim($line)); @endphp
            <span class="khl" @if($key != 0)  style="background:none" @endif>
              @foreach($words as $wi => $word)
                @php
                    $cls   = $wordClasses[$ci % count($wordClasses)];
                    $ci++;
                    $space = $wi < count($words) - 1 ? '&nbsp;' : '';
                @endphp
                <span class="{{ $cls }}">{!! $word !!}{!! $space !!}</span>
              @endforeach
            </span>
          @endforeach

          {{-- الكلمات المتحركة --}}
          @if(count($animatedWords))
            <span class="khl">
              <span class="ks"><span class="ksi">
                @foreach($animatedWords as $w)
                  <span style="color: {{ $w['color'] ?? 'var(--t1)' }}">{{ $w['word_'.$lang] ?? ($w['word_ar'] ?? '') }}</span>
                @endforeach
              </span></span>
            </span>
          @endif
        </h1>
      </div>
    </div>
  @endforeach

  {{-- ── زر ثابت: بيانات أول شريحة ── --}}
  @php $first = $data['sliders']->first(); @endphp
  @if($first && $first->name_btn)
    <div class="hero-fixed-cta">
      <button class="bm don-trigger" data-url="{{ $first->url }}">
        <div class="bmf"></div>
        <span>{{ $first->name_btn }}</span>
      </button>
    </div>
  @endif

  {{-- ── أشرطة تقدم الشرائح ── --}}
  <div class="hs-bars" role="tablist" aria-label="الشرائح">
    @foreach($data['sliders'] as $i => $slider)
      <button class="hs-bar @if($i === 0) on @endif" aria-label="الشريحة {{ $i + 1 }}">
        <span class="hs-bar-fill"></span>
      </button>
    @endforeach
  </div>
</section>



</section>


@php
    $lang = app()->getLocale();
    $total = $data['programs']->count();


@endphp

<section id="prg2" class="prg-sec">
  <div class="prg-hd sr">
    <div class="prg-title" data-i18n="prg.title">{{trans('app.programs')}}</div>
  </div>
  <div class="prg-cols">

    @foreach($data['programs'] as $i => $program)
      @php
          $num     = $i + 1;
          $badge   = str_pad($num, 2, '0', STR_PAD_LEFT) . ' · ' . str_pad($total, 2, '0', STR_PAD_LEFT);
      @endphp

      <div class="prg-col">
        <div class="prg-bg-img"><img src="/uploads/{{$program->icon}}" alt="" loading="lazy"></div>
        <div class="prg-num" aria-hidden="true">{{ $num }}</div>
        <div class="prg-flow" aria-hidden="true"><div class="prg-flow-dot"></div></div>
        <div class="prg-badge" aria-hidden="true">
          <span class="prg-badge-dot"></span>
          <span class="prg-badge-txt">{{ $badge }}</span>
        </div>
        <div class="prg-top-bar"></div>

        <div class="prg-hov-head">
          <div class="prg-hov-name">{{ $program->title }}</div>
        </div>

        <div class="prg-hov-body">
          <div class="prg-sep"></div>
          <p class="prg-desc">{!! $program->details !!}</p>
        </div>

        <div class="prg-bot">
          <div class="prg-def-name">{!! nl2br($program->title) !!}</div>
          <div class="prg-bot-bar"></div>
        </div>
      </div>
    @endforeach

  </div>
</section>

<!-- ══ STORIES SPOTLIGHT ══ -->
<section id="sps">
  <div class="sps-hd sr">
    <div class="sps-hd-label" data-i18n="sps.label">{{ trans('app.Selected Stories') }}</div>
    <h2 class="sps-hd-title">{{ trans('app.from') }} <span class="sps-hd-accent" data-i18n="sps.hd.title">{{ trans('app.the Field') }}</span></h2>
  </div>

  <div class="sps-wrap sr">

    {{-- قائمة القصص --}}
    <div class="sps-list">
      @foreach($data['stories'] as $i => $story)
        <div class="sps-card @if($i === 0) on @endif" data-idx="{{ $i }}">
          <div class="sps-num">{{ str_pad($i + 1, 2, '0', STR_PAD_LEFT) }}</div>
          <div class="sps-body">
            <div class="sps-tag">{{ $story->source }}</div>
            <div class="sps-title">
                <div style="display:flex;color:#142830;text-decoration:none;justify-content: space-between;" >
                    <span>{{ $story->title }}</span>
                    <a href="{{url(''.App::getLocale().'')}}/news/{{$story->id}}" style="font-weight:normal;color:#142830;text-decoration:none;">{{trans('app.read_more')}}</a>
                </div>
            </div>
            <div class="sps-line">{!! $story->content !!}</div>
          </div>
        </div>
      @endforeach
    </div>

    <div class="sps-img-pane">
      @foreach($data['stories'] as $i => $story)
        <img class="sps-img @if($i === 0) on @endif"
             data-story="{{ $i }}"
             src="{{ asset('uploads/'.$story->main_image) }}"
             alt="{{ $story->title }}"
             loading="lazy">
      @endforeach
      <div class="sps-img-num" id="spsImgNum">01</div>
    </div>

  </div>

  <div class="sps-prog-wrap">
    @foreach($data['stories'] as $i => $story)
      <div class="sps-prog-dot @if($i === 0) on @endif" data-dot="{{ $i }}"></div>
    @endforeach
    <div class="sps-prog-bar-wrap">
      <div class="sps-prog-bar" id="spsBar"></div>
    </div>
  </div>
</section>


@php
    $lang = app()->getLocale();

    $badgeMap = [
        1 => 'blv',  // نشط    Active
        2 => 'bwp',  // جارٍ    In progress
        3 => 'bdn',  // مكتمل   Completed
    ];
@endphp

<section id="proj" class="pjs">
  <div class="pjh sr">
    <div class="pjt">
      <span data-i18n="proj.title">{{ trans('app.projects') }}</span>
    </div>
        <a href="{{ url(App::getLocale().'/projects') }}" class="pja" data-i18n="proj.all">{{ trans('app.projects') }} &#8594;</a>
  </div>

  <div>
    @foreach($data['projects'] as $i => $project)
      @php
          $num        = str_pad($i + 1, 2, '0', STR_PAD_LEFT);
          $title      = $project->{"title_$lang"};
          $progress   = (int) $project->progress_percent;

          $badgeClass = $badgeMap[$project->status_id] ?? 'bwp';
          $badgeText  = $project->status_relation->{"name_$lang"} ?? '';
      @endphp

      <div class="prow" role="button" tabindex="0" aria-expanded="false" aria-label="{{ $title }}">
        <img class="pbg" src="{{ asset('uploads/'.$project->main_image) }}" alt="{{ $title }}" loading="lazy">
        <div class="pgo"></div>
        <div class="pidx">{{ $num }}</div>

        <div class="pbod">
          <div class="pnm">{{ $title }}</div>
          <div class="pds">{{ $project->{"summary_$lang"} }}</div>

          <div class="pdet">
            <div class="pdg">

                @php
                    $custom_fields_array = array();
                    $custom_fields = $project->custom_fields;
                    if($custom_fields){
                        $custom_fields_array = json_decode($project->custom_fields, true);
                    }
                @endphp

            @if($custom_fields_array)
            @foreach($custom_fields_array as $custom)
              <div>
                <div class="pdl">{{ $custom["label_$lang"] }}</div>
                <div class="pdv g">{{ $custom["value_$lang"] }}</div>
              </div>
              @endforeach
            @endif

            </div>


          </div>
        </div>

        <div class="ploc">{{ $project->city->{"name_$lang"} ?? '' }}</div>
        <span class="pbdg {{ $badgeClass }}">{{ $badgeText }}</span>
        <div class="parr">&#8594;</div> 
        <a class="pdet-btn rdy" href="{{ url(App::getLocale().'/projects/'.$project->id) }}" style="top: 312.8px;">{{ trans('app.view_details') }}  <span>&#8594;</span></a>
      </div>
    @endforeach
  </div>
</section> 

@php $lang = app()->getLocale(); @endphp
 
<!-- GALLERY / STUDIO -->
<section id="gallery" class="gal-sec gal-t0" style="background: #000 url('/uploads/{{$data['studio']->photo}}') center / cover no-repeat;">
  <div class="gal-inner">

    {{-- HEADER --}}
    <div class="gal-hd sr">
      <h2 class="gal-ttl" data-i18n="gal.heading">{{trans('app.studio')}}</h2>
    </div>

    {{-- CARD GRID --}}
    <div class="gal-grid">
      @foreach($data['studios'] as $studio)
  @php
      $nameAr = $studio->title_ar;
      $nameEn = $studio->title_en;

      $cityAr = $studio->city->name_ar ?? '';
      $cityEn = $studio->city->name_en ?? '';
      $locAr  = trim($studio->neighborhood . ($cityAr ? '، ' . $cityAr : ''));
      $locEn  = $cityEn;

      $name = $studio->{"title_$lang"};
      $loc  = $lang === 'ar' ? $locAr : $locEn;

      $tag  = $studio->intervention->{"name_$lang"} ?? '';

      // Extract YouTube ID if video type
      $ytId = null;
      if ($studio->type == 2 && $studio->video_url) {
          preg_match('/(?:youtu\.be\/|youtube\.com\/(?:watch\?v=|embed\/|shorts\/))([a-zA-Z0-9_-]{11})/', $studio->video_url, $m);
          $ytId = $m[1] ?? null;
      }
  @endphp

  <div class="gal-card {{ $studio->type == 2 ? 'gal-card-video' : '' }}"
       data-cap="{{ $nameAr }}" data-loc="{{ $locAr }}"
       data-cap-en="{{ $nameEn }}" data-loc-en="{{ $locEn }}"
       @if($studio->type == 2 && $ytId)
         data-video-id="{{ $ytId }}"
       @endif
       role="button" tabindex="0">
    <div class="gal-card-bg">
      @if($studio->type == 2 && $ytId)
        <img src="https://img.youtube.com/vi/{{ $ytId }}/hqdefault.jpg" alt="{{ $name }}" loading="lazy">
        <div class="gal-play-btn">
          <svg width="48" height="48" viewBox="0 0 48 48" fill="none">
            <circle cx="24" cy="24" r="24" fill="rgba(0,0,0,0.55)"/>
            <polygon points="19,14 19,34 36,24" fill="#fff"/>
          </svg>
        </div>
      @else
        <img src="{{ asset('uploads/'.$studio->main_image) }}" alt="{{ $name }}" loading="lazy">
      @endif
    </div>
    <div class="gal-card-tag">{{ $tag }}</div>
    <div class="gal-card-ov">
      <div class="gal-card-name">{{ $name }}</div>
      <div class="gal-card-loc">{{ $loc }}</div>
    </div>
  </div>
@endforeach
    </div>

    <div class="gal-foot">
      <button class="gal-all-btn" id="gal-open-all" data-i18n="gal.viewall">{{trans('app.view_all_collection')}}</button>
    </div>

  </div>
</section>

<div class="lb-ov" id="lb-ov">
  <button class="lb-close" id="lb-close">&#x2715;</button>
  <div class="lb-content" id="lb-content"></div>
  <div class="lb-caption" id="lb-caption"></div>
  <div class="lb-loc" id="lb-loc"></div>
  <div class="lb-nav">
    <button id="lb-prev" aria-label="السابقة">&#8594;</button>
    <button id="lb-next" aria-label="التالية">&#8592;</button>
  </div>
  <div class="lb-counter" id="lb-counter"></div>
</div>

<section class="tes">

    @php $lang = app()->getLocale(); @endphp

<div class="tesl sr-right">
  <span class="testt" data-i18n="tes.label">{{ trans('app.Voices from the Field') }}</span>

  <div class="tes-quotes" id="tes-wrap" aria-live="polite" aria-atomic="true">
    @foreach($data['fieldVoices'] as $i => $voice)
      <div class="tes-item @if($i === 0) active @endif">
        <blockquote class="tes-quote">{{ $voice->{"quote_$lang"} }}</blockquote>
        <div class="tes-who">
          <div class="tes-name">{{ $voice->{"name_$lang"} }}</div>
          <div class="tes-role">{{ $voice->{"job_title_$lang"} }}</div>
        </div>
      </div>
    @endforeach
  </div>

  <div class="tes-dots" id="tes-dots">
    @foreach($data['fieldVoices'] as $i => $voice)
      <button class="tes-dot @if($i === 0) on @endif" data-i="{{ $i }}" aria-label="صوت {{ $i + 1 }}"></button>
    @endforeach
  </div>

  <div class="tes-pbar"><div class="tes-pfill run" id="tes-pfill"></div></div>
</div>

  <div class="tesr sr-left">
    <p class="testb" data-i18n="tes.body">{!! $data['statistics']->details !!}</p>
    <div class="tsts">
 @foreach($data['statistic_count'] as $stat)
      <div>
        <div class="tsn">{{ $stat->number }}</div>
        <div class="tsl">{{ $stat->{"name_$lang"} }}</div>
      </div>
    @endforeach
    </div>
  </div>
</section>

<section id="news" class="nws">
  <div class="nws-head sr">
    <div class="nws-title"><span data-i18n="news.title">{{trans('app.last')}}</span> <span data-i18n="news.sub">{{trans('app.news')}}</span></div>
  </div>
  <div class="nws-layout">

    <!-- ── عمود الأخبار (2/3) ── -->
    <div class="nws-main">
      <div class="nws-filters">
        <!-- <div class="nf-news-group">
          <button class="nf-btn on" data-f="all" data-i18n="filter.all">الكل</button>
          <button class="nf-btn" data-f="cat-field" data-i18n="filter.field">ميداني</button>
          <button class="nf-btn" data-f="cat-report" data-i18n="filter.reports">تقارير</button>
          <button class="nf-btn" data-f="cat-story" data-i18n="filter.stories">قصص</button>
        </div> -->
        <div class="nf-opp-group">
          <span class="nf-btn nf-opp-label" data-i18n="filter.opp.label">{{trans('app.news')}}</span>
          <button class="nf-btn nf-tender" data-f="tenders" data-i18n="filter.tenders">{{trans('app.tenders')}}</button>
          <button class="nf-btn nf-jobs" data-f="jobs" data-i18n="filter.jobs">{{trans('app.jobs')}}</button>
        </div>
      </div>

      <div class="nws-content">

  <div class="nws-tab-panel" id="panel-tenders">
    @foreach($data['tenders'] as $tender)
      @php
          $isClosed = $tender->expiry_date && $tender->expiry_date->isPast();
          $isUrgent = !$isClosed && $tender->expiry_date
                      && $tender->expiry_date->diffInDays(now()) <= 7;
          $ref      = $tender->tender_date
                      ? $tender->tender_date->format('Y') . '/' . str_pad($tender->id, 2, '0', STR_PAD_LEFT)
                      : $tender->id;
      @endphp

      <a href="{{url(''.App::getLocale().'')}}/tenders/{{$tender->id}}" style="text-decoration: none;" class="tnd-item @if($isClosed) tnd-closed-item @endif">
        <div class="tnd-status {{ $isClosed ? 'tnd-closed' : 'tnd-active' }}">
          {{ $isClosed ? trans('app.tender_closed') : trans('app.tender_active') }}
        </div>
        <div class="tnd-body">
          <div class="tnd-ref">{{ $ref }}</div>
          <div class="tnd-title">{{ $tender->{"title_$lang"} }}</div>
          <div class="tnd-meta">
            <span class="tnd-date">
              <span>{{ trans('app.tender_issued') }}</span>
              {{ $tender->tender_date ? $tender->tender_date->translatedFormat('j F Y') : '' }}
            </span>
            <span class="tnd-sep">·</span>
            <span class="tnd-deadline @if($isUrgent) tnd-urgent @endif">
              <span>{{ $isClosed ? trans('app.tender_closed_on') : trans('app.tender_closes') }}</span>
              {{ $tender->expiry_date ? $tender->expiry_date->translatedFormat('j F Y') : '' }}
            </span>
          </div>
        </div>

        @if($isClosed)
          <span class="tnd-dl tnd-dl-closed">{{ trans('app.tender_ended') }}</span>
        @elseif($tender->pdf_file)
          <a href="{{ asset('storage/'.$tender->pdf_file) }}" class="tnd-dl" target="_blank">{{ trans('app.tender_download') }}</a>
        @endif
      </a>
    @endforeach

    <div class="tnd-more"><a href="{{url(''.App::getLocale().'')}}/tenders" class="tnd-more-btn">{{ trans('app.tender_all') }} &#8594;</a></div>
  </div>

  <div class="nws-tab-panel" id="panel-jobs">
    @foreach($data['jobs'] as $job)
      @php
          $isClosed = $job->expiry_date && $job->expiry_date->isPast();
          $isUrgent = !$isClosed && $job->expiry_date
                      && $job->expiry_date->diffInDays(now()) <= 7;
      @endphp

      <a href="{{url(''.App::getLocale().'')}}/jobs/{{$job->id}}" style="text-decoration: none;"  class="tnd-item @if($isClosed) tnd-closed-item @endif">
        <div class="tnd-status {{ $isClosed ? 'tnd-closed' : 'tnd-active' }}">
          {{ $isClosed ? trans('app.job_closed') : trans('app.job_open') }}
        </div>
        <div class="tnd-body">
          <div class="tnd-title">{{ $job->{"title_$lang"} }}</div>
          <div class="tnd-meta">
            <span class="tnd-date">
              <span>{{ trans('app.job_posted') }}</span>
              {{ $job->tender_date ? $job->tender_date->translatedFormat('j F Y') : '' }}
            </span>
            <span class="tnd-sep">·</span>
            <span class="tnd-deadline @if($isUrgent) tnd-urgent @endif">
              <span>{{ $isClosed ? trans('app.job_closed_on') : trans('app.job_deadline') }}</span>
              {{ $job->expiry_date ? $job->expiry_date->translatedFormat('j F Y') : '' }}
            </span>
          </div>
        </div>

        @if($isClosed)
          <span class="tnd-dl tnd-dl-closed">{{ trans('app.job_ended') }}</span>
        @elseif($job->pdf_file)
          <a href="{{ asset('storage/'.$job->pdf_file) }}" class="tnd-dl" target="_blank">{{ trans('app.job_download') }}</a>
        @endif
      </a>
    @endforeach

    <div class="tnd-more"><a href="{{url(''.App::getLocale().'')}}/jobs" class="tnd-more-btn">{{ trans('app.job_all') }} &#8594;</a></div>
  </div>

      @php
    $lang = app()->getLocale();

    $positions = [
        'ncard-main',
        'ncard-mid-top',
        'ncard-mid-bot',
        'ncard-side',
    ];

    $catMap = [
        1 => 'cat-field',
        2 => 'cat-story',
    ];
@endphp

<div class="nws-mosaic">
  @foreach($data['news'] as $i => $item)
    @php
        $pos      = $positions[$i] ?? '';
        $title    = $item->{"title_$lang"};
        $catClass = $catMap[$item->category_id] ?? 'cat-field';
        $catText  = $item->category["name_$lang"] ?? '';
        $date     = $item->news_date
                ? \Carbon\Carbon::parse($item->news_date)->translatedFormat('F Y')
                : '';

    @endphp

    <a href="{{url(''.App::getLocale().'')}}/news/{{$item->id}}" style="text-decoration: none;"  class="ncard {{ $pos }} sr sr-d{{ $i + 1 }}"
         role="button" tabindex="0"
         data-id="{{ $item->id }}"
         aria-label="{{ $title }}">
      <div class="ncard-bg">
        <img src="{{ asset('uploads/'.$item->main_image) }}" alt="{{ $title }}" loading="lazy">
      </div>
      <div class="ncard-grad"></div>
      <div class="ncard-body">
        <span class="ncat {{ $catClass }}">{{ $catText }}</span>
        <div class="ncard-title">{{ $title }}</div>
        <div class="ncard-date">{{ $date }}</div>
      </div>
    </a>
  @endforeach
</div>
    <div class="nws-all-wrap">
        <a href="{{ url(App::getLocale().'/news') }}" class="nws-all-btn">{{ trans('app.news') }} &#8594;</a>
    </div>

      </div><!-- end nws-content -->
    </div>

   @php
    $lang = app()->getLocale();

    $badgeMap = [
        3 => ['cls' => 'rpt-report',  'key' => 'rpt_report'],   // تقرير
        4 => ['cls' => 'rpt-release', 'key' => 'rpt_release'],  // إصدار
        5 => ['cls' => 'rpt-pub',     'key' => 'rpt_pub'],      // منشور
    ];
@endphp

<div class="nws-reports sr sr-d2">
  <span class="rpt-label">{{ trans('app.rpt_label') }}</span>
  <div class="rpt-col-title">{{ trans('app.rpt_title') }}</div>

  @foreach($data['reports'] as $report)
    @php
        $badge    = $badgeMap[$report->category_id] ?? ['cls' => 'rpt-report', 'key' => 'rpt_report'];
        $badgeCls = $badge['cls'];
        $badgeTxt = trans('app.'.$badge['key']);

        $title = $report->{"title_$lang"};
        $desc  = $report->{"details_$lang"};
        $date  = $report->news_date
                 ? \Carbon\Carbon::parse($report->news_date)->translatedFormat('F Y')
                 : '';
        $dl    = $report->pdf_file ? asset('uploads/'.$report->pdf_file) : '#';
    @endphp
 
    <a href="{{url(''.App::getLocale().'')}}/news/{{$report->id}}" class="rpt-item" style="text-decoration: none;"
         data-badge="{{ $badgeTxt }}"
         data-badge-cls="{{ $badgeCls }}"
         data-title="{{ $title }}"
         data-date="{{ $date }}"
         data-desc="{{ $desc }}"
         data-dl="{{ $dl }}">
      <span class="rpt-badge {{ $badgeCls }}">{{ $badgeTxt }}</span>
      <div class="rpt-item-title">{{ $title }}</div>
      <div class="rpt-item-meta">
        <span class="rpt-item-date">{{ $date }}</span>
        <span class="rpt-item-arr">&#8592;</span>
      </div>
    </a>
  @endforeach
    <div class="nws-all-wrap">
        <a href="{{ url(App::getLocale().'/publications') }}" class="nws-all-btn">{{ trans('app.rpt_all') }} &#8594;</a>
    </div>
</div>

  </div>
</section>

@php $lang = app()->getLocale(); @endphp

<section id="part" class="pts">
  <div class="pts-row">
    <div class="pts-label-wrap">
      <span class="ptl">{{ trans('app.partners') }}</span>
    </div>
    <div class="pts-track">
      <div class="pts-strip">

        @for($rep = 0; $rep < 2; $rep++)
          @foreach($data['partners'] as $partner)
            @php $logo = asset('uploads/'.$partner->image); @endphp
            @if($partner->url)
              <a class="pt" href="{{ $partner->url }}" target="_blank" rel="noopener">
                <img src="{{ $logo }}" alt="{{ $partner->title }}" loading="lazy">
              </a>
            @else
              <span class="pt">
                <img src="{{ $logo }}" alt="{{ $partner->title }}" loading="lazy">
              </span>
            @endif
          @endforeach
        @endfor

      </div>
    </div>
  </div>
</section>


<section id="contact" class="ctu">
  <div class="ctu-inner">

    <div class="ctu-hd sr">
     
      <h2 class="ctu-title">
        {{ trans('app.contact_title') }}<br>
        <span class="ctu-accent">{{ trans('app.contact_title2') }}</span>
      </h2>
      
    </div>



    <form class="ctu-form sr sr-d2" id="ctu-form" method="POST" action="/{{App::getLocale()}}/contact" enctype="multipart/form-data">
      @csrf

       @if ($errors->any())
  <div class="ctu-errors">
      @foreach ($errors->all() as $error)
        {{ $error }}<br>
      @endforeach
    </ul>
  </div>
@endif

@if (session('success'))
  <div class="ctu-success" id="ctu-success">
    {{ session('success') }}
  </div>
@endif

      <div id="ctu-identity">
        <div class="ctu-row">
          <div class="ctu-field">
            <label class="ctu-field-label">{{ trans('app.contact_name') }}</label>
            <input class="ctu-input" type="text" name="name" placeholder="{{ trans('app.contact_name_ph') }}">
          </div>
          <div class="ctu-field">
            <label class="ctu-field-label">{{ trans('app.contact_org') }}</label>
            <input class="ctu-input" type="text" name="organization" placeholder="{{ trans('app.contact_org_ph') }}">
          </div>
        </div>
        <div class="ctu-field">
          <label class="ctu-field-label">{{ trans('app.contact_email') }}</label>
          <input class="ctu-input" type="email" name="email" placeholder="{{ trans('app.contact_email_ph') }}">
        </div>
      </div>

      <div class="ctu-topic-row">
        <div class="ctu-field" style="flex:1">
          <label class="ctu-field-label">{{ trans('app.contact_topic') }}</label>
          <input class="ctu-input" type="text" name="title" placeholder="{{ trans('app.contact_topic_ph') }}">
        </div>
        <label class="ctu-anon-toggle" title="{{ trans('app.contact_anon_title') }}">
          <input type="checkbox" id="ctu-anon-check" name="is_unknown" value="1">
          <span class="ctu-anon-slider"></span>
          <span class="ctu-anon-lbl">{{ trans('app.contact_anon') }}</span>
        </label>
      </div>

      <div class="ctu-field">
        <label class="ctu-field-label">{{ trans('app.contact_msg') }}</label>
        <textarea class="ctu-input ctu-textarea" rows="5" name="details" placeholder="{{ trans('app.contact_msg_ph') }}"></textarea>
      </div>

      <button type="submit" class="ctu-submit">
        <div class="ctu-submit-fill"></div>
        <span>{{ trans('app.contact_send') }}</span>
        <span class="ctu-submit-arr">&#8592;</span>
      </button>

    </form>

  </div>
</section>
</main>
@endsection
@section('js')
<script>
    $(document).on('click','.nf-opp-label',function(e){
        $('#panel-tenders').removeClass('active');
        $('#panel-jobs').removeClass('active');
        // $('.nws-mosaic').css('display','block');
        
        $('.nf-tender').removeClass('on');
        $('.nf-jobs').removeClass('on');
    })
</script>
@endsection