/* =================================================================
   SISPAG — Theme ACNSG v4.1 (overrides leves do Filament)
   Filosofia: manter a marca (navy/gold) SEM brigar com o layout
   responsivo do Filament. Nada de cortar texto nem apertar espaçamento.
   Carregado via renderHook do AdminPanelProvider (panels::head.end).
   ================================================================= */

:root {
    --acnsg-navy:        #0d2453;
    --acnsg-navy-2:      #14306b;
    --acnsg-navy-escuro: #0a1a3d;
    --acnsg-gold:        #d4af5a;
    --acnsg-gold-2:      #e8c264;
    --acnsg-green:       #8bc34a;
    --acnsg-green-2:     #6ea83a;

    --acnsg-text:    #1a1a1a;
    --acnsg-muted:   #666666;
    --acnsg-bg-soft: #f6f8fc;
    --acnsg-border:  #e5e7eb;

    --acnsg-radius:      999px;   /* pílula (botões/badges) */
    --acnsg-radius-card: 12px;    /* cards/modais */
    --acnsg-radius-input: 8px;

    --acnsg-shadow-sm: 0 1px 3px rgba(13, 36, 83, .06);
    --acnsg-shadow:    0 4px 18px rgba(13, 36, 83, .10);
    --acnsg-shadow-lg: 0 12px 30px rgba(13, 36, 83, .15);
}

/* =================================================================
   SIDEBAR — navy institucional, item ativo com borda dourada
   ================================================================= */
.fi-sidebar {
    background: var(--acnsg-navy) !important;
    border-right: 0 !important;
}
.fi-sidebar-header {
    background: linear-gradient(180deg, var(--acnsg-navy-escuro), var(--acnsg-navy)) !important;
    border-bottom: 3px solid var(--acnsg-gold) !important;
    color: #fff !important;
    height: auto !important;
    min-height: 5.5rem;
    padding: .85rem 1rem !important;
}
/* Logo aparece no tamanho definido (sem cap de altura) */
.fi-sidebar-header img,
.fi-topbar img.fi-logo,
.fi-logo img { max-height: none !important; }
.fi-sidebar-header .fi-logo { color: #fff !important; font-weight: 800 !important; }

.fi-sidebar-nav,
.fi-sidebar-item-label { color: rgba(255,255,255,.88) !important; }

/* Nome do menu quebra em várias linhas em vez de cortar com "…" */
.fi-sidebar-item-label {
    white-space: normal !important;
    line-height: 1.2;
    overflow: visible !important;
    text-overflow: clip !important;
}

/* Rótulo de grupo: dourado, legível — sem letter-spacing exagerado */
.fi-sidebar-group-label {
    color: var(--acnsg-gold) !important;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
}
.fi-sidebar-item-button { transition: background-color .2s ease; }
.fi-sidebar-item-button:hover { background: rgba(212,175,90,.12) !important; }
.fi-sidebar-item-active .fi-sidebar-item-button {
    background: rgba(212,175,90,.18) !important;
    border-left: 3px solid var(--acnsg-gold) !important;
}
.fi-sidebar-item-active .fi-sidebar-item-label,
.fi-sidebar-item-active svg { color: #fff !important; }

/* =================================================================
   TOPBAR — branco com borda gold
   ================================================================= */
.fi-topbar {
    background: #fff !important;
    border-bottom: 3px solid var(--acnsg-gold) !important;
    box-shadow: var(--acnsg-shadow-sm);
}
.fi-topbar .fi-breadcrumbs a,
.fi-topbar .fi-breadcrumbs .fi-breadcrumbs-item-label { color: var(--acnsg-navy); }

/* =================================================================
   TIPOGRAFIA — Montserrat (vem do panel), títulos em navy
   ================================================================= */
body, .fi-body {
    font-family: 'Montserrat', system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
    color: var(--acnsg-text);
}
.fi-page-heading,
.fi-header-heading,
.fi-section-header-heading { color: var(--acnsg-navy) !important; font-weight: 700 !important; }
.fi-page-subheading,
.fi-section-header-description { color: var(--acnsg-muted) !important; }

/* =================================================================
   CARDS / WIDGETS — borda superior gold, respiro normal do Filament
   ================================================================= */
.fi-section {
    border-radius: var(--acnsg-radius-card) !important;
    border: 1px solid var(--acnsg-border) !important;
    background: #fff !important;
}
.fi-wi-stats-overview-stat {
    border-radius: var(--acnsg-radius-card) !important;
    border: 1px solid var(--acnsg-border) !important;
    border-top: 4px solid var(--acnsg-gold) !important;
    background: #fff;
    box-shadow: var(--acnsg-shadow-sm);
}
.fi-wi-stats-overview-stat-value { color: var(--acnsg-navy) !important; font-weight: 800 !important; }
.fi-wi-stats-overview-stat-label { color: var(--acnsg-muted) !important; font-weight: 600; }

/* =================================================================
   BOTÕES — pílula gold com texto navy
   ================================================================= */
.fi-btn { border-radius: var(--acnsg-radius) !important; font-weight: 600 !important; }
.fi-btn-color-primary {
    background: var(--acnsg-gold) !important;
    color: var(--acnsg-navy) !important;
    border-color: transparent !important;
}
.fi-btn-color-primary:hover { background: var(--acnsg-gold-2) !important; color: var(--acnsg-navy) !important; }

/* =================================================================
   INPUTS — foco gold (borda padrão do Filament, sem engrossar demais)
   ================================================================= */
.fi-input:focus,
.fi-input-wrp:focus-within {
    border-color: var(--acnsg-gold) !important;
    box-shadow: 0 0 0 3px rgba(212,175,90,.18) !important;
    outline: none !important;
}

/* =================================================================
   TABELAS — cabeçalho navy/gold, SEM cortar nem apertar
   ================================================================= */
/* Deixa a tabela ROLAR na horizontal (não cortar colunas largas). */
.fi-ta { border-radius: var(--acnsg-radius-card) !important; }
.fi-ta-ctn, .fi-ta-content { overflow-x: auto !important; }

.fi-ta-header-cell {
    background: var(--acnsg-navy) !important;
    color: var(--acnsg-gold) !important;
    font-weight: 700 !important;
    white-space: nowrap;                 /* cabeçalho numa linha só */
    /* SEM uppercase/letter-spacing: nomes ficam curtos e não sufocam */
}
.fi-ta-header-cell,
.fi-ta-cell { padding-top: .6rem !important; padding-bottom: .6rem !important; }
.fi-ta-row:nth-child(even) { background: var(--acnsg-bg-soft) !important; }
.fi-ta-cell { vertical-align: middle; }

/* Deixa o texto das células QUEBRAR em várias linhas em vez de cortar com "…".
   O Filament põe a classe .truncate (Tailwind) nas colunas — aqui a gente
   desliga o corte e permite a quebra. */
.fi-ta-cell,
.fi-ta-text-item-label { white-space: normal !important; word-break: break-word; }
.fi-ta-cell .truncate {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

/* =================================================================
   BADGES — pílula legível (sem uppercase que estica e corta)
   ================================================================= */
.fi-badge {
    border-radius: var(--acnsg-radius) !important;
    font-weight: 600;
    white-space: nowrap;
}

/* =================================================================
   MODAIS e LOGIN — borda superior gold
   ================================================================= */
.fi-modal-window {
    border-radius: var(--acnsg-radius-card) !important;
    border-top: 4px solid var(--acnsg-gold) !important;
    box-shadow: var(--acnsg-shadow-lg);
}
.fi-simple-main {
    border-radius: var(--acnsg-radius-card) !important;
    border-top: 4px solid var(--acnsg-gold) !important;
    box-shadow: var(--acnsg-shadow);
}
.fi-simple-page-heading { color: var(--acnsg-navy) !important; font-weight: 800; }

/* =================================================================
   FOCO ACESSÍVEL + reduce-motion
   ================================================================= */
*:focus-visible { outline: 2px solid var(--acnsg-gold) !important; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
