@extends('layouts.app')

@section('title', __('Entrar — Banco de Talentos'))
@section('meta_description', __('Acesse o Banco de Talentos de Angra dos Reis usando sua Conta Angra.'))

@push('styles')
    <link rel="stylesheet" href="{{ asset('css/talent-bank/sso-entrar.css') }}">
@endpush

@section('content')

<section class="login-section" aria-label="{{ __('Área de acesso') }}">
    <div
        id="sso-gate"
        class="login-card-wrap card"
        role="main"
        data-angra-register-url="{{ config('services.angra_sso.register_url') }}"
        data-force-login="{{ session('force_sso_reauth') ? '1' : '0' }}"
        data-msg-popup-closed="{{ e(__('angra_sso.popup_closed_hint')) }}"
        @if (request()->boolean('open_sso')) data-auto-open-sso="1" @endif
    >

        {{-- Cabeçalho do card --}}
        <div class="login-card-header">
            <div class="login-badge">
                <i class="bi bi-shield-lock-fill" aria-hidden="true"></i>
                {{ __('Acesso seguro') }}
            </div>
            <h1 class="login-title">{{ __('Acesse sua conta') }}</h1>
            <p class="login-subtitle">
                {{ __('Use sua Conta Angra para entrar no Banco de Talentos.') }}
            </p>
        </div>

        {{-- Corpo do card --}}
        <div
            class="login-card-body"
            data-register-url="{{ config('services.angra_sso.register_url') }}"
        >

            {{-- Mensagem de erro SSO (preenchida via JS) --}}
            <div
                id="sso-error-msg"
                class="mb-3"
                role="alert"
                aria-live="assertive"
                aria-atomic="true"
            ></div>

            {{-- Botão principal: Acessar com Conta Angra --}}
            <div class="d-grid mb-3">
                <button
                    type="button"
                    id="btn-sso-login"
                    class="btn login-btn-acessar"
                    data-angra-login-url="{{ config('services.angra_sso.login_url') }}"
                    data-angra-logout-url="{{ config('services.angra_sso.logout_url') }}"
                    data-sso-callback-url="{{ route('entrar.sso-callback') }}"
                    data-angra-origin="{{ config('services.angra_sso.origin') }}"
                    data-force-prompt-param="{{ config('services.angra_sso.force_prompt_param') }}"
                    aria-label="{{ __('Acessar com Conta Angra') }}"
                >
                    <i class="bi bi-person-badge-fill" aria-hidden="true"></i>
                    {{ __('Acessar com Conta Angra') }}
                </button>
            </div>

            {{-- Botão: Cadastre sua empresa pelo BT Angra --}}
            <div class="d-grid mb-3">
                <a
                    href="{{ route('talent-bank.register.company') }}"
                    class="btn login-btn-acessar"
                    aria-label="{{ __('Cadastre sua empresa pelo BT Angra') }}"
                >
                    <i class="bi bi-building-fill" aria-hidden="true"></i>
                    {{ __('Cadastre sua empresa pelo BT Angra') }}
                </a>
            </div>

            {{-- Dica: login automático se já logado na Conta Angra --}}
            <p class="login-sso-hint">
                <span class="login-sso-hint-label">{{ __('Obs.') }}</span>
                {{ __('Se você já estiver logado na sua') }}
                <a href="https://angra.rj.gov.br/conta-angra" target="_blank" rel="noopener noreferrer" class="login-sso-hint-link">{{ __('Conta Angra') }}</a>,
                {{ __('o acesso ao Banco de Talentos será feito automaticamente.') }}
            </p>
        </div>

        {{-- Rodapé do card --}}
        <div class="login-card-footer">
            <p class="login-footer-text">
                {{ __('O Banco de Talentos utiliza a mesma conta do portal da Prefeitura de Angra dos Reis.') }}
                <span>
                    {{ __('Não possui cadastro?') }}
                    <a href="{{ config('services.angra_sso.register_url') }}" target="_blank" rel="noopener noreferrer" class="login-footer-link">
                        {{ __('Crie sua Conta/Empresa no Angra') }}
                    </a>.
                </span>
            </p>
        </div>

    </div>{{-- /#sso-gate --}}
</section>

{{-- Modal — Confirmação Conta Angra --}}
<div
    class="modal fade sso-conta-angra-modal"
    id="modalContaAngraSso"
    tabindex="-1"
    aria-labelledby="modalContaAngraSsoLabel"
    aria-hidden="true"
    aria-modal="true"
    role="dialog"
>
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">

            <div class="modal-header">
                <h2 class="modal-title fs-6" id="modalContaAngraSsoLabel">
                    <i class="bi bi-shield-check me-2" aria-hidden="true"></i>
                    {{ __('angra_sso.modal_title') }}
                </h2>
                <button
                    type="button"
                    class="btn-close"
                    data-bs-dismiss="modal"
                    aria-label="{{ __('angra_sso.btn_close') }}"
                ></button>
            </div>

            <div class="modal-body">
                <p class="mb-3">{{ __('angra_sso.modal_intro') }}</p>
                <p class="text-muted small mb-2">{{ __('angra_sso.modal_register_note') }}</p>
                <div class="sso-modal-legacy-tip" role="note">
                    <i class="bi bi-clock-history" aria-hidden="true"></i>
                    {{ __('angra_sso.modal_legacy_notice') }}
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-primary" id="btn-sso-modal-continue">
                    <i class="bi bi-box-arrow-in-right me-1" aria-hidden="true"></i>
                    {{ __('angra_sso.btn_has_account') }}
                </button>
                <button type="button" class="btn btn-outline-primary" id="btn-sso-modal-register">
                    {{ __('angra_sso.btn_create_account') }}
                </button>
                <button type="button" class="btn btn-link" data-bs-dismiss="modal">
                    {{ __('angra_sso.btn_close') }}
                </button>
            </div>

        </div>
    </div>
</div>

@endsection

@push('scripts')
    <script src="{{ asset('js/talent-bank/sso-popup.js') }}"></script>
    <script src="{{ asset('js/entrar.js') }}"></script>
@endpush