@extends('layouts.public')

@section('content')
<div class="max-w-7xl mx-auto p-6">
    <h1 class="text-2xl font-bold mb-4">マイリスト</h1>

    <form method="POST" action="{{ route('lists.store') }}" class="mb-6 bg-white p-4 rounded-lg shadow-sm flex gap-3">
        @csrf
        <input type="text" name="name" placeholder="新しいリスト名" class="border rounded p-2 flex-1" required>
        <button class="px-4 py-2 bg-blue-600 text-white rounded">作成</button>
    </form>

    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
        @forelse($lists as $list)
            <a href="{{ route('lists.show', $list) }}" class="p-4 bg-white rounded-lg shadow-sm border hover:bg-gray-50">
                <div class="text-lg font-semibold">{{ $list->name }}</div>
                <div class="text-sm text-gray-500 mt-1">{{ $list->funds_count }} 件</div>
            </a>
        @empty
            <p>リストがありません。上のフォームから作成してください。</p>
        @endforelse
    </div>
</div>
@endsection