/* ===== Gestão GM — tokens portados de design-system/tokens/*.css ===== */
:root{
  --navy-700:#17223a; --navy-600:#253551; --navy-500:#35496e; --navy-400:#4c6795;
  --navy-300:#7a93be; --navy-200:#9db4d4;

  --accent-primary:var(--navy-600);
  --accent-primary-bright:var(--navy-500);
  --accent-primary-deep:var(--navy-700);
  --accent-ink:var(--navy-200);
  --accent-secondary:var(--navy-300);
  --accent-tertiary:#e0e0db;

  --black:#000000; --gray-1000:#050505; --gray-950:#0d0d0c; --gray-900:#121111;
  --gray-850:#171616; --gray-800:#1f1e1e; --gray-700:#2a2829; --gray-600:#3a3837;
  --gray-500:#4c4948; --gray-400:#6b6763; --gray-300:#8f8b86; --gray-200:#b3b0aa;
  --gray-100:#e0e0db; --white:#ffffff;

  --surface-page:var(--black);
  --surface-sunken:var(--gray-1000);
  --surface-card:var(--gray-950);
  --surface-card-hover:var(--gray-900);
  --surface-raised:#1a1918;
  --surface-input:#141313;
  --surface-chip:#1a1918;
  --surface-navy-wash:#0a0f1a;

  --text-primary:var(--white);
  --text-secondary:var(--gray-100);
  --text-muted:var(--gray-300);
  --text-on-accent:var(--white);
  --text-accent:var(--accent-ink);

  --border-subtle:#1c1b1b;
  --border-default:var(--gray-700);
  --border-strong:var(--gray-600);
  --border-accent:var(--navy-500);
  --grid-line:#242323;

  --positive:var(--navy-200);
  --negative:var(--gray-200);
  --warning:var(--gray-100);

  --data-1:var(--navy-400); --data-2:var(--navy-200); --data-3:var(--gray-100);
  --data-4:var(--gray-400); --data-5:var(--gray-600); --data-track:var(--gray-800);

  --gradient-sheen:linear-gradient(115deg,rgba(255,255,255,0) 40%,rgba(255,255,255,.14) 52%,rgba(255,255,255,0) 62%);
  --glow-accent:radial-gradient(60% 60% at 0% 50%,rgba(53,73,110,.6) 0%,rgba(53,73,110,0) 70%);

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px;
  --space-6:24px; --space-8:32px; --space-10:40px;
  --card-pad:20px; --card-pad-sm:16px; --grid-gap:16px;
  --sidebar-w:248px; --topbar-h:64px; --bottomnav-h:72px; --tap-min:44px;

  --radius-xs:6px; --radius-sm:10px; --radius-md:14px; --radius-lg:18px;
  --radius-xl:24px; --radius-pill:999px; --radius-card:18px; --radius-control:12px;

  --shadow-card:0 1px 0 rgba(255,255,255,.03),0 12px 32px rgba(0,0,0,.6);
  --shadow-accent:0 8px 24px rgba(37,53,81,.5);
  --shadow-popover:0 16px 48px rgba(0,0,0,.8);

  --dur-fast:120ms; --dur-base:180ms; --dur-slow:320ms;
  --ease-standard:cubic-bezier(.2,.6,.2,1);

  --fs-heading:24px; --fs-subheading:16px; --fs-body:14px; --fs-additional:12px; --fs-micro:11px;
  --fw-light:300; --fw-regular:400; --fw-medium:500; --fw-bold:700;

  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display-serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;

  color-scheme: dark;
}

/* ===== Base ===== */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:var(--surface-page); color:var(--text-primary);
  font-family:var(--font-body); font-size:var(--fs-body); line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; }
h1,h2,h3{ font-weight:var(--fw-medium); letter-spacing:-0.01em; margin:0; }
.icon{ display:inline-block; vertical-align:-3px; flex:none; }

.boot{ padding:64px 24px; text-align:center; color:var(--text-muted); }
.banner-warn{
  margin:20px; padding:16px 20px; border-radius:var(--radius-lg);
  background:var(--surface-navy-wash); border:1px solid var(--border-accent);
  color:var(--text-secondary); font-size:13px; max-width:640px;
}

/* ===== Shell / layout ===== */
.shell{ display:flex; min-height:100vh; }
.sidebar{
  width:var(--sidebar-w); flex:0 0 auto; height:100vh; position:sticky; top:0;
  border-right:1px solid var(--border-subtle); padding:24px 16px;
  display:flex; flex-direction:column; gap:2px;
}
.brand{ display:flex; align-items:center; gap:10px; padding:0 8px 24px; }
.brand .mark{ width:22px; height:22px; color:var(--text-primary); }
.brand .word{ font-family:var(--font-display-serif); font-size:18px; font-weight:500; letter-spacing:0.01em; }
.nav-item{
  display:flex; align-items:center; gap:10px; height:44px; padding:0 12px;
  border-radius:var(--radius-control); color:var(--text-muted); font-size:14px; font-weight:500;
  transition:var(--transition-control,color var(--dur-base) var(--ease-standard));
}
.nav-item:hover{ color:var(--text-primary); background:var(--surface-card-hover); }
.nav-item.active{ color:var(--text-primary); background:var(--surface-raised); }
.nav-item .icon{ color:inherit; }
.sidebar-foot{ margin-top:auto; font-size:11px; color:var(--text-muted); padding:12px 8px 0; }

.shell-main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar{
  height:var(--topbar-h); flex:0 0 auto; position:sticky; top:0; z-index:5;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 24px; border-bottom:1px solid var(--border-subtle); background:var(--surface-page);
}
.topbar h1{ font-size:var(--fs-heading); }
.topbar .sub{ font-size:12px; color:var(--text-muted); margin-top:2px; }
.content{ padding:20px 24px 40px; max-width:1280px; width:100%; margin:0 auto; }

.bottomnav{ display:none; }
@media (max-width:900px){
  .sidebar{ display:none; }
  .bottomnav{
    display:flex; position:fixed; bottom:0; left:0; right:0; z-index:10;
    height:var(--bottomnav-h); background:var(--surface-raised); border-top:1px solid var(--border-subtle);
  }
  .bottomnav .nav-item{
    flex:1; flex-direction:column; height:100%; border-radius:0; justify-content:center; gap:4px; font-size:11px;
  }
  .content{ padding-bottom:calc(var(--bottomnav-h) + 24px); }
}

/* ===== KPI / cards ===== */
.kpi-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--grid-gap); margin-bottom:var(--space-5); }
@media (max-width:900px){ .kpi-row{ grid-template-columns:repeat(2,1fr); } }
.grid-2{ display:grid; grid-template-columns:1.35fr 1fr; gap:var(--grid-gap); align-items:start; }
.grid-2 > *{ min-width:0; }
@media (max-width:900px){ .grid-2{ grid-template-columns:1fr; } }
.kpi-row > *{ min-width:0; }
.donut-wrap{ min-width:0; }

.card{
  background:var(--surface-card); border:1px solid var(--border-subtle);
  border-radius:var(--radius-card); padding:var(--card-pad); box-shadow:var(--shadow-card);
}
.card + .card{ margin-top:var(--grid-gap); }
.card-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-3); gap:var(--space-3); }
.card-title{ font-size:16px; font-weight:500; }

.stat-label{ font-size:12px; color:var(--text-muted); margin-bottom:8px; }
.stat-value{ font-size:24px; font-weight:700; letter-spacing:-0.01em; }
.stat-foot{ margin-top:8px; }

.delta{ display:inline-flex; align-items:center; gap:2px; font-size:12px; font-weight:500; }
.delta.positive{ color:var(--positive); }
.delta.negative{ color:var(--negative); }
.delta .icon.down{ transform:rotate(90deg); }

/* ===== Buttons ===== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  height:40px; padding:0 18px; border-radius:var(--radius-pill); border:none;
  font-size:14px; font-weight:500; cursor:pointer; white-space:nowrap;
  transition:background-color var(--dur-base) var(--ease-standard);
}
.btn-primary{ background:var(--accent-primary); color:var(--text-on-accent); }
.btn-primary:hover{ background:var(--accent-primary-bright); }
.btn-primary:active{ background:var(--accent-primary-deep); }
.btn-ghost{ background:transparent; color:var(--text-secondary); }
.btn-ghost:hover{ background:var(--surface-card-hover); color:var(--text-primary); }
.btn-sm{ height:32px; padding:0 14px; font-size:12px; }
.btn-danger{ background:transparent; color:var(--negative); }
.btn-danger:hover{ background:var(--surface-card-hover); }
.btn[disabled]{ opacity:.45; cursor:default; pointer-events:none; }
.btn-icon{ width:36px; height:36px; padding:0; border-radius:var(--radius-pill); background:transparent; border:none; color:var(--text-muted); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.btn-icon:hover{ background:var(--surface-card-hover); color:var(--text-primary); }

/* ===== Table ===== */
.table-wrap{ overflow-x:auto; }
table.dt{ width:100%; border-collapse:collapse; font-size:14px; }
.dt th{ text-align:left; font-size:12px; color:var(--text-muted); font-weight:500; padding:0 12px 8px; white-space:nowrap; }
.dt td{ padding:14px 12px; border-top:1px solid var(--border-subtle); vertical-align:middle; }
.dt tbody tr{ transition:background-color var(--dur-fast) var(--ease-standard); }
.dt tbody tr:hover td{ background:var(--surface-card-hover); }
.dt .num{ text-align:right; font-variant-numeric:tabular-nums; }
.dt .row-link{ cursor:pointer; }
.row-actions{ display:flex; gap:4px; justify-content:flex-end; }

.badge{ display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:var(--radius-pill); font-size:11px; font-weight:500; background:var(--surface-chip); color:var(--text-muted); border:1px solid var(--border-subtle); }
.badge.active{ color:var(--accent-ink); border-color:var(--border-accent); }
.badge.pending{ color:var(--warning); }
.badge.paid{ color:var(--positive); }

.empty{ padding:48px 20px; text-align:center; color:var(--text-muted); font-size:13px; }

/* ===== Goals ===== */
.goal-item{ padding:14px 0; border-top:1px solid var(--border-subtle); }
.goal-item:first-child{ padding-top:0; border-top:none; }
.goal-name{ font-size:14px; font-weight:500; }
.goal-bar-track{ height:10px; border-radius:var(--radius-pill); background:var(--data-track); overflow:hidden; margin:10px 0 8px; }
.goal-bar-fill{ height:100%; border-radius:var(--radius-pill); background:var(--gradient-goal); transition:width var(--dur-slow) var(--ease-standard); }
.goal-meta{ font-size:12px; }
.goal-tag{ display:inline-flex; align-items:center; gap:4px; margin-top:4px; font-size:11px; color:var(--text-accent); }

/* ===== Forms / dialogs ===== */
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:520px){ .field-row{ grid-template-columns:1fr; } }
.field label{ font-size:12px; color:var(--text-muted); }
.field input, .field select, .field textarea{
  background:var(--surface-input); border:1px solid var(--border-default); border-radius:var(--radius-control);
  color:var(--text-primary); padding:10px 12px; font:inherit; font-size:14px; width:100%;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:2px solid rgba(157,180,212,.5); outline-offset:1px; border-color:var(--border-accent);
}
.field-hint{ font-size:11px; color:var(--text-muted); }
.field-error{ font-size:12px; color:var(--gray-200); margin:-4px 0 14px; }

.modal-scrim{
  position:fixed; inset:0; background:rgba(0,0,0,.72); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; z-index:50; padding:20px;
}
.dialog{
  background:var(--surface-raised); border-radius:var(--radius-xl); padding:24px;
  width:100%; max-width:520px; max-height:88vh; overflow:auto; box-shadow:var(--shadow-popover);
}
.dialog-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.dialog-head h2{ font-size:16px; }
.dialog-foot{ display:flex; justify-content:flex-end; gap:10px; margin-top:8px; }

/* ===== Donut ===== */
.donut-wrap{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; min-width:0; }
.donut-wrap svg{ max-width:100%; height:auto; flex:none; }
.legend{ display:flex; flex-direction:column; gap:8px; flex:1; min-width:160px; }
.legend-row{ display:flex; align-items:center; gap:8px; font-size:12px; }
.legend-dot{ width:8px; height:8px; border-radius:50%; flex:none; }
.legend-name{ color:var(--text-secondary); flex:1; }
.legend-val{ color:var(--text-muted); font-variant-numeric:tabular-nums; }

/* ===== Period switcher ===== */
.period-switch{ display:flex; align-items:center; gap:4px; }
.period-switch .label{ font-size:14px; font-weight:500; min-width:92px; text-align:center; }

/* ===== Client detail header ===== */
.client-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:var(--space-5); flex-wrap:wrap; }
.client-head h1{ font-size:24px; }
.client-meta{ display:flex; gap:14px; flex-wrap:wrap; margin-top:6px; font-size:12px; color:var(--text-muted); }

/* ===== Report print view ===== */
.report-page{ max-width:820px; margin:0 auto; padding:32px 24px 80px; }
.report-toolbar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:24px; }
.report-brand{ display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.report-brand .mark{ width:36px; height:36px; }
.report-brand .word{ font-family:var(--font-display-serif); font-size:32px; font-weight:500; }
.report-sub{ font-size:11px; color:var(--text-muted); margin-top:24px; }
.report-title{ font-size:24px; margin-bottom:4px; }
.report-period{ color:var(--text-muted); font-size:14px; margin-bottom:24px; }
.disclosure{ font-size:11px; color:var(--text-muted); margin-top:32px; }

@media print{
  body{ background:#fff; color:#000; }
  .no-print{ display:none !important; }
  .report-page{ max-width:none; padding:0; color:#000; }
  .card{ box-shadow:none; border:1px solid #ccc; background:#fff; }
  .report-brand .mark, .report-brand .word{ color:#000; }
}

/* ===== Responsive utilities ===== */
.flex{ display:flex; align-items:center; gap:8px; }
.flex-between{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.muted{ color:var(--text-muted); }
.mt-0{margin-top:0;}

/* ===== Login ===== */
.login-page{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:24px; position:relative; overflow:hidden;
}
.login-page::before{ content:""; position:absolute; inset:0; background:var(--glow-accent); pointer-events:none; }
.login-card{ position:relative; width:100%; max-width:380px; display:flex; flex-direction:column; gap:22px; }
.login-brand{ display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; }
.login-brand .mark{ width:44px; height:44px; color:var(--text-primary); }
.login-brand .word{ font-family:var(--font-display-serif); font-size:22px; font-weight:500; }
.login-brand .tagline{ font-size:11px; letter-spacing:0.18em; color:var(--text-muted); }
.login-foot{ text-align:center; font-size:11px; color:var(--text-muted); }
.login-link{ font-size:12px; color:var(--text-accent); background:none; border:none; cursor:pointer; padding:0; font-family:inherit; }
.login-link:hover{ color:var(--text-primary); }
.field-ok{ font-size:12px; color:var(--positive); margin:-4px 0 14px; }

/* ===== Topbar user menu ===== */
.user-chip{ display:flex; align-items:center; gap:8px; }
.user-chip .email{ font-size:12px; color:var(--text-muted); max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }