@extends('layouts.site')

@section('titulo', 'Escolha outra data')

@section('conteudo')
    <div class="card-step p-3 mb-3">
        <h1 class="h6 text-warning mb-2"><i class="bi bi-exclamation-triangle-fill"></i> Outro cliente confirmou essa data primeiro</h1>
        <p class="small mb-0">
            Escolha abaixo outra data para sua <strong>Agenda {{ $solicitacao->modalidade === 'exclusiva' ? 'Exclusiva' : 'Compartilhada' }}</strong>
            de <strong>{{ $solicitacao->qtd_estimada }} alunos</strong>. Seu e-mail continua validado por até 48 horas.
        </p>
        <p class="small text-danger mt-2 mb-0">
            A quantidade informada está abaixo do mínimo de <strong>30 alunos</strong>. Na próxima etapa, ajuste a quantidade antes de salvar o agendamento.
        </p>
    </div>

    <div class="card-step p-3">
        @if($solicitacao->qtd_estimada < 30)
            <div class="border rounded-3 p-3 mb-3" style="border-color:#e8edf8 !important;background:#fbfcff;">
                <div class="fw-semibold mb-2" style="color:var(--site-primary);">Ajuste da solicitação</div>
                <div class="row g-3">
                    <div class="col-8">
                        <label class="form-label small">Quantidade de alunos</label>
                        <input type="number" id="quantidade-retomada-ajuste" class="form-control" min="30" value="{{ $solicitacao->qtd_estimada }}" required>
                        <div class="invalid-feedback">Informe no mínimo 30 alunos.</div>
                    </div>
                    <div class="col-4 d-flex align-items-end">
                        <span class="text-muted small pb-2">Mínimo: 30</span>
                    </div>
                </div>
            </div>
        @endif
        <div class="cal-embed">
            <div class="cal-embed-header">
                <button type="button" class="cal-embed-nav" id="cal-embed-btn-anterior" onclick="mesAnteriorCalendarioPublico()">
                    <i class="bi bi-chevron-left"></i>
                </button>
                <span class="cal-embed-titulo" id="calendario-publico-titulo"></span>
                <button type="button" class="cal-embed-nav" onclick="mesSeguinteCalendarioPublico()">
                    <i class="bi bi-chevron-right"></i>
                </button>
            </div>
            <div class="cal-embed-weekdays" id="calendario-publico-cabecalho"></div>
            <div class="cal-embed-grid" id="calendario-publico-corpo"></div>
            <div class="cal-embed-loading" id="calendario-publico-loading">
                <div class="spinner-border spinner-border-sm text-primary" role="status">
                    <span class="visually-hidden">Carregando...</span>
                </div>
            </div>
        </div>
        <p class="text-muted small text-center mt-2 d-none" id="calendario-publico-vazio">
            Nenhuma data disponível neste mês.
        </p>
        <input type="hidden" id="data-operacional-id">
        <input type="hidden" id="token-retomada" value="{{ $token }}">
        <input type="hidden" id="modalidade-retomada" value="{{ $solicitacao->modalidade }}">
        <input type="hidden" id="quantidade-retomada" value="{{ $solicitacao->qtd_estimada }}">
        <button type="button" class="btn btn-primary w-100 mt-3" id="btn-retomar" onclick="retomarSolicitacaoAgenda({{ $solicitacao->id }})">
            Salvar agendamento
        </button>
    </div>
@endsection

@section('scripts')
    <script src="{{ asset('js/site-agenda.js') }}?v={{ filemtime(public_path('js/site-agenda.js')) }}"></script>
@endsection