@extends('layouts.admin')

@section('title', setting('school_name', 'ShulePoint') . ' | Payment Methods')
@section('page-title', 'Payment Methods')

@section('content')
<div class="card card-outline card-primary shadow-sm">
    <div class="card-header">
        <h3 class="card-title"><i class="fas fa-wallet mr-1"></i> Payment Methods</h3>
    </div>
    <div class="card-body table-responsive p-0">
        <table class="table learner-table table-hover text-nowrap mb-0">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Code</th>
                    <th>Status</th>
                    <th class="text-right">Actions</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($methods as $method)
                    <tr>
                        <td>
                            <div class="d-flex align-items-center">
                                @if($method->logo)
                                    <img src="{{ asset('storage/' . $method->logo) }}" alt="{{ $method->name }}" class="img-circle elevation-1 mr-2" style="width:34px;height:34px;object-fit:contain;background:#fff;flex-shrink:0;">
                                @else
                                    <span class="learner-avatar mr-2" style="background:linear-gradient(135deg,#1a56db,#0b3d91);">{{ strtoupper(substr($method->name, 0, 1)) }}</span>
                                @endif
                                <span class="learner-name">{{ $method->name }}</span>
                            </div>
                        </td>
                        <td><span class="badge badge-info">{{ $method->code }}</span></td>
                        <td>
                            @if($method->is_active)
                                <span class="status-pill ok"><span class="dot"></span>Enabled</span>
                            @else
                                <span class="status-pill muted"><span class="dot"></span>Disabled</span>
                            @endif
                        </td>
                        <td class="text-right">
                            <a href="{{ route('payment-methods.edit', $method) }}" class="btn btn-sm btn-outline-primary"><i class="fas fa-cog mr-1"></i> Configure</a>
                            <form action="{{ route('payment-methods.toggle', $method) }}" method="POST" class="d-inline">
                                @csrf
                                @method('PATCH')
                                <button type="submit" class="btn btn-sm {{ $method->is_active ? 'btn-outline-secondary' : 'btn-outline-success' }}">
                                    {{ $method->is_active ? 'Disable' : 'Enable' }}
                                </button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="4" class="text-center py-5">
                            <i class="fas fa-wallet fa-3x text-muted mb-3"></i>
                            <p class="font-weight-bold mb-1">No payment methods</p>
                            <p class="text-muted small mb-0">Payment methods will appear here once configured.</p>
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection