@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;500;600;700;800&family=DM+Sans:wght@300;400;500;600;700&display=swap');

:root {
  --bg:       #FFFFFF;
  --bg2:      #F4F4F5;
  --bg3:      #EBEBEB;
  --card:     #FFFFFF;

  --border:   rgba(1,179,150,0.10);
  --border2:  rgba(1,179,150,0.18);

  --accent:       #01B396;
  --accent2:      #019478;
  --accent-light: rgba(1,179,150,0.12);
  --brand:        #023455;

  --green:          #15803d;
  --green-bg:       rgba(21,128,61,0.10);
  --green-border:   rgba(21,128,61,0.28);
  --red:            #DC2626;
  --red-bg:         rgba(220,38,38,0.08);
  --red-border:     rgba(220,38,38,0.20);
  --yellow:         #D97706;
  --yellow-bg:      rgba(217,119,6,0.08);
  --yellow-border:  rgba(217,119,6,0.20);
  --purple:         #7c3aed;
  --blue:           #023455;

  --text:   #18181B;
  --text2:  #27272A;
  --muted:  #52525B;
  --muted2: #6B7280;

  --sidebar-bg:     #1e1e2e;
  --sidebar-border: #2a2a3e;
  --sidebar-hover:  #2a2a3e;
  --sidebar-w:      228px;
  --sidebar-w-collapsed: 64px;

  --topbar-bg:     #FFFFFF;
  --topbar-border: #E4E4E7;

  --font-display: 'Baloo 2', sans-serif;
  --font-body:    'DM Sans', sans-serif;
  /* Syne é decorativa/geométrica — seus algarismos (o "0" vira uma pílula)
     ficam ilegíveis em números grandes. Usar só pra texto, nunca pra dígitos
     (mesmo motivo documentado em js/analise.js:_anFontMoney). */
  --font-numeric: -apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',var(--font-body);

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 28px rgba(0,0,0,0.12);

  --role-chip-admin-fg:      #023455;
  --badge-blue-fg:           #023455;
  --badge-green-fg:          #166534;
  --badge-yellow-fg:         #92400e;
  --badge-red-fg:            #b91c1c;
  --badge-purple-fg:         #6d28d9;
  --badge-gray-fg:           #374151;
  --role-chip-atendente-fg:  #166534;
  --role-chip-investidor-fg: #92400e;

  /* ── Tokens da mescla fleetpro (Task 6b) ── */
  --on-accent:      #FFFFFF;   /* texto/ícone sobre a cor da marca */
  /* Chat (sempre escuro, paleta WhatsApp — mesma em dia e noite) */
  --chat-text:      #E9EDEF;
  --chat-link:      #53BDEB;
  --chat-quote-out: #A5F3C8;
  --chat-panel:     #202C33;
  --chat-out:       #005C4B;
  --chat-menu:      #233138;
  --chat-shade:     #000000;
  /* Prévia de mensagem do WhatsApp (reservas, régua de cobrança) */
  --wa-green:       #25D366;
  --wa-bubble:      #E7FFDB;
  --wa-bubble-text: #111B21;
}

:root[data-theme="dark"] {
  --bg:       #0F1115;
  --bg2:      #171A21;
  --bg3:      #1F232C;
  --card:     #171A21;

  --border:   rgba(255,255,255,0.08);
  --border2:  rgba(255,255,255,0.14);

  --green:          #22C55E;
  --green-bg:       rgba(34,197,94,0.12);
  --green-border:   rgba(34,197,94,0.28);
  --red:            #F87171;
  --red-bg:         rgba(248,113,113,0.10);
  --red-border:     rgba(248,113,113,0.22);
  --yellow:         #FBBF24;
  --yellow-bg:      rgba(251,191,36,0.10);
  --yellow-border:  rgba(251,191,36,0.22);
  --purple:         #A78BFA;
  --blue:           #5B9BD5;

  --text:   #E4E6EB;
  --text2:  #C7CAD1;
  --muted:  #9AA0AC;
  --muted2: #7A8290;

  --topbar-bg:     #171A21;
  --topbar-border: #262B35;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.30);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.35);
  --shadow-lg: 0 8px 28px rgba(0,0,0,0.45);

  --role-chip-admin-fg:      #6EE7D8;
  --badge-blue-fg:           #6EE7D8;
  --badge-green-fg:          #4ADE80;
  --badge-yellow-fg:         #FBBF24;
  --badge-red-fg:            #FCA5A5;
  --badge-purple-fg:         #C4B5FD;
  --badge-gray-fg:           #D1D5DB;
  --role-chip-atendente-fg:  #4ADE80;
  --role-chip-investidor-fg: #FBBF24;

  /* ── Tokens da mescla fleetpro (Task 6b) ── */
  --wa-bubble:      #005C4B;
  --wa-bubble-text: #E9EDEF;
}

* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:var(--font-body); background:var(--bg); color:var(--text); height:100vh; overflow:hidden; display:flex; -webkit-font-smoothing:antialiased; }

.layer { position:fixed; inset:0; display:none; z-index:10; }
.layer.active { display:flex; }

#layer-setup { background:var(--bg); align-items:center; justify-content:center; }
.setup-box { background:var(--card); border:1px solid var(--border2); border-radius:16px; padding:40px; width:520px; max-height:90vh; overflow-y:auto; box-shadow:var(--shadow-lg); }
.setup-logo { font-family:var(--font-display); font-size:22px; font-weight:800; color:var(--accent); margin-bottom:4px; display:flex; align-items:center; gap:10px; }
.setup-sub { font-size:13px; color:var(--muted); margin-bottom:28px; }
.setup-step { display:flex; align-items:flex-start; gap:12px; margin-bottom:12px; padding:14px; background:var(--bg3); border-radius:10px; border:1px solid var(--border); }
.step-num { width:24px; height:24px; border-radius:50%; background:var(--accent); color:#fff; font-size:11px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.step-text { font-size:12px; line-height:1.6; color:var(--muted); }
.step-text strong { color:var(--text); }
.step-text code { background:var(--bg); border:1px solid var(--border2); border-radius:4px; padding:1px 6px; font-size:11px; color:var(--accent); font-family:monospace; }
.setup-input { background:var(--bg3); border:1.5px solid var(--border2); color:var(--text); padding:10px 14px; border-radius:8px; font-size:13px; font-family:var(--font-body); outline:none; width:100%; margin-bottom:8px; transition:border-color .15s; }
.setup-input:focus { border-color:var(--accent); }
.setup-input::placeholder { color:var(--muted2); }
.setup-btn { background:var(--accent); color:#fff; border:none; border-radius:8px; padding:11px; font-size:14px; font-weight:700; cursor:pointer; width:100%; margin-top:4px; font-family:var(--font-display); transition:background .15s; }
.setup-btn:hover { background:var(--accent2); }
.sql-toggle { font-size:12px; color:var(--accent); cursor:pointer; margin-top:14px; text-align:center; display:block; }
.copy-sql-btn { background:var(--bg); border:1px solid var(--border2); color:var(--muted); font-size:11px; padding:4px 10px; border-radius:6px; cursor:pointer; float:right; margin-bottom:6px; font-family:var(--font-body); }

#layer-login { background:var(--bg); align-items:center; justify-content:center; }
.login-wrap {
  width:100%; min-height:100vh; display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
  background:linear-gradient(135deg, var(--brand) 0%, #035C7A 45%, var(--accent) 100%);
  padding:24px;
}
.login-blob { position:absolute; border-radius:50%; filter:blur(70px); opacity:0.35; pointer-events:none; }
.login-blob-1 { width:420px; height:420px; background:#01B396; top:-140px; left:-120px; }
.login-blob-2 { width:380px; height:380px; background:#023455; bottom:-160px; right:-100px; }
.login-blob-3 { width:260px; height:260px; background:#0B6E8A; top:40%; right:10%; }

.login-card {
  --bg3:rgba(255,255,255,0.16); --text:#FFFFFF; --muted:rgba(255,255,255,0.75); --muted2:rgba(255,255,255,0.55); --border2:rgba(255,255,255,0.32);
  position:relative; z-index:1; width:100%; max-width:420px;
  background:rgba(255,255,255,0.14);
  backdrop-filter:blur(30px) saturate(180%); -webkit-backdrop-filter:blur(30px) saturate(180%);
  border:1px solid rgba(255,255,255,0.35);
  border-radius:14px; padding:44px 40px;
  box-shadow:0 8px 40px rgba(2,20,40,0.4), inset 0 1px 0 rgba(255,255,255,0.4);
  display:flex; flex-direction:column; align-items:center;
}
.login-logo-img { width:180px; height:auto; margin-bottom:22px; filter:drop-shadow(0 2px 8px rgba(0,0,0,0.25)); }
.login-title { font-family:var(--font-display); font-size:22px; font-weight:700; margin-bottom:6px; color:#fff; text-align:center; }
.login-sub { font-size:13px; color:var(--muted); margin-bottom:28px; text-align:center; }

.login-form { display:flex; flex-direction:column; gap:10px; width:100%; }
.login-input { background:var(--bg3); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); border:1.5px solid var(--border2); color:var(--text); padding:11px 14px; border-radius:10px; font-size:13px; font-family:var(--font-body); outline:none; transition:border-color .15s,background .15s; }
.login-input:focus { border-color:rgba(255,255,255,0.7); background:rgba(255,255,255,0.24); }
.login-input::placeholder { color:var(--muted2); }
.login-select { background:var(--bg3); border:1.5px solid var(--border2); color:var(--text); padding:11px 14px; border-radius:10px; font-size:13px; font-family:var(--font-body); outline:none; cursor:pointer; }
.login-select:focus { border-color:rgba(255,255,255,0.7); }

.login-btn { background:var(--accent); color:#fff; border:none; border-radius:8px; padding:12px; font-size:14px; font-weight:700; cursor:pointer; font-family:var(--font-display); transition:background .15s; margin-top:4px; }
.login-btn:hover { background:var(--accent2); }
.login-err { color:var(--red); font-size:12px; margin-top:4px; display:none; }
.login-ok  { color:var(--green); font-size:12px; margin-top:4px; display:none; }

#layer-app { display:none; width:100%; height:100vh; flex-direction:row; }
#layer-app.active { display:flex; }

.sidebar { width:var(--sidebar-w); background:var(--sidebar-bg); border-right:1px solid var(--sidebar-border); display:flex; flex-direction:column; flex-shrink:0; height:100vh; transition:width .2s ease; }
.logo { padding:20px 16px 16px; border-bottom:1px solid var(--sidebar-border); }
.logo-mark { font-family:var(--font-display); font-size:16px; font-weight:800; color:#E0E7FF; display:flex; align-items:center; gap:8px; }
.logo-sub { font-size:9px; color:#6B6B8F; letter-spacing:1.5px; text-transform:uppercase; margin-top:3px; padding-left:36px; }
nav { flex:1; padding:10px 10px 10px 8px; overflow-y:auto; overscroll-behavior-y:contain; }
.nav-section { font-size:9px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; color:#6B6B8F; padding:14px 10px 5px; }
.nav-item { display:flex; align-items:center; gap:10px; padding:9px 10px 9px 8px; border-radius:0 8px 8px 0; cursor:pointer; font-size:13px; color:#A8A8C8; transition:all .15s; margin-bottom:1px; border-left:2.5px solid transparent; font-weight:500; }
.nav-item:hover { background:var(--sidebar-hover); color:#E0E7FF; }
.nav-item.active { background:rgba(1,179,150,0.15); color:#E0E7FF; border-color:transparent; border-left-color:var(--accent); font-weight:600; }
.nav-item .icon { width:16px; height:16px; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:currentColor; }
.sidebar-footer { padding:14px; border-top:1px solid var(--sidebar-border); }
.user-pill { display:flex; align-items:center; gap:10px; cursor:pointer; padding:6px; margin:-6px; border-radius:8px; transition:background .15s; }
.user-pill:hover { background:var(--sidebar-hover); }
.avatar { width:34px; height:34px; border-radius:50%; background:var(--accent); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:#fff; flex-shrink:0; }
.user-info .uname { font-size:12px; font-weight:600; color:#E0E7FF; }
.user-info .urole { font-size:10px; color:var(--muted); display:flex; align-items:center; gap:4px; margin-top:2px; }
.user-info .urole::before { content:''; width:5px; height:5px; border-radius:50%; background:#22c55e; display:inline-block; }
.db-badge { display:flex; align-items:center; gap:5px; font-size:10px; margin-top:8px; color:#22c55e; }
.db-dot { width:6px; height:6px; border-radius:50%; background:#22c55e; animation:pulse 2s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

/* ── Sidebar colapsável (desktop) ── */
.sidebar-collapse-btn { display:flex; align-items:center; justify-content:center; gap:8px; margin:4px 10px 10px; padding:8px; border-radius:8px; border:1px solid var(--sidebar-border); background:transparent; color:#A8A8C8; font-size:11px; font-weight:600; font-family:var(--font-body); cursor:pointer; transition:all .15s; }
.sidebar-collapse-btn:hover { background:var(--sidebar-hover); color:#E0E7FF; }
.collapse-arrow { flex-shrink:0; transition:transform .2s ease; }

.sidebar.collapsed { width:var(--sidebar-w-collapsed); }
.sidebar.collapsed .logo { padding:20px 0 16px; display:flex; justify-content:center; }
.sidebar.collapsed .logo-mark { gap:0; }
.sidebar.collapsed .logo-text,
.sidebar.collapsed .logo-sub,
.sidebar.collapsed .nav-section,
.sidebar.collapsed .nav-label,
.sidebar.collapsed .user-info,
.sidebar.collapsed .db-badge,
.sidebar.collapsed .collapse-label,
.sidebar.collapsed .btn-label { display:none; }
.sidebar.collapsed nav { padding:10px 8px; }
.sidebar.collapsed .nav-item { justify-content:center; padding:9px 0; border-left:none; }
.sidebar.collapsed .nav-item.active { border-radius:8px; }
.sidebar.collapsed .sidebar-collapse-btn { padding:8px 0; }
.sidebar.collapsed .collapse-arrow { transform:rotate(180deg); }
.sidebar.collapsed .user-pill { justify-content:center; margin:0; padding:6px 0; }

.main { flex:1; display:flex; flex-direction:column; height:100vh; overflow:hidden; background:var(--bg); }

.topbar { display:flex; align-items:center; justify-content:space-between; padding:0 28px; height:60px; border-bottom:1px solid var(--topbar-border); background:var(--topbar-bg); flex-shrink:0; }
.page-title { font-family:'Sora',sans-serif; font-size:24px; font-weight:800; color:var(--text); letter-spacing:-.3px; }
.topbar-right { display:flex; align-items:center; gap:8px; }
.topbar-search { display:flex; align-items:center; gap:6px; background:var(--bg2); border:1.5px solid var(--border2); border-radius:8px; padding:6px 10px; font-size:13px; color:var(--muted); cursor:pointer; transition:all .15s, width .15s; width:150px; }
.topbar-search:hover { border-color:var(--accent); }
.topbar-search:focus-within { border-color:var(--accent); width:220px; }
.topbar-search input { background:transparent; border:none; outline:none; font-size:13px; color:var(--text); font-family:var(--font-body); width:100%; min-width:0; }
.topbar-search input::placeholder { color:var(--muted2); }
.topbar-btn { width:36px; height:36px; border-radius:8px; border:1.5px solid var(--border2); background:var(--bg2); color:var(--muted); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:14px; transition:all .15s; }
.topbar-btn:hover { background:var(--bg3); color:var(--text2); }

/* ══ THEME SWITCH (dia/noite) ══ */
.theme-switch {
  --toggle-size: 13px;
  --container-width: 5.625em;
  --container-height: 2.5em;
  --container-radius: 6.25em;
  --container-light-bg: #3D7EAE;
  --container-night-bg: #1D1F2C;
  --circle-container-diameter: 3.375em;
  --sun-moon-diameter: 2.125em;
  --sun-bg: #ECCA2F;
  --moon-bg: #C4C9D1;
  --spot-color: #959DB1;
  --circle-container-offset: calc((var(--circle-container-diameter) - var(--container-height)) / 2 * -1);
  --stars-color: #fff;
  --clouds-color: #F3FDFF;
  --back-clouds-color: #AACADF;
  --transition: .5s cubic-bezier(0, -0.02, 0.4, 1.25);
  --circle-transition: .3s cubic-bezier(0, -0.02, 0.35, 1.17);
  display: inline-flex;
  flex-shrink: 0;
}
.theme-switch, .theme-switch *, .theme-switch *::before, .theme-switch *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-size: var(--toggle-size);
}
.theme-switch__container {
  width: var(--container-width);
  height: var(--container-height);
  background-color: var(--container-light-bg);
  border-radius: var(--container-radius);
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0em -0.062em 0.062em rgba(0, 0, 0, 0.25), 0em 0.062em 0.125em rgba(255, 255, 255, 0.94);
  transition: var(--transition);
  position: relative;
}
.theme-switch__container::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  box-shadow: 0em 0.05em 0.187em rgba(0, 0, 0, 0.25) inset, 0em 0.05em 0.187em rgba(0, 0, 0, 0.25) inset;
  border-radius: var(--container-radius)
}
.theme-switch__checkbox {
  display: none;
}
.theme-switch__circle-container {
  width: var(--circle-container-diameter);
  height: var(--circle-container-diameter);
  background-color: rgba(255, 255, 255, 0.1);
  position: absolute;
  left: var(--circle-container-offset);
  top: var(--circle-container-offset);
  border-radius: var(--container-radius);
  box-shadow: inset 0 0 0 3.375em rgba(255, 255, 255, 0.1), inset 0 0 0 3.375em rgba(255, 255, 255, 0.1), 0 0 0 0.625em rgba(255, 255, 255, 0.1), 0 0 0 1.25em rgba(255, 255, 255, 0.1);
  display: flex;
  transition: var(--circle-transition);
  pointer-events: none;
}
.theme-switch__sun-moon-container {
  pointer-events: auto;
  position: relative;
  z-index: 2;
  width: var(--sun-moon-diameter);
  height: var(--sun-moon-diameter);
  margin: auto;
  border-radius: var(--container-radius);
  background-color: var(--sun-bg);
  box-shadow: 0.062em 0.062em 0.062em 0em rgba(254, 255, 239, 0.61) inset, 0em -0.062em 0.062em 0em #a1872a inset;
  filter: drop-shadow(0.062em 0.125em 0.125em rgba(0, 0, 0, 0.25)) drop-shadow(0em 0.062em 0.125em rgba(0, 0, 0, 0.25));
  overflow: hidden;
  transition: var(--transition);
}
.theme-switch__moon {
  transform: translateX(100%);
  width: 100%;
  height: 100%;
  background-color: var(--moon-bg);
  border-radius: inherit;
  box-shadow: 0.062em 0.062em 0.062em 0em rgba(254, 255, 239, 0.61) inset, 0em -0.062em 0.062em 0em #969696 inset;
  transition: var(--transition);
  position: relative;
}
.theme-switch__spot {
  position: absolute;
  top: 0.75em;
  left: 0.312em;
  width: 0.75em;
  height: 0.75em;
  border-radius: var(--container-radius);
  background-color: var(--spot-color);
  box-shadow: 0em 0.0312em 0.062em rgba(0, 0, 0, 0.25) inset;
}
.theme-switch__spot:nth-of-type(2) {
  width: 0.375em;
  height: 0.375em;
  top: 0.937em;
  left: 1.375em;
}
.theme-switch__spot:nth-last-of-type(3) {
  width: 0.25em;
  height: 0.25em;
  top: 0.312em;
  left: 0.812em;
}
.theme-switch__clouds {
  width: 1.25em;
  height: 1.25em;
  background-color: var(--clouds-color);
  border-radius: var(--container-radius);
  position: absolute;
  bottom: -0.625em;
  left: 0.312em;
  box-shadow: 0.937em 0.312em var(--clouds-color), -0.312em -0.312em var(--back-clouds-color), 1.437em 0.375em var(--clouds-color), 0.5em -0.125em var(--back-clouds-color), 2.187em 0 var(--clouds-color), 1.25em -0.062em var(--back-clouds-color), 2.937em 0.312em var(--clouds-color), 2em -0.312em var(--back-clouds-color), 3.625em -0.062em var(--clouds-color), 2.625em 0em var(--back-clouds-color), 4.5em -0.312em var(--clouds-color), 3.375em -0.437em var(--back-clouds-color), 4.625em -1.75em 0 0.437em var(--clouds-color), 4em -0.625em var(--back-clouds-color), 4.125em -2.125em 0 0.437em var(--back-clouds-color);
  transition: 0.5s cubic-bezier(0, -0.02, 0.4, 1.25);
}
.theme-switch__stars-container {
  position: absolute;
  color: var(--stars-color);
  top: -100%;
  left: 0.312em;
  width: 2.75em;
  height: auto;
  transition: var(--transition);
}
.theme-switch__checkbox:checked + .theme-switch__container {
  background-color: var(--container-night-bg);
}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container {
  left: calc(100% - var(--circle-container-offset) - var(--circle-container-diameter));
}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container:hover {
  left: calc(100% - var(--circle-container-offset) - var(--circle-container-diameter) - 0.187em)
}
.theme-switch__circle-container:hover {
  left: calc(var(--circle-container-offset) + 0.187em);
}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__moon {
  transform: translate(0);
}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__clouds {
  bottom: -4.062em;
}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__stars-container {
  top: 50%;
  transform: translateY(-50%);
}
.notif-btn { position:relative; }
.notif-dot { position:absolute; top:7px; right:7px; width:7px; height:7px; border-radius:50%; background:var(--red); border:1.5px solid var(--topbar-bg); }
.role-chip { display:inline-flex; align-items:center; gap:6px; padding:5px 13px 5px 9px; border-radius:99px; font-size:11px; font-weight:700; letter-spacing:.2px; white-space:nowrap; transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s ease, filter .18s ease; }
.role-chip svg { width:13px; height:13px; flex-shrink:0; }
a.role-chip, .role-chip[onclick] { cursor:pointer; }
.role-chip[onclick]:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.12); filter:brightness(1.06); }
.role-chip[onclick]:active { transform:translateY(0); filter:brightness(.98); transition-duration:.08s; }
.role-chip.admin     { background:linear-gradient(135deg, rgba(1,179,150,.20), rgba(1,179,150,.08)); color:var(--role-chip-admin-fg); border:1px solid rgba(1,179,150,0.32); }
.role-chip.atendente { background:linear-gradient(135deg, rgba(21,128,61,.18), rgba(21,128,61,.06));  color:var(--role-chip-atendente-fg);  border:1px solid rgba(21,128,61,0.3); }
.role-chip.investidor{ background:linear-gradient(135deg, rgba(217,119,6,.18), rgba(217,119,6,.06));  color:var(--role-chip-investidor-fg);  border:1px solid rgba(217,119,6,0.27); }

.content { flex:1; overflow:hidden; padding:20px 24px; min-height:0; display:flex; flex-direction:column; background:var(--bg); }
/* Fundo escuro também no html: elimina a faixa branca do overscroll/viewport no iOS */
html { background: var(--bg); }
.page { display:none; flex:1; overflow-y:auto; }
.page.active { display:flex; flex-direction:column; }

#page-investidores { overflow-y:auto !important; -webkit-overflow-scrolling:touch; }
@media (max-width:768px) {
  #page-investidores { padding-bottom:80px !important; }
  body.inv-active .content { overflow-y:auto !important; overflow-x:hidden !important; }
}

.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:16px; }

/* ── KANBAN DO PIPELINE ── */
/* Barra de rolagem SEMPRE visível (a nativa do sistema some fora do hover) */
#pl-kanban { cursor: grab; }
#pl-kanban::-webkit-scrollbar { height: 11px; }
#pl-kanban::-webkit-scrollbar-track { background: var(--bg2); border-radius: 20px; }
#pl-kanban::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 20px; border: 2px solid var(--bg2); }
#pl-kanban::-webkit-scrollbar-thumb:hover { background: var(--muted); }
@supports (scrollbar-width: auto) {
  #pl-kanban { scrollbar-width: auto; scrollbar-color: var(--border2) var(--bg2); }
}
.stats-grid.cols3 { grid-template-columns:repeat(3,1fr); }

.stat-card { background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:18px; position:relative; overflow:hidden; transition:box-shadow .22s cubic-bezier(.2,.8,.2,1), transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s; cursor:default; box-shadow:var(--shadow-sm); }
.stat-card[onclick] { cursor:pointer; }
.stat-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-3px); border-color:var(--accent); }
.stat-card:hover .stat-icon-badge { transform:scale(1.08); }
.stat-card:active { transform:translateY(-1px); transition-duration:.08s; }
.stat-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--accent); border-radius:12px 12px 0 0; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.stat-card:hover::before { transform:scaleX(1); }
.stat-label { font-size:10px; color:var(--muted); letter-spacing:.8px; text-transform:uppercase; font-weight:600; margin-bottom:10px; padding-right:38px; line-height:1.35; }
.stat-val { font-family:var(--font-numeric); font-variant-numeric:tabular-nums; font-size:30px; font-weight:800; color:var(--text); margin-bottom:4px; line-height:1; }
.stat-sub  { font-size:11px; color:var(--muted); display:flex; align-items:center; gap:5px; flex-wrap:wrap; padding-right:38px; }
.stat-icon { position:absolute; right:14px; top:14px; color:var(--accent); opacity:.30; }
.stat-icon-badge { position:absolute; right:12px; top:12px; width:30px; height:30px; border-radius:9px; background:var(--accent-light); color:var(--accent); display:flex; align-items:center; justify-content:center; transition:transform .22s cubic-bezier(.2,.8,.2,1); flex-shrink:0; }

.stat-alert { background:rgba(220,38,38,0.08); border-color:rgba(220,38,38,0.2); }
.stat-alert::before { background:var(--red); }
.stat-alert .stat-val   { color:var(--red); }
.stat-alert .stat-label { color:rgba(220,38,38,0.7); }
.stat-alert .stat-icon-badge { background:rgba(220,38,38,0.12); color:var(--red); }

/* Mini barra de progresso (proporção disponível/total, ocupação etc.) */
.stat-bar { width:100%; height:4px; border-radius:99px; background:var(--bg3); overflow:hidden; margin-top:6px; }
.stat-bar-fill { height:100%; border-radius:99px; background:var(--accent); transition:width .5s cubic-bezier(.2,.8,.2,1); }

/* Pill de tendência (vs. período anterior) */
.stat-trend { display:inline-flex; align-items:center; gap:2px; font-size:10px; font-weight:700; padding:1px 6px; border-radius:99px; }
.stat-trend.up   { background:var(--green-bg); color:var(--green); }
.stat-trend.down { background:var(--red-bg);   color:var(--red); }
.stat-trend.flat { background:var(--bg3);      color:var(--muted); }
.stat-trend svg { width:9px; height:9px; }

/* Mini sparkline inline (série de valores) */
.spark { display:block; overflow:visible; }
.spark path.spark-fill { opacity:.12; }

.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.card { background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:18px; transition:box-shadow .22s cubic-bezier(.2,.8,.2,1), transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s; box-shadow:var(--shadow-sm); }
.card:hover { box-shadow:var(--shadow-md); }
.card.card-click { cursor:pointer; }
.card.card-click:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); border-color:var(--accent); }
.card.card-click:active { transform:translateY(0); transition-duration:.08s; }
.card-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.card-title  { font-family:var(--font-display); font-size:13px; font-weight:700; color:var(--text); }

table { width:100%; border-collapse:collapse; font-size:13px; }
th { text-align:left; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--muted2); padding:0 12px 10px; border-bottom:1px solid var(--border2); }
td { padding:11px 12px; border-bottom:1px solid var(--border); vertical-align:middle; color:var(--text2); font-size:13px; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:rgba(1,179,150,0.05); }
.empty-row td { text-align:center; color:var(--muted2); padding:28px; font-size:13px; }
/* Nome longo (ex: marca+modelo) em célula de tabela: trunca com reticências
   em vez de quebrar em 2-3 linhas desalinhadas. Passe o texto completo em
   title="..." pro usuário ver via tooltip. */
.truncate { max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.badge { display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:99px; font-size:11px; font-weight:600; transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s ease, filter .18s ease; }
.badge:hover { transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,.10); filter:brightness(1.05); }
.badge-green  { background:linear-gradient(135deg, rgba(21,128,61,.20), var(--green-bg));       color:var(--badge-green-fg);  border:1px solid var(--green-border); }
.badge-yellow { background:linear-gradient(135deg, rgba(217,119,6,.20), var(--yellow-bg));      color:var(--badge-yellow-fg);  border:1px solid var(--yellow-border); }
.badge-red    { background:linear-gradient(135deg, rgba(220,38,38,.18), var(--red-bg));         color:var(--badge-red-fg);  border:1px solid var(--red-border); }
.badge-blue   { background:linear-gradient(135deg, rgba(1,179,150,.22), var(--accent-light));   color:var(--badge-blue-fg);  border:1px solid rgba(1,179,150,0.3); }
.badge-purple { background:linear-gradient(135deg, rgba(124,58,237,.22), rgba(124,58,237,.08)); color:var(--badge-purple-fg); border:1px solid rgba(124,58,237,0.25); }
.badge-gray   { background:linear-gradient(135deg, rgba(107,114,128,.20), rgba(107,114,128,.06)); color:var(--badge-gray-fg); border:1px solid rgba(107,114,128,0.2); }

.input-group { display:flex; gap:10px; margin-bottom:16px; align-items:center; }
input, select, textarea { background:var(--bg3); border:1.5px solid var(--border2); color:var(--text); padding:9px 14px; border-radius:8px; font-size:13px; font-family:var(--font-body); outline:none; transition:border-color .15s, box-shadow .15s; }
input:focus, select:focus, textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(1,179,150,0.15); }
.input-flex { flex:1; }
/* Campo de busca de Clientes: compacto em repouso, expande ao focar (mesmo padrão da navbar) */
#s-clientes { flex:0 1 200px; transition:flex-basis .15s, border-color .15s, box-shadow .15s; }
#s-clientes:focus { flex-basis:380px; }
select { cursor:pointer; }
label { font-size:12px; color:var(--muted); margin-bottom:4px; display:block; font-weight:500; }
.form-grid  { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-group { display:flex; flex-direction:column; gap:4px; }
.form-group.full { grid-column:1/-1; }

.btn { display:inline-flex; align-items:center; gap:6px; padding:8px 16px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; border:none; transition:all .15s; font-family:var(--font-body); }
.btn-primary { background:var(--accent); color:#fff; }
.btn-primary:hover { background:var(--accent2); transform:translateY(-1px); }
.btn-ghost { background:transparent; color:var(--muted); border:1.5px solid var(--border2); }
.btn-ghost:hover { color:var(--text); background:rgba(1,179,150,0.08); border-color:var(--border2); }

.vi { width:36px; height:36px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:18px; }
.vi-car  { background:rgba(1,179,150,0.15); }
.vi-moto { background:rgba(22,163,74,0.12); }
.vi.vi-foto { width:72px; height:46px; background:transparent; border-radius:0; padding:0; flex-shrink:0; }
.vi.vi-foto img { width:100%; height:100%; object-fit:contain; }

.timeline { position:relative; padding-left:24px; }
.timeline::before { content:''; position:absolute; left:7px; top:0; bottom:0; width:2px; background:var(--border2); }
.tl-item  { position:relative; margin-bottom:18px; }
.tl-dot   { position:absolute; left:-24px; width:14px; height:14px; border-radius:50%; border:2px solid var(--bg); }
.tl-dot.rental { background:var(--accent); }
.tl-dot.maint  { background:var(--yellow); }
.tl-dot.devol  { background:var(--green); }
.tl-title { font-size:13px; font-weight:500; color:var(--text); }
.tl-sub   { font-size:11px; color:var(--muted); margin-top:2px; }
.tl-date  { font-size:10px; color:var(--muted2); margin-top:3px; }

.cal-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.cal-month  { font-family:var(--font-display); font-size:16px; font-weight:700; color:var(--text); }
.cal-nav { background:rgba(1,179,150,0.1); border:1px solid var(--border2); color:var(--text); padding:6px 12px; border-radius:6px; cursor:pointer; font-size:14px; }
.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.cal-dow  { text-align:center; font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--muted2); padding:6px 0; }
.cal-day  { aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:8px; cursor:pointer; font-size:13px; transition:background .1s; gap:3px; color:var(--text2); }
.cal-day:hover { background:rgba(1,179,150,0.12); }
.cal-day.today { background:rgba(1,179,150,0.2); color:var(--accent); font-weight:700; }
.cal-day.selected:not(.today) { background:rgba(1,179,150,0.15); color:var(--accent); font-weight:700; border:1.5px solid var(--accent); }
.cal-day.other { color:var(--muted2); }
.dots { display:flex; gap:2px; }
.dot  { width:4px; height:4px; border-radius:50%; }

/* ══ CHAT WHATSAPP — REDESIGN ══ */
.chat-layout { display:grid; grid-template-columns:300px 1fr 280px; gap:0; height:calc(100vh - 68px); min-height:0; border-radius:14px; overflow:hidden; border:1px solid var(--border); }

/* ── Lista de contatos ── */
.chat-list { background:#111b21; border-right:1px solid rgba(255,255,255,0.06); display:flex; flex-direction:column; overflow:hidden; }
.chat-list-hdr { padding:14px 16px 10px; border-bottom:1px solid rgba(255,255,255,0.06); font-size:19px; font-weight:700; color:#e9edef; background:#202c33; flex-shrink:0; display:flex; align-items:center; justify-content:space-between; }
.chat-list-hdr-title { display:flex; align-items:center; gap:8px; }
.chat-search-wrap { padding:8px 12px; background:#111b21; flex-shrink:0; }
.chat-search-wrap input { width:70%; background:#202c33; border:none; border-radius:8px; padding:8px 14px 8px 36px; font-size:13px; color:#e9edef; outline:none; transition:width .15s; }
.chat-search-wrap input:focus { width:100%; }
.chat-search-wrap input::placeholder { color:#8696a0; }
#chat-contacts { flex:1; overflow-y:auto; overscroll-behavior-y:contain; }
.chat-item { display:flex; align-items:center; gap:12px; padding:12px 16px; cursor:pointer; border-bottom:1px solid rgba(255,255,255,0.04); transition:background .1s; position:relative; }
.chat-item:hover { background:#202c33; }
.chat-item.active { background:#2a3942; }
.chat-item.active div { color:#e9edef !important; }
.chat-item-meta { display:flex; flex-direction:column; align-items:flex-end; gap:4px; flex-shrink:0; }
.chat-item-time { font-size:11px; color:#8696a0; }
.chat-item-time.unread { color:#00a884; }
.chat-unread-badge { min-width:20px; height:20px; background:#00a884; color:#111b21; border-radius:99px; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; padding:0 5px; }

/* ── Avatar ── */
.cavatar { width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:700; flex-shrink:0; overflow:hidden; }

/* ── Janela de chat ── */
.chat-window { background:#0b141a; display:flex; flex-direction:column; min-height:0; overflow:hidden; position:relative; }
/* Fundo com textura sutil igual WPP */
.chat-window::before { content:''; position:absolute; inset:0; background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,0.015) 1px, transparent 0); background-size:24px 24px; pointer-events:none; z-index:0; }

/* ── Header da conversa ── */
.chat-top { display:flex; align-items:center; gap:12px; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,0.06); background:#202c33; position:relative; z-index:1; }
.chat-top-info { flex:1; min-width:0; }
.chat-top-name { font-size:15px; font-weight:600; color:#e9edef; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-top-sub { font-size:12px; color:#8696a0; margin-top:1px; }
.chat-top-actions { display:flex; gap:6px; align-items:center; }

/* ── Área de mensagens ── */
.chat-msgs { flex:1; overflow-y:auto; overscroll-behavior-y:contain; min-height:0; padding:16px 8%; display:flex; flex-direction:column; gap:2px; background:transparent; position:relative; z-index:1; }

/* ── Balões de mensagem ── */
.msg { max-width:65%; padding:7px 12px 22px; border-radius:8px; font-size:13.5px; line-height:1.55; position:relative; word-break:break-word; }
.msg-in  { background:#202c33; color:#e9edef; align-self:flex-start; border-top-left-radius:2px; margin-bottom:2px; }
.msg-out { background:#005c4b; color:#e9edef; align-self:flex-end; border-top-right-radius:2px; margin-bottom:2px; }
/* Cauda do balão */
.msg-in::before  { content:''; position:absolute; top:0; left:-8px; width:0; height:0; border-top:8px solid #202c33; border-left:8px solid transparent; }
.msg-out::after  { content:''; position:absolute; top:0; right:-8px; width:0; height:0; border-top:8px solid #005c4b; border-right:8px solid transparent; }
/* Timestamp dentro do balão */
.msg-time { font-size:11px; color:rgba(233,237,239,0.6); position:absolute; bottom:5px; right:10px; display:flex; align-items:center; gap:3px; white-space:nowrap; }
.msg-check { font-size:12px; }

/* ── Input de mensagem ── */
.chat-input-area { padding:8px 12px; display:flex; gap:8px; align-items:flex-end; background:#202c33; border-top:none; position:relative; z-index:1; }
/* iOS escolhe o tema do TECLADO pelo color-scheme do campo focado:
   como o chat é escuro, declaramos dark para o teclado vir escuro também */
.chat-input, #chat-search, #crm-retirada, #crm-followup { color-scheme: dark; }
.chat-input-wrap { flex:1; background:#2a3942; border-radius:10px; display:flex; align-items:center; padding:4px 6px; gap:6px; }
.chat-input { flex:1; background:transparent; border:none; padding:7px 8px; font-size:14px; color:#e9edef; font-family:var(--font-body); outline:none; resize:none; max-height:120px; line-height:1.5; }
.chat-input::placeholder { color:#8696a0; }
.chat-btn-send { width:42px; height:42px; border-radius:50%; background:#00a884; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .15s; flex-shrink:0; }
.chat-btn-send:hover { background:#00c49a; }
.chat-btn-send svg { width:20px; height:20px; fill:#fff; }
.chat-tool-btn { background:none; border:none; cursor:pointer; padding:7px; border-radius:50%; color:#8696a0; font-size:18px; transition:color .15s, background .15s; display:flex; align-items:center; }
.chat-tool-btn:hover { color:#e9edef; background:rgba(255,255,255,0.08); }

/* ── Painel lateral direito ── */
.chat-side { background:#111b21; border-left:1px solid rgba(255,255,255,0.06); padding:0; overflow-y:auto; overscroll-behavior-y:contain; display:flex; flex-direction:column; }
.chat-side-section { padding:12px 16px; border-bottom:1px solid rgba(255,255,255,0.06); }
.cst { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:#8696a0; margin-bottom:8px; }

/* ── Status WPP ── */
.wpp-ok { display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:8px; background:rgba(0,168,132,0.1); border:1px solid rgba(0,168,132,0.25); font-size:12px; color:#00a884; margin-bottom:0; }
.wdot { width:8px; height:8px; border-radius:50%; background:#00a884; animation:pulse 2s infinite; flex-shrink:0; }

/* ── Respostas rápidas ── */
.qr { background:#202c33; border:1px solid rgba(255,255,255,0.07); border-radius:8px; padding:8px 10px; font-size:12px; cursor:pointer; margin-bottom:6px; transition:border-color .15s, background .15s; line-height:1.4; color:#e9edef; }
.qr:hover { border-color:#00a884; color:#00a884; background:rgba(0,168,132,0.06); }

/* ── Separador de data ── */
.chat-date-sep { display:flex; align-items:center; justify-content:center; margin:10px 0 6px; }
.chat-date-sep span { font-size:11.5px; color:#e9edef; background:#182229; padding:5px 12px; border-radius:8px; font-weight:500; }

.contract-preview { background:#fff; color:#111; padding:28px; border-radius:8px; font-size:12.5px; line-height:1.8; font-family:'Georgia',serif; border:1px solid #ddd; }
.contract-preview h2 { text-align:center; font-size:14px; margin-bottom:4px; }
.cp-sub { text-align:center; color:#555; margin-bottom:18px; font-size:11px; }
.contract-preview p { margin-bottom:8px; }
.sign-row   { display:flex; justify-content:space-between; margin-top:28px; }
.sign-block { text-align:center; font-size:11px; color:#555; }
.sign-line  { border-top:1px solid #999; width:150px; margin:24px auto 5px; }

@keyframes modalOverlayIn { from{ opacity:0; } to{ opacity:1; } }
@keyframes modalPopIn { from{ opacity:0; transform:translateY(14px) scale(.96); } to{ opacity:1; transform:translateY(0) scale(1); } }

.modal-overlay { position:fixed; inset:0; background:rgba(15,15,20,.62); display:none; align-items:center; justify-content:center; z-index:200; backdrop-filter:blur(5px); }
.modal-overlay.show { display:flex; animation:modalOverlayIn .16s ease; }
.modal { background:var(--card); border:1px solid var(--border2); border-radius:16px; padding:28px; width:540px; max-height:85vh; overflow-y:auto; overscroll-behavior-y:contain; box-shadow:var(--shadow-lg); animation:modalPopIn .22s cubic-bezier(.2,.8,.2,1); }
.modal-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--border2); }
.modal-title  { font-family:var(--font-display); font-size:18px; font-weight:700; color:var(--text); }
.modal-close { background:rgba(1,179,150,0.1); border:none; color:var(--muted); width:30px; height:30px; border-radius:50%; cursor:pointer; font-size:16px; display:flex; align-items:center; justify-content:center; transition:background-color .15s, color .15s, transform .18s cubic-bezier(.2,.8,.2,1); flex-shrink:0; }
.modal-close:hover { background:rgba(220,38,38,0.12); color:var(--red); transform:rotate(90deg); }
.modal-close:active { transform:rotate(90deg) scale(.9); }
.modal-footer { display:flex; gap:10px; margin-top:20px; padding-top:16px; border-top:1px solid var(--border2); justify-content:flex-end; }
@media (prefers-reduced-motion: reduce) {
  .modal-overlay.show, .modal { animation:none; }
}

.user-card { background:rgba(1,179,150,0.06); border:1px solid var(--border); border-radius:12px; padding:16px; display:flex; align-items:center; gap:14px; margin-bottom:10px; transition:border-color .15s; }
.user-card:hover { border-color:var(--border2); }
.uc-info    { flex:1; }
.uc-name    { font-size:14px; font-weight:600; color:var(--text); }
.uc-email   { font-size:12px; color:var(--muted); margin-top:2px; }
.uc-actions { display:flex; gap:8px; align-items:center; }

.access-denied { display:flex; flex-direction:column; align-items:center; justify-content:center; height:60vh; gap:12px; text-align:center; }
.ad-icon  { font-size:48px; opacity:.15; }
.ad-title { font-family:var(--font-display); font-size:20px; font-weight:700; color:var(--red); }
.ad-sub   { color:var(--muted); font-size:13px; max-width:300px; line-height:1.6; }

.notify {
  position:fixed; top:20px; left:50%; transform:translateX(-50%);
  padding:14px 18px 14px 16px; border-radius:12px; font-size:14.5px; font-weight:700;
  z-index:1000000; /* acima de qualquer modal (o mais alto do sistema é 99999) */
  display:none; box-shadow:0 12px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.04);
  max-width:min(520px, calc(100vw - 32px));
  text-align:left; line-height:1.4;
  animation:notifyIn .35s cubic-bezier(.34,1.56,.64,1);
  border-left-width:4px; border-left-style:solid;
  overflow:hidden;
}
.notify.notify-out { animation:notifyOut .22s ease forwards; }
.notify.success { background:#16a34a; border:1px solid #15803d; border-left-color:#0f2f1c; color:#ffffff; }
.notify.error   { background:#dc2626; border:1px solid #b91c1c; border-left-color:#450a0a; color:#ffffff; }
.notify.warning { background:#d97706; border:1px solid #b45309; border-left-color:#431407; color:#ffffff; }
.notify.info    { background:#2563eb; border:1px solid #1d4ed8; border-left-color:#1e3a8a; color:#ffffff; }
.notify-body { display:flex; align-items:center; gap:10px; }
.notify-icon { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:24px; height:24px; border-radius:50%; background:rgba(255,255,255,.18); }
.notify-msg { flex:1; }
.notify-close { flex-shrink:0; width:22px; height:22px; border-radius:50%; border:none; background:rgba(255,255,255,.14); color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:background-color .15s, transform .15s; }
.notify-close:hover { background:rgba(255,255,255,.28); transform:rotate(90deg); }
.notify-close svg { width:11px; height:11px; }
.notify-progress { position:absolute; left:0; bottom:0; height:3px; width:100%; background:rgba(255,255,255,.35); transform-origin:left; animation:notifyShrink linear forwards; }
.notify:hover .notify-progress { animation-play-state:paused; }
@keyframes notifyIn {
  from{ transform:translate(-50%,-24px); opacity:0; }
  to{ transform:translate(-50%,0); opacity:1; }
}
@keyframes notifyOut {
  from{ transform:translate(-50%,0); opacity:1; }
  to{ transform:translate(-50%,-16px); opacity:0; }
}
@keyframes notifyShrink {
  from{ transform:scaleX(1); }
  to{ transform:scaleX(0); }
}
@media (max-width:768px){
  .notify { top:calc(env(safe-area-inset-top, 0px) + 12px); font-size:13.5px; padding:12px 14px 12px 14px; }
}

.tab-filter { display:flex; gap:6px; margin-bottom:16px; }
.tab-btn { padding:6px 14px; border-radius:99px; font-size:12px; cursor:pointer; border:1.5px solid var(--border2); color:var(--muted); background:transparent; font-family:var(--font-body); transition:all .15s; font-weight:500; }
.tab-btn.active, .tab-btn:hover { background:var(--accent); color:#fff; border-color:var(--accent); font-weight:600; }
/* Scrollbar global estilo WhatsApp */
* { scrollbar-width: thin; scrollbar-color: transparent transparent; }
*:hover { scrollbar-color: rgba(255,255,255,0.15) transparent; }
*::-webkit-scrollbar { width:6px; height:6px; }
*::-webkit-scrollbar-track { background:transparent; }
*::-webkit-scrollbar-thumb { background:transparent; border-radius:99px; transition:background .2s; }
*:hover::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.12); }
*::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,0.22) !important; }
.scrollbar-thin::-webkit-scrollbar { width:4px; }
.scrollbar-thin::-webkit-scrollbar-thumb { background:transparent; border-radius:99px; }
.scrollbar-thin:hover::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.12); }
.input-group { display:flex; gap:10px; margin-bottom:16px; align-items:center; }

.search-results { position:absolute; top:100%; left:0; right:0; background:var(--card); border:1px solid var(--border2); border-radius:10px; box-shadow:var(--shadow-lg); z-index:100; max-height:300px; overflow-y:auto; margin-top:4px; }
.search-item { padding:10px 14px; cursor:pointer; font-size:13px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--border); transition:background .1s; color:var(--text2); }
.search-item:hover { background:rgba(1,179,150,0.08); }
.search-item:last-child { border:none; }
.search-tag { font-size:10px; color:var(--muted); background:rgba(1,179,150,0.1); padding:2px 7px; border-radius:99px; }

@media (max-width:768px) {
  body { overflow:auto; height:auto; }
  .login-card { padding:32px 24px; max-width:100%; }
  .setup-box { width:100%; max-width:100%; min-height:100vh; border-radius:0; border:none; padding:32px 20px; }
  #layer-app { overflow:hidden; }
  /* Contém o overscroll dentro dos containers que realmente rolam — sem
     isso, ao chegar no topo/fim de uma lista o gesto "vaza" para o
     documento e aciona o "puxar para atualizar" nativo do navegador,
     fazendo a tela parecer "voltar"/recarregar sozinha. Vale para TODAS
     as páginas do sistema no mobile, não só o chat. */
  html, body { overscroll-behavior-y: none; }
  .content, .page, .card, .modal-body, table { overscroll-behavior-y: contain; }
  .sidebar { overscroll-behavior-y: contain; }
  .sidebar { position:fixed; left:-100%; z-index:100; transition:left .25s; height:100%; }
  .sidebar.open { left:0; box-shadow:4px 0 24px rgba(0,0,0,.6); }
  .main { width:100%; }
  .topbar { padding:0 14px; gap:8px; }
  .topbar-search { min-width:0; flex:1; }
  .page-title { font-size:15px; }
  .content { padding:14px 12px; }
  .stats-grid { grid-template-columns:repeat(2,1fr) !important; gap:10px; }
  .stat-val { font-size:22px; }
  .grid2 { grid-template-columns:1fr; }
  .card { overflow-x:auto; padding:14px; }
  table { min-width:460px; }
  .modal { width:calc(100vw - 24px); max-height:92vh; padding:20px 16px; border-radius:14px; }
  .form-grid { grid-template-columns:1fr; }
  .form-group.full { grid-column:1; }
  .modal-footer { flex-direction:column-reverse; }
  .modal-footer .btn { width:100%; justify-content:center; }
  /* Grids marcados: empilham em coluna única no mobile */
  .mob-stack { grid-template-columns:1fr !important; }
  /* Grids de métricas: 4 colunas viram 2 no mobile */
  .mob-2col { grid-template-columns:repeat(2,1fr) !important; }
  /* Gauge de combustível do checklist: 9 segmentos não cabem — vira 3x3 */
  #ctchk-gauge { grid-template-columns:repeat(3,1fr) !important; }
  /* Lista de contatos do chat: badges na mesma linha, itens mais compactos */
  .chat-item { padding:10px 12px; }
  .chat-badges-row { display:flex !important; flex-wrap:wrap; gap:4px; align-items:center; }
  .chat-badges-row + .chat-badges-row { margin-top:3px !important; }
}

@media (max-width:768px) {
  #btn-hamburguer { display:flex !important; }
  .sidebar { position:fixed; left:-260px; z-index:100; transition:left .25s cubic-bezier(.4,0,.2,1); height:100%; width:260px; }
  .sidebar.open { left:0; box-shadow:4px 0 32px rgba(0,0,0,.7); }
}

/* Botão voltar: oculto no desktop, visível só no mobile via media query */
.chat-back-btn { display: none; }
/* Elementos exclusivos do mobile (menu ⋮, gaveta lateral, engrenagem da lista) */
.chat-menu-mobile-only { display: none; }
#chat-side-fechar { display: none; }
#chat-list-gear { display: none; }
@media (max-width:768px) { #chat-list-gear { display: flex; } }

/* ── CHAT MOBILE ── */
@media (max-width:768px) {
  /* App shell em FLUXO NORMAL (sem position:fixed!).
     Causa raiz do problema do teclado: o WebKit/iOS NÃO redimensiona o
     viewport nem rola até campos focados dentro de position:fixed — apenas
     sobrepõe o teclado (comprovado com o badge: vv.h imóvel no Safari).
     Em fluxo normal, o iOS revela o campo focado nativamente.
     O JS (initViewportFit) mantém a altura = viewport visível (gap zero). */
  body:has(#layer-app.active) { overflow:hidden; overscroll-behavior:none; }
  #layer-app.active { position:relative; height:100dvh; }
  /* PWA instalado (viewport-fit=cover): o app avança sob a barra de status —
     o topbar ganha o respiro da safe-area para relógio/bateria não cobrirem os botões */
  .topbar { height:auto; min-height:60px; padding-top:env(safe-area-inset-top, 0px); }
  .main { height:100%; }
  /* Chat em tela cheia: anula o padding do .content e a altura fixa de desktop */
  #page-chat { margin: -14px -12px; height: calc(100% + 28px) !important; }
  #page-chat .chat-layout { height: 100% !important; border-radius: 0; border: none; }
  /* Layout: 3 colunas vira 1 coluna empilhada */
  .chat-layout {
    grid-template-columns: 100% !important;
    grid-template-rows: 1fr;
    position: relative;
    overflow: hidden;
  }
  /* Lista: ocupa tela inteira por padrão */
  .chat-list {
    position: absolute;
    inset: 0;
    width: 100%;
    z-index: 2;
    transform: translateX(0);
    transition: transform .28s cubic-bezier(.4,0,.2,1);
  }
  /* Janela de conversa: fora da tela à direita por padrão */
  .chat-window {
    position: absolute;
    inset: 0;
    width: 100%;
    z-index: 3;
    transform: translateX(100%);
    transition: transform .28s cubic-bezier(.4,0,.2,1);
  }
  /* Painel lateral: vira gaveta deslizante da direita */
  .chat-side {
    display: flex !important;
    position: absolute;
    inset: 0;
    width: 100%;
    z-index: 80;
    transform: translateX(100%);
    transition: transform .28s cubic-bezier(.4,0,.2,1);
    background: #111b21;
  }
  .chat-layout.side-open .chat-side { transform: translateX(0); }
  #chat-side-fechar { display: flex !important; }
  /* Quando uma conversa está aberta: lista some, janela aparece */
  .chat-layout.chat-open .chat-list {
    transform: translateX(-100%);
  }
  .chat-layout.chat-open .chat-window {
    transform: translateX(0);
  }
  /* Botão voltar: aparece só no mobile */
  .chat-back-btn {
    display: none;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    color: #aebac1;
    cursor: pointer;
    padding: 4px 8px;
    font-size: 13px;
    flex-shrink: 0;
  }
  /* Header do chat: ações viram menu dropdown acionado pelo kebab (⋮) */
  .chat-top { z-index: 70; }
  .chat-input-area { z-index: 65; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
  .chat-msgs { padding: 12px 10px; }
  #chat-kebab { display:flex !important; align-items:center; }
  .chat-menu-mobile-only { display: block !important; }
  .chat-top-actions {
    display: none;
    position: absolute;
    top: 54px;
    right: 8px;
    flex-direction: column;
    align-items: stretch;
    gap: 4px !important;
    background: #233138;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    padding: 8px;
    box-shadow: 0 8px 32px rgba(0,0,0,.5);
    z-index: 60;
    min-width: 180px;
  }
  .chat-top-actions.open { display: flex; }
  .chat-top-actions button {
    text-align: left;
    padding: 10px 12px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
    white-space: nowrap;
  }

  /* Barra de digitação: ferramentas viram sheet acionado pelo + */
  #chat-plus-btn { display:flex !important; align-items:center; }
  #chat-tools-left {
    display: none !important;
    position: absolute;
    bottom: 64px;
    left: 8px;
    flex-direction: column;
    gap: 4px !important;
    background: #233138;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 14px;
    padding: 8px;
    box-shadow: 0 8px 32px rgba(0,0,0,.5);
    z-index: 60;
  }
  #chat-tools-left.open { display: flex !important; }
  #chat-tools-left .chat-tool-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    font-size: 20px;
    border-radius: 10px;
  }
  #chat-tools-left .chat-tool-btn::after {
    font-size: 13px;
    color: #e9edef;
    content: attr(title);
  }
  /* Botão de áudio-arquivo dentro do campo: escondido no mobile (mic já cobre) */
  .chat-input-wrap > label.chat-tool-btn { display: none; }

  /* Campos com 16px: evita o zoom automático do iOS ao focar */
  .chat-input, #chat-search { font-size: 16px !important; }

  /* Bolhas mais largas e header mais justo no mobile */
  .msg { max-width: 82%; }
  .chat-top { padding: 8px 10px; gap: 8px; }
}

/* ── Mescla fleetpro (Task 6a): mínimo para o markup novo funcionar.
   O restante das classes do fleetpro (dash-bloco, rs-*, mn-*, eu-*, ...) é
   portado na Task 6b com os tokens do Froteli. ── */
.dash-oculto { display:none !important; }
#dash-barra-edicao { display:none; }
#dash-barra-edicao.ativo {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; margin-bottom:14px; padding:11px 14px;
  background:var(--bg3); border:1px solid var(--accent); border-radius:10px;
}
#dash-barra-edicao .dica { font-size:12.5px; color:var(--muted); line-height:1.45; }
#dash-barra-edicao .acoes { display:flex; gap:8px; flex-wrap:wrap; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* ══════════════════════════════════════════════════════════════
   TELAS DO FLEETPRO NO VISUAL FROTELI (Task 6b-1)
   Regras portadas do fleetpro para as classes do markup novo, com as
   cores trocadas pelos tokens do Froteli (claro e escuro) e os
   componentes alinhados aos do saas: abas-pílula (.tab-btn), KPIs
   (.stat-card), tabelas (th/td globais), campos (input global),
   títulos (.card-title/.modal-title). Responsivo em mobile.css.
   ══════════════════════════════════════════════════════════════ */
@keyframes msgPisca {
  0%,55% { box-shadow:0 0 0 2px color-mix(in srgb, var(--chat-link) 75%, transparent); }
  100%   { box-shadow:0 0 0 2px transparent; }
}
@keyframes perfil-score-encher { from { stroke-dashoffset:var(--c); } }
@keyframes rsCombo { from { opacity:0; transform:translateY(-4px) scale(.99); } to { opacity:1; transform:none; } }

/* ═════ Módulo: Componentes compartilhados (seg/seg-btn, interruptor mt-switch, modal-lg, campo-travado, dp-chip, loading-spinner) ═════ */
.modal-lg { width:980px; max-width:calc(100vw - 48px); }
/* Controle segmentado do fleetpro desenhado como as abas-pílula do Froteli
   (.tab-filter/.tab-btn): pílulas com borda, ativa/hover na cor da marca. */
.seg { display:inline-flex; flex-wrap:wrap; gap:6px; }
.seg-btn { padding:6px 14px; border-radius:99px; font-size:12px; cursor:pointer; border:1.5px solid var(--border2); color:var(--muted); background:transparent; font-family:var(--font-body); transition:all .15s; font-weight:500; white-space:nowrap; }
.seg-btn.active,
.seg-btn:hover { background:var(--accent); color:var(--on-accent); border-color:var(--accent); font-weight:600; }
.seg-sm .seg-btn { font-size:11px; padding:4px 11px; }
.seg-btn:active { transform:scale(.97); transition:transform 100ms ease-out; }
@media (prefers-reduced-motion: reduce) {
  .seg-btn:active { transform:none; }
}
.mt-switch { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 12px; background:var(--bg2); border-radius:10px; cursor:pointer; }
.mt-switch-txt { font-size:13px; font-weight:500; color:var(--text); }
.mt-switch-txt small { display:block; font-size:11.5px; font-weight:400; color:var(--muted2); margin-top:2px; }
.mt-switch input { appearance:none; -webkit-appearance:none; flex-shrink:0; width:44px; height:26px; margin:0; border-radius:13px; background:var(--muted2); position:relative; cursor:pointer; transition:background .2s; }
.mt-switch input::after { content:''; position:absolute; top:2px; left:2px; width:22px; height:22px; border-radius:50%; background:var(--on-accent); box-shadow:var(--shadow-sm); transition:transform .22s cubic-bezier(.3,.7,.4,1); }
.mt-switch input:checked { background:var(--accent); }
.mt-switch input:checked::after { transform:translateX(18px); }
.campo-travado { background:var(--bg3) !important; color:var(--muted) !important; cursor:not-allowed; }
/* Chips de período do Desempenho (botões .btn-ghost): estado ativo igual ao
   botão primário — o JS só alterna .active. */
.dp-chip.active { background:var(--accent); color:var(--on-accent); border-color:var(--accent); }
/* Indicador de carregamento (fotos do modelo, lista de veículos) */
.loading-spinner { width:28px; height:28px; margin:24px auto; border-radius:50%; border:3px solid var(--border2); border-top-color:var(--accent); animation:froteliGira .8s linear infinite; }
@keyframes froteliGira { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .loading-spinner { animation-duration:2.4s; }
}

/* ═════ Módulo: Dashboard: blocos e modo de edição (dash-*) ═════ */
.dash-blocos { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
.dash-bloco { min-width:0; }
.dash-bloco-full { grid-column:1 / -1; }
.dash-bloco > .card { height:100%; margin-bottom:0; }
.dash-blocos.dash-editando .dash-bloco:not(.dash-nao-disponivel) { display:block !important; }
.dash-blocos.dash-editando .dash-bloco.dash-vazio > .card::after { content:'Sem dados hoje — aparece automaticamente quando houver'; display:block; font-size:11.5px; color:var(--muted2); font-style:italic; padding:6px 0 2px; }
.dash-edit-item { position:relative; outline:1px dashed var(--border2); outline-offset:3px; border-radius:12px; cursor:grab; -webkit-user-select:none; user-select:none; }
.dash-blocos.dash-editando .dash-bloco > .card,
.dash-blocos.dash-editando .dash-bloco > .card *,
.dash-blocos.dash-editando .dash-bloco > .stats-grid,
.dash-blocos.dash-editando .dash-bloco > .stats-grid * { pointer-events:none; }
.dash-blocos.dash-editando .dash-edit-ctrl,
.dash-blocos.dash-editando .dash-edit-alca,
.dash-blocos.dash-editando .dash-edit-olho { pointer-events:auto; }
.dash-blocos.dash-arrasto-ativo { touch-action:none; }
.dash-edit-oculto { opacity:.42; }
.dash-arrastando { opacity:.75; pointer-events:none; outline:2px solid var(--accent); box-shadow:var(--shadow-lg); }
.dash-edit-ctrl { position:absolute; top:-11px; left:10px; right:10px; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:8px; pointer-events:none; }
.dash-edit-alca { pointer-events:auto; touch-action:none; cursor:grab; display:inline-flex; align-items:center; gap:6px; background:var(--accent); color:var(--on-accent); border-radius:999px; padding:3px 11px 3px 7px; font-size:11px; font-weight:600; box-shadow:var(--shadow-md); }
.dash-arrastando .dash-edit-alca { cursor:grabbing; }
.dash-edit-alca svg { width:14px; height:14px; }
.dash-edit-nome { white-space:nowrap; max-width:180px; overflow:hidden; text-overflow:ellipsis; }
.dash-edit-olho { pointer-events:auto; cursor:pointer; border:none; width:26px; height:26px; border-radius:50%; background:var(--bg2); color:var(--text); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; padding:0; box-shadow:var(--shadow-md); }
.dash-edit-olho:hover { background:var(--bg3); }
.dash-edit-olho svg { width:15px; height:15px; }
@media (prefers-reduced-motion: reduce) {
  .dash-arrastando { box-shadow:none; }
}

/* ═════ Módulo: Usuários e acessos (usr-*, eu-*, cr-*, senha-prov) ═════ */
.usr-toolbar { display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.usr-search { position:relative; flex:1; min-width:200px; max-width:320px; }
.usr-search svg { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--muted2); pointer-events:none; }
.usr-search input { width:100%; padding:8px 12px 8px 32px; font-size:13px; }
.usr-filtros { display:flex; gap:6px; flex-wrap:wrap; }
.usr-filtro { display:inline-flex; align-items:center; gap:7px; padding:6px 14px; border-radius:99px; font-size:12px; font-weight:500; color:var(--muted); background:transparent; border:1.5px solid var(--border2); cursor:pointer; font-family:var(--font-body); transition:all .15s; }
.usr-filtro:hover,
.usr-filtro.active { color:var(--on-accent); background:var(--accent); border-color:var(--accent); font-weight:600; }
.usr-filtro .n { font-size:11px; font-weight:700; color:var(--muted2); font-variant-numeric:tabular-nums; }
.usr-filtro:hover .n,
.usr-filtro.active .n { color:var(--on-accent); opacity:.85; }
.usr-tabela { background:var(--card); border:1px solid var(--border2); border-radius:12px; box-shadow:var(--shadow-sm); overflow:hidden; }
.usr-tabela table { width:100%; }
.usr-tabela th { padding:12px 16px 10px; border-bottom:1px solid var(--border2); }
.usr-tabela td { padding:0 16px; height:60px; border-bottom:1px solid var(--border); }
.usr-tabela tbody tr:last-child td { border-bottom:none; }
.usr-tabela tbody tr { cursor:pointer; transition:background .15s; }
.usr-tabela tbody tr:hover .usr-editar { opacity:1; }
.usr-ident { display:flex; align-items:center; gap:12px; min-width:0; }
.usr-avatar { width:36px; height:36px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; letter-spacing:.02em; }
.usr-nome { font-size:13px; font-weight:600; color:var(--text); line-height:1.35; }
.usr-sub { font-size:11.5px; color:var(--muted2); line-height:1.35; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:260px; }
.usr-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:99px; font-size:11.5px; font-weight:600; white-space:nowrap; }
.usr-badge svg { flex-shrink:0; }
.usr-setor { font-size:12px; color:var(--muted); }
.usr-acesso { font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.usr-acesso.restrito { color:var(--accent2); font-weight:600; }
.usr-vazio { font-size:12px; color:var(--muted2); }
.usr-editar { opacity:0; transition:opacity .18s; padding:6px 12px; font-size:12px; display:inline-flex; align-items:center; gap:6px; }
.usr-editar:focus-visible { opacity:1; }
.usr-empty { padding:56px 24px; text-align:center; }
.usr-empty-ico { color:var(--muted2); margin-bottom:14px; }
.usr-empty-tit { font-size:14px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.usr-empty-sub { font-size:12.5px; color:var(--muted2); margin-top:5px; }
.eu-topo { display:flex; align-items:center; gap:13px; min-width:0; }
.eu-topo-av { width:44px; height:44px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; }
.eu-topo-nome { font-family:var(--font-display); font-size:17px; font-weight:700; color:var(--text); letter-spacing:-0.01em; line-height:1.25; }
.eu-topo-sub { font-size:12px; color:var(--muted2); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:420px; }
.eu-grid { display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr); gap:26px; align-items:start; }
.eu-grid.uma-coluna { grid-template-columns:minmax(0,1fr); max-width:520px; }
.eu-sec { margin-bottom:20px; }
.eu-sec:last-child { margin-bottom:0; }
.eu-sec-tit { display:flex; align-items:baseline; justify-content:space-between; gap:10px; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--muted2); padding-bottom:9px; margin-bottom:13px; border-bottom:1px solid var(--border2); }
.eu-sec-tit .contador { font-size:11px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--muted); font-variant-numeric:tabular-nums; }
.eu-ajuda { font-size:11.5px; color:var(--muted2); line-height:1.5; margin-top:6px; }
.eu-grupo { margin-bottom:14px; }
.eu-grupo:last-child { margin-bottom:0; }
.eu-grupo-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.eu-grupo-nome { font-size:11.5px; font-weight:700; color:var(--text2); }
.eu-grupo-todos { background:none; border:none; cursor:pointer; padding:2px 4px; font-family:var(--font-body); font-size:11px; font-weight:600; color:var(--muted2); transition:color .15s; }
.eu-grupo-todos:hover { color:var(--accent2); }
.eu-grupo-itens { display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:6px; }
.eu-chk { display:flex; align-items:center; gap:9px; padding:8px 11px; border-radius:9px; background:var(--bg2); border:1.5px solid transparent; cursor:pointer; font-size:12.5px; color:var(--muted); user-select:none; transition:background .15s, border-color .15s, color .15s; }
.eu-chk:hover { border-color:var(--border2); }
.eu-chk:has(input:checked) { background:var(--accent-light); border-color:color-mix(in srgb, var(--accent) 28%, transparent); color:var(--text); font-weight:600; }
.eu-chk input { width:15px; height:15px; flex-shrink:0; accent-color:var(--accent); cursor:pointer; margin:0; }
.eu-desconto { display:flex; align-items:center; gap:9px; }
.eu-desconto input { width:78px; text-align:center; font-variant-numeric:tabular-nums; }
.eu-desconto .pct { font-size:13px; font-weight:600; color:var(--muted); }
.eu-risco { border:1px solid var(--red-border); background:var(--red-bg); border-radius:10px; padding:13px 15px; }
.eu-risco-tit { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--red); margin-bottom:4px; }
.eu-risco-sub { font-size:11.5px; color:var(--muted); line-height:1.5; margin-bottom:11px; }
.eu-risco-acoes { display:flex; gap:8px; flex-wrap:wrap; }
.eu-risco-acoes .btn { font-size:12px; padding:7px 13px; background:var(--card); }
.eu-readonly { opacity:1; color:var(--muted); background:var(--bg2); cursor:not-allowed; }
.cr-perfis { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.cr-perfil { display:flex; align-items:flex-start; gap:10px; padding:11px 12px; background:var(--bg2); border:1.5px solid transparent; border-radius:10px; cursor:pointer; user-select:none; transition:background .15s, border-color .15s; }
.cr-perfil:hover { border-color:var(--border2); }
.cr-perfil:has(input:checked) { background:var(--card); border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.cr-perfil input { position:absolute; opacity:0; pointer-events:none; }
.cr-perfil-ico { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:28px; height:28px; border-radius:8px; margin-top:1px; }
.cr-perfil-nome { display:block; font-size:12.5px; font-weight:600; color:var(--text); line-height:1.3; }
.cr-perfil-desc { display:block; font-size:11px; color:var(--muted2); line-height:1.4; margin-top:2px; }
.cr-aviso { display:flex; align-items:flex-start; gap:10px; background:var(--bg2); border-radius:10px; padding:12px 14px; font-size:12px; color:var(--muted); line-height:1.5; }
.cr-aviso svg { flex-shrink:0; margin-top:1px; color:var(--muted2); }
.cr-senha { border:1px solid var(--green-border); background:var(--green-bg); border-radius:10px; padding:14px; margin-top:14px; }
.cr-senha-lbl { font-size:11.5px; color:var(--muted); margin-bottom:8px; }
.cr-senha-box { display:flex; gap:8px; align-items:center; }
.cr-senha-box code { flex:1; font-size:17px; font-weight:700; letter-spacing:2px; background:var(--card); padding:9px 13px; border-radius:8px; color:var(--text); border:1px solid var(--green-border); text-align:center; }
.senha-prov { display:flex; align-items:center; gap:8px; margin:12px 0; padding:10px 12px; background:var(--bg2); border-radius:10px; }
.senha-prov code { flex:1; font-size:17px; font-weight:600; letter-spacing:.04em; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; user-select:all; }
.senha-prov button { border:none; background:var(--accent); color:var(--on-accent); border-radius:8px; padding:6px 12px; font-family:var(--font-body); font-size:12px; font-weight:600; cursor:pointer; }

/* ═════ Módulo: Lista clicável compartilhada (lista-*) e Clientes (cli-*, perfil-*) ═════ */
.perfil-grid { display:grid; grid-template-columns:minmax(0,280px) minmax(0,1fr); gap:20px; align-items:start; padding:0 20px 20px; }
.perfil-ficha { display:flex; flex-direction:column; gap:12px; position:sticky; top:0; }
.perfil-ficha-grupo { background:var(--bg2); border:1px solid var(--border2); border-radius:12px; overflow:hidden; }
.perfil-ficha-item { padding:11px 14px; }
.perfil-ficha-item + .perfil-ficha-item { border-top:1px solid var(--border2); }
.perfil-score { display:flex; align-items:center; gap:14px; background:var(--bg2); border:1px solid var(--border2); border-radius:12px; padding:14px; }
.perfil-score-anel { flex-shrink:0; }
.perfil-score-arco { animation:perfil-score-encher .8s cubic-bezier(.2,.8,.2,1) both; }
@media (prefers-reduced-motion: reduce) {
  .perfil-score-arco { animation:none; }
}
.perfil-score-partes { display:grid; grid-template-columns:1fr auto; gap:1px 10px; margin-top:8px; font-size:11.5px; }
.perfil-score-partes .rot { color:var(--text); }
.perfil-score-partes .val { color:var(--text); font-variant-numeric:tabular-nums; text-align:right; }
.perfil-score-partes .motivo { grid-column:1 / -1; font-size:11px; color:var(--muted); margin-bottom:4px; }
.cli-oculto { font-size:11px; color:var(--muted2); background:var(--bg2); border-radius:99px; padding:2px 7px; }
.cli-nao-cobrar { margin:0; }
.lista-card { padding:0; overflow:hidden; flex-shrink:0; }
.lista-tabela { width:100%; border-collapse:collapse; }
.lista-tabela th { padding:12px 16px; height:40px; font-size:10px; font-weight:700; color:var(--muted2); text-transform:uppercase; letter-spacing:.8px; text-align:left; }
.lista-tabela td { padding:10px 16px; height:66px; border-bottom:1px solid var(--border); font-size:13.5px; color:var(--text2); }
.lista-tabela tr:last-child td { border-bottom:none; }
.lista-tabela th.num,
.lista-tabela td.num { text-align:right; font-variant-numeric:tabular-nums; }
.lista-linha.clicavel { cursor:pointer; transition:background .12s; }
.lista-linha.clicavel:active { background:var(--bg3); }
.lista-linha.clicavel:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; background:var(--bg2); }
.lista-acoes { display:flex; align-items:center; justify-content:flex-end; gap:2px; }
.lista-ico { width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; border:none; background:none; border-radius:8px; color:var(--muted2); cursor:pointer; opacity:0; transition:opacity .15s, background .15s, color .15s; }
.lista-ico svg { width:15px; height:15px; }
.lista-linha:hover .lista-ico,
.lista-linha:focus-within .lista-ico { opacity:1; }
.lista-ico:hover { background:var(--card); color:var(--text); box-shadow:0 0 0 1px var(--border2); }
.lista-ico.perigo:hover { color:var(--red); background:var(--red-bg); box-shadow:none; }
.lista-ico:focus-visible { opacity:1; outline:2px solid var(--accent); outline-offset:1px; }
.lista-chevron { color:var(--muted2); margin-left:6px; flex-shrink:0; transition:transform .15s, color .15s; }
.lista-linha:hover .lista-chevron { color:var(--muted2); transform:translateX(2px); }
.lista-status { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:500; color:var(--text2); white-space:nowrap; }
.lista-status i { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.lista-status.fraco { color:var(--muted2); font-weight:400; }
.lista-vazia td { height:auto; padding:48px 16px; text-align:center; color:var(--muted2); font-size:13.5px; }
@media (hover:none) {
  .lista-ico { opacity:1; }
}
.cli-pessoa { display:flex; align-items:center; gap:12px; min-width:0; }
.cli-avatar { width:38px; height:38px; flex-shrink:0; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--bg3); color:var(--muted); font-size:12.5px; font-weight:600; letter-spacing:.02em; }
.cli-txt { min-width:0; }
.cli-nome { font-size:14px; font-weight:600; color:var(--text); letter-spacing:-0.006em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cli-sub { font-size:12px; color:var(--muted2); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cli-doc { font-size:13px; color:var(--text2); font-variant-numeric:tabular-nums; }
.cli-vazio { color:var(--muted2); }
.cli-deve { font-size:13.5px; font-weight:700; color:var(--red); font-variant-numeric:tabular-nums; }
.cli-quite { font-size:13px; color:var(--muted2); }
.lista-acoes .mn-btn { white-space:nowrap; }

/* ═════ Módulo: Locações: lista, consolidado, acordo, CNH e cobrança avulsa (loc-*, cons-*, acordo-*, acr-*, av-*) ═════ */
.cons-tab { background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:14px 16px; margin-bottom:16px; }
.cons-tit { font-size:13px; font-weight:700; color:var(--text); margin-bottom:10px; font-family:var(--font-display); }
.cons-tab table { width:100%; border-collapse:collapse; font-size:12.5px; }
.cons-tab th { font-size:10px; text-transform:uppercase; letter-spacing:.8px; color:var(--muted2); font-weight:700; padding:6px 8px; border-bottom:1px solid var(--border2); text-align:left; }
.cons-tab td { padding:7px 8px; border-bottom:1px solid var(--border); color:var(--text2); }
.cons-tab .num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.cons-mora { color:var(--yellow); }
.cons-sub { font-weight:600; color:var(--text); }
.cons-tab tfoot td { border-bottom:none; padding-top:6px; padding-bottom:4px; color:var(--muted); font-size:12px; }
.cons-tab tfoot tr:first-child td { padding-top:10px; border-top:1px solid var(--border2); }
.cons-subtotal td { font-weight:600; color:var(--text); }
.cons-total td { font-weight:700; color:var(--text); font-size:14px; padding-top:8px; border-top:1px solid var(--border2); }
.cons-check { display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--text); cursor:pointer; }
.cons-check input { width:15px; height:15px; margin:0; }
.cons-rodape { font-size:11px; color:var(--muted2); margin-top:8px; }
.cons-vazio { font-size:12.5px; color:var(--muted2); background:var(--bg2); border-radius:10px; padding:12px 14px; margin-bottom:16px; }
.cons-vivo { background:var(--card); border:1px solid var(--yellow); border-radius:12px; padding:14px 16px; margin-bottom:14px; }
.cons-vivo.pendente { border-color:var(--red); }
.cons-vivo-cab { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; flex-wrap:wrap; }
.cons-vivo-lbl { font-size:11.5px; color:var(--muted2); }
.cons-vivo-val { font-family:var(--font-numeric); font-size:22px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; margin-top:2px; }
.cons-vivo-sub { font-size:11.5px; color:var(--muted2); margin-top:3px; }
.cons-vivo-acoes { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cons-vivo-acoes .btn { height:34px; padding:0 14px; font-size:12.5px; display:inline-flex; align-items:center; text-decoration:none; }
.cons-vivo-ok { font-size:12px; font-weight:600; color:var(--green); }
.cons-vivo-alerta { font-size:12px; font-weight:600; color:var(--red); }
.cons-vivo-nota { font-size:11.5px; color:var(--muted2); line-height:1.5; margin-top:10px; }
.loc-filtro-cnh { margin:0 0 14px; align-self:flex-start; max-width:100%; }
.loc-filtro-cnh .seg-btn { display:inline-flex; align-items:center; gap:6px; padding:7px 12px; font-size:12.5px; }
.loc-cnh-n { font-size:11.5px; font-weight:600; color:var(--muted2); font-variant-numeric:tabular-nums; }
.loc-cnh { border:none; background:none; padding:0; font-family:var(--font-body); font-size:12px; font-weight:500; cursor:pointer; white-space:nowrap; }
.loc-cnh.ok { color:var(--muted2); }
.loc-cnh.pend { color:var(--yellow); }
.loc-cnh:hover { text-decoration:underline; }
.loc-cnh-bloco { display:flex; align-items:center; justify-content:space-between; gap:14px; border-radius:12px; padding:12px 16px; margin-bottom:14px; }
.loc-cnh-bloco.pend { background:var(--yellow-bg); border:1px solid var(--yellow-border); }
.loc-cnh-bloco.ok { background:var(--green-bg); border:1px solid var(--green-border); }
.loc-cnh-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.loc-cnh-bloco.pend .loc-cnh-tit { color:var(--yellow); }
.loc-cnh-sub { font-size:12px; color:var(--muted2); margin-top:2px; }
.loc-cnh-bloco .btn { height:34px; padding:0 14px; font-size:12.5px; white-space:nowrap; }
.av-modal { max-width:520px; }
.av-quem { display:grid; grid-template-columns:1fr 1fr; gap:14px; padding:12px 14px; background:var(--bg2); border-radius:12px; margin-bottom:14px; }
.av-rot { font-size:11.5px; font-weight:600; color:var(--muted2); }
.av-val { font-size:14px; font-weight:600; color:var(--text); margin-top:2px; }
.av-nota { font-size:11.5px; color:var(--muted2); margin-top:2px; line-height:1.4; }
.av-linhas { border:1px solid var(--border2); border-radius:12px; overflow:hidden; }
.av-linha { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; border-bottom:1px solid var(--border); font-size:13.5px; color:var(--text2); }
.av-linha:last-child { border-bottom:none; }
.av-linha input[type=date] { width:auto; height:34px; }
.av-campo { display:inline-flex; align-items:center; gap:6px; }
.av-campo input { width:100px; height:34px; text-align:right; font-variant-numeric:tabular-nums; }
.av-prefixo { font-size:13px; color:var(--muted2); }
.av-num { font-variant-numeric:tabular-nums; font-weight:500; color:var(--text); }
.av-total { background:var(--bg2); font-weight:600; color:var(--text); }
.av-total .av-num { font-size:19px; font-weight:700; letter-spacing:-0.02em; }
.av-desc { font-size:12.5px; color:var(--text2); background:var(--bg2); border-radius:10px; padding:9px 12px; margin-top:4px; line-height:1.45; }
.av-info { font-size:12px; color:var(--muted); line-height:1.5; }
.av-erro { font-size:12.5px; color:var(--red); background:var(--red-bg); border-radius:10px; padding:9px 12px; margin-top:12px; }
.av-acoes { display:flex; justify-content:flex-end; gap:8px; }
.av-bloco-carregando { font-size:12.5px; color:var(--muted2); padding:6px 0; }
.av-vazio { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 14px; background:var(--bg2); border-radius:12px; }
.av-vazio-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.av-vazio-sub { font-size:12px; color:var(--muted); margin-top:2px; }
.av-vazio .btn,
.av-botoes .btn { height:34px; padding:0 14px; font-size:12.5px; white-space:nowrap; }
.av-estado { font-size:12.5px; color:var(--muted); padding:4px 0 8px; line-height:1.5; }
.av-estado.ok { color:var(--green); }
.av-estado.alerta { color:var(--yellow); }
.av-cab { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:8px; }
.av-cab-val { font-family:var(--font-numeric); font-size:22px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; }
.av-cab-sub { font-size:12px; color:var(--muted); margin-top:2px; }
.av-selo { font-size:11.5px; font-weight:600; border-radius:999px; padding:4px 10px; white-space:nowrap; }
.av-selo.ativo { background:color-mix(in srgb, var(--blue) 10%, transparent); color:var(--blue); }
.av-selo.pago { background:var(--green-bg); color:var(--green); }
.av-selo.aguardando_boleto,
.av-selo.erro { background:var(--yellow-bg); color:var(--yellow); }
.av-copiar { display:flex; align-items:center; gap:10px; background:var(--bg2); border-radius:10px; padding:8px 10px; margin-bottom:6px; }
.av-copiar .av-rot { flex-shrink:0; width:108px; }
.av-copiar code { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11.5px; color:var(--text2); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.av-copiar button { flex-shrink:0; border:none; background:var(--accent); color:var(--on-accent); border-radius:7px; padding:5px 11px; font-family:var(--font-body); font-size:12px; font-weight:600; cursor:pointer; transition:transform .1s ease-out; }
.av-copiar button:active { transform:scale(.96); }
.av-botoes { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.av-perigo { color:var(--red) !important; }
.av-recebido { margin-top:10px; padding:12px 14px; border:1px solid var(--border2); border-radius:12px; }
.av-recebido-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.av-recebido-sub { font-size:12px; color:var(--muted); margin:2px 0 10px; }
.av-recebido-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.loc-avulsa { font-size:12px; font-weight:500; color:var(--blue); white-space:nowrap; }
.loc-avulsa.vencida { color:var(--red); }
.loc-atraso { font-size:12px; font-weight:500; color:var(--red); white-space:nowrap; font-variant-numeric:tabular-nums; }
.loc-av-bloco { border:1px solid color-mix(in srgb, var(--blue) 25%, transparent); background:color-mix(in srgb, var(--blue) 4%, transparent); border-radius:12px; padding:12px 14px; margin-bottom:14px; }
.loc-av-tit { display:flex; justify-content:space-between; font-size:13.5px; font-weight:700; color:var(--text); margin-bottom:6px; font-family:var(--font-display); }
.loc-av-tit span { font-variant-numeric:tabular-nums; }
.loc-av-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 0; border-top:1px solid var(--border); }
.loc-av-desc { font-size:12.5px; color:var(--text); line-height:1.4; }
.loc-av-sub { font-size:11.5px; color:var(--muted); margin-top:2px; }
.loc-av-acoes { display:flex; gap:6px; flex-shrink:0; }
.loc-av-acoes .btn { height:30px; padding:0 10px; font-size:12px; }
.av-modal { display:flex; flex-direction:column; overflow:hidden; max-height:calc(100dvh - 32px); }
.av-corpo { flex:1 1 auto; min-height:0; overflow-y:auto; margin:0 -4px; padding:0 4px; }
.av-acoes { flex-shrink:0; border-top:1px solid var(--border2); margin-top:14px; padding-top:14px; }
.av-linha label { margin:0; font-size:13.5px; color:var(--text2); font-weight:400; }
.av-info { margin-top:10px; }
.av-link { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; border-radius:12px; background:color-mix(in srgb, var(--accent) 6%, transparent); border:1px solid color-mix(in srgb, var(--accent) 18%, transparent); margin:4px 0 8px; }
.av-link-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.av-link-sub { font-size:12px; color:var(--muted); margin-top:2px; }
.av-link .btn { height:34px; padding:0 14px; font-size:12.5px; white-space:nowrap; }
.loc-uso-sub { font-size:12.5px; color:var(--muted2); }
.loc-uso-btn { margin-left:auto; height:38px; padding:0 16px; font-size:13px; }
.acordo { margin-top:12px; border:1px solid var(--border2); border-radius:12px; padding:14px; background:var(--card); }
.acordo-tit { font-size:14px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.acordo-sub { font-size:12px; color:var(--muted); margin:2px 0 12px; line-height:1.45; }
.acordo-lista { display:flex; flex-direction:column; gap:6px; }
.acordo-item { display:grid; grid-template-columns:auto auto 1fr auto; align-items:center; gap:10px; padding:9px 12px; border-radius:10px; background:var(--bg2); cursor:pointer; margin:0; transition:opacity .15s; }
.acordo-item input { width:17px; height:17px; margin:0; }
.acordo-item.fora { opacity:.72; }
.acordo-sem { font-size:13px; font-weight:600; color:var(--text); }
.acordo-venc { font-size:11.5px; color:var(--muted2); }
.acordo-val { font-size:13px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; text-align:right; }
.acordo-item.fora .acordo-val { text-decoration:line-through; color:var(--muted2); }
.acordo-depois { grid-column:2 / -1; font-size:11px; font-weight:600; color:var(--yellow); }
.acordo-multa { display:flex; align-items:center; gap:8px; margin:12px 0 0; font-size:12.5px; color:var(--text2); cursor:pointer; }
.acordo-multa input { width:16px; height:16px; margin:0; }
.acordo-total { margin-top:12px; padding-top:12px; border-top:1px solid var(--border2); }
.acordo-total > div:first-child { display:flex; justify-content:space-between; align-items:baseline; }
.acordo-total span { font-size:13px; font-weight:600; color:var(--text); }
.acordo-total b { font-family:var(--font-numeric); font-size:22px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; }
.acordo-fora { font-size:12px; color:var(--yellow); margin-top:4px; }
.acordo-acoes { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.acordo-acoes .btn { height:34px; padding:0 14px; font-size:12.5px; }
.acr-bloco { margin:0 0 20px; }
.acr-campos { margin-top:12px; }
.acr-nota { font-size:12px; color:var(--muted2); margin-top:8px; }
.acr-nota.alerta { color:var(--yellow); font-weight:600; }
.acr-vivo-cab { display:flex; justify-content:space-between; align-items:flex-start; gap:4px 12px; flex-wrap:wrap; }
.acr-bloco .acordo-acoes { flex-wrap:wrap; }
.acr-bloco .acordo-acoes .btn { white-space:nowrap; }
.acr-vivo-val { font-family:var(--font-numeric); font-size:22px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.acr-vivo-status { font-size:12.5px; color:var(--text2); margin-top:8px; }
.acr-vivo-status.alerta { color:var(--yellow); font-weight:600; }
.cons-acordo-selo { display:inline-block; margin-top:8px; font-size:11.5px; font-weight:600; color:var(--blue); background:color-mix(in srgb, var(--blue) 9%, transparent); border-radius:999px; padding:3px 10px; }
.acordo-aviso { font-size:12.5px; font-weight:500; color:var(--yellow); background:var(--yellow-bg); border-radius:8px; padding:8px 10px; margin-top:12px; text-align:left; }
.loc-cli { font-size:14px; font-weight:500; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:260px; }
.loc-dt { font-size:13px; color:var(--text2); font-variant-numeric:tabular-nums; white-space:nowrap; }
.loc-sinais { display:flex; flex-wrap:wrap; gap:4px 12px; margin-top:4px; }
.loc-sinais:empty { display:none; }
.loc-total { font-weight:600; color:var(--text); white-space:nowrap; }
.loc-deve { font-size:12px; font-weight:600; color:var(--red); margin-top:3px; font-variant-numeric:tabular-nums; }
.loc-aviso td { height:auto; padding:10px 16px; font-size:12.5px; color:var(--red); background:color-mix(in srgb, var(--red) 5%, transparent); }
.loc-aviso button { border:none; background:none; padding:0; margin-left:8px; font:inherit; font-weight:600; color:var(--accent); cursor:pointer; }
.loc-hist-data { display:inline-flex; align-items:center; gap:8px; margin:0; font-size:12.5px; font-weight:500; color:var(--muted); }
.loc-hist-data input { height:38px; padding:0 10px; color:var(--text); font-size:13px; }

/* ═════ Módulo: Uso interno (ui-*) ═════ */
.ui-motivo { max-width:200px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ui-modal { width:min(560px, calc(100vw - 32px)); }
.ui-modal [hidden] { display:none !important; }
.ui-opc { font-weight:400; color:var(--muted2); }
.ui-link { margin-top:12px; padding:0; border:none; background:none; font:inherit; font-size:12.5px; font-weight:500; color:var(--accent); cursor:pointer; }
.ui-link:hover { text-decoration:underline; }
.ui-resumo { background:var(--bg2); border-radius:12px; padding:12px 14px; margin-bottom:4px; }
.ui-resumo-tit { font-size:14px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.ui-resumo-sub { font-size:12.5px; color:var(--muted); margin-top:2px; }
.ui-fotos { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; margin-top:8px; }
.ui-fotos:empty { display:none; }
.ui-fotos img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:8px; border:1px solid var(--border2); display:block; }
.ui-vist-reg { padding:10px 0; border-top:1px solid var(--border); }
.ui-vist-tit { font-size:13px; font-weight:600; color:var(--text); }
.ui-vist-obs { font-size:12.5px; color:var(--text2); margin-top:4px; white-space:pre-wrap; }
.ui-excluir { margin-right:auto; }

/* ═════ Módulo: Frota e modal do veículo (frota-*, ev-*, vd-*, mnv-*, hv-*) ═════ */
.ev-modal { width:900px; max-width:calc(100vw - 48px); padding:26px 30px 22px; }
.ev-head { align-items:flex-start; margin-bottom:16px; }
.ev-titulo { font-size:18px; font-weight:700; line-height:1.2; color:var(--text); font-family:var(--font-display); }
.ev-sub { font-size:13px; color:var(--muted2); margin-top:3px; font-variant-numeric:tabular-nums; }
.ev-abas { display:flex; width:100%; margin-bottom:18px; }
.ev-abas .seg-btn { flex:1; padding:8px; font-size:13px; }
.ev-painel#ev-painel-despesas { max-height:66vh; overflow-y:auto; padding:2px; }
.vd-resumo { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:22px; }
.vd-kpi { background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:13px 15px; min-width:0; box-shadow:var(--shadow-sm); }
.vd-kpi.alerta { background:var(--red-bg); border-color:var(--red-border); }
.vd-kpi.alerta .vd-kpi-val { color:var(--red); }
.vd-kpi-lbl { font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.8px; color:var(--muted); margin-bottom:8px; }
.vd-kpi-val { font-family:var(--font-numeric); font-size:20px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vd-kpi-sub { font-size:11.5px; color:var(--muted2); margin-top:3px; }
.vd-sec-tit { font-size:13px; font-weight:700; color:var(--text); margin-bottom:10px; display:flex; align-items:center; gap:7px; font-family:var(--font-display); }
.vd-sec-tit span { font-size:11.5px; font-weight:600; color:var(--muted2); background:var(--bg2); border-radius:999px; padding:1px 8px; font-variant-numeric:tabular-nums; }
.vd-lancar { margin-bottom:24px; }
.vd-atalhos { display:flex; flex-wrap:wrap; gap:8px; }
.vd-atalho { border:1px solid var(--border2); background:var(--card); border-radius:999px; padding:8px 16px; font-family:var(--font-body); font-size:13px; font-weight:500; color:var(--text); cursor:pointer; transition:border-color .15s, background .15s, color .15s; }
.vd-atalho::before { content:'+ '; color:var(--muted2); }
.vd-atalho:hover { border-color:var(--accent); color:var(--accent2); background:var(--accent-light); }
.vd-atalho:active { transform:scale(.97); transition:transform 100ms ease-out; }
.vd-sec { margin-bottom:22px; }
.vd-lista { border:1px solid var(--border2); border-radius:12px; overflow:hidden; }
.vd-linha { display:grid; grid-template-columns:86px minmax(0,1fr) auto 84px; gap:14px; align-items:center; padding:11px 14px; border-top:1px solid var(--border); cursor:pointer; transition:background .12s; }
.vd-linha:first-child { border-top:none; }
.vd-linha:hover { background:var(--bg2); }
.vd-linha.atrasada .vd-data { color:var(--red); font-weight:600; }
.vd-data { font-size:12.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.vd-desc { min-width:0; }
.vd-desc-txt { font-size:13.5px; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vd-meta { font-size:11.5px; color:var(--muted2); margin-top:1px; }
.vd-meta b { color:var(--red); font-weight:600; }
.vd-valor { text-align:right; font-size:13.5px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.vd-parte { font-size:11px; font-weight:400; color:var(--muted2); margin-top:1px; }
.vd-acao { text-align:right; }
.vd-pagar { height:30px; padding:0 12px; font-size:12px; }
.vd-pago { font-size:12px; font-weight:600; color:var(--green); }
.vd-vazio { font-size:13px; color:var(--muted2); padding:16px; background:var(--bg2); border-radius:12px; line-height:1.5; }
.vd-erro { color:var(--red); background:var(--red-bg); }
@media (prefers-reduced-motion: reduce) {
  .vd-atalho:active { transform:none; }
}
.ev-modal .ev-painel > .form-section-title:first-of-type,
.ev-modal #ev-painel-cadastro > .form-section-title:first-of-type { margin-top:4px; }
.ev-modal .form-grid { gap:14px 16px; }
.ev-modal input[type="text"],
.ev-modal input[type="number"],
.ev-modal input[type="date"],
.ev-modal select,
.ev-modal textarea { font-family:var(--font-body); font-size:14px; color:var(--text); }
.ev-modal input[type="text"],
.ev-modal input[type="number"],
.ev-modal input[type="date"],
.ev-modal select { height:42px; padding:0 13px; }
.ev-modal textarea { padding:11px 13px; line-height:1.5; }
.ev-modal .modal-footer { margin-top:22px; padding-top:18px; border-top:1px solid var(--border); }
.ev-modal .modal-footer .btn { height:40px; padding:0 20px; font-size:13.5px; }
.vd-seguro-status { font-size:12px; font-weight:600; color:var(--muted2); padding:3px 10px; border-radius:999px; background:var(--card); }
.vd-seguro-status.ok { color:var(--green); background:var(--green-bg); }
.vd-seguro-status.alerta { color:var(--yellow); background:var(--yellow-bg); }
.vd-seguro-status.vencida { color:var(--red); background:var(--red-bg); }
.vd-lancar { margin-top:4px; }
.frota-barra { display:flex; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.frota-busca { position:relative; flex:1 1 240px; max-width:340px; }
.frota-busca svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--muted2); pointer-events:none; }
.frota-busca input { width:100%; height:38px; padding:0 12px 0 36px; font-family:var(--font-body); font-size:13.5px; color:var(--text); }
.frota-seg { flex:0 1 auto; overflow-x:auto; scrollbar-width:none; }
.frota-seg::-webkit-scrollbar { display:none; }
.frota-seg .seg-btn { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; padding:7px 12px; font-size:12.5px; }
.frota-seg-n { font-size:11.5px; font-weight:600; color:var(--muted2); font-variant-numeric:tabular-nums; }
.frota-seg .seg-btn.active .frota-seg-n,
.frota-seg .seg-btn:hover .frota-seg-n { color:var(--on-accent); opacity:.85; }
.frota-fotos { margin-left:auto; height:38px; display:inline-flex; align-items:center; gap:6px; font-size:13px; white-space:nowrap; }
.frota-card { padding:0; overflow:hidden; flex-shrink:0; }
.frota-tabela { width:100%; border-collapse:collapse; }
.frota-tabela th { padding:12px 16px; height:40px; }
.frota-tabela th.num,
.frota-tabela td.num { text-align:right; font-variant-numeric:tabular-nums; }
.frota-tabela td { padding:10px 16px; height:66px; border-bottom:1px solid var(--border); font-size:13.5px; color:var(--text2); }
.frota-tabela tr:last-child td { border-bottom:none; }
.frota-linha.clicavel { cursor:pointer; transition:background .12s; }
.frota-linha.clicavel:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; background:var(--bg2); }
.frota-linha.clicavel:active { background:var(--bg3); }
.frota-linha.vendido .frota-nome,
.frota-linha.vendido .frota-foto { opacity:.55; }
.frota-veic { display:flex; align-items:center; gap:14px; min-width:0; }
.frota-foto { width:64px; height:42px; flex-shrink:0; border-radius:9px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.frota-foto img { width:100%; height:100%; object-fit:contain; }
.frota-foto-vazia { background:var(--bg2); color:var(--muted2); }
.frota-foto-vazia svg { width:30px; height:auto; }
.frota-veic-txt { min-width:0; }
.frota-nome { font-size:14px; font-weight:600; color:var(--text); letter-spacing:-0.006em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.frota-det { font-size:12px; color:var(--muted2); margin-top:2px; }
.frota-placa { font-size:13px; font-weight:500; letter-spacing:.06em; color:var(--text2); font-variant-numeric:tabular-nums; }
.frota-un { color:var(--muted2); font-size:12px; }
.frota-diaria { font-weight:600; color:var(--text); }
.frota-vazio { color:var(--muted2); }
.frota-inv { font-size:12px; font-weight:500; color:var(--purple); background:color-mix(in srgb, var(--purple) 8%, transparent); border-radius:99px; padding:3px 8px; }
.frota-status { display:inline-flex; align-items:center; gap:7px; font-size:13px; font-weight:500; color:var(--text2); white-space:nowrap; }
.frota-status i { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.frota-col-acoes { width:112px; }
.frota-acoes { display:flex; align-items:center; justify-content:flex-end; gap:2px; }
.frota-ico { width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; border:none; background:none; border-radius:8px; color:var(--muted2); cursor:pointer; opacity:0; transition:opacity .15s, background .15s, color .15s; }
.frota-ico svg { width:15px; height:15px; }
.frota-linha:hover .frota-ico,
.frota-linha:focus-within .frota-ico { opacity:1; }
.frota-ico:hover { background:var(--card); color:var(--text); box-shadow:0 0 0 1px var(--border2); }
.frota-ico.perigo:hover { color:var(--red); background:var(--red-bg); box-shadow:none; }
.frota-ico:focus-visible { opacity:1; outline:2px solid var(--accent); outline-offset:1px; }
.frota-chevron { color:var(--muted2); margin-left:6px; transition:transform .15s, color .15s; }
.frota-linha:hover .frota-chevron { color:var(--muted2); transform:translateX(2px); }
.frota-vazia td { height:auto; padding:48px 16px; text-align:center; color:var(--muted2); font-size:13.5px; }
@media (hover:none) {
  .frota-ico { opacity:1; }
}
@media (prefers-reduced-motion: reduce) {
  .frota-chevron,
  .frota-ico,
  .frota-linha { transition:none; }
}
.vd-linha.vd-multa { grid-template-columns:86px minmax(0,1fr) auto 190px; cursor:default; }
.vd-linha.vd-multa:hover { background:transparent; }
.vd-acao-larga { text-align:right; }
.vd-lancar-multa { height:30px; padding:0 12px; font-size:12px; white-space:nowrap; }
.vd-multa-link { border:none; background:color-mix(in srgb, var(--accent) 9%, transparent); color:var(--accent2); font-family:var(--font-body); font-size:12px; font-weight:600; padding:5px 11px; border-radius:999px; cursor:pointer; }
.vd-multa-link:hover { background:color-mix(in srgb, var(--accent) 16%, transparent); }
.vd-multa-link.pago { background:var(--green-bg); color:var(--green); }
.vd-multa-obs { font-size:12px; color:var(--muted2); }
.vd-dup { font-size:10.5px; font-weight:600; color:var(--yellow); background:var(--yellow-bg); border-radius:99px; padding:1px 6px; margin-left:6px; vertical-align:1px; }
.vd-sec-nota { font-style:normal; font-size:12px; font-weight:500; color:var(--yellow); margin-left:4px; }
.vd-rodape-nota { font-size:12px; color:var(--muted2); line-height:1.5; margin-top:8px; }
.vd-seguro-remover { border:none; background:none; font-family:var(--font-body); font-size:12.5px; font-weight:600; color:var(--red); padding:0 10px; height:34px; border-radius:8px; cursor:pointer; }
.vd-seguro-remover:hover { background:var(--red-bg); }
.ev-modal .form-section-title.ev-seg-tit { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ev-seg-rodape { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:12px; font-size:12px; color:var(--muted2); }
.ev-seg-rodape a { color:var(--accent2); font-weight:600; text-decoration:none; }
.ev-seg-rodape a:hover { text-decoration:underline; }
.ev-painel#ev-painel-manutencao,
.ev-painel#ev-painel-historico { max-height:66vh; overflow-y:auto; padding:2px; }
.mnv-plano { border-radius:12px; padding:16px; background:var(--bg2); border:1px solid transparent; margin-bottom:18px; }
.mnv-plano.vencida { background:var(--red-bg); border-color:var(--red-border); }
.mnv-plano.proxima { background:var(--yellow-bg); border-color:var(--yellow-border); }
.mnv-plano-num { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.mnv-num { font-family:var(--font-numeric); font-size:22px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; margin-top:2px; }
.mnv-falta { font-size:14px; font-weight:600; color:var(--text); margin-top:14px; }
.mnv-plano.vencida .mnv-falta { color:var(--red); }
.mnv-plano.proxima .mnv-falta { color:var(--yellow); }
.mnv-barra { width:100%; height:6px; margin-top:8px; }
.mnv-acoes { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.mnv-acoes .btn,
.mnv-cab .btn { height:34px; padding:0 14px; font-size:12.5px; }
.mnv-cab { display:flex; align-items:center; justify-content:space-between; font-size:15px; font-weight:600; color:var(--text); margin-bottom:8px; }
.mnv-grupo { font-size:12px; font-weight:600; color:var(--muted2); margin:14px 0 6px; }
.mnv-grupo span { font-weight:400; }
.mnv-item { display:grid; grid-template-columns:92px 1fr auto; align-items:center; gap:12px; width:100%; text-align:left; background:var(--card); border:1px solid var(--border2); border-radius:10px; padding:10px 12px; margin-bottom:6px; cursor:pointer; font-family:var(--font-body); transition:border-color .12s, transform .1s ease-out; }
.mnv-item:hover { border-color:color-mix(in srgb, var(--accent) 35%, transparent); }
.mnv-item:active { transform:scale(.995); }
.mnv-quando { font-size:12.5px; color:var(--text2); font-variant-numeric:tabular-nums; }
.mnv-meio { display:flex; flex-direction:column; min-width:0; }
.mnv-meio .mn-sub { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mnv-dir { display:flex; align-items:center; gap:10px; }
.mnv-custo { font-size:13px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; }
.hv-resumo { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:18px; }
.hv-resumo > div { background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:12px 14px; box-shadow:var(--shadow-sm); }
.hv-resumo .mnv-num { font-size:19px; }
.hv-linha { position:relative; padding-left:4px; }
.hv-linha::before { content:''; position:absolute; left:109px; top:8px; bottom:8px; width:2px; background:var(--border2); border-radius:1px; }
.hv-evento { position:relative; display:grid; grid-template-columns:96px 1fr; gap:22px; padding:8px 0; }
.hv-evento[role=button] { cursor:pointer; border-radius:8px; }
.hv-evento[role=button]:hover .hv-tit { color:var(--accent); }
.hv-evento[role=button]:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.hv-ponto { position:absolute; left:101px; top:14px; width:12px; height:12px; border-radius:50%; background:var(--card); border:3px solid var(--border2); }
.hv-evento.loc .hv-ponto { border-color:var(--blue); }
.hv-evento.loc.ativa .hv-ponto { border-color:var(--green); background:var(--green); }
.hv-evento.loc.retomada .hv-ponto { border-color:var(--red); }
.hv-evento.man .hv-ponto { border-color:var(--yellow); }
.hv-evento.man.agendada .hv-ponto { border-style:dashed; }
.hv-evento.mul .hv-ponto { border-color:var(--red); }
.hv-data { font-size:12.5px; color:var(--text2); font-variant-numeric:tabular-nums; text-align:right; padding-top:1px; }
.hv-data span { display:block; font-size:10.5px; font-weight:600; color:var(--muted2); text-transform:uppercase; letter-spacing:.04em; margin-top:2px; }
.hv-tit { font-size:13.5px; font-weight:600; color:var(--text); transition:color .12s; }
.hv-sub { font-size:12px; color:var(--muted); margin-top:2px; line-height:1.45; }
.hv-sub b { color:var(--text); font-weight:600; }
.hv-tag { font-size:10.5px; font-weight:600; color:var(--blue); background:color-mix(in srgb, var(--blue) 10%, transparent); border-radius:999px; padding:2px 7px; margin-left:4px; }
.frota-rev { font-size:10.5px; font-weight:600; margin-top:3px; white-space:nowrap; }
.frota-rev.proxima { color:var(--yellow); }
.frota-rev.vencida { color:var(--red); }
.hv-evento.ui .hv-ponto { border-color:var(--muted); }
.hv-evento.ui.ativa .hv-ponto { background:var(--muted); }

/* ═════ Módulo: Manutenções (mn-*) ═════ */
.mn-veic-nome,
.mn-servico { font-size:13px; font-weight:500; color:var(--text); }
.mn-placa,
.mn-sub { font-size:11.5px; color:var(--muted2); }
.mn-sem { font-size:12px; color:var(--muted2); }
.mn-data { font-size:13px; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mn-falta { font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; }
.mn-falta.ok { color:var(--text2); font-weight:500; }
.mn-falta.proxima { color:var(--yellow); }
.mn-falta.vencida { color:var(--red); }
.mn-barra { width:120px; height:5px; border-radius:3px; background:var(--bg3); margin-top:5px; overflow:hidden; }
.mn-barra span { display:block; height:100%; border-radius:3px; background:var(--green); }
.mn-barra span.proxima { background:var(--yellow); }
.mn-barra span.vencida { background:var(--red); }
.mn-acoes { text-align:right; white-space:nowrap; }
.mn-btn { border:1.5px solid var(--border2); background:transparent; color:var(--muted); border-radius:8px; padding:5px 10px; margin-left:4px; font-family:var(--font-body); font-size:12px; font-weight:600; cursor:pointer; transition:all .15s; }
.mn-btn:hover { color:var(--text); background:var(--accent-light); }
.mn-btn:active { transform:scale(.97); }
.mn-btn.prim { background:var(--accent); border-color:var(--accent); color:var(--on-accent); }
.mn-btn.prim:hover { background:var(--accent2); border-color:var(--accent2); color:var(--on-accent); }
.mn-linha[tabindex] { cursor:pointer; }
.mn-linha:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.mn-status { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--text); white-space:nowrap; }
.mn-status-ponto { width:8px; height:8px; border-radius:50%; background:var(--muted2); }
.mn-status.agendada .mn-status-ponto { background:var(--blue); }
.mn-status.em_andamento .mn-status-ponto { background:var(--yellow); }
.mn-status.concluida .mn-status-ponto { background:var(--green); }
.mn-fin { font-size:11.5px; font-weight:600; border-radius:999px; padding:3px 9px; white-space:nowrap; }
.mn-fin.ok { background:var(--green-bg); color:var(--green); }
.mn-fin.pend { background:var(--yellow-bg); color:var(--yellow); }
.mn-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; }
.mn-campo { display:flex; flex-direction:column; gap:5px; min-width:0; }
.mn-campo label { margin:0; font-size:12px; font-weight:600; color:var(--muted2); }
.mn-campo input,
.mn-campo select,
.mn-campo textarea { width:100%; }
.mn-full { grid-column:1/-1; }
.mn-custo { width:100%; }
.mn-custo input { text-align:left; }
.mn-proxima { margin-top:16px; padding:14px; border-radius:12px; background:color-mix(in srgb, var(--accent) 5%, transparent); border:1px solid color-mix(in srgb, var(--accent) 18%, transparent); }
.mn-proxima-cab { display:flex; align-items:flex-start; gap:10px; margin:0 0 12px; cursor:pointer; }
.mn-proxima-cab input { width:17px; height:17px; margin-top:2px; }
.mn-proxima-cab b { display:block; font-size:13.5px; color:var(--text); }
.mn-proxima-cab small { display:block; font-size:12px; color:var(--muted); font-weight:400; }
.mn-fin-info { font-size:12.5px; color:var(--muted); background:var(--bg2); border-radius:10px; padding:10px 12px; }
.mn-fin-bloco { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; border-radius:12px; padding:12px 14px; }
.mn-fin-bloco.ok { background:var(--green-bg); border:1px solid var(--green-border); }
.mn-fin-bloco.pend { background:var(--yellow-bg); border:1px solid var(--yellow-border); }
.mn-fin-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.mn-fin-sub { font-size:12px; color:var(--muted); margin-top:2px; }
.mn-fin-acoes { display:flex; gap:8px; flex-wrap:wrap; }
.mn-fin-bloco .btn { height:34px; padding:0 14px; font-size:12.5px; white-space:nowrap; }
.mn-cand-tit { font-size:12px; font-weight:600; color:var(--muted2); margin:12px 0 6px; }
.mn-cand { display:flex; width:100%; justify-content:space-between; align-items:center; gap:12px; text-align:left; border:1px solid var(--border2); background:var(--card); border-radius:10px; padding:9px 12px; margin-bottom:6px; cursor:pointer; font-family:var(--font-body); transition:border-color .12s, transform .1s ease-out; }
.mn-cand:hover { border-color:var(--accent); }
.mn-cand:active { transform:scale(.99); }
.mn-cand.igual { border-color:color-mix(in srgb, var(--green) 45%, transparent); }
.mn-cand-desc { display:block; font-size:13px; color:var(--text); }
.mn-cand-val { font-size:13px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.mn-cand-val small { display:block; font-size:10.5px; font-weight:600; color:var(--green); }
.mn-modal { max-width:760px; }
.mn-subtitulo { font-size:12.5px; color:var(--muted2); margin-top:2px; }
.mn-bloco { padding:14px 0 16px; border-bottom:1px solid var(--border); }
.mn-bloco:first-child { padding-top:4px; }
.mn-bloco:last-of-type { border-bottom:none; }
.mn-bloco-tit { font-size:13px; font-weight:700; color:var(--text); margin-bottom:12px; font-family:var(--font-display); }
.mn-grid-3 { grid-template-columns:repeat(3,1fr); }
.mn-span-2 { grid-column:span 2; }
.mn-span-3 { grid-column:1/-1; }
.mn-seg-wrap { margin-top:14px; }
.mn-rot { font-size:12px; font-weight:600; color:var(--muted2); margin-bottom:6px; }
.mn-seg { display:inline-flex; }
.mn-seg .seg-btn { padding:8px 16px; font-size:13px; }
.mn-cancelada-aviso { margin-top:8px; font-size:12px; color:var(--red); background:var(--red-bg); border-radius:8px; padding:7px 10px; }
.mn-switch { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:14px 0 4px; padding:12px 14px; border-radius:12px; background:var(--bg2); cursor:pointer; }
.mn-switch b { display:block; font-size:13.5px; color:var(--text); }
.mn-switch small { display:block; font-size:12px; color:var(--muted); font-weight:400; margin-top:2px; line-height:1.45; }
.mn-switch input { appearance:none; -webkit-appearance:none; flex-shrink:0; width:44px; height:26px; margin:0; border-radius:13px; background:var(--muted2); position:relative; cursor:pointer; transition:background .2s; }
.mn-switch input::after { content:''; position:absolute; top:2px; left:2px; width:22px; height:22px; border-radius:50%; background:var(--on-accent); box-shadow:var(--shadow-sm); transition:transform .22s cubic-bezier(.3,.7,.4,1); }
.mn-switch input:checked { background:var(--accent); }
.mn-switch input:checked::after { transform:translateX(18px); }
.mn-switch input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.mn-acoes-rodape { justify-content:space-between; }
.mn-acoes-esq,
.mn-acoes-dir { display:flex; gap:8px; }
.mn-perigo { color:var(--red) !important; }
@media (prefers-reduced-motion: reduce) {
  .mn-switch input,
  .mn-switch input::after { transition:none; }
}
.mn-modal { width:min(760px, calc(100vw - 32px)); }
.mn-custo { display:flex; align-items:center; min-width:0; }
.mn-custo input { min-width:0; width:100%; flex:1 1 auto; }
.mn-bloco-tit + .ui-vist-reg { border-top:none; padding-top:0; }

/* ═════ Módulo: Multas (mt-*, mtd-*) ═════ */
.mt-auto-check { margin-top:6px; font-size:12px; line-height:1.5; padding:8px 10px; border-radius:8px; background:var(--bg2); color:var(--muted2); }
.mt-auto-check.ok { color:var(--green); background:var(--green-bg); }
.mt-auto-check.dup { color:var(--red); background:var(--red-bg); }
.mt-auto-abrir { display:inline-block; margin-top:6px; border:1px solid color-mix(in srgb, var(--red) 35%, transparent); background:var(--card); color:var(--red); font-family:var(--font-body); font-size:12px; font-weight:600; padding:5px 10px; border-radius:7px; cursor:pointer; }
.mt-indicado-origem { font-size:12px; margin-top:6px; padding:6px 10px; border-radius:8px; }
.mt-indicado-origem.ok { color:var(--green); background:var(--green-bg); }
.mt-indicado-origem.pend { color:var(--yellow); background:var(--yellow-bg); }
.mt-resp-aviso { font-size:12px; color:var(--yellow); background:var(--yellow-bg); border-radius:8px; padding:7px 10px; margin-top:6px; }
.mtd-modal { display:flex; flex-direction:column; overflow:hidden; max-height:calc(100dvh - 32px); }
.mtd-modal #mtd-corpo { flex:1 1 auto; min-height:0; }
.mtd-rodape { flex-shrink:0; border-top:1px solid var(--border2); margin-top:8px; padding:14px 4px 0; }
.mtd-acoes { display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.mtd-perigo { color:var(--red) !important; }
.mtd-desabilitado { opacity:.45; }
.mtd-cancelar-tit { font-size:14px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.mtd-cancelar-sub { font-size:12px; color:var(--muted2); margin:2px 0 10px; }
.mtd-cancelar-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mtd-cancelar-grid select,
.mtd-cancelar-grid input { width:100%; }
.mtd-cancelar-aviso { margin-top:8px; font-size:12px; line-height:1.5; color:var(--yellow); background:var(--yellow-bg); border-radius:8px; padding:8px 10px; }
.mt-resumo { margin-bottom:18px; }
.mt-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.mt-kpi { position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left; background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:18px; cursor:pointer; font-family:var(--font-body); color:var(--text); box-shadow:var(--shadow-sm); transition:box-shadow .22s cubic-bezier(.2,.8,.2,1), transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s; }
.mt-kpi::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--accent); border-radius:12px 12px 0 0; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.mt-kpi:hover::before,
.mt-kpi.ativo::before { transform:scaleX(1); }
.mt-kpi:hover { border-color:var(--accent); box-shadow:var(--shadow-lg); transform:translateY(-3px); }
.mt-kpi:active { transform:translateY(-1px); transition-duration:.08s; }
.mt-kpi.ativo { border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.mt-kpi:focus-visible,
.mt-alerta:focus-visible,
.mt-cond:focus-visible,
.mt-linha:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.mt-kpi-lbl { font-size:10px; font-weight:600; color:var(--muted); letter-spacing:.8px; text-transform:uppercase; }
.mt-kpi-val { font-family:var(--font-numeric); font-size:30px; font-weight:800; line-height:1.1; color:var(--text); font-variant-numeric:tabular-nums; margin-top:6px; }
.mt-kpi-sub { font-size:12.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.mt-tip { position:absolute; left:12px; right:12px; top:calc(100% + 8px); z-index:30; pointer-events:none; background:var(--text); color:var(--bg); font-size:12px; font-weight:400; line-height:1.45; letter-spacing:0; text-align:left; border-radius:10px; padding:9px 11px; box-shadow:var(--shadow-lg); opacity:0; transform:translateY(-3px) scale(.98); transform-origin:top center; transition:opacity .14s ease, transform .14s ease; }
.mt-kpi:hover .mt-tip,
.mt-kpi:focus-visible .mt-tip,
.mt-alerta:hover .mt-tip,
.mt-alerta:focus-visible .mt-tip { opacity:1; transform:none; transition-delay:.35s; }
.mt-kpi:focus-visible .mt-tip,
.mt-alerta:focus-visible .mt-tip { transition-delay:0s; }
.mt-alertas { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:12px; }
.mt-aberto { font-size:12.5px; color:var(--muted); margin-right:6px; font-variant-numeric:tabular-nums; }
.mt-aberto b { color:var(--text); font-weight:600; }
.mt-alerta { position:relative; display:inline-flex; align-items:center; gap:7px; border:none; border-radius:999px; padding:6px 12px; font-family:var(--font-body); font-size:12.5px; font-weight:500; cursor:pointer; transition:filter .15s, transform .1s ease-out; }
.mt-alerta b { font-weight:600; font-variant-numeric:tabular-nums; }
.mt-alerta:active { transform:scale(.97); }
.mt-alerta:hover { filter:brightness(.96); }
.mt-alerta .mt-tip { left:0; right:auto; width:280px; }
.mt-alerta-ponto { width:7px; height:7px; border-radius:50%; background:currentColor; }
.mt-alerta.vermelho { background:var(--red-bg); color:var(--red); }
.mt-alerta.ambar { background:var(--yellow-bg); color:var(--yellow); }
.mt-alerta.cinza { background:var(--bg2); color:var(--muted); }
.mt-filtros { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; align-items:center; }
.mt-filtros select,
.mt-filtros input { height:38px; font-size:13px; }
.mt-limpar { border:none; background:none; color:var(--accent); font-family:var(--font-body); font-size:12.5px; font-weight:600; cursor:pointer; padding:0 6px; height:38px; }
.mt-tabela-card { padding:0; overflow-x:auto; border-radius:12px; }
.mt-tabela th { font-size:10px; font-weight:700; color:var(--muted2); letter-spacing:.8px; text-transform:uppercase; white-space:nowrap; }
.mt-tabela th.num,
.mt-tabela td.num { text-align:right; }
.mt-linha { cursor:pointer; transition:background .12s; }
.mt-linha:active { background:color-mix(in srgb, var(--accent) 6%, transparent); }
.mt-linha.cancelada td { opacity:.55; }
.mt-data { font-size:13px; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mt-hora { font-size:11.5px; color:var(--muted2); font-variant-numeric:tabular-nums; }
.mt-veic { display:flex; align-items:center; }
.mt-veic-nome { font-size:13px; font-weight:500; color:var(--text); }
.mt-placa { font-size:11px; color:var(--muted2); letter-spacing:.04em; }
.mt-cli { font-size:13px; color:var(--text); }
.mt-sem { font-size:12.5px; color:var(--muted2); }
.mt-infr { font-size:13px; color:var(--text); line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.mt-auto { font-size:11px; color:var(--muted2); margin-top:2px; font-variant-numeric:tabular-nums; }
.mt-valor { font-size:13px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap; }
.mt-venc-atrasado { color:var(--red); font-weight:600; }
.mt-status { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--text); white-space:nowrap; }
.mt-status-ponto { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.mt-status.cinza .mt-status-ponto { background:var(--muted2); }
.mt-status.azul .mt-status-ponto { background:var(--blue); }
.mt-status.ambar .mt-status-ponto { background:var(--yellow); }
.mt-status.roxo .mt-status-ponto { background:var(--purple); }
.mt-status.verde .mt-status-ponto { background:var(--green); }
.mt-status.vermelho { color:var(--red); font-weight:600; }
.mt-status.vermelho .mt-status-ponto { background:var(--red); }
.mt-cond { display:inline-flex; flex-direction:column; align-items:flex-start; border:none; border-radius:8px; padding:5px 10px; font-family:var(--font-body); font-size:12px; font-weight:600; cursor:pointer; white-space:nowrap; line-height:1.25; transition:filter .15s, transform .1s ease-out; }
.mt-cond small { font-size:10.5px; font-weight:500; opacity:.85; }
.mt-cond:active { transform:scale(.97); }
button.mt-cond:hover { filter:brightness(.95); }
.mt-cond.ok { background:var(--green-bg); color:var(--green); }
.mt-cond.pend { background:var(--yellow-bg); color:var(--yellow); }
.mt-cond.cnh { background:var(--yellow); color:var(--on-accent); }
.mt-cond.vazio { background:none; color:var(--muted2); font-weight:400; cursor:default; padding-left:0; }
.mt-cond-bloco { display:flex; align-items:center; justify-content:space-between; gap:14px; border-radius:12px; padding:12px 14px; margin-bottom:14px; }
.mt-cond-bloco.ok { background:var(--green-bg); border:1px solid var(--green-border); }
.mt-cond-bloco.pend { background:var(--yellow-bg); border:1px solid var(--yellow-border); }
.mt-cond-bloco.cnh { background:var(--yellow-bg); border:1px solid color-mix(in srgb, var(--yellow) 45%, transparent); }
.mt-cond-bloco.cinza { background:var(--bg2); }
.mt-cond-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.mt-cond-bloco.cnh .mt-cond-tit,
.mt-cond-bloco.pend .mt-cond-tit { color:var(--yellow); }
.mt-cond-sub { font-size:12px; color:var(--muted); margin-top:2px; line-height:1.45; }
.mt-cond-bloco .btn { white-space:nowrap; height:34px; padding:0 14px; font-size:12.5px; }
@media (prefers-reduced-motion: reduce) {
  .mt-kpi,
  .mt-alerta,
  .mt-cond,
  .mt-tip { transition:opacity .15s ease !important; transform:none !important; }
}
.mt-filtros select { flex:0 1 auto; width:auto; max-width:160px; min-width:0; }
.mt-filtros input[type=date] { flex:0 0 auto; width:128px; }
.mt-filtros input[type=search] { flex:1 1 140px; min-width:120px; }
.mt-veic-nome,
.mt-cli { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mt-infr { max-width:260px; }
.mt-tabela th,
.mt-tabela td { padding-left:10px; padding-right:10px; }
.mt-tabela th:first-child,
.mt-tabela td:first-child { padding-left:16px; }
.mt-tabela th:last-child,
.mt-tabela td:last-child { padding-right:16px; }
.mt-veic { gap:8px; }
.mt-veic .vi { width:32px; height:32px; flex-shrink:0; }
.mt-veic-nome { max-width:120px; }
.mt-infr { min-width:160px; }
.mt-cli { max-width:140px; }
.mt-uso-interno { font-size:12px; color:var(--text2); background:var(--bg2); border-radius:8px; padding:8px 10px; margin:6px 0 12px; line-height:1.45; }
.mt-uso-interno b { color:var(--text); font-weight:600; }

/* ═════ Módulo: Reservas (rs-*) ═════ */
.rs-modal { width:min(980px, calc(100vw - 32px)); max-width:none; display:flex; flex-direction:column; overflow:hidden; max-height:calc(100dvh - 32px); }
.rs-corpo { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; overflow:hidden; }
.rs-form { overflow-y:auto; min-height:0; padding-right:4px; }
.rs-cotacao { align-self:start; background:var(--bg2); border-radius:12px; padding:18px; display:flex; flex-direction:column; gap:12px; overflow-y:auto; max-height:100%; }
.rs-cot-tit { font-size:15px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.rs-cot-vazio { font-size:13px; color:var(--muted); line-height:1.5; padding:18px 0; }
.rs-cot-linha { display:flex; justify-content:space-between; gap:12px; font-size:13px; color:var(--text2); padding:5px 0; font-variant-numeric:tabular-nums; }
.rs-cot-linha.desc span:last-child { color:var(--green); }
.rs-cot-total { display:flex; justify-content:space-between; align-items:baseline; gap:12px; border-top:1px solid var(--border2); margin-top:6px; padding-top:10px; }
.rs-cot-total span:first-child { font-size:13px; font-weight:600; color:var(--text); }
.rs-cot-total span:last-child { font-family:var(--font-numeric); font-size:26px; font-weight:800; color:var(--text); font-variant-numeric:tabular-nums; }
.rs-cot-plano { font-size:11.5px; color:var(--muted2); }
.rs-desc-linha { display:flex; gap:8px; align-items:center; }
.rs-desc-linha input { flex:1; min-width:0; height:36px; text-align:right; font-variant-numeric:tabular-nums; }
.rs-desc-seg .seg-btn { padding:6px 12px; }
.rs-desc-nota { font-size:11.5px; color:var(--muted2); margin-top:4px; }
.rs-desc-nota.alerta { color:var(--yellow); font-weight:600; }
.rs-pago { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--border2); padding-top:12px; }
.rs-pago label { margin:0; font-size:13px; color:var(--text2); }
.rs-pago .av-campo { width:140px; }
.rs-restante { display:flex; justify-content:space-between; font-size:13px; color:var(--text2); }
.rs-restante:empty { display:none; }
.rs-restante b { font-variant-numeric:tabular-nums; color:var(--text); }
.rs-wpp { border:none; border-radius:12px; padding:12px 14px; background:var(--wa-green); color:var(--on-accent); font-family:var(--font-body); font-size:13.5px; font-weight:600; cursor:pointer; transition:transform .1s ease-out, opacity .15s; }
.rs-wpp:active:not(:disabled) { transform:scale(.98); }
.rs-wpp:disabled { opacity:.4; cursor:not-allowed; }
.rs-wpp-prev { font-size:13px; line-height:1.55; background:var(--wa-bubble); color:var(--wa-bubble-text); border-radius:10px; padding:10px 12px; text-align:left; max-height:320px; overflow-y:auto; }
.rs-periodo { font-size:12.5px; color:var(--muted); margin-top:8px; }
.rs-erro-txt { color:var(--red); font-weight:600; }
.rs-sub { font-size:11.5px; color:var(--muted2); margin-top:6px; }
.rs-tit-nota { font-size:11.5px; font-weight:600; margin-left:8px; }
.rs-tit-nota.ok { color:var(--green); }
.rs-tit-nota.volta { color:var(--blue); }
.rs-tit-nota.off { color:var(--red); }
.rs-combo { position:relative; }
.rs-combo-input { width:100%; height:42px; font-size:14px; }
.rs-combo-lista { position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:40; margin:0; padding:6px; list-style:none; max-height:300px; overflow-y:auto; background:var(--card); border:1px solid var(--border2); border-radius:12px; box-shadow:var(--shadow-lg); transform-origin:top center; animation:rsCombo .14s ease-out; }
.rs-combo-op { display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; column-gap:12px; padding:9px 10px; border-radius:8px; cursor:pointer; }
.rs-combo-op:hover,
.rs-combo-op.ativo { background:color-mix(in srgb, var(--accent) 7%, transparent); }
.rs-combo-op.sel .rs-op-tit { color:var(--accent); }
.rs-combo-op.off { cursor:not-allowed; }
.rs-combo-op.off .rs-op-tit,
.rs-combo-op.off .rs-op-sub { opacity:.5; }
.rs-op-tit { font-size:13.5px; font-weight:500; color:var(--text); }
.rs-op-sub { grid-column:1; font-size:11.5px; color:var(--muted2); }
.rs-op-selo { grid-column:2; grid-row:1 / span 2; align-self:center; font-size:11px; font-weight:600; border-radius:999px; padding:3px 9px; white-space:nowrap; }
.rs-op-selo.ok { background:var(--green-bg); color:var(--green); }
.rs-op-selo.volta { background:color-mix(in srgb, var(--blue) 10%, transparent); color:var(--blue); }
.rs-op-selo.off { background:var(--red-bg); color:var(--red); }
.rs-combo-vazio { padding:12px; font-size:12.5px; color:var(--muted2); }
.rs-planos .seg { display:inline-flex; flex-wrap:wrap; }
.rs-local-seg { display:inline-flex; }
.rs-local-seg .seg-btn { cursor:pointer; }
.rs-local-seg input { position:absolute; opacity:0; pointer-events:none; }
.rs-local-seg .seg-btn:has(input:checked) { background:var(--accent); color:var(--on-accent); border-color:var(--accent); font-weight:600; }
.rs-anexo { margin-top:12px; display:flex; align-items:baseline; gap:8px; padding:12px 14px; border:1.5px dashed var(--border2); border-radius:12px; cursor:pointer; transition:border-color .12s; }
.rs-anexo:hover { border-color:var(--accent); }
.rs-anexo span { font-size:13px; font-weight:500; color:var(--text2); }
.rs-anexo small { font-size:11.5px; color:var(--muted2); }
.rs-barra { display:flex; gap:10px; align-items:center; margin-bottom:12px; flex-wrap:wrap; }
.rs-barra input { flex:1 1 220px; max-width:360px; height:38px; font-size:13px; }
.rs-col-acoes { width:1%; white-space:nowrap; text-align:right; }
.rs-acoes { display:flex; gap:4px; justify-content:flex-end; }
@media (prefers-reduced-motion: reduce) {
  .rs-combo-lista { animation:none; }
}
.rs-cot-sep { border-top:1px solid var(--border2); margin-top:6px; padding-top:10px; color:var(--text); font-weight:500; }
.rs-periodo b { color:var(--text); font-weight:600; }
.rs-porque { color:var(--muted2); }

/* ═════ Módulo: Financeiro, análise e contas a pagar (fin-*, an-*, cp-*) ═════ */
/* KPIs: cada um é um .stat-card do Froteli (cartão, borda, sombra, faixa
   da marca no hover), em grade como .stats-grid. */
.fin-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; flex-shrink:0; margin-bottom:16px; }
.fin-kpi { background:var(--card); border:1px solid var(--border2); border-radius:12px; padding:18px; position:relative; overflow:hidden; min-width:0; box-shadow:var(--shadow-sm); transition:box-shadow .22s cubic-bezier(.2,.8,.2,1), transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s; }
.fin-kpi::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--accent); border-radius:12px 12px 0 0; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.fin-kpi:hover { box-shadow:var(--shadow-lg); transform:translateY(-3px); border-color:var(--accent); }
.fin-kpi:hover::before { transform:scaleX(1); }
.fin-kpi.destaque { border-color:var(--accent); }
.fin-kpi.destaque::before { transform:scaleX(1); }
.fin-kpi-lbl { display:flex; align-items:center; gap:7px; font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.8px; color:var(--muted); margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fin-kpi-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.fin-kpi-val { font-family:var(--font-numeric); font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; color:var(--text); line-height:1.1; }
.fin-kpi.destaque .fin-kpi-val { font-size:28px; }
.fin-kpi-val.neutro { color:var(--muted2); }
.fin-kpi-val.positivo { color:var(--green); }
.fin-kpi-val.negativo { color:var(--red); }
.fin-kpi-sub { font-size:11px; color:var(--muted2); margin-top:5px; font-variant-numeric:tabular-nums; }
.fin-abas { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:18px; flex-wrap:wrap; }
.fin-gfx { padding:18px 20px 14px; margin-bottom:18px; }
.fin-gfx-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.fin-gfx-tit { font-size:13.5px; font-weight:700; color:var(--text); font-family:var(--font-display); }
.fin-gfx-box { position:relative; height:210px; }
.fin-barra { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.fin-filtros { display:flex; align-items:center; background:var(--card); border:1px solid var(--border2); border-radius:10px; overflow:hidden; flex-wrap:wrap; }
.fin-filtros select,
.fin-filtros input[type="date"] { border:none; background:transparent; border-radius:0; padding:9px 30px 9px 13px; font-size:12.5px; color:var(--text); font-family:var(--font-body); cursor:pointer; border-left:1px solid var(--border); outline:none; }
.fin-filtros > :first-child { border-left:none; }
.fin-filtros select:hover,
.fin-filtros input[type="date"]:hover { background:var(--bg2); }
.fin-filtros select:focus,
.fin-filtros input[type="date"]:focus { background:var(--accent-light); }
.fin-filtros .sep { font-size:12px; color:var(--muted2); padding:0 8px; }
.fin-acoes { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.fin-acoes .btn { font-size:12.5px; padding:8px 14px; }
.fin-tabela th { padding:0 14px; height:44px; }
.fin-tabela td { padding:0 14px; height:54px; }
.fin-tabela .num { text-align:right; font-variant-numeric:tabular-nums; font-weight:600; white-space:nowrap; }
.fin-tabela th.num { text-align:right; }
.fin-tabela tbody tr:hover .fin-acao { opacity:1; }
.fin-tabela .col-desc { width:100%; max-width:0; }
.fin-desc { color:var(--text2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fin-tag { display:inline-flex; align-items:center; padding:3px 9px; border-radius:99px; font-size:11px; font-weight:600; white-space:nowrap; }
.fin-forma { display:inline-flex; padding:3px 8px; border-radius:99px; background:var(--bg3); color:var(--muted); font-size:11px; font-weight:500; border:1px solid var(--border2); }
.fin-auto { font-size:10.5px; color:var(--muted2); letter-spacing:.3px; }
.fin-acao { opacity:0; background:none; border:none; cursor:pointer; padding:5px; color:var(--muted2); border-radius:6px; transition:opacity .18s, color .15s, background .15s; display:inline-flex; }
.fin-acao:hover { color:var(--text); background:var(--bg3); }
.fin-acao.perigo:hover { color:var(--red); background:var(--red-bg); }
.fin-vazio { color:var(--muted2); }
.fin-kpis-3 { grid-template-columns:repeat(3,1fr); }
.fin-delta { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:600; }
.fin-delta.bom { color:var(--green); }
.fin-delta.ruim { color:var(--red); }
.fin-delta.mudo { color:var(--muted2); font-weight:500; }
.an-sec { margin-bottom:16px; }
.an-tit { font-size:13.5px; font-weight:700; color:var(--text); margin-bottom:14px; font-family:var(--font-display); }
.an-lbl { font-size:11.5px; color:var(--muted2); font-weight:500; }
.an-val { font-size:16px; font-weight:700; margin-top:3px; font-variant-numeric:tabular-nums; }
.an-carregando { color:var(--muted2); font-size:13px; padding:20px; }
.cp-seg { width:100%; }
.cp-seg .seg-btn { flex:1; }
.cp-rat-lista { display:flex; flex-direction:column; gap:6px; }
.cp-rat-linha { display:grid; grid-template-columns:minmax(0,1fr) 128px 30px; gap:6px; align-items:center; }
.cp-rat-linha select,
.cp-rat-linha input { width:100%; }
.cp-rat-linha input { text-align:right; font-variant-numeric:tabular-nums; }
.cp-rat-rm { border:none; background:none; cursor:pointer; color:var(--muted2); border-radius:7px; height:30px; display:flex; align-items:center; justify-content:center; transition:background .15s,color .15s; }
.cp-rat-rm:hover { background:var(--red-bg); color:var(--red); }
.cp-rat-add { margin-top:8px; border:1.5px dashed var(--border2); background:none; border-radius:8px; width:100%; padding:8px; font-family:var(--font-body); font-size:12.5px; font-weight:600; color:var(--muted); cursor:pointer; transition:border-color .15s,color .15s; }
.cp-rat-add:hover { border-color:var(--accent); color:var(--accent2); }
.cp-rat-status { margin-top:10px; padding:9px 12px; border-radius:9px; font-size:12.5px; display:flex; justify-content:space-between; gap:10px; font-variant-numeric:tabular-nums; background:var(--bg2); color:var(--muted); transition:background .2s,color .2s; }
.cp-rat-status.ok { background:var(--green-bg); color:var(--green); }
.cp-rat-status.erro { background:var(--yellow-bg); color:var(--yellow); }
.cp-rat-status b { font-weight:700; }
@media (prefers-reduced-motion: reduce) {
  .cp-rat-status { transition:none; }
}
.cp-modal { width:720px; max-width:calc(100vw - 48px); padding:28px 32px 24px; }
.cp-head { align-items:flex-start; margin-bottom:24px; }
.cp-titulo { font-size:18px; font-weight:700; line-height:1.2; color:var(--text); font-family:var(--font-display); }
.cp-campo { display:flex; flex-direction:column; gap:6px; min-width:0; }
.cp-campo > label { font-size:12.5px; font-weight:500; color:var(--muted); line-height:1.3; margin:0; }
.cp-modal input[type="text"],
.cp-modal input[type="date"],
.cp-modal input[type="month"],
.cp-modal input[type="number"],
.cp-modal select,
.cp-modal textarea { width:100%; box-sizing:border-box; font-family:var(--font-body); font-size:14px; color:var(--text); }
.cp-modal input[type="text"],
.cp-modal input[type="date"],
.cp-modal input[type="month"],
.cp-modal input[type="number"],
.cp-modal select { height:42px; padding:0 13px; }
.cp-modal textarea { padding:11px 13px; resize:vertical; line-height:1.5; min-height:64px; }
.cp-hero { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:16px; align-items:end; margin-bottom:8px; }
.cp-valor-box { display:flex; align-items:baseline; gap:6px; background:var(--bg3); border-radius:8px; padding:0 14px; height:52px; border:1.5px solid var(--border2); transition:border-color .15s, box-shadow .15s; }
.cp-valor-box:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); }
.cp-valor-box span { font-size:15px; font-weight:600; color:var(--muted2); align-self:center; }
.cp-modal .cp-valor-box input { font-family:var(--font-numeric); height:48px; padding:0; background:transparent; border:none; box-shadow:none; font-size:25px; font-weight:800; font-variant-numeric:tabular-nums; }
.cp-grupo { margin-top:24px; padding-top:20px; border-top:1px solid var(--border); }
.cp-grupo-leve { padding-top:4px; border-top:none; margin-top:14px; }
.cp-grupo-tit { font-size:13px; font-weight:700; color:var(--text); margin-bottom:12px; font-family:var(--font-display); }
.cp-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 16px; }
.cp-sub-campo { margin-top:12px; }
.cp-ajuda { font-size:12px; color:var(--muted2); line-height:1.45; margin-top:2px; }
.cp-fatura { margin-top:4px; }
.cp-fatura .cp-ajuda { margin-top:10px; }
.cp-switch { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:14px; padding:12px 14px; background:var(--bg2); border-radius:12px; cursor:pointer; user-select:none; }
.cp-switch-txt { font-size:13.5px; font-weight:500; color:var(--text); line-height:1.35; }
.cp-switch-txt small { display:block; font-size:12px; font-weight:400; color:var(--muted2); margin-top:1px; }
.cp-switch input { appearance:none; -webkit-appearance:none; flex-shrink:0; width:44px; height:26px; margin:0; border-radius:13px; background:var(--muted2); position:relative; cursor:pointer; transition:background .2s; }
.cp-switch input::after { content:''; position:absolute; top:2px; left:2px; width:22px; height:22px; border-radius:50%; background:var(--on-accent); box-shadow:var(--shadow-sm); transition:transform .22s cubic-bezier(.3,.7,.4,1); }
.cp-switch input:checked { background:var(--accent); }
.cp-switch input:checked::after { transform:translateX(18px); }
.cp-switch input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.cp-modal .cp-seg { display:flex; width:100%; }
.cp-modal .cp-seg .seg-btn { flex:1; padding:9px 10px; font-size:13px; }
.cp-rat-add::before { content:'+ '; }
.cp-modal .cp-rat-linha select,
.cp-modal .cp-rat-linha input { height:40px; }
.cp-footer { margin-top:28px; padding-top:20px; border-top:1px solid var(--border); }
.cp-footer .btn { height:40px; padding:0 20px; font-size:13.5px; }
.cp-footer .btn:active { transform:scale(.97); transition:transform 100ms ease-out; }
@media (prefers-reduced-motion: reduce) {
  .cp-switch input,
  .cp-switch input::after,
  .cp-footer .btn:active { transition:none; }
}
tr.cp-previsto td { color:var(--muted2) !important; font-style:italic; background:repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in srgb, var(--muted2) 5%, transparent) 10px 20px); }
tr.cp-previsto:hover td { background:color-mix(in srgb, var(--muted2) 7%, transparent); }
.cp-selo-previsto { display:inline-block; font-size:11px; font-weight:600; font-style:normal; padding:3px 10px; border-radius:999px; color:var(--muted); background:color-mix(in srgb, var(--muted2) 14%, transparent); border:1px dashed color-mix(in srgb, var(--muted) 45%, transparent); }
.cp-previsto-nota { font-size:11.5px; color:var(--muted2); }
.cp-previsao-resumo { font-size:12.5px; color:var(--text2); background:var(--bg2); border-radius:10px; padding:9px 14px; margin-bottom:10px; }
.cp-previsao-resumo b { color:var(--text); font-weight:600; }
.cp-previsao-resumo span { color:var(--muted2); }
.cp-card-sub { font-size:11px; color:var(--muted2); margin-top:4px; font-style:italic; }

/* ═════ Módulo: Chat e mensagens (msg-*, aud-*, #msg-menu, #resp-barra, enc-*) ═════ */
/* O chat do Froteli é sempre escuro (paleta do WhatsApp, igual em dia e
   noite), então estas regras usam os tokens --chat-* definidos no :root. */
.msg { --resp-cor:var(--chat-link); }
.msg-out { --resp-cor:var(--chat-quote-out); }
.msg-in { --seta-bg:var(--chat-panel); }
.msg-out { --seta-bg:var(--chat-out); }
.msg-quote { display:flex; gap:8px; align-items:stretch; background:color-mix(in srgb, var(--chat-shade) 22%, transparent); border-radius:6px; padding:6px 9px; margin-bottom:5px; cursor:pointer; border-left:3px solid var(--resp-cor); max-width:100%; overflow:hidden; }
.msg-quote:hover { background:color-mix(in srgb, var(--chat-shade) 30%, transparent); }
.msg-quote-corpo { min-width:0; flex:1; }
.msg-quote-autor { font-size:12px; font-weight:600; color:var(--resp-cor); margin-bottom:2px; }
.msg-quote-txt { font-size:12.5px; color:color-mix(in srgb, var(--chat-text) 75%, transparent); line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-word; }
.msg.msg-piscando { animation:msgPisca 1.4s ease-out; }
.msg-seta { position:absolute; top:0; right:0; width:26px; height:24px; border:none; padding:0; display:none; align-items:center; justify-content:center; cursor:pointer; color:color-mix(in srgb, var(--chat-text) 85%, transparent); border-radius:0 8px 0 8px; background:linear-gradient(225deg, var(--seta-bg) 58%, transparent 58%); }
.msg-seta svg { width:13px; height:13px; margin:-2px -4px 0 6px; }
.msg:hover .msg-seta,
.msg-seta.aberto { display:flex; }
@media (hover:none) {
  .msg-seta { display:flex; }
}
/* Menu de ações da mensagem (um só, reposicionado pelo chat.js) */
#msg-menu { display:none; position:fixed; z-index:400; background:var(--chat-menu); border:1px solid color-mix(in srgb, var(--chat-text) 8%, transparent); border-radius:8px; padding:5px 0; min-width:172px; box-shadow:var(--shadow-lg); }
#msg-menu.aberto { display:block; }
#msg-menu button { display:flex; align-items:center; gap:11px; width:100%; border:none; background:none; cursor:pointer; padding:9px 15px; font-size:13.5px; font-family:var(--font-body); color:var(--chat-text); text-align:left; }
#msg-menu button:hover { background:color-mix(in srgb, var(--chat-text) 7%, transparent); }
#msg-menu button svg { width:15px; height:15px; opacity:.75; flex-shrink:0; }
/* Barra de "respondendo a" ancorada sobre a área de digitação */
#resp-barra { display:none; align-items:stretch; gap:10px; position:absolute; left:12px; right:12px; bottom:100%; z-index:3; background:var(--chat-panel); border-left:3px solid var(--chat-link); border-radius:8px 8px 0 0; padding:8px 10px; box-shadow:var(--shadow-md); }
#resp-barra.ativo { display:flex; }
#resp-barra .corpo { flex:1; min-width:0; }
#resp-barra .autor { font-size:12px; font-weight:600; color:var(--chat-link); margin-bottom:2px; }
#resp-barra .txt { font-size:12.5px; color:color-mix(in srgb, var(--chat-text) 70%, transparent); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#resp-barra .fechar { background:none; border:none; color:color-mix(in srgb, var(--chat-text) 60%, transparent); font-size:20px; cursor:pointer; padding:0 4px; line-height:1; align-self:flex-start; flex-shrink:0; }
@media (prefers-reduced-motion: reduce) {
  .msg.msg-piscando { animation:none; outline:2px solid color-mix(in srgb, var(--chat-link) 75%, transparent); }
}
/* Player de áudio no balão */
.aud { display:flex; align-items:center; gap:9px; min-width:210px; max-width:260px; padding:2px 0; }
.aud-btn { flex-shrink:0; width:34px; height:34px; border-radius:50%; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; background:color-mix(in srgb, var(--chat-text) 14%, transparent); color:var(--chat-text); transition:background .15s; }
.aud-btn:hover { background:color-mix(in srgb, var(--chat-text) 22%, transparent); }
.aud-btn svg { width:15px; height:15px; }
.aud-meio { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.aud-onda { display:flex; align-items:center; gap:2px; height:22px; cursor:pointer; }
.aud-barra { flex:1; min-width:2px; border-radius:1px; background:color-mix(in srgb, var(--chat-text) 35%, transparent); transition:background .1s; }
.aud-barra.ouvida { background:var(--chat-text); }
.msg-out .aud-barra.ouvida { background:var(--chat-quote-out); }
.aud-rodape { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.aud-tempo { font-size:11px; color:color-mix(in srgb, var(--chat-text) 65%, transparent); font-variant-numeric:tabular-nums; }
.aud-vel { font-size:10px; font-weight:700; color:color-mix(in srgb, var(--chat-text) 75%, transparent); cursor:pointer; background:color-mix(in srgb, var(--chat-text) 14%, transparent); border:none; border-radius:999px; padding:2px 7px; line-height:1.4; letter-spacing:.02em; }
.aud-vel:hover { background:color-mix(in srgb, var(--chat-text) 24%, transparent); }
.aud.carregando .aud-onda,
.aud.carregando .aud-btn { opacity:.45; pointer-events:none; }
@media (prefers-reduced-motion: reduce) {
  .aud-barra,
  .aud-btn { transition:none; }
}
/* Régua de contrato encerrado (mensagens.js): simulação do envio */
.enc-acoes { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:11px; padding-top:11px; border-top:1px solid var(--border2); }
.enc-acoes .enc-switch { flex:1 1 260px; background:var(--card); }
.enc-sim-modal { width:min(620px, calc(100vw - 24px)); }
.enc-sim-resumo { font-size:12.5px; color:var(--muted); margin-bottom:12px; line-height:1.45; }
.enc-sim-item { border-top:1px solid var(--border); padding:10px 0; }
.enc-sim-item summary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 12px; cursor:pointer; list-style:none; }
.enc-sim-item summary::-webkit-details-marker { display:none; }
.enc-sim-nome { font-size:13.5px; font-weight:600; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.enc-sim-val { font-size:13.5px; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; text-align:right; }
.enc-sim-st { grid-column:1 / -1; font-size:12px; color:var(--green); }
.enc-sim-item.fora .enc-sim-st { color:var(--yellow); }
.enc-sim-item.fora .enc-sim-nome,
.enc-sim-item.fora .enc-sim-val { color:var(--muted); }
.enc-sim-msg { margin-top:10px; background:var(--wa-bubble); color:var(--wa-bubble-text); border-radius:10px; padding:10px 12px; font-size:13px; line-height:1.55; }

/* Regras de negócio (js/regras.js): linha de plano */
.rg-plano { min-width:0; }
.rg-plano .form-group { min-width:0; }
.rg-p-codigo, .rg-p-nome, .rg-p-tipo, .rg-p-valor, .rg-p-semanas { width:100%; min-width:0; box-sizing:border-box; background:var(--bg3); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:8px 10px; font:inherit; font-size:13px; }
.rg-p-codigo:focus, .rg-p-nome:focus, .rg-p-tipo:focus, .rg-p-valor:focus, .rg-p-semanas:focus { outline:2px solid var(--accent); outline-offset:1px; }
.rg-p-valor, .rg-p-semanas { font-variant-numeric:tabular-nums; }
@media (max-width:700px) { .rg-plano { grid-template-columns:1fr 1fr !important; } }
