@extends('admin.template.layout')


@section('title', 'entrevista')
@section('conteudo')

    <div class="container d-flex flex-column align-items-center" style="max-width: 700px; margin-top: 100px">
        <h2 class="text-center mb-4">Entrevista com o candidato {{ $candidate->first_name }}</h2>
        <p class="text-muted small mb-4">
            Digite o código da sala de reunião para entrar.
        </p>
        <div class="d-flex align-items-center gap-2 w-100 justify-content-center mb-4">

            <!-- Campo de código + botão Participar -->
            <form method="post" action="{{ route('validateMeeting') }}" class="d-flex align-items-center">
                {{ csrf_field() }}
                <div class="input-group rounded-pill border border-primary" style="overflow: hidden;">
                    <span class="input-group-text bg-white border-0"><i class="fa-regular fa-keyboard"></i></span>
                    <input type="text" name="meetingId" id="meetingId" class="form-control border-0"
                        placeholder="Digite um código ou link">
                    <button type="submit" class="btn btn-light text-primary fw-bold px-3">Participar</button>
                </div>
            </form>
        </div>

        <small class="d-block text-muted mt-3">
            <a href="{{ route('vacancies.index') }}" class="btn btn-link  top-0 start-0 m-3 text-decoration-none">
                <i class="fa-solid fa-arrow-left me-1"></i> Voltar para controle de vagas
            </a>
        </small>

    </div>
@endsection