@extends('backEnd.layouts.master')
@section('title', 'IP Restrictions')

@push('styles')
<style>
.ip-panel { background:#fff; border:1px solid #e5e7eb; border-radius:4px; overflow:hidden; }
.ip-table { width:100%; margin:0; border-collapse:collapse; font-size:12px; }
.ip-table thead th { background:#f3f4f6; border-bottom:1px solid #d1d5db; padding:10px 12px; font-weight:700; color:#374151; }
.ip-table tbody td { border-bottom:1px solid #e5e7eb; padding:12px; vertical-align:middle; }
.ip-table tbody tr:nth-child(even) { background:#f9fafb; }
.ip-table tbody tr:nth-child(odd)  { background:#fff; }
</style>
@endpush

@section('content')
<div class="container-fluid py-3">
            <div class="mb-3">
                <h4 class="mb-0 fw-bold">IP Restrictions</h4>
                <small class="text-muted">Block specific IP addresses from accessing your store</small>
            </div>

            <div class="row g-3">
                <div class="col-lg-4">
                    <div class="ip-panel">
                        <div class="p-3 border-bottom bg-light">
                            <h6 class="mb-0 fw-bold"><i class="fas fa-plus-circle text-success me-2"></i>Block an IP Address</h6>
                        </div>
                        <div class="p-3">
                            <form action="{{ route('admin.settings.ip.update') }}" method="POST">
                                @csrf
                                <label class="form-label fw-semibold">IP Address</label>
                                <div class="input-group mb-2">
                                    <span class="input-group-text"><i class="fas fa-network-wired"></i></span>
                                    <input type="text" name="ip_address" class="form-control" placeholder="192.168.1.100" required>
                                </div>
                                <small class="text-muted d-block mb-3">Enter IPv4 address to block</small>
                                <button type="submit" class="btn btn-danger btn-sm px-4">
                                    <i class="fas fa-ban me-1"></i> Block IP
                                </button>
                            </form>
                            <hr>
                            <div class="alert alert-info mb-0 py-2 small">
                                <strong>Your current IP:</strong> {{ request()->ip() }}<br>
                                <span class="text-muted">Do not block your own IP!</span>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-8">
                    <div class="ip-panel">
                        <div class="p-3 border-bottom bg-light d-flex justify-content-between align-items-center">
                            <h6 class="mb-0 fw-bold"><i class="fas fa-list text-danger me-2"></i>Blocked IPs</h6>
                            <span class="badge bg-danger">{{ $blockedIps->count() }}</span>
                        </div>
                        @if($blockedIps->isEmpty())
                        <div class="text-center py-5 text-muted">
                            <i class="fas fa-shield-alt fa-2x text-success mb-2 opacity-75"></i>
                            <p class="mb-0">No IP addresses are currently blocked.</p>
                        </div>
                        @else
                        <div class="table-responsive">
                            <table class="ip-table">
                                <thead>
                                    <tr>
                                        <th style="width:50px">#</th>
                                        <th>IP Address</th>
                                        <th>Blocked At</th>
                                        <th class="text-end" style="width:100px">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($blockedIps as $i => $ip)
                                    <tr>
                                        <td>{{ $i + 1 }}</td>
                                        <td><code class="text-danger fw-bold">{{ $ip->value }}</code></td>
                                        <td>{{ $ip->created_at?->format('d M Y, g:i A') }}</td>
                                        <td class="text-end">
                                            <form action="{{ route('admin.settings.ip.delete', $ip->id) }}" method="POST" class="d-inline" id="del-ip-{{ $ip->id }}">
                                                @csrf @method('DELETE')
                                                <button type="button" class="btn btn-sm btn-outline-danger py-0 px-2 delete-confirm" data-form="#del-ip-{{ $ip->id }}">
                                                    <i class="fas fa-trash"></i> Unblock
                                                </button>
                                            </form>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                        @endif
                    </div>
                </div>
            </div>
</div>
@endsection