@extends('layouts.base')
@section('content')
<div class="min-h-screen flex items-center justify-center px-4 py-12">
        <div class="glass rounded-2xl p-8 w-full max-w-md anim-in">
            <a href="{{ route('home') }}" class="flex items-center gap-2 mb-6 text-lg font-bold">
                <span class="text-2xl">🤖</span>
                <span class="bg-gradient-to-r from-indigo-400 to-purple-400 bg-clip-text text-transparent">DummyBot</span>
            </a>
            <h1 class="text-2xl font-bold mb-1">Crea tu cuenta</h1>
            <p class="text-zinc-400 text-sm mb-6">Tus tareas, en un bot que se enfurruña si las dejas</p>

            @if ($errors->any())
                <div class="mb-4 p-3 rounded-lg bg-red-500/10 border border-red-500/30 text-red-300 text-sm">
                    <ul class="list-disc list-inside">@foreach ($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
                </div>
            @endif

            <form method="POST" action="{{ route('register') }}" class="space-y-4">
                @csrf
                <div>
                    <label class="block text-sm text-zinc-400 mb-1">Nombre</label>
                    <input type="text" name="name" required autofocus class="input" value="{{ old('name') }}">
                </div>
                <div>
                    <label class="block text-sm text-zinc-400 mb-1">Email</label>
                    <input type="email" name="email" required class="input" value="{{ old('email') }}">
                </div>
                <div>
                    <label class="block text-sm text-zinc-400 mb-1">Contraseña (mín. 8)</label>
                    <input type="password" name="password" required minlength="8" class="input">
                </div>
                <div>
                    <label class="block text-sm text-zinc-400 mb-1">Repite la contraseña</label>
                    <input type="password" name="password_confirmation" required minlength="8" class="input">
                </div>
                <button type="submit" class="btn btn-primary w-full justify-center">Crear cuenta</button>
            </form>
            <p class="mt-6 text-center text-sm text-zinc-500">
                ¿Ya tienes cuenta?
                <a href="{{ route('login') }}" class="text-indigo-400 hover:underline">Entrar</a>
            </p>
        </div>
    </div>


@endsection