@php
  $is = fn($pattern) => request()->routeIs($pattern);

  $seo = \App\Models\SeoSetting::current();
  $brandIcon = !empty($seo?->favicon)
      ? asset($seo->favicon)
      : asset('hisabseba-favicon.png');

  $brandName = $seo->site_name ?? __('user_sidebar.brand_name');

  $hrOpen = request()->routeIs('user.hr.*');

  $attendanceActive = request()->routeIs(
      'user.hr.attendance.index',
      'user.hr.attendance.daily',
      'user.hr.attendance.bulk-monthly',
      'user.hr.attendance.bulk-daily-roz'
  );

  $attendanceSheetActive = request()->routeIs('user.hr.attendance.sheet.*');

  $bonusIndexActive = request()->routeIs(
      'user.hr.bonuses.index',
      'user.hr.bonuses.create',
      'user.hr.bonuses.store',
      'user.hr.bonuses.show',
      'user.hr.bonuses.edit',
      'user.hr.bonuses.update',
      'user.hr.bonuses.pay-form',
      'user.hr.bonuses.pay',
      'user.hr.bonuses.destroy'
  );

  $bonusReportActive = request()->routeIs('user.hr.bonuses.report');
@endphp

{{-- Brand --}}
<div class="sticky top-0 z-20 border-b border-slate-200 bg-gradient-to-b from-white to-slate-50 p-5">
  <a href="{{ route('user.dashboard') }}" class="flex items-center gap-3">
    <div class="flex h-11 w-11 shrink-0 items-center justify-center overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm">
      <img src="{{ $brandIcon }}"
           alt="{{ $brandName }}"
           class="h-9 w-9 object-contain">
    </div>

    <div class="min-w-0 leading-tight">
      <div class="truncate text-lg font-extrabold text-slate-900">{{ $brandName }}</div>
      <div class="-mt-0.5 text-[11px] text-slate-500">{{ __('user_sidebar.user_panel') }}</div>
    </div>
  </a>
</div>

{{-- Nav --}}
<nav class="flex-1 space-y-1 overflow-y-auto p-4 text-sm">

  <a href="{{ route('user.dashboard') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.dashboard') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>🏠</span>
    <span>{{ __('user_sidebar.dashboard') }}</span>
  </a>

  <div class="mt-2 border-t border-slate-100 pt-2"></div>

  <a href="{{ route('user.customers.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.customers.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>🧾</span>
    <span>{{ __('user_sidebar.customers') }}</span>
  </a>

  <a href="{{ route('user.suppliers.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.suppliers.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>📦</span>
    <span>{{ __('user_sidebar.suppliers') }}</span>
  </a>

  <div class="mt-3 px-4 text-[11px] font-extrabold tracking-wide text-slate-500">{{ __('user_sidebar.accounts_section') }}</div>

  <a href="{{ route('user.accounts.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.accounts.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>💳</span>
    <span>{{ __('user_sidebar.accounts') }}</span>
  </a>

  <a href="{{ route('user.account_transfers.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.account_transfers.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>🔁</span>
    <span>{{ __('user_sidebar.account_transfers') }}</span>
  </a>

  <div class="mt-3 px-4 text-[11px] font-extrabold tracking-wide text-slate-500">{{ __('user_sidebar.expenses_section') }}</div>

  <a href="{{ route('user.expenses.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.expenses.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>💸</span>
    <span>{{ __('user_sidebar.expenses') }}</span>
  </a>

  <a href="{{ route('user.expense_categories.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.expense_categories.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>🏷️</span>
    <span>{{ __('user_sidebar.expense_categories') }}</span>
  </a>

  <a href="{{ route('user.reports.general-ledger') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.reports.general-ledger') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>📒</span>
    <span>{{ __('user_sidebar.general_ledger') }}</span>
  </a>

  <a href="{{ route('user.reports.profit-loss') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.reports.profit-loss') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>📈</span>
    <span>{{ __('user_sidebar.profit_loss') }}</span>
  </a>

  <a href="{{ route('user.reports.balance-sheet') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.reports.balance-sheet') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>🧾</span>
    <span>{{ __('user_sidebar.balance_sheet') }}</span>
  </a>

  <a href="{{ route('user.loans.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.loans.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>🏦</span>
    <span>{{ __('user_sidebar.loans') }}</span>
  </a>

  <a href="{{ route('user.reports.loan-general-ledger') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.reports.loan-general-ledger') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>📘</span>
    <span>{{ __('user_sidebar.loan_gl') }}</span>
  </a>

  <a href="{{ route('user.owner_transactions.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.owner_transactions.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>👑</span>
    <span>{{ __('user_sidebar.owner_transactions') }}</span>
  </a>

  {{-- HR & Payroll --}}
  <div class="mt-3 px-4 text-[11px] font-extrabold tracking-wide text-slate-500">{{ __('user_sidebar.hr_payroll') }}</div>

  <details class="group" {{ $hrOpen ? 'open' : '' }}>
    <summary class="flex cursor-pointer list-none items-center justify-between rounded-2xl px-4 py-2.5 text-slate-700 transition hover:bg-slate-100 {{ $hrOpen ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : '' }}">
      <div class="flex items-center gap-3">
        <span>👨‍💼</span>
        <span>{{ __('user_sidebar.hr_payroll') }}</span>
      </div>
      <span class="text-xs transition group-open:rotate-180">⌄</span>
    </summary>

    <div class="mt-2 ml-3 space-y-1 border-l border-slate-200 pl-3">

      <a href="{{ route('user.hr.dashboard') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.dashboard') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.hr_dashboard') }}
      </a>

      <a href="{{ route('user.hr.attendance.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ $attendanceActive ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.attendance') }}
      </a>

      <a href="{{ route('user.hr.attendance.sheet.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ $attendanceSheetActive ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.attendance_sheet') }}
      </a>

      <a href="{{ route('user.hr.advances.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.advances.*') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.employee_advances') }}
      </a>

      <a href="{{ route('user.hr.bonuses.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ $bonusIndexActive ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.employee_bonus') }}
      </a>

      <a href="{{ route('user.hr.bonuses.report') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ $bonusReportActive ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.bonus_report') }}
      </a>

      <a href="{{ route('user.hr.reports.advances') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.reports.advances') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.advance_report') }}
      </a>

      <a href="{{ route('user.hr.employees.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.employees.*') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.employees') }}
      </a>

      <a href="{{ route('user.hr.salary.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.salary.*') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.salary_setup') }}
      </a>

      <a href="{{ route('user.hr.ledger.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.ledger.*') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.employee_ledger') }}
      </a>

      <a href="{{ route('user.hr.payrolls.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.payrolls.*') || request()->routeIs('user.hr.payroll-payments.*') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.payroll') }}
      </a>

      <a href="{{ route('user.hr.reports.payroll-summary') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.reports.payroll-summary') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.payroll_summary') }}
      </a>

      <div class="mt-2 px-3 text-[11px] font-bold uppercase tracking-wide text-slate-400">
        {{ __('user_sidebar.setup') }}
      </div>

      <a href="{{ route('user.hr.designations.index') }}"
         class="flex items-center rounded-xl px-3 py-2 text-sm font-medium transition
                {{ request()->routeIs('user.hr.designations.*') ? 'bg-slate-900 text-white' : 'text-slate-700 hover:bg-slate-100' }}">
        {{ __('user_sidebar.designations') }}
      </a>

    </div>
  </details>

  <div class="mt-3 px-4 text-[11px] font-extrabold tracking-wide text-slate-500">{{ __('user_sidebar.billing') }}</div>

  <a href="{{ route('user.subscriptions.index') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-2.5 transition hover:bg-slate-100
            {{ $is('user.subscriptions.*') ? 'bg-slate-100 font-semibold text-slate-900 shadow-sm' : 'text-slate-700' }}">
    <span>⭐</span>
    <span>{{ __('user_sidebar.subscription') }}</span>
  </a>

  <a href="{{ route('user.subscriptions.history') }}"
     class="flex items-center gap-3 rounded-2xl px-4 py-3 text-sm font-medium transition
            {{ request()->routeIs('user.subscriptions.history') ? 'bg-blue-600 text-white shadow-lg' : 'text-slate-700 hover:bg-slate-100' }}">
    <span class="text-base">📜</span>
    <span>{{ __('user_sidebar.subscription_history') }}</span>
  </a>

</nav>