/* 64 Inteligente — "Mesa de operação" (DESIGN.md, nov/2026).
   Camada final: tira os enfeites (selos, cartões decorativos, faixas coloridas, maiúsculas gritadas)
   e organiza as telas como software de trabalho: cabeçalho de uma linha, réguas finas, números em mono. */

:root {
  --rule: var(--border);
  --rule-strong: var(--border-strong);
  --fs-page: 22px;
}

/* ───────── Estrutura ───────── */
.workspace { background: var(--bg) !important; }
.topbar {
  height: 48px !important; min-height: 48px !important; padding: 0 var(--s6) !important;
  background: var(--bg) !important; border-bottom: 1px solid var(--rule) !important; backdrop-filter: none !important;
}
.breadcrumb, #breadcrumb-page {
  font-size: 13px !important; letter-spacing: 0 !important; text-transform: none !important;
  color: var(--text-2) !important; font-weight: 500 !important;
}
.user-chip { gap: var(--s2) !important; font-size: 13px; color: var(--text-2); background: transparent !important; border: 0 !important; }
.user-chip .avatar { width: 24px !important; height: 24px !important; font-size: 11px !important; border-radius: 50% !important; }
.online-dot, .live-tag, .pulse { display: none !important; }
.content { padding: var(--s6) var(--s6) var(--s7) !important; max-width: 1360px; }

/* ───────── Barra lateral ───────── */
.sidebar { padding: var(--s4) var(--s3) !important; gap: 0 !important; }
.brand {
  display: flex !important; align-items: center; gap: 10px; padding: 6px 8px 18px !important; margin: 0 !important;
  background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
}
.brand-logo-img { width: 28px !important; height: 28px !important; border-radius: 4px !important; }
.brand-copy {
  font-family: var(--font-display) !important; font-stretch: 87.5%; font-weight: 700 !important; font-size: 15px !important;
  letter-spacing: 0 !important; text-transform: none !important; color: var(--text) !important; line-height: 1.15;
}
.brand-copy small {
  display: block; font-family: var(--font-body) !important; font-weight: 400; font-size: 12px !important;
  letter-spacing: 0 !important; text-transform: none !important; color: var(--text-3) !important;
}
.sidebar nav { display: flex; flex-direction: column; gap: 1px; }
.side-label {
  margin: 18px 8px 6px !important; padding: 0 !important; font-size: 11px !important; letter-spacing: .08em !important;
  text-transform: uppercase; color: var(--text-3) !important; font-weight: 600 !important;
}
.nav-item { height: 32px !important; min-height: 32px !important; padding: 0 8px !important; gap: 10px !important; font-weight: 450; }
.nav-icon { width: 16px; text-align: center; font-size: 13px !important; }
.nav-count { margin-left: auto; font-family: var(--font-mono); font-size: 12px; color: var(--text-3); font-variant-numeric: tabular-nums; }
.nav-item.active .nav-count { color: var(--text-2); }
.sidebar-bottom { border-top: 1px solid var(--rule) !important; padding-top: var(--s3) !important; }
.logout {
  background: transparent !important; border: 0 !important; color: var(--text-3) !important; font-size: 13px !important;
  padding: 6px 8px !important; text-align: left; width: 100%; cursor: pointer; border-radius: var(--r-md);
}
.logout:hover { color: var(--text) !important; background: var(--surface) !important; }

/* ───────── Cabeçalho de página: título, uma linha de contexto, ações à direita ───────── */
.page-heading, .macos-page-heading {
  display: flex !important; align-items: flex-end !important; justify-content: space-between !important; gap: var(--s4) !important;
  flex-wrap: wrap; margin: 0 0 var(--s5) !important; padding: 0 0 var(--s4) !important;
  border-bottom: 1px solid var(--rule) !important; background: transparent !important;
}
.page-heading h1, .macos-title {
  font-family: var(--font-display) !important; font-stretch: 87.5%; font-size: var(--fs-page) !important;
  font-weight: 700 !important; line-height: 1.15 !important; margin: 0 !important; color: var(--text) !important; letter-spacing: -0.005em !important;
}
.page-heading h1 em, .macos-title em { font-style: normal; color: var(--text) !important; }
.page-heading .subheading, .macos-subtitle {
  margin: 4px 0 0 !important; font-size: 13px !important; color: var(--text-2) !important; max-width: 72ch; line-height: 1.45;
}
.page-heading .eyebrow, .macos-crumb-tag, .period-badge, .macos-header-stat { display: none !important; }
.page-actions { display: flex; gap: var(--s2); align-items: center; }
#member-count { font-family: var(--font-mono); color: var(--text); font-variant-numeric: tabular-nums; }

/* Selo vira anotação: texto discreto, sem caixa nem maiúsculas */
.status-pill {
  background: transparent !important; border: 0 !important; padding: 0 !important; border-radius: 0 !important;
  font-family: var(--font-body) !important; font-size: 12px !important; font-weight: 500 !important;
  letter-spacing: 0 !important; text-transform: none !important; color: var(--text-3) !important; box-shadow: none !important;
}

/* Avisos informativos: uma linha de texto com régua, sem ícone em caixa */
.privacy-banner, .demo-banner {
  background: transparent !important; border: 0 !important; border-top: 1px solid var(--rule) !important; border-bottom: 1px solid var(--rule) !important;
  border-radius: 0 !important; padding: 10px 0 !important; box-shadow: none !important; gap: 0 !important; margin-bottom: var(--s5) !important;
}
.privacy-banner > span:first-child, .demo-banner .banner-icon { display: none !important; }
.privacy-banner b { color: var(--text) !important; font-weight: 600; margin-right: 6px; }
.privacy-banner small, .privacy-banner div { color: var(--text-2) !important; font-size: 13px !important; display: inline !important; }

/* ───────── Visão geral ───────── */
.ops-block { margin: 0 0 var(--s6); }
.ops-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--s3); flex-wrap: wrap;
  padding-bottom: 8px; border-bottom: 1px solid var(--rule-strong);
}
.ops-head h2 {
  margin: 0; font-family: var(--font-body) !important; font-stretch: normal; font-size: 13px !important; font-weight: 600 !important;
  color: var(--text) !important; letter-spacing: 0 !important;
}
.ops-meta { display: flex; gap: var(--s3); align-items: baseline; font-size: 12px; color: var(--text-3); }
.ops-meta #current-period::first-letter { text-transform: uppercase; }
.ops-flag { color: var(--warn); }
.ops-flag.hidden { display: none !important; }

.todo-list { list-style: none; margin: 0; padding: 0; }
.todo-list li { border-bottom: 1px solid var(--rule); }
.todo-list button {
  width: 100%; display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: baseline; gap: var(--s4);
  padding: 12px 4px; background: transparent; border: 0; color: var(--text); text-align: left; cursor: pointer; font: inherit;
  transition: background var(--ease);
}
.todo-list button:hover { background: var(--surface); }
.todo-list b {
  font-family: var(--font-mono); font-weight: 500; font-size: 22px; line-height: 1; text-align: right;
  font-variant-numeric: tabular-nums; color: var(--text);
}
.todo-list span { font-size: 14px; color: var(--text); }
.todo-list i { font-style: normal; font-size: 12px; color: var(--text-3); }
.todo-list button:hover i { color: var(--accent-text); }
.todo-list li:not(.is-zero) b { color: var(--warn); }
.todo-list li.is-zero b, .todo-list li.is-zero span { color: var(--text-3); }

.kpi-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 0; border-bottom: 1px solid var(--rule); }
.kpi-strip > div { padding: 14px 16px 14px 0; min-width: 0; }
.kpi-strip > div + div { padding-left: 16px; border-left: 1px solid var(--rule); }
.kpi-strip dt { font-size: 12px; color: var(--text-3); margin: 0 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-strip dd {
  margin: 0; font-family: var(--font-mono); font-size: 20px; font-weight: 500; color: var(--text);
  font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
@media (max-width: 1100px) {
  .kpi-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kpi-strip > div:nth-child(4) { padding-left: 0; border-left: 0; }
  .kpi-strip > div:nth-child(n+4) { border-top: 1px solid var(--rule); }
}

/* Alertas como lista de trabalho */
.alert-center-card { background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
.seg { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid var(--rule); border-radius: var(--r-md); background: var(--bg); }
.seg button, .alert-tab-btn {
  border: 0 !important; background: transparent !important; color: var(--text-2) !important; font-size: 12px !important;
  padding: 4px 10px !important; border-radius: 4px !important; cursor: pointer; box-shadow: none !important; font-weight: 500;
}
.seg button.active, .alert-tab-btn.active { background: var(--surface-2) !important; color: var(--text) !important; }
.tab-badge { background: transparent !important; color: var(--text-3) !important; font-family: var(--font-mono); padding: 0 0 0 4px !important; border: 0 !important; }
.alert-toolbar { display: flex; gap: var(--s3); align-items: center; flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--rule); background: transparent !important; border-radius: 0 !important; }
.alert-search { flex: 1 1 260px; min-width: 0; height: 32px; padding: 0 10px !important; }
.alert-category-pills { display: flex; gap: 4px; flex-wrap: wrap; }
.alert-pill {
  background: transparent !important; border: 1px solid transparent !important; color: var(--text-2) !important;
  border-radius: 4px !important; font-size: 12px !important; padding: 4px 8px !important; cursor: pointer;
}
.alert-pill:hover { color: var(--text) !important; }
.alert-pill.active { border-color: var(--rule-strong) !important; color: var(--text) !important; background: var(--surface) !important; }
.alert-list-container { max-height: 520px; overflow: auto; display: block !important; gap: 0 !important; padding: 0 !important; }
.alert-card {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s4); align-items: center;
  padding: 12px 4px !important; margin: 0 !important; background: transparent !important; border: 0 !important;
  border-bottom: 1px solid var(--rule) !important; border-radius: 0 !important; box-shadow: none !important;
}
.alert-card:hover { background: var(--surface) !important; }
.alert-card-top { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.alert-badge {
  background: transparent !important; border: 0 !important; padding: 0 !important; font-size: 12px !important; font-weight: 600 !important;
  min-width: 78px; letter-spacing: 0 !important; text-transform: none !important;
}
.alert-badge::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; background: currentColor; }
.alert-card.urgent .alert-badge { color: var(--danger) !important; }
.alert-card.attention .alert-badge { color: var(--warn) !important; }
.alert-card.info .alert-badge { color: var(--text-3) !important; }
.alert-card-title { font-size: 14px !important; font-weight: 500 !important; color: var(--text) !important; }
.alert-entity-name { font-size: 13px !important; color: var(--text-2) !important; background: transparent !important; border: 0 !important; padding: 0 !important; }
.alert-card-desc { margin: 2px 0 0 88px !important; font-size: 13px !important; color: var(--text-2) !important; }
.alert-normative-box {
  margin: 2px 0 0 88px !important; padding: 0 !important; background: transparent !important; border: 0 !important;
  font-size: 12px !important; color: var(--text-3) !important;
}
.alert-normative-box:empty { display: none; }
.alert-btn-action {
  background: transparent !important; border: 1px solid var(--rule-strong) !important; color: var(--text) !important;
  font-size: 12px !important; padding: 5px 10px !important; border-radius: var(--r-md) !important; white-space: nowrap; box-shadow: none !important;
}
.alert-btn-action:hover { border-color: var(--text-3) !important; }
.alert-empty-state { padding: 24px 4px !important; color: var(--text-3) !important; font-size: 13px; background: transparent !important; border: 0 !important; text-align: left !important; }

/* Assistente e coluna lateral */
.main-grid { margin-top: 0 !important; gap: var(--s5) !important; }
.chat-card { padding: var(--s4) !important; }
.card-heading { padding: 0 0 var(--s3) !important; border-bottom: 1px solid var(--rule); margin-bottom: var(--s3); gap: 0 !important; }
.card-heading h2 { font-family: var(--font-body) !important; font-stretch: normal; font-size: 14px !important; font-weight: 600 !important; margin: 0 0 2px !important; }
.card-heading p { font-size: 13px !important; color: var(--text-2) !important; margin: 0 !important; }
.secure-label, .assistant-avatar, .composer-foot i { display: none !important; }
.suggestions { gap: 6px !important; }
.suggestions button {
  background: transparent !important; border: 1px solid var(--rule-strong) !important; color: var(--text-2) !important;
  border-radius: var(--r-md) !important; font-size: 12px !important; padding: 5px 10px !important;
}
.suggestions button:hover { color: var(--text) !important; border-color: var(--text-3) !important; }
.rail-card { padding: var(--s4) !important; }
.rail-title {
  font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important;
  color: var(--text) !important; margin-bottom: var(--s2) !important;
}
.rail-card p { font-size: 13px; color: var(--text-2); }
.rail-note { font-size: 12px; color: var(--text-3); line-height: 1.5; margin: var(--s3) 0 0; }
.activity-item b { font-weight: 500; }
footer { display: none !important; }

/* ───────── Tabelas e filtros (associados, processos) ───────── */
.macos-table-toolbar {
  background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 0 var(--s3) !important; box-shadow: none !important;
}
.macos-count-pill { background: transparent !important; border: 0 !important; color: var(--text-3) !important; font-size: 12px !important; }
.search-kbd { display: none !important; }
.macos-table-container, .macos-table-wrap, .proc-table-wrap {
  border-radius: var(--r-md) !important; box-shadow: none !important;
}
.data-table th, .macos-table th {
  text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; font-weight: 500 !important; color: var(--text-3) !important;
}

/* Processos: a situação já está na coluna própria; sem faixa colorida na linha */
.proc-row td:first-child { box-shadow: none !important; }
.proc-legend { display: none !important; }
.proc-chips, .proc-status-chips { flex-wrap: nowrap !important; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.proc-chip { flex: none; border-radius: 4px !important; font-size: 12px !important; padding: 4px 8px !important; }
.proc-detail-head { border-left-width: 1px !important; border-left-color: var(--proc-line, var(--border)) !important; }

/* ───────── Cartões de conteúdo: só onde agrupam uma tarefa ───────── */
.module-card { border-radius: var(--r-md) !important; padding: var(--s4) !important; }
.module-card-head { gap: var(--s2) var(--s4) !important; padding-bottom: var(--s3); margin-bottom: var(--s3); border-bottom: 1px solid var(--rule); }
.module-card-head h2 { font-family: var(--font-body) !important; font-stretch: normal; font-size: 14px !important; font-weight: 600 !important; margin: 0 0 2px !important; }
.module-card-head p { font-size: 13px !important; color: var(--text-2) !important; margin: 0 !important; }
.metric-card { border-radius: var(--r-md) !important; }
.metric-top { text-transform: none !important; letter-spacing: 0 !important; }
.integration-symbol { border-radius: var(--r-md) !important; font-family: var(--font-mono) !important; }

/* Abas */
.doc-tabs button, .documents-tabs button, [role="tab"] { letter-spacing: 0 !important; }

/* Login */
.login-card h1 { font-size: 24px !important; margin: var(--s4) 0 4px !important; }
.login-card .muted { margin-bottom: var(--s5) !important; }

/* Celular */
@media (max-width: 800px) {
  .content { padding: var(--s4) var(--s4) var(--s6) !important; }
  .topbar { padding: 0 var(--s4) !important; }
  .side-label, .nav-count { display: none !important; }
  .kpi-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-strip > div { padding-left: 0 !important; border-left: 0 !important; border-top: 1px solid var(--rule); }
  .todo-list button { grid-template-columns: 52px minmax(0, 1fr); }
  .todo-list i { display: none; }
  .alert-card { grid-template-columns: 1fr; }
  .alert-card-desc, .alert-normative-box { margin-left: 0 !important; }
}
.sidebar-bottom .connection { display: none !important; }
.nav-count { background: transparent !important; border: 0 !important; padding: 0 !important; }
.alert-card-desc, .alert-normative-box { margin-left: 0 !important; max-width: 90ch; }
.alert-badge { min-width: 0; }
.alert-entity-name::before { content: "· "; color: var(--text-3); }
.message-meta, .meta-dot { letter-spacing: 0 !important; text-transform: none !important; }
.meta-dot { display: none !important; }

/* Cabeçalhos de tabela em caixa normal */
.macos-data-table th, .macos-data-table thead th {
  text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; font-weight: 500 !important; color: var(--text-3) !important;
}
.macos-table-card, .macos-table-wrapper { border-radius: var(--r-md) !important; box-shadow: none !important; }
.user-avatar-micro { width: 26px !important; height: 26px !important; font-size: 10px !important; }

/* Documentos: ação principal no tamanho do texto */
.word-template-upload .import-button, .word-template-upload .button.primary { justify-self: start; width: auto !important; padding-left: 18px !important; padding-right: 18px !important; }
.nav-icon { display: inline-flex !important; align-items: center; justify-content: center; width: 16px; height: 16px; }
.nav-svg { width: 16px; height: 16px; display: block; }
@media (max-width: 800px) { .nav-svg { width: 18px; height: 18px; } }

/* Ficha do associado: faixa de indicadores em vez de mosaico de cartões */
.detail-topbar { background: transparent !important; border: 0 !important; padding: 0 0 var(--s3) !important; border-radius: 0 !important; }
.detail-hero-banner { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--rule) !important; border-radius: 0 !important; padding: 0 0 var(--s4) !important; box-shadow: none !important; }
.detail-hero-fullname { font-size: var(--fs-page) !important; }
.macos-kpi-summary-grid {
  display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 0 !important;
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); margin-bottom: var(--s5) !important;
}
.macos-kpi-box { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 14px 16px !important; box-shadow: none !important; }
.macos-kpi-box + .macos-kpi-box { border-left: 1px solid var(--rule) !important; }
.kpi-box-label { text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; color: var(--text-3) !important; font-weight: 500 !important; }
.kpi-box-val { font-size: 18px !important; color: var(--text) !important; }
.kpi-box-sub { font-size: 12px !important; color: var(--text-3) !important; }
.kpi-pill-tag { background: transparent !important; border: 0 !important; color: var(--text-3) !important; text-transform: none !important; letter-spacing: 0 !important; }
.kpi-dot-indicator { font-size: 8px !important; }
@media (max-width: 900px) {
  .macos-kpi-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .macos-kpi-box:nth-child(3) { border-left: 0 !important; }
  .macos-kpi-box:nth-child(n+3) { border-top: 1px solid var(--rule) !important; }
}
.detail-segmented-nav { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--rule) !important; border-radius: 0 !important; padding: 0 !important; }
.segment-badge { background: transparent !important; border: 0 !important; font-family: var(--font-mono); color: var(--text-3) !important; }
@media (max-width: 800px) {
  .page-heading, .macos-page-heading { flex-direction: column !important; align-items: stretch !important; text-align: left !important; }
  .page-heading > div, .macos-page-heading > div { text-align: left !important; width: 100%; }
  .page-actions { justify-content: flex-start; }
}