@extends('frontend.kea-2026.layout.mainlayout')

@section('content')
    <header class="logo-header">
        <div class="container">
            <div class="logo-container">
                <div class="logo">
                    <!-- سيتم استبدال هذا بالشعار الفعلي -->
                    <img src="{{ URL::asset('assets/frontend/kea-2026/images/logo.jpg') }}" alt="شعار المؤتمر">
                </div>
            </div>
        </div>
    </header>

    <!-- Conference info section with background image -->
    <section class="conference-header">
        <div class="container">
            <div class="conference-header-content">
                <h1 class="conference-title">المؤتمر 23 لحكام وأندية الليونز العرب</h1>
                <p class="conference-theme">ملتزمون بسند الأطفال المصابين بالسرطان</p>

                <div class="conference-details">
                    <div class="detail-item">
                        <i class="far fa-calendar-alt"></i>
                        <h3>التاريخ</h3>
                        <p>22 - 24 جانفي 2026</p>
                    </div>

                    <div class="detail-item">
                        <i class="fas fa-map-marker-alt"></i>
                        <h3>المكان</h3>
                        <p>فندق ومركز مؤتمرات راديسون بلو تونس</p>
                    </div>

                    <div class="detail-item">
                        <i class="fas fa-users"></i>
                        <h3>المشاركون</h3>
                        <p>حكام وأندية الليونز العرب</p>
                    </div>
                </div>

                <div class="program-download" style="margin-top: 40px; text-align: center;">
                    <a href="{{ URL::asset('assets/frontend/kea-2026/documents/Kol Al Arab Tunisie 2026 - Programme.pdf') }}"
                        class="btn-program-download" download="برنامج المؤتمر 23 لحكام وأندية الليونز العرب.pdf">
                        <i class="fas fa-download" style="margin-left: 8px;"></i>
                        تحميل برنامج المؤتمر
                    </a>
                </div>

                {{-- <div class="countdown">
                    <div class="countdown-item">
                        <div class="countdown-value" id="days">000</div>
                        <div class="countdown-label">أيام</div>
                    </div>
                    <div class="countdown-item">
                        <div class="countdown-value" id="hours">00</div>
                        <div class="countdown-label">ساعات</div>
                    </div>
                    <div class="countdown-item">
                        <div class="countdown-value" id="minutes">00</div>
                        <div class="countdown-label">دقائق</div>
                    </div>
                    <div class="countdown-item">
                        <div class="countdown-value" id="seconds">00</div>
                        <div class="countdown-label">ثواني</div>
                    </div>
                </div> --}}
            </div>
        </div>
    </section>

    <!-- Registration Form Section -->
    <section class="registration-section">
        <div class="container">
            <div class="form-container">
                <div class="form-header" id="registrationForm">
                    <h2>التسجيل في المؤتمر</h2>
                    {{-- <p>يرجى ملء النموذج أدناه للتسجيل في المؤتمر 23 لحكام وأندية الليونز العرب</p> --}}
                </div>

                @if (session('success'))
                    <div class="alert alert-success">
                        تم تسجيل إشتراكك بنجاح!
                    </div>
                @endif

                <div class="form-body">
                    @if (!session('success'))
                        <form method="POST" action="{{ route('frontend.contact.post.' . app()->getLocale()) }}"
                            class="row contact-form-style-02 needs-validation" novalidate>
                            @csrf
                            <div class="form-row">
                                <div class="form-group">
                                    <label for="civility" class="required">اللقب Civility</label>
                                    <select id="civility" name="civility" class="form-control" required>
                                        <option value="">Select your civility</option>
                                        <option value="Mr" {{ old('civility') == 'Mr' ? 'selected' : '' }}>
                                            Mr</option>
                                        <option value="Mme" {{ old('civility') == 'Mme' ? 'selected' : '' }}>
                                            Mrs</option>
                                    </select>
                                    @error('civility')
                                        <div class="invalid-feedback d-block">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="form-group">
                                    <label for="membership" class="required">نوع العضوية Membership Type</label>
                                    <select id="membership" name="membership" class="form-control" required>
                                        <option value="">Select your membership type</option>
                                        <option value="PID">PID</option>
                                        <option value="AREA LEADER">AREA LEADER</option>
                                        <option value="PDG">PDG</option>
                                        <option value="DG">DG</option>
                                        <option value="1st Vice DG">1st Vice DG</option>
                                        <option value="2nd Vice DG">2nd Vice DG</option>
                                        <option value="PR">PR</option>
                                        <option value="PZ">PZ</option>
                                        <option value="CLUB PRESIDENT">CLUB PRESIDENT</option>
                                        <option value="CLUB SECRETARY">CLUB SECRETARY</option>
                                        <option value="MEMBER LION">MEMBER LION</option>
                                        <option value="NOT LION">NOT LION</option>
                                    </select>

                                    @error('membership')
                                        <div class="invalid-feedback d-block">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-row">
                                <div class="form-group">
                                    <label for="firstname" class="required">الاسم الشخصي First Name</label>
                                    <input type="text" id="firstname" name="firstname" class="form-control"
                                        value="{{ old('firstname') }}" required>
                                    @error('firstname')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="form-group">
                                    <label for="name" class="required">الاسم العائلي Last Name</label>
                                    <input type="text" id="name" name="name" class="form-control"
                                        value="{{ old('name') }}" required>
                                    @error('name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-row">
                                <div class="form-group">
                                    <label for="email" class="required">البريد الإلكتروني Email</label>
                                    <input type="email" id="email" name="email" class="form-control"
                                        value="{{ old('email') }}" required>
                                    @error('email')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="form-group">
                                    <label for="phone" class="required">رقم الهاتف Phone Number</label>
                                    <input type="tel" id="phone" name="phone" class="form-control"
                                        value="{{ old('phone') }}" required>
                                    @error('phone')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-row">
                                <div class="form-group">
                                    <label for="district" class="required">المنطقة District</label>
                                    <select id="district" name="district" class="form-control district-select" required>
                                        <option value="">Select your district</option>
                                        <option value="District 414 - Tunisie"
                                            {{ old('district') == 'District 414 - Tunisie' ? 'selected' : '' }}>
                                            District 414 - Tunisie
                                        </option>
                                        <option value="District 415 - Algérie"
                                            {{ old('district') == 'District 415 - Algérie' ? 'selected' : '' }}>
                                            District 415 - Algérie
                                        </option>
                                        <option value="District 352 - Égypte"
                                            {{ old('district') == 'District 352 - Égypte' ? 'selected' : '' }}>
                                            District 352 - Égypte
                                        </option>
                                        <option value="District 351 - Irak"
                                            {{ old('district') == 'District 351 - Irak' ? 'selected' : '' }}>
                                            District 351 - Irak
                                        </option>
                                        <option value="District 351 - Jordanie"
                                            {{ old('district') == 'District 351 - Jordanie' ? 'selected' : '' }}>
                                            District 351 - Jordanie
                                        </option>
                                        <option value="District 351 - Liban"
                                            {{ old('district') == 'District 351 - Liban' ? 'selected' : '' }}>
                                            District 351 - Liban
                                        </option>
                                        <option value="District 403 A1 - Mauritanie"
                                            {{ old('district') == 'District 403 A1 - Mauritanie' ? 'selected' : '' }}>
                                            District 403 A1 - Mauritanie
                                        </option>
                                        <option value="District 416 - Maroc"
                                            {{ old('district') == 'District 416 - Maroc' ? 'selected' : '' }}>
                                            District 416 - Maroc
                                        </option>
                                        <option value="District 351 - Palestine"
                                            {{ old('district') == 'District 351 - Palestine' ? 'selected' : '' }}>
                                            District 351 - Palestine
                                        </option>
                                        <option value="Autre" {{ old('district') == 'Autre' ? 'selected' : '' }}>
                                            Autre
                                        </option>
                                    </select>

                                    <!-- Champ caché pour le district personnalisé -->
                                    <div id="custom_district_container" style="display: none; margin-top: 10px;">
                                        <input type="text" id="custom_district" name="custom_district"
                                            class="form-control" placeholder="Veuillez spécifier votre district"
                                            value="{{ old('custom_district') }}">
                                    </div>

                                    @error('district')
                                        <div class="invalid-feedback d-block">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="form-group">
                                    <label for="club" class="required">النادي Club</label>

                                    <!-- Champ input pour les autres districts -->
                                    <input type="text" id="club_input" name="club" class="form-control"
                                        value="{{ old('club') }}" placeholder="Enter your club name">

                                    <!-- Champ select pour Tunisie -->
                                    <select id="club_select" name="club" class="form-control" style="display: none;">
                                        <option value="">Select your club</option>
                                        <option value="ARIANA LES LUMIERES"
                                            {{ old('club_select') == 'ARIANA LES LUMIERES' ? 'selected' : '' }}>
                                            ARIANA LES LUMIERES
                                        </option>
                                        <option value="BOUMHAL" {{ old('club_select') == 'BOUMHAL' ? 'selected' : '' }}>
                                            BOUMHAL
                                        </option>
                                        <option value="CARTHAGE REINE DIDON"
                                            {{ old('club_select') == 'CARTHAGE REINE DIDON' ? 'selected' : '' }}>
                                            CARTHAGE REINE DIDON
                                        </option>
                                        <option value="CARTHAGE SOPHONISBE"
                                            {{ old('club_select') == 'CARTHAGE SOPHONISBE' ? 'selected' : '' }}>
                                            CARTHAGE SOPHONISBE
                                        </option>
                                        <option value="CARTHANGE PHOENIX"
                                            {{ old('club_select') == 'CARTHANGE PHOENIX' ? 'selected' : '' }}>
                                            CARTHANGE PHOENIX
                                        </option>
                                        <option value="INSAT" {{ old('club_select') == 'INSAT' ? 'selected' : '' }}>
                                            INSAT
                                        </option>
                                        <option value="LA SOUKRA"
                                            {{ old('club_select') == 'LA SOUKRA' ? 'selected' : '' }}>
                                            LA SOUKRA
                                        </option>
                                        <option value="MARSA LES COLOMBES"
                                            {{ old('club_select') == 'MARSA LES COLOMBES' ? 'selected' : '' }}>
                                            MARSA LES COLOMBES
                                        </option>
                                        <option value="NABEUL BEST SIGHT"
                                            {{ old('club_select') == 'NABEUL BEST SIGHT' ? 'selected' : '' }}>
                                            NABEUL BEST SIGHT
                                        </option>
                                        <option value="NABEUL HAMMAMET"
                                            {{ old('club_select') == 'NABEUL HAMMAMET' ? 'selected' : '' }}>
                                            NABEUL HAMMAMET
                                        </option>
                                        <option value="SFAX LES OLIVIERS"
                                            {{ old('club_select') == 'SFAX LES OLIVIERS' ? 'selected' : '' }}>
                                            SFAX LES OLIVIERS
                                        </option>
                                        <option value="SFAX MEDITERRANEE"
                                            {{ old('club_select') == 'SFAX MEDITERRANEE' ? 'selected' : '' }}>
                                            SFAX MEDITERRANEE
                                        </option>
                                        <option value="SFAX SIDI MANSOUR"
                                            {{ old('club_select') == 'SFAX SIDI MANSOUR' ? 'selected' : '' }}>
                                            SFAX SIDI MANSOUR
                                        </option>
                                        <option value="SFAX THYNA"
                                            {{ old('club_select') == 'SFAX THYNA' ? 'selected' : '' }}>
                                            SFAX THYNA
                                        </option>
                                        <option value="SIRIUS ARIANA"
                                            {{ old('club_select') == 'SIRIUS ARIANA' ? 'selected' : '' }}>
                                            SIRIUS ARIANA
                                        </option>
                                        <option value="SOUKRA YESMINE"
                                            {{ old('club_select') == 'SOUKRA YESMINE' ? 'selected' : '' }}>
                                            SOUKRA YESMINE
                                        </option>
                                        <option value="SOUSSE EL KANTAOUI"
                                            {{ old('club_select') == 'SOUSSE EL KANTAOUI' ? 'selected' : '' }}>
                                            SOUSSE EL KANTAOUI
                                        </option>
                                        <option value="TANIT SOUKRA"
                                            {{ old('club_select') == 'TANIT SOUKRA' ? 'selected' : '' }}>
                                            TANIT SOUKRA
                                        </option>
                                        <option value="THYNA VISION"
                                            {{ old('club_select') == 'THYNA VISION' ? 'selected' : '' }}>
                                            THYNA VISION
                                        </option>
                                        <option value="TUNIS ALYSSA"
                                            {{ old('club_select') == 'TUNIS ALYSSA' ? 'selected' : '' }}>
                                            TUNIS ALYSSA
                                        </option>
                                        <option value="TUNIS DOYEN"
                                            {{ old('club_select') == 'TUNIS DOYEN' ? 'selected' : '' }}>
                                            TUNIS DOYEN
                                        </option>
                                        <option value="TUNIS EL MENZAH"
                                            {{ old('club_select') == 'TUNIS EL MENZAH' ? 'selected' : '' }}>
                                            TUNIS EL MENZAH
                                        </option>
                                        <option value="TUNIS ENNASR"
                                            {{ old('club_select') == 'TUNIS ENNASR' ? 'selected' : '' }}>
                                            TUNIS ENNASR
                                        </option>
                                        <option value="TUNIS ESPRIT"
                                            {{ old('club_select') == 'TUNIS ESPRIT' ? 'selected' : '' }}>
                                            TUNIS ESPRIT
                                        </option>
                                        <option value="TUNIS GOLFE"
                                            {{ old('club_select') == 'TUNIS GOLFE' ? 'selected' : '' }}>
                                            TUNIS GOLFE
                                        </option>
                                        <option value="TUNIS IHEC CARTHAGE"
                                            {{ old('club_select') == 'TUNIS IHEC CARTHAGE' ? 'selected' : '' }}>
                                            TUNIS IHEC CARTHAGE
                                        </option>
                                        <option value="TUNIS ISG"
                                            {{ old('club_select') == 'TUNIS ISG' ? 'selected' : '' }}>
                                            TUNIS ISG
                                        </option>
                                        <option value="TUNIS LA MARSA"
                                            {{ old('club_select') == 'TUNIS LA MARSA' ? 'selected' : '' }}>
                                            TUNIS LA MARSA
                                        </option>
                                        <option value="TUNIS LA RENAISSANCE"
                                            {{ old('club_select') == 'TUNIS LA RENAISSANCE' ? 'selected' : '' }}>
                                            TUNIS LA RENAISSANCE
                                        </option>
                                        <option value="TUNIS LE BELVEDERE"
                                            {{ old('club_select') == 'TUNIS LE BELVEDERE' ? 'selected' : '' }}>
                                            TUNIS LE BELVEDERE
                                        </option>
                                        <option value="TUNIS LE LAC"
                                            {{ old('club_select') == 'TUNIS LE LAC' ? 'selected' : '' }}>
                                            TUNIS LE LAC
                                        </option>
                                        <option value="TUNIS MARSA ATHENA"
                                            {{ old('club_select') == 'TUNIS MARSA ATHENA' ? 'selected' : '' }}>
                                            TUNIS MARSA ATHENA
                                        </option>
                                        <option value="TUNIS MEDINA"
                                            {{ old('club_select') == 'TUNIS MEDINA' ? 'selected' : '' }}>
                                            TUNIS MEDINA
                                        </option>
                                        <option value="TUNIS SIDI MEHREZ"
                                            {{ old('club_select') == 'TUNIS SIDI MEHREZ' ? 'selected' : '' }}>
                                            TUNIS SIDI MEHREZ
                                        </option>
                                        <option value="TUNIS SMU NATION"
                                            {{ old('club_select') == 'TUNIS SMU NATION' ? 'selected' : '' }}>
                                            TUNIS SMU NATION
                                        </option>
                                        <option value="TUNIS TUNARUZ"
                                            {{ old('club_select') == 'TUNIS TUNARUZ' ? 'selected' : '' }}>
                                            TUNIS TUNARUZ
                                        </option>
                                        <option value="TUNIS VIDARR"
                                            {{ old('club_select') == 'TUNIS VIDARR' ? 'selected' : '' }}>
                                            TUNIS VIDARR
                                        </option>
                                        <option value="TUNIS ZITOUNA"
                                            {{ old('club_select') == 'TUNIS ZITOUNA' ? 'selected' : '' }}>
                                            TUNIS ZITOUNA
                                        </option>
                                        <option value="ISCAE MANOUBA "
                                            {{ old('club_select') == 'ISCAE MANOUBA ' ? 'selected' : '' }}>
                                            ISCAE MANOUBA
                                        </option>
                                        <option value="BEST GENERATION OMEGA"
                                            {{ old('club_select') == 'BEST GENERATION OMEGA' ? 'selected' : '' }}>
                                            BEST GENERATION OMEGA
                                        </option>
                                    </select>

                                    <!-- Messages d'erreur dynamiques -->
                                    <div class="invalid-feedback" id="club_error" style="display: none;">
                                        <!-- Le message d'erreur sera inséré ici par JavaScript -->
                                    </div>

                                    <!-- Message d'erreur Laravel (pour les erreurs serveur) -->
                                    @error('club')
                                        <div class="invalid-feedback d-block">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-row">
                                <div class="form-group">
                                    <label for="country" class="required">البلد Country</label>
                                    <select id="country" name="country" class="country-select form-control" required>
                                        <option value="">Select your country</option>
                                        @foreach ($countries as $country)
                                            <option value="{{ $country }}"
                                                {{ old('country') == $country ? 'selected' : '' }}>
                                                {{ $country }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('country')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>

                                <div class="form-group">
                                    <label for="city" class="required" id="gouvernorat-label">الولاية/المحافظة
                                        Region/Governorate</label>
                                    <label class="required" id="region-label" style="display:none">Select your
                                        region/governorate</label>
                                    <input type="text" value="{{ old('city') }}" class="form-control"
                                        name="city" id="region" autocomplete="off" required>
                                    @error('city')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                </div>
                            </div>

                            <!-- قسم الأسعار والخدمات - سيتم إخفاؤه عند عدم اختيار البلد -->
                            <div id="pricing-services-section" style="display: none;">

                                <!-- الرسوم الإضافية -->
                                <div class="form-row">
                                    <div class="form-group">
                                        <fieldset class="registration-fees">
                                            {{-- <legend>رسوم التسجيل Registration Fees</legend> --}}

                                            <div class="fee-item">
                                                <input type="checkbox" id="fee_registration" name="fees[]"
                                                    value="registration" checked disabled>
                                                <label for="fee_registration">
                                                    <div class="fee-label-wrapper">
                                                        <span class="fee-label-ar">رسوم التسجيل</span>
                                                        <span class="fee-label-en">Registration Fee</span>
                                                    </div>
                                                    <span class="fee-price" id="price_registration"></span>
                                                </label>
                                                <input type="hidden" name="fees[]" value="registration">
                                            </div>

                                            <div class="fee-item">
                                                <input type="checkbox" id="fee_cocktail" name="fees[]" value="cocktail"
                                                    {{ in_array('cocktail', old('fees', [])) ? 'checked' : '' }}>
                                                <label for="fee_cocktail">
                                                    <div class="fee-label-wrapper">
                                                        <span class="fee-label-ar">كوكبيل الترحيب</span>
                                                        <span class="fee-label-en">Welcome Cocktail</span>
                                                    </div>
                                                    <span class="fee-price" id="price_cocktail"></span>
                                                </label>
                                            </div>

                                            <div class="fee-item">
                                                <input type="checkbox" id="fee_lunch_friday" name="fees[]"
                                                    value="lunch_friday"
                                                    {{ in_array('lunch_friday', old('fees', [])) ? 'checked' : '' }}>
                                                <label for="fee_lunch_friday">
                                                    <div class="fee-label-wrapper">
                                                        <span class="fee-label-ar">غداء الجمعة</span>
                                                        <span class="fee-label-en">Friday Lunch</span>
                                                    </div>
                                                    <span class="fee-price" id="price_lunch_friday"></span>
                                                </label>
                                            </div>

                                            <div class="fee-item">
                                                <input type="checkbox" id="fee_dinner_friday" name="fees[]"
                                                    value="dinner_friday"
                                                    {{ in_array('dinner_friday', old('fees', [])) ? 'checked' : '' }}>
                                                <label for="fee_dinner_friday">
                                                    <div class="fee-label-wrapper">
                                                        <span class="fee-label-ar">عشاء الجمعة</span>
                                                        <span class="fee-label-en">Friday Dinner</span>
                                                    </div>
                                                    <span class="fee-price" id="price_dinner_friday"></span>
                                                </label>
                                            </div>

                                            <div class="fee-item">
                                                <input type="checkbox" id="fee_lunch_saturday" name="fees[]"
                                                    value="lunch_saturday"
                                                    {{ in_array('lunch_saturday', old('fees', [])) ? 'checked' : '' }}>
                                                <label for="fee_lunch_saturday">
                                                    <div class="fee-label-wrapper">
                                                        <span class="fee-label-ar">غداء السبت</span>
                                                        <span class="fee-label-en">Saturday Lunch</span>
                                                    </div>
                                                    <span class="fee-price" id="price_lunch_saturday"></span>
                                                </label>
                                            </div>

                                            <div class="fee-item">
                                                <input type="checkbox" id="fee_charity_gala" name="fees[]"
                                                    value="charity_gala"
                                                    {{ in_array('charity_gala', old('fees', [])) ? 'checked' : '' }}>
                                                <label for="fee_charity_gala">
                                                    <div class="fee-label-wrapper">
                                                        <span class="fee-label-ar">السهرة الخيرية</span>
                                                        <span class="fee-label-en">Charity Gala</span>
                                                    </div>
                                                    <span class="fee-price" id="price_charity_gala"></span>
                                                </label>
                                            </div>
                                        </fieldset>
                                    </div>
                                </div>

                                <!-- حجز الإقامة -->
                                <div class="form-row">
                                    <div class="form-group">

                                        <div class="hotel-option">
                                            <input type="checkbox" id="hotel_accommodation" name="hotel_accommodation"
                                                value="1" {{ old('hotel_accommodation') == '1' ? 'checked' : '' }}>
                                            <label for="hotel_accommodation">
                                                <div class="hotel-label-content">
                                                    <span class="form-label-ar hotel-title">الإقامة في فندق راديسون بلو
                                                        تونس</span>
                                                    <span class="form-label-en hotel-title">Accommodation at Radisson Blu
                                                        Tunis</span>
                                                    <span class="form-label-ar hotel-subtitle">أرغب في حجز الإقامة
                                                        بالفندق</span>
                                                    <span class="form-label-en hotel-subtitle">I wish to book hotel
                                                        accommodation</span>
                                                </div>
                                                <span class="fee-price hotel-price" id="price_hotel">135 € لكل ليلة</span>
                                            </label>
                                        </div>

                                        <div class="hotel-dates"
                                            style="display: {{ old('hotel_accommodation') == '1' ? 'block' : 'none' }};">
                                            <div class="form-row">
                                                <div class="form-group">
                                                    <label for="checkin_date" class="required">
                                                        <span class="form-label-ar">تاريخ الوصول</span>
                                                        <span class="form-label-en">Check-in Date</span>
                                                    </label>
                                                    <input type="date" id="checkin_date" name="checkin_date"
                                                        class="form-control" min="2026-01-19" max="2026-01-28"
                                                        value="{{ old('checkin_date') }}">
                                                </div>

                                                <div class="form-group">
                                                    <label for="checkout_date" class="required">
                                                        <span class="form-label-ar">تاريخ المغادرة</span>
                                                        <span class="form-label-en">Check-out Date</span>
                                                    </label>
                                                    <input type="date" id="checkout_date" name="checkout_date"
                                                        class="form-control" min="2026-01-20" max="2026-01-29"
                                                        value="{{ old('checkout_date') }}">
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label for="hotel_nights" class="required">
                                                    <span class="form-label-ar">عدد الليالي</span>
                                                    <span class="form-label-en">Number of Nights</span>
                                                </label>
                                                <input type="number" id="hotel_nights" name="hotel_nights"
                                                    class="form-control" min="1" max="3" readonly
                                                    value="{{ old('hotel_nights') }}">
                                            </div>

                                            <!-- سعر الإقامة الإجمالي -->
                                            <div class="hotel-total-price">
                                                <span class="form-label-ar">سعر الإقامة الإجمالي</span>
                                                <span class="form-label-en">Total Accommodation Price</span>
                                                <span id="hotel_total_price" class="hotel-total-amount">0 €</span>
                                                <input type="hidden" name="hotel_total_amount"
                                                    id="hotel_total_amount_hidden" value="0">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- خدمة النقل -->
                                <div class="form-row">
                                    <div class="form-group">
                                        <label for="hotel_accommodation">
                                            <span class="form-label-ar">خدمة النقل من المطار</span>
                                            <span class="form-label-en">Airport Transfer Service</span>
                                        </label>

                                        <fieldset class="transfer-service">
                                            {{-- <legend>
                                                <span class="form-label-ar">خدمة النقل من المطار</span>
                                                <span class="form-label-en">Airport Transfer Service</span>
                                            </legend> --}}

                                            <div class="transfer-option">
                                                <input type="radio" id="transfer_none" name="airport_transfer"
                                                    value="none"
                                                    {{ old('airport_transfer', 'none') == 'none' ? 'checked' : '' }}>
                                                <label for="transfer_none">
                                                    <div class="transfer-label-wrapper">
                                                        <span class="transfer-label-ar">لا أرغب في خدمة النقل</span>
                                                        <span class="transfer-label-en">No transfer required</span>
                                                    </div>
                                                    <span class="option-price" id="price_transfer_none">0 €</span>
                                                </label>
                                            </div>

                                            <div class="transfer-option">
                                                <input type="radio" id="transfer_arrival" name="airport_transfer"
                                                    value="arrival"
                                                    {{ old('airport_transfer') == 'arrival' ? 'checked' : '' }}>
                                                <label for="transfer_arrival">
                                                    <div class="transfer-label-wrapper">
                                                        <span class="transfer-label-ar">نقل من المطار إلى الفندق فقط</span>
                                                        <span class="transfer-label-en">Airport to Hotel only</span>
                                                    </div>
                                                    <span class="option-price" id="price_transfer_arrival">15 €</span>
                                                </label>
                                            </div>

                                            <div class="transfer-option">
                                                <input type="radio" id="transfer_departure" name="airport_transfer"
                                                    value="departure"
                                                    {{ old('airport_transfer') == 'departure' ? 'checked' : '' }}>
                                                <label for="transfer_departure">
                                                    <div class="transfer-label-wrapper">
                                                        <span class="transfer-label-ar">نقل من الفندق إلى المطار فقط</span>
                                                        <span class="transfer-label-en">Hotel to Airport only</span>
                                                    </div>
                                                    <span class="option-price" id="price_transfer_departure">15 €</span>
                                                </label>
                                            </div>

                                            <div class="transfer-option">
                                                <input type="radio" id="transfer_both" name="airport_transfer"
                                                    value="both"
                                                    {{ old('airport_transfer') == 'both' ? 'checked' : '' }}>
                                                <label for="transfer_both">
                                                    <div class="transfer-label-wrapper">
                                                        <span class="transfer-label-ar">نقل ذهاب وعودة</span>
                                                        <span class="transfer-label-en">Round-trip transfer</span>
                                                    </div>
                                                    <span class="option-price" id="price_transfer_both">30 €</span>
                                                </label>
                                            </div>
                                        </fieldset>
                                    </div>
                                </div>

                                <!-- المبلغ الإجمالي -->
                                <div class="form-row">
                                    <div class="form-group total-amount-section">
                                        <h4>
                                            <span class="form-label-ar">المبلغ الإجمالي للتسجيل</span>
                                            <span class="form-label-en">Total Registration Amount</span>
                                        </h4>
                                        <div class="total-amount-display">
                                            <span id="total_amount_display" class="total-amount">--</span>
                                        </div>
                                        <input type="hidden" id="total_amount_value" name="total_amount_value"
                                            value="">
                                        <input type="hidden" id="total_currency" name="total_currency" value="">
                                    </div>
                                </div>


                                <!-- قسم طريقة الدفع -->
                                <!-- قسم طريقة الدفع - نسخة معدلة -->
                                <div class="form-row">
                                    <div class="form-group">
                                        <label for="hotel_accommodation">
                                            <span class="form-label-ar">طريقة الدفع</span>
                                            <span class="form-label-en">Payment Method</span>
                                        </label>

                                        <fieldset class="payment-method-section">
                                            {{-- <legend>
                                                <span class="form-label-ar">طريقة الدفع</span>
                                                <span class="form-label-en">Payment Method</span>
                                            </legend> --}}

                                            <div class="payment-option">
                                                <input type="radio" id="payment_bank" name="payment_method"
                                                    value="Virement bancaire"
                                                    {{ old('payment_method') == 'Virement bancaire' ? 'checked' : '' }}
                                                    required>
                                                <label for="payment_bank">
                                                    <div class="payment-label-wrapper">
                                                        <span class="payment-label-ar">تحويل بنكي</span>
                                                        <span class="payment-label-en">Bank Transfer</span>
                                                        <div class="payment-details">
                                                            <span class="form-label-ar">سيتم إرسال معلومات الحساب البنكي
                                                                بعد التسجيل</span>
                                                            <span class="form-label-en">Bank account details will be sent
                                                                after registration</span>
                                                        </div>
                                                    </div>
                                                </label>
                                            </div>

                                            <div class="payment-option">
                                                <input type="radio" id="payment_other" name="payment_method"
                                                    value="Autre" {{ old('payment_method') == 'Autre' ? 'checked' : '' }}
                                                    required>
                                                <label for="payment_other">
                                                    <div class="payment-label-wrapper">
                                                        <span class="payment-label-ar">طريقة أخرى</span>
                                                        <span class="payment-label-en">Other Method</span>
                                                        <div class="payment-details">
                                                            <span class="form-label-ar">سيتم التواصل معك لتحديد طريقة الدفع
                                                                المناسبة</span>
                                                            <span class="form-label-en">We will contact you to arrange
                                                                suitable payment method</span>
                                                        </div>
                                                    </div>
                                                </label>
                                            </div>

                                            @error('payment_method')
                                                <div class="invalid-feedback">{{ $message }}</div>
                                            @enderror
                                        </fieldset>
                                    </div>
                                </div>

                            </div>

                            <div class="form-submit">
                                <button type="submit" class="btn-submit">التسجيل</button>
                            </div>
                        </form>
                    @endif
                </div>
            </div>
        </div>
    </section>

    <!-- Main Content -->
    {{-- <section class="main-content">
        <div class="container">
        </div>
    </section> --}}

    <!-- Footer -->
    <footer>
        <div class="container">
            <div class="footer-content" style="display: none;">
                <div class="footer-section">
                    <h3>معلومات الاتصال</h3>
                    <ul class="contact-info">
                        <li><i class="fas fa-phone"></i> +216 12 345 678</li>
                        <li><i class="fas fa-envelope"></i> info@lionsconference.tn</li>
                        <li><i class="fas fa-map-marker-alt"></i> فندق ومركز مؤتمرات راديسون بلو تونس</li>
                        <li><i class="fas fa-globe"></i> www.lionsconference2026.tn</li>
                    </ul>
                </div>
                <div class="footer-section">
                    <h3>وسم المؤتمر</h3>
                    <ul class="contact-info">
                        <li><i class="fas fa-hashtag"></i> #مؤتمر_الليونز_العرب_23</li>
                        <li><i class="fas fa-hashtag"></i> #سند_لأطفال_السرطان</li>
                        <li><i class="fas fa-hashtag"></i> #LionsArabConference23</li>
                        <li><i class="fas fa-hashtag"></i> #SupportChildCancer</li>
                    </ul>
                    <div style="margin-top: 20px;">
                        <h4>تابعنا على</h4>
                        <div style="display: flex; justify-content: flex-end; gap: 15px; margin-top: 10px;">
                            <a href="#" style="color: var(--secondary-color); font-size: 1.5rem;"><i
                                    class="fab fa-facebook"></i></a>
                            <a href="#" style="color: var(--secondary-color); font-size: 1.5rem;"><i
                                    class="fab fa-twitter"></i></a>
                            <a href="#" style="color: var(--secondary-color); font-size: 1.5rem;"><i
                                    class="fab fa-instagram"></i></a>
                            <a href="#" style="color: var(--secondary-color); font-size: 1.5rem;"><i
                                    class="fab fa-youtube"></i></a>
                        </div>
                    </div>
                </div>
                <div class="footer-section">
                    <h3>تنظيم المؤتمر</h3>
                    <p>تحت إشراف الاتحاد العربي لأندية الليونز وبالتعاون مع وزارة الصحة التونسية والعديد من المؤسسات الخيرية
                        الداعمة.</p>
                    <div
                        style="margin-top: 15px; padding: 10px; background-color: rgba(237, 189, 0, 0.1); border-radius: 5px;">
                        <p style="font-size: 0.9rem; color: #ddd;">"نخدم المجتمع منذ 1917" - شعار نادي الليونز الدولي</p>
                    </div>
                </div>
            </div>
            <div class="copyright">
                <p>جميع الحقوق محفوظة &copy; المؤتمر 23 لحكام وأندية الليونز العرب 2026</p>
            </div>
        </div>
    </footer>
@endsection

@section('css')
@endsection

@section('scripts')
@endsection