@extends('welcome')
@section('page_title', 'Painel do setor')

@php
    $setorNome = Auth::user()?->info?->sector?->name ?? 'seu setor';
@endphp

<style>
.adm-empty-wrap {
    max-width: 640px;
    margin: 4.5rem auto;
    padding: 0 1.5rem 4rem;
    text-align: center;
}

.adm-empty-icon {
    width: 88px;
    height: 88px;
    margin: 0 auto 1.75rem;
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--dm-surface-2, #f1f5f9);
    border: 1px solid var(--dm-border, #e2e8f0);
    color: var(--dm-accent, #4d7cf5);
    font-size: 2.4rem;
}

.adm-empty-tag {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: var(--dm-text-muted, #64748b);
    margin-bottom: .5rem;
}

.adm-empty-wrap h1 {
    font-size: 1.7rem;
    font-weight: 700;
    color: var(--dm-text, #0f172a);
    font-family: 'Poppins', sans-serif;
    margin: 0 0 .9rem;
    line-height: 1.25;
}

.adm-empty-wrap h1 .adm-setor {
    color: var(--dm-accent, #4d7cf5);
}

.adm-empty-wrap p {
    font-size: .98rem;
    color: var(--dm-text-muted, #64748b);
    line-height: 1.6;
    margin: 0 auto 2rem;
    max-width: 520px;
}

.adm-empty-actions {
    display: flex;
    gap: .75rem;
    justify-content: center;
    flex-wrap: wrap;
}

.adm-empty-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .7rem 1.4rem;
    border-radius: 9px;
    font-size: .9rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all .14s;
    border: 1px solid transparent;
}

.adm-empty-btn-primary {
    background: var(--dm-accent, #4d7cf5);
    color: #fff;
    box-shadow: 0 4px 14px rgba(77, 124, 245, .28);
}

.adm-empty-btn-primary:hover {
    filter: brightness(1.06);
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
}

.adm-empty-btn-ghost {
    background: var(--dm-surface, #fff);
    border-color: var(--dm-border, #e2e8f0);
    color: var(--dm-text, #334155);
}

.adm-empty-btn-ghost:hover {
    background: var(--dm-surface-2, #f8fafc);
    color: var(--dm-text, #334155);
    text-decoration: none;
}

.adm-empty-hint {
    margin-top: 2.25rem;
    font-size: .82rem;
    color: var(--dm-text-muted, #94a3b8);
}
</style>

@section('conteudo')

<div class="adm-empty-wrap">

    <div class="adm-empty-icon">
        <i class="bi bi-columns-gap"></i>
    </div>

    <div class="adm-empty-tag">Painel administrativo</div>

    <h1>Ainda não há um painel para <span class="adm-setor">{{ $setorNome }}</span></h1>

    <p>
        Este setor ainda não possui um painel administrativo próprio dentro do sistema.
        Se você tem uma ideia de painel,
        relatório ou precisa de uma <strong>ferramenta interna</strong> para o seu dia a dia,
        conte para a equipe de Desenvolvimento abrindo um chamado. É assim que novas ferramentas nascem por aqui.
    </p>

    <div class="adm-empty-actions">
        <a href="{{ url('/ti/form/chamado') }}" class="adm-empty-btn adm-empty-btn-primary">
            <i class="bi bi-plus-circle"></i> Abrir chamado
        </a>
        <a href="{{ url('/acompanhamento') }}" class="adm-empty-btn adm-empty-btn-ghost">
            <i class="bi bi-ticket-detailed"></i> Meus chamados
        </a>
    </div>

    <div class="adm-empty-hint">
        <i class="bi bi-lightbulb me-1"></i>
        Descreva sua necessidade no chamado, quanto mais detalhe, melhor conseguimos ajudar.
    </div>

</div>

@endsection