@extends('template')

@section('conteudo')

    {{-- Título da página --}}
    <div class="mb-4">
        <h4 class="fw-bold mb-0" style="color:var(--primary);">Dashboard</h4>
        <span class="text-muted" style="font-size:0.83rem;">Visão geral do sistema — O Castelo</span>
    </div>

    {{-- Cards de resumo --}}
    <div class="row g-3 mb-4">

        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card border-0 shadow-sm rounded-4 p-4" style="background:#fff;">
                <p class="text-uppercase fw-bold text-muted mb-2" style="font-size:0.68rem;letter-spacing:.08em;">Cadastros</p>
                <p class="fw-bold mb-1" style="font-size:1.6rem;color:#1a2e5e;">—</p>
                <p class="text-muted mb-0" style="font-size:0.78rem;">Escolas e agências</p>
            </div>
        </div>

        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card border-0 shadow-sm rounded-4 p-4" style="background:#fff;">
                <p class="text-uppercase fw-bold text-muted mb-2" style="font-size:0.68rem;letter-spacing:.08em;">Propostas Ativas</p>
                <p class="fw-bold mb-1" style="font-size:1.6rem;color:#1a2e5e;">—</p>
                <p class="text-muted mb-0" style="font-size:0.78rem;">Aguardando aprovação</p>
            </div>
        </div>

        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card border-0 shadow-sm rounded-4 p-4" style="background:#fff;">
                <p class="text-uppercase fw-bold text-muted mb-2" style="font-size:0.68rem;letter-spacing:.08em;">Agendamentos</p>
                <p class="fw-bold mb-1" style="font-size:1.6rem;color:#1a2e5e;">—</p>
                <p class="text-muted mb-0" style="font-size:0.78rem;">Próximos 30 dias</p>
            </div>
        </div>

        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card border-0 shadow-sm rounded-4 p-4" style="background:#fff;">
                <p class="text-uppercase fw-bold text-muted mb-2" style="font-size:0.68rem;letter-spacing:.08em;">Pagamentos Pendentes</p>
                <p class="fw-bold mb-1" style="font-size:1.6rem;color:#1a2e5e;">—</p>
                <p class="text-muted mb-0" style="font-size:0.78rem;">Sinal ou quitação</p>
            </div>
        </div>

    </div>

    {{-- Estado vazio --}}
    <div class="card border-0 shadow-sm rounded-4 p-4" style="background:#fff;">
        <div class="text-center py-4">
            <i class="bi bi-box-seam" style="font-size:2.2rem;color:#c8d2e8;"></i>
            <p class="fw-semibold mt-3 mb-1" style="color:#1a2e5e;">Módulos em desenvolvimento</p>
            <p class="text-muted mb-0" style="font-size:0.85rem;">O sistema está sendo construído. Os dados serão exibidos aqui conforme os módulos forem ativados.</p>
        </div>
    </div>

@endsection