@php
  $mods = config('profile.notification_modules', []);
@endphp
<div class="dp">
  <p class="font-bold text-slate-900 mb-1"><i class="fa-solid fa-bell text-blue-600 mr-2"></i>Notification preferences</p>
  <p class="text-slate-500 text-[12px] mb-3">Choose how you want to be notified by module. Critical operational alerts may still appear in-app.</p>
  @if(!$globalEmailAlerts)
    <p class="text-amber-800 text-[12px] mb-3 p-3 rounded-lg bg-amber-50 border border-amber-100">Email notifications are disabled at system level.</p>
  @endif
  @if(!$globalSmsAlerts)
    <p class="text-slate-500 text-[11px] mb-3">SMS notifications require provider configuration by an administrator.</p>
  @endif
  <form action="{{ route('profile.notifications.update') }}" method="post">@csrf @method('PUT')
    <div class="overflow-x-auto border border-slate-100 rounded-xl">
      <table class="min-w-[640px]">
        <thead>
          <tr class="border-b border-slate-100 bg-slate-50">
            <th class="th text-left">Module</th>
            <th class="th text-center">In-app</th>
            <th class="th text-center">Email</th>
            <th class="th text-center">SMS</th>
          </tr>
        </thead>
        <tbody>
          @foreach($mods as $key => $label)
            @php
              $pref = $notificationPrefs->get($key);
              $inApp = old("np.$key.in_app", $pref?->in_app ?? true);
              $em = old("np.$key.email", $pref?->email ?? false);
              $sms = old("np.$key.sms", $pref?->sms ?? false);
            @endphp
            <tr class="border-b border-slate-50 last:border-0">
              <td class="td font-medium text-slate-800">{{ $label }}</td>
              <td class="td text-center">
                <input type="hidden" name="np[{{ $key }}][in_app]" value="0">
                <input type="checkbox" name="np[{{ $key }}][in_app]" value="1" class="rounded" @checked($inApp)>
              </td>
              <td class="td text-center">
                <input type="hidden" name="np[{{ $key }}][email]" value="0">
                <input type="checkbox" name="np[{{ $key }}][email]" value="1" class="rounded {{ !$globalEmailAlerts ? 'opacity-40 pointer-events-none' : '' }}" @checked($em)>
              </td>
              <td class="td text-center">
                <input type="hidden" name="np[{{ $key }}][sms]" value="0">
                <input type="checkbox" name="np[{{ $key }}][sms]" value="1" class="rounded {{ !$globalSmsAlerts ? 'opacity-40 pointer-events-none' : '' }}" @checked($sms)>
              </td>
            </tr>
          @endforeach
        </tbody>
      </table>
    </div>
    <p class="text-[11px] text-slate-500 mt-3">Critical alerts may still be shown even if some notification types are disabled.</p>
    <button type="submit" class="bp mt-4"><i class="fa-solid fa-check mr-2"></i>Save notification preferences</button>
  </form>
</div>