@extends('layouts.user')

@section('title', 'Profile')

@section('content')
<h1 class="text-2xl font-bold mb-6">My Profile</h1>

<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
    <div class="bg-white rounded-lg shadow p-6">
        <h2 class="text-lg font-semibold mb-4">Profile Information</h2>
        
        <form action="/user/profile/update" method="POST">
            @csrf
            <div class="mb-4">
                <label class="block mb-2">Username</label>
                <input type="text" name="username" value="{{ $user->username }}" class="w-full px-3 py-2 border rounded">
            </div>
            
            <div class="mb-4">
                <label class="block mb-2">Email</label>
                <input type="email" name="email" value="{{ $user->email }}" class="w-full px-3 py-2 border rounded">
            </div>
            
            <div class="mb-4">
                <label class="block mb-2">New Password (leave empty to keep current)</label>
                <input type="password" name="password" class="w-full px-3 py-2 border rounded">
            </div>
            
            <button type="submit" class="bg-blue-600 text-white px-4 py-2 rounded">Update Profile</button>
        </form>
    </div>

    <div class="bg-white rounded-lg shadow p-6">
        <h2 class="text-lg font-semibold mb-4">Roblox Account</h2>
        
        <form action="/user/profile/update-roblox" method="POST">
            @csrf
            <div class="mb-4">
                <label class="block mb-2">Roblox Username</label>
                <input type="text" name="roblox_username" value="{{ $user->roblox_username }}" class="w-full px-3 py-2 border rounded">
            </div>
            
            <button type="submit" class="bg-green-600 text-white px-4 py-2 rounded">Update Roblox</button>
        </form>
    </div>
</div>
@endsection