@extends('layouts.app')
@section('page-title','Settings')
@section('content')
<div style="display:grid;grid-template-columns:1fr 1fr;gap:20px">
    {{-- Profile Settings --}}
    <div class="card">
        <div class="card-header"><h3>Profile Settings</h3></div>
        <div class="card-body">
            <form method="POST" action="{{ route('settings.profile') }}">@csrf
                <div class="form-group"><label>Full Name</label><input type="text" name="full_name" class="form-control" value="{{ $profile->full_name }}"></div>
                <div class="form-group"><label>Phone</label><input type="text" name="phone" class="form-control" value="{{ $profile->phone }}"></div>
                <div class="form-group"><label>Designation</label><input type="text" name="designation" class="form-control" value="{{ $profile->designation }}"></div>
                <div class="form-group"><label>Email</label><input type="email" class="form-control" value="{{ $profile->email }}" disabled style="background:#f8fafc"></div>
                <button type="submit" class="btn btn-primary">Save Profile</button>
            </form>
        </div>
    </div>

    {{-- Password --}}
    <div class="card">
        <div class="card-header"><h3>Change Password</h3></div>
        <div class="card-body">
            <form method="POST" action="{{ route('settings.password') }}">@csrf
                <div class="form-group"><label>Current Password</label><input type="password" name="current_password" class="form-control" required></div>
                <div class="form-group"><label>New Password</label><input type="password" name="password" class="form-control" required minlength="8"></div>
                <div class="form-group"><label>Confirm Password</label><input type="password" name="password_confirmation" class="form-control" required></div>
                <button type="submit" class="btn btn-primary">Change Password</button>
            </form>
        </div>
    </div>

    {{-- Notification Preferences --}}
    <div class="card" style="grid-column:span 2">
        <div class="card-header"><h3>Notification Preferences</h3></div>
        <div class="card-body">
            <form method="POST" action="{{ route('settings.notifications') }}">@csrf
                <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px">
                    @foreach([
                        'follow_up_reminders' => 'Follow-up Reminders',
                        'deal_updates'         => 'Deal Updates',
                        'team_activity'        => 'Team Activity',
                        'system_alerts'        => 'System Alerts',
                    ] as $key => $label)
                    <label style="display:flex;align-items:center;gap:10px;padding:14px;border:1px solid #e2e8f0;border-radius:8px;cursor:pointer">
                        <input type="checkbox" name="{{ $key }}" {{ ($prefs[$key] ?? true) ? 'checked' : '' }} style="accent-color:#2563eb;width:16px;height:16px">
                        <div>
                            <div style="font-size:14px;font-weight:500">{{ $label }}</div>
                        </div>
                    </label>
                    @endforeach
                </div>
                <button type="submit" class="btn btn-primary" style="margin-top:16px">Save Preferences</button>
            </form>
        </div>
    </div>
</div>
@endsection