/* Tema do Design System aplicado ao painel de gestão inteiro (Filament).
   Carrega depois de tailwind-compiled.css e custom.css, então vence nos pontos em que
   pisa no mesmo lugar (mesma lógica de camadas já usada no login: ver o comentário de
   "panels::head.start" em AdminPanelProvider). Não mexe no que as telas escrevem com
   estilo embutido (style="..."): isso sempre vence, então esses estilos continuam iguais.

   O que este arquivo faz: fonte, cantos arredondados e sombra nos componentes genéricos
   do Filament (botão, cartão, campo, tabela, modal, barra lateral). Cor já é feita pela
   API própria do Filament (->colors() em AdminPanelProvider), não por CSS. */

.fi-body {
  font-family: var(--font-texto);
}

.fi-header-heading,
.fi-section-header-heading,
.fi-modal-heading,
.fi-fo-section-header-heading,
.fi-ta-header-cell-label,
.fi-wi-stats-overview-stat-label {
  font-family: var(--font-titulos);
}

/* Botões, campos, cartões e modais: cantos e sombra mais próximos do Design System. */
.fi-btn {
  border-radius: var(--raio-medio) !important;
}

.fi-input-wrp,
.fi-fo-file-upload-simple {
  border-radius: var(--raio-medio) !important;
}

.fi-section,
.fi-modal-window,
.fi-wi-stats-overview-stat {
  border-radius: var(--raio-grande) !important;
  box-shadow: var(--sombra-pequena) !important;
}

.fi-ta-ctn {
  border-radius: var(--raio-grande) !important;
}

.fi-badge {
  border-radius: var(--raio-pequeno) !important;
}

/* Foco visível com a cor de foco do Design System, para quem navega pelo teclado. */
.fi-btn:focus-visible,
.fi-input:focus-visible,
a:focus-visible {
  outline: 2px solid var(--foco);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .fi-body * {
    transition: none !important;
    animation: none !important;
  }
}