/* =====================================================================
   Tema do Portal Operacional Cristal Sete
   Uma base só para todas as telas: cores, tipografia, cabeçalhos de página,
   filtros, cards, tabelas, gavetas de formulário e login.
   (Substitui painel.css e painel-2.css. Cards compactos e modo TV: monitor-compacto.css)
   ===================================================================== */

:root {
  --c7-azul: #003366;
  --c7-azul-2: #0b4a85;
  --c7-azul-claro: #e6eef7;
  --c7-fundo: #f3f5f9;
  --c7-superficie: #ffffff;
  --c7-superficie-2: #f8fafc;
  --c7-borda: #e5e9f0;
  --c7-borda-forte: #d5dce6;
  --c7-texto: #0f172a;
  --c7-texto-2: #334155;
  --c7-suave: #64748b;
  --c7-raio: 12px;
  --c7-raio-sm: 8px;
  --c7-sombra: 0 1px 2px rgba(15, 23, 42, .04), 0 2px 8px rgba(15, 23, 42, .04);
  --c7-sombra-alta: 0 8px 24px rgba(15, 23, 42, .10);
  --c7-foco: 0 0 0 3px rgba(2, 132, 199, .25);

  /* Bootstrap */
  --bs-body-font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --bs-body-color: var(--c7-texto);
  --bs-border-color: var(--c7-borda);
  --bs-primary: #003366;
  --bs-primary-rgb: 0, 51, 102;
  --bs-link-color: #0b4a85;
  --bs-link-hover-color: #003366;
}

/* status: as mesmas cores no monitor, na frota e no modo TV */
.fr-st-DISPONIVEL   { --mc-cor: #198754; --mc-cor-fundo: #e7f5ee; --mc-cor-texto: #0f5132; }
.fr-st-CARREGAMENTO { --mc-cor: #f5b800; --mc-cor-fundo: #fff8e1; --mc-cor-texto: #7a5a00; }
.fr-st-EM_ROTA      { --mc-cor: #0284c7; --mc-cor-fundo: #e0f2fe; --mc-cor-texto: #075985; }
.fr-st-RETORNANDO   { --mc-cor: #0dcaf0; --mc-cor-fundo: #e0f9fd; --mc-cor-texto: #0b5563; }
.fr-st-MANUTENCAO   { --mc-cor: #dc3545; --mc-cor-fundo: #fdecee; --mc-cor-texto: #a52834; }

/* ---------- base ---------- */
html { -webkit-text-size-adjust: 100%; }
body { background: var(--c7-fundo); color: var(--c7-texto); font-family: var(--bs-body-font-family); font-size: 14px;
  -webkit-font-smoothing: antialiased; overflow-x: hidden; }
h1, h2, h3, h4, h5, h6 { color: var(--c7-texto); letter-spacing: -.01em; }
.text-muted { color: var(--c7-suave) !important; }
:focus-visible { outline: none; box-shadow: var(--c7-foco); }

/* ---------- botões ---------- */
.btn { border-radius: var(--c7-raio-sm); font-weight: 600; transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s; }
.btn-sm { padding: .32rem .7rem; font-size: .82rem; }
.btn-primary { --bs-btn-bg: var(--c7-azul); --bs-btn-border-color: var(--c7-azul); --bs-btn-hover-bg: var(--c7-azul-2);
  --bs-btn-hover-border-color: var(--c7-azul-2); --bs-btn-active-bg: #00284f; --bs-btn-active-border-color: #00284f;
  --bs-btn-disabled-bg: var(--c7-azul); --bs-btn-disabled-border-color: var(--c7-azul); }
.btn-outline-primary { --bs-btn-color: var(--c7-azul); --bs-btn-border-color: var(--c7-borda-forte); --bs-btn-hover-bg: var(--c7-azul-claro);
  --bs-btn-hover-color: var(--c7-azul); --bs-btn-hover-border-color: var(--c7-azul); --bs-btn-active-bg: var(--c7-azul);
  --bs-btn-active-border-color: var(--c7-azul); }
.btn-outline-secondary { --bs-btn-color: var(--c7-texto-2); --bs-btn-border-color: var(--c7-borda-forte); --bs-btn-bg: #fff;
  --bs-btn-hover-bg: var(--c7-superficie-2); --bs-btn-hover-color: var(--c7-texto); --bs-btn-hover-border-color: #b8c2cf; }
.btn-secondary { --bs-btn-bg: #475569; --bs-btn-border-color: #475569; --bs-btn-hover-bg: #334155; --bs-btn-hover-border-color: #334155; }
.btn-dark { --bs-btn-bg: #0f172a; --bs-btn-border-color: #0f172a; --bs-btn-hover-bg: #1e293b; --bs-btn-hover-border-color: #1e293b; }
.btn-light { --bs-btn-bg: #fff; --bs-btn-border-color: var(--c7-borda-forte); --bs-btn-hover-bg: var(--c7-superficie-2); --bs-btn-hover-border-color: #b8c2cf; }
.btn-link { text-decoration: none; }

/* ---------- campos ---------- */
.form-label { font-size: .78rem; font-weight: 600; color: var(--c7-texto-2); margin-bottom: .3rem; }
.form-control, .form-select { border-color: var(--c7-borda-forte); border-radius: var(--c7-raio-sm); color: var(--c7-texto); font-size: .9rem; }
.form-control-sm, .form-select-sm { font-size: .85rem; min-height: 34px; }
.form-control:focus, .form-select:focus { border-color: #38bdf8; box-shadow: var(--c7-foco); }
.form-control::placeholder { color: #94a3b8; }
.form-control[readonly] { background: var(--c7-superficie-2); }
.campo-icone { position: relative; }
.campo-icone > i { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; font-size: .9rem; }
.campo-icone > .form-control { padding-left: 2.1rem; }

/* ---------- cards genéricos (telas que ainda usam .card do Bootstrap) ---------- */
.card { border: 1px solid var(--c7-borda); border-radius: var(--c7-raio); box-shadow: var(--c7-sombra); }
.card-header { background: var(--c7-superficie); border-bottom: 1px solid var(--c7-borda); font-weight: 600; }

/* ---------- barra superior ---------- */
.navbar.topo { background: linear-gradient(100deg, #002a54 0%, var(--c7-azul) 45%, var(--c7-azul-2) 100%); padding: .55rem 0; min-height: 60px;
  box-shadow: 0 2px 12px rgba(0, 31, 61, .18); }
.navbar.topo .container-fluid { gap: .75rem; flex-wrap: wrap; }
.navbar-brand { display: flex; align-items: center; gap: .65rem; color: #fff !important; font-weight: 700; margin: 0; }
.navbar-logo { display: block; height: 38px; width: auto; max-width: 110px; object-fit: contain; }
.navbar-brand-label { font-size: 1rem; font-weight: 600; color: rgba(255, 255, 255, .92); padding-left: .65rem; border-left: 1px solid rgba(255, 255, 255, .25); }
.topo-dir { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-left: auto; }
.last-update-tag { display: inline-flex; align-items: center; font-size: .75rem; color: rgba(255, 255, 255, .85); background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .12); border-radius: 999px; padding: .3rem .7rem; }
#status-conexao { display: inline-flex; align-items: center; font-size: .7rem; font-weight: 600; border-radius: 999px; padding: .35rem .65rem;
  border: 1px solid rgba(255, 255, 255, .12); }
#status-conexao.bg-success { background: rgba(34, 197, 94, .18) !important; color: #bbf7d0; }
#status-conexao.bg-danger { background: rgba(239, 68, 68, .25) !important; color: #fecaca; }
#status-conexao.bg-secondary { background: rgba(255, 255, 255, .1) !important; color: rgba(255, 255, 255, .8); }
#usuario-header-info { cursor: pointer; }
#usuario-header-info .badge { display: inline-flex; align-items: center; background: rgba(255, 255, 255, .12) !important; color: #fff;
  border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px; padding: .35rem .75rem; font-size: .78rem; font-weight: 600; }
#usuario-header-info:hover .badge { background: rgba(255, 255, 255, .2) !important; }
.topo-sair { color: #fff; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; padding: .28rem .75rem; }
.topo-sair:hover { background: rgba(255, 255, 255, .12); color: #fff; }

/* ---------- abas ---------- */
#bar-nav-pages { background: var(--c7-superficie); border-bottom: 1px solid var(--c7-borda); margin-bottom: 1.25rem; }
.nav.abas { flex-wrap: nowrap; overflow-x: auto; gap: .25rem; scrollbar-width: none; }
.nav.abas::-webkit-scrollbar { display: none; }
.nav.abas .nav-link { position: relative; white-space: nowrap; color: var(--c7-suave); font-weight: 600 !important; font-size: .86rem;
  padding: .85rem .9rem !important; border-radius: 0; background: none; }
.nav.abas .nav-link i { opacity: .8; }
.nav.abas .nav-link:hover { color: var(--c7-texto); }
.nav.abas .nav-link.active { color: var(--c7-azul); background: none; }
.nav.abas .nav-link.active::after { content: ''; position: absolute; left: .6rem; right: .6rem; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--c7-azul); }

.page-content { padding-bottom: 2.5rem; }

/* ---------- cabeçalho de página ---------- */
.pg-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.pg-titulo { font-size: 1.45rem; font-weight: 800; margin: 0; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.pg-contador { font-size: .75rem; font-weight: 600; color: var(--c7-suave); background: #e9eef4; border-radius: 999px; padding: .2rem .65rem; letter-spacing: 0; }
.pg-sub { color: var(--c7-suave); margin: .2rem 0 0; font-size: .88rem; }
.pg-acoes { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* ---------- filtros ---------- */
.filter-card { background: var(--c7-superficie); border: 1px solid var(--c7-borda); border-radius: var(--c7-raio); padding: .9rem 1rem;
  margin-bottom: 1rem; box-shadow: var(--c7-sombra); }
.btn-limpar-filtros { color: var(--c7-suave); font-weight: 600; padding-left: .25rem; padding-right: .25rem; }
.btn-limpar-filtros:hover { color: var(--c7-texto); }
.filter-card .mc-atalhos-solo { margin-top: 0; padding-top: 0; border-top: 0; }
.mc-atalho.active-filter { background: var(--c7-azul); border-color: var(--c7-azul); color: #fff; box-shadow: 0 2px 6px rgba(0, 51, 102, .25); }
.mc-atalho.active-filter b { color: #fff; }

/* ---------- vazio ---------- */
.mc-vazio { grid-column: 1 / -1; }

/* ---------- tela inicial ---------- */
.home-cab { margin: .5rem 0 1.25rem; }
.home-cab h1 { font-size: 1.6rem; font-weight: 800; margin: 0; }
.home-cab p { color: var(--c7-suave); margin: .25rem 0 0; }
.home-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 1099.98px) { .home-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.atalho-home { display: flex; align-items: center; gap: 1rem; text-align: left; width: 100%; background: var(--c7-superficie);
  border: 1px solid var(--c7-borda); border-radius: var(--c7-raio); padding: 1.15rem 1.2rem; box-shadow: var(--c7-sombra);
  transition: transform .2s, box-shadow .2s, border-color .2s; color: inherit; }
.atalho-home:hover { transform: translateY(-2px); box-shadow: var(--c7-sombra-alta); border-color: color-mix(in srgb, var(--at-cor) 35%, var(--c7-borda)); }
.atalho-icone { flex-shrink: 0; width: 3.1rem; height: 3.1rem; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.45rem; color: var(--at-cor); background: color-mix(in srgb, var(--at-cor) 12%, #fff); }
.atalho-texto { display: flex; flex-direction: column; gap: .2rem; min-width: 0; flex: 1; }
.atalho-titulo { font-weight: 700; font-size: 1.02rem; color: var(--c7-texto); }
.atalho-desc { font-size: .82rem; color: var(--c7-suave); line-height: 1.4; }
.atalho-seta { color: #cbd5e1; font-size: 1.1rem; transition: transform .2s, color .2s; }
.atalho-home:hover .atalho-seta { color: var(--at-cor); transform: translateX(3px); }

/* =====================================================================
   MONITOR DE ENTREGAS — visão detalhada
   ===================================================================== */
#container-programacoes.rd-modo { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 540px), 1fr)); gap: 1rem; align-items: start; padding-bottom: 2rem; }
.rd-card { background: var(--c7-superficie); border: 1px solid var(--c7-borda); border-top: 4px solid var(--mc-cor); border-radius: var(--c7-raio);
  box-shadow: var(--c7-sombra); min-width: 0; overflow: hidden; transition: box-shadow .2s; }
.rd-card:hover { box-shadow: var(--c7-sombra-alta); }
.rd-card:has(> .rd-corpo > .collapse.show), .rd-card:has(> .rd-corpo > .collapsing) { grid-column: 1 / -1; }

.rd-cab { display: grid; grid-template-columns: 1fr auto; gap: .6rem .75rem; padding: 1rem 1.1rem .75rem; cursor: pointer; user-select: none; }
.rd-ident { min-width: 0; }
.rd-linha1 { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.rd-cab-dir { display: flex; align-items: flex-start; gap: .35rem; }
.rd-estados { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.rd-gps { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .4rem; }
.rd-local { display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; font-weight: 600; color: var(--c7-texto-2); }
.rd-local i { color: #94a3b8; }
.rd-local small { font-weight: 500; color: var(--c7-suave); margin-left: .15rem; }
.rd-acao { display: inline-flex; align-items: center; gap: .3rem; border: 1px solid var(--c7-borda-forte); background: #fff; color: var(--c7-texto-2);
  border-radius: var(--c7-raio-sm); padding: .25rem .55rem; font-size: .78rem; font-weight: 600; }
.rd-acao:hover { border-color: var(--c7-azul); color: var(--c7-azul); background: var(--c7-azul-claro); }
.rd-acao-perigo:hover { border-color: #dc3545; color: #dc3545; background: #fdecee; }

.rd-corpo { padding: 0 1.1rem 1rem; display: flex; flex-direction: column; gap: .85rem; }
.rd-info { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .65rem 1rem; padding: .75rem .85rem;
  background: var(--c7-superficie-2); border: 1px solid #eef2f6; border-radius: 10px; }
.rd-info > div { display: flex; flex-direction: column; min-width: 0; }
.rd-valor { font-size: .86rem; font-weight: 600; color: var(--c7-texto); overflow-wrap: anywhere; }
.rd-proxima { display: flex; gap: .65rem; align-items: flex-start; padding: .65rem .85rem; border-radius: 10px; background: #eff6ff; border: 1px solid #dbeafe;
  font-size: .88rem; color: var(--c7-texto-2); }
.rd-proxima > i { color: #dc3545; font-size: 1.05rem; margin-top: .1rem; }
.rd-proxima b { color: var(--c7-texto); }
.rd-proxima-ok { background: #ecfdf3; border-color: #c9f0d8; }
.rd-proxima-ok > i { color: #198754; }
.rd-cod { color: var(--c7-suave); font-size: .78rem; }
.rd-barras { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.rd-barra-bip { background: linear-gradient(90deg, #0891b2, #22d3ee) !important; }

.rd-expandido { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1rem; padding-top: .25rem; }
.rd-secao { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; margin-bottom: .5rem; font-weight: 700; font-size: .85rem; color: var(--c7-texto-2); }
.rd-mapa-bloco .rd-secao { flex-direction: column; align-items: flex-start; gap: .1rem; }
.rd-mapa-bloco .rd-secao small { text-align: left; }
.rd-secao small { font-weight: 500; color: var(--c7-suave); font-size: .75rem; text-align: right; }
.mapa-rota { height: 340px; width: 100%; border-radius: 10px; border: 1px solid var(--c7-borda); background: #eef2f7; overflow: hidden; z-index: 0; }
.mapa-sem-coordenadas { background: var(--c7-superficie-2); }

.rd-entregas { display: flex; flex-direction: column; gap: .4rem; max-height: 420px; overflow-y: auto; padding-right: .25rem; }
.rd-entrega { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .65rem; padding: .55rem .65rem; border: 1px solid var(--c7-borda);
  border-radius: 10px; background: #fff; }
.rd-entrega.feita { background: #f6fbf8; border-color: #d7efe1; }
.rd-entrega.feita .rd-ent-titulo { color: var(--c7-suave); }
.rd-entrega.proxima { border-color: #93c5fd; box-shadow: 0 0 0 3px rgba(59, 130, 246, .1); }
.rd-num { width: 1.6rem; height: 1.6rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; font-weight: 700;
  background: #eef2f6; color: var(--c7-texto-2); flex-shrink: 0; }
.rd-entrega.feita .rd-num { background: #198754; color: #fff; }
.rd-entrega.proxima .rd-num { background: #0284c7; color: #fff; }
.rd-ent-info { min-width: 0; }
.rd-ent-titulo { font-size: .86rem; color: var(--c7-texto); overflow-wrap: anywhere; }
.rd-ent-titulo span { color: var(--c7-texto-2); }
.rd-ent-meta { font-size: .74rem; color: var(--c7-suave); margin-top: .1rem; }
.rd-ent-acoes { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; justify-content: flex-end; }
.rd-chip-btn { display: inline-flex; align-items: center; gap: .3rem; border: 1px solid var(--c7-borda-forte); background: #fff; color: var(--c7-suave);
  border-radius: 999px; padding: .18rem .6rem; font-size: .72rem; font-weight: 600; white-space: nowrap; }
.rd-chip-btn.ok { background: #ecfeff; border-color: #a5f3fc; color: #0e7490; }
button.rd-chip-btn:hover { border-color: #0891b2; }
.rd-baixa { display: inline-flex; align-items: center; gap: .3rem; border: 1px solid var(--c7-azul); background: #fff; color: var(--c7-azul);
  border-radius: 999px; padding: .22rem .75rem; font-size: .76rem; font-weight: 700; white-space: nowrap; }
button.rd-baixa:hover { background: var(--c7-azul); color: #fff; }
.rd-baixa.feita { background: #198754; border-color: #198754; color: #fff; }
button.rd-baixa.feita:hover { background: #146c43; }
span.rd-baixa:not(.feita) { border-color: var(--c7-borda-forte); color: var(--c7-suave); }

.rd-expandir { display: flex; width: 100%; align-items: center; justify-content: center; gap: .4rem; border: 0; border-top: 1px solid #eef2f6;
  background: var(--c7-superficie-2); color: var(--c7-azul); font-weight: 600; font-size: .82rem; padding: .55rem; }
.rd-expandir:hover { background: var(--c7-azul-claro); }
.rd-expandir i { transition: transform .2s; }
.rd-expandir:not(.collapsed) i { transform: rotate(180deg); }
.rd-expandir .rd-menos, .rd-expandir.collapsed .rd-mais { display: inline; }
.rd-expandir .rd-mais, .rd-expandir.collapsed .rd-menos { display: none; }

/* =====================================================================
   DISPONIBILIDADE DA FROTA
   ===================================================================== */
.fr-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.fr-layout.fr-com-detalhe { grid-template-columns: minmax(0, 1fr) minmax(320px, 400px); }
.fr-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .85rem; }
.fr-card { position: relative; display: flex; flex-direction: column; gap: .65rem; background: var(--c7-superficie); border: 1px solid var(--c7-borda);
  border-left: 4px solid var(--mc-cor); border-radius: var(--c7-raio); padding: .85rem .95rem; box-shadow: var(--c7-sombra); cursor: pointer;
  transition: box-shadow .2s, transform .2s, border-color .2s; }
.fr-card:hover { box-shadow: var(--c7-sombra-alta); transform: translateY(-1px); }
.fr-card.selecionado { border-color: var(--mc-cor); box-shadow: 0 0 0 3px color-mix(in srgb, var(--mc-cor) 25%, transparent), var(--c7-sombra); }
.fr-topo { display: flex; align-items: flex-start; gap: .5rem; }
.fr-id { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; min-width: 0; }
.fr-status { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; border-radius: 999px; padding: .2rem .6rem;
  background: var(--mc-cor-fundo); color: var(--mc-cor-texto); }
.fr-acoes { margin-left: auto; display: flex; gap: .25rem; }
.fr-acoes .rd-acao { padding: .2rem .45rem; }
.fr-dados { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.fr-dados > div { display: flex; flex-direction: column; min-width: 0; }
.fr-valor { font-size: .84rem; font-weight: 600; color: var(--c7-texto); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fr-manut { display: flex; gap: .4rem; font-size: .8rem; color: #a52834; background: #fdecee; border-radius: 8px; padding: .4rem .6rem; }
.fr-gps { padding-top: .55rem; border-top: 1px solid #eef2f6; }
.fr-detalhe { background: var(--c7-superficie); border: 1px solid var(--c7-borda); border-radius: var(--c7-raio); box-shadow: var(--c7-sombra);
  position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
.fr-det-cab { display: flex; justify-content: space-between; align-items: center; padding: .8rem 1rem; border-bottom: 1px solid var(--c7-borda); font-weight: 700; font-size: .9rem; }
.fr-det-corpo { padding: 1rem; color: var(--c7-texto-2); font-size: .88rem; }
.fr-det-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; margin-bottom: .75rem; }
.detail-row { display: flex; align-items: flex-start; gap: .7rem; padding: .55rem 0; border-bottom: 1px solid #f1f4f8; }
.detail-row:last-of-type { border-bottom: 0; }
.detail-row > i { color: var(--c7-suave); font-size: 1rem; width: 1.1rem; text-align: center; margin-top: .1rem; }
.detail-row small { font-size: .72rem; }
.mapa-detalhe-veiculo { height: 260px; width: 100%; border-radius: 10px; border: 1px solid var(--c7-borda); z-index: 0; }
.fr-sem-mapa { background: var(--c7-superficie-2); border-radius: 10px; padding: 1rem; color: var(--c7-suave); font-size: .85rem; }

/* =====================================================================
   CADASTROS (clientes, funcionários): painel com busca e tabela
   ===================================================================== */
.painel { background: var(--c7-superficie); border: 1px solid var(--c7-borda); border-radius: var(--c7-raio); box-shadow: var(--c7-sombra); overflow: hidden; }
.painel-barra { display: flex; align-items: center; gap: .6rem; padding: .85rem 1rem; border-bottom: 1px solid var(--c7-borda); flex-wrap: wrap; }
.painel-barra .campo-icone { max-width: 560px; min-width: 220px; }
.painel-info { font-size: .78rem; color: var(--c7-suave); padding: .5rem 1rem 0; }
.painel-info:empty { display: none; }
.tabela-rolagem { max-height: calc(100vh - 290px); min-height: 200px; }
.tabela { --bs-table-bg: transparent; --bs-table-hover-bg: var(--c7-superficie-2); font-size: .86rem; }
.tabela thead th { position: sticky; top: 0; z-index: 2; background: var(--c7-superficie-2); color: var(--c7-suave); font-size: .7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--c7-borda); padding: .7rem 1rem; white-space: nowrap; }
.tabela tbody td { padding: .7rem 1rem; border-color: #f1f4f8; }
.tabela tbody tr:hover td { background: var(--c7-superficie-2); }
.tabela .badge { font-weight: 600; border-radius: 6px; }
.tabela .badge.bg-secondary { background: #eef2f6 !important; color: var(--c7-texto-2); }
.tabela .badge.bg-success { background: #e7f5ee !important; color: #0f5132; }
.tabela .badge.bg-info { background: #e0f2fe !important; color: #075985 !important; }
.tabela td:last-child { text-align: right; white-space: nowrap; }
.tabela .btn-sm { padding: .2rem .5rem; }

/* =====================================================================
   GAVETAS DE FORMULÁRIO
   ===================================================================== */
.gaveta { --bs-offcanvas-width: min(620px, 100vw); border-left: 0 !important; box-shadow: -12px 0 40px rgba(15, 23, 42, .18); }
.gaveta.gaveta-estreita { --bs-offcanvas-width: min(440px, 100vw); }
.gaveta .offcanvas-header { padding: 1.1rem 1.35rem; border-bottom: 1px solid var(--c7-borda); }
.gaveta .offcanvas-title { font-size: 1.15rem; font-weight: 800; margin: 0; }
.gaveta .offcanvas-body { padding: 1.1rem 1.35rem 1.5rem; background: var(--c7-superficie-2); display: flex; flex-direction: column; gap: 1rem; }
.gaveta-rodape { display: flex; justify-content: flex-end; gap: .5rem; padding: .85rem 1.35rem; border-top: 1px solid var(--c7-borda); background: #fff; }
.gaveta-secao { background: #fff; border: 1px solid var(--c7-borda); border-radius: var(--c7-raio); padding: .85rem 1rem 1rem; margin: 0; }
.gaveta-secao + .gaveta-secao { margin-top: 1rem; }
.gaveta-secao legend { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--c7-suave);
  margin-bottom: .6rem; padding: 0; }
.gaveta-secao legend small { text-transform: none; letter-spacing: 0; font-weight: 500; margin-left: .35rem; color: #94a3b8; }
.gaveta-manual { margin-top: .75rem; }
.gaveta-manual summary { cursor: pointer; font-size: .84rem; font-weight: 600; color: var(--c7-azul); list-style: none; }
.gaveta-manual summary::-webkit-details-marker { display: none; }

.import-zone { display: flex; align-items: center; gap: .85rem; width: 100%; text-align: left; border: 1.5px dashed #9cc1e6; background: #f0f7ff;
  border-radius: var(--c7-raio); padding: .85rem 1rem; color: var(--c7-texto-2); transition: background .15s, border-color .15s; }
.import-zone:hover { background: #e3f0fd; border-color: var(--c7-azul-2); }
.import-zone > i { font-size: 1.6rem; color: #198754; }
.import-zone b { display: block; color: var(--c7-texto); font-size: .9rem; }
.import-zone small { display: block; color: var(--c7-suave); font-size: .78rem; }

.lista-temp-entregas { display: flex; flex-direction: column; gap: .35rem; max-height: 300px; overflow-y: auto; }
.lista-temp-total { font-size: .75rem; font-weight: 600; color: var(--c7-suave); margin-bottom: .1rem; }
.lista-temp-item { display: flex; align-items: center; gap: .6rem; padding: .4rem .55rem; border: 1px solid var(--c7-borda); border-radius: 8px; font-size: .82rem; }
.lista-temp-texto { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.lista-temp-texto small { color: var(--c7-suave); }
.lista-temp-item .btn-close { font-size: .6rem; }
.lista-temp-vazia { display: flex; align-items: center; gap: .5rem; color: var(--c7-suave); font-size: .82rem; padding: .6rem .75rem; background: var(--c7-superficie-2);
  border-radius: 8px; }

.lista-sugestoes-funcionarios { position: absolute; top: 100%; left: 4px; right: 4px; z-index: 1060; background: #fff; border: 1px solid var(--c7-borda-forte);
  border-radius: 10px; box-shadow: var(--c7-sombra-alta); max-height: 220px; overflow-y: auto; margin-top: 2px; }
.item-sugestao-funcionario { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid #f1f4f8; background: #fff; padding: .55rem .75rem;
  color: var(--c7-texto); font-size: .86rem; }
.item-sugestao-funcionario:hover, .item-sugestao-funcionario:focus { background: var(--c7-azul-claro); }
.item-sugestao-funcionario small { display: block; color: var(--c7-suave); font-size: .74rem; }

/* ---------- modais ---------- */
.modal-content { border: 0; border-radius: 14px; box-shadow: 0 20px 60px rgba(15, 23, 42, .25); }
.modal-header { border-bottom: 1px solid var(--c7-borda); }
.modal-footer { border-top: 1px solid var(--c7-borda); }
#modalFinalizacao .modal-header.bg-success { background: #198754 !important; border-radius: 14px 14px 0 0; }

/* ---------- login ---------- */
#login-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 1rem;
  background: radial-gradient(900px 500px at 15% 10%, rgba(11, 74, 133, .55), transparent 60%), linear-gradient(135deg, #001b36, #003366); }
.login-card { width: 100%; max-width: 400px; background: #fff; border-radius: 18px; padding: 2rem 1.85rem 1.75rem; box-shadow: 0 30px 80px rgba(0, 0, 0, .35); }
.login-marca { width: 64px; height: 64px; border-radius: 16px; background: var(--c7-azul); display: flex; align-items: center; justify-content: center; margin-bottom: 1.1rem; }
.login-marca img { max-width: 48px; max-height: 40px; object-fit: contain; }
.login-titulo { font-size: 1.4rem; font-weight: 800; margin: 0; }
.login-sub { color: var(--c7-suave); font-size: .88rem; margin: .25rem 0 1.4rem; }
.login-card .form-floating > .form-control { border-radius: 10px; }

/* ---------- responsivo ---------- */
@media (max-width: 1199.98px) {
  .fr-layout.fr-com-detalhe { grid-template-columns: minmax(0, 1fr); }
  .fr-detalhe { position: static; max-height: none; order: -1; }
  .rd-expandido { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
  .navbar-brand-label { display: none; }
  .last-update-tag { display: none; }
  .topo-sair span { display: none; }
  .pg-titulo { font-size: 1.25rem; }
  .pg-cab { align-items: flex-start; }
  .rd-barras { grid-template-columns: 1fr; }
  .rd-entrega { grid-template-columns: auto 1fr; }
  .rd-ent-acoes { grid-column: 1 / -1; justify-content: flex-start; padding-left: 2.25rem; }
  .mapa-rota { height: 240px; }
  .home-grade { grid-template-columns: 1fr; }
  .tabela-rolagem { max-height: none; }
}

/* perfil consulta: some também o item da aba escondida (90-perfil-consulta.js esconde só o botão) */
body.perfil-consulta .nav.abas .nav-item:has(> #tab-veiculos, > #tab-pessoas, > #tab-relpessoas, > #tab-funcionarios, > #tab-usuarios) { display: none; }

/* =====================================================================
   USUÁRIOS DO PORTAL (35-usuarios.js)
   ===================================================================== */
.us-ch-admin { --mc-cor: #003366; }
.us-ch-consulta { --mc-cor: #64748b; }
.us-ch-inativo { --mc-cor: #cbd5e1; }
.painel-barra .mc-atalhos { margin: 0; padding: 0; border: 0; }
.us-pessoa { display: flex; align-items: center; gap: .7rem; }
.us-avatar { width: 2.2rem; height: 2.2rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  font-size: .78rem; font-weight: 700; letter-spacing: .02em; }
.us-login { font-size: .78rem; color: var(--c7-suave); font-family: 'Consolas', 'Roboto Mono', monospace; }
.us-voce { font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #075985; background: #e0f2fe; border-radius: 4px;
  padding: .05rem .35rem; margin-left: .25rem; vertical-align: middle; }
.us-tag { display: inline-flex; align-items: center; gap: .35rem; font-size: .75rem; font-weight: 700; border-radius: 999px; padding: .2rem .65rem; }
.us-tag-admin { background: var(--c7-azul-claro); color: var(--c7-azul); }
.us-tag-consulta { background: #eef2f6; color: #475569; }
.us-situacao { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; font-weight: 600; color: var(--c7-suave); }
.us-situacao::before { content: ''; width: .5rem; height: .5rem; border-radius: 50%; background: #cbd5e1; }
.us-situacao.ok { color: #146c43; }
.us-situacao.ok::before { background: #198754; }
tr.us-inativo td { color: var(--c7-suave); }
tr.us-inativo .us-avatar, tr.us-inativo .us-tag { filter: grayscale(1); opacity: .6; }

.us-perfis { display: grid; gap: .6rem; }
.us-perfil { position: relative; display: block; cursor: pointer; margin: 0; }
.us-perfil input { position: absolute; opacity: 0; pointer-events: none; }
.us-perfil-cartao { display: flex; flex-direction: column; gap: .2rem; border: 1.5px solid var(--c7-borda-forte); border-radius: 10px; padding: .7rem .85rem;
  transition: border-color .15s, background .15s, box-shadow .15s; }
.us-perfil-titulo { font-weight: 700; font-size: .92rem; display: flex; align-items: center; gap: .45rem; color: var(--c7-texto); }
.us-perfil-desc { font-size: .8rem; color: var(--c7-suave); line-height: 1.4; }
.us-perfil:hover .us-perfil-cartao { border-color: #94a3b8; }
.us-perfil input:checked + .us-perfil-cartao { border-color: var(--c7-azul); background: #f3f7fc; box-shadow: 0 0 0 3px rgba(0, 51, 102, .12); }
.us-perfil input:checked + .us-perfil-cartao .us-perfil-titulo { color: var(--c7-azul); }
.us-perfil input:focus-visible + .us-perfil-cartao { box-shadow: var(--c7-foco); }
.us-perfil input:disabled + .us-perfil-cartao { opacity: .6; cursor: not-allowed; }

.us-senha { display: flex; gap: .4rem; }
.us-senha-campo { font-family: 'Consolas', 'Roboto Mono', monospace; letter-spacing: .04em; }
.us-senha .btn { white-space: nowrap; }
.us-aviso { display: flex; gap: .45rem; margin-top: .75rem; font-size: .8rem; color: #7a5a00; background: #fff8e1; border-radius: 8px; padding: .55rem .7rem; }

.aviso-rapido { position: fixed; left: 50%; bottom: 1.5rem; transform: translate(-50%, 1rem); z-index: 3000; background: #0f172a; color: #fff; font-size: .88rem;
  font-weight: 500; border-radius: 10px; padding: .7rem 1.1rem; box-shadow: 0 10px 30px rgba(15, 23, 42, .3); opacity: 0; pointer-events: none;
  transition: opacity .2s, transform .2s; max-width: calc(100vw - 2rem); }
.aviso-rapido.visivel { opacity: 1; transform: translate(-50%, 0); }
.form-check-input:checked { background-color: var(--c7-azul); border-color: var(--c7-azul); }
.form-check-input:focus { box-shadow: var(--c7-foco); }

/* número e unidade nunca se separam (490 pçs, 10.512 kg, 62 km/h, há 1 h 2 min) */
.un, .mc-gps, .mc-quando, .rd-local small, .mc-pct, .pg-contador, .mc-atalho { white-space: nowrap; }

/* troca de senha obrigatória (mesmo visual do login, por cima do portal) */
#troca-senha-modal { position: fixed; inset: 0; z-index: 9998; display: flex; align-items: center; justify-content: center; padding: 1rem; overflow-y: auto;
  background: radial-gradient(900px 500px at 15% 10%, rgba(11, 74, 133, .55), transparent 60%), linear-gradient(135deg, #001b36, #003366); }
#troca-senha-modal.d-none { display: none !important; }
#troca-senha-modal .login-marca i { color: #fff; font-size: 1.6rem; }
.ts-regras { list-style: none; padding: 0; margin: .5rem 0 1rem; display: grid; grid-template-columns: 1fr 1fr; gap: .3rem .75rem; font-size: .78rem; color: var(--c7-suave); }
.ts-regras li { display: flex; align-items: center; gap: .35rem; }
.ts-regras li::before { content: '\F28A'; font-family: 'bootstrap-icons'; color: #cbd5e1; }
.ts-regras li.ok { color: #146c43; }
.ts-regras li.ok::before { content: '\F26B'; color: #198754; }
.us-pendente { display: inline-flex; align-items: center; gap: .3rem; margin-top: .2rem; font-size: .72rem; font-weight: 600; color: #8a5300; background: #fff4e0; border-radius: 6px; padding: .1rem .45rem; white-space: nowrap; }

/* ---------- Roteiros da planilha (gaveta) ---------- */
.rp-nota { color: var(--c7-suave); font-size: .82rem; margin: .15rem 0 0; }
.rp-situacao { display: grid; gap: .25rem; }
.rp-acoes { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .75rem; }
.rp-alerta { margin-top: .4rem; padding: .5rem .65rem; border-radius: var(--c7-raio-sm); font-size: .85rem; }
.rp-erro { background: rgba(220, 38, 38, .08); color: #b91c1c; border-color: rgba(220, 38, 38, .25) !important; }
[data-bs-theme="dark"] .rp-erro { color: #fca5a5; }
.rp-item, .rp-pend { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; padding: .55rem 0;
  border-bottom: 1px solid var(--c7-borda); font-size: .88rem; }
.rp-item:last-child, .rp-pend:last-child { border-bottom: 0; }
.rp-item .btn, .rp-pend > .btn { flex-shrink: 0; }
.rp-pend { flex-direction: column; align-items: stretch; }
.rp-pend > .btn { align-self: flex-end; }
.rp-rota { border: 1px solid var(--c7-borda); border-radius: var(--c7-raio-sm); padding: .5rem .7rem; margin-top: .6rem; background: var(--c7-superficie-2); }
.rp-rota-cab { font-size: .88rem; padding-bottom: .3rem; border-bottom: 1px solid var(--c7-borda); }
.rp-tag { display: inline-block; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: .05rem .4rem;
  border-radius: 6px; background: var(--c7-azul-claro); color: var(--c7-azul); margin-right: .25rem; }
[data-bs-theme="dark"] .rp-tag { background: rgba(96, 165, 250, .15); color: #93c5fd; }
.rp-vincular { display: flex; gap: .4rem; margin-top: .35rem; }
.rp-vincular .form-select { min-width: 0; }
#btn-roteiros-planilha .badge { font-size: .68rem; margin-left: .2rem; }
.rp-mudancas { margin: .25rem 0 0; padding-left: 1.1rem; font-size: .82rem; color: var(--c7-texto-2); }