/*
 * Estilos compartilhados do ERP (telas de autenticação + shell interno) — mesmo espírito de
 * framework/admin/assets/css/app.css (ver framework/.claude/rules/Frontend.md): Tailwind (CDN)
 * cobre o utilitário do dia a dia direto nas classes do HTML; este arquivo só cobre o que o
 * Tailwind não cobre.
 */

body {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
}

/* Esconde elementos controlados pelo Alpine.js até ele inicializar (evita flash de conteúdo). */
[x-cloak] {
    display: none !important;
}

/* Manchas de gradiente desfocadas atrás do card de login — puramente decorativas. */
.bg-decor::before,
.bg-decor::after {
    content: '';
    position: absolute;
    border-radius: 9999px;
    filter: blur(90px);
    opacity: .28;
}

.bg-decor::before {
    width: 26rem;
    height: 26rem;
    background: #0065a9;
    top: -8rem;
    left: -8rem;
}

.bg-decor::after {
    width: 24rem;
    height: 24rem;
    background: #1f9cf0;
    bottom: -9rem;
    right: -6rem;
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fade-in-up .45s ease-out;
}

/* Fonte do menu de navegação — ~75% do tamanho padrão que o Tailwind CDN oferece em text-sm,
 * mesma convenção do framework/admin.
 */
.nav-text {
    font-size: 10.5px;
}

.nav-caption {
    font-size: 9px;
}

/* Scrollbar fina para o menu lateral. */
.thin-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

.thin-scrollbar::-webkit-scrollbar {
    width: 6px;
}

.thin-scrollbar::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 9999px;
}