@extends('layouts.main')

@section('content')
<div class="auth-container">
    <div class="auth-gradient-bg"></div>
    <div class="auth-card">
        <div class="auth-header">
            <div class="auth-logo"><i class="fas fa-utensils"></i></div>
            <h1>স্বাগতম সজলা</h1>
            <p>মেস ম্যানেজমেন্ট সিস্টেম</p>
        </div>

        @if ($loginError ?? null)
            <div class="flash flash-{{ $loginError['type'] ?? 'error' }}">
                <i class="fas fa-exclamation-circle"></i>
                <span>{{ $loginError['message'] ?? '' }}</span>
            </div>
        @endif

        <form method="POST" action="{{ url('/login') }}" class="auth-form">
            @csrf
            <div class="role-selector">
                <label class="role-option">
                    <input type="radio" name="role" value="superadmin">
                    <span class="role-box">
                        <i class="fas fa-crown"></i>
                        <strong>সুপার এডমিন</strong>
                        <small>Super Admin</small>
                    </span>
                </label>
                <label class="role-option">
                    <input type="radio" name="role" value="manager">
                    <span class="role-box">
                        <i class="fas fa-user-tie"></i>
                        <strong>ম্যানেজার</strong>
                        <small>Manager</small>
                    </span>
                </label>
                <label class="role-option">
                    <input type="radio" name="role" value="member" checked>
                    <span class="role-box">
                        <i class="fas fa-user"></i>
                        <strong>সদস্য</strong>
                        <small>Member</small>
                    </span>
                </label>
            </div>

            <div class="field">
                <label for="company_id">ইউজার আইডি</label>
                <div class="input-wrap">
                    <i class="fas fa-id-badge"></i>
                    <input type="text" id="company_id" name="company_id" placeholder="কম্পানির আইডি" required>
                </div>
            </div>

            <div class="field">
                <label for="password">পাসওয়ার্ড</label>
                <div class="input-wrap">
                    <i class="fas fa-lock"></i>
                    <input type="password" id="password" name="password" placeholder="পাসওয়ার্ড" required>
                    <button type="button" class="toggle-pass" onclick="togglePassword(this)"><i class="fas fa-eye"></i></button>
                </div>
            </div>

            <button type="submit" class="btn btn-primary btn-block">লগইন <i class="fas fa-arrow-right"></i></button>
        </form>
    </div>
</div>
@endsection