@extends('layouts.app')

@section('content')
@if(in_array(auth()->user()->role->name, ['super_admin', 'company_admin', 'company_owner']))
<div class="container-fluid py-4">
    <!-- Header with Back Button -->
    <div class="d-flex justify-content-between align-items-start mb-4">
        <div>
            <a href="{{ route('disconnections.index') }}" class="btn btn-link btn-sm text-primary mb-3" style="padding: 0;">
                <i class="fas fa-arrow-left"></i> Back to Disconnections
            </a>
            <h1 class="h3 text-dark font-weight-bold">Client Details</h1>
            <p class="text-muted small">Late fees, overdue billings, and history for {{ $client->name ?? 'Client' }}</p>
        </div>
    </div>

    <!-- Client Information Card -->
    <div class="card bg-primary text-white mb-4 p-4" style="border-radius: 8px;">
        <div class="row">
            <div class="col-md-3">
                <small class="text-uppercase letter-spacing">Client Name</small>
                <p class="h5 font-weight-bold mt-2">{{ $client->name ?? 'Unknown' }}</p>
            </div>
            <div class="col-md-3">
                <small class="text-uppercase letter-spacing">Account Number</small>
                <p class="h5 font-weight-bold mt-2">{{ $client->account_number ?? 'N/A' }}</p>
            </div>
            <div class="col-md-3">
                <small class="text-uppercase letter-spacing">Contact</small>
                <p class="h5 font-weight-bold mt-2">{{ $client->phone ?? 'N/A' }}</p>
                <p class="small">{{ $client->email ?? 'N/A' }}</p>
            </div>
            <div class="col-md-3">
                <small class="text-uppercase letter-spacing">Address</small>
                <p class="small font-weight-500 mt-2">{{ $client->address ?? 'N/A' }}</p>
            </div>
        </div>
    </div>

    <!-- Risk Assessment Alert -->
    @php
        $riskLevel = $lateFeesSummary['risk_level'] ?? 'low';
        $riskAlertClass = [
            'critical' => 'danger',
            'high' => 'warning', 
            'medium' => 'warning',
            'low' => 'success'
        ];
        $alertClass = $riskAlertClass[$riskLevel] ?? 'secondary';
    @endphp
    
    <div class="alert alert-{{ $alertClass }} mb-4" role="alert">
        <div class="d-flex align-items-center">
            @if($riskLevel === 'critical')
                <i class="fas fa-exclamation-circle fa-2x text-{{ $alertClass }} me-3"></i>
                <span class="font-weight-bold">CRITICAL: This client has severe delinquency issues</span>
            @elseif($riskLevel === 'high')
                <i class="fas fa-exclamation-triangle fa-2x text-{{ $alertClass }} me-3"></i>
                <span class="font-weight-bold">HIGH RISK: Multiple overdue billings detected</span>
            @elseif($riskLevel === 'medium')
                <i class="fas fa-exclamation-triangle fa-2x text-{{ $alertClass }} me-3"></i>
                <span class="font-weight-bold">MEDIUM RISK: Some recent late payments</span>
            @else
                <i class="fas fa-check-circle fa-2x text-{{ $alertClass }} me-3"></i>
                <span class="font-weight-bold">LOW RISK: Good payment history</span>
            @endif
        </div>
    </div>

    <!-- Stats Grid -->
    <div class="row mb-4">
        <div class="col-md-12 col-lg-2-4">
            <div class="card border-left-danger mb-3">
                <div class="card-body">
                    <small class="text-muted text-uppercase font-weight-bold">Total Overdue Balance</small>
                    <p class="h5 text-danger font-weight-bold mt-2">₱{{ number_format($lateFeesSummary['total_overdue_balance'] ?? 0, 2) }}</p>
                </div>
            </div>
        </div>

        <div class="col-md-12 col-lg-2-4">
            <div class="card border-left-warning mb-3">
                <div class="card-body">
                    <small class="text-muted text-uppercase font-weight-bold">Total Late Fees</small>
                    <p class="h5 text-warning font-weight-bold mt-2">₱{{ number_format($lateFeesSummary['total_late_fees'] ?? 0, 2) }}</p>
                </div>
            </div>
        </div>

        <div class="col-md-12 col-lg-2-4">
            <div class="card border-left-info mb-3">
                <div class="card-body">
                    <small class="text-muted text-uppercase font-weight-bold">Overdue Billings</small>
                    <p class="h5 text-info font-weight-bold mt-2">{{ $lateFeesSummary['overdue_billings_count'] ?? 0 }}</p>
                </div>
            </div>
        </div>

        <div class="col-md-12 col-lg-2-4">
            <div class="card border-left-primary mb-3">
                <div class="card-body">
                    <small class="text-muted text-uppercase font-weight-bold">Days Since First Overdue</small>
                    <p class="h5 text-primary font-weight-bold mt-2">{{ $lateFeesSummary['days_overdue'] ?? 0 }}</p>
                </div>
            </div>
        </div>

        <div class="col-md-12 col-lg-2-4">
            <div class="card border-left-secondary mb-3">
                <div class="card-body">
                    <small class="text-muted text-uppercase font-weight-bold">Latest Due Date</small>
                    <p class="small font-weight-bold text-secondary mt-2">{{ isset($lateFeesSummary['latest_due_date']) ? $lateFeesSummary['latest_due_date'] : 'N/A' }}</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Disconnection Settings -->
    <div class="card mb-4">
        <div class="card-header bg-light">
            <h5 class="mb-0"><i class="fas fa-cog me-2"></i> Disconnection Settings & History</h5>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <h6 class="font-weight-bold mb-3">Current Disconnection Status</h6>
                    <div class="list-group mb-3">
                        @php
                            $currentDisconnection = $client->billings()
                                ->where('disconnection_status', '!=', 'none')
                                ->where('balance', '>', 0)
                                ->orderBy('updated_at', 'desc')
                                ->first();
                            $disconnectionStatus = $currentDisconnection?->disconnection_status ?? 'none';
                            $statusBadgeClass = $disconnectionStatus === 'disconnected' ? 'bg-danger' : ($disconnectionStatus === 'notice_sent' ? 'bg-warning' : 'bg-success');
                            $statusText = $disconnectionStatus === 'disconnected' ? 'Disconnected' : ($disconnectionStatus === 'notice_sent' ? 'Notice Sent' : 'Active');
                        @endphp
                        <div class="list-group-item">
                            <span class="float-end"><span class="badge {{ $statusBadgeClass }}">{{ $statusText }}</span></span>
                            <strong>Status:</strong>
                        </div>
                        @if($currentDisconnection)
                        <div class="list-group-item">
                            <span class="float-end">{{ $currentDisconnection->updated_at?->format('M d, Y H:i A') ?? 'N/A' }}</span>
                            <strong>Last Updated:</strong>
                        </div>
                        <div class="list-group-item">
                            <span class="float-end">{{ $currentDisconnection->disconnection_reason ?? 'N/A' }}</span>
                            <strong>Reason:</strong>
                        </div>
                        @endif
                    </div>
                </div>
                <div class="col-md-6">
                    <h6 class="font-weight-bold mb-3">Quick Actions</h6>
                    <div class="btn-group-vertical w-100" role="group">
                        <a href="{{ route('disconnections.client-history', $client) }}" class="btn btn-outline-primary text-start">
                            <i class="fas fa-history me-2"></i> View Full History
                        </a>
                        @if($disconnectionStatus === 'disconnected')
                        <form action="{{ route('disconnections.reconnect', $client) }}" method="POST" class="d-inline">
                            @csrf
                            <button type="submit" class="btn btn-outline-success w-100 text-start" onclick="return confirm('Process reconnection for this client?')">
                                <i class="fas fa-plug me-2"></i> Process Reconnection
                            </button>
                        </form>
                        @elseif($disconnectionStatus === 'none' && $lateFeesSummary['total_overdue_balance'] > 0)
                        <form action="{{ route('disconnections.send-notice', $overdueData?->first() ?? 0) }}" method="POST" class="d-inline">
                            @csrf
                            <button type="submit" class="btn btn-outline-warning w-100 text-start" onclick="return confirm('Send disconnection notice to this client?')">
                                <i class="fas fa-bell me-2"></i> Send Notice
                            </button>
                        </form>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Tabs -->
    <ul class="nav nav-tabs mb-4" role="tablist">
        <li class="nav-item" role="presentation">
            <button class="nav-link active" id="billings-tab" data-bs-toggle="tab" data-bs-target="#billings" type="button" role="tab" aria-controls="billings" aria-selected="true">
                <i class="fas fa-list me-2"></i> Overdue Billings
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="late-fees-tab" data-bs-toggle="tab" data-bs-target="#late-fees" type="button" role="tab" aria-controls="late-fees" aria-selected="false">
                <i class="fas fa-history me-2"></i> Late Fees History
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="late-payments-tab" data-bs-toggle="tab" data-bs-target="#late-payments" type="button" role="tab" aria-controls="late-payments" aria-selected="false">
                <i class="fas fa-calendar-times me-2"></i> Late Payments
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="reconnections-tab" data-bs-toggle="tab" data-bs-target="#reconnections" type="button" role="tab" aria-controls="reconnections" aria-selected="false">
                <i class="fas fa-plug me-2"></i> Reconnection Options
            </button>
        </li>
    </ul>

    <!-- Tab Content -->
    <div class="tab-content">
        <!-- Overdue Billings Tab -->
        <div class="tab-pane fade show active" id="billings" role="tabpanel" aria-labelledby="billings-tab">
            <div class="card">
                <div class="table-responsive">
                    <table class="table table-hover table-sm mb-0">
                        <thead class="table-light">
                            <tr>
                                <th class="text-uppercase small text-muted">Billing ID</th>
                                <th class="text-uppercase small text-muted">Amount</th>
                                <th class="text-uppercase small text-muted">Balance</th>
                                <th class="text-uppercase small text-muted">Days Overdue</th>
                                <th class="text-uppercase small text-muted">Late Fees</th>
                                <th class="text-uppercase small text-muted">Due Date</th>
                                <th class="text-uppercase small text-muted">Status</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($overdueData ?? [] as $billing)
                                <tr>
                                    <td class="small font-weight-bold">#{{ $billing->id ?? 'N/A' }}</td>
                                    <td class="small">₱{{ number_format($billing->amount ?? 0, 2) }}</td>
                                    <td class="small font-weight-bold text-danger">₱{{ number_format($billing->balance ?? 0, 2) }}</td>
                                    <td>
                                        <span class="badge {{ ($billing->getDaysOverdue() ?? 0) > 30 ? 'bg-danger' : 'bg-warning' }}">
                                            {{ $billing->getDaysOverdue() ?? 0 }} days
                                        </span>
                                    </td>
                                    <td class="small font-weight-bold text-warning">₱{{ number_format($billing->penalties ?? 0, 2) }}</td>
                                    <td class="small">{{ $billing->due_date ? $billing->due_date->format('M d, Y') : 'N/A' }}</td>
                                    <td>
                                        @php
                                            $status = $billing->disconnection_status ?? 'none';
                                            $statusClass = [
                                                'none' => 'secondary',
                                                'notice_sent' => 'warning',
                                                'disconnected' => 'danger',
                                                'reconnected' => 'success'
                                            ];
                                            $statusBg = $statusClass[$status] ?? 'secondary';
                                            $statusLabel = [
                                                'none' => 'Active',
                                                'notice_sent' => 'Notice Sent',
                                                'disconnected' => 'Disconnected',
                                                'reconnected' => 'Reconnected'
                                            ];
                                        @endphp
                                        <span class="badge bg-{{ $statusBg }}">
                                            {{ $statusLabel[$status] ?? ucfirst($status) }}
                                        </span>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="7" class="text-center text-muted py-5">
                                        <i class="fas fa-check-circle fa-2x mb-3 d-block"></i>
                                        No overdue billings found.
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <!-- Late Fees History Tab -->
        <div class="tab-pane fade" id="late-fees" role="tabpanel" aria-labelledby="late-fees-tab">
            <div class="card">
                <div class="table-responsive">
                    <table class="table table-hover table-sm mb-0">
                        <thead class="table-light">
                            <tr>
                                <th class="text-uppercase small text-muted">Date</th>
                                <th class="text-uppercase small text-muted">Billing</th>
                                <th class="text-uppercase small text-muted">Fee Amount</th>
                                <th class="text-uppercase small text-muted">Type</th>
                                <th class="text-uppercase small text-muted">Notes</th>
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($lateFeeHistory ?? [] as $payment)
                                <tr>
                                    <td class="small text-muted">
                                        {{ $payment->created_at ? $payment->created_at->format('M d, Y H:i') : 'N/A' }}
                                    </td>
                                    <td class="small font-weight-bold">#{{ $payment->billing_id ?? 'N/A' }}</td>
                                    <td class="small font-weight-bold text-warning">₱{{ number_format($payment->amount ?? 0, 2) }}</td>
                                    <td>
                                        <span class="badge {{ ($payment->payment_type ?? '') === 'late_fee' ? 'bg-warning' : 'bg-danger' }}">
                                            {{ ucfirst($payment->payment_type ?? 'N/A') }}
                                        </span>
                                    </td>
                                    <td class="small text-muted">{{ $payment->notes ?? '-' }}</td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="5" class="text-center text-muted py-5">
                                        <i class="fas fa-check-circle fa-2x mb-3 d-block"></i>
                                        No late fee history found.
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <!-- Late Payments Tracking Tab -->
        <div class="tab-pane fade" id="late-payments" role="tabpanel" aria-labelledby="late-payments-tab">
            <div class="card">
                <div class="card-header bg-light">
                    <h5 class="mb-0"><i class="fas fa-exclamation-triangle me-2"></i> Late Payments Tracking</h5>
                </div>
                <div class="card-body">
                    <p class="text-muted small mb-3">
                        This list tracks all late payments for this client, including payments made after reconnection to help monitor recurring patterns.
                    </p>
                    <div class="table-responsive">
                        <table class="table table-hover table-sm mb-0">
                            <thead class="table-light">
                                <tr>
                                    <th class="text-uppercase small text-muted">Date</th>
                                    <th class="text-uppercase small text-muted">Billing</th>
                                    <th class="text-uppercase small text-muted">Due Date</th>
                                    <th class="text-uppercase small text-muted">Days Late</th>
                                    <th class="text-uppercase small text-muted">Amount</th>
                                    <th class="text-uppercase small text-muted">Status</th>
                                    <th class="text-uppercase small text-muted">Notes</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($latePaymentsList ?? [] as $payment)
                                    <tr>
                                        <td class="small text-muted">{{ $payment->created_at ? $payment->created_at->format('M d, Y') : 'N/A' }}</td>
                                        <td class="small font-weight-bold">
                                            <a href="{{ route('billings.show', $payment->billing_id) }}" target="_blank">#{{ $payment->billing_id }}</a>
                                        </td>
                                        <td class="small">{{ $payment->due_date ? $payment->due_date->format('M d, Y') : 'N/A' }}</td>
                                        <td>
                                            <span class="badge {{ ($payment->days_late ?? 0) > 30 ? 'bg-danger' : ($payment->days_late > 14 ? 'bg-warning' : 'bg-info') }}">
                                                {{ $payment->days_late ?? 0 }} days
                                            </span>
                                        </td>
                                        <td class="small font-weight-bold">₱{{ number_format($payment->amount ?? 0, 2) }}</td>
                                        <td>
                                            <span class="badge {{ $payment->payment_status === 'paid' ? 'bg-success' : 'bg-danger' }}">
                                                {{ ucfirst($payment->payment_status ?? 'pending') }}
                                            </span>
                                        </td>
                                        <td class="small text-muted">{{ $payment->notes ?? '-' }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="7" class="text-center text-muted py-5">
                                            <i class="fas fa-check-circle fa-2x mb-3 d-block"></i>
                                            No late payments recorded.
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <!-- Reconnection Options Tab -->
        <div class="tab-pane fade" id="reconnections" role="tabpanel" aria-labelledby="reconnections-tab">
            <div class="row">
                <!-- Current Status -->
                <div class="col-md-6">
                    <div class="card mb-4">
                        <div class="card-header bg-light">
                            <h5 class="card-title mb-0">Current Status</h5>
                        </div>
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center pb-3 border-bottom">
                                <span class="text-muted">Outstanding Balance:</span>
                                <span class="h5 text-danger font-weight-bold">₱{{ number_format($lateFeesSummary['total_overdue_balance'] ?? 0, 2) }}</span>
                            </div>
                            <div class="d-flex justify-content-between align-items-center pb-3 border-bottom mt-3">
                                <span class="text-muted">Late Fees Applied:</span>
                                <span class="h5 text-warning font-weight-bold">₱{{ number_format($lateFeesSummary['total_late_fees'] ?? 0, 2) }}</span>
                            </div>
                            <div class="d-flex justify-content-between align-items-center mt-3">
                                <span class="text-muted">Reconnection Fee:</span>
                                <span class="h5 text-primary font-weight-bold">₱{{ number_format($reconnectionFee ?? 0, 2) }}</span>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Payment Required -->
                <div class="col-md-6">
                    <div class="card border-left-primary mb-4">
                        <div class="card-header bg-light">
                            <h5 class="card-title mb-0">Total Payment Required</h5>
                        </div>
                        <div class="card-body">
                            <div class="h2 text-primary font-weight-bold mb-4">
                                ₱{{ number_format(($lateFeesSummary['total_overdue_balance'] ?? 0) + ($reconnectionFee ?? 0), 2) }}
                            </div>
                            <form action="{{ route('disconnections.reconnect', $client) }}" method="POST">
                                @csrf
                                <div class="mb-3">
                                    <label class="form-label">Payment Amount</label>
                                    <input type="number" name="amount" step="0.01" placeholder="0.00" class="form-control" required>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Payment Method</label>
                                    <select name="payment_method" class="form-select" required>
                                        <option value="">-- Select Method --</option>
                                        <option value="cash">Cash</option>
                                        <option value="check">Check</option>
                                        <option value="transfer">Bank Transfer</option>
                                        <option value="online">Online Payment</option>
                                    </select>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Notes</label>
                                    <textarea name="notes" rows="3" placeholder="Add any notes..." class="form-control"></textarea>
                                </div>
                                <button type="submit" class="btn btn-primary w-100">
                                    <i class="fas fa-plug me-2"></i> Process Reconnection
                                </button>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Bootstrap 5 CSS for border-left utilities -->
<style>
    .border-left-danger { border-left: 4px solid #dc3545 !important; }
    .border-left-warning { border-left: 4px solid #ffc107 !important; }
    .border-left-info { border-left: 4px solid #17a2b8 !important; }
    .border-left-primary { border-left: 4px solid #007bff !important; }
    .border-left-secondary { border-left: 4px solid #6c757d !important; }
    .col-lg-2-4 { flex: 0 0 calc(20% - 0.8rem); }
    .letter-spacing { letter-spacing: 0.5px; }
</style>

@else
<div class="container-fluid py-5">
    <div class="text-center py-5">
        <i class="fas fa-lock fa-5x text-danger mb-4"></i>
        <h2 class="h4 font-weight-bold text-dark">Access Denied</h2>
        <p class="text-muted mb-4">Only Super Admin and Company Admin users can access the Disconnection Management system.</p>
        <a href="{{ route('dashboard') }}" class="btn btn-primary">
            <i class="fas fa-home me-2"></i> Back to Dashboard
        </a>
    </div>
</div>
@endif
@endsection