@extends('layouts.owner-auth')

@section('title', 'Eigenaarslogin - Genkai')
@section('showcase-title', 'Beheer Genkai vanuit één krachtige omgeving.')
@section('showcase-description', 'Van reservaties en tafels tot menu, personeel en formules: alle restauranttools staan klaar in één Genkai-beheeromgeving.')

@section('header-icon', 'ri-login-circle-line')
@section('header-eyebrow', 'Veilig inloggen')
@section('header-title', 'Welkom terug')
@section('header-description', 'Log in met het eigenaarsaccount van Genkai.')

@section('content')
<form method="POST" action="{{ route('owner.login.store') }}" class="auth-form">
    @csrf

    <div class="auth-field">
        <label for="email">E-mailadres</label>

        <div class="auth-input">
            <i class="ri-mail-line auth-input__icon"></i>
            <input
                id="email"
                type="email"
                name="email"
                value="{{ old('email') }}"
                placeholder="info@genkai.be"
                autocomplete="email"
                required
                autofocus
            >
        </div>

        @error('email')
            <small class="auth-field__error">{{ $message }}</small>
        @enderror
    </div>

    <div class="auth-field">
        <label for="password">Wachtwoord</label>

        <div class="auth-input">
            <i class="ri-lock-password-line auth-input__icon"></i>
            <input
                id="password"
                type="password"
                name="password"
                placeholder="Voer je wachtwoord in"
                autocomplete="current-password"
                required
            >

            <button
                type="button"
                class="auth-password-toggle"
                data-password-toggle="password"
                aria-label="Wachtwoord tonen"
            >
                <i class="ri-eye-line"></i>
            </button>
        </div>

        @error('password')
            <small class="auth-field__error">{{ $message }}</small>
        @enderror
    </div>

    <button type="submit" class="auth-submit">
        <span>Inloggen bij Genkai</span>
        <i class="ri-arrow-right-line"></i>
    </button>
</form>

<div class="auth-card__footer genkai-auth-footer">
    <a href="{{ route('home') }}">
        <i class="ri-arrow-left-line"></i>
        Terug naar de website
    </a>
</div>

<div class="auth-security">
    <i class="ri-shield-check-line"></i>
    <span>Deze omgeving is uitsluitend voor Genkai-beheer.</span>
</div>
@endsection