/*
| MAFERSUL — Tema (refinamentos sobre o Filament v3)
| Sóbrio, profissional, denso. Sem gradientes/glassmorphism.
| Carregado APÓS o CSS do Filament (render hook HEAD_END), então vence por ordem.
| Sistema de gestão de obra — prioriza leitura de dados e contraste (AA).
*/

/* Serif editorial p/ títulos das telas de auth (fallback: Georgia) */
@import url('https://fonts.bunny.net/css?family=newsreader:400,500,600');

/* ============ Tipografia ============ */
.fi-body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* Título de página — mais sólido */
.fi-header-heading {
    font-weight: 700;
    letter-spacing: -0.015em;
}

/* Rótulos de seção e de campos com mais presença */
.fi-section-header-heading {
    font-weight: 600;
    letter-spacing: -0.005em;
}

/* ============ Tabelas: cara de "data grid" ============ */
/* Cabeçalho de coluna: caixa-alta, tracking, peso, contraste AA */
.fi-ta-header-cell {
    background-color: rgb(248 250 252);   /* slate-50 */
    text-transform: uppercase;
    letter-spacing: 0.045em;
    font-size: 0.6875rem;                 /* 11px */
    font-weight: 600;
    color: rgb(51 65 85);                 /* slate-700 */
}

/* Densidade: linhas mais compactas */
.fi-ta-cell {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}

/* Corpo da tabela: texto firme e legível */
.fi-ta-text {
    line-height: 1.35;
}
.fi-ta-text-item-label {
    color: rgb(30 41 59);                 /* slate-800 */
}

/* Coluna principal (nome) com mais peso */
.fi-ta-record .fi-ta-cell:first-child .fi-ta-text-item-label {
    font-weight: 600;
    color: rgb(15 23 42);                 /* slate-900 */
}

/* Zebra sutil para varredura horizontal */
.fi-ta-row:nth-child(even) {
    background-color: rgb(250 250 251);
}
.fi-ta-row:hover {
    background-color: rgb(245 243 250);   /* leve tint do roxo da marca */
}

/* ============ Cards / seções / containers ============ */
.fi-section,
.fi-ta-ctn,
.fi-wi {
    border-radius: 0.5rem;                /* menos arredondado = mais sólido */
}
.fi-section {
    box-shadow: 0 1px 2px 0 rgb(15 23 42 / 0.04);
}

/* ============ Sidebar ============ */
.fi-sidebar-group-label {
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.6875rem;
    font-weight: 700;
    color: rgb(100 116 139);              /* slate-500 */
}
.fi-sidebar-item-label {
    font-weight: 500;
}
.fi-sidebar-item-active > .fi-sidebar-item-button {
    font-weight: 600;
}

/* ============ Topbar ============ */
.fi-topbar {
    border-bottom: 1px solid rgb(226 232 240); /* slate-200 */
    box-shadow: none;
}

/* ============ Botões / badges ============ */
.fi-btn {
    border-radius: 0.5rem;
    font-weight: 600;
}
.fi-badge {
    font-weight: 600;
}

/* ============ Acessibilidade: foco visível e nítido ============ */
.fi-input:focus,
.fi-select-input:focus-within,
.fi-btn:focus-visible,
.fi-link:focus-visible {
    outline: 2px solid rgb(61 30 102);    /* #3D1E66 */
    outline-offset: 2px;
}

/* ============ Login / autenticação (.fi-simple-*) — minimalist-ui ============ */
/* Estética minimalista editorial: monocromático QUENTE, flat (sem sombra, sem
   gradiente), hairline #EAEAEA, contraste tipográfico (título serif x UI sans).
   Cor é recurso escasso: o violeta da marca aparece só na logo e no FOCO
   (acento semântico); o CTA é quase-preto quente. Escopado às telas de auth. AA. */

/* Canvas: bone quente, viewport estável no mobile */
.fi-simple-layout {
    min-height: 100dvh;
    background-color: #F7F6F3;
}

.fi-simple-main-ctn {
    padding: 1.5rem;
}

/* Card: FLAT — só hairline, sem sombra. Raio crisp. Respiro generoso (40px). */
.fi-simple-main {
    background-color: #FFFFFF;
    border: 1px solid #EAEAEA;
    border-radius: 12px;
    box-shadow: none;
    padding: 2.5rem;
}

/* Cabeçalho: logo respirada + título serif editorial */
.fi-simple-header {
    text-align: center;
}
.fi-simple-header .fi-logo {
    margin-inline: auto;
    margin-bottom: 1rem;
}
.fi-simple-header-heading {
    font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
    font-weight: 500;
    font-size: 1.625rem;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: #1C1B1A;                       /* charcoal quente, nunca preto puro */
}

/* Form com respiro; rótulos sans pequenos, cinza quente secundário */
.fi-simple-main .fi-form {
    margin-top: 1.75rem;
}
.fi-simple-main .fi-fo-field-wrp-label {
    font-weight: 500;
    font-size: 0.8125rem;
    color: #57534E;                       /* stone-600 (cinza quente) */
}

/* Inputs: FLAT hairline crisp, sem ring pesado */
.fi-simple-main .fi-input-wrp {
    background-color: #FFFFFF;
    border-radius: 8px;
    box-shadow: inset 0 0 0 1px #E7E5E4;
    transition: box-shadow 0.15s ease;
}
.fi-simple-main .fi-input {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}
/* Foco: violeta da marca como acento semântico — discreto mas visível (AA) */
.fi-simple-main .fi-input:focus {
    outline: none;
}
.fi-simple-main .fi-input-wrp:focus-within {
    box-shadow: inset 0 0 0 1px #3D1E66, 0 0 0 3px rgb(61 30 102 / 0.10);
}

/* CTA: quase-preto quente, flat, raio pequeno, feedback por micro-escala */
.fi-simple-main .fi-btn-color-primary {
    width: 100%;
    background-color: #1C1B1A;
    border-radius: 6px;
    box-shadow: none;
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
    transition: background-color 0.2s ease, transform 0.1s ease;
}
.fi-simple-main .fi-btn-color-primary:hover {
    background-color: #333130;
}
.fi-simple-main .fi-btn-color-primary:active {
    transform: scale(0.98);
}

/* "Lembre de mim": check em charcoal (cor escassa, sem violeta gritante) */
.fi-simple-main .fi-checkbox-input:checked {
    background-color: #1C1B1A;
}

/* Entrada suave do card (respeita prefers-reduced-motion) */
@media (prefers-reduced-motion: no-preference) {
    .fi-simple-main {
        animation: mf-login-in 0.6s cubic-bezier(0.16, 1, 0.3, 1) both;
    }
    @keyframes mf-login-in {
        from { opacity: 0; transform: translateY(12px); }
        to   { opacity: 1; transform: translateY(0); }
    }
}

/* Modo escuro: monocromático quente escuro; CTA invertido (claro sobre escuro) */
.dark .fi-simple-layout {
    background-color: #1A1917;
}
.dark .fi-simple-main {
    background-color: #232220;
    border-color: #38352F;
    box-shadow: none;
}
.dark .fi-simple-header-heading {
    color: #F5F3EF;
}
.dark .fi-simple-main .fi-fo-field-wrp-label {
    color: #A8A29E;
}
.dark .fi-simple-main .fi-input-wrp {
    background-color: #1A1917;
    box-shadow: inset 0 0 0 1px #44403C;
}
.dark .fi-simple-main .fi-input-wrp:focus-within {
    box-shadow: inset 0 0 0 1px #8B6FB8, 0 0 0 3px rgb(139 111 184 / 0.18);
}
.dark .fi-simple-main .fi-btn-color-primary {
    background-color: #F5F3EF;
}
.dark .fi-simple-main .fi-btn-color-primary,
.dark .fi-simple-main .fi-btn-color-primary .fi-btn-label {
    color: #1A1917;
}
.dark .fi-simple-main .fi-btn-color-primary:hover {
    background-color: #E7E5E4;
}
