@extends('layouts.app')

@section('content')
<div class="container d-flex justify-content-center align-items-center" style="height: 80vh;">
    <div class="card shadow p-4" style="width: 100%; max-width: 400px; text-align: center;">
        <div class="mb-4">
            <span style="font-size: 50px;">🔒</span>
            <h4>Chat Locked</h4>
            <p class="text-muted">Enter your secure chat password to continue.</p>
        </div>

        @if($errors->any())
            <div class="alert alert-danger">{{ $errors->first() }}</div>
        @endif

        <form action="{{ route('chat.verify_password') }}" method="POST">
            @csrf
            <div class="form-group mb-3">
                <input type="password" name="password" class="form-control text-center" placeholder="******" autocomplete="current-password" required autofocus>
            </div>
            
            <button type="submit" class="btn btn-primary w-100">Unlock Chat</button>
        </form>
        
        <div class="mt-3">
            <a href="{{ route('chat.recovery') }}" class="text-danger small">Forgot Chat Password?</a>
        </div>
        
        <div class="mt-2">
            <a href="{{ url('/') }}" class="text-muted small">Go Back</a>
        </div>
    </div>
</div>
@endsection