/*
 * Painel · estilos de portal ADM: Módulos (A4) e Fábrica (A7) — pacote C1.
 * Mesmas regras do painel.css: só layout, tudo com var(--token); nada de cor escrita à mão, de @font-face ou de @import.
 * Este arquivo é só do pacote: o painel.css fica para o que é de todos.
 */

/* ---------- Módulos ---------- */
.mod-secao { display: flex; flex-direction: column; gap: var(--espaco-3); }
.mod-secao-titulo { margin: 0; font: 600 13px/16px var(--font-texto); letter-spacing: .06em; text-transform: uppercase; color: var(--texto-2); }
.mod-filtros { display: flex; flex-wrap: wrap; gap: var(--espaco-3); align-items: flex-end; }
.mod-lista { display: flex; flex-direction: column; gap: var(--espaco-3); }
.mod-id { font-family: var(--font-mono); font-weight: 700; white-space: nowrap; }
.mod-acoes { display: flex; flex-wrap: wrap; gap: var(--espaco-1) var(--espaco-3); align-items: center; }
.mod-saude { display: flex; flex-direction: column; align-items: flex-start; gap: var(--espaco-1); }
.mod-saude .suave { font-size: var(--texto-pequeno, 0.8125rem); }

/* Carregando */
.mod-blocos { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--espaco-3); }
.mod-linha-100 { width: 100%; }
.mod-linha-85 { width: 85%; }
.mod-linha-70 { width: 70%; }

/* Diálogos de ação */
.mod-dialogo { max-height: 90vh; overflow: auto; }
.mod-dialogo-texto { margin: 0; color: var(--texto); overflow-wrap: anywhere; }
.mod-dialogo .ui-campo select, .mod-dialogo .ui-campo textarea { width: 100%; box-sizing: border-box; }

/* ---------- Fábrica: registrar e etiqueta lado a lado, uma coluna no celular ---------- */
.mod-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); gap: var(--espaco-6); align-items: start; }
.mod-grade > * { min-width: 0; }
.mod-grade .ui-campo textarea { width: 100%; box-sizing: border-box; }
.mod-grade .ui-etiqueta { max-width: 100%; }

/* O menu de baixo do portal ganhou um sétimo item (Módulos): letra menor para os nomes mais longos não se encostarem. */
.ui-nav-baixo:has(a[href="#/plataforma/modulos"]) a { font-size: 10px; letter-spacing: 0; padding-inline: 1px; }

@media (max-width: 719.98px) {
  /* A coluna das ações não cabe ao lado do rótulo: vai para a linha de baixo. */
  .tabela-cartoes td:not([data-rotulo]):has(.mod-acoes) { flex-direction: column; align-items: flex-start; text-align: left; }
}