/* ═══════════════════════════════════════════════════════════════
   EMITTO Design System — emitto-ds.css
   Carregado por último no _Layout. Centraliza tokens, a assinatura
   visual "EMITTO FLOW" e os componentes (prefixo .emt-).
   Também remapeia os tokens legados (--primary, --secondary,
   --coral-action…) para que todas as telas antigas herdem a nova
   identidade sem alteração individual.
   Regra: nenhuma cor/raio/sombra hardcoded fora deste bloco de tokens.
═══════════════════════════════════════════════════════════════ */

/* ─── 1. TOKENS ──────────────────────────────────────────────── */
:root {
  /* Marca */
  --emitt-navy-950: #071A33;
  --emitt-navy-900: #0B2948;
  --emitt-navy-800: #0F3B68;
  --emitt-blue-700: #1D4ED8;
  --emitt-blue-600: #2563EB;
  --emitt-emerald:  #10B981;
  --emitt-teal:     #14B8A6;

  /* Semânticos */
  --emitt-primary:        var(--emitt-blue-600);
  --emitt-primary-dark:   var(--emitt-blue-700);
  --emitt-primary-soft:   #E8F0FE;
  --emitt-primary-ring:   rgba(37, 99, 235, .18);
  --emitt-success:        #059669;
  --emitt-success-soft:   #E3F7EF;
  --emitt-warning:        #B45309;
  --emitt-warning-soft:   #FEF4E2;
  --emitt-danger:         #DC2626;
  --emitt-danger-soft:    #FDECEC;
  --emitt-info:           var(--emitt-blue-600);
  --emitt-info-soft:      #E8F0FE;
  --emitt-violet:         #7C3AED;
  --emitt-violet-soft:    #F1EAFE;
  --emitt-neutral-soft:   #EEF2F7;
  --emitt-cancel:         #C98080;

  /* Superfícies e texto */
  --emitt-background:     #F4F8FC;
  --emitt-background-alt: #F8FAFC;
  --emitt-surface:        #FFFFFF;
  --emitt-surface-sunken: #F6F9FC;
  --emitt-border:         #DCE6F0;
  --emitt-border-soft:    #EAF0F6;
  --emitt-text:           #102A43;
  --emitt-muted:          #64748B;
  --emitt-subtle:         #94A3B8;
  --emitt-on-primary:     #FFFFFF;

  /* Sidebar */
  --emitt-sidebar-bg:      var(--emitt-navy-950);
  --emitt-sidebar-bg-2:    var(--emitt-navy-900);
  --emitt-sidebar-text:    #A9BCD3;
  --emitt-sidebar-strong:  #FFFFFF;
  --emitt-sidebar-hover:   rgba(255, 255, 255, .06);
  --emitt-sidebar-active:  rgba(37, 99, 235, .22);
  --emitt-sidebar-label:   #5F7A98;
  --emitt-sidebar-line:    rgba(255, 255, 255, .07);
  --emitt-sidebar-width:   244px;
  --emitt-sidebar-mini:    72px;

  /* Gradiente da marca (assinatura azul → verde) */
  --emitt-gradient: linear-gradient(120deg, var(--emitt-blue-600) 0%, var(--emitt-teal) 70%, var(--emitt-emerald) 100%);
  --emitt-gradient-deep: linear-gradient(135deg, var(--emitt-navy-950) 0%, var(--emitt-navy-800) 60%, #0E5A7A 100%);

  /* Espaçamento (escala 4px) */
  --emitt-space-1: 4px;
  --emitt-space-2: 8px;
  --emitt-space-3: 12px;
  --emitt-space-4: 16px;
  --emitt-space-5: 20px;
  --emitt-space-6: 24px;
  --emitt-space-8: 32px;
  --emitt-space-10: 40px;

  /* Raios */
  --emitt-radius-sm: 8px;
  --emitt-radius-md: 12px;
  --emitt-radius-lg: 16px;
  --emitt-radius-xl: 22px;
  --emitt-radius-pill: 999px;

  /* Sombras — discretas, azuladas */
  --emitt-shadow-xs: 0 1px 2px rgba(16, 42, 67, .05);
  --emitt-shadow-sm: 0 1px 3px rgba(16, 42, 67, .06), 0 1px 2px rgba(16, 42, 67, .04);
  --emitt-shadow-md: 0 8px 24px -8px rgba(16, 42, 67, .14);
  --emitt-shadow-lg: 0 20px 48px -16px rgba(7, 26, 51, .28);
  --emitt-shadow-focus: 0 0 0 3px var(--emitt-primary-ring);

  /* Tipografia */
  --emitt-font: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --emitt-font-mono: ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --emitt-text-xs: .72rem;
  --emitt-text-sm: .8125rem;
  --emitt-text-md: .875rem;
  --emitt-text-lg: 1rem;
  --emitt-text-xl: 1.25rem;
  --emitt-text-2xl: 1.6rem;
  --emitt-text-3xl: 2rem;

  /* Transições */
  --emitt-ease: cubic-bezier(.2, .8, .2, 1);
  --emitt-fast: 120ms;
  --emitt-base: 180ms;
  --emitt-slow: 320ms;

  /* Camadas */
  --emitt-z-topbar: 1020;
  --emitt-z-sidebar: 1030;
  --emitt-z-overlay: 1040;
  --emitt-z-palette: 1060;
  --emitt-z-toast: 1090;

  /* EMITTO FLOW — curvas de assinatura (SVG inline, sem requisição extra).
     Três arcos paralelos, derivados do "fluxo" da emissão. */
  --emitt-flow-lines: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 240' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' x2='1'%3E%3Cstop offset='0' stop-color='%232563EB'/%3E%3Cstop offset='1' stop-color='%2310B981'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' stroke='url(%23g)' stroke-linecap='round'%3E%3Cpath d='M0 200 C150 200 220 60 380 60 S560 120 600 40' stroke-width='2' opacity='.55'/%3E%3Cpath d='M0 222 C160 222 240 92 395 92 S565 150 600 72' stroke-width='1.5' opacity='.35'/%3E%3Cpath d='M0 240 C170 240 258 124 410 124 S570 180 600 104' stroke-width='1' opacity='.22'/%3E%3C/g%3E%3C/svg%3E");
  --emitt-flow-lines-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 240' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-linecap='round'%3E%3Cpath d='M0 200 C150 200 220 60 380 60 S560 120 600 40' stroke-width='2' opacity='.22'/%3E%3Cpath d='M0 222 C160 222 240 92 395 92 S565 150 600 72' stroke-width='1.5' opacity='.14'/%3E%3Cpath d='M0 240 C170 240 258 124 410 124 S570 180 600 104' stroke-width='1' opacity='.09'/%3E%3C/g%3E%3C/svg%3E");
}

/* Dark mode — arquitetura pronta. Ativado por [data-theme="dark"] no <html>.
   (Nem todas as telas legadas foram revisadas para o modo escuro ainda.) */
:root[data-theme="dark"] {
  --emitt-primary:        #3B82F6;
  --emitt-primary-dark:   #2563EB;
  --emitt-primary-soft:   rgba(59, 130, 246, .14);
  --emitt-primary-ring:   rgba(59, 130, 246, .3);
  --emitt-success:        #34D399;
  --emitt-success-soft:   rgba(16, 185, 129, .14);
  --emitt-warning:        #FBBF24;
  --emitt-warning-soft:   rgba(251, 191, 36, .12);
  --emitt-danger:         #F87171;
  --emitt-danger-soft:    rgba(248, 113, 113, .12);
  --emitt-info-soft:      rgba(59, 130, 246, .14);
  --emitt-violet:         #A78BFA;
  --emitt-violet-soft:    rgba(167, 139, 250, .14);
  --emitt-neutral-soft:   rgba(148, 163, 184, .12);
  --emitt-cancel:         #E0A3A3;
  --emitt-background:     #06121F;
  --emitt-background-alt: #081728;
  --emitt-surface:        #0C1D31;
  --emitt-surface-sunken: #0A1929;
  --emitt-border:         #1B3350;
  --emitt-border-soft:    #16293F;
  --emitt-text:           #E6EEF7;
  --emitt-muted:          #93A7BF;
  --emitt-subtle:         #6B819B;
  --emitt-sidebar-bg:     #040E1A;
  --emitt-sidebar-bg-2:   #071A33;
  --emitt-shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --emitt-shadow-md: 0 8px 24px -8px rgba(0, 0, 0, .5);
  --emitt-shadow-lg: 0 20px 48px -16px rgba(0, 0, 0, .6);
}

/* ─── 2. PONTE COM O TEMA LEGADO ────────────────────────────── */
/* panel-theme.css e as views antigas usam estes nomes. Remapeá-los
   aqui faz o sistema inteiro adotar a paleta EMITTO. */
.emitto-panel {
  --background: var(--emitt-background);
  --foreground: var(--emitt-text);
  --card: var(--emitt-surface);
  --border: var(--emitt-border);
  --muted: var(--emitt-surface-sunken);
  --muted-foreground: var(--emitt-muted);
  --primary: var(--emitt-navy-800);
  --secondary: var(--emitt-primary);
  --secondary-soft: var(--emitt-primary-soft);
  --coral: var(--emitt-danger);
  --coral-action: var(--emitt-danger);
  --coral-soft: var(--emitt-danger-soft);
  --positive: var(--emitt-success);
  --positive-soft: var(--emitt-success-soft);
  --warning: var(--emitt-warning);
  --warning-soft: var(--emitt-warning-soft);
  --sidebar: var(--emitt-sidebar-bg);
  --sidebar-foreground: var(--emitt-sidebar-strong);
  --sidebar-accent: var(--emitt-sidebar-active);
  --sidebar-muted: var(--emitt-sidebar-text);
  --sidebar-border: var(--emitt-sidebar-line);
  --overlay: rgba(7, 26, 51, .45);
  --radius: var(--emitt-radius-md);
  --card-shadow: var(--emitt-shadow-xs);
  --font-display: var(--emitt-font);
  --font-sans: var(--emitt-font);
  --sidebar-width: var(--emitt-sidebar-width);
  --emitto-teal: var(--emitt-emerald);
  --emitto-teal-dark: var(--emitt-success);
  --emitto-azul: var(--emitt-primary);
  --emitto-navy: var(--emitt-navy-900);
  --bs-primary: var(--emitt-primary);
  --bs-primary-rgb: 37, 99, 235;
  --bs-body-font-size: var(--emitt-text-md);
  --bs-emphasis-color: var(--emitt-text);
  --bs-secondary-color: var(--emitt-muted);
  --bs-tertiary-bg: var(--emitt-surface-sunken);
  font-family: var(--emitt-font);
  font-size: var(--emitt-text-md);
  background: var(--emitt-background);
  color: var(--emitt-text);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'cv11', 'ss01';
}

.emitto-panel :is(h1,h2,h3,h4,h5,h6,.card-header,.fw-nunito,.topbar-title,.dash-card .fs-5,.money-display) {
  font-family: var(--emitt-font);
  letter-spacing: -.015em;
}

/* Números tabulares — obrigatório em valores, datas, documentos, impostos. */
.emitto-panel :is(.table, .money-display, .emt-num, .emt-metric__value, input[type="number"], .font-mono, .badge, .emt-summary) {
  font-variant-numeric: tabular-nums;
}

/* ─── 3. SHELL: SIDEBAR ─────────────────────────────────────── */
.emitto-panel .emitto-sidebar {
  width: var(--emitt-sidebar-width);
  background:
    radial-gradient(120% 60% at 0% 100%, rgba(16, 185, 129, .10) 0%, transparent 55%),
    radial-gradient(90% 40% at 100% 0%, rgba(37, 99, 235, .16) 0%, transparent 60%),
    linear-gradient(180deg, var(--emitt-sidebar-bg) 0%, var(--emitt-sidebar-bg-2) 100%);
  border-right: 1px solid var(--emitt-sidebar-line);
  padding: 0 var(--emitt-space-3) var(--emitt-space-3);
  z-index: var(--emitt-z-sidebar);
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.12) transparent;
  transition: width var(--emitt-slow) var(--emitt-ease), transform var(--emitt-slow) var(--emitt-ease);
}
/* EMITTO FLOW na base da sidebar */
.emitto-panel .emitto-sidebar .emt-sidebar-flow {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 180px;
  background: var(--emitt-flow-lines) no-repeat bottom / 140% 100%;
  opacity: .35;
  pointer-events: none;
  z-index: 0;
}
.emitto-panel .emitto-sidebar > * { position: relative; z-index: 1; }

.emitto-panel .emitto-sidebar .brand {
  min-height: 68px;
  padding: var(--emitt-space-4) var(--emitt-space-2);
  margin-bottom: var(--emitt-space-2);
  gap: var(--emitt-space-3);
  border-bottom: 1px solid var(--emitt-sidebar-line);
  text-decoration: none;
}
.emitto-panel .emitto-sidebar .brand img {
  width: 32px; height: 32px;
  border-radius: var(--emitt-radius-sm);
  background: transparent;
  flex-shrink: 0;
}
.emitto-panel .emitto-sidebar .brand b {
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--emitt-sidebar-strong);
}
.emitto-panel .emitto-sidebar .brand b em {
  font-style: normal;
  background: var(--emitt-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.emitto-panel .emitto-sidebar .brand small {
  color: var(--emitt-sidebar-label);
  font-size: .68rem;
  letter-spacing: .02em;
}
.emitto-panel .sidebar-group-label {
  font-size: .66rem;
  font-weight: 600;
  letter-spacing: .12em;
  color: var(--emitt-sidebar-label);
  padding: var(--emitt-space-5) var(--emitt-space-3) var(--emitt-space-2);
  white-space: nowrap;
}
.emitto-panel .sidebar-link {
  position: relative;
  gap: var(--emitt-space-3);
  padding: 8px var(--emitt-space-3);
  margin: 1px 0;
  border: 0;
  border-radius: var(--emitt-radius-sm);
  color: var(--emitt-sidebar-text);
  font-size: var(--emitt-text-sm);
  font-weight: 500;
  white-space: nowrap;
  transition: background var(--emitt-base) var(--emitt-ease), color var(--emitt-base) var(--emitt-ease);
}
.emitto-panel .sidebar-link .ico {
  width: 20px;
  font-size: 1.05rem;
  display: inline-flex;
  justify-content: center;
  color: inherit;
  transition: transform var(--emitt-base) var(--emitt-ease);
}
.emitto-panel .sidebar-link .lbl { overflow: hidden; text-overflow: ellipsis; }
.emitto-panel .sidebar-link:hover {
  background: var(--emitt-sidebar-hover);
  color: var(--emitt-sidebar-strong);
  border-left-color: transparent;
}
.emitto-panel .sidebar-link:hover .ico { transform: translateX(1px); }
.emitto-panel .sidebar-link.active {
  background: var(--emitt-sidebar-active);
  color: var(--emitt-sidebar-strong);
  font-weight: 600;
}
/* Indicador ativo: filete com o gradiente da marca */
.emitto-panel .sidebar-link.active::before {
  content: '';
  position: absolute;
  left: -12px; top: 8px; bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--emitt-gradient);
}
.emitto-panel .sidebar-link.active .ico { color: #7FB0FF; }
.emitto-panel .sidebar-toggle.active { background: transparent; }
.emitto-panel .sidebar-toggle.active::before { display: none; }
.emitto-panel .sidebar-toggle.active .ico { color: var(--emitt-sidebar-strong); }
.emitto-panel .sidebar-link.sub {
  padding-left: 42px;
  font-size: .78rem;
}
.emitto-panel .sidebar-link.sub .ico { display: none; }
.emitto-panel .sidebar-link.sub.nested { padding-left: 54px; }
.emitto-panel .sidebar-submenu { position: relative; }
.emitto-panel .sidebar-submenu::before {
  content: '';
  position: absolute;
  left: 22px; top: 4px; bottom: 4px;
  width: 1px;
  background: var(--emitt-sidebar-line);
}
.emitto-panel .sidebar-link.sub.active { background: transparent; color: var(--emitt-sidebar-strong); }
.emitto-panel .sidebar-link.sub.active::before { left: 21px; top: 9px; bottom: 9px; width: 3px; border-radius: 3px; }
.emitto-panel .sidebar-link .chevron { font-size: .7rem; opacity: .6; }

.emitto-panel .sidebar-footer {
  margin: var(--emitt-space-4) 0 0;
  padding: var(--emitt-space-3);
  border: 1px solid var(--emitt-sidebar-line);
  border-radius: var(--emitt-radius-md);
  background: rgba(255, 255, 255, .03);
}
.emitto-panel .sidebar-footer .avatar-circle { background: var(--emitt-gradient); }
.emitto-panel .sidebar-footer .sidebar-logout {
  color: var(--emitt-sidebar-text);
  display: inline-flex;
  padding: 4px;
  border-radius: var(--emitt-radius-sm);
}
.emitto-panel .sidebar-footer .sidebar-logout:hover { color: #FCA5A5; background: var(--emitt-sidebar-hover); }

/* Botão recolher (desktop) */
.emt-collapse-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  margin-left: auto;
  border: 1px solid var(--emitt-sidebar-line);
  border-radius: var(--emitt-radius-sm);
  background: transparent;
  color: var(--emitt-sidebar-text);
  transition: background var(--emitt-base), color var(--emitt-base), transform var(--emitt-slow) var(--emitt-ease);
}
.emt-collapse-btn:hover { background: var(--emitt-sidebar-hover); color: #fff; }

@media (min-width: 992px) {
  .emt-collapse-btn { display: inline-flex; }
  .emitto-panel .emitto-content {
    margin-left: var(--emitt-sidebar-width);
    transition: margin-left var(--emitt-slow) var(--emitt-ease);
  }

  /* Sidebar recolhida: só ícones + tooltip */
  .emt-sidebar-collapsed .emitto-sidebar { width: var(--emitt-sidebar-mini); }
  .emt-sidebar-collapsed .emitto-content { margin-left: var(--emitt-sidebar-mini); }
  .emt-sidebar-collapsed .emitto-sidebar .brand { justify-content: center; padding-inline: 0; flex-wrap: wrap; }
  .emt-sidebar-collapsed .emitto-sidebar .brand > div,
  .emt-sidebar-collapsed .sidebar-link .lbl,
  .emt-sidebar-collapsed .sidebar-link .chevron,
  .emt-sidebar-collapsed .sidebar-link .nav-badge,
  .emt-sidebar-collapsed .sidebar-footer .info { display: none; }
  .emt-sidebar-collapsed .emt-collapse-btn { margin: 8px auto 0; transform: rotate(180deg); }
  .emt-sidebar-collapsed .sidebar-group-label { font-size: 0; padding: var(--emitt-space-3) 0 var(--emitt-space-1); }
  .emt-sidebar-collapsed .sidebar-group-label::after {
    content: ''; display: block; width: 18px; height: 1px; margin: 0 auto;
    background: var(--emitt-sidebar-line);
  }
  .emt-sidebar-collapsed .sidebar-link { justify-content: center; padding-inline: 0; }
  .emt-sidebar-collapsed .sidebar-submenu { display: none !important; }
  .emt-sidebar-collapsed .sidebar-footer { flex-direction: column; padding: var(--emitt-space-2) 0; }
  .emt-sidebar-collapsed .sidebar-link[data-label]:hover::after {
    content: attr(data-label);
    position: fixed;
    left: calc(var(--emitt-sidebar-mini) + 6px);
    margin-top: 0;
    padding: 6px 10px;
    border-radius: var(--emitt-radius-sm);
    background: var(--emitt-navy-900);
    color: #fff;
    font-size: var(--emitt-text-xs);
    font-weight: 500;
    box-shadow: var(--emitt-shadow-md);
    white-space: nowrap;
    pointer-events: none;
    animation: emt-fade-in var(--emitt-fast) var(--emitt-ease);
  }
}
@media (max-width: 991.98px) {
  .emitto-panel .emitto-sidebar { box-shadow: var(--emitt-shadow-lg); }
}

/* ─── 4. SHELL: TOPBAR ──────────────────────────────────────── */
.emitto-panel .emitto-topbar {
  display: flex;
  align-items: center;
  gap: var(--emitt-space-3);
  min-height: 64px;
  padding: 10px var(--emitt-space-6);
  background: color-mix(in srgb, var(--emitt-surface) 86%, transparent);
  backdrop-filter: saturate(1.4) blur(10px);
  -webkit-backdrop-filter: saturate(1.4) blur(10px);
  border-bottom: 1px solid var(--emitt-border-soft);
  z-index: var(--emitt-z-topbar);
}
.emitto-panel .emitto-topbar .btn-icon,
.emt-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px; height: 38px;
  flex-shrink: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--emitt-radius-sm);
  background: transparent;
  color: var(--emitt-muted);
  font-size: 1.1rem;
  position: relative;
  transition: background var(--emitt-base), color var(--emitt-base), border-color var(--emitt-base);
}
.emitto-panel .emitto-topbar .btn-icon:hover,
.emt-icon-btn:hover { background: var(--emitt-surface-sunken); color: var(--emitt-text); border-color: var(--emitt-border-soft); }
.emitto-panel .topbar-title {
  font-size: var(--emitt-text-md);
  font-weight: 600;
  color: var(--emitt-text);
  white-space: nowrap;
}
.emt-topbar-crumb { display: flex; align-items: center; gap: var(--emitt-space-2); min-width: 0; }
.emt-topbar-crumb .sep { color: var(--emitt-subtle); }
.emt-topbar-crumb .company {
  color: var(--emitt-muted);
  font-size: var(--emitt-text-sm);
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Busca global / paleta */
.emt-search-trigger {
  display: flex;
  align-items: center;
  gap: var(--emitt-space-2);
  flex: 0 1 380px;
  margin-left: auto;
  height: 38px;
  padding: 0 var(--emitt-space-3);
  border: 1px solid var(--emitt-border);
  border-radius: var(--emitt-radius-pill);
  background: var(--emitt-background-alt);
  color: var(--emitt-subtle);
  font-size: var(--emitt-text-sm);
  text-align: left;
  transition: border-color var(--emitt-base), box-shadow var(--emitt-base), background var(--emitt-base);
}
.emt-search-trigger:hover { border-color: var(--emitt-primary); background: var(--emitt-surface); }
.emt-search-trigger span { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.emt-kbd {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border: 1px solid var(--emitt-border);
  border-bottom-width: 2px;
  border-radius: 6px;
  background: var(--emitt-surface);
  color: var(--emitt-muted);
  font-size: .68rem;
  font-family: var(--emitt-font);
  font-weight: 600;
  line-height: 1.4;
}
.emt-topbar-actions { display: flex; align-items: center; gap: var(--emitt-space-1); }
.emt-status-dot {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--emitt-radius-pill);
  background: var(--emitt-success-soft);
  color: var(--emitt-success);
  font-size: var(--emitt-text-xs);
  font-weight: 600;
  white-space: nowrap;
}
.emt-status-dot::before {
  content: '';
  width: 7px; height: 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 20%, transparent);
}
.emt-user-btn {
  display: flex;
  align-items: center;
  gap: var(--emitt-space-2);
  padding: 3px 10px 3px 3px;
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-pill);
  background: var(--emitt-surface);
  color: var(--emitt-text);
  font-size: var(--emitt-text-sm);
  font-weight: 500;
  max-width: 240px;
  transition: border-color var(--emitt-base), box-shadow var(--emitt-base);
}
.emt-user-btn:hover { border-color: var(--emitt-border); box-shadow: var(--emitt-shadow-sm); }
.emt-user-btn .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emt-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--emitt-gradient);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  overflow: hidden;
}
.emt-avatar img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.emt-role-chip {
  padding: 2px 8px;
  border-radius: var(--emitt-radius-pill);
  background: var(--emitt-navy-900);
  color: #fff;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .08em;
}
@media (max-width: 767.98px) {
  .emitto-panel .emitto-topbar { padding-inline: var(--emitt-space-4); }
  .emt-search-trigger { flex: 0 0 38px; padding: 0; justify-content: center; }
  .emt-search-trigger span, .emt-search-trigger .emt-kbd { display: none; }
  .emt-user-btn .name, .emt-topbar-crumb .company, .emt-topbar-crumb .sep, .emt-status-dot { display: none; }
}

/* Menus (dropdown) — vidro discreto */
.emitto-panel .dropdown-menu {
  padding: 6px;
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-md);
  background: color-mix(in srgb, var(--emitt-surface) 94%, transparent);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--emitt-shadow-md);
  font-size: var(--emitt-text-sm);
}
.emitto-panel .dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border-radius: var(--emitt-radius-sm);
  color: var(--emitt-text);
}
.emitto-panel .dropdown-item > i { color: var(--emitt-muted); width: 16px; text-align: center; }
.emitto-panel .dropdown-item.text-danger > i,
.emitto-panel .dropdown-item.emt-danger, .emitto-panel .dropdown-item.emt-danger > i { color: var(--emitt-danger) !important; }
.emitto-panel .dropdown-item:is(:hover, :focus) { background: var(--emitt-surface-sunken); }
.emitto-panel .dropdown-item.emt-danger:is(:hover, :focus) { background: var(--emitt-danger-soft); }
.emitto-panel .dropdown-header { font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-subtle); padding: 6px 10px 4px; }
.emitto-panel .dropdown-divider { margin: 4px 0; border-color: var(--emitt-border-soft); }

/* ─── 5. ÁREA PRINCIPAL ─────────────────────────────────────── */
.emitto-panel .emitto-main {
  padding: var(--emitt-space-6) var(--emitt-space-8) var(--emitt-space-10) !important;
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
}
@media (max-width: 767.98px) {
  .emitto-panel .emitto-main { padding: var(--emitt-space-4) !important; }
}
.emitto-panel .footer {
  background: transparent;
  border-color: var(--emitt-border-soft) !important;
  color: var(--emitt-muted);
  font-size: var(--emitt-text-xs);
}

/* Page header legado (.page-header) — adota o visual do EmittoPageHeader */
.emitto-panel .page-header {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: var(--emitt-space-6);
}
.emitto-panel .page-header h5 {
  font-size: var(--emitt-text-xl);
  font-weight: 700;
  color: var(--emitt-text);
}

/* EmittoPageHeader */
.emt-page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--emitt-space-4);
  margin-bottom: var(--emitt-space-6);
}
.emt-page-header__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  color: var(--emitt-primary);
  font-size: var(--emitt-text-xs);
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.emt-page-header__eyebrow::before {
  content: '';
  width: 18px; height: 2px;
  border-radius: 2px;
  background: var(--emitt-gradient);
}
.emt-page-header__title {
  margin: 0;
  font-size: var(--emitt-text-2xl);
  font-weight: 700;
  letter-spacing: -.025em;
  color: var(--emitt-text);
}
.emt-page-header__subtitle { margin: 4px 0 0; color: var(--emitt-muted); font-size: var(--emitt-text-md); }
.emt-page-header__actions { display: flex; flex-wrap: wrap; gap: var(--emitt-space-2); }

/* ─── 6. CARDS ──────────────────────────────────────────────── */
.emitto-panel .card {
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-lg);
  background: var(--emitt-surface);
  box-shadow: var(--emitt-shadow-xs);
}
.emitto-panel .card-header {
  background: transparent;
  border-bottom: 1px solid var(--emitt-border-soft);
  padding: var(--emitt-space-4) var(--emitt-space-5);
  font-weight: 600;
  font-size: var(--emitt-text-md);
}
.emitto-panel .card-body { padding: var(--emitt-space-5); }
.emitto-panel .card > .table-responsive:last-child,
.emitto-panel .card > .table-responsive:last-child .table { border-radius: 0 0 var(--emitt-radius-lg) var(--emitt-radius-lg); }

.emt-card {
  position: relative;
  background: var(--emitt-surface);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-lg);
  box-shadow: var(--emitt-shadow-xs);
}
.emt-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--emitt-space-3);
  padding: var(--emitt-space-4) var(--emitt-space-5) 0;
}
.emt-card__title {
  margin: 0;
  font-size: var(--emitt-text-xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--emitt-muted);
}
.emt-card__body { padding: var(--emitt-space-4) var(--emitt-space-5) var(--emitt-space-5); }
.emt-card--interactive { transition: transform var(--emitt-base) var(--emitt-ease), box-shadow var(--emitt-base) var(--emitt-ease), border-color var(--emitt-base); }
.emt-card--interactive:hover { transform: translateY(-2px); box-shadow: var(--emitt-shadow-md); border-color: var(--emitt-border); }

/* Legacy dash-card: remove barra colorida pesada */
.emitto-panel .dash-card { border-top: 1px solid var(--emitt-border-soft); }

/* ─── 7. EmittoMetric ───────────────────────────────────────── */
.emt-metric {
  display: flex;
  flex-direction: column;
  gap: var(--emitt-space-3);
  height: 100%;
  padding: var(--emitt-space-5);
  overflow: hidden;
}
.emt-metric__top { display: flex; align-items: center; justify-content: space-between; gap: var(--emitt-space-2); }
.emt-metric__label {
  font-size: var(--emitt-text-xs);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--emitt-muted);
}
.emt-metric__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  border-radius: 10px;
  background: var(--tone-soft, var(--emitt-primary-soft));
  color: var(--tone, var(--emitt-primary));
  font-size: 1rem;
}
.emt-metric__value {
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.1;
  color: var(--emitt-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.emt-metric__value.is-negative { color: var(--emitt-danger); }
.emt-metric__foot { display: flex; align-items: center; gap: var(--emitt-space-2); font-size: var(--emitt-text-xs); color: var(--emitt-muted); min-height: 20px; }
.emt-trend {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 1px 7px;
  border-radius: var(--emitt-radius-pill);
  font-weight: 700;
  font-size: .7rem;
}
.emt-trend--up { background: var(--emitt-success-soft); color: var(--emitt-success); }
.emt-trend--down { background: var(--emitt-danger-soft); color: var(--emitt-danger); }
.emt-metric__spark { position: absolute; right: 0; bottom: 0; width: 55%; height: 44px; opacity: .9; pointer-events: none; }
.emt-tone-primary { --tone: var(--emitt-primary); --tone-soft: var(--emitt-primary-soft); }
.emt-tone-success { --tone: var(--emitt-success); --tone-soft: var(--emitt-success-soft); }
.emt-tone-warning { --tone: var(--emitt-warning); --tone-soft: var(--emitt-warning-soft); }
.emt-tone-danger  { --tone: var(--emitt-danger);  --tone-soft: var(--emitt-danger-soft); }
.emt-tone-violet  { --tone: var(--emitt-violet);  --tone-soft: var(--emitt-violet-soft); }

/* ─── 8. BOTÕES ─────────────────────────────────────────────── */
.emitto-panel .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: var(--emitt-radius-sm);
  font-weight: 600;
  font-size: var(--emitt-text-sm);
  transition: background-color var(--emitt-base), border-color var(--emitt-base), color var(--emitt-base), box-shadow var(--emitt-base), transform var(--emitt-fast);
}
.emitto-panel .btn > .me-1:first-child { margin-right: 0 !important; }
.emitto-panel .btn:active { transform: scale(.97); }
.emitto-panel .btn-sm { padding: 6px 12px; font-size: .78rem; }
.emitto-panel .btn.w-100 { display: flex; }
.emitto-panel :is(.btn-primary, .btn-emitto, .emt-btn--primary) {
  background: var(--emitt-primary) !important;
  border-color: var(--emitt-primary) !important;
  color: var(--emitt-on-primary) !important;
  box-shadow: 0 1px 2px rgba(29, 78, 216, .25), inset 0 1px 0 rgba(255, 255, 255, .12);
}
.emitto-panel :is(.btn-primary, .btn-emitto, .emt-btn--primary):hover {
  background: var(--emitt-primary-dark) !important;
  border-color: var(--emitt-primary-dark) !important;
  box-shadow: 0 6px 16px -6px rgba(37, 99, 235, .55);
  transform: none;
}
.emitto-panel .btn-success { background: var(--emitt-success) !important; border-color: var(--emitt-success) !important; color: #fff !important; }
.emitto-panel .btn-danger {
  --bs-btn-bg: var(--emitt-danger);
  --bs-btn-border-color: var(--emitt-danger);
  --bs-btn-hover-bg: #B91C1C;
  --bs-btn-hover-border-color: #B91C1C;
}
.emitto-panel :is(.btn-outline-secondary, .btn-secondary, .emt-btn--ghost) {
  --bs-btn-color: var(--emitt-text);
  --bs-btn-bg: var(--emitt-surface);
  --bs-btn-border-color: var(--emitt-border);
  --bs-btn-hover-color: var(--emitt-text);
  --bs-btn-hover-bg: var(--emitt-surface-sunken);
  --bs-btn-hover-border-color: var(--emitt-subtle);
  --bs-btn-active-bg: var(--emitt-neutral-soft);
  --bs-btn-active-color: var(--emitt-text);
  --bs-btn-active-border-color: var(--emitt-subtle);
  background: var(--bs-btn-bg);
  color: var(--bs-btn-color);
}
.emitto-panel :is(.btn-outline-primary, .btn-emitto-outline) {
  --bs-btn-color: var(--emitt-primary);
  --bs-btn-border-color: color-mix(in srgb, var(--emitt-primary) 40%, transparent);
  --bs-btn-hover-bg: var(--emitt-primary-soft);
  --bs-btn-hover-color: var(--emitt-primary-dark);
  --bs-btn-hover-border-color: var(--emitt-primary);
  border: 1px solid var(--bs-btn-border-color);
  color: var(--bs-btn-color);
  background: transparent;
}
.emitto-panel :is(.btn-outline-primary, .btn-emitto-outline):hover { background: var(--emitt-primary-soft); color: var(--emitt-primary-dark); }
.emitto-panel .emt-btn--gradient {
  background: var(--emitt-gradient) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 8px 20px -8px rgba(20, 184, 166, .6);
}
.emitto-panel .emt-btn--gradient:hover { filter: brightness(1.06); }
.emitto-panel .emt-btn--light {
  background: #fff;
  border: 0;
  color: var(--emitt-navy-900);
  box-shadow: 0 8px 20px -10px rgba(0, 0, 0, .5);
}
.emitto-panel .emt-btn--light:hover { background: #EEF5FF; color: var(--emitt-navy-950); }
.emt-btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: var(--emitt-radius-sm);
  background: transparent;
  color: var(--emitt-muted);
  transition: background var(--emitt-base), color var(--emitt-base), border-color var(--emitt-base);
}
.emt-btn-icon:hover, .emt-btn-icon[aria-expanded="true"] { background: var(--emitt-surface-sunken); border-color: var(--emitt-border-soft); color: var(--emitt-text); }

/* ─── 9. FORMULÁRIOS ────────────────────────────────────────── */
.emitto-panel :is(.form-control, .form-select) {
  min-height: 38px;
  border: 1px solid var(--emitt-border);
  border-radius: var(--emitt-radius-sm);
  background-color: var(--emitt-surface);
  color: var(--emitt-text);
  font-size: var(--emitt-text-md);
  transition: border-color var(--emitt-base), box-shadow var(--emitt-base);
}
.emitto-panel :is(.form-control, .form-select):hover:not(:disabled):not(:focus) { border-color: color-mix(in srgb, var(--emitt-border) 60%, var(--emitt-subtle)); }
.emitto-panel :is(.form-control-sm, .form-select-sm) { min-height: 34px; font-size: var(--emitt-text-sm); }
.emitto-panel :is(.form-control, .form-select):focus { border-color: var(--emitt-primary); box-shadow: var(--emitt-shadow-focus); }
.emitto-panel .form-control::placeholder { color: var(--emitt-subtle); }
.emitto-panel .form-label { font-size: var(--emitt-text-sm); font-weight: 500; color: var(--emitt-text); margin-bottom: 6px; }
.emitto-panel .input-group-text { border-color: var(--emitt-border); background: var(--emitt-surface-sunken) !important; color: var(--emitt-muted); }
.emitto-panel .form-check-input:checked { background-color: var(--emitt-primary); border-color: var(--emitt-primary); }
.emitto-panel .form-check-input:focus { box-shadow: var(--emitt-shadow-focus); }
.emitto-panel .is-invalid { border-color: var(--emitt-danger) !important; }
.emitto-panel .invalid-feedback, .emitto-panel .field-validation-error { color: var(--emitt-danger); font-size: var(--emitt-text-xs); }
.emitto-panel :is(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--emitt-primary); outline-offset: 2px; }

/* EmittoSearch (campo com ícone) */
.emt-search { position: relative; }
.emt-search > i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--emitt-subtle); pointer-events: none; }
.emt-search > .form-control { padding-left: 36px; }

/* EmittoFilter (barra de filtros) */
.emt-filterbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--emitt-space-3);
  padding: var(--emitt-space-4);
  margin-bottom: var(--emitt-space-4);
  background: var(--emitt-surface);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-lg);
}
.emt-filterbar .emt-field { display: flex; flex-direction: column; gap: 4px; }
.emt-filterbar .emt-field > label { font-size: .7rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--emitt-muted); }
.emt-filterbar .emt-grow { flex: 1 1 220px; }

/* Segmentos (Todas | Autorizadas | …) */
.emt-segments {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 2px;
  padding: 3px;
  margin-bottom: var(--emitt-space-4);
  background: var(--emitt-neutral-soft);
  border-radius: var(--emitt-radius-md);
}
.emt-segments button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--emitt-muted);
  font-size: var(--emitt-text-sm);
  font-weight: 600;
  transition: background var(--emitt-base), color var(--emitt-base), box-shadow var(--emitt-base);
}
.emt-segments button:hover { color: var(--emitt-text); }
.emt-segments button.is-active { background: var(--emitt-surface); color: var(--emitt-text); box-shadow: var(--emitt-shadow-sm); }
.emt-segments .count {
  min-width: 20px;
  padding: 0 6px;
  border-radius: var(--emitt-radius-pill);
  background: color-mix(in srgb, var(--emitt-muted) 14%, transparent);
  font-size: .68rem;
  font-variant-numeric: tabular-nums;
}
.emt-segments button.is-active .count { background: var(--emitt-primary-soft); color: var(--emitt-primary); }

/* ─── 10. TABELAS (EmittoTable) ─────────────────────────────── */
.emitto-panel .table {
  --bs-table-bg: transparent;
  --bs-table-hover-bg: var(--emitt-background-alt);
  --bs-table-border-color: var(--emitt-border-soft);
  margin-bottom: 0;
  font-size: var(--emitt-text-sm);
}
.emitto-panel .table > :not(caption) > * > * { padding: 12px 16px; }
.emitto-panel .table thead th {
  background: var(--emitt-surface-sunken);
  color: var(--emitt-muted);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--emitt-border-soft);
  padding-block: 10px;
}
.emitto-panel .table tbody tr { transition: background-color var(--emitt-fast); }
.emitto-panel .table tbody tr:last-child > * { border-bottom: 0; }
.emitto-panel .table-hover tbody tr:hover > * { --bs-table-bg-state: var(--emitt-background-alt); }
.emt-table tbody tr.is-selected > * { --bs-table-bg-state: var(--emitt-primary-soft); }
.emt-table tr[data-emt-href] { cursor: pointer; }
.emt-table .emt-cell-strong { font-weight: 600; color: var(--emitt-text); }
.emt-table .emt-cell-sub { display: block; font-size: var(--emitt-text-xs); color: var(--emitt-muted); }
.emt-table .emt-col-actions { width: 1%; white-space: nowrap; text-align: right; }
.emt-table .emt-row-actions { display: inline-flex; gap: 2px; align-items: center; opacity: .75; transition: opacity var(--emitt-base); }
.emt-table tr:hover .emt-row-actions, .emt-table .emt-row-actions:focus-within { opacity: 1; }
.emt-doc-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 6px;
  background: var(--emitt-neutral-soft);
  color: var(--emitt-navy-800);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .02em;
}
:root[data-theme="dark"] .emt-doc-chip { color: var(--emitt-text); }
.emt-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.emt-table-scroll .table { min-width: 720px; }

/* ─── 11. STATUS / BADGES (EmittoStatus, EmittoBadge) ───────── */
.emitto-panel .badge { font-weight: 600; letter-spacing: .02em; border-radius: var(--emitt-radius-pill); padding: .38em .7em; }
.emt-status,
.emitto-panel [class*="badge-"]:is(.badge-autorizada,.badge-pendente,.badge-cancelada,.badge-erro,.badge-rejeitada,.badge-processando,.badge-enviada,.badge-contingencia,.badge-aberto,.badge-recebido,.badge-pago,.badge-vencido,.badge-cancelado,.badge-estornado,.badge-rascunho,.badge-denegada,.badge-inutilizada) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px 3px 8px;
  border-radius: var(--emitt-radius-pill);
  background: var(--st-soft, var(--emitt-neutral-soft));
  color: var(--st, var(--emitt-muted));
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  white-space: nowrap;
}
.emt-status::before,
.emitto-panel :is(.badge-autorizada,.badge-pendente,.badge-cancelada,.badge-erro,.badge-rejeitada,.badge-processando,.badge-enviada,.badge-contingencia,.badge-aberto,.badge-recebido,.badge-pago,.badge-vencido,.badge-cancelado,.badge-estornado,.badge-rascunho,.badge-denegada,.badge-inutilizada)::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}
.emitto-panel :is(.badge-autorizada, .badge-recebido, .badge-pago, .emt-status--autorizada) { --st: var(--emitt-success); --st-soft: var(--emitt-success-soft); }
.emitto-panel :is(.badge-pendente, .badge-aberto, .badge-rascunho, .emt-status--pendente) { --st: var(--emitt-warning); --st-soft: var(--emitt-warning-soft); }
.emitto-panel :is(.badge-cancelada, .badge-cancelado, .badge-estornado, .badge-inutilizada, .emt-status--cancelada) { --st: #B45454; --st-soft: #F9EFEF; }
.emitto-panel :is(.badge-erro, .badge-rejeitada, .badge-vencido, .badge-denegada, .emt-status--rejeitada) { --st: var(--emitt-danger); --st-soft: var(--emitt-danger-soft); }
.emitto-panel :is(.badge-processando, .badge-enviada, .emt-status--processando) { --st: var(--emitt-primary); --st-soft: var(--emitt-primary-soft); }
.emitto-panel :is(.badge-contingencia, .emt-status--contingencia) { --st: var(--emitt-violet); --st-soft: var(--emitt-violet-soft); }
.emitto-panel .badge-processando::before, .emt-status--processando::before { animation: emt-pulse 1.4s ease-in-out infinite; }
:root[data-theme="dark"] .emitto-panel :is(.badge-cancelada,.badge-cancelado,.badge-estornado,.emt-status--cancelada) { --st: #F0A3A3; --st-soft: rgba(240,163,163,.1); }
.emitto-panel .badge-producao, .emitto-panel .badge-homologacao { border-radius: var(--emitt-radius-pill); }

/* ─── 12. ALERTAS / FEEDBACK ────────────────────────────────── */
.emitto-panel .alert {
  display: block;
  border: 1px solid transparent;
  border-radius: var(--emitt-radius-md);
  padding: 12px 16px;
  font-size: var(--emitt-text-sm);
}
.emitto-panel .alert-success { background: var(--emitt-success-soft); color: #065F46; border-color: color-mix(in srgb, var(--emitt-success) 20%, transparent); }
.emitto-panel .alert-danger  { background: var(--emitt-danger-soft); color: #991B1B; border-color: color-mix(in srgb, var(--emitt-danger) 20%, transparent); }
.emitto-panel .alert-warning { background: var(--emitt-warning-soft); color: #854D0E; border-color: color-mix(in srgb, var(--emitt-warning) 22%, transparent); }
.emitto-panel .alert-info    { background: var(--emitt-info-soft); color: var(--emitt-primary-dark); border-color: color-mix(in srgb, var(--emitt-primary) 18%, transparent); }
:root[data-theme="dark"] .emitto-panel :is(.alert-success,.alert-danger,.alert-warning,.alert-info) { color: var(--emitt-text); }

/* EmittoToast */
.emt-toast-stack {
  position: fixed;
  right: 20px; bottom: 20px;
  z-index: var(--emitt-z-toast);
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-width: min(380px, calc(100vw - 32px));
  pointer-events: none;
}
.emt-toast {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-md);
  background: color-mix(in srgb, var(--emitt-surface) 92%, transparent);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--emitt-shadow-lg);
  color: var(--emitt-text);
  font-size: var(--emitt-text-sm);
  pointer-events: auto;
  animation: emt-toast-in var(--emitt-slow) var(--emitt-ease);
}
.emt-toast.is-leaving { animation: emt-toast-out var(--emitt-base) var(--emitt-ease) forwards; }
.emt-toast__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; flex-shrink: 0;
  border-radius: 50%;
  background: var(--tone-soft); color: var(--tone);
}
.emt-toast__close { margin-left: auto; border: 0; background: none; color: var(--emitt-subtle); padding: 0 2px; }

/* Check animado (salvar / autorizar) */
.emt-check { width: 26px; height: 26px; }
.emt-check circle { stroke: currentColor; stroke-width: 2; fill: none; stroke-dasharray: 76; stroke-dashoffset: 76; animation: emt-draw 420ms var(--emitt-ease) forwards; }
.emt-check path { stroke: currentColor; stroke-width: 2.4; fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 20; stroke-dashoffset: 20; animation: emt-draw 300ms 280ms var(--emitt-ease) forwards; }

/* EmittoLoading */
.emt-loading { display: inline-flex; align-items: center; gap: 10px; color: var(--emitt-muted); font-size: var(--emitt-text-sm); }
.emt-spinner {
  width: 18px; height: 18px;
  border-radius: 50%;
  border: 2px solid var(--emitt-primary-soft);
  border-top-color: var(--emitt-primary);
  animation: emt-spin .7s linear infinite;
}
.emt-progress-bar {
  position: fixed; left: 0; top: 0; z-index: var(--emitt-z-toast);
  height: 2px; width: 0;
  background: var(--emitt-gradient);
  transition: width var(--emitt-slow) var(--emitt-ease), opacity var(--emitt-base);
}
.emt-skeleton {
  border-radius: var(--emitt-radius-sm);
  background: linear-gradient(90deg, var(--emitt-neutral-soft) 0%, var(--emitt-surface-sunken) 50%, var(--emitt-neutral-soft) 100%);
  background-size: 200% 100%;
  animation: emt-shimmer 1.2s linear infinite;
}

/* EmittoEmptyState */
.emt-empty {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--emitt-space-2);
  padding: var(--emitt-space-10) var(--emitt-space-6);
  text-align: center;
  overflow: hidden;
}
.emt-empty::before {
  content: '';
  position: absolute; inset: auto 0 0 0;
  height: 90px;
  background: var(--emitt-flow-lines) no-repeat bottom / 100% 100%;
  opacity: .25;
  pointer-events: none;
}
.emt-empty__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 52px; height: 52px;
  margin-bottom: var(--emitt-space-2);
  border-radius: 16px;
  background: var(--emitt-primary-soft);
  color: var(--emitt-primary);
  font-size: 1.4rem;
}
.emt-empty__title { font-weight: 600; color: var(--emitt-text); }
.emt-empty__text { max-width: 360px; color: var(--emitt-muted); font-size: var(--emitt-text-sm); }
.emt-empty .btn { position: relative; margin-top: var(--emitt-space-2); }

/* ─── 13. MODAIS / DRAWER ───────────────────────────────────── */
.emitto-panel .modal-backdrop.show { opacity: 1; background: rgba(7, 26, 51, .38); backdrop-filter: blur(3px); }
.emitto-panel .modal-content {
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-lg);
  box-shadow: var(--emitt-shadow-lg);
  overflow: hidden;
}
.emitto-panel .modal-header { padding: var(--emitt-space-4) var(--emitt-space-5); border-bottom-color: var(--emitt-border-soft); position: relative; }
.emitto-panel .modal-header::after {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: var(--emitt-gradient); opacity: .85;
}
.emitto-panel .modal-title { font-size: var(--emitt-text-lg); font-weight: 600; }
.emitto-panel .modal-body { padding: var(--emitt-space-5); }
.emitto-panel .modal-footer { padding: var(--emitt-space-3) var(--emitt-space-5); background: var(--emitt-surface-sunken); border-top-color: var(--emitt-border-soft); }
/* EmittoDrawer = Bootstrap offcanvas com tokens */
.emitto-panel .offcanvas { border-color: var(--emitt-border-soft) !important; box-shadow: var(--emitt-shadow-lg); background: var(--emitt-surface); color: var(--emitt-text); }
.emitto-panel .offcanvas-header { border-bottom: 1px solid var(--emitt-border-soft); }

/* Abas legadas → estilo EMITTO */
.emitto-panel .nav-tabs { border-bottom: 1px solid var(--emitt-border); gap: var(--emitt-space-4); }
.emitto-panel .nav-tabs .nav-link {
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 10px 2px;
  color: var(--emitt-muted);
  font-weight: 600;
  font-size: var(--emitt-text-sm);
  background: transparent;
}
.emitto-panel .nav-tabs .nav-link:hover { color: var(--emitt-text); }
.emitto-panel .nav-tabs .nav-link.active { color: var(--emitt-primary); border-bottom-color: var(--emitt-primary); background: transparent; }
.emitto-panel .fiscal-form-tabs .nav-link.active { color: var(--emitt-primary); border-bottom-color: var(--emitt-primary); }
.emitto-panel .nav-pills .nav-link.active { background: var(--emitt-primary); }
.emitto-panel .fiscal-action-bar { background: color-mix(in srgb, var(--emitt-surface) 90%, transparent); backdrop-filter: blur(8px); border-top-color: var(--emitt-border-soft); }
.emitto-panel .item-row { background: var(--emitt-surface-sunken) !important; border-color: var(--emitt-border-soft); border-radius: var(--emitt-radius-md); }
.emitto-panel .progress { height: 8px; border-radius: var(--emitt-radius-pill); background: var(--emitt-neutral-soft); }
.emitto-panel .progress-bar.bg-emitto { background: var(--emitt-gradient) !important; }
.emitto-panel .bg-navy { background-color: var(--emitt-navy-900) !important; }
.emitto-panel .text-emitto { color: var(--emitt-primary) !important; }
.emitto-panel .bg-secondary { background-color: var(--emitt-neutral-soft) !important; color: var(--emitt-navy-800) !important; }

/* ─── 14. EMITTO FLOW — superfícies de destaque ─────────────── */
.emt-flow { position: relative; overflow: hidden; isolation: isolate; }
.emt-flow::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--emitt-flow-lines) no-repeat right bottom / 110% 90%;
  opacity: .5;
  z-index: -1;
  pointer-events: none;
}
/* Faixa hero (dashboard) — clara, com luz suave e curvas */
.emt-hero {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--emitt-space-4);
  padding: var(--emitt-space-6) var(--emitt-space-6) var(--emitt-space-5);
  margin-bottom: var(--emitt-space-5);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-xl);
  background:
    radial-gradient(60% 120% at 100% 0%, rgba(20, 184, 166, .10) 0%, transparent 60%),
    radial-gradient(50% 120% at 70% 100%, rgba(37, 99, 235, .08) 0%, transparent 60%),
    var(--emitt-surface);
}
.emt-hero__greet { margin: 0; font-size: var(--emitt-text-2xl); font-weight: 700; letter-spacing: -.03em; }
.emt-hero__greet em { font-style: normal; background: var(--emitt-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.emt-hero__sub { margin: 6px 0 0; color: var(--emitt-muted); }
.emt-hero__meta { display: flex; flex-wrap: wrap; gap: var(--emitt-space-2); }
.emt-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid var(--emitt-border);
  border-radius: var(--emitt-radius-pill);
  background: color-mix(in srgb, var(--emitt-surface) 80%, transparent);
  font-size: var(--emitt-text-sm);
  font-weight: 500;
  color: var(--emitt-text);
  max-width: 100%;
}
.emt-meta-pill > i { color: var(--emitt-primary); }
.emt-meta-pill > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* CTA "Nova nota fiscal" — superfície escura assimétrica com FLOW */
.emt-cta {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--emitt-space-5);
  height: 100%;
  min-height: 200px;
  padding: var(--emitt-space-6);
  border-radius: var(--emitt-radius-xl) var(--emitt-radius-xl) var(--emitt-radius-xl) 6px;
  background: var(--emitt-gradient-deep);
  color: #fff;
  overflow: hidden;
  isolation: isolate;
  box-shadow: var(--emitt-shadow-md);
}
.emt-cta::before {
  content: '';
  position: absolute; inset: 0;
  background: var(--emitt-flow-lines-light) no-repeat right bottom / 130% 100%;
  z-index: -1;
}
.emt-cta::after {
  content: '';
  position: absolute;
  right: -60px; top: -60px;
  width: 220px; height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(20, 184, 166, .45) 0%, transparent 70%);
  z-index: -1;
}
.emt-cta__eyebrow { font-size: var(--emitt-text-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #7EE7CF; }
.emt-cta__title { margin: 6px 0 4px; font-size: 1.35rem; font-weight: 700; letter-spacing: -.02em; }
.emt-cta__text { margin: 0; color: rgba(255, 255, 255, .72); font-size: var(--emitt-text-sm); max-width: 280px; }

/* ─── 15. EmittoQuickAction ─────────────────────────────────── */
.emt-quick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--emitt-space-2); }
.emt-quick {
  display: flex;
  align-items: center;
  gap: var(--emitt-space-3);
  padding: 12px;
  border: 1px solid transparent;
  border-radius: var(--emitt-radius-md);
  background: var(--emitt-surface-sunken);
  color: var(--emitt-text);
  text-decoration: none;
  transition: background var(--emitt-base), border-color var(--emitt-base), transform var(--emitt-base) var(--emitt-ease), box-shadow var(--emitt-base);
}
.emt-quick:hover { background: var(--emitt-surface); border-color: var(--emitt-border); box-shadow: var(--emitt-shadow-sm); color: var(--emitt-text); transform: translateY(-1px); }
.emt-quick:active { transform: scale(.98); }
.emt-quick__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; flex-shrink: 0;
  border-radius: 10px;
  background: var(--tone-soft, var(--emitt-primary-soft));
  color: var(--tone, var(--emitt-primary));
  font-size: 1rem;
}
.emt-quick__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.emt-quick__title { font-weight: 600; font-size: var(--emitt-text-sm); }
.emt-quick__desc { font-size: var(--emitt-text-xs); color: var(--emitt-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emt-quick__arrow { margin-left: auto; color: var(--emitt-subtle); transition: transform var(--emitt-base) var(--emitt-ease), color var(--emitt-base); }
.emt-quick:hover .emt-quick__arrow { transform: translateX(3px); color: var(--emitt-primary); }

/* ─── 16. EmittoChart / Donut de status ─────────────────────── */
.emt-chart { position: relative; width: 100%; }
.emt-chart canvas { width: 100% !important; }
.emt-legend { display: flex; flex-wrap: wrap; gap: var(--emitt-space-4); font-size: var(--emitt-text-xs); color: var(--emitt-muted); }
.emt-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.emt-donut-wrap { display: flex; align-items: center; gap: var(--emitt-space-5); flex-wrap: wrap; }
.emt-donut { position: relative; width: 132px; height: 132px; flex-shrink: 0; }
.emt-donut svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.emt-donut circle { fill: none; stroke-width: 12; transition: stroke-dasharray var(--emitt-slow) var(--emitt-ease), opacity var(--emitt-base); }
.emt-donut__center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.emt-donut__center b { font-size: 1.5rem; font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.emt-donut__center small { color: var(--emitt-muted); font-size: var(--emitt-text-xs); }
.emt-status-list { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 180px; }
.emt-status-row {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: var(--emitt-radius-sm);
  background: transparent;
  color: var(--emitt-text);
  font-size: var(--emitt-text-sm);
  text-align: left;
  transition: background var(--emitt-base), border-color var(--emitt-base);
}
.emt-status-row:hover { background: var(--emitt-surface-sunken); }
.emt-status-row.is-active { border-color: var(--emitt-border); background: var(--emitt-surface-sunken); }
.emt-status-row .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--st); flex-shrink: 0; }
.emt-status-row b { margin-left: auto; font-variant-numeric: tabular-nums; }

/* ─── 17. PALETA DE COMANDOS (busca global) ─────────────────── */
.emt-palette {
  position: fixed; inset: 0;
  z-index: var(--emitt-z-palette);
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 12vh 16px 16px;
  background: rgba(7, 26, 51, .32);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.emt-palette.is-open { display: flex; animation: emt-fade-in var(--emitt-base) var(--emitt-ease); }
.emt-palette__panel {
  width: min(600px, 100%);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-lg);
  background: color-mix(in srgb, var(--emitt-surface) 95%, transparent);
  backdrop-filter: blur(16px);
  box-shadow: var(--emitt-shadow-lg);
  overflow: hidden;
  animation: emt-pop var(--emitt-slow) var(--emitt-ease);
}
.emt-palette__input { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--emitt-border-soft); }
.emt-palette__input i { color: var(--emitt-primary); }
.emt-palette__input input { flex: 1; border: 0; outline: 0 !important; background: transparent; color: var(--emitt-text); font-size: var(--emitt-text-lg); }
.emt-palette__list { max-height: 50vh; overflow-y: auto; padding: 6px; margin: 0; list-style: none; }
.emt-palette__group { padding: 8px 10px 4px; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-subtle); }
.emt-palette__item {
  display: flex; align-items: center; gap: 12px;
  padding: 9px 10px;
  border-radius: var(--emitt-radius-sm);
  color: var(--emitt-text);
  text-decoration: none;
  font-size: var(--emitt-text-sm);
  cursor: pointer;
}
.emt-palette__item i { width: 18px; text-align: center; color: var(--emitt-muted); }
.emt-palette__item small { margin-left: auto; color: var(--emitt-subtle); font-size: var(--emitt-text-xs); }
.emt-palette__item.is-active { background: var(--emitt-primary-soft); color: var(--emitt-primary-dark); }
.emt-palette__item.is-active i { color: var(--emitt-primary); }
.emt-palette__foot { display: flex; gap: var(--emitt-space-4); padding: 8px 14px; border-top: 1px solid var(--emitt-border-soft); background: var(--emitt-surface-sunken); font-size: var(--emitt-text-xs); color: var(--emitt-muted); }
.emt-palette__empty { padding: 24px; text-align: center; color: var(--emitt-muted); font-size: var(--emitt-text-sm); }

/* ─── 18. FLUXO DE EMISSÃO (stepper + resumo) ───────────────── */
/* Etapas: são as abas Bootstrap (.nav-link) apresentadas como stepper. */
.emitto-panel .emt-steps {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--emitt-space-1);
  margin: 0;
  padding: 6px;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
  background: var(--emitt-surface);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-lg) var(--emitt-radius-lg) 0 0;
  border-bottom: 0;
}
.emitto-panel .emt-steps::-webkit-scrollbar { display: none; }
.emitto-panel .emt-steps .nav-item { flex: 1 0 auto; }
.emitto-panel .emt-step {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: var(--emitt-radius-md);
  background: transparent;
  color: var(--emitt-muted);
  text-align: left;
  white-space: nowrap;
  transition: background var(--emitt-base), color var(--emitt-base);
}
.emitto-panel .emt-step:hover { background: var(--emitt-surface-sunken); color: var(--emitt-text); }
.emt-step__n {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  flex-shrink: 0;
  border: 1.5px solid var(--emitt-border);
  border-radius: 50%;
  background: var(--emitt-surface);
  font-size: .75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  transition: background var(--emitt-base), border-color var(--emitt-base), color var(--emitt-base), box-shadow var(--emitt-base);
}
.emt-step__n i { display: none; font-size: .95rem; }
.emt-step__txt { display: flex; flex-direction: column; line-height: 1.2; }
.emt-step__txt b { font-size: var(--emitt-text-sm); font-weight: 600; }
.emt-step__txt small { font-size: .7rem; color: var(--emitt-subtle); }
/* Atual */
.emitto-panel .emt-step.active { background: var(--emitt-primary-soft); color: var(--emitt-primary-dark); }
.emitto-panel .emt-step.active .emt-step__n { border-color: var(--emitt-primary); background: var(--emitt-primary); color: #fff; box-shadow: var(--emitt-shadow-focus); }
/* Concluída */
.emitto-panel .emt-step.is-done { color: var(--emitt-text); }
.emitto-panel .emt-step.is-done .emt-step__n { border-color: var(--emitt-emerald); background: var(--emitt-emerald); color: #fff; }
.emitto-panel .emt-step.is-done .emt-step__n span { display: none; }
.emitto-panel .emt-step.is-done .emt-step__n i { display: inline; animation: emt-pop var(--emitt-slow) var(--emitt-ease); }
/* Visitada com pendência */
.emitto-panel .emt-step.has-issue .emt-step__n { border-color: var(--emitt-warning); color: var(--emitt-warning); }
.emitto-panel .emt-step.has-issue .emt-step__n::after {
  content: ''; position: absolute; top: -2px; right: -2px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--emitt-warning); border: 2px solid var(--emitt-surface);
}
/* Barra de progresso com o gradiente da marca */
.emt-steps-progress {
  height: 3px;
  margin-bottom: var(--emitt-space-5);
  background: var(--emitt-border-soft);
  border-radius: 0 0 3px 3px;
  overflow: hidden;
}
.emt-steps-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: var(--emitt-gradient);
  transition: width var(--emitt-slow) var(--emitt-ease);
}
@media (max-width: 1399.98px) {
  .emt-step__txt small { display: none; }
}
@media (max-width: 767.98px) {
  .emitto-panel .emt-step:not(.active) .emt-step__txt { display: none; }
  .emitto-panel .emt-steps .nav-item { flex: 0 0 auto; }
  .emitto-panel .emt-steps .nav-item:has(.active) { flex: 1 0 auto; }
}

/* Layout em duas áreas: formulário + resumo fixo */
.emt-emissao { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--emitt-space-5); align-items: start; }
@media (min-width: 1200px) {
  .emt-emissao { grid-template-columns: minmax(0, 1fr) 300px; }
}
.emt-emissao__main { min-width: 0; }
/* A coluna estica até a altura do formulário para o resumo poder ficar fixo (sticky). */
.emt-emissao__side { align-self: stretch; min-width: 0; }
.emt-step-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--emitt-space-3);
  margin: var(--emitt-space-4) 0 var(--emitt-space-5);
}

/* Resumo lateral */
.emt-summary { position: sticky; top: 84px; }
.emt-summary__label { display: block; margin-bottom: 4px; font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--emitt-muted); }
.emt-summary__client { padding-bottom: var(--emitt-space-3); margin-bottom: var(--emitt-space-3); border-bottom: 1px solid var(--emitt-border-soft); min-width: 0; }
.emt-summary__items { padding-bottom: var(--emitt-space-3); margin-bottom: var(--emitt-space-3); border-bottom: 1px solid var(--emitt-border-soft); }
.emt-summary__items ul { margin: 0; padding: 0; list-style: none; font-size: var(--emitt-text-sm); }
.emt-summary__items li { display: flex; justify-content: space-between; gap: var(--emitt-space-2); padding: 3px 0; min-width: 0; }
.emt-summary__items li b { font-weight: 500; white-space: nowrap; }
.emt-summary dl { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; margin: 0; font-size: var(--emitt-text-sm); }
.emt-summary dt { font-weight: 400; color: var(--emitt-muted); }
.emt-summary dd { margin: 0; text-align: right; font-weight: 500; }
.emt-summary .total { display: flex; justify-content: space-between; align-items: baseline; margin-top: var(--emitt-space-4); padding-top: var(--emitt-space-4); border-top: 1px dashed var(--emitt-border); }
.emt-summary .total span { font-weight: 600; }
.emt-summary .total b {
  display: inline-block;
  font-size: 1.55rem;
  letter-spacing: -.03em;
  background: var(--emitt-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.emt-bump { animation: emt-bump 360ms var(--emitt-ease); }
@media (max-width: 1199.98px) { .emt-summary { position: static; } }

/* Revisão */
.emt-checklist { margin: 0 0 var(--emitt-space-4); padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.emt-checklist:empty { display: none; }
.emt-checklist li {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  border-radius: var(--emitt-radius-sm);
  background: var(--emitt-warning-soft);
  color: var(--emitt-text);
  font-size: var(--emitt-text-sm);
}
.emt-checklist li > i { color: var(--emitt-warning); }
.emt-review { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--emitt-space-3); }
.emt-review__block {
  padding: var(--emitt-space-4);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-md);
  background: var(--emitt-surface-sunken);
}
.emt-review__block header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--emitt-space-2); font-size: var(--emitt-text-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--emitt-muted); }
.emt-review__block header .emt-link { font-size: var(--emitt-text-xs); letter-spacing: 0; text-transform: none; }
.emt-review__block div { display: flex; flex-direction: column; padding: 4px 0; min-width: 0; }
.emt-review__block small { color: var(--emitt-muted); font-size: var(--emitt-text-xs); }
.emt-review__block b { font-weight: 500; font-size: var(--emitt-text-sm); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.emt-cta--inline { min-height: 0; flex-direction: row; flex-wrap: wrap; align-items: center; border-radius: var(--emitt-radius-xl) var(--emitt-radius-xl) var(--emitt-radius-xl) 6px; }
.emt-cta--inline > div:first-child { flex: 1 1 280px; }
.emitto-panel .emt-cta .btn-outline-light { --bs-btn-color: #fff; --bs-btn-border-color: rgba(255,255,255,.35); --bs-btn-hover-bg: rgba(255,255,255,.12); --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: rgba(255,255,255,.6); }

/* Overlay de processamento (transmissão) — vidro discreto */
.emt-overlay {
  position: fixed; inset: 0;
  z-index: var(--emitt-z-palette);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  background: rgba(7, 26, 51, .35);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: emt-fade-in var(--emitt-base) var(--emitt-ease);
}
.emt-overlay__panel {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  max-width: 360px;
  padding: var(--emitt-space-8) var(--emitt-space-6);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-xl);
  background: color-mix(in srgb, var(--emitt-surface) 94%, transparent);
  box-shadow: var(--emitt-shadow-lg);
  text-align: center;
  animation: emt-pop var(--emitt-slow) var(--emitt-ease);
}
.emt-overlay__panel b { font-size: var(--emitt-text-lg); }
.emt-overlay__panel small { color: var(--emitt-muted); }
.emt-spinner--lg { width: 40px; height: 40px; border-width: 3px; margin-bottom: 6px; }

/* ─── 19. UTILITÁRIOS ───────────────────────────────────────── */
.emt-num { font-variant-numeric: tabular-nums; }
.emt-muted { color: var(--emitt-muted) !important; }
.emt-gap-grid { --bs-gutter-x: var(--emitt-space-4); --bs-gutter-y: var(--emitt-space-4); }
.emt-section-title { display: flex; align-items: center; justify-content: space-between; margin: var(--emitt-space-6) 0 var(--emitt-space-3); }
.emt-link { color: var(--emitt-primary); font-weight: 600; font-size: var(--emitt-text-sm); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.emt-link:hover { color: var(--emitt-primary-dark); }
.emt-link i { transition: transform var(--emitt-base) var(--emitt-ease); }
.emt-link:hover i { transform: translateX(2px); }
.emt-appear { animation: emt-rise var(--emitt-slow) var(--emitt-ease) both; }
.emt-appear-2 { animation-delay: 60ms; }
.emt-appear-3 { animation-delay: 120ms; }
.emt-appear-4 { animation-delay: 180ms; }
.visually-hidden-focusable:focus { z-index: 2000; }

/* ─── 20. ANIMAÇÕES ─────────────────────────────────────────── */
@keyframes emt-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes emt-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes emt-pop { from { opacity: 0; transform: translateY(-8px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes emt-toast-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes emt-toast-out { to { opacity: 0; transform: translateX(16px); } }
@keyframes emt-spin { to { transform: rotate(360deg); } }
@keyframes emt-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes emt-draw { to { stroke-dashoffset: 0; } }
@keyframes emt-shimmer { to { background-position: -200% 0; } }
@keyframes emt-bump { 0% { transform: scale(1); } 40% { transform: scale(1.06); } 100% { transform: scale(1); } }

@media (prefers-reduced-motion: reduce) {
  .emt-appear, .emt-toast, .emt-palette__panel { animation: none !important; }
}

/* ─── 21. LISTAS FINANCEIRAS ─────────────────────────────────── */
/* Linha com atenção (ex.: título vencido): fundo âmbar suave + filete. */
.emt-table tr.emt-row-alert > * { --bs-table-bg-state: color-mix(in srgb, var(--emitt-warning-soft) 70%, transparent); }
.emt-table tr.emt-row-alert > td:first-child { box-shadow: inset 3px 0 0 var(--emitt-warning); }
.emt-row-actions .btn-sm { padding: 4px 10px; }

/* ─── 22. HARMONIZAÇÃO DO LEGADO ────────────────────────────────
   Telas ainda não reescritas usam .page-header, .dash-card, faixas
   .table-* e .card-header com <h6>. Aqui elas adotam o visual EMITTO
   sem alteração de markup. Telas novas devem usar os componentes .emt-*. */

/* .page-header legado → aparência de EmittoPageHeader */
.emitto-panel .page-header {
  align-items: center;
  gap: var(--emitt-space-4);
  margin-bottom: var(--emitt-space-6);
}
.emitto-panel .page-header h5 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin: 0;
  font-size: var(--emitt-text-2xl);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.2;
  color: var(--emitt-text);
}
/* Ícone do título vira "pastilha" com o gradiente da marca */
.emitto-panel .page-header h5 > i.bi:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  margin: 0 !important;
  border-radius: 12px;
  background: var(--emitt-gradient);
  color: #fff !important;
  font-size: 1.1rem;
  box-shadow: 0 6px 16px -8px rgba(37, 99, 235, .6);
}
/* "— Subtítulo" dentro do h5 vira linha de apoio */
.emitto-panel .page-header h5 > small {
  flex-basis: 100%;
  padding-left: 52px;
  margin-top: -2px;
  font-size: var(--emitt-text-md);
  font-weight: 400 !important;
  letter-spacing: 0;
  color: var(--emitt-muted) !important;
}
@media (max-width: 575.98px) {
  .emitto-panel .page-header h5 { font-size: var(--emitt-text-xl); }
  .emitto-panel .page-header h5 > small { padding-left: 0; }
}

/* Cards de KPI legados (.dash-card) → EmittoMetric */
.emitto-panel .dash-card { border: 1px solid var(--emitt-border-soft); border-radius: var(--emitt-radius-lg); box-shadow: var(--emitt-shadow-xs); transition: transform var(--emitt-base) var(--emitt-ease), box-shadow var(--emitt-base); }
.emitto-panel .dash-card:hover { transform: translateY(-2px); box-shadow: var(--emitt-shadow-md); }
.emitto-panel .dash-card .card-body.text-center { text-align: left !important; }
.emitto-panel .dash-card .small.text-muted:first-child {
  font-size: var(--emitt-text-xs) !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.emitto-panel .dash-card :is(.fs-4, .fs-5) { font-size: 1.45rem !important; font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.emitto-panel .dash-card .dash-icon { border-radius: 10px; }

/* Cabeçalho de card legado com <h6> */
.emitto-panel .card-header.bg-white { background: transparent !important; }
.emitto-panel .card-header h6 { font-size: var(--emitt-text-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-muted); }
.emitto-panel .card-header h6 > i { color: var(--emitt-primary) !important; }
.emitto-panel h6.text-navy, .emitto-panel h6.fw-700 { color: var(--emitt-text) !important; }

/* Faixas de linha Bootstrap → tons suaves dos tokens */
.emitto-panel .table > :not(caption) > tr.table-warning > * { --bs-table-bg-state: var(--emitt-warning-soft); --bs-table-color-state: var(--emitt-text); }
.emitto-panel .table > :not(caption) > tr.table-danger > *  { --bs-table-bg-state: var(--emitt-danger-soft);  --bs-table-color-state: var(--emitt-text); }
.emitto-panel .table > :not(caption) > tr.table-success > * { --bs-table-bg-state: var(--emitt-success-soft); --bs-table-color-state: var(--emitt-text); }
.emitto-panel .table > :not(caption) > tr.table-info > *    { --bs-table-bg-state: var(--emitt-primary-soft); --bs-table-color-state: var(--emitt-text); }
.emitto-panel .table > :not(caption) > tr.table-secondary > * { --bs-table-bg-state: var(--emitt-neutral-soft); --bs-table-color-state: var(--emitt-text); }
.emitto-panel .table > :not(caption) > tr.table-light > *   { --bs-table-bg-state: var(--emitt-surface-sunken); --bs-table-color-state: var(--emitt-text); }
.emitto-panel .table thead.table-light th { background: var(--emitt-surface-sunken); color: var(--emitt-muted); }
.emitto-panel .table-sm > :not(caption) > * > * { padding: 8px 12px; }
.emitto-panel .table-responsive { border-radius: 0 0 var(--emitt-radius-lg) var(--emitt-radius-lg); }

/* Badges genéricas Bootstrap → chips suaves */
.emitto-panel .badge.bg-light { background: var(--emitt-neutral-soft) !important; color: var(--emitt-text) !important; border-color: transparent !important; }
.emitto-panel .badge.bg-warning { background: var(--emitt-warning-soft) !important; color: var(--emitt-warning) !important; }
.emitto-panel .badge.bg-info { background: var(--emitt-primary-soft) !important; color: var(--emitt-primary-dark) !important; }
.emitto-panel .badge.bg-danger { background: var(--emitt-danger-soft) !important; color: var(--emitt-danger) !important; }
.emitto-panel .badge.bg-success { background: var(--emitt-success-soft) !important; color: var(--emitt-success) !important; }
.emitto-panel .badge.bg-primary { background: var(--emitt-primary-soft) !important; color: var(--emitt-primary-dark) !important; }

/* Formulários legados: cards como "seções" e grupos de campos */
.emitto-panel form .card > .card-body > h6:first-child,
.emitto-panel form .card > .card-header {
  display: flex;
  align-items: center;
  gap: 8px;
}
.emitto-panel form .card > .card-body > h6:first-child {
  margin-bottom: var(--emitt-space-4) !important;
  padding-bottom: var(--emitt-space-3);
  border-bottom: 1px solid var(--emitt-border-soft);
  font-size: var(--emitt-text-md);
  font-weight: 600;
  color: var(--emitt-text);
}
.emitto-panel form .card > .card-body > h6:first-child::before {
  content: '';
  width: 4px; height: 16px;
  border-radius: 4px;
  background: var(--emitt-gradient);
}
.emitto-panel .form-text { color: var(--emitt-muted); font-size: var(--emitt-text-xs); }
.emitto-panel .form-switch .form-check-input { width: 2.4em; }
.emitto-panel .text-danger.small:empty { display: none; }
.emitto-panel .alert-light { background: var(--emitt-surface-sunken); border-color: var(--emitt-border-soft) !important; color: var(--emitt-text); }
.emitto-panel .list-group-item { border-color: var(--emitt-border-soft); }
.emitto-panel .list-group-item-action:hover { background: var(--emitt-surface-sunken); }

/* Barra de ações ao fim de formulários simples (Salvar/Cancelar) */
.emt-form-actions {
  position: sticky;
  bottom: 0;
  z-index: 5;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--emitt-space-2);
  margin-top: var(--emitt-space-5);
  padding: var(--emitt-space-3) 0;
  background: color-mix(in srgb, var(--emitt-background) 88%, transparent);
  backdrop-filter: blur(8px);
  border-top: 1px solid var(--emitt-border-soft);
}

/* Extrato (Fluxo de Caixa) */
.emt-table tr.emt-row-danger > * { --bs-table-bg-state: color-mix(in srgb, var(--emitt-danger-soft) 75%, transparent); }
.emt-table tr.emt-row-danger > td:first-child { box-shadow: inset 3px 0 0 var(--emitt-danger); }
.emt-extrato tr.emt-extrato__mes > td {
  padding-top: 18px !important;
  background: var(--emitt-surface) !important;
  font-size: var(--emitt-text-xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--emitt-primary);
  border-bottom: 2px solid var(--emitt-primary-soft);
}
.emt-extrato tr.emt-extrato__saldo > * { --bs-table-bg-state: var(--emitt-primary-soft); }
.emt-extrato tr.emt-extrato__fim > * { --bs-table-bg-state: var(--emitt-surface-sunken); font-weight: 700; }
/* Dentro de card, a barra de ações usa a cor da superfície do card */
.emitto-panel .card .emt-form-actions { background: color-mix(in srgb, var(--emitt-surface) 92%, transparent); margin-inline: calc(var(--emitt-space-5) * -1); padding-inline: var(--emitt-space-5); margin-bottom: calc(var(--emitt-space-5) * -1); border-radius: 0 0 var(--emitt-radius-lg) var(--emitt-radius-lg); }

/* Lista de definição (dados de cadastro/certificado) */
.emt-dl { display: grid; grid-template-columns: minmax(120px, auto) 1fr; gap: 10px 16px; margin: 0; font-size: var(--emitt-text-sm); }
.emt-dl dt { font-weight: 400; color: var(--emitt-muted); }
.emt-dl dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.min-w-0 { min-width: 0; }

/* Medidor com marcos (Limite MEI) */
.emt-meter { position: relative; height: 14px; border-radius: var(--emitt-radius-pill); background: var(--emitt-neutral-soft); overflow: hidden; }
.emt-meter > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--emitt-primary), var(--tone)); transition: width var(--emitt-slow) var(--emitt-ease); }
.emt-meter > i { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--emitt-surface); opacity: .8; }

/* Títulos de página em <h1 class="h3"> (LGPD, Minha assinatura…) → escala EMITTO */
.emitto-panel .emitto-main h1.h3 {
  font-size: var(--emitt-text-2xl);
  font-weight: 700;
  letter-spacing: -.025em;
  color: var(--emitt-text);
}
.emitto-panel .emitto-main h1.h3.text-danger { color: var(--emitt-danger) !important; }
.emitto-panel .emitto-main h1.h3::before {
  content: '';
  display: block;
  width: 18px; height: 2px;
  margin-bottom: 10px;
  border-radius: 2px;
  background: var(--emitt-gradient);
}
.emitto-panel .emitto-main h2.h5 { font-size: var(--emitt-text-lg); font-weight: 600; color: var(--emitt-text); }
.emitto-panel .emitto-main h2.h5.text-danger { color: var(--emitt-danger) !important; }

/* ═══════════════════════════════════════════════════════════════
   23. PADRÕES PROPRIETÁRIOS — RODADA 2 DE UX
   (ver docs/ux/auditoria-ux-emitto.md)
═══════════════════════════════════════════════════════════════ */

/* ─── Assinatura de Módulo ────────────────────────────────────
   <body data-emt-modulo="..."> define a matiz de acento da área.
   A linguagem é a mesma; muda só o tom do traço, do brilho e do ativo. */
:root { --emitt-modulo: var(--emitt-primary); --emitt-modulo-2: var(--emitt-teal); --emitt-modulo-soft: var(--emitt-primary-soft); }
[data-emt-modulo="operacao"]   { --emitt-modulo: #2563EB; --emitt-modulo-2: #14B8A6; --emitt-modulo-soft: #E8F0FE; }
[data-emt-modulo="financeiro"] { --emitt-modulo: #059669; --emitt-modulo-2: #14B8A6; --emitt-modulo-soft: #E3F7EF; }
[data-emt-modulo="cadastros"]  { --emitt-modulo: #7C3AED; --emitt-modulo-2: #2563EB; --emitt-modulo-soft: #F1EAFE; }
[data-emt-modulo="gestao"]     { --emitt-modulo: #0E7490; --emitt-modulo-2: #10B981; --emitt-modulo-soft: #E0F4F8; }
[data-emt-modulo="empresa"]    { --emitt-modulo: #0F766E; --emitt-modulo-2: #2563EB; --emitt-modulo-soft: #E1F5F2; }
[data-emt-modulo="admin"]      { --emitt-modulo: #334155; --emitt-modulo-2: #2563EB; --emitt-modulo-soft: #EEF2F7; }
:root[data-theme="dark"] [data-emt-modulo] { --emitt-modulo-soft: color-mix(in srgb, var(--emitt-modulo) 16%, transparent); }
[data-emt-modulo] { --emitt-modulo-gradient: linear-gradient(120deg, var(--emitt-modulo) 0%, var(--emitt-modulo-2) 100%); }

.emt-page-header__eyebrow { color: var(--emitt-modulo); }
.emt-page-header__eyebrow::before { background: var(--emitt-modulo-gradient, var(--emitt-gradient)); width: 22px; }
.emitto-panel .page-header h5 > i.bi:first-child { background: var(--emitt-modulo-gradient, var(--emitt-gradient)); }
.emitto-panel .emitto-main h1.h3::before { background: var(--emitt-modulo-gradient, var(--emitt-gradient)); }
.emitto-panel .sidebar-link.active::before { background: var(--emitt-modulo-gradient, var(--emitt-gradient)); }
/* Brilho da área no topo do conteúdo — assinatura discreta */
.emitto-panel .emitto-main { position: relative; }
.emitto-panel .emitto-main::before {
  content: '';
  position: absolute;
  inset: 0 0 auto auto;
  width: min(520px, 60%);
  height: 220px;
  background: radial-gradient(60% 70% at 100% 0%, color-mix(in srgb, var(--emitt-modulo) 9%, transparent) 0%, transparent 70%);
  pointer-events: none;
  z-index: -1; /* atrás do conteúdo, sem criar camadas nos filhos (modais/menus intactos) */
}

/* ─── Chave Segmentada ───────────────────────────────────────── */
.emt-chave { display: flex; flex-direction: column; gap: 8px; }
.emt-chave__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.emt-chave__label { font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-muted); }
.emt-chave__copy {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 10px;
  border: 1px solid var(--emitt-border);
  border-radius: var(--emitt-radius-pill);
  background: var(--emitt-surface);
  color: var(--emitt-muted);
  font-size: var(--emitt-text-xs);
  font-weight: 600;
  transition: color var(--emitt-base), border-color var(--emitt-base), background var(--emitt-base);
}
.emt-chave__copy:hover { color: var(--emitt-primary); border-color: var(--emitt-primary); }
.emt-chave__copy.is-copiado { color: var(--emitt-success); border-color: var(--emitt-success); background: var(--emitt-success-soft); }
.emt-chave__grupos {
  display: flex; flex-wrap: wrap; gap: 4px 6px;
  font-family: var(--emitt-font-mono);
  font-size: .9rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
}
.emt-chave__grupos > span {
  padding: 3px 6px;
  border-radius: 6px;
  background: var(--emitt-surface-sunken);
  border: 1px solid var(--emitt-border-soft);
  color: var(--emitt-text);
}
.emt-chave__grupos > span.is-numero { background: var(--emitt-modulo-soft, var(--emitt-primary-soft)); border-color: color-mix(in srgb, var(--emitt-modulo, var(--emitt-primary)) 35%, transparent); color: var(--emitt-modulo, var(--emitt-primary)); font-weight: 700; }
.emt-chave__grupos.is-livre { word-break: break-all; font-size: .8rem; }
.emt-chave__leitura { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: var(--emitt-text-sm); font-variant-numeric: tabular-nums; }
.emt-chave__leitura span { display: inline-flex; align-items: baseline; gap: 6px; font-weight: 600; }
.emt-chave__leitura small { font-size: .66rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--emitt-subtle); }

/* ─── Herói do documento + Trilha ────────────────────────────── */
.emt-doc-hero {
  --st: var(--emitt-primary); --st-soft: var(--emitt-primary-soft);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--emitt-space-5);
  padding: var(--emitt-space-6);
  margin-bottom: var(--emitt-space-5);
  border: 1px solid var(--emitt-border-soft);
  border-radius: var(--emitt-radius-xl) var(--emitt-radius-xl) var(--emitt-radius-xl) 6px;
  background:
    radial-gradient(70% 120% at 100% 0%, color-mix(in srgb, var(--st) 10%, transparent) 0%, transparent 60%),
    var(--emitt-surface);
  overflow: hidden;
  isolation: isolate;
}
.emt-doc-hero::before {
  content: ''; position: absolute; inset: auto 0 0 0; height: 140px;
  background: var(--emitt-flow-lines) no-repeat right bottom / 90% 100%;
  opacity: .35; z-index: -1; pointer-events: none;
}
.emt-doc-hero--autorizada { --st: var(--emitt-success); --st-soft: var(--emitt-success-soft); }
.emt-doc-hero--rejeitada  { --st: var(--emitt-danger);  --st-soft: var(--emitt-danger-soft); }
.emt-doc-hero--cancelada  { --st: var(--emitt-cancel);  --st-soft: var(--emitt-neutral-soft); }
.emt-doc-hero--pendente, .emt-doc-hero--processando { --st: var(--emitt-warning); --st-soft: var(--emitt-warning-soft); }
@media (min-width: 1200px) {
  .emt-doc-hero { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
  .emt-doc-hero__chave { grid-column: 1 / -1; }
}
.emt-doc-hero__id { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 10px; font-size: var(--emitt-text-sm); color: var(--emitt-muted); }
.emt-doc-hero__id b { color: var(--emitt-text); }
.emt-doc-hero__titulo { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 1.6rem; font-weight: 700; letter-spacing: -.03em; color: var(--emitt-text); }
.emt-doc-hero__selo {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; flex-shrink: 0;
  border-radius: 50%;
  background: var(--st-soft); color: var(--st);
  font-size: 1.1rem;
}
.emt-doc-hero__selo .emt-check { width: 30px; height: 30px; }
.emt-doc-hero__msg { margin: 8px 0 var(--emitt-space-4); color: var(--emitt-muted); max-width: 560px; }
.emt-doc-hero__dados { display: flex; flex-wrap: wrap; gap: var(--emitt-space-3) var(--emitt-space-6); margin: 0 0 var(--emitt-space-4); }
.emt-doc-hero__dados div { min-width: 0; max-width: 320px; }
.emt-doc-hero__dados dt { font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-subtle); }
.emt-doc-hero__dados dd { margin: 2px 0 0; font-size: var(--emitt-text-lg); font-weight: 600; }
.emt-doc-hero__chave { padding-top: var(--emitt-space-4); border-top: 1px dashed var(--emitt-border); }

/* Trilha do Documento — a linha do FLOW percorre as etapas */
.emt-trilha { position: relative; display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0 0 0 4px; list-style: none; align-self: center; }
.emt-trilha__etapa { position: relative; display: grid; grid-template-columns: 22px 1fr auto; align-items: center; gap: 12px; padding: 10px 0; }
.emt-trilha__etapa::before {
  content: ''; position: absolute; left: 10px; top: -50%; height: 100%; width: 2px;
  background: var(--emitt-border); z-index: 0;
}
.emt-trilha__etapa:first-child::before { display: none; }
.emt-trilha__etapa.is-feito::before, .emt-trilha__etapa.is-atual::before { background: var(--emitt-gradient); }
.emt-trilha__etapa.is-erro::before { background: linear-gradient(180deg, var(--emitt-primary), var(--emitt-danger)); }
.emt-trilha__etapa.is-cancelado::before { background: linear-gradient(180deg, var(--emitt-emerald), var(--emitt-cancel)); }
.emt-trilha__ponto {
  position: relative; z-index: 1;
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid var(--emitt-border); background: var(--emitt-surface);
}
.emt-trilha__etapa.is-feito .emt-trilha__ponto { border-color: var(--emitt-emerald); background: var(--emitt-emerald); box-shadow: inset 0 0 0 4px var(--emitt-surface); }
.emt-trilha__etapa.is-atual .emt-trilha__ponto { border-color: var(--emitt-warning); background: var(--emitt-warning); box-shadow: inset 0 0 0 4px var(--emitt-surface), 0 0 0 4px var(--emitt-warning-soft); animation: emt-pulse 1.6s ease-in-out infinite; }
.emt-trilha__etapa.is-erro .emt-trilha__ponto { border-color: var(--emitt-danger); background: var(--emitt-danger); box-shadow: inset 0 0 0 4px var(--emitt-surface), 0 0 0 4px var(--emitt-danger-soft); }
.emt-trilha__etapa.is-cancelado .emt-trilha__ponto { border-color: var(--emitt-cancel); background: var(--emitt-cancel); box-shadow: inset 0 0 0 4px var(--emitt-surface); }
.emt-trilha__rotulo { font-weight: 600; font-size: var(--emitt-text-sm); color: var(--emitt-text); }
.emt-trilha__etapa.is-futuro .emt-trilha__rotulo { color: var(--emitt-subtle); font-weight: 500; }
.emt-trilha__data { font-size: var(--emitt-text-xs); color: var(--emitt-muted); }

/* ─── Diagnóstico EMITTO ─────────────────────────────────────── */
.emt-diagnostico {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 14px 16px; margin-bottom: 14px;
  border: 1px solid color-mix(in srgb, var(--emitt-primary) 22%, transparent);
  border-radius: var(--emitt-radius-md);
  background: linear-gradient(135deg, var(--emitt-primary-soft), color-mix(in srgb, var(--emitt-success-soft) 60%, transparent));
}
.emt-diagnostico__codigo {
  flex-shrink: 0;
  padding: 6px 10px; border-radius: 10px;
  background: var(--emitt-danger); color: #fff;
  font-family: var(--emitt-font-mono); font-weight: 700; font-size: .95rem;
}
.emt-diagnostico__titulo { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-primary); }
.emt-diagnostico p { margin-bottom: 4px; font-size: var(--emitt-text-sm); color: var(--emitt-text); }

/* ─── Radar EMITTO ───────────────────────────────────────────── */
.emt-radar__icone {
  display: inline-block; width: 10px; height: 10px; margin-right: 8px; vertical-align: 0;
  border-radius: 50%;
  background: conic-gradient(from 0deg, var(--emitt-emerald), var(--emitt-primary), var(--emitt-emerald));
  animation: emt-spin 3s linear infinite;
}
.emt-radar__lista { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.emt-radar__sinal {
  --rs: var(--emitt-primary); --rs-soft: var(--emitt-primary-soft);
  display: grid; grid-template-columns: 10px 22px 1fr; grid-template-rows: auto auto; align-items: center; column-gap: 10px;
  padding: 10px 12px;
  border-radius: var(--emitt-radius-md);
  background: color-mix(in srgb, var(--rs-soft) 70%, transparent);
}
.emt-radar__sinal.is-danger  { --rs: var(--emitt-danger);  --rs-soft: var(--emitt-danger-soft); }
.emt-radar__sinal.is-warning { --rs: var(--emitt-warning); --rs-soft: var(--emitt-warning-soft); }
.emt-radar__ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--rs); box-shadow: 0 0 0 3px color-mix(in srgb, var(--rs) 20%, transparent); }
.emt-radar__sinal.is-danger .emt-radar__ponto { animation: emt-pulse 1.4s ease-in-out infinite; }
.emt-radar__ico { color: var(--rs); font-size: 1rem; }
.emt-radar__texto { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.emt-radar__texto b { font-size: var(--emitt-text-sm); font-weight: 600; }
.emt-radar__texto small { color: var(--emitt-muted); font-size: var(--emitt-text-xs); }
.emt-radar__sinal > .emt-link { grid-column: 3; justify-self: start; margin-top: 4px; font-size: var(--emitt-text-xs); color: var(--rs); }
.emt-radar__ok { display: flex; align-items: center; gap: 10px; color: var(--emitt-success); font-weight: 600; font-size: var(--emitt-text-sm); }

/* ─── Linha-Cartão (tabelas em telas pequenas) ───────────────── */
@media (max-width: 767.98px) {
  .emt-table.emt-cards { min-width: 0 !important; }
  .emt-table.emt-cards thead { display: none; }
  .emt-table.emt-cards, .emt-table.emt-cards tbody { display: block; }
  .emt-table.emt-cards tbody tr {
    position: relative;
    display: grid; grid-template-columns: 1fr;
    margin: 10px 12px; padding: 10px 12px 10px 16px;
    border: 1px solid var(--emitt-border-soft);
    border-radius: var(--emitt-radius-md);
    background: var(--emitt-surface);
    box-shadow: var(--emitt-shadow-xs);
  }
  .emt-table.emt-cards tbody tr[hidden] { display: none; }
  .emt-table.emt-cards tbody tr::before {
    content: ''; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 0 3px 3px 0;
    background: var(--emitt-border);
  }
  .emt-table.emt-cards tbody tr[data-status="autorizada"]::before, .emt-table.emt-cards tbody tr[data-status="RECEBIDO"]::before, .emt-table.emt-cards tbody tr[data-status="PAGO"]::before { background: var(--emitt-success); }
  .emt-table.emt-cards tbody tr[data-status="pendente"]::before, .emt-table.emt-cards tbody tr[data-status="ABERTO"]::before { background: var(--emitt-warning); }
  .emt-table.emt-cards tbody tr[data-status="erro"]::before, .emt-table.emt-cards tbody tr[data-status="VENCIDO"]::before { background: var(--emitt-danger); }
  .emt-table.emt-cards tbody tr[data-status="cancelada"]::before { background: var(--emitt-cancel); }
  .emt-table.emt-cards tbody td {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    padding: 5px 0 !important; border: 0 !important; text-align: right;
    background: transparent !important;
  }
  .emt-table.emt-cards tbody td::before {
    content: attr(data-label);
    flex-shrink: 0;
    font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--emitt-subtle); text-align: left;
  }
  .emt-table.emt-cards tbody td[data-label=""]::before { content: none; }
  .emt-table.emt-cards tbody td > * { min-width: 0; }
  .emt-table.emt-cards tbody td.emt-col-actions { justify-content: flex-end; padding-top: 8px !important; margin-top: 4px; border-top: 1px dashed var(--emitt-border-soft) !important; }
  .emt-table.emt-cards tbody td.emt-col-actions::before { content: none; }
  .emt-table.emt-cards .emt-row-actions { opacity: 1; }
  .emt-table.emt-cards tbody tr > td[colspan] { display: block; text-align: center; }
  .emt-table.emt-cards tbody tr > td[colspan]::before { content: none; }
  .emt-table-scroll:has(.emt-cards) { overflow-x: visible; }
}

/* ─── Mapa do Formulário ─────────────────────────────────────── */
.emt-mapa-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--emitt-space-5); align-items: start; }
@media (min-width: 1200px) { .emt-mapa-layout { grid-template-columns: 230px minmax(0, 1fr); } }
.emt-mapa { position: sticky; top: 84px; padding: var(--emitt-space-4); }
@media (max-width: 1199.98px) { .emt-mapa { display: none; } }
.emt-mapa__titulo { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.emt-mapa__anel { --p: 0; width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0; display: grid; place-items: center;
  background: conic-gradient(var(--emitt-modulo, var(--emitt-primary)) calc(var(--p) * 1%), var(--emitt-neutral-soft) 0);
  transition: background var(--emitt-slow); }
.emt-mapa__anel span { width: 30px; height: 30px; border-radius: 50%; background: var(--emitt-surface); display: grid; place-items: center; font-size: .66rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.emt-mapa__titulo b { font-size: var(--emitt-text-sm); display: block; }
.emt-mapa__titulo small { color: var(--emitt-muted); font-size: var(--emitt-text-xs); }
.emt-mapa ol { position: relative; margin: 0; padding: 0 0 0 14px; list-style: none; }
.emt-mapa ol::before { content: ''; position: absolute; left: 4px; top: 6px; bottom: 6px; width: 2px; background: var(--emitt-border-soft); border-radius: 2px; }
.emt-mapa li a {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 8px; border-radius: var(--emitt-radius-sm);
  color: var(--emitt-muted); font-size: var(--emitt-text-sm); text-decoration: none;
  transition: background var(--emitt-base), color var(--emitt-base);
}
.emt-mapa li a::before { content: ''; position: absolute; left: -13px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: var(--emitt-surface); border: 2px solid var(--emitt-border); }
.emt-mapa li a:hover { background: var(--emitt-surface-sunken); color: var(--emitt-text); }
.emt-mapa li a.is-ativa { color: var(--emitt-text); font-weight: 600; background: var(--emitt-modulo-soft, var(--emitt-primary-soft)); }
.emt-mapa li a.is-ativa::before { border-color: var(--emitt-modulo, var(--emitt-primary)); background: var(--emitt-modulo, var(--emitt-primary)); }
.emt-mapa li a.is-completa::before { border-color: var(--emitt-emerald); background: var(--emitt-emerald); }
.emt-mapa li a small { font-size: .66rem; font-variant-numeric: tabular-nums; color: var(--emitt-subtle); }
.emt-mapa li a.is-pendente small { color: var(--emitt-warning); font-weight: 700; }
[data-emt-secao] { scroll-margin-top: 84px; }
.emt-secao-foco { animation: emt-secao-foco 900ms var(--emitt-ease); }
@keyframes emt-secao-foco { 0% { box-shadow: 0 0 0 0 var(--emitt-modulo-soft, var(--emitt-primary-soft)); } 30% { box-shadow: 0 0 0 6px var(--emitt-modulo-soft, var(--emitt-primary-soft)); } 100% { box-shadow: 0 0 0 0 transparent; } }

/* ─── Relógio Relativo ───────────────────────────────────────── */
.emt-desde { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: var(--emitt-radius-pill); background: var(--emitt-warning-soft); color: var(--emitt-warning); font-size: .68rem; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.emt-desde::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: emt-pulse 1.6s ease-in-out infinite; }
.emt-mapa li.emt-mapa__grupo { margin: 10px 0 2px -14px; padding-left: 0; font-size: .64rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--emitt-subtle); }
.emt-mapa li.emt-mapa__grupo:first-child { margin-top: 0; }