/* app.css — Design System FDV (DESIGN.md, decisions.md DEC-026).
 * Sem framework CSS, sem build (TECH-STACK.md §4.1). Os nomes de classe das
 * telas (fv-panel, fv-toolbar, fv-grid, c1…c12, fv-fase, fv-dialog…) foram
 * mantidos: a modernização é visual — nenhum campo, validação ou fluxo mudou.
 * ------------------------------------------------------------------------ */

:root {
  /* Marca */
  --fdv-brand-primary: #13335a;
  --fdv-brand-primary-hover: #0e2440;
  --fdv-brand-accent: #c92a2a;
  --fdv-brand-accent-hover: #a61e1e;
  /* Superfícies */
  --fdv-surface-bg: #f4f6f9;
  --fdv-surface-card: #ffffff;
  --fdv-surface-dim: #e9ecef;
  --fdv-surface-low: #f8f9fa;
  --fdv-surface-highlight: #e8f0fe;
  /* Texto */
  --fdv-text-primary: #1e293b;
  --fdv-text-secondary: #64748b;
  --fdv-text-muted: #94a3b8;
  --fdv-text-inverse: #ffffff;
  /* Bordas */
  --fdv-border-subtle: #e2e8f0;
  --fdv-border-field: #cbd5e1;
  --fdv-border-focus: #13335a;
  /* Feedback */
  --fdv-status-online: #10b981;
  --fdv-status-warning: #f59e0b;
  --fdv-status-danger: #ef4444;
  --fdv-status-info: #0284c7;
  /* Espaço */
  --fdv-space-xs: 4px; --fdv-space-sm: 8px; --fdv-space-md: 12px;
  --fdv-space-lg: 16px; --fdv-space-xl: 24px; --fdv-space-2xl: 32px;
  /* Raio */
  --fdv-radius-xs: 2px; --fdv-radius-sm: 4px; --fdv-radius-md: 6px; --fdv-radius-lg: 8px;
  /* Tipografia */
  --fdv-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --fdv-font-mono: 'JetBrains Mono', 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
  /* Sombras */
  --fdv-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --fdv-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  /* Controles */
  --fdv-input-h: 34px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--fdv-font-sans);
  font-size: 13px;
  line-height: 1.4;
  margin: 0;
  color: var(--fdv-text-primary);
  background: var(--fdv-surface-bg);
}
h1 { font-size: 18px; font-weight: 700; margin: 0 0 var(--fdv-space-md); color: var(--fdv-brand-primary); }
h2 { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--fdv-text-secondary); margin: var(--fdv-space-lg) 0 var(--fdv-space-sm); }
a { color: var(--fdv-brand-primary); }
main { max-width: 1180px; margin: 0 auto; padding: var(--fdv-space-lg) var(--fdv-space-xl) var(--fdv-space-2xl); }
kbd, .fv-mono { font-family: var(--fdv-font-mono); }

/* ---- Cabeçalho da aplicação (mockup DEC-026) ------------------------------ */
.app-header {
  display: flex; align-items: stretch; gap: var(--fdv-space-lg);
  padding: 0 var(--fdv-space-lg);
  background: var(--fdv-brand-primary); color: var(--fdv-text-inverse);
  box-shadow: var(--fdv-shadow-md); position: sticky; top: 0; z-index: 20; min-height: 52px;
}
.app-brand { display: flex; align-items: center; gap: 8px; text-decoration: none; color: #fff; padding: 8px 0; white-space: nowrap; }
.app-brand-logo { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: #fff; color: var(--fdv-brand-primary); font-weight: 800; font-size: 13px; letter-spacing: .02em; }
.app-brand-txt { display: flex; flex-direction: column; line-height: 1.05; font-weight: 800; font-size: 14px; letter-spacing: .06em; }
.app-brand-txt small { font-weight: 500; font-size: 9.5px; letter-spacing: .08em; color: rgba(255,255,255,.65); text-transform: uppercase; }
.app-nav { display: flex; align-items: stretch; flex: 1 1 auto; flex-wrap: wrap; min-width: 0; }
.app-nav a {
  display: inline-flex; align-items: center; padding: 0 11px; margin: 0; min-height: 52px;
  color: rgba(255,255,255,.75); text-decoration: none; font-weight: 600; font-size: 12px; white-space: nowrap;
}
.app-nav a:hover { color: #fff; background: rgba(255,255,255,.06); }
.app-nav a.ativa { color: #fff; background: var(--fdv-brand-primary-hover); box-shadow: inset 0 -3px 0 #fff; }
.app-tools { display: flex; align-items: center; gap: 8px; }
.app-status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.1); font-family: var(--fdv-font-mono); font-size: 10.5px; font-weight: 700; letter-spacing: .06em; }
.app-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--fdv-status-online); box-shadow: 0 0 0 3px rgba(16,185,129,.25); }
.app-status.offline::before { background: var(--fdv-status-danger); box-shadow: 0 0 0 3px rgba(239,68,68,.25); }
.app-sync { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: var(--fdv-radius-sm); background: #fff; color: var(--fdv-brand-primary); font-weight: 700; font-size: 12px; text-decoration: none; }
.app-sync:hover { background: var(--fdv-surface-highlight); }
.app-session { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.app-user { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; font-size: 12px; }
.app-user small { font-size: 10px; color: rgba(255,255,255,.65); font-family: var(--fdv-font-mono); }
.app-session button { background: transparent; border: 1px solid rgba(255,255,255,.4); color: #fff; width: 32px; height: 32px; padding: 0; border-radius: 50%; cursor: pointer; font-size: 15px; line-height: 1; }
.app-session button:hover { background: rgba(255,255,255,.12); }
.app-footer { max-width: 1180px; margin: var(--fdv-space-md) auto var(--fdv-space-2xl); padding: 0 var(--fdv-space-xl); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: 11px; color: var(--fdv-text-secondary); }
.app-footer .fv-mono { font-size: 10.5px; letter-spacing: .04em; }

/* ---- Base de formulários/botões (login e páginas simples) --------------- */
button {
  background: var(--fdv-brand-primary); color: #fff; border: 1px solid var(--fdv-brand-primary);
  padding: 0 14px; height: var(--fdv-input-h); border-radius: var(--fdv-radius-sm); cursor: pointer;
  font: inherit; font-weight: 600;
}
button:hover:not(:disabled) { background: var(--fdv-brand-primary-hover); }
button:disabled { opacity: .5; cursor: not-allowed; }
input, select, textarea { font: inherit; color: var(--fdv-text-primary); }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible, a:focus-visible {
  outline: 2px solid var(--fdv-border-focus); outline-offset: 1px;
}
form label { display: block; margin-bottom: var(--fdv-space-md); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--fdv-text-secondary); }
form input, form textarea, form select {
  display: block; width: 100%; margin-top: 4px; padding: 0 10px; height: var(--fdv-input-h);
  border: 1px solid var(--fdv-border-field); border-radius: var(--fdv-radius-sm); background: #fff;
  font-size: 13px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--fdv-text-primary);
}
form textarea { height: auto; padding: 8px 10px; }
form input[type="checkbox"], form input[type="radio"] { width: auto; height: auto; display: inline-block; }
table { width: 100%; border-collapse: collapse; background: #fff; margin-top: var(--fdv-space-md); }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--fdv-border-subtle); }
th { background: var(--fdv-surface-dim); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--fdv-text-secondary); }
.hint { color: var(--fdv-text-secondary); font-size: 12px; margin: 0 0 var(--fdv-space-md); }
.hint-warning { color: #8a4b00; background: #fff7e6; border: 1px solid #fde3b3; padding: 8px 12px; border-radius: var(--fdv-radius-sm); }

/* ---- Login ---------------------------------------------------------------- */
.page-login { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: linear-gradient(160deg, var(--fdv-brand-primary) 0%, #1f4f86 60%, var(--fdv-surface-bg) 60.1%); }
.login-box { background: #fff; padding: var(--fdv-space-2xl); border-radius: var(--fdv-radius-lg); box-shadow: var(--fdv-shadow-md); width: 100%; max-width: 400px; border-top: 4px solid var(--fdv-brand-accent); }
.login-box h1 { font-size: 20px; margin-bottom: 4px; }
.login-box .hint { margin-bottom: var(--fdv-space-xl); }
.login-box button[type="submit"] { width: 100%; margin-top: var(--fdv-space-sm); height: 40px; }

/* ---- Página (cartão principal) ------------------------------------------- */
.fv-page { max-width: 1180px; }
.fv-page main, main.fv-page {
  background: var(--fdv-surface-card);
  border: 1px solid var(--fdv-border-subtle);
  border-radius: var(--fdv-radius-lg);
  box-shadow: var(--fdv-shadow-sm);
  padding: var(--fdv-space-lg) var(--fdv-space-xl) var(--fdv-space-xl);
  margin-top: var(--fdv-space-lg);
  font-size: 13px;
}

/* ---- Barra de ações + badges de atalho ----------------------------------- */
.fv-toolbar {
  display: flex; align-items: center; gap: var(--fdv-space-sm); flex-wrap: wrap;
  padding: var(--fdv-space-sm) 0 var(--fdv-space-md);
  border-bottom: 1px solid var(--fdv-border-subtle); margin-bottom: var(--fdv-space-md);
}
.fv-toolbar button {
  background: #fff; color: var(--fdv-text-primary); border: 1px solid var(--fdv-border-field);
  border-radius: var(--fdv-radius-sm); padding: 0 12px; height: var(--fdv-input-h);
  font: inherit; font-weight: 600; font-size: 12.5px; line-height: 1; display: inline-flex; align-items: center; gap: 8px;
}
.fv-toolbar button:hover:not(:disabled) { background: var(--fdv-surface-highlight); border-color: var(--fdv-brand-primary); }
.fv-toolbar button.fv-primary { background: var(--fdv-brand-primary); color: #fff; border-color: var(--fdv-brand-primary); }
.fv-toolbar button.fv-primary:hover:not(:disabled) { background: var(--fdv-brand-primary-hover); }
.fv-toolbar button.fv-danger { color: var(--fdv-status-danger); border-color: #fca5a5; }
.fv-toolbar .fv-sep { width: 1px; height: 22px; background: var(--fdv-border-subtle); margin: 0 4px; }
button[data-hotkey]::after {
  content: attr(data-hotkey);
  font-family: var(--fdv-font-mono); font-size: 10px; font-weight: 700; line-height: 1;
  padding: 3px 5px; border-radius: 3px; background: rgba(0,0,0,.08); color: inherit; opacity: .85;
}
.fv-primary[data-hotkey]::after { background: rgba(255,255,255,.2); }

/* ---- Abas (fases) semânticas --------------------------------------------- */
.fv-tabs, .fv-toolbar .fv-tabs { display: flex; gap: 2px; flex-wrap: wrap; }
.fv-fase, .fv-tab {
  width: auto; height: var(--fdv-input-h); border-radius: var(--fdv-radius-sm) var(--fdv-radius-sm) 0 0;
  border: 1px solid transparent; border-bottom: 2px solid transparent;
  background: transparent; color: var(--fdv-text-secondary); font-weight: 600; padding: 0 12px; text-align: center;
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 12.5px;
}
.fv-fase b, .fv-tab b {
  display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%;
  background: var(--fdv-surface-dim); color: var(--fdv-text-secondary); font-size: 11px; font-weight: 700;
}
.fv-fase:hover, .fv-tab:hover { background: var(--fdv-surface-low); color: var(--fdv-text-primary); }
.fv-fase.ativa, .fv-tab.ativa { background: #fff; color: var(--fdv-brand-primary); border-color: var(--fdv-border-subtle); border-bottom-color: var(--fdv-brand-primary); }
.fv-fase.ativa b, .fv-tab.ativa b { background: var(--fdv-brand-primary); color: #fff; }
.fv-fase-titulo { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--fdv-text-secondary); margin: var(--fdv-space-sm) 0 var(--fdv-space-sm); }

/* ---- Painel de campos (grid 12 colunas) ---------------------------------- */
.fv-panel {
  background: var(--fdv-surface-card); color: var(--fdv-text-primary);
  border: 1px solid var(--fdv-border-subtle); border-radius: var(--fdv-radius-md);
  padding: var(--fdv-space-lg); margin-bottom: var(--fdv-space-md);
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--fdv-space-md) var(--fdv-space-md); align-items: end;
}
.fv-panel > h2 { grid-column: 1 / -1; margin: 0; }
.fv-panel label, .fv-panel .fv-lbl {
  font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
  color: var(--fdv-text-secondary); margin: 0; display: block; min-width: 0;
}
.fv-panel label > span { display: block; margin-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fv-panel label > span small { font-weight: 500; color: var(--fdv-text-muted); text-transform: none; letter-spacing: 0; }
.fv-panel input, .fv-panel select, .fv-panel textarea {
  width: 100%; height: var(--fdv-input-h); padding: 0 10px; margin: 0;
  border: 1px solid var(--fdv-border-field); border-radius: var(--fdv-radius-sm);
  font: inherit; font-size: 13px; font-weight: 400; text-transform: none; letter-spacing: 0;
  color: var(--fdv-text-primary); background: #fff;
}
.fv-panel input:hover, .fv-panel select:hover, .fv-panel textarea:hover { border-color: #94a3b8; }
.fv-panel textarea { height: auto; padding: 8px 10px; line-height: 1.4; }
.fv-panel input[readonly], .fv-panel select:disabled, .fv-panel input:disabled, .fv-panel textarea:disabled { background: var(--fdv-surface-dim); color: var(--fdv-text-primary); border-color: var(--fdv-border-subtle); }
.fv-panel input[type="checkbox"], .fv-panel input[type="radio"] {
  width: 16px; height: 16px; display: inline-block; margin: 0 6px 0 0; vertical-align: middle; accent-color: var(--fdv-brand-primary);
}
.fv-panel .fv-inline { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; min-height: var(--fdv-input-h); }
.fv-panel .fv-inline > span:first-child { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--fdv-text-secondary); }
.fv-panel .fv-inline label { display: inline-flex; align-items: center; text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 13px; color: var(--fdv-text-primary); }
.fv-panel .fv-inline .fv-lbl { min-width: 120px; }
.fv-panel button { height: var(--fdv-input-h); }
.fv-panel .hint { grid-column: 1 / -1; margin: 0; }
.fv-num, input.fv-num, .fv-mono-num { text-align: right; font-family: var(--fdv-font-mono); font-variant-numeric: tabular-nums; }
.c1 { grid-column: span 1; } .c2 { grid-column: span 2; } .c3 { grid-column: span 3; }
.c4 { grid-column: span 4; } .c5 { grid-column: span 5; } .c6 { grid-column: span 6; }
.c7 { grid-column: span 7; } .c8 { grid-column: span 8; } .c9 { grid-column: span 9; }
.c10 { grid-column: span 10; } .c11 { grid-column: span 11; } .c12 { grid-column: span 12; }
.fv-col-1 { grid-column: span 1; } .fv-col-2 { grid-column: span 2; } .fv-col-3 { grid-column: span 3; }
.fv-col-4 { grid-column: span 4; } .fv-col-6 { grid-column: span 6; } .fv-col-12 { grid-column: span 12; }

/* ---- Barra de título, seções, segmentados (mockup DEC-026) ------------------ */
.fv-titlebar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: var(--fdv-space-sm); }
.fv-titlebar h1 { margin: 0; font-size: 17px; }
.fv-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: var(--fdv-radius-sm); background: var(--fdv-surface-highlight); color: var(--fdv-brand-primary); font-family: var(--fdv-font-mono); font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.fv-badge-muted { background: var(--fdv-surface-dim); color: var(--fdv-text-secondary); }
.fv-badge-ok { background: #d1fae5; color: #065f46; }
.fv-badge-erro { background: #fee2e2; color: #991b1b; }
.fv-panel-secoes { display: block; padding: 0; border: 0; background: transparent; }
.fv-sec {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--fdv-space-md); align-items: end;
  background: var(--fdv-surface-card); border: 1px solid var(--fdv-border-subtle); border-radius: var(--fdv-radius-md);
  padding: var(--fdv-space-md) var(--fdv-space-lg) var(--fdv-space-lg); margin-bottom: var(--fdv-space-md);
}
.fv-sec > h3 {
  grid-column: 1 / -1; margin: 0 0 2px; padding-bottom: 8px; border-bottom: 1px solid var(--fdv-border-subtle);
  display: flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 700; color: var(--fdv-brand-primary);
}
.fv-sec > h3 small { margin-left: auto; font-family: var(--fdv-font-mono); font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--fdv-text-muted); }
.fv-sec .hint { grid-column: 1 / -1; }
.fv-seg { align-items: flex-end; position: relative; }
.fv-seg > span:first-child { width: 100%; }
.fv-seg label { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: var(--fdv-input-h); padding: 0 14px; border: 1px solid var(--fdv-border-field); border-radius: var(--fdv-radius-sm); background: var(--fdv-surface-low); font-size: 12.5px; font-weight: 600; cursor: pointer; color: var(--fdv-text-secondary); margin: 0; flex: 1 1 auto; }
.fv-seg label:hover { border-color: var(--fdv-brand-primary); color: var(--fdv-text-primary); }
.fv-seg label:has(input:checked) { background: var(--fdv-brand-primary); border-color: var(--fdv-brand-primary); color: #fff; }
.fv-seg label input { position: absolute; opacity: 0; width: 0; height: 0; margin: 0; }
.fv-seg label:has(input:checked)::before { content: "\2713"; font-size: 11px; }
.fv-panel .fv-inline.fv-seg { gap: 6px; }
.fv-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: var(--fdv-space-lg); align-items: start; }
.fv-layout-main { min-width: 0; }
.fv-layout-side { display: flex; flex-direction: column; gap: var(--fdv-space-md); position: sticky; top: 64px; }
.fv-card { background: var(--fdv-surface-card); border: 1px solid var(--fdv-border-subtle); border-radius: var(--fdv-radius-md); padding: var(--fdv-space-md) var(--fdv-space-lg); }
.fv-card h3 { margin: 0 0 10px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--fdv-text-secondary); }
.fv-kv { display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; margin: 0; font-size: 12.5px; }
.fv-kv dt { color: var(--fdv-text-secondary); }
.fv-kv dd { margin: 0; font-family: var(--fdv-font-mono); font-weight: 700; color: var(--fdv-text-primary); text-align: right; }
kbd { display: inline-block; padding: 2px 7px; border-radius: 4px; background: var(--fdv-brand-primary); color: #fff; font-size: 10.5px; font-weight: 700; font-family: var(--fdv-font-mono); }

/* ---- Tabelas / grades ----------------------------------------------------- */
.fv-grid { margin-top: 0; background: #fff; color: var(--fdv-text-primary); font-size: 12px; border: 1px solid var(--fdv-border-subtle); border-radius: var(--fdv-radius-md); overflow: hidden; }
.fv-grid th, .fv-grid td { padding: 6px 10px; border: 0; border-bottom: 1px solid var(--fdv-border-subtle); white-space: nowrap; }
.fv-grid th { background: var(--fdv-surface-dim); position: sticky; top: 0; z-index: 1; }
.fv-grid tbody tr:nth-child(even) td { background: var(--fdv-surface-low); }
.fv-grid tbody tr:hover td { background: var(--fdv-surface-highlight); }
.fv-grid tfoot td { background: var(--fdv-surface-low); font-weight: 700; }
.fv-grid td.fv-num, .fv-grid th.fv-num { text-align: right; font-family: var(--fdv-font-mono); font-variant-numeric: tabular-nums; }
.fv-grid th.fv-num { font-family: var(--fdv-font-sans); }
.fv-grid input[type="number"] { width: 70px; height: 28px; padding: 0 6px; text-align: right; border: 1px solid var(--fdv-border-field); border-radius: var(--fdv-radius-xs); font-family: var(--fdv-font-mono); }
.fv-grid .fv-estoque { display: block; color: var(--fdv-text-muted); font-size: 10px; text-align: right; }
.fv-grid tr.selecionada td, .fv-grid tbody tr.selecionada:hover td { background: var(--fdv-surface-highlight); box-shadow: inset 3px 0 0 var(--fdv-brand-primary); }
.fv-grid td.fv-center, .fv-grid th.fv-center { text-align: center; }
.fv-grid-lista { width: 100%; }
.fv-grid-lista tbody tr { cursor: pointer; }
.fv-grid-lista tr.fv-bloqueado td { color: var(--fdv-status-danger); }
.fv-grid tr.fv-tree-pai td, .fv-grid tr.fv-tree-n0 td { background: var(--fdv-surface-highlight) !important; font-weight: 700; color: var(--fdv-brand-primary); }
.fv-grid tr.fv-tree-n1 td { background: var(--fdv-surface-low) !important; font-weight: 600; }
.fv-grid tr.fv-tree-filho td:first-child { padding-left: 28px; }
.fv-grid tr.fv-tree-toggle { cursor: pointer; }
.fv-grid th.fv-check, .fv-grid td.fv-check { width: 36px; text-align: center; }
.fv-grid-wrap { overflow: auto; max-height: 45vh; margin-top: var(--fdv-space-sm); border-radius: var(--fdv-radius-md); }
.fv-totais {
  display: flex; flex-wrap: wrap; gap: var(--fdv-space-md); align-items: stretch;
  margin-top: var(--fdv-space-md); padding: var(--fdv-space-md); background: var(--fdv-surface-low); border-radius: var(--fdv-radius-md); border: 1px solid var(--fdv-border-subtle);
}
.fv-tot { display: flex; flex-direction: column; gap: 4px; min-width: 160px; flex: 1 1 160px; }
.fv-tot .fv-lbl { font-size: 10px; }
.fv-tot input { background: transparent !important; border: 0 !important; padding: 0 !important; height: auto !important; font-size: 18px; font-weight: 700; font-family: var(--fdv-font-mono); text-align: left !important; }
.fv-tot-final { background: var(--fdv-brand-primary); border-radius: var(--fdv-radius-md); padding: 10px 14px; margin-left: auto; flex: 0 1 260px; }
.fv-tot-final .fv-lbl { color: rgba(255,255,255,.75); }
.fv-tot-final input { color: #fff !important; font-size: 26px; }
.fv-acoes a { margin-right: 10px; font-weight: 600; font-size: 12px; }
.fv-contagem { margin-left: auto; font-size: 12px; color: var(--fdv-text-secondary); align-self: center; font-family: var(--fdv-font-mono); }
.fv-link-voltar { align-self: center; margin-left: 4px; font-weight: 600; text-decoration: none; }
.fv-link-voltar:hover { text-decoration: underline; }
.fv-btn-slot { align-self: end; }
.fv-btn-slot button { height: var(--fdv-input-h); width: 100%; }
.fv-filtro { margin-bottom: var(--fdv-space-md); background: var(--fdv-surface-low); }

/* ---- Diálogos --------------------------------------------------------------- */
dialog.fv-dialog {
  border: 0; border-radius: var(--fdv-radius-lg); padding: 0; width: min(96vw, 920px);
  background: var(--fdv-surface-card); color: var(--fdv-text-primary); box-shadow: 0 20px 50px rgba(0,0,0,.25);
}
dialog.fv-dialog-sm { width: min(96vw, 640px); }
dialog.fv-dialog::backdrop { background: rgba(15, 23, 42, .5); backdrop-filter: blur(1px); }
.fv-dialog-title {
  background: var(--fdv-brand-primary); color: #fff; padding: 10px 16px; font-weight: 700; font-size: 14px;
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
}
.fv-dialog-title button { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.35); color: #fff; height: 28px; padding: 0 10px; font-size: 12px; }
.fv-dialog-title button:hover:not(:disabled) { background: rgba(255,255,255,.22); }
.fv-dialog-x { font-size: 16px; line-height: 1; }
.fv-dialog-body { padding: var(--fdv-space-lg); }
.fv-dialog-body .fv-panel { padding: 0; border: 0; margin: 0; }
.fv-dialog-body .fv-grid-wrap { margin-top: var(--fdv-space-md); }
.fv-dialog-acoes { margin: 0; padding: var(--fdv-space-md) var(--fdv-space-lg); border-top: 1px solid var(--fdv-border-subtle); border-bottom: 0; background: var(--fdv-surface-low); justify-content: flex-end; border-radius: 0 0 var(--fdv-radius-lg) var(--fdv-radius-lg); }
.fv-dialog .hint { padding: 0 var(--fdv-space-lg); }
.fv-ficha input.fv-num { text-align: right; }
.fv-ficha .fv-check { align-self: end; padding-bottom: 8px; }
.fv-ficha-aviso { color: var(--fdv-status-danger); font-weight: 600; }

/* ---- Menus (Início / Consultas) --------------------------------------------- */
.fv-menu { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--fdv-space-md); margin-top: var(--fdv-space-md); }
.fv-menu-item {
  display: block; padding: var(--fdv-space-lg); border: 1px solid var(--fdv-border-subtle); border-left: 4px solid var(--fdv-brand-accent);
  border-radius: var(--fdv-radius-md); background: var(--fdv-surface-card); color: var(--fdv-text-primary); text-decoration: none;
  box-shadow: var(--fdv-shadow-sm); transition: box-shadow .12s, transform .12s;
}
.fv-menu-item strong { display: block; font-size: 15px; margin-bottom: 4px; color: var(--fdv-brand-primary); }
.fv-menu-item span { font-size: 12px; color: var(--fdv-text-secondary); }
.fv-menu-item:hover { box-shadow: var(--fdv-shadow-md); transform: translateY(-1px); border-color: var(--fdv-brand-primary); }
.fv-menu-item.fv-menu-off { opacity: .55; cursor: not-allowed; border-left-color: var(--fdv-text-muted); transform: none; }

/* ---- Cadastro de cliente / listas auxiliares ------------------------------ */
.fv-cnpj { display: flex; align-items: center; gap: 6px; font-weight: 600; color: var(--fdv-text-secondary); }
.fv-cnpj input { width: 100%; font-family: var(--fdv-font-mono); }
.fv-cnpj input[maxlength="4"], .fv-cnpj input[maxlength="2"] { max-width: 72px; }
.fv-inline-fields { display: flex; align-items: center; gap: 6px; }
.fv-inline-fields input { flex: 1; }
.fv-inline-fields button { height: var(--fdv-input-h); padding: 0 10px; white-space: nowrap; }
.fv-w80 { max-width: 80px; flex: 0 0 80px !important; }
.fv-w60 { max-width: 60px; flex: 0 0 60px !important; }
.fv-w40 { max-width: 40px; flex: 0 0 40px !important; }
.fv-list-toolbar { display: flex; gap: 6px; margin-bottom: 6px; }
.fv-list-toolbar button { height: 30px; padding: 0 10px; font-size: 12px; }
.fv-list { list-style: none; margin: 0; padding: 0; background: #fff; color: var(--fdv-text-primary); font-size: 12.5px; min-height: 60px; max-height: 240px; overflow: auto; border: 1px solid var(--fdv-border-field); border-radius: var(--fdv-radius-sm); }
.fv-list li { padding: 7px 10px; border-bottom: 1px solid var(--fdv-border-subtle); cursor: pointer; }
.fv-list li:hover { background: var(--fdv-surface-low); }
.fv-list li.selecionada { background: var(--fdv-surface-highlight); box-shadow: inset 3px 0 0 var(--fdv-brand-primary); }
.fv-list li.fv-vazio { color: var(--fdv-text-muted); cursor: default; }
.fv-list-check label { display: flex; align-items: center; gap: 8px; color: var(--fdv-text-primary); font-weight: 500; text-transform: none; letter-spacing: 0; font-size: 13px; }
.fv-list .fv-ref-outra { font-style: italic; }
.fv-nota { color: var(--fdv-status-warning); font-size: 12px; margin: 0; grid-column: 1 / -1; }
.fv-select-list { width: 100%; background: #fff; color: var(--fdv-text-primary); font-size: 12.5px; height: auto !important; padding: 4px !important; }
.fv-resultado { font-weight: 600; color: var(--fdv-brand-primary); min-height: 1.2em; white-space: pre-line; font-size: 12.5px; margin: var(--fdv-space-md) 0 0; padding: 10px 12px; background: var(--fdv-surface-highlight); border-radius: var(--fdv-radius-sm); border-left: 3px solid var(--fdv-brand-primary); }
.fv-resultado:empty { display: none; }
#resultado { font-size: 12px; white-space: pre-wrap; font-family: var(--fdv-font-mono); }
#resultado:empty { display: none; }
.fv-hidden { display: none !important; }

/* ---- Responsivo ---------------------------------------------------------------- */
@media (max-width: 1023px) {
  .fv-layout { grid-template-columns: 1fr; }
  .fv-layout-side { position: static; }
  .app-header { flex-wrap: wrap; padding: 6px var(--fdv-space-md); }
  .app-nav { order: 3; width: 100%; }
  .app-nav a { padding: 10px 10px; }
  main { padding: var(--fdv-space-md); }
  .fv-page main, main.fv-page { padding: var(--fdv-space-md); margin-top: var(--fdv-space-md); }
  .c1, .c2, .c3, .c4, .c5 { grid-column: span 6; }
  .c6, .c7, .c8, .c9, .c10, .c11 { grid-column: span 12; }
  :root { --fdv-input-h: 40px; }
}
@media (max-width: 767px) {
  :root { --fdv-input-h: 44px; }
  .app-header { position: static; }
  .app-user small { display: none; }
  .app-sync { display: none; }
  .c1, .c2, .c3, .c4, .c5, .c6, .c7, .c8, .c9, .c10, .c11, .c12 { grid-column: span 12; }
  .fv-panel { padding: var(--fdv-space-md); gap: var(--fdv-space-sm); }
  .fv-toolbar { position: sticky; top: 0; background: #fff; z-index: 10; padding-top: var(--fdv-space-sm); }
  .fv-toolbar button { flex: 1 1 auto; justify-content: center; }
  .fv-totais { grid-template-columns: auto 1fr; }
  .fv-menu { grid-template-columns: 1fr; }
  .fv-grid th, .fv-grid td { padding: 8px; }
  dialog.fv-dialog, dialog.fv-dialog-sm { width: 100vw; max-width: 100vw; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .fv-dialog-body .fv-grid-wrap { max-height: 40vh; }
  .fv-contagem { margin-left: 0; width: 100%; }
}
@media print {
  .app-header, .fv-toolbar { display: none !important; }
  body { background: #fff; }
  .fv-page main, main.fv-page { border: 0; box-shadow: none; }
}

/* ---- Listas com painel lateral, cartões da central (mockups 2-4, DEC-026) ---- */
.fv-layout-wide { grid-template-columns: minmax(0, 1fr) 320px; }
.fv-sec-head { display: flex; align-items: center; gap: 8px; margin: var(--fdv-space-md) 0 var(--fdv-space-sm); font-size: 13.5px; font-weight: 700; color: var(--fdv-brand-primary); }
.fv-sec-head small { margin-left: auto; font-family: var(--fdv-font-mono); font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--fdv-text-muted); }
.fv-grid-wrap-lista { max-height: 62vh; margin-top: 0; border: 1px solid var(--fdv-border-subtle); }
.fv-grid-wrap-lista .fv-grid { border: 0; }
.fv-side-cliente h3 { display: flex; align-items: center; gap: 8px; }
.fv-side-cliente h3 .fv-badge { margin-left: auto; }
.fv-side-nome { font-size: 15px; font-weight: 800; color: var(--fdv-brand-primary); margin: 2px 0 10px; line-height: 1.2; }
.fv-kv dd.fv-wrap { white-space: normal; word-break: break-all; font-weight: 500; font-size: 11.5px; }
.fv-hero { background: var(--fdv-brand-primary); color: #fff; border-radius: var(--fdv-radius-md); padding: 12px 14px; margin: 12px 0; display: flex; flex-direction: column; gap: 2px; }
.fv-hero-lbl { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.7); }
.fv-hero strong { font-size: 22px; font-family: var(--fdv-font-mono); }
.fv-hero small { font-size: 10.5px; color: rgba(255,255,255,.7); font-family: var(--fdv-font-mono); }
.fv-side-acoes { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.fv-side-acoes button { width: 100%; }
.fv-side-acoes button:not(.fv-primary) { background: #fff; color: var(--fdv-brand-primary); border-color: var(--fdv-border-field); }
.fv-side-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.fv-side-list li { border: 1px solid var(--fdv-border-subtle); border-radius: var(--fdv-radius-sm); padding: 8px 10px; cursor: pointer; background: var(--fdv-surface-low); }
.fv-side-list li:hover { border-color: var(--fdv-brand-primary); background: var(--fdv-surface-highlight); }
.fv-side-list li.fv-vazio { cursor: default; color: var(--fdv-text-muted); background: transparent; border-style: dashed; }
.fv-side-list .fv-sl-top { display: flex; justify-content: space-between; gap: 8px; font-family: var(--fdv-font-mono); font-size: 10px; color: var(--fdv-text-secondary); text-transform: uppercase; }
.fv-side-list .fv-sl-nome { font-weight: 700; font-size: 12px; color: var(--fdv-text-primary); margin: 2px 0; }
.fv-side-list .fv-sl-obs { font-size: 11px; color: var(--fdv-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fv-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--fdv-space-md); }
.fv-cards-1 { grid-template-columns: 1fr; }
.fv-card-link { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--fdv-text-primary); transition: box-shadow .12s, transform .12s; }
.fv-card-link:hover { box-shadow: var(--fdv-shadow-md); transform: translateY(-1px); border-color: var(--fdv-brand-primary); }
.fv-card-link strong { font-size: 14.5px; color: var(--fdv-brand-primary); }
.fv-card-link > span:not(.fv-card-tag) { font-size: 12px; color: var(--fdv-text-secondary); }
.fv-card-link em { font-style: normal; font-weight: 700; font-size: 12px; color: var(--fdv-brand-primary); margin-top: auto; }
.fv-card-tag { align-self: flex-end; font-family: var(--fdv-font-mono); font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--fdv-status-info); background: var(--fdv-surface-highlight); padding: 2px 6px; border-radius: 3px; }
@media (max-width: 1023px) { .fv-layout-wide { grid-template-columns: 1fr; } }

/* ---- Indicadores (DEC-027) ---- */
.fv-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--fdv-space-md); margin: 12px 0 18px; }
.fv-kpi { background: var(--fdv-surface-card); border: 1px solid var(--fdv-border-subtle); border-left: 4px solid var(--fdv-brand-primary); border-radius: var(--fdv-radius-md); padding: 10px 14px; display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: inherit; }
.fv-kpi:hover { border-color: var(--fdv-brand-primary); }
.fv-kpi-lbl { font-size: 10px; text-transform: uppercase; letter-spacing: .06em; color: var(--fdv-text-secondary); }
.fv-kpi strong { font-size: 20px; font-family: var(--fdv-font-mono); color: var(--fdv-text-primary); line-height: 1.2; }
.fv-kpi small { font-size: 11px; color: var(--fdv-text-secondary); font-family: var(--fdv-font-mono); }
.fv-kpi-alerta { border-left-color: #c0392b; }
.fv-kpi-alerta strong { color: #c0392b; }
.fv-kpi-ok { border-left-color: #1e8449; }
.fv-card-kpis { display: flex; gap: 14px; flex-wrap: wrap; margin: 6px 0 8px; }
.fv-card-kpis b { font-family: var(--fdv-font-mono); font-size: 16px; color: var(--fdv-brand-primary); display: block; }
.fv-card-kpis small { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--fdv-text-secondary); }
.fv-bar { height: 6px; background: var(--fdv-surface-low); border-radius: 3px; overflow: hidden; margin: 6px 0; }
.fv-bar > span { display: block; height: 100%; width: 0; background: var(--fdv-brand-primary); transition: width .4s; }
.fv-bar > span.fv-bar-ok { background: #1e8449; }
.fv-kpi-info { font-size: 10.5px; color: var(--fdv-text-muted); font-family: var(--fdv-font-mono); }
.fv-titlebar .fv-kpi-badge { margin-left: auto; }

/* ---- Geolocalização (DEC-027) ---- */
.fv-mapa { width: 100%; height: 200px; border: 1px solid var(--fdv-border-subtle); border-radius: var(--fdv-radius-sm); display: block; }
.fv-mapa-links { display: flex; justify-content: space-between; gap: 8px; font-size: 11px; margin-top: 6px; flex-wrap: wrap; }
.fv-mapa-links a { color: var(--fdv-brand-primary); }
.fv-mapa-legenda { color: var(--fdv-text-secondary); font-family: var(--fdv-font-mono); font-size: 10.5px; }
.fv-mapa-vazio { margin: 0; font-size: 11.5px; color: var(--fdv-text-muted); border: 1px dashed var(--fdv-border-subtle); border-radius: var(--fdv-radius-sm); padding: 14px; text-align: center; }
.fv-geo-status { font-size: 11px; color: var(--fdv-text-secondary); font-family: var(--fdv-font-mono); }
.fv-geo-status.fv-geo-ok { color: #1e8449; }
.fv-geo-status.fv-geo-erro { color: #c0392b; }

/* ---- Ajuda por tela (DEC-028) ---- */
.app-ajuda { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.45); border-radius: 999px; padding: 3px 10px; font-size: 11px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.app-ajuda:hover { background: rgba(255,255,255,.15); }
.app-ajuda::after { content: none; }
.fv-ajuda .fv-dialog-body { padding: var(--fdv-space-md) var(--fdv-space-lg); font-size: 13px; line-height: 1.5; }
.fv-ajuda-resumo { margin: 0 0 10px; font-weight: 600; color: var(--fdv-text-primary); }
.fv-ajuda h4 { margin: 12px 0 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--fdv-text-secondary); }
.fv-ajuda ol, .fv-ajuda ul { margin: 0; padding-left: 20px; }
.fv-ajuda li { margin: 3px 0; }
.fv-ajuda-atalhos { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px 12px; }
.fv-ajuda-geral { margin-top: 14px; border-top: 1px dashed var(--fdv-border-subtle); padding-top: 8px; }
.fv-ajuda-geral summary { cursor: pointer; font-size: 12px; color: var(--fdv-brand-primary); font-weight: 600; }