/* =====================================================================
   RODAR — painel da locadora
   Identidade: azul-marinho (confiança) + verde-azulado (tecnologia)
   ===================================================================== */
:root {
  /* marca (fixas nos dois temas) */
  --marinho: #111C2D;
  --marinho-2: #1B2A42;
  --marinho-3: #2A3B57;
  --asfalto: var(--marinho);
  --asfalto-2: var(--marinho-2);
  --asfalto-3: var(--marinho-3);
  --acento: #16A6A1;
  --faixa: var(--acento);

  /* tema claro */
  --acento-forte: #0D7A76;
  --faixa-escura: var(--acento-forte);
  --acento-bg: rgba(22, 166, 161, .12);
  --acento-anel: rgba(22, 166, 161, .28);
  --fundo: #F3F5F8;
  --fundo-2: #F8FAFC;
  --superficie: #FFFFFF;
  --superficie-2: #FFFFFF;
  --borda: #E4E8EE;
  --borda-forte: #D3DAE4;
  --texto: #111C2D;
  --texto-2: #4F5D72;
  --texto-3: #6B778A;
  --verde: #12844F;
  --azul: #2563EB;
  --laranja: #B45309;
  --vermelho: #C9302C;
  --cinza: #6B778A;
  --verde-bg: rgba(18, 132, 79, .10);
  --azul-bg: rgba(37, 99, 235, .09);
  --laranja-bg: rgba(217, 119, 6, .12);
  --vermelho-bg: rgba(201, 48, 44, .09);
  --cinza-bg: rgba(107, 119, 138, .13);
  --verde-borda: rgba(18, 132, 79, .28);
  --laranja-borda: rgba(217, 119, 6, .40);
  --vermelho-borda: rgba(201, 48, 44, .32);
  --azul-borda: rgba(37, 99, 235, .22);
  --txt-verde: #0B6138;
  --txt-azul: #1E40AF;
  --txt-laranja: #8A3F06;
  --txt-vermelho: #9B1C1C;
  --btn-pri-bg: var(--marinho);
  --btn-pri-hover: #22355A;
  --btn-pri-txt: #FFFFFF;
  --destaque-bg: var(--marinho);
  --destaque-sub: #B6C2D4;
  --destaque-trilho: #2A3B57;
  --hover: rgba(17, 28, 45, .05);
  --raio: 12px;
  --sombra: 0 1px 2px rgba(17, 28, 45, .04), 0 1px 3px rgba(17, 28, 45, .06);
  --sombra-alta: 0 24px 64px rgba(17, 28, 45, .22);
  --lateral: 248px;
  --lateral-recolhida: 76px;
  color-scheme: light;
}

/* tema escuro */
:root[data-tema="escuro"] {
  --acento-forte: #3CC8C2;
  --acento-bg: rgba(22, 166, 161, .18);
  --acento-anel: rgba(60, 200, 194, .35);
  --fundo: #0A111D;
  --fundo-2: #0F1828;
  --superficie: #121B2B;
  --superficie-2: #172234;
  --borda: #223049;
  --borda-forte: #2E3E5C;
  --texto: #E6EBF2;
  --texto-2: #AEB9CA;
  --texto-3: #8693A8;
  --verde: #3DC487;
  --azul: #6D9BF5;
  --laranja: #F2A65A;
  --vermelho: #F2716B;
  --cinza: #8693A8;
  --verde-bg: rgba(61, 196, 135, .14);
  --azul-bg: rgba(109, 155, 245, .14);
  --laranja-bg: rgba(242, 166, 90, .15);
  --vermelho-bg: rgba(242, 113, 107, .14);
  --cinza-bg: rgba(134, 147, 168, .16);
  --verde-borda: rgba(61, 196, 135, .35);
  --laranja-borda: rgba(242, 166, 90, .4);
  --vermelho-borda: rgba(242, 113, 107, .4);
  --azul-borda: rgba(109, 155, 245, .35);
  --txt-verde: #7FE0B2;
  --txt-azul: #A9C3FA;
  --txt-laranja: #F7C48F;
  --txt-vermelho: #F8A9A5;
  --btn-pri-bg: var(--acento);
  --btn-pri-hover: #1BBDB7;
  --btn-pri-txt: #06201F;
  --destaque-bg: #0F2C3B;
  --destaque-sub: #A9C2CF;
  --destaque-trilho: #1E4456;
  --hover: rgba(255, 255, 255, .04);
  --sombra: 0 1px 2px rgba(0, 0, 0, .3);
  --sombra-alta: 0 24px 64px rgba(0, 0, 0, .55);
  color-scheme: dark;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; }
body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 15px;
  color: var(--texto);
  background: var(--fundo);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--acento-forte); }
button { font: inherit; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { margin: 0; letter-spacing: -0.01em; }

/* ---------- carregando ---------- */
.carregando-tela { display: grid; place-items: center; height: 100vh; background: var(--fundo); }
.carregando { display: grid; place-items: center; padding: 64px 0; }
.roda {
  width: 36px; height: 36px; border-radius: 50%;
  border: 4px solid var(--acento-anel); border-top-color: var(--faixa);
  animation: girar .8s linear infinite;
}
@keyframes girar { to { transform: rotate(360deg); } }

/* ---------- botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid transparent;
  font-weight: 600; font-size: 14px; white-space: nowrap; transition: background .15s, transform .05s;
}
.btn:active { transform: translateY(1px); }
a.btn { text-decoration: none; }
.btn:disabled { opacity: .55; cursor: wait; }
.btn-pri { background: var(--btn-pri-bg); color: var(--btn-pri-txt); }
.btn-pri:hover { background: var(--btn-pri-hover); }
.btn-sec { background: var(--superficie); border-color: var(--borda); color: var(--texto); }
.btn-sec:hover { background: var(--fundo); }
.btn-perigo { background: var(--vermelho); color: #fff; }
.btn-bloco { width: 100%; height: 46px; font-size: 15px; }
.btn-icone {
  display: inline-grid; place-items: center; width: 34px; height: 34px;
  border: 0; border-radius: 8px; background: transparent; color: inherit;
}
.btn-icone svg:not(.ic) { width: 20px; height: 20px; }
.btn-icone:hover { background: var(--hover); }
.btn-icone.perigo:hover { background: var(--vermelho-bg); }
.link { background: none; border: 0; color: var(--acento-forte); padding: 0; font-weight: 600; }
.link:hover { text-decoration: underline; }

/* ---------- formulários ---------- */
label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: var(--texto-2); }
input, select, textarea {
  width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--borda);
  border-radius: 9px; background: var(--superficie); font-size: 15px; font-weight: 500;
  transition: border-color .15s, box-shadow .15s;
}
textarea { height: auto; padding: 10px 12px; resize: vertical; }
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--faixa); box-shadow: 0 0 0 3px var(--acento-anel);
}
.opc { font-weight: 500; color: var(--texto-3); }
.check { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; cursor: pointer; }
.check input { width: 18px; height: 18px; accent-color: var(--faixa-escura); }

.form { display: flex; flex-direction: column; gap: 18px; }
fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
legend {
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--texto-3); margin-bottom: 10px; padding: 0;
}
.grade-2, .grade-3, .grade-4 { display: grid; gap: 12px; }
.grade-2 { grid-template-columns: repeat(2, 1fr); }
.grade-3 { grid-template-columns: repeat(3, 1fr); }
.grade-4 { grid-template-columns: repeat(4, 1fr); }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: span 3; }
.form-acoes { display: flex; justify-content: flex-end; gap: 10px; padding-top: 4px; }

/* ---------- autenticação ---------- */
.auth { min-height: 100vh; display: grid; grid-template-columns: 1.1fr 1fr; background: var(--fundo); }
.auth-centro { grid-template-columns: 1fr; place-items: center; padding: 24px; }
.auth-marca {
  background:
    radial-gradient(60% 50% at 100% 100%, rgba(22,166,161,.28) 0%, transparent 70%),
    radial-gradient(120% 80% at 0% 0%, #1E3050 0%, var(--marinho) 60%);
  color: #fff; padding: 56px clamp(24px, 6vw, 80px); display: flex; flex-direction: column; justify-content: center; gap: 20px;
}
.auth-marca .logo-grande { text-decoration: none; }
.auth-marca h1 { font-size: clamp(30px, 4vw, 46px); font-weight: 800; line-height: 1.08; max-width: 14ch; }
.auth-marca p { color: #b8c1d1; font-size: 17px; max-width: 46ch; line-height: 1.55; margin: 0; }
.auth-pontos { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 12px; color: #dfe5ee; }
.auth-pontos li { display: flex; align-items: center; gap: 12px; }
.auth-pontos .ic { width: 34px; height: 34px; padding: 8px; border-radius: 10px; background: rgba(22,166,161,.16); color: #5FD6D0; flex-shrink: 0; }
.auth-caixa { display: grid; place-items: center; padding: 24px; }
.auth-marca { overflow: hidden; }
.destaque-acento { color: #5FD6D0; }
.auth-pontos { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 560px; font-size: 15px; }
.auth-vitrine { position: relative; margin-top: 18px; max-width: 620px; }
.auth-vitrine img { display: block; width: 100%; border-radius: 14px; border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 80px rgba(0,0,0,.45); transform: perspective(1400px) rotateY(-7deg) rotateX(3deg); transform-origin: left center; }
.auth-selo { position: absolute; display: flex; align-items: center; gap: 10px; background: #fff; color: var(--marinho);
  border-radius: 12px; padding: 10px 14px; box-shadow: 0 12px 30px rgba(0,0,0,.35); font-size: 13px; }
.auth-selo .ic { width: 32px; height: 32px; padding: 7px; border-radius: 9px; background: rgba(22,166,161,.14); color: var(--acento-forte); }
.auth-selo b { display: block; font-size: 14px; }
.auth-selo small { color: #5b677a; }
.auth-selo-1 { left: -12px; bottom: 18%; }
.auth-selo-2 { right: -8px; top: -18px; }
.auth-site { color: #8fe3de; font-weight: 600; text-decoration: none; width: fit-content; }
.auth-site:hover { text-decoration: underline; }
@media (max-width: 900px) {
  .auth-vitrine, .auth-site { display: none; }
  .auth-pontos { grid-template-columns: 1fr; }
}
.cartao {
  width: 100%; max-width: 400px; background: var(--superficie); border-radius: 16px; border: 1px solid var(--borda);
  padding: 32px; box-shadow: var(--sombra); display: flex; flex-direction: column; gap: 14px;
}
.cartao-medio { max-width: 520px; }
.cartao h2 { font-size: 24px; font-weight: 800; }
.cartao .sub { margin: -6px 0 6px; color: var(--texto-2); }
.troca { text-align: center; color: var(--texto-2); margin: 4px 0 0; font-size: 14px; }

.logo-grande, .logo-pequeno { display: flex; align-items: center; gap: 10px; font-weight: 800; letter-spacing: -0.02em; text-decoration: none; }
.logo-grande { font-size: 30px; color: #fff; }
.logo-grande svg { width: 44px; height: 44px; }
.logo-pequeno { font-size: 20px; color: var(--texto); }
.logo-pequeno svg { width: 32px; height: 32px; flex-shrink: 0; }
:root[data-tema="escuro"] .logo-svg rect { fill: #1B2A42; }

/* ---------- ícones ---------- */
.ic { display: inline-block; vertical-align: middle; flex-shrink: 0; }

/* ---------- layout do painel ---------- */
.painel { display: flex; min-height: 100vh; }
.lateral {
  width: var(--lateral); flex-shrink: 0; background: var(--superficie); border-right: 1px solid var(--borda);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; z-index: 40;
  transition: width .18s ease-out;
}
.lateral-topo { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 18px 14px 14px 18px; height: 70px; }
.lateral-topo .btn-icone { color: var(--texto-3); }
.empresa-chip {
  margin: 0 12px 10px; padding: 10px; background: var(--fundo); border-radius: 10px;
  display: flex; align-items: center; gap: 10px; border: 1px solid var(--borda); min-width: 0;
}
a.empresa-chip { text-decoration: none; color: inherit; transition: border-color .15s; }
a.empresa-chip:hover { border-color: var(--acento); }
.empresa-ic { width: 32px; height: 32px; border-radius: 8px; background: var(--marinho); color: #5FD6D0; display: grid; place-items: center; flex-shrink: 0; }
.empresa-txt { display: flex; flex-direction: column; min-width: 0; }
.empresa-nome { font-weight: 700; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.empresa-plano { font-size: 12px; color: var(--acento-forte); font-weight: 600; }
.lateral nav { flex: 1; overflow-y: auto; overflow-x: hidden; }
.menu { list-style: none; margin: 0; padding: 4px 12px; display: flex; flex-direction: column; gap: 2px; }
.menu a {
  display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 9px; height: 40px;
  color: var(--texto-2); text-decoration: none; font-weight: 600; font-size: 14px; position: relative; white-space: nowrap;
}
.menu a:hover { background: var(--hover); color: var(--texto); }
.menu a.ativo { background: var(--acento-bg); color: var(--acento-forte); }
.menu a.ativo::before {
  content: ''; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 4px 4px 0; background: var(--acento);
}
.menu-txt { min-width: 0; }
.menu-n {
  margin-left: auto; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 99px; font-size: 11.5px; font-weight: 700;
  display: inline-grid; place-items: center; background: var(--fundo); color: var(--texto-3); font-variant-numeric: tabular-nums;
}
.menu-n:empty { display: none; }
.menu-n-alerta { background: var(--vermelho); color: #fff; }
.menu-sep { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-3); padding: 14px 10px 4px; white-space: nowrap; }
.status-sistema { margin: 8px 12px 14px; padding: 12px; border-radius: 10px; background: var(--fundo); border: 1px solid var(--borda); display: flex; flex-direction: column; gap: 6px; }
.status-sistema:empty { display: none; }
.st-titulo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--texto-3); }
.st-linha { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--texto); text-decoration: none; }
.st-linha small { margin-left: auto; color: var(--texto-3); font-weight: 500; font-size: 12px; }
.st-ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--cinza); flex-shrink: 0; }
.st-ok { background: var(--verde); box-shadow: 0 0 0 3px var(--verde-bg); }
.st-aviso { background: var(--laranja); box-shadow: 0 0 0 3px var(--laranja-bg); }
.st-erro { background: var(--vermelho); box-shadow: 0 0 0 3px var(--vermelho-bg); }

/* menu recolhido (desktop) */
@media (min-width: 901px) {
  body.menu-recolhido .lateral { width: var(--lateral-recolhida); }
  body.menu-recolhido .menu-txt, body.menu-recolhido .menu-sep span, body.menu-recolhido .logo-pequeno span { display: none; }
  body.menu-recolhido .lateral-topo { flex-direction: column; height: auto; padding: 16px 0 10px; gap: 10px; }
  body.menu-recolhido .empresa-chip { justify-content: center; padding: 6px; margin: 0 14px 8px; background: none; border: 0; }
  body.menu-recolhido .menu { padding: 4px 14px; }
  body.menu-recolhido .menu a { justify-content: center; padding: 0; }
  body.menu-recolhido .menu a.ativo::before { left: -14px; }
  body.menu-recolhido .menu-sep { padding: 10px 0 4px; border-top: 1px solid var(--borda); margin: 6px 6px 0; }
  body.menu-recolhido .menu-n { position: absolute; top: 2px; right: 0; min-width: 8px; height: 8px; padding: 0; font-size: 0; }
  body.menu-recolhido .menu-n:not(.menu-n-alerta) { display: none; }
}

/* barra superior */
.area { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.barra-topo {
  display: flex; align-items: center; gap: 16px; padding: 0 28px; height: 70px;
  background: var(--superficie); border-bottom: 1px solid var(--borda);
  position: sticky; top: 0; z-index: 30;
}
.titulo-bloco { min-width: 0; flex: 0 1 auto; }
.barra-topo h1 { font-size: 19px; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.barra-topo p { margin: 1px 0 0; font-size: 12.5px; color: var(--texto-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.titulo-bloco p::first-letter { text-transform: uppercase; }
.busca-global { position: relative; flex: 1 1 360px; max-width: 460px; margin-left: auto; }
.busca-global > .ic { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--texto-3); pointer-events: none; }
.busca-global input { height: 40px; padding: 0 40px 0 38px; background: var(--fundo); border-color: transparent; }
.busca-global input:focus { background: var(--superficie); }
.busca-global kbd {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-family: inherit; font-weight: 600; font-size: 11px; line-height: 1; color: var(--texto-3);
  border: 1px solid var(--borda-forte); border-radius: 5px; padding: 3px 6px; pointer-events: none; background: var(--superficie);
}
.busca-global input:focus + kbd { display: none; }
.busca-res, .dropdown {
  position: absolute; top: calc(100% + 8px); background: var(--superficie); border: 1px solid var(--borda);
  border-radius: 12px; box-shadow: var(--sombra-alta); z-index: 60; overflow: hidden;
}
.busca-res { left: 0; right: 0; max-height: 420px; overflow-y: auto; padding: 6px; }
.busca-item { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px; color: var(--texto); text-decoration: none; }
.busca-item.sel, .busca-item:hover { background: var(--hover); }
.busca-ic { width: 32px; height: 32px; border-radius: 8px; background: var(--fundo); color: var(--texto-2); display: grid; place-items: center; flex-shrink: 0; }
.busca-txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.busca-txt b { font-size: 14px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.busca-txt small { color: var(--texto-3); font-size: 12px; text-transform: capitalize; }
.busca-tipo { font-size: 11px; font-weight: 700; color: var(--texto-3); text-transform: uppercase; letter-spacing: .05em; }
.busca-vazio { padding: 16px; text-align: center; color: var(--texto-3); font-size: 14px; }
.topo-acoes { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.btn-topo { width: 40px; height: 40px; border-radius: 10px; color: var(--texto-2); position: relative; }
.btn-topo:hover { background: var(--hover); color: var(--texto); }
.sino-wrap, .usuario-wrap { position: relative; }
.sino-n {
  position: absolute; top: 3px; right: 1px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 99px;
  background: var(--vermelho); color: #fff; font-size: 10.5px; font-weight: 800; display: grid; place-items: center;
  border: 2px solid var(--superficie);
}
.dropdown { right: 0; width: 340px; }
.dd-cab { padding: 14px 16px 10px; display: flex; flex-direction: column; border-bottom: 1px solid var(--borda); }
.dd-cab strong { font-size: 14px; }
.dd-cab small { color: var(--texto-3); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sino-lista { max-height: 460px; overflow-y: auto; }
.notif { display: flex; gap: 12px; padding: 12px 16px; text-decoration: none; color: var(--texto); border-bottom: 1px solid var(--borda); }
.notif:last-child { border-bottom: 0; }
.notif:hover { background: var(--hover); }
.notif-ic { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; flex-shrink: 0; }
.notif-vermelho { background: var(--vermelho-bg); color: var(--vermelho); }
.notif-laranja { background: var(--laranja-bg); color: var(--laranja); }
.notif-txt { display: flex; flex-direction: column; min-width: 0; }
.notif-txt b { font-size: 13.5px; font-weight: 700; }
.notif-txt small { color: var(--texto-3); font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notif-vazio { padding: 28px 16px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--texto-3); font-size: 14px; }
.notif-vazio .ic { color: var(--verde); }
.usuario { display: flex; align-items: center; gap: 10px; min-width: 0; background: none; border: 0; padding: 4px 8px 4px 4px; border-radius: 10px; color: var(--texto); }
.usuario:hover { background: var(--hover); }
.avatar {
  width: 34px; height: 34px; border-radius: 50%; background: var(--marinho); color: #5FD6D0;
  display: grid; place-items: center; font-weight: 800; flex-shrink: 0; font-size: 14px;
}
:root[data-tema="escuro"] .avatar { background: var(--acento); color: #06201F; }
.usuario-info { display: flex; flex-direction: column; min-width: 0; text-align: left; max-width: 140px; }
.usuario-info strong { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.usuario-info small { color: var(--texto-3); font-size: 12px; text-transform: capitalize; }
.usuario-seta { color: var(--texto-3); }
.usuario-menu { width: 240px; padding-bottom: 6px; }
.usuario-menu a, .usuario-menu button {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 16px; background: none; border: 0;
  color: var(--texto); text-decoration: none; font-size: 14px; font-weight: 600; text-align: left;
}
.usuario-menu a:hover, .usuario-menu button:hover { background: var(--hover); }
.usuario-menu .dd-cab { margin-bottom: 6px; }
.dd-sair { color: var(--vermelho) !important; }

.conteudo { padding: 24px 28px 48px; max-width: 1360px; width: 100%; }
.conteudo.entrando { animation: entrar .22s ease-out; }
.so-celular { display: none !important; }
.lateral-fundo { display: none; }

/* ---------- listas ---------- */
.cabecalho-lista { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.busca { position: relative; flex: 1 1 280px; max-width: 420px; }
.busca svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--texto-3); }
.busca input { padding-left: 38px; }
.filtros { display: flex; gap: 6px; flex-wrap: wrap; }
.pilula {
  height: 34px; padding: 0 14px; border-radius: 99px; border: 1px solid var(--borda);
  background: var(--superficie); font-size: 13px; font-weight: 600; color: var(--texto-2);
}
.pilula.ativa { background: var(--btn-pri-bg); color: var(--btn-pri-txt); border-color: var(--btn-pri-bg); }
.cabecalho-lista .btn-pri { margin-left: auto; }
.contagem { margin: 0 0 8px; color: var(--texto-3); font-size: 13px; font-weight: 600; }

.tabela-wrap { background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra); border: 1px solid var(--borda); overflow-x: auto; }
.tabela { width: 100%; border-collapse: collapse; min-width: 720px; }
.tabela th {
  text-align: left; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: var(--texto-3); padding: 12px 16px; border-bottom: 1px solid var(--borda); background: var(--fundo-2);
}
.tabela td { padding: 12px 16px; border-bottom: 1px solid var(--borda); vertical-align: middle; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela tbody tr:hover { background: var(--fundo-2); }
.tabela td small { display: block; color: var(--texto-3); font-size: 12px; margin-top: 2px; }
.tabela tr.inativo td { opacity: .55; }
.num, .tabela th.num { text-align: right; font-variant-numeric: tabular-nums; }
.mono { font-variant-numeric: tabular-nums; white-space: nowrap; }
.acoes { text-align: right; white-space: nowrap; width: 1%; }

.placa {
  display: inline-block; font-weight: 800; letter-spacing: .06em; font-size: 13px;
  padding: 3px 8px; border-radius: 5px; border: 1.5px solid #111C2D; background: #fff; color: #111C2D;
  border-top: 5px solid #1c4fb8; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.placa-mini { font-size: 11px; padding: 1px 6px; border-top-width: 3px; }

.status {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700;
  padding: 4px 10px; border-radius: 99px; white-space: nowrap;
}
.status::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.st-disponivel { color: var(--verde); background: var(--verde-bg); }
.st-alugado { color: var(--azul); background: var(--azul-bg); }
.st-manutencao { color: var(--laranja); background: var(--laranja-bg); }
.st-inativo { color: var(--cinza); background: var(--cinza-bg); }
.st-vencida { color: var(--vermelho); background: var(--vermelho-bg); }
.st-alerta { color: var(--laranja); background: var(--laranja-bg); }
.st-bg-disponivel { background: var(--verde); }
.st-bg-alugado { background: var(--azul); }
.st-bg-manutencao { background: var(--laranja); }
.st-bg-inativo { background: var(--cinza); }

.wa { color: var(--verde); font-weight: 600; text-decoration: none; white-space: nowrap; }
.wa:hover { text-decoration: underline; }

.vazio {
  background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra); border: 1px solid var(--borda);
  padding: 48px 24px; text-align: center; color: var(--texto-2);
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.vazio p { margin: 0; font-weight: 600; }
.vazio-icone { width: 64px; height: 64px; border-radius: 16px; background: var(--acento-bg); color: var(--acento-forte); display: grid; place-items: center; }
.vazio > .ic { color: var(--texto-3); }
.muted { color: var(--texto-3); }

/* ---------- dashboard ---------- */
.boas-vindas { margin-bottom: 18px; }
.boas-vindas h2 { font-size: 20px; font-weight: 700; }
.boas-vindas p { margin: 4px 0 0; color: var(--texto-2); }
.cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 14px; }
.card {
  background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra); border: 1px solid var(--borda);
  padding: 18px; display: flex; flex-direction: column; gap: 4px;
}
.card-rotulo { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); }
.card-valor { font-size: 34px; font-weight: 800; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.card-sub { font-size: 13px; color: var(--texto-2); }
.card-destaque { background: var(--destaque-bg); color: #fff; border-color: transparent !important; }
.card-destaque .card-rotulo { color: #5FD6D0; }
.card-destaque .card-sub { color: var(--destaque-sub); }
.barra { height: 6px; border-radius: 99px; background: var(--destaque-trilho); overflow: hidden; margin: 4px 0 2px; }
.barra span { display: block; height: 100%; background: var(--faixa); border-radius: 99px; }

.paineis { display: grid; grid-template-columns: 1.3fr 1fr; gap: 14px; margin-bottom: 14px; }
.painel-bloco { background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra); border: 1px solid var(--borda); padding: 18px; }
.painel-bloco h3, .proximos h3 { font-size: 15px; font-weight: 700; margin-bottom: 14px; }
.pilha { display: flex; height: 14px; border-radius: 99px; overflow: hidden; gap: 2px; background: var(--fundo); }
.pilha-seg { display: block; }
.legenda { list-style: none; padding: 0; margin: 14px 0 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; font-size: 14px; color: var(--texto-2); }
.legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 8px; }
.legenda b { color: var(--texto); margin-left: 4px; }
.alertas { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.alertas li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.proximos { background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra); border: 1px solid var(--borda); padding: 18px; }
.roadmap { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.roadmap div {
  border: 1.5px dashed var(--borda); border-radius: 10px; padding: 12px;
  display: flex; flex-direction: column; gap: 2px;
}
.roadmap span { font-size: 13px; color: var(--texto-3); }

.em-breve {
  background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra);
  padding: 48px 32px; text-align: center; max-width: 620px; margin: 24px auto;
}
.em-breve h2 { font-size: 24px; font-weight: 800; margin: 12px 0 8px; }
.em-breve p { color: var(--texto-2); margin: 6px 0; line-height: 1.55; }
.selo {
  display: inline-block; background: var(--acento-bg); color: var(--faixa-escura);
  font-weight: 700; font-size: 12px; padding: 4px 12px; border-radius: 99px; text-transform: uppercase; letter-spacing: .05em;
}

/* ---------- locações ---------- */
.abas { margin-bottom: 14px; }
.pilula-n { font-variant-numeric: tabular-nums; opacity: .7; margin-left: 2px; }
.pilula-n:empty { display: none; }
.tabela-clicavel tbody tr { cursor: pointer; }
.tabela-clicavel tbody tr:focus-visible { outline: 2px solid var(--faixa); outline-offset: -2px; }
.num-contrato { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--texto-2); }
.so-celular-inline { display: none; }
.tabela small.inline { display: inline; margin: 0 0 0 4px; }
.st-loc-rascunho { color: var(--cinza); background: var(--cinza-bg); }
.st-loc-aguardando_assinatura { color: var(--laranja); background: var(--laranja-bg); }
.st-loc-ativa { color: var(--verde); background: var(--verde-bg); }
.st-loc-encerrada { color: var(--azul); background: var(--azul-bg); }
.st-loc-cancelada { color: var(--vermelho); background: var(--vermelho-bg); }
.pequeno { font-size: 13px; }
.aviso-cnh { margin: 0; padding: 10px 12px; border-radius: 9px; background: var(--laranja-bg); color: var(--txt-laranja); font-weight: 600; font-size: 14px; }
.btn-wa { background: #1fae5b; color: #fff; }
.btn-wa:hover { background: #17924b; }
.btn-txt-perigo { background: none; color: var(--vermelho); border-color: transparent; }
.btn-txt-perigo:hover { background: var(--vermelho-bg); }

.det { display: flex; flex-direction: column; gap: 16px; }
.det-topo { display: flex; align-items: center; gap: 10px; }
.det-grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 20px; }
.det-grade > div { display: flex; flex-direction: column; gap: 2px; }
.det-grade .rot { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); }
.det-grade small { color: var(--texto-2); font-size: 13px; }
.caixa-link {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px;
  padding: 14px; border-radius: 12px; background: var(--acento-bg); border: 1px solid var(--acento-anel);
}
.caixa-link > div:first-child { display: flex; flex-direction: column; }
.caixa-link small { color: var(--texto-2); font-size: 12px; }
.caixa-link input { font-size: 13px; height: 38px; background: var(--superficie); }
.caixa-link-acoes { display: flex; gap: 8px; }
.caixa-link.expirado { background: var(--vermelho-bg); border-color: var(--vermelho-borda); grid-template-columns: 1fr; }
.caixa-assinatura {
  display: flex; gap: 14px; align-items: center; padding: 14px; border-radius: 12px;
  background: var(--verde-bg); border: 1px solid var(--verde-borda);
}
.caixa-assinatura > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.caixa-assinatura small { color: var(--texto-2); font-size: 12px; }
.selfie-mini { width: 64px; height: 84px; object-fit: cover; border-radius: 8px; background: var(--borda); flex-shrink: 0; }
.quebra { word-break: break-all; }
.det-contrato { display: flex; flex-direction: column; gap: 8px; }
.det-contrato[hidden] { display: none; }
.det-contrato-topo { display: flex; justify-content: space-between; align-items: center; }
.det-contrato textarea { font-size: 13px; line-height: 1.55; font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; }
.det-contrato textarea[readonly] { background: var(--fundo); }
.det-acoes { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 4px; border-top: 1px solid var(--borda); padding-top: 14px; }

/* ---------- configurações ---------- */
.config { display: grid; grid-template-columns: 300px 1fr; gap: 14px; align-items: start; }
.config .painel-bloco h3 { margin-bottom: 4px; }
.config .painel-bloco > .muted { margin: 0 0 14px; }
.logo-area { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.logo-area label.btn { flex-direction: row; color: var(--texto); font-size: 14px; }
.logo-preview {
  width: 100%; height: 120px; border: 1.5px dashed var(--borda); border-radius: 12px;
  display: grid; place-items: center; color: var(--texto-3); font-weight: 600; padding: 12px;
}
.logo-preview img { max-width: 100%; max-height: 96px; object-fit: contain; }
fieldset[disabled] input { background: var(--fundo); }

/* ---------- modal ---------- */
.modal-fundo {
  position: fixed; inset: 0; background: rgba(8, 14, 24, .6); z-index: 2000; backdrop-filter: blur(2px);
  display: grid; place-items: center; padding: 16px; animation: aparecer .15s ease-out;
}
.modal {
  background: var(--superficie); border-radius: 16px; width: 100%; max-width: 460px;
  max-height: calc(100vh - 32px); display: flex; flex-direction: column; box-shadow: var(--sombra-alta);
}
.modal-largo { max-width: 780px; }
.modal-topo { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px; border-bottom: 1px solid var(--borda); }
.modal-topo h2 { font-size: 18px; font-weight: 800; }
.modal-corpo { padding: 20px 22px 22px; overflow-y: auto; }
.confirma-msg { margin: 0 0 18px; line-height: 1.5; }
@keyframes aparecer { from { opacity: 0; } }

/* ---------- toasts ---------- */
#toasts { position: fixed; right: 16px; bottom: 16px; z-index: 2100; display: flex; flex-direction: column; gap: 8px; max-width: calc(100vw - 32px); }
.toast {
  background: var(--asfalto); color: #fff; padding: 12px 16px; border-radius: 10px; font-weight: 600;
  font-size: 14px; box-shadow: 0 8px 24px rgba(0,0,0,.2); border-left: 4px solid var(--verde);
  animation: entrar .2s ease-out; max-width: 380px; transition: opacity .3s, transform .3s;
}
.toast-erro { border-left-color: var(--vermelho); }
.toast-aviso { border-left-color: var(--faixa); }
.toast.saindo { opacity: 0; transform: translateY(6px); }
@keyframes entrar { from { opacity: 0; transform: translateY(8px); } }

/* ---------- responsivo ---------- */
@media (max-width: 1100px) {
  .cards { grid-template-columns: repeat(2, 1fr); }
  .roadmap { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .config { grid-template-columns: 1fr; }
  .auth { grid-template-columns: 1fr; }
  .auth-marca { padding: 40px 24px 72px; }
  .paineis { grid-template-columns: 1fr; }
  .lateral {
    position: fixed; left: 0; top: 0; z-index: 70; transform: translateX(-100%);
    transition: transform .2s ease-out; width: 280px; box-shadow: var(--sombra-alta);
  }
  .so-desktop { display: none !important; }
  body.menu-aberto .lateral { transform: none; }
  body.menu-aberto .lateral-fundo { display: block; position: fixed; inset: 0; background: rgba(8, 14, 24, .55); z-index: 65; }
  .so-celular { display: inline-grid !important; }
  .barra-topo { padding: 0 10px 0 8px; gap: 6px; height: 60px; }
  .barra-topo h1 { font-size: 18px; }
  .barra-topo p, .usuario-info, .usuario-seta, .busca-global kbd { display: none; }
  .busca-global { display: none; position: absolute; left: 8px; right: 8px; top: 10px; max-width: none; margin: 0; z-index: 5; }
  body.busca-aberta .busca-global { display: block; }
  .titulo-bloco { flex: 1; }
  .topo-acoes { gap: 0; }
  .dropdown { position: fixed; top: 64px; left: 8px; right: 8px; width: auto; }
  .conteudo { padding: 16px 16px 40px; }
}
@media (max-width: 640px) {
  .grade-3, .grade-4 { grid-template-columns: 1fr 1fr; }
  .span-3 { grid-column: span 2; }
  .grade-2 { grid-template-columns: 1fr; }
  .cards { gap: 10px; }
  .card { padding: 14px; }
  .card-valor { font-size: 28px; }
  .cabecalho-lista .btn-pri { margin-left: 0; width: 100%; }
  .busca { max-width: none; }
  .cartao { padding: 24px 20px; }
  .modal-corpo { padding: 16px; }

  /* tabela vira cartões no celular */
  .tabela-wrap { background: transparent; box-shadow: none; overflow: visible; }
  .tabela { min-width: 0; }
  .tabela thead { display: none; }
  .tabela, .tabela tbody { display: block; }
  .tabela tr {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; position: relative;
    background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra);
    padding: 14px; margin-bottom: 10px;
  }
  .tabela tbody tr:hover { background: var(--superficie); }
  .tabela td { padding: 0; border: 0; text-align: left; }
  .tabela td[data-l]::before {
    content: attr(data-l); display: block; font-size: 11px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); margin-bottom: 1px;
  }
  .tabela td.cel-titulo { grid-column: 1 / -1; padding-right: 76px; }
  .tabela td.acoes { position: absolute; top: 8px; right: 8px; width: auto; }
  .so-celular-inline { display: block; margin-top: 2px; }
  .so-desktop-cel { display: none !important; }
  .det-grade { grid-template-columns: 1fr; }
  .caixa-link { grid-template-columns: 1fr; }
  .caixa-link-acoes .btn { flex: 1; }
  .det-acoes .btn { flex: 1 1 calc(50% - 8px); }
}

/* ---------- financeiro ---------- */
.valor-moeda { font-size: 26px; }
.card-alerta { border: 1.5px solid var(--vermelho-borda); }
.card-alerta .card-valor { color: var(--vermelho); }
.acoes-topo { display: flex; gap: 8px; margin-left: auto; flex-wrap: wrap; }
.faixa-info {
  margin: 0 0 12px; padding: 10px 14px; border-radius: 10px; font-size: 14px;
  background: var(--azul-bg); color: var(--txt-azul); border: 1px solid var(--azul-borda);
}
.faixa-info.ok { background: var(--verde-bg); color: var(--txt-verde); border-color: var(--verde-borda); }
.faixa-info.alerta { background: var(--vermelho-bg); color: var(--txt-vermelho); border-color: var(--vermelho-borda); }
.faixa-info small { opacity: .8; }
.selo-pix { font-size: 10px; font-weight: 800; letter-spacing: .05em; color: #fff; background: #32bcad; padding: 2px 6px; border-radius: 4px; vertical-align: 2px; }
.st-cob-vencida { color: var(--vermelho); background: var(--vermelho-bg); }
.st-cob-hoje { color: var(--laranja); background: var(--laranja-bg); }
.st-cob-avencer { color: var(--azul); background: var(--azul-bg); }
.st-cob-paga { color: var(--verde); background: var(--verde-bg); }
.st-cob-cancelada { color: var(--cinza); background: var(--cinza-bg); }
.mes-sel { flex-direction: row; align-items: center; gap: 10px; }
.mes-sel select { width: auto; }
.resumo-mes { display: flex; gap: 16px; flex-wrap: wrap; margin-left: auto; font-size: 14px; font-variant-numeric: tabular-nums; }
.resumo-mes .mais { color: var(--verde); font-weight: 600; }
.resumo-mes .menos { color: var(--vermelho); font-weight: 600; }
.valor-entrada { color: var(--verde); font-weight: 700; }
.valor-saida { color: var(--vermelho); font-weight: 700; }
.cats { margin-bottom: 14px; display: flex; flex-direction: column; gap: 8px; }
.cat-linha { display: grid; grid-template-columns: 160px 1fr 110px; gap: 12px; align-items: center; font-size: 14px; }
.cat-linha b { text-align: right; font-variant-numeric: tabular-nums; }
.barra-cat { height: 8px; background: var(--fundo); border-radius: 99px; overflow: hidden; }
.barra-cat i { display: block; height: 100%; background: var(--vermelho); opacity: .75; border-radius: 99px; }
.segmento { display: inline-flex; background: var(--fundo); border-radius: 10px; padding: 4px; gap: 4px; align-self: flex-start; }
.segmento label { flex-direction: row; cursor: pointer; }
.segmento input { position: absolute; opacity: 0; pointer-events: none; width: 1px; }
.segmento span { padding: 8px 14px; border-radius: 8px; font-weight: 600; color: var(--texto-2); }
.segmento input:checked + span { background: var(--superficie); color: var(--texto); box-shadow: var(--sombra); }
.segmento input:focus-visible + span { outline: 2px solid var(--faixa); }
.config-largo { grid-column: 1 / -1; }
.sicoob-topo { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.sicoob-topo h3 { margin-bottom: 4px; }
.sicoob-topo p { margin: 0; }
.sicoob-info { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; font-size: 14px; margin: 0 0 16px; padding: 12px 14px; background: var(--fundo); border-radius: 10px; }
.sicoob-info dt { color: var(--texto-3); font-weight: 700; }
.sicoob-info dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.txt-erro { color: var(--vermelho); }
.st-sic-ok { color: var(--verde); background: var(--verde-bg); }
.st-sic-erro { color: var(--vermelho); background: var(--vermelho-bg); }
.st-sic-nao { color: var(--cinza); background: var(--cinza-bg); }
@media (max-width: 640px) {
  .acoes-topo { margin-left: 0; width: 100%; }
  .acoes-topo .btn { flex: 1; }
  .resumo-mes { margin-left: 0; }
  .cat-linha { grid-template-columns: 1fr 90px; }
  .cat-linha .barra-cat { grid-column: 1 / -1; grid-row: 2; }
  .valor-moeda { font-size: 21px; }
  .sicoob-topo { flex-direction: column; }
}

/* ---------- manutenções ---------- */
.titulo-secao { font-size: 15px; font-weight: 700; margin: 4px 0 10px; }
.grade-urgentes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.urgente {
  text-align: left; background: var(--superficie); border: 1.5px solid var(--borda); border-radius: var(--raio);
  padding: 14px; display: flex; flex-direction: column; gap: 6px; box-shadow: var(--sombra); color: var(--texto);
  transition: transform .1s, border-color .15s;
}
.urgente:hover { transform: translateY(-1px); }
.urg-vencida { border-color: var(--vermelho-borda); }
.urg-proxima { border-color: var(--laranja-borda); }
.urg-topo { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.urg-rest { font-size: 13px; color: var(--texto-2); }
.urg-tipo { font-size: 14px; font-weight: 600; color: var(--texto-2); text-align: right; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.urg-num { font-size: 30px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; margin: 4px 0 2px; }
.urg-num small { font-size: 14px; font-weight: 500; color: var(--texto-2); }
.urg-num-txt { font-size: 20px; color: var(--txt-vermelho); }
.urg-pct { font-size: 12px; color: var(--texto-3); text-align: right; }
.urg-vencida { background: var(--vermelho-bg); }
.barra-uso { height: 6px; border-radius: 99px; background: var(--fundo); overflow: hidden; }
.barra-uso i { display: block; height: 100%; border-radius: 99px; background: var(--verde); }
.urg-vencida .barra-uso i { background: var(--vermelho); }
.urg-proxima .barra-uso i { background: var(--laranja); }
.st-man-vencida { color: var(--vermelho); background: var(--vermelho-bg); }
.st-man-proxima { color: var(--laranja); background: var(--laranja-bg); }
.st-man-ok { color: var(--verde); background: var(--verde-bg); }
.st-mcat-preventiva { color: var(--azul); background: var(--azul-bg); }
.st-mcat-corretiva { color: var(--laranja); background: var(--laranja-bg); }
.sel-filtro { width: auto; min-width: 220px; }
.btn-mini { height: 32px; padding: 0 10px; font-size: 13px; }
.barra-azul i { background: var(--azul); }
.medias { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.medias div { display: flex; justify-content: space-between; gap: 8px; padding: 10px 12px; background: var(--fundo); border-radius: 10px; font-size: 14px; }
.paineis + .painel-bloco { margin-top: 0; }
@media (max-width: 1100px) { .grade-urgentes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
  .grade-urgentes { grid-template-columns: 1fr; }
  .sel-filtro { width: 100%; }
}

/* ---------- dashboard ---------- */
.card-link { text-decoration: none; color: inherit; transition: transform .1s; }
.card-link:hover { transform: translateY(-1px); }
.card-valor-sub { font-size: 15px; font-weight: 600; color: var(--texto-2); letter-spacing: 0; }
.grafico { display: flex; align-items: flex-end; gap: 10px; height: 170px; padding-top: 8px; }
.g-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; }
.g-barras { flex: 1; width: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 4px; border-bottom: 1px solid var(--borda); }
.g-barras span { width: 40%; max-width: 22px; min-height: 2px; border-radius: 4px 4px 0 0; }
.g-ent { background: var(--verde); }
.g-sai { background: var(--vermelho); opacity: .8; }
.g-mes { font-size: 12px; color: var(--texto-3); font-weight: 600; text-transform: capitalize; }
.lista-venc { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.lista-venc li { display: grid; grid-template-columns: 48px 1fr auto; gap: 10px; align-items: center; font-size: 14px; }
.venc-data { font-weight: 800; color: var(--texto-2); font-variant-numeric: tabular-nums; }
.venc-nome { min-width: 0; }
.venc-nome small { display: block; color: var(--texto-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lista-venc b { font-variant-numeric: tabular-nums; }

/* ---------- rastreador ---------- */
.rastreio { display: grid; grid-template-columns: 330px 1fr; gap: 14px; height: calc(100vh - 110px); min-height: 520px; }
.rastreio-lado { display: flex; flex-direction: column; gap: 10px; min-height: 0; }
.rastreio-lado .busca { max-width: none; flex: none; }
.rastreio-resumo { display: flex; gap: 6px; flex-wrap: wrap; font-size: 12px; font-weight: 700; }
.rs { padding: 4px 9px; border-radius: 99px; }
.rs-movendo { background: var(--verde-bg); color: var(--verde); }
.rs-parado { background: var(--azul-bg); color: var(--azul); }
.rs-offline { background: var(--cinza-bg); color: var(--texto-2); }
.rastreio-lista { flex: 1; overflow-y: auto; background: var(--superficie); border-radius: var(--raio); box-shadow: var(--sombra); padding: 6px; }
.rv { display: grid; grid-template-columns: 12px 1fr auto; gap: 10px; align-items: center; width: 100%; text-align: left;
  border: 0; background: none; padding: 10px; border-radius: 10px; color: var(--texto); }
.rv:hover { background: var(--fundo); }
.rv.ativo { background: var(--acento-bg); }
.rv-info { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rv-linha { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; }
.rv-info small { color: var(--texto-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rv-est { font-size: 12px; color: var(--texto-2); font-weight: 600; text-align: right; }
.rv-titulo { margin: 14px 10px 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--texto-3); }
.rv-sem { grid-template-columns: auto 1fr auto; }
.pad { padding: 12px; margin: 0; }
.ponto { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.p-movendo { background: var(--verde); box-shadow: 0 0 0 3px var(--verde-borda); }
.p-parado { background: var(--azul); }
.p-offline, .p-semsinal { background: var(--cinza); }
.rastreio-mapa-area { isolation: isolate; position: relative; min-height: 0; border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra); background: var(--fundo-2); }
.rastreio-mapa { position: absolute; inset: 0; }
.mk-wrap { background: none; border: 0; }
.mk { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; border: 3px solid #fff; box-shadow: 0 2px 8px rgba(0,0,0,.35); }
.mk-movendo { background: var(--verde); }
.mk-parado { background: var(--azul); }
.mk-offline, .mk-semsinal { background: var(--cinza); }
.mk-sel { outline: 3px solid var(--faixa); outline-offset: 2px; }
.mk { position: relative; color: #fff; }
.mk-glifo { width: 18px; height: 18px; fill: currentColor; }
.mk-rot { position: absolute; inset: -9px; pointer-events: none; }
.mk-dir { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 0; height: 0;
  border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 7px solid var(--verde); }
.mk-bloq { box-shadow: 0 0 0 3px var(--vermelho), 0 2px 8px rgba(0,0,0,.35); }
.mk-placa { position: absolute; top: 36px; left: 50%; transform: translateX(-50%); white-space: nowrap; font: 600 10px/1.1 'Plus Jakarta Sans', sans-serif;
  background: #fff; color: var(--marinho); padding: 3px 6px; border-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.3);
  max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.mk-placa b { font-weight: 800; letter-spacing: .04em; }
.mk-grupo { display: grid; place-items: center; border-radius: 50%; background: var(--marinho); color: #fff; font: 800 13px/1 'Plus Jakarta Sans', sans-serif;
  border: 3px solid #fff; box-shadow: 0 0 0 4px var(--acento-anel), 0 2px 8px rgba(0,0,0,.35); }
.mapa-botao { background: var(--superficie); color: var(--texto); border: 0; border-radius: 8px; padding: 7px 10px; font: 600 12px/1 'Plus Jakarta Sans', sans-serif;
  box-shadow: 0 1px 5px rgba(0,0,0,.3); cursor: pointer; }
.mapa-botao:hover { background: var(--fundo); }
.selo-tipo { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--txt-azul); background: var(--azul-bg);
  padding: 2px 6px; border-radius: 4px; vertical-align: 2px; }
.rastreio-detalhe {
  position: absolute; top: 12px; right: 12px; bottom: 12px; width: 340px; z-index: 1001; overflow-y: auto;
  background: var(--superficie); border-radius: 14px; box-shadow: 0 10px 40px rgba(0,0,0,.25); padding: 16px;
  display: flex; flex-direction: column; gap: 12px;
}
.rd-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.rd-est { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 13px; color: var(--texto-2); font-weight: 600; }
.rd-dados { margin: 0; display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.rd-dados > div { display: grid; grid-template-columns: 110px 1fr; gap: 8px; }
.rd-dados dt { color: var(--texto-3); font-weight: 600; font-size: 13px; }
.rd-dados dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.rd-dados small { display: block; color: var(--texto-3); font-size: 12px; }
.tag-ok { color: var(--verde); font-weight: 700; }
.rd-km .rot { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); }
.km7-barras { display: flex; gap: 6px; height: 96px; align-items: flex-end; margin: 8px 0 6px; }
.km7-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 3px; }
.km7-bar { width: 100%; max-width: 26px; background: var(--faixa); border-radius: 4px 4px 0 0; }
.km7-val { font-size: 10px; font-weight: 700; color: var(--texto-2); }
.km7-dia { font-size: 11px; color: var(--texto-3); text-transform: capitalize; }
.rd-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.rd-acoes .btn { flex: 1 1 auto; }
.rota-info { position: absolute; left: 12px; bottom: 12px; right: 364px; z-index: 1001; background: var(--asfalto); color: #fff;
  padding: 10px 14px; border-radius: 10px; font-size: 13px; box-shadow: var(--sombra); }
.rota-info .link { color: var(--faixa); margin-left: 8px; }
.rs-atraso { background: var(--laranja-bg); color: var(--txt-laranja); border: 0; font: inherit; cursor: pointer; }
.rs-atraso.ativo { outline: 2px solid var(--laranja); }
.rs-bloq { background: var(--vermelho-bg); color: var(--txt-vermelho); }
.selo-bloq { display: block; margin-top: 3px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  color: var(--txt-vermelho); background: var(--vermelho-bg); padding: 2px 6px; border-radius: 4px; }
.selo-bloq.aguardando { color: var(--txt-azul); background: var(--azul-bg); }
.selo-bloq.atraso { color: var(--txt-laranja); background: var(--laranja-bg); }
.rd-bloq { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--borda); padding-top: 12px; }
.rd-bloq .faixa-info { margin: 0; }
.rd-bloq-topo { display: flex; justify-content: space-between; align-items: center; }
.rd-bloq-topo .rot { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); }
.rd-bloq-acoes { display: flex; flex-wrap: wrap; gap: 6px; }
.rd-bloq-acoes .btn { flex: 1 1 auto; }
.faixa-info.aviso-atraso { background: var(--laranja-bg); color: var(--txt-laranja); border-color: var(--laranja-borda); }
.faixa-info.alerta-suave { background: var(--azul-bg); color: var(--txt-azul); }
.sem-margem { margin: 0; }
.lista-regras { margin: 6px 0 0; padding-left: 18px; line-height: 1.5; font-size: 13px; }
.aviso-bloq { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 10px 12px; border: 1px dashed var(--borda-forte); border-radius: 10px; }
.check span { line-height: 1.4; }
.hist-bloq { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.hist-bloq li { border: 1px solid var(--borda); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.hist-bloq small { color: var(--texto-3); }
.hb-topo { display: flex; justify-content: space-between; align-items: center; }
.hb-st { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 99px; background: var(--cinza-bg); color: var(--texto-2); }
.hb-enviado { background: var(--verde-bg); color: var(--txt-verde); }
.hb-aguardando { background: var(--azul-bg); color: var(--txt-azul); }
.hb-falhou, .hb-expirado { background: var(--vermelho-bg); color: var(--txt-vermelho); }
.rastreio-setup { text-align: left; }
.rastreio-setup h2, .rastreio-setup .vazio-icone { text-align: center; }
.passos-setup { color: var(--texto-2); line-height: 1.7; padding-left: 20px; }
.rastreio-setup .btn { display: flex; margin: 16px auto 0; width: fit-content; }
@media (max-width: 900px) {
  .rastreio { grid-template-columns: 1fr; height: auto; }
  .rastreio-mapa-area { height: 62vh; order: -1; }
  .rastreio-lista { max-height: none; }
  .rastreio-detalhe { position: fixed; top: auto; left: 0; right: 0; bottom: 0; width: auto; max-height: 72vh; border-radius: 16px 16px 0 0; z-index: 1100; }
  .rota-info { right: 12px; }
}

/* ---------- dashboard (novo) ---------- */
.boas-vindas { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.boas-vindas h2 { font-size: 22px; font-weight: 800; }
.boas-acoes { display: flex; gap: 8px; }
.btn { text-decoration: none; }
.tile-acento { background: var(--acento-bg); color: var(--acento-forte); }
.tile-verde { background: var(--verde-bg); color: var(--verde); }
.tile-vermelho { background: var(--vermelho-bg); color: var(--vermelho); }
.tile-laranja { background: var(--laranja-bg); color: var(--laranja); }
.tile-azul { background: var(--azul-bg); color: var(--azul); }
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.kpi {
  background: var(--superficie); border: 1px solid var(--borda); border-radius: 14px; box-shadow: var(--sombra);
  padding: 18px 18px 16px; display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit;
  transition: border-color .15s, transform .15s;
}
.kpi:hover { border-color: var(--borda-forte); transform: translateY(-1px); }
.kpi-alerta { border-color: var(--vermelho-borda); }
.kpi-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.kpi-rotulo { font-size: 13px; font-weight: 600; color: var(--texto-2); }
.kpi-ic { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; }
.kpi-valor { font-size: 28px; font-weight: 800; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; line-height: 1.15; }
.kpi-valor small { font-size: 14px; font-weight: 600; color: var(--texto-3); letter-spacing: 0; }
.txt-vermelho { color: var(--vermelho); }
.kpi-sub { font-size: 12.5px; color: var(--texto-3); }
.kpi-sub b { color: var(--texto-2); }
.kpi-partes { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--texto-2); font-weight: 600; }
.kpi-partes i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }
.kpi-barra { height: 6px; border-radius: 99px; background: var(--fundo); overflow: hidden; margin: 4px 0 0; }
.kpi-barra span { display: block; height: 100%; border-radius: 99px; background: var(--acento); }
.kpi-var { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 700; width: fit-content; padding: 2px 8px; border-radius: 99px; }
.kpi-var.pos { color: var(--verde); background: var(--verde-bg); }
.kpi-var.neg { color: var(--vermelho); background: var(--vermelho-bg); }

.dash-grade { display: grid; grid-template-columns: 1.55fr 1fr; gap: 16px; }
.painel-bloco { border-radius: 14px; padding: 18px 20px; }
.bloco-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.bloco-cab h3 { margin: 0 !important; font-size: 15px; font-weight: 700; }
.bloco-cab a { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; text-decoration: none; }
.contador { min-width: 24px; height: 22px; padding: 0 7px; border-radius: 99px; background: var(--vermelho-bg); color: var(--vermelho); font-size: 12px; font-weight: 800; display: grid; place-items: center; }
.bloco-vazio { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; color: var(--texto-3); font-size: 14px; padding: 28px 12px; min-height: 160px; }
.bloco-vazio > .ic { color: var(--texto-3); opacity: .7; }
.dash-grafico .grafico { height: 220px; }
.legenda-linha { display: flex; gap: 18px; margin-top: 12px; }
.legenda-linha i { border-radius: 3px; }
.alertas-lista { list-style: none; margin: -4px -8px 0; padding: 0; display: flex; flex-direction: column; }
.alerta-item { display: flex; align-items: center; gap: 12px; padding: 9px 8px; border-radius: 10px; text-decoration: none; color: var(--texto); }
.alerta-item:hover { background: var(--hover); }
.alerta-ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex-shrink: 0; }
.alerta-txt { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.alerta-txt b { font-size: 13.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.alerta-txt small { font-size: 12.5px; color: var(--texto-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.alerta-seta { color: var(--texto-3); opacity: 0; transition: opacity .15s; }
.alerta-item:hover .alerta-seta { opacity: 1; }
.tabela-mini-wrap { margin: 0 -20px -18px; overflow-x: auto; }
.tabela-mini { min-width: 520px; }
.tabela-mini th { background: var(--fundo-2); }
.tabela-mini th:first-child, .tabela-mini td:first-child { padding-left: 20px; }
.tabela-mini td { padding: 10px 16px; font-size: 14px; }
.tabela-mini td b { font-weight: 700; }
.venc-data.hoje { color: var(--acento-forte); }
.lista-venc li { padding-bottom: 10px; border-bottom: 1px solid var(--borda); }
.lista-venc li:last-child { border-bottom: 0; padding-bottom: 0; }
.vazio .ic { color: var(--texto-3); }
@media (max-width: 1180px) { .kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 900px) { .dash-grade { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .kpis { gap: 10px; }
  .kpi { padding: 14px; }
  .kpi-valor { font-size: 22px; }
  .kpi-ic { width: 34px; height: 34px; }
  .boas-acoes { width: 100%; }
  .boas-acoes .btn { flex: 1; }
}
@media (max-width: 420px) { .kpis { grid-template-columns: 1fr; } }
:root[data-tema="escuro"] .leaflet-bar a { background: var(--superficie-2); color: var(--texto); border-color: var(--borda); }
:root[data-tema="escuro"] .leaflet-control-attribution { background: rgba(18, 27, 43, .8) !important; color: var(--texto-3); }
.bloco-sub { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--borda); }
.bloco-sub h4 { margin: 0; font-size: 15px; }

/* ---------- utilitários novos ---------- */
.roda-mini { width: 22px; height: 22px; border-width: 3px; margin: 6px auto; }
.txt-alerta { color: var(--txt-laranja); }
.selo-restrito { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #fff;
  background: var(--vermelho); padding: 2px 6px; border-radius: 4px; vertical-align: 2px; cursor: help; }
fieldset.restricao { border-color: var(--vermelho-borda); }

/* ---------- vistoria ---------- */
.det-vistorias { display: flex; flex-direction: column; gap: 8px; }
.det-vistorias .rot { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); }
.vist-cartoes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vist-cartao { border: 1.5px dashed var(--borda-forte); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 6px; }
.vist-cartao.feita { border-style: solid; border-color: var(--verde-borda); background: var(--verde-bg); }
.vist-cartao-topo { display: flex; align-items: center; gap: 8px; }
.vist-cartao.feita .vist-cartao-topo .ic { color: var(--verde); }
.vist-cartao small { color: var(--texto-2); font-size: 13px; }
.vist-cartao-acoes { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 2px; }
.vist-ref { margin: 0; }
.vist-tanque { width: 100%; accent-color: var(--acento); margin-top: 6px; height: 28px; }
.vist-tanque-escala { display: flex; justify-content: space-between; font-size: 11px; color: var(--texto-3); font-weight: 500; }
.vist-acoes-rapidas { display: flex; justify-content: flex-end; margin: -4px 0 4px; }
.vist-itens { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 18px; }
.vist-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--borda); font-size: 14px; }
.seg { display: inline-flex; border: 1px solid var(--borda-forte); border-radius: 8px; overflow: hidden; flex-shrink: 0; }
.seg-op { margin: 0; cursor: pointer; }
.seg-op input { position: absolute; opacity: 0; pointer-events: none; }
.seg-op span { display: block; padding: 6px 10px; font-size: 12px; font-weight: 700; color: var(--texto-3); min-width: 44px; text-align: center; }
.seg-op + .seg-op span { border-left: 1px solid var(--borda-forte); }
.seg-op input:focus-visible + span { outline: 2px solid var(--acento); outline-offset: -2px; }
.seg-ok input:checked + span { background: var(--verde); color: #fff; }
.seg-avaria input:checked + span { background: var(--vermelho); color: #fff; }
.seg-na input:checked + span { background: var(--cinza); color: #fff; }
.vist-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.vist-foto { position: relative; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.vist-foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; background: var(--fundo); display: block; }
.vist-foto input { height: 32px; font-size: 12px; padding: 0 8px; }
.vist-foto-x { position: absolute; top: 4px; right: 4px; background: var(--superficie); width: 28px; height: 28px; box-shadow: var(--sombra); }
.vist-add { width: fit-content; cursor: pointer; }
.vist-aviso { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 0; }

/* ---------- documentos ---------- */
.docs { display: flex; flex-direction: column; gap: 14px; }
.docs-enviar { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.docs-enviar label:first-child { flex: 1; min-width: 180px; }
.docs-enviar .btn { cursor: pointer; }
.docs-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.doc-item { position: relative; margin: 0; border: 1px solid var(--borda); border-radius: 12px; overflow: hidden; background: var(--superficie); }
.doc-previa { display: block; aspect-ratio: 4 / 3; background: var(--fundo); }
.doc-previa img { width: 100%; height: 100%; object-fit: cover; display: block; }
.doc-pdf { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-weight: 800; color: var(--texto-2); }
.doc-item figcaption { padding: 8px 10px; display: flex; flex-direction: column; }
.doc-item figcaption small { color: var(--texto-3); font-size: 12px; }
.doc-item .btn-icone { position: absolute; top: 6px; right: 6px; background: var(--superficie); box-shadow: var(--sombra); }

/* ---------- importação ---------- */
.importar-passos { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; color: var(--texto-2); font-size: 14px; line-height: 1.5; }
.importar-arquivo { width: fit-content; cursor: pointer; }
.importar-resumo { margin: 4px 0 8px; }
.importar-tabela { max-height: 46vh; overflow: auto; }
.importar-tabela .tabela td { font-size: 13px; padding-top: 8px; padding-bottom: 8px; }
.imp-erro td { background: var(--vermelho-bg); }

/* ---------- agenda ---------- */
.agenda-periodo { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: 14px; color: var(--texto-2); }
.agenda-periodo select { width: auto; height: 38px; }
.agenda-bloco { margin-bottom: 20px; }
.agenda-bloco h3 { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--texto-3); margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
.agenda-bloco h3 span { background: var(--cinza-bg); color: var(--texto-2); border-radius: 99px; padding: 1px 8px; font-size: 12px; }
.agenda-atrasado h3, .agenda-hoje h3 { color: var(--vermelho); }
.agenda-atrasado h3 span, .agenda-hoje h3 span { background: var(--vermelho-bg); color: var(--txt-vermelho); }
.agenda-itens { list-style: none; margin: 0; padding: 0; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio); overflow: hidden; }
.agenda-itens li + li { border-top: 1px solid var(--borda); }
.agenda-item { display: flex; align-items: center; gap: 14px; padding: 12px 16px; text-decoration: none; color: inherit; }
.agenda-item:hover { background: var(--hover); }
.agenda-data { display: flex; flex-direction: column; min-width: 74px; }
.agenda-data b { font-size: 16px; font-variant-numeric: tabular-nums; }
.agenda-data small { font-size: 12px; color: var(--texto-3); }
.agenda-atrasado .agenda-data small { color: var(--vermelho); font-weight: 600; }
.agenda-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--cinza-bg); color: var(--texto-2); flex-shrink: 0; }
.agenda-ic-devolucao { background: var(--azul-bg); color: var(--txt-azul); }
.agenda-ic-ipva, .agenda-ic-licenciamento, .agenda-ic-seguro { background: var(--laranja-bg); color: var(--txt-laranja); }
.agenda-ic-manutencao { background: var(--acento-bg); color: var(--acento-forte); }
.agenda-ic-multa_indicacao, .agenda-ic-multa_vencimento { background: var(--vermelho-bg); color: var(--txt-vermelho); }
.agenda-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.agenda-txt strong { font-size: 14px; }
.agenda-txt small { color: var(--texto-2); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agenda-seta { color: var(--texto-3); flex-shrink: 0; }

@media (max-width: 640px) {
  .vist-cartoes, .vist-itens { grid-template-columns: 1fr; }
  .agenda-periodo { margin-left: 0; }
  .agenda-item { gap: 10px; padding: 12px; }
  .agenda-data { min-width: 58px; }
}
label.btn, .form label.btn { display: inline-flex; flex-direction: row; align-items: center; gap: 8px; cursor: pointer; }

/* ---------- cercas ---------- */
.cercas { display: flex; flex-direction: column; gap: 12px; }
.cercas h4 { margin: 6px 0 0; font-size: 14px; }
.cercas-topo { display: flex; align-items: center; justify-content: space-between; }
.cercas-itens, .cercas-eventos { list-style: none; margin: 0; padding: 0; border: 1px solid var(--borda); border-radius: 12px; overflow: hidden; }
.cercas-itens li, .cercas-eventos li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; }
.cercas-itens li + li, .cercas-eventos li + li { border-top: 1px solid var(--borda); }
.cerca-txt { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.cerca-txt small, .cercas-eventos small { color: var(--texto-3); font-size: 12px; }
.cercas-eventos small { margin-left: auto; }
.cercas-eventos { max-height: 260px; overflow-y: auto; }
.mapa-cerca { height: 320px; border-radius: 12px; overflow: hidden; border: 1px solid var(--borda); }
.cerca-veics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 12px; max-height: 180px; overflow-y: auto; }
@media (max-width: 640px) { .cerca-veics { grid-template-columns: 1fr; } .mapa-cerca { height: 260px; } }

/* ---------- relatórios / investidores ---------- */
.card-valor-medio { font-size: 26px; }
.dre-wrap { overflow-x: auto; }
.dre { min-width: 760px; }
.dre td:first-child, .dre th:first-child { position: sticky; left: 0; background: var(--superficie); z-index: 1; min-width: 190px; }
.dre td.num, .dre th.num { white-space: nowrap; font-size: 13px; }
.dre-grupo td { font-weight: 800; background: var(--fundo-2); }
.dre-grupo td:first-child { background: var(--fundo-2); }
.dre-sub td:first-child { padding-left: 28px; color: var(--texto-2); }
.dre-total td { font-weight: 800; border-top: 2px solid var(--borda-forte); font-size: 14px !important; }
.investidor-intro { max-width: 60ch; }
.inv-veics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 12px; max-height: 220px; overflow-y: auto; }
.tabela-compacta td, .tabela-compacta th { padding-top: 8px; padding-bottom: 8px; font-size: 13px; }
@media (max-width: 640px) { .inv-veics { grid-template-columns: 1fr; } }
.tiles-escuros{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.88) saturate(.6)}

/* Página de reservas e interessados */
.vit-endereco { display: flex; align-items: stretch; border: 1px solid var(--borda); border-radius: 10px; overflow: hidden; background: var(--superficie); }
.vit-endereco > span { display: flex; align-items: center; padding: 0 10px; background: var(--fundo); color: var(--texto-2); font-size: 14px; white-space: nowrap; border-right: 1px solid var(--borda); }
.vit-endereco input { border: 0 !important; border-radius: 0 !important; flex: 1; min-width: 0; box-shadow: none !important; }
.vit-veic { display: flex; gap: 14px; align-items: flex-start; }
.vit-foto { width: 150px; aspect-ratio: 16 / 10; flex: none; border-radius: 10px; overflow: hidden; background: var(--fundo); border: 1px dashed var(--borda);
  display: grid; place-items: center; color: var(--texto-3); font-size: 13px; }
.vit-foto img { width: 100%; height: 100%; object-fit: cover; }
.vit-campos { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.vit-btn { align-self: end; height: 40px; }
@media (max-width: 640px) { .vit-veic { flex-direction: column; } .vit-foto { width: 100%; } }
.int-link { margin-bottom: 14px; }
.int-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
.int-fotos figure { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.int-fotos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; border: 1px solid var(--borda); cursor: zoom-in; }
.int-fotos figcaption { font-size: 12px; font-weight: 700; color: var(--texto-2); }
.tabela tr.linha-nova td:first-child { box-shadow: inset 3px 0 0 var(--laranja); }
.tabela tr[data-id] { cursor: pointer; }

/* ---------- Seu plano (Configurações) ---------- */
.seu-plano { display: grid; gap: 16px; }
.plano-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.plano-topo h3 { display: flex; align-items: center; gap: 8px; margin-bottom: 4px !important; }
.plano-topo h3 .ic { color: var(--acento); }
.plano-titulo { margin: 0 0 4px; font-size: 18px; font-weight: 800; }
.plano-topo .muted { margin: 0; max-width: 60ch; }
.usos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.uso { padding: 12px 14px; border: 1px solid var(--borda); border-radius: 12px; display: grid; gap: 6px; }
.uso-topo { display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.uso-topo span { display: inline-flex; align-items: center; gap: 6px; color: var(--texto-2); font-weight: 600; }
.uso-topo b { font-variant-numeric: tabular-nums; }
.uso-barra { height: 8px; border-radius: 99px; background: var(--fundo); overflow: hidden; }
.uso-barra i { display: block; height: 100%; border-radius: 99px; background: var(--acento); }
.uso.quase .uso-barra i { background: var(--laranja); }
.uso.cheio { border-color: var(--vermelho-borda); }
.uso.cheio .uso-barra i { background: var(--vermelho); }
.uso small { font-size: 12.5px; }
.planos-mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.plano-mini { position: relative; padding: 14px; border: 1px solid var(--borda); border-radius: 12px; display: grid; gap: 2px; font-size: 13px; color: var(--texto-2); }
.plano-mini b { color: var(--texto); font-size: 15px; }
.plano-mini strong { color: var(--texto); font-size: 20px; letter-spacing: -0.02em; margin: 2px 0 4px; }
.plano-mini strong small { font-size: 12px; color: var(--texto-3); font-weight: 600; }
.plano-mini.atual, .plano-mini.indicado { border-color: var(--acento); box-shadow: 0 0 0 3px var(--acento-bg); }
.pm-selo { position: absolute; top: -10px; right: 10px; background: var(--acento); color: #06201F; font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 99px; }
.seu-plano > .link { display: inline-flex; align-items: center; gap: 6px; width: fit-content; }
@media (max-width: 720px) {
  .usos, .planos-mini { grid-template-columns: 1fr; }
}

/* ---------- Funil de vendas (equipe Rodar) ---------- */
.funil-cab { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.funil-cab p { margin: 0; max-width: 70ch; }
.funil-cab code, .funil-grade code { font-size: 12px; background: var(--fundo); padding: 1px 5px; border-radius: 5px; }
.funil-bloco { margin-bottom: 16px; }
.funil { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.funil li { display: grid; grid-template-columns: 240px 1fr 150px; gap: 16px; align-items: center; }
.funil-txt b { display: block; font-size: 14.5px; }
.funil-txt small { color: var(--texto-3); font-size: 12px; }
.funil-barra { height: 14px; border-radius: 99px; background: var(--fundo); overflow: hidden; }
.funil-barra i { display: block; height: 100%; border-radius: 99px; background: var(--acento); transition: width .4s ease-out; }
.funil li:last-child .funil-barra i { background: var(--verde); }
.funil-num { text-align: right; }
.funil-num strong { display: block; font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.1; }
.funil-num small { color: var(--texto-3); font-size: 12px; }
.funil-total { display: flex; align-items: center; gap: 6px; margin: 16px 0 0; padding-top: 14px; border-top: 1px solid var(--borda); color: var(--texto-2); font-size: 14px; }
.funil-total .ic { color: var(--verde); }
.funil-apoio .kpi:hover { transform: none; }
.funil-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.funil-grade .tabela { min-width: 0; }
.demo-funil { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; font-size: 13.5px; }
.demo-funil li { display: grid; grid-template-columns: 110px 1fr 36px; gap: 10px; align-items: center; }
.demo-funil .funil-barra { height: 10px; }
.demo-funil b { text-align: right; font-variant-numeric: tabular-nums; }
.demo-funil li.fim .funil-barra i { background: var(--verde); }
@media (max-width: 900px) {
  .funil li { grid-template-columns: 1fr 90px; }
  .funil-barra { grid-column: 1 / -1; grid-row: 2; }
  .funil-grade { grid-template-columns: 1fr; }
}
.funil-dica { margin: 30px 0 0; }

/* Seu plano: mensalidade por veículo */
.mensal { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.mensal-item { padding: 12px 14px; border: 1px solid var(--borda); border-radius: 12px; display: grid; gap: 2px; }
.mensal-item span { font-size: 12.5px; color: var(--texto-2); font-weight: 600; }
.mensal-item b { font-size: 20px; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.mensal-item b small { font-size: 12px; color: var(--texto-3); font-weight: 600; letter-spacing: 0; }
.mensal-item.destaque { border-color: var(--acento); box-shadow: 0 0 0 3px var(--acento-bg); }
.mensal-regra { display: flex; gap: 6px; align-items: flex-start; margin: 0; }
.mensal-regra .ic { flex-shrink: 0; margin-top: 2px; color: var(--acento); }
@media (max-width: 720px) { .mensal { grid-template-columns: 1fr 1fr; } }

/* ---------- Painel Rodar (superadministrador) ---------- */
.admin-grade { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; margin-bottom: 16px; }
.admin-semanas { display: flex; align-items: flex-end; gap: 8px; height: 150px; padding-top: 8px; }
.admin-semana { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; min-width: 0; }
.admin-semana i { width: 100%; max-width: 36px; border-radius: 6px 6px 2px 2px; background: var(--acento); }
.admin-semana b { font-size: 12.5px; font-variant-numeric: tabular-nums; }
.admin-semana small { font-size: 11px; color: var(--texto-3); }
.admin-preco { margin: 0 0 12px; display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; font-size: 14px; }
.admin-preco dt { color: var(--texto-2); }
.admin-preco dd { margin: 0; font-weight: 700; text-align: right; }
.admin-preco + p code { font-size: 12px; background: var(--fundo); padding: 1px 5px; border-radius: 5px; }
.admin-busca { margin-left: auto; }
.admin-lista .tabela td { vertical-align: top; }
.admin-st { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: 12px; font-weight: 700; }
.admin-st-teste { background: var(--laranja-bg); color: var(--laranja); }
.admin-st-vencido { background: var(--vermelho-bg); color: var(--vermelho); }
.admin-st-ativa { background: var(--verde-bg); color: var(--verde); }
.admin-st-cortesia { background: var(--azul-bg); color: var(--azul); }
.admin-st-suspensa { background: var(--cinza-bg); color: var(--cinza); }
.admin-usa { white-space: nowrap; }
.admin-usa span { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; color: var(--texto-3); opacity: .35; }
.admin-usa span.on { opacity: 1; color: var(--acento-forte); background: var(--acento-bg); }
.admin-acoes { white-space: nowrap; text-align: right; }
.admin-acoes .btn-icone { display: inline-grid; vertical-align: middle; color: var(--verde); }
.admin-obs { display: flex !important; gap: 4px; align-items: center; color: var(--texto-2) !important; font-style: italic; }
.admin-atalhos { display: flex; gap: 8px; margin-top: -4px; }
@media (max-width: 900px) { .admin-grade { grid-template-columns: 1fr; } }
.admin-lista .tabela td:nth-child(2) { min-width: 150px; } .admin-st { white-space: nowrap; }
.admin-excluir-btn { margin-right: auto; }
.admin-perigo { display: flex; gap: 12px; padding: 12px 14px; border-radius: 12px; background: var(--vermelho-bg); border: 1px solid var(--vermelho-borda); color: var(--texto); font-size: 14px; line-height: 1.5; }
.admin-perigo > .ic { color: var(--vermelho); flex-shrink: 0; margin-top: 2px; }
.admin-perigo b { display: block; color: var(--vermelho); }

/* ---------- Modo Administração ---------- */
.chip-admin { background: var(--marinho); border-color: var(--marinho); }
.chip-admin .empresa-ic { background: rgba(22, 166, 161, .25); color: #5FD6D0; }
.chip-admin .empresa-nome { color: #fff; }
.chip-admin .empresa-plano { color: #5FD6D0 !important; }
.troca-modo { margin: -2px 12px 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 3px; border-radius: 10px; background: var(--fundo); border: 1px solid var(--borda); }
.troca-modo button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 30px; min-width: 0; overflow: hidden; text-overflow: ellipsis; border: 0; border-radius: 7px; background: none; color: var(--texto-2); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.troca-modo button.ativo { background: var(--superficie); color: var(--texto); box-shadow: var(--sombra); }
body.menu-recolhido .troca-modo { display: none; }
.vira { transform: rotate(180deg); }
.kpis-3 { grid-template-columns: repeat(3, 1fr); }
.admin-alertas { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.admin-alertas a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--borda); text-decoration: none; color: var(--texto); }
.admin-alertas a:hover { border-color: var(--acento); background: var(--fundo-2); }
.admin-alertas a > span:nth-child(2) { flex: 1; min-width: 0; display: grid; }
.admin-alertas b { font-size: 14px; font-weight: 600; }
.admin-alertas small { color: var(--texto-3); font-size: 12.5px; }
.admin-alertas a > .ic:last-child { color: var(--texto-3); }
.notif-laranja { background: var(--laranja-bg); color: var(--laranja); }
.admin-mens-pendente { background: var(--azul-bg); color: var(--azul); }
.admin-mens-atrasada { background: var(--vermelho-bg); color: var(--vermelho); }
.admin-mens-paga { background: var(--verde-bg); color: var(--verde); }
.admin-mens-cancelada { background: var(--cinza-bg); color: var(--cinza); }
.ficha-topo { display: grid; gap: 10px; margin-bottom: 16px; }
.ficha-topo > .link { display: inline-flex; align-items: center; gap: 6px; width: fit-content; font-weight: 600; text-decoration: none; }
.ficha-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.ficha-cab h2 { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 6px; }
.ficha-cab p { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13.5px; }
.ficha-cab .admin-obs { margin-top: 8px; }
.ficha-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.ficha-kpis .kpi:hover { transform: none; }
.ficha-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; margin-bottom: 16px; }
.ficha-usuarios { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 8px; }
.ficha-usuarios li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--borda); border-radius: 10px; }
.fu-txt { flex: 1; min-width: 0; display: grid; gap: 1px; }
.fu-txt b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; }
.fu-txt small { color: var(--texto-3); font-size: 12.5px; }
.ficha-perigo { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; border-color: var(--vermelho-borda); }
.ficha-perigo h3 { margin-bottom: 4px !important; color: var(--vermelho); }
.ficha-perigo p { margin: 0; }
.cabecalho-lista .sel-filtro { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13.5px; color: var(--texto-2); min-width: 0; }
.cabecalho-lista .sel-filtro select { min-width: 200px; }
@media (max-width: 900px) {
  .ficha-grade, .kpis-3 { grid-template-columns: 1fr; }
}
.mensal-hist { border-top: 1px solid var(--borda); padding-top: 12px; display: grid; gap: 8px; }
.mensal-hist b { font-size: 14px; }
.mensal-hist ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.mensal-hist li { display: grid; grid-template-columns: 1.4fr 1fr auto 1.4fr; gap: 10px; align-items: center; font-size: 13.5px; }
.mensal-hist li span:first-child { text-transform: capitalize; }
.mensal-hist small { color: var(--texto-3); text-align: right; }
.ficha-grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ficha-grade .tabela, .admin-grade .tabela { min-width: 0; }
.busca-global[hidden] + .topo-acoes { margin-left: auto; }
.ficha-largo { grid-column: 1 / -1; }