@extends('layouts.admin')
@section('title','Edit Customer')
@section('page-title','✏️ Edit Customer')

@section('styles')
<style>
.responsive-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
@media (max-width: 768px) {
    .responsive-form-grid {
        grid-template-columns: 1fr;
    }
}
</style>
@endsection

@section('content')
<div style="max-width:650px">
<div class="card">
    <div class="card-title">👤 Customer: {{ $user->name }}</div>
    <form method="POST" action="{{ route('admin.customers.update', $user->id) }}">
        @csrf
        <div class="responsive-form-grid" style="margin-bottom:16px">
            <div>
                <label style="display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:#555">Full Name *</label>
                <input type="text" name="name" value="{{ old('name',$user->name) }}" required
                       style="width:100%;padding:11px 13px;border:2px solid #e0e0e0;border-radius:9px;font-size:14px;outline:none">
            </div>
            <div>
                <label style="display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:#555">Email *</label>
                <input type="email" name="email" value="{{ old('email',$user->email) }}" required
                       style="width:100%;padding:11px 13px;border:2px solid #e0e0e0;border-radius:9px;font-size:14px;outline:none">
            </div>
            <div>
                <label style="display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:#555">Phone</label>
                <input type="tel" name="phone" value="{{ old('phone',$user->phone) }}"
                       style="width:100%;padding:11px 13px;border:2px solid #e0e0e0;border-radius:9px;font-size:14px;outline:none">
            </div>
            <div>
                <label style="display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:#555">Status</label>
                <select name="status" style="width:100%;padding:11px 13px;border:2px solid #e0e0e0;border-radius:9px;font-size:14px;outline:none">
                    @foreach(['active','inactive','suspended'] as $s)
                    <option value="{{ $s }}" {{ $user->status==$s ? 'selected' : '' }}>{{ ucfirst($s) }}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div style="margin-bottom:18px;background:#f8f9fa;padding:16px;border-radius:10px">
            <p style="font-size:13px;font-weight:600;color:#555;margin-bottom:6px">New Password (leave blank to keep current)</p>
            <input type="password" name="password" placeholder="Enter new password (optional)"
                   style="width:100%;padding:11px 13px;border:2px solid #e0e0e0;border-radius:9px;font-size:14px;outline:none">
        </div>
        <div style="background:#f0f4ff;padding:16px;border-radius:10px;margin-bottom:20px">
            <p style="font-size:13px;color:#555"><strong>Credit Balance:</strong> ${{ number_format($user->credit_balance,2) }} AUD
            <a href="{{ route('admin.credits') }}?customer_id={{ $user->id }}" style="margin-left:14px;font-size:12px;color:#1e3c72;font-weight:600">Adjust Credits →</a>
            </p>
        </div>
        <div style="display:flex;gap:12px">
            <button type="submit" style="padding:12px 28px;background:linear-gradient(135deg,#1e3c72,#2a5298);color:#fff;border:none;border-radius:9px;cursor:pointer;font-size:14px;font-weight:600">Update Customer</button>
            <a href="{{ route('admin.customers') }}" style="padding:12px 20px;background:#f0f0f0;color:#555;border-radius:9px;text-decoration:none;font-size:14px">← Back</a>
        </div>
    </form>
</div>
</div>
@endsection