@extends('layouts.app')
@section('title', 'E-Mail bestätigen — kotsch.tech')
@section('content')
<div style="max-width:440px;margin:0 auto;padding:60px 20px;">
    <h1 style="font-size:2rem;font-weight:800;margin-bottom:8px;">E-Mail bestätigen</h1>
    <p style="color:#475569;margin-bottom:24px;">Wir haben dir einen Link und einen 6-stelligen Code geschickt. Klicke den Link — oder gib den Code hier ein.</p>

    @if (session('status'))
        <div style="background:#f0fdf4;color:#15803d;padding:12px 16px;border-radius:10px;margin-bottom:16px;">{{ session('status') }}</div>
    @endif
    @if ($errors->any())
        <div style="background:#fef2f2;color:#b91c1c;padding:12px 16px;border-radius:10px;margin-bottom:16px;">{{ $errors->first() }}</div>
    @endif

    <form method="POST" action="{{ route('verification.code') }}">
        @csrf
        <input type="text" name="code" inputmode="numeric" pattern="\d{6}" maxlength="6" placeholder="123456" required
            style="width:100%;padding:14px;border:1px solid #cbd5e1;border-radius:10px;font-size:1.4rem;text-align:center;letter-spacing:.3em;font-family:monospace;margin-bottom:16px;">
        <button type="submit" style="width:100%;background:#6D5AE6;color:#fff;border:none;padding:14px;border-radius:10px;font-weight:700;cursor:pointer;">Bestätigen</button>
    </form>

    <form method="POST" action="{{ route('verification.send') }}" style="margin-top:16px;text-align:center;">
        @csrf
        <button type="submit" style="background:none;border:none;color:#6D5AE6;cursor:pointer;text-decoration:underline;">Code erneut senden</button>
    </form>
</div>
@endsection