@extends('layouts.app')

@section('title', 'Income Tax Settings')
@section('heading', 'Income Tax Settings')

@section('content')
    <div class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
        <p class="text-slate-600">Manage income tax plans and tax slabs (e.g. Old Regime / New Regime).</p>
        <a href="{{ route('superadmin.income-tax-plans.create') }}" class="inline-flex rounded-lg bg-primary px-4 py-2 text-sm font-medium text-white"><i class="bi bi-plus-lg me-1"></i>Add plan</a>
    </div>

    <x-card>
        <div class="overflow-x-auto">
            <x-table>
                <x-slot name="head">
                    <tr>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Plan name</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Plan code</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Standard deduction</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Effective</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Slabs</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Status</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Actions</th>
                    </tr>
                </x-slot>
                @forelse($plans as $plan)
                    <tr class="hover:bg-slate-50">
                        <td class="whitespace-nowrap px-4 py-3 font-medium text-slate-900">{{ $plan->plan_name }}</td>
                        <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-600">{{ $plan->plan_code }}</td>
                        <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-600">{{ number_format($plan->standard_deduction, 2) }}</td>
                        <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-600">
                            {{ $plan->effective_from?->format('d M Y') ?? '—' }} – {{ $plan->effective_to?->format('d M Y') ?? '—' }}
                        </td>
                        <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-600">{{ $plan->tax_slabs_count ?? 0 }}</td>
                        <td class="whitespace-nowrap px-4 py-3">
                            <x-badge :status="$plan->is_active ? 'active' : 'inactive'">{{ $plan->is_active ? 'Active' : 'Inactive' }}</x-badge>
                        </td>
                        <td class="whitespace-nowrap px-4 py-3">
                            <a href="{{ route('superadmin.income-tax-plans.edit', $plan) }}" class="btn-icon-action btn-icon-action--edit" title="Edit" aria-label="Edit"><i class="bi bi-pencil-square"></i></a>
                            <form action="{{ route('superadmin.income-tax-plans.destroy', $plan) }}" method="post" class="inline ml-2" onsubmit="return confirm('Delete this plan?');">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn-icon-action btn-icon-action--delete" title="Delete" aria-label="Delete"><i class="bi bi-trash3"></i></button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="7" class="px-4 py-8 text-center text-sm text-slate-500">No income tax plans. <a href="{{ route('superadmin.income-tax-plans.create') }}" class="text-primary underline">Add one</a>.</td>
                    </tr>
                @endforelse
            </x-table>
        </div>
    </x-card>

    <p class="mt-4 text-sm text-slate-500">
        <a href="{{ route('superadmin.deduction-sections.index') }}" class="font-medium text-primary hover:underline">Deduction sections</a> (e.g. 80C, 80D) are managed separately.
    </p>
@endsection
