@extends('layouts.app')
@section('title', 'Mein Konto — kotsch.tech')
@section('content')
<div style="max-width:520px;margin:0 auto;padding:60px 20px;">
    <h1 style="font-size:2rem;font-weight:800;margin-bottom:24px;">Mein Konto</h1>

    @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

    <div style="background:#f8fafc;border-radius:12px;padding:20px;margin-bottom:24px;">
        <p style="margin:0;color:#475569;">Angemeldet als</p>
        <p style="margin:4px 0 0;font-weight:700;font-size:1.1rem;">{{ $user->email }}</p>
    </div>

    <h2 style="font-size:1.2rem;font-weight:700;margin-bottom:12px;">{{ $user->password ? 'Passwort ändern' : 'Passwort setzen' }}</h2>
    <form method="POST" action="{{ route('konto.password') }}" style="margin-bottom:32px;">
        @csrf
        <input type="password" name="password" placeholder="Neues Passwort" required autocomplete="new-password"
            style="width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:10px;margin-bottom:12px;">
        <input type="password" name="password_confirmation" placeholder="Wiederholen" required autocomplete="new-password"
            style="width:100%;padding:12px 14px;border:1px solid #cbd5e1;border-radius:10px;margin-bottom:12px;">
        <button type="submit" style="background:#6D5AE6;color:#fff;border:none;padding:12px 24px;border-radius:10px;font-weight:700;cursor:pointer;">Speichern</button>
    </form>

    <h2 style="font-size:1.2rem;font-weight:700;margin-bottom:12px;">Newsletter</h2>
    <form method="POST" action="{{ route('konto.newsletter') }}" style="margin-bottom:32px;">
        @csrf
        <label style="display:flex;gap:8px;align-items:center;margin-bottom:12px;">
            <input type="checkbox" name="newsletter" value="1" @checked($user->newsletter_opt_in)> Newsletter erhalten
        </label>
        <button type="submit" style="background:#0f172a;color:#fff;border:none;padding:12px 24px;border-radius:10px;font-weight:700;cursor:pointer;">Speichern</button>
    </form>

    <form method="POST" action="{{ route('logout') }}" style="margin-bottom:24px;">
        @csrf
        <button type="submit" style="background:#f1f5f9;color:#475569;border:none;padding:12px 24px;border-radius:10px;font-weight:600;cursor:pointer;">Abmelden</button>
    </form>

    <hr style="border:none;border-top:1px solid #e2e8f0;margin:24px 0;">
    <h2 style="font-size:1.05rem;font-weight:700;margin-bottom:8px;color:#b91c1c;">Konto löschen</h2>
    <p style="color:#94a3b8;font-size:.9rem;margin-bottom:12px;">Löscht dein Konto und alle Zugangsdaten unwiderruflich.</p>
    <form method="POST" action="{{ route('konto.destroy') }}" onsubmit="return confirm('Konto wirklich unwiderruflich löschen?');">
        @csrf
        <button type="submit" style="background:#fef2f2;color:#b91c1c;border:1px solid #fecaca;padding:12px 24px;border-radius:10px;font-weight:700;cursor:pointer;">Konto löschen</button>
    </form>
</div>
@endsection