@extends('layouts.app')

@section('header', 'Commission Rules')

@section('content')
    <div class="mb-3">
        <a href="{{ route('admin.commission-rules.create') }}" class="btn btn-primary btn-sm">Add Rule</a>
    </div>

    <div class="card shadow-sm">
        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0">
                <thead class="table-light">
                    <tr>
                        <th>Scope</th>
                        <th>Percentage</th>
                        <th>Effective From</th>
                        <th>Effective To</th>
                        <th>Status</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($rules as $rule)
                        <tr>
                            <td class="fw-medium">{{ $rule->category->name ?? 'Global default' }}</td>
                            <td>{{ number_format($rule->percentage, 2) }}%</td>
                            <td>{{ $rule->effective_from->toDateString() }}</td>
                            <td>{{ $rule->effective_to?->toDateString() ?? '—' }}</td>
                            <td>
                                <span class="badge {{ $rule->is_active ? 'text-bg-success' : 'text-bg-light' }}">{{ $rule->is_active ? 'Active' : 'Inactive' }}</span>
                            </td>
                            <td class="text-end">
                                <a href="{{ route('admin.commission-rules.edit', $rule) }}" class="btn btn-sm btn-link">Edit</a>
                                <form method="POST" action="{{ route('admin.commission-rules.destroy', $rule) }}" class="d-inline" onsubmit="return confirm('Delete this rule?')">
                                    @csrf @method('DELETE')
                                    <button class="btn btn-sm btn-link text-danger">Delete</button>
                                </form>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
@endsection