/* ==========================================================================
   MTI Soluções em Informática — Sistema de Orçamentos
   Design system v3 — 2026-10 — padrão visual do Gestor (verde #00985F · grafite · Montserrat)

   Compatibilidade: TODOS os nomes de classes e variáveis (--verde, --texto-medio, --sp-4 ...)
   da v2 foram mantidos, então HTML/JS existentes continuam funcionando sem alteração de lógica.
   Tema escuro: [data-theme="dark"] no <html> (preferência salva só no navegador, nas telas admin).
   ========================================================================== */

/* ---------- Fonte (Montserrat, licença OFL, hospedada no próprio sistema) ---------- */
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/montserrat-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/montserrat-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Montserrat;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/montserrat-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/montserrat-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/montserrat-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/montserrat-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Montserrat;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/montserrat-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/montserrat-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- Tokens ---------- */
:root {
  /* Marca (Gestor) */
  --on-brand:#ffffff;
  --brand:#00985F; --brand-d:#00794c; --brand-l:#e6f6ef; --brand-line:#c3e8d8; --graphite:#333333;

  /* Superfícies e texto */
  --bg:#f2f4f3; --surface:#ffffff; --surface-2:#f7f8f8; --line:#e2e6e4; --line-2:#d3d9d6;
  --text:#262b29; --muted:#5d6763; --faint:#8a9591;

  /* Sinais de estado */
  --danger:#c42b2b; --danger-l:#fdeeee; --danger-line:#f1c4c4;
  --warn:#b45309;   --warn-l:#fff4e0;   --warn-line:#f3d9a8;
  --good:#117a45;   --good-l:#e6f6ef;
  --info:#1d5fb4;   --info-l:#e8f1fb;   --info-line:#c4d9f3;

  /* Menu lateral */
  --side-bg:#2b2f2e; --side-text:#c9d1ce; --side-on:#ffffff; --side-line:#3a403e; --side-muted:#8d9894;

  --shadow-sm:0 1px 2px rgba(20,30,25,.06);
  --shadow:0 1px 2px rgba(20,30,25,.06),0 4px 14px rgba(20,30,25,.06);
  --shadow-lg:0 8px 28px rgba(20,30,25,.16);
  --r:10px; --r-sm:8px; --pill:999px;
  --ring:0 0 0 3px rgba(0,152,95,.28);
  --seta:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%235d6763' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");

  /* --- Nomes legados (v2): mapeados para o padrão novo --- */
  --verde:var(--brand);
  --verde-secundario:var(--brand-d);
  --verde-claro:var(--brand);
  --verde-tint:var(--brand-l);
  --verde-tint-forte:var(--brand-line);
  --branco:var(--on-brand);
  --superficie:var(--bg);
  --superficie-2:var(--surface-2);
  --borda:var(--line);
  --borda-forte:var(--line-2);
  --texto:var(--text);
  --texto-medio:var(--muted);
  --texto-suave:var(--faint);
  --perigo:var(--danger); --perigo-tint:var(--danger-l); --perigo-borda:var(--danger-line);
  --alerta:var(--warn);   --alerta-tint:var(--warn-l);
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  --raio:var(--r); --raio-sm:var(--r-sm); --raio-pill:var(--pill);
  --sombra-sm:var(--shadow-sm); --sombra:var(--shadow); --sombra-md:0 4px 12px rgba(20,30,25,.12); --sombra-lg:var(--shadow-lg);
  --fonte:Montserrat,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --fonte-dados:ui-monospace,"SF Mono",Menlo,Consolas,"Roboto Mono",monospace;
  --transicao:140ms cubic-bezier(.4,0,.2,1);
  --side-w:244px;
  color-scheme:light;
}
:root[data-theme="dark"] {
  --on-brand:#06140e;
  --brand:#17b877; --brand-d:#14a468; --brand-l:#14302a; --brand-line:#1f4a3d;
  --bg:#161a19; --surface:#1f2423; --surface-2:#252b2a; --line:#2f3735; --line-2:#3a4442;
  --text:#e8edeb; --muted:#9aa6a2; --faint:#76827e;
  --danger:#f26d6d; --danger-l:#3a2222; --danger-line:#5a3030;
  --warn:#f0a64a;   --warn-l:#3a2f1c;   --warn-line:#5a4624;
  --good:#4cd08a;   --good-l:#14302a;
  --info:#6aa6f0;   --info-l:#1b2a3d;   --info-line:#2d4668;
  --side-bg:#111514; --side-line:#262c2a;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow:0 1px 2px rgba(0,0,0,.4),0 4px 14px rgba(0,0,0,.25); --shadow-lg:0 8px 28px rgba(0,0,0,.5);
  --ring:0 0 0 3px rgba(23,184,119,.35);
  --seta:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239aa6a2' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  --sombra-md:0 4px 12px rgba(0,0,0,.45);
  color-scheme:dark;
}

/* ---------- Reset e base ---------- */
*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; font-family:var(--fonte); font-size:14px; line-height:1.55;
  color:var(--text); background:var(--bg);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
h1,h2,h3,h4,h5 { margin:0 0 var(--sp-3); line-height:1.25; font-weight:700; letter-spacing:-.01em; color:var(--text); }
h1 { font-size:17px; }
h2 { font-size:21px; }
h3 { font-size:16px; }
h4 { font-size:14px; }
p { margin:0 0 var(--sp-3); }
a { color:var(--brand-d); text-decoration:none; transition:color var(--transicao); }
a:hover { color:var(--brand); text-decoration:underline; }
:where(:root[data-theme="dark"]) a { color:var(--brand); }
hr { border:none; border-top:1px solid var(--line); margin:var(--sp-5) 0; }
code {
  font-family:var(--fonte-dados); font-size:12px; background:var(--surface-2);
  padding:2px 6px; border-radius:6px; color:var(--text); border:1px solid var(--line);
}
:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
.skip { position:absolute; left:-9999px; top:8px; background:var(--brand); color:var(--on-brand); padding:8px 12px; border-radius:8px; z-index:100; }
.skip:focus { left:8px; }

/* ---------- Estrutura com menu lateral (telas admin) ---------- */
.shell { display:flex; min-height:100vh; }
.side {
  width:var(--side-w); background:var(--side-bg); color:var(--side-text);
  position:fixed; inset:0 auto 0 0; z-index:60; display:flex; flex-direction:column;
  transition:transform .2s ease;
}
.side .brand {
  display:flex; align-items:center; gap:11px; padding:16px 16px 14px;
  border-bottom:1px solid var(--side-line); color:#fff; text-decoration:none;
}
.side .brand:hover { text-decoration:none; color:#fff; }
.side .brand img { width:38px; height:38px; border-radius:9px; background:#fff; padding:2px; flex-shrink:0; object-fit:contain; }
.side .brand b { display:block; font-size:14px; font-weight:700; line-height:1.15; }
.side .brand small { display:block; font-size:11px; font-weight:500; color:var(--side-muted); margin-top:2px; }
.side nav { flex:1; overflow-y:auto; padding:8px 10px 14px; scrollbar-width:thin; scrollbar-color:var(--side-line) transparent; }
.nav-group { margin-top:14px; }
.nav-group > span {
  display:block; padding:0 10px 6px; font-size:10.5px; font-weight:700;
  letter-spacing:.09em; text-transform:uppercase; color:var(--side-muted);
}
.side a.nav-i {
  display:flex; align-items:center; gap:10px; padding:9px 11px; margin-bottom:2px;
  border-radius:var(--r-sm); color:var(--side-text); font-size:13px; font-weight:500;
  text-decoration:none; transition:background var(--transicao), color var(--transicao);
}
.side a.nav-i svg { flex-shrink:0; opacity:.85; }
.side a.nav-i:hover { background:rgba(255,255,255,.07); color:#fff; text-decoration:none; }
.side a.nav-i.on { background:var(--brand); color:var(--on-brand); font-weight:600; }
.side a.nav-i.on svg { opacity:1; }
.side a.nav-i .ext { margin-left:auto; opacity:.5; }
.side-foot { padding:10px 16px 14px; border-top:1px solid var(--side-line); font-size:11px; color:var(--side-muted); }

.main-col { flex:1; min-width:0; margin-left:var(--side-w); display:flex; flex-direction:column; min-height:100vh; }
.scrim { display:none; }

/* ---------- Barra superior ---------- */
.topo {
  display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap;
  background:var(--surface); border-bottom:1px solid var(--line);
  padding:10px var(--sp-5); min-height:58px;
  position:sticky; top:0; z-index:50;
}
.topo h1 { margin:0; font-size:16px; font-weight:700; display:flex; align-items:center; gap:var(--sp-2); }
.topo img { border-radius:8px; flex-shrink:0; }
.topo a { color:var(--muted); font-weight:500; }
.topo a:hover { color:var(--brand-d); }
.topo-tit { display:flex; align-items:center; gap:12px; min-width:0; }
.top-r { margin-left:auto; display:flex; align-items:center; gap:10px; }
.uname { font-size:13px; font-weight:600; color:var(--text); }
.uname:empty { display:none; }
.menu-btn { display:none !important; }
/* Telas sem menu lateral (cliente, fornecedor, login): barra com assinatura verde */
body:not(.com-menu) .topo { border-top:3px solid var(--brand); }
body:not(.com-menu) .topo h1 { font-size:15px; }

/* ---------- Layout ---------- */
.container { max-width:1240px; margin:0 auto; padding:var(--sp-5) var(--sp-5) var(--sp-7); width:100%; }
.com-menu .container { max-width:1500px; flex:1; }
.foot { padding:14px var(--sp-5); color:var(--faint); font-size:12px; border-top:1px solid var(--line); }

.card {
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--shadow); padding:var(--sp-5); margin-bottom:var(--sp-4);
}
.card > h3:first-child, .card > h4:first-child { margin-top:0; }
.grid-2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:var(--sp-3); }
.grid-2 > * { min-width:0; }
.toolbar { display:flex; flex-wrap:wrap; gap:var(--sp-2); align-items:center; margin-bottom:var(--sp-3); }
.toolbar input, .toolbar select, .toolbar textarea { margin-bottom:0; }

/* ---------- Formulários ---------- */
label { display:block; font-size:12px; font-weight:600; color:var(--muted); margin-bottom:var(--sp-1); letter-spacing:.01em; }
input, select, textarea {
  width:100%; font-family:inherit; font-size:14px; color:var(--text);
  background:var(--surface); padding:9px 12px; border:1px solid var(--line-2);
  border-radius:var(--r-sm); margin-bottom:var(--sp-3);
  transition:border-color var(--transicao), box-shadow var(--transicao);
}
input::placeholder, textarea::placeholder { color:var(--faint); }
input:hover, select:hover, textarea:hover { border-color:var(--faint); }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--brand); box-shadow:var(--ring); }
input:disabled, select:disabled, textarea:disabled { background:var(--surface-2); color:var(--faint); cursor:not-allowed; }
input[readonly] { background:var(--surface-2); }
textarea { resize:vertical; min-height:72px; }
select {
  appearance:none; background-image:var(--seta); background-repeat:no-repeat;
  background-position:right 12px center; padding-right:34px;
}
input[type="checkbox"], input[type="radio"] {
  appearance:auto; width:16px; height:16px; min-width:16px; padding:0; margin:0;
  border:none; border-radius:0; box-shadow:none; accent-color:var(--brand); cursor:pointer; vertical-align:middle;
}
input[type="checkbox"]:focus, input[type="radio"]:focus { box-shadow:var(--ring); }
input[type="file"] { padding:7px 9px; background:var(--surface-2); cursor:pointer; }

/* ---------- Botões ---------- */
button, .btn {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  font-family:inherit; font-size:13px; font-weight:600; line-height:1.2;
  color:var(--on-brand); background:var(--brand); border:1px solid var(--brand);
  border-radius:9px; padding:9px 15px; cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:background var(--transicao), border-color var(--transicao), color var(--transicao), box-shadow var(--transicao), transform var(--transicao);
}
button:hover, .btn:hover { background:var(--brand-d); border-color:var(--brand-d); color:var(--on-brand); text-decoration:none; }
button:active, .btn:active { transform:translateY(1px); }
button:focus-visible, .btn:focus-visible { outline:none; box-shadow:var(--ring); }
button:disabled, .btn:disabled { opacity:.5; cursor:not-allowed; transform:none; background:var(--surface-2); border-color:var(--line-2); color:var(--faint); }

button.secundario, .btn.secundario { background:var(--surface); color:var(--text); border-color:var(--line-2); }
button.secundario:hover, .btn.secundario:hover { background:var(--surface-2); border-color:var(--faint); color:var(--text); }

button.perigo, .btn.perigo { background:var(--surface); color:var(--danger); border-color:var(--danger); }
button.perigo:hover, .btn.perigo:hover { background:var(--danger-l); border-color:var(--danger); color:var(--danger); }
button.perigo:focus-visible, .btn.perigo:focus-visible { box-shadow:0 0 0 3px var(--danger-line); }

.btn.icon, button.icon { padding:8px; width:36px; height:36px; }
button.ghost, .btn.ghost { background:transparent; border-color:transparent; color:var(--muted); }
button.ghost:hover, .btn.ghost:hover { background:var(--surface-2); border-color:var(--line); color:var(--text); }

/* Ações dentro de tabelas: contorno discreto (o preenchido fica para a ação principal da tela) */
.acoes { display:flex; flex-wrap:wrap; gap:var(--sp-1); }
.acoes button, .acoes .btn, td button, td .btn { padding:6px 11px; font-size:12px; }
.acoes button:not(.perigo):not(.secundario), .acoes .btn:not(.perigo):not(.secundario),
td button:not(.perigo):not(.secundario):not(:disabled), td .btn:not(.perigo):not(.secundario) {
  background:var(--surface); color:var(--brand-d); border-color:var(--brand);
}
:root[data-theme="dark"] .acoes button:not(.perigo):not(.secundario), :root[data-theme="dark"] td button:not(.perigo):not(.secundario):not(:disabled) { color:var(--brand); }
.acoes button:not(.perigo):not(.secundario):hover, .acoes .btn:not(.perigo):not(.secundario):hover,
td button:not(.perigo):not(.secundario):not(:disabled):hover, td .btn:not(.perigo):not(.secundario):hover {
  background:var(--brand-l); color:var(--brand-d); border-color:var(--brand-d);
}

/* ---------- Tabelas ---------- */
.tabela-wrap {
  width:100%; overflow-x:auto; border:1px solid var(--line); border-radius:var(--r);
  background:var(--surface); -webkit-overflow-scrolling:touch;
}
.tabela-wrap table { border:none; margin:0; }
table { width:100%; border-collapse:collapse; font-size:13px; background:var(--surface); }
thead th {
  background:var(--surface-2); color:var(--muted); font-size:11px; font-weight:700;
  letter-spacing:.05em; text-transform:uppercase; text-align:left;
  padding:11px var(--sp-3); border-bottom:1px solid var(--line); white-space:nowrap;
}
tbody td { padding:11px var(--sp-3); border-bottom:1px solid var(--line); vertical-align:middle; font-variant-numeric:tabular-nums; }
tbody tr:last-child td { border-bottom:none; }
tbody tr { transition:background var(--transicao); }
tbody tr:hover { background:var(--surface-2); }

.tabela-comparacao thead th { background:var(--brand); color:var(--on-brand); border-bottom-color:var(--brand-d); }
.tabela-comparacao tbody tr:nth-child(even) { background:var(--surface-2); }
.tabela-comparacao tbody tr:hover { background:var(--brand-l); }
.tabela-comparacao td { padding:var(--sp-3); }
.indisponivel-linha td { background:var(--danger-l); color:var(--danger); }
.indisponivel-linha:hover td { background:var(--danger-l); }

/* ---------- Sinais de estado ---------- */
.badge {
  display:inline-flex; align-items:center; gap:5px; background:var(--brand-l); color:var(--brand-d);
  border:1px solid var(--brand-line); border-radius:var(--pill); padding:3px 10px;
  font-size:11px; font-weight:600; letter-spacing:.01em; white-space:nowrap;
}
:root[data-theme="dark"] .badge { color:var(--brand); }
.badge-alerta { background:var(--danger-l); color:var(--danger); border-color:var(--danger-line); }
:root[data-theme="dark"] .badge-alerta { color:var(--danger); }
.badge-neutro { background:var(--surface-2); color:var(--muted); border-color:var(--line); }
:root[data-theme="dark"] .badge-neutro { color:var(--muted); }
/* Badges semânticos de status do orçamento */
.badge.st-ok { background:var(--good-l); color:var(--good); border-color:var(--brand-line); }
.badge.st-warn { background:var(--warn-l); color:var(--warn); border-color:var(--warn-line); }
.badge.st-info { background:var(--info-l); color:var(--info); border-color:var(--info-line); }
.badge.st-bad { background:var(--danger-l); color:var(--danger); border-color:var(--danger-line); }
.badge.st-neutro { background:var(--surface-2); color:var(--muted); border-color:var(--line); }

.erro { color:var(--danger); font-size:13px; margin:var(--sp-2) 0; }
.erro:empty { display:none; margin:0; }

.preco-destaque {
  display:inline-flex; align-items:center; gap:5px; background:var(--brand-l);
  border:1.5px solid var(--brand); border-radius:var(--r-sm); color:var(--brand-d);
  font-weight:700; padding:4px 10px; white-space:nowrap;
}
:root[data-theme="dark"] .preco-destaque { color:var(--brand); }
.total-destaque { font-size:21px; font-weight:700; color:var(--brand-d); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
:root[data-theme="dark"] .total-destaque { color:var(--brand); }

/* Valor mascarado (status "Confirmar interesse" e demais que ocultam valores) */
.valor-oculto {
  display:inline-block; position:relative; padding:8px 18px; border-radius:var(--r-sm);
  background:repeating-linear-gradient(45deg,var(--warn-l),var(--warn-l) 9px,#ffe9b0 9px,#ffe9b0 18px);
  border:1.5px solid var(--warn); color:#7a4a00; font-weight:700; font-size:13px;
  letter-spacing:.06em; text-transform:uppercase;
}
:root[data-theme="dark"] .valor-oculto { background:repeating-linear-gradient(45deg,#3a2f1c,#3a2f1c 9px,#4a3b21 9px,#4a3b21 18px); color:var(--warn); }

.banner-status {
  background:var(--brand-l); border-left:4px solid var(--brand); border-radius:var(--r-sm);
  padding:var(--sp-3) var(--sp-4); margin-bottom:var(--sp-4); font-size:14px; color:var(--text);
}

/* ---------- Listas de seleção ---------- */
.lista-checkbox {
  display:flex; flex-direction:column; gap:var(--sp-1); background:var(--surface-2);
  border:1px solid var(--line); border-radius:var(--r-sm); padding:var(--sp-3);
  margin-bottom:var(--sp-3); max-height:260px; overflow-y:auto;
}
.lista-checkbox label {
  display:flex; align-items:center; gap:var(--sp-2); font-size:13px; font-weight:400; color:var(--text);
  margin:0; padding:5px 6px; border-radius:var(--r-sm); cursor:pointer; overflow-wrap:anywhere;
  transition:background var(--transicao);
}
.lista-checkbox label:hover { background:var(--surface); }
.linha-check {
  display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; padding:10px var(--sp-3);
  border:1px solid var(--line); border-radius:var(--r-sm); margin-bottom:var(--sp-2);
  background:var(--surface); cursor:pointer; transition:border-color var(--transicao), background var(--transicao);
}
.linha-check:hover { border-color:var(--brand); background:var(--brand-l); }
.linha-check .titulo { font-weight:600; font-size:13px; }
.linha-check .detalhe { font-size:12px; color:var(--muted); margin-left:auto; }

/* ---------- Documentos para impressão (prévia / PDF) — sempre em fundo branco ---------- */
.previa-cabecalho {
  display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:var(--sp-3);
  border-bottom:3px solid var(--brand); padding-bottom:var(--sp-4); margin-bottom:var(--sp-5);
}
.previa-tabela { width:100%; border-collapse:collapse; margin:var(--sp-4) 0; }
.previa-tabela th {
  background:var(--brand); color:#fff; padding:10px var(--sp-3); text-align:left;
  font-size:12px; font-weight:600; text-transform:none; letter-spacing:0;
}
.previa-tabela td { padding:10px var(--sp-3); border-bottom:1px solid var(--line); font-size:13px; }
.previa-total { text-align:right; font-size:20px; font-weight:700; color:var(--brand-d); margin-top:var(--sp-3); font-variant-numeric:tabular-nums; }

/* ---------- Blocos específicos da área do cliente ---------- */
.caixa-upgrade { background:var(--surface-2); border:2px dashed var(--brand); border-radius:var(--r); padding:var(--sp-5); margin:var(--sp-5) 0; }
.caixa-upgrade h4 { margin-top:0; }
.chave-pix {
  display:inline-block; font-family:var(--fonte-dados); font-weight:700; font-size:15px; color:var(--brand-d);
  background:var(--surface); border:1px solid var(--brand-line); padding:8px 12px; border-radius:var(--r-sm);
  margin:var(--sp-1) 0; word-break:break-all;
}
.termo-caixa {
  max-height:340px; overflow-y:auto; border:1px solid var(--line); border-radius:var(--r-sm);
  padding:var(--sp-4); background:var(--surface-2); font-size:13px; line-height:1.65; margin:var(--sp-3) 0;
}
.termo-caixa h4 { margin:var(--sp-4) 0 var(--sp-1); font-size:13px; }
.termo-caixa h4:first-child { margin-top:0; }
.termo-caixa p:last-child { margin-bottom:0; }

/* ---------- Abas internas (a navegação principal do painel agora é o menu lateral) ---------- */
.abas { display:flex; gap:var(--sp-1); overflow-x:auto; border-bottom:1px solid var(--line); margin-bottom:var(--sp-5); scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
.com-menu .abas { display:none; }
.abas .aba {
  border:none; border-bottom:2px solid transparent; border-radius:0; background:transparent;
  color:var(--muted); font-size:13px; font-weight:600; padding:11px var(--sp-3); white-space:nowrap; flex-shrink:0;
}
.abas .aba span { font-size:13px; opacity:.75; }
.abas .aba:hover { background:var(--surface-2); color:var(--text); border-bottom-color:var(--line-2); transform:none; }
.abas .aba.ativa { color:var(--brand-d); border-bottom-color:var(--brand); background:transparent; }
.abas .aba.ativa span { opacity:1; }

/* ---------- Painéis suspensos (notificações) ---------- */
.painel-suspenso { background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-lg); overflow:hidden; }
.painel-suspenso a { display:block; padding:10px var(--sp-4); font-size:13px; color:var(--text); border-bottom:1px solid var(--line); transition:background var(--transicao), color var(--transicao); }
.painel-suspenso a:last-child { border-bottom:none; }
.painel-suspenso a:hover { background:var(--brand-l); color:var(--brand-d); text-decoration:none; }
.contador-sino { background:var(--danger); color:#fff; border-radius:var(--pill); font-size:10px; font-weight:700; padding:1px 5px; min-width:16px; text-align:center; }
#sinoBotao { position:relative; }
#sinoPainel { right:0; top:44px; }

/* ---------- Cartões de indicador (dashboard gerencial) ---------- */
.kpi { background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--brand); border-radius:var(--r-sm); padding:var(--sp-4); text-align:left; box-shadow:var(--shadow-sm); }
.kpi-valor { display:block; font-size:27px; font-weight:700; color:var(--text); letter-spacing:-.03em; line-height:1.1; font-variant-numeric:tabular-nums; }
.kpi-rotulo { display:block; font-size:11px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-top:var(--sp-1); }

/* ---------- Quadro Kanban ---------- */
.kanban { display:flex; gap:var(--sp-3); overflow-x:auto; padding-bottom:var(--sp-2); align-items:flex-start; }
.kanban-coluna { min-width:230px; flex-shrink:0; background:var(--surface-2); border:1px solid var(--line); border-top:3px solid var(--line-2); border-radius:var(--r); padding:var(--sp-3); }
.kanban-coluna.k-ok { border-top-color:var(--brand); }
.kanban-coluna.k-warn { border-top-color:var(--warn); }
.kanban-coluna.k-info { border-top-color:var(--info); }
.kanban-coluna.k-bad { border-top-color:var(--danger); }
.kanban-titulo { display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:var(--sp-2); }
.kanban-card {
  display:block; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm);
  padding:10px var(--sp-3); margin-bottom:var(--sp-2); color:var(--text);
  transition:border-color var(--transicao), box-shadow var(--transicao), transform var(--transicao);
}
.kanban-card:hover { border-color:var(--brand); box-shadow:var(--sombra-md); transform:translateY(-1px); text-decoration:none; color:var(--text); }
.kanban-card strong { display:block; font-size:13px; margin-bottom:2px; }
.kanban-card .meta { font-size:11px; color:var(--muted); }
.kanban-card .data { font-size:10px; color:var(--faint); }

/* ---------- Tela de login (tela dividida) ---------- */
.tela-login { background:var(--bg); min-height:100vh; }
.login-wrap { min-height:100vh; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
.login-lado {
  background:linear-gradient(155deg,#00985F 0%,#00794c 100%); color:#fff;
  display:flex; flex-direction:column; justify-content:center; padding:48px clamp(28px,6vw,80px);
}
.login-lado img { width:64px; height:64px; border-radius:14px; background:#fff; padding:3px; object-fit:contain; margin-bottom:26px; }
.login-lado h2 { color:#fff; font-size:clamp(24px,3vw,32px); margin:0 0 10px; }
.login-lado p { color:rgba(255,255,255,.88); font-size:15px; max-width:420px; margin:0 0 20px; }
.login-lado ul { list-style:none; margin:0; padding:0; max-width:420px; }
.login-lado li { position:relative; padding:7px 0 7px 26px; font-size:14px; color:rgba(255,255,255,.95); }
.login-lado li::before { content:""; position:absolute; left:2px; top:13px; width:11px; height:6px; border-left:2.5px solid #fff; border-bottom:2.5px solid #fff; transform:rotate(-45deg); }
.login-form { display:flex; align-items:center; justify-content:center; padding:var(--sp-5) var(--sp-4); background:var(--bg); }
.login-card { width:100%; max-width:400px; margin:0; padding:var(--sp-6); box-shadow:var(--shadow-lg); border-top:3px solid var(--brand); }
.login-marca { display:flex; align-items:center; gap:var(--sp-3); margin-bottom:var(--sp-5); padding-bottom:var(--sp-4); border-bottom:1px solid var(--line); }
.login-marca img { border-radius:10px; flex-shrink:0; }
.login-rodape { margin:var(--sp-5) 0 0; text-align:center; font-size:12px; color:var(--faint); }

/* ---------- Acessibilidade ---------- */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}

/* ---------- Responsivo ---------- */
@media (max-width:1100px) {
  .container { padding:var(--sp-4) var(--sp-4) var(--sp-6); }
}
@media (max-width:860px) {
  .side { transform:translateX(-100%); box-shadow:var(--shadow-lg); }
  .menu-open .side { transform:none; }
  .menu-open .scrim { display:block; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:55; }
  .main-col { margin-left:0; }
  .menu-btn { display:inline-flex !important; }
  .topo { padding:10px var(--sp-3); }
  .login-wrap { grid-template-columns:1fr; }
  .login-lado { padding:28px 24px; }
  .login-lado ul { display:none; }
  .login-lado img { width:48px; height:48px; margin-bottom:14px; }
  .login-form { padding:var(--sp-5) var(--sp-3) var(--sp-6); align-items:flex-start; }
}
@media (max-width:640px) {
  body { font-size:15px; }
  .topo h1 { font-size:15px; }
  .uname { display:none; }
  .container { padding:var(--sp-3) var(--sp-2) var(--sp-6); }
  .card { padding:var(--sp-3); border-radius:var(--r-sm); }
  .grid-2 { grid-template-columns:1fr; }
  .toolbar { gap:var(--sp-2); }
  .toolbar > * { flex:1 1 100%; }
  .toolbar button, .toolbar .btn { width:100%; }
  table { font-size:12px; }
  thead th, tbody td { padding:9px var(--sp-2); }
  .linha-check .detalhe { margin-left:0; flex-basis:100%; }
  .total-destaque { font-size:19px; }
  button, .btn { padding:11px 15px; }
  .acoes button, .acoes .btn, td button, td .btn { padding:8px 11px; }
  input, select, textarea { font-size:16px; } /* evita zoom automático no iOS */
  #sinoPainel { position:fixed !important; left:var(--sp-2); right:var(--sp-2); top:62px; width:auto !important; }
}

/* ---------- Impressão ---------- */
@media print {
  :root, :root[data-theme="dark"] { --bg:#fff; --surface:#fff; --surface-2:#f7f8f8; --line:#e2e6e4; --text:#262b29; --muted:#5d6763; }
  body { background:#fff; color:#262b29; }
  .side, .scrim, .menu-btn, .foot, .top-r { display:none !important; }
  .main-col { margin-left:0; }
  .topo { position:static; box-shadow:none; border-bottom:none; border-top:none; }
  .card { box-shadow:none; border:none; padding:0; margin-bottom:var(--sp-4); }
  .container { max-width:none; padding:0; }
  .no-print { display:none !important; }
  a { color:#262b29; text-decoration:none; }
}
