:root {
    --sb-bg: #0f1f2e;
    --sb-fg: #b7c4d1;
    --sb-active: #1f8a5b;
    --accent: #1f8a5b;
    --accent-soft: #e6f4ec;
    --page-bg: #f3f5f8;
}

body { background: var(--page-bg); font-size: .925rem; }
.app { display: flex; min-height: 100vh; }

/* Sidebar */
.sidebar {
    width: 240px; flex-shrink: 0; background: var(--sb-bg); color: var(--sb-fg);
    display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
}
.sidebar .brand { padding: 1.1rem 1.25rem; color: #fff; font-weight: 700; font-size: 1.1rem; letter-spacing: .3px; }
.sidebar .brand i { color: #3ddc97; }
.sidebar .saldo-box {
    margin: 0 1rem 1rem; padding: .7rem .9rem; border-radius: .6rem; background: rgba(255,255,255,.06);
}
.sidebar .saldo-box .valor { color: #fff; font-size: 1.35rem; font-weight: 700; line-height: 1.1; }
.sidebar .saldo-box.baixo { background: rgba(220,53,69,.25); }
.sidebar .nav-link {
    color: var(--sb-fg); padding: .55rem 1.25rem; display: flex; align-items: center; gap: .65rem; border-left: 3px solid transparent;
}
.sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.04); }
.sidebar .nav-link.active { color: #fff; background: rgba(61,220,151,.08); border-left-color: #3ddc97; }
.sidebar .secao { font-size: .7rem; text-transform: uppercase; letter-spacing: 1px; padding: 1rem 1.25rem .3rem; opacity: .55; }
.sidebar .rodape { margin-top: auto; padding: 1rem 1.25rem; font-size: .8rem; border-top: 1px solid rgba(255,255,255,.07); }

.content { flex: 1; padding: 1.5rem 2rem; min-width: 0; }
.page-title { font-weight: 700; margin-bottom: .2rem; }
.page-sub { color: #6c7a89; margin-bottom: 1.25rem; }

.card { border: 0; border-radius: .75rem; box-shadow: 0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.04); }
.card-header { background: transparent; border-bottom: 1px solid #edf0f3; font-weight: 600; }

.kpi .rotulo { color: #6c7a89; font-size: .8rem; text-transform: uppercase; letter-spacing: .5px; }
.kpi .numero { font-size: 1.75rem; font-weight: 700; line-height: 1.2; }
.kpi .icone {
    width: 42px; height: 42px; border-radius: .6rem; display: grid; place-items: center; font-size: 1.25rem;
    background: var(--accent-soft); color: var(--accent);
}

.btn-primary { --bs-btn-bg: var(--accent); --bs-btn-border-color: var(--accent); --bs-btn-hover-bg: #187148; --bs-btn-hover-border-color: #187148; --bs-btn-active-bg: #145f3d; }
.table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .4px; color: #6c7a89; font-weight: 600; background: #fafbfc; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.progress-lote { height: 8px; background: #edf0f3; }

/* Conversa com o rastreador */
.conversa { display: flex; flex-direction: column; gap: .6rem; max-height: 560px; overflow-y: auto; padding: .5rem; }
.balao { max-width: 75%; padding: .55rem .8rem; border-radius: .8rem; word-break: break-word; }
.balao.enviado { align-self: flex-end; background: var(--accent-soft); border-bottom-right-radius: .2rem; }
.balao.recebido { align-self: flex-start; background: #fff; border: 1px solid #e3e7ec; border-bottom-left-radius: .2rem; }
.balao .meta { font-size: .72rem; color: #7b8794; margin-top: .2rem; }

.contador-sms { font-size: .8rem; color: #6c7a89; }
.contador-sms.utf8 { color: #b26b00; }

.lista-rastreadores { max-height: 420px; overflow-y: auto; }
.var-chip { font-size: .75rem; }

@media (max-width: 900px) {
    .app { flex-direction: column; }
    .sidebar { width: 100%; height: auto; position: static; }
    .content { padding: 1rem; }
}

/* Atualizacao automatica */
.auto-refresh { font-size: .8rem; color: #6c7a89; }
.auto-refresh .form-select { width: auto; padding-top: .1rem; padding-bottom: .1rem; font-size: .8rem; }
@keyframes pisca-atualizada { from { background-color: #fff3cd; } to { background-color: transparent; } }
@keyframes pisca-nova { from { background-color: #d1f2e0; } to { background-color: transparent; } }
.linha-atualizada > td, .linha-atualizada { animation: pisca-atualizada 2.5s ease-out; }
.linha-nova > td, .linha-nova { animation: pisca-nova 2.5s ease-out; }