@php($profileOptions = $profileOptions ?? config('profile_options'))
@php(
    $optionMap = [
        // أساسي
        'marital_status' => 'marital_statuses',
        'religiosity' => 'religiosity_levels',
        'want_children' => 'want_children_options',
        'family_values' => 'family_values_options',
        'occupation_sector' => 'occupation_sectors',
        'housing_type' => 'housing_types',
        'income' => null, // حقل نصي/قيمة مباشرة

        // نمط الحياة
        'lifestyle' => 'lifestyles',
        'smoking' => 'smoking_habits',
        'drinking' => 'drinking_habits',
        'travel' => 'travel_options',
        'music' => 'music_options',

        // الدين
        'religion' => 'religions',
        'pray_frequency' => 'pray_frequency_options',
        'read_quran' => 'read_quran_options',
        'halal_food' => 'halal_food_options',

        // المظهر
        'skin_color' => 'skin_colors',
        'eye_color' => 'eye_colors',
        'hair_color' => 'hair_colors',
        'beard' => 'beard_styles',
        'body_type' => 'body_type_options',
        'ethnicity' => 'ethnicities',

        // الصحة
        'health_status' => 'health_status_options',
    ]
)
@php($groups = [
  'أساسي' => [ 'marital_status'=>'الحالة الاجتماعية','religiosity'=>'التدين','want_children'=>'الرغبة بالأطفال','family_values'=>'قيم العائلة','occupation_sector'=>'قطاع العمل','housing_type'=>'السكن','income'=>'الدخل'],
  'نمط الحياة' => [ 'lifestyle'=>'نمط الحياة','smoking'=>'التدخين','drinking'=>'الشرب','travel'=>'السفر','hobbies'=>'الهوايات','music'=>'الموسيقى' ],
  'الدين' => [ 'religion'=>'الدين','pray_frequency'=>'الصلاة','read_quran'=>'قراءة القرآن','halal_food'=>'طعام حلال' ],
  'المظهر' => [ 'skin_color'=>'لون البشرة','eye_color'=>'لون العين','hair_color'=>'لون الشعر','beard'=>'اللحية','body_type'=>'نمط الجسم','ethnicity'=>'العِرق' ],
  'الصحة' => [ 'health_status'=>'الحالة الصحية' ]
])
<div class="space-y-4" x-data="{open: 'أساسي'}">
  @foreach($groups as $groupTitle => $fields)
    <div class="border border-gray-200 dark:border-gray-700 rounded-xl overflow-hidden">
      <button type="button" @click="open = open === '{{ $groupTitle }}' ? null : '{{ $groupTitle }}'" class="w-full flex items-center justify-between px-4 py-2 bg-gray-50 dark:bg-gray-800/60 hover:bg-gray-100 dark:hover:bg-gray-700 text-sm font-semibold">
        <span>{{ $groupTitle }}</span>
        <svg class="w-4 h-4 transition-transform" :class="{'rotate-180': open==='{{ $groupTitle }}'}" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 10.94l3.71-3.71a.75.75 0 111.06 1.06l-4.24 4.24a.75.75 0 01-1.06 0L5.21 8.29a.75.75 0 01.02-1.08z" clip-rule="evenodd"/></svg>
      </button>
  <div x-show="open==='{{ $groupTitle }}'" x-transition.opacity x-transition.duration.200ms class="p-4 grid md:grid-cols-3 gap-4 bg-white dark:bg-gray-800/30">
        @foreach($fields as $field=>$label)
          <div>
            <label class="block mb-1 text-xs font-medium text-gray-600 dark:text-gray-300">{{ $label }}</label>
            @php($optKey = $optionMap[$field] ?? null)
            @php($options = $optKey ? ($profileOptions[$optKey] ?? []) : [])
            @if(!empty($options))
              <select name="{{ $field }}" class="w-full border rounded-md p-2 text-sm bg-white dark:bg-gray-900/60 focus:ring-brand-primary focus:border-brand-primary">
                <option value="">—</option>
                @foreach($options as $k=>$v)
                  <option value="{{ $k }}" @selected(request($field)===(string)$k)>{{ $v }}</option>
                @endforeach
              </select>
            @else
              @if($field==='hobbies')
                <input type="text" name="hobbies" value="{{ request('hobbies') }}" class="w-full border rounded-md p-2 text-sm bg-white dark:bg-gray-900/60 focus:ring-brand-primary focus:border-brand-primary" placeholder="اكتب هواية (مثال: سباحة)" />
              @elseif($field==='income')
                <input type="text" name="income" value="{{ request('income') }}" class="w-full border rounded-md p-2 text-sm bg-white dark:bg-gray-900/60 focus:ring-brand-primary focus:border-brand-primary" placeholder="—" />
              @else
                <input type="text" name="{{ $field }}" value="{{ request($field) }}" class="w-full border rounded-md p-2 text-sm bg-white dark:bg-gray-900/60 focus:ring-brand-primary focus:border-brand-primary" placeholder="—" />
              @endif
            @endif
          </div>
        @endforeach
      </div>
    </div>
  @endforeach
</div>