@extends('layouts.app')

@section('title', 'Profile Settings')

@section('content')
<div class="card" style="max-width:600px;">
    <h2 style="font-size:17px;color:#0b4f2c;margin-bottom:16px;">Profile Settings</h2>

    <form method="POST" action="{{ url('/api/profile') }}">
        @csrf @method('PATCH')
        <label style="display:block;font-size:12px;margin-bottom:4px;">Full Name</label>
        <input type="text" name="name" value="{{ auth()->user()->name }}" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;margin-bottom:12px;">

        <label style="display:block;font-size:12px;margin-bottom:4px;">Phone</label>
        <input type="text" name="phone" value="{{ auth()->user()->phone }}" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;margin-bottom:16px;">

        <button type="submit" style="background:#0b4f2c;color:#fff;border:none;padding:9px 18px;border-radius:6px;font-size:13px;cursor:pointer;">Save</button>
    </form>

    <hr style="margin:20px 0;border:none;border-top:1px solid #eee;">

    <h3 style="font-size:14px;color:#0b4f2c;margin-bottom:12px;">Change Password</h3>
    <form method="POST" action="{{ url('/api/profile/password') }}">
        @csrf @method('PATCH')
        <input type="password" name="current_password" placeholder="Current password" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;margin-bottom:10px;">
        <input type="password" name="new_password" placeholder="New password" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;margin-bottom:10px;">
        <input type="password" name="new_password_confirmation" placeholder="Confirm new password" style="width:100%;padding:8px;border:1px solid #ddd;border-radius:6px;margin-bottom:16px;">
        <button type="submit" style="background:#0b4f2c;color:#fff;border:none;padding:9px 18px;border-radius:6px;font-size:13px;cursor:pointer;">Update Password</button>
    </form>
</div>
@endsection