/* =========================================================================
   OpenDoc / EROM — Design Tokens (extraídos de design_system/design-system.html)
   Cores, tipografia, espaçamentos e dark mode do Modo TV (wallboard).
   Estes tokens *complementam* o tema Bootstrap vendored em duralux.
   ========================================================================= */

:root {
  /* --- Cores de marca (mesmas do tema Finance/duralux) --- */
  --od-main:           #00abc9;   /* primary / info */
  --od-main-dark:      #003f4a;   /* hover do primary */
  --od-main-hover:     #0095b0;   /* submenu hover */
  --od-sub:            #2e363a;   /* secondary / dark */
  --od-sub-dark:       #000000;   /* hover do secondary */
  --od-highlight:      #76c900;   /* success / positive */
  --od-highlight-dark: #2b4a00;
  --od-green:          #208d4e;
  --od-blue:           #0068c9;
  --od-orange:         #ff7302;
  --od-yellow:         #ffd21c;
  --od-red:            #e74c3c;   /* error / danger */
  --fleet-disponivel: #ed34c4;
  --fleet-aguardando-carga: #8bc34a;
  --fleet-aguardando-inicio: #36a3a4;
  --fleet-em-viagem: #6da348;
  --fleet-aguardando-descarga: #cddc39;
  --fleet-em-descarga: #5a59ed;
  --fleet-em-manutencao: #eb2849;

  /* --- Cores de interface --- */
  --od-bg-page:   #ffffff;
  --od-bg-grey:   #f8f8f8;
  --od-bg-dark:   #2e363a;
  --od-border:    #ebebeb;
  --od-border-input: #e6e6e6;
  --od-line:      #ebebeb;

  /* --- Tipografia (Lato, oficial do tema) --- */
  --od-font-sans: 'Lato', sans-serif;
  --od-text-body: #666666;
  --od-text-heading: #333333;
  --od-text-muted: #888888;
  --od-text-footer: #e5e5e5;

  /* --- Layout --- */
  --od-container-max: 1200px;
  --od-section-pad-y: 62px;
  --od-radius: 3px;
  --od-radius-pill: 25px;
  --od-transition: all 0.6s ease 0s;

  /* --- Sombras (extraídas do tema) --- */
  --od-shadow-dropdown: 0 3px 5px 0 rgba(0, 0, 0, 0.1);
  --od-shadow-avatar:   0 4px 4px 0 #333333;
}

/* =========================================================================
   Override do tema: ele define `body { overflow:hidden }` por causa do slider
   Revolution; abre mão do scroll em páginas da app.
   ========================================================================= */
body.app-shell,
body.auth-shell {
  overflow: auto !important;
}

/* Shell autenticado: empurra o conteúdo abaixo do header fixo (header-v1). */
body.app-shell #sticked-menu {
  position: sticky;
  top: 0;
  z-index: 1041;
  background: #fff;
  box-shadow: var(--od-shadow-dropdown);
}

/* Sidebar fixa à esquerda no shell autenticado */
.app-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  min-height: 100vh;
}
.app-layout__sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.app-layout__main { padding: 24px 28px 8px; }

/* Sidebar interna usa o visual dark do tema */
.sidebar {
  background: var(--od-bg-dark);
  color: var(--od-text-footer);
  padding: 20px 0;
  height: 100vh;
  overflow-y: auto;
}
.sidebar a {
  display: block;
  padding: 11px 20px;
  color: #cfd6da;
  font-size: 14px;
  transition: var(--od-transition);
}
.sidebar a:hover,
.sidebar a.active {
  background: var(--od-main);
  color: #fff;
  text-decoration: none;
}
.sidebar .sidebar-header {
  padding: 0 20px 16px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #888;
  border-bottom: 1px solid #394348;
  margin-bottom: 8px;
}

/* Topbar com search + notifications + perfil, alinhado ao tema */
.app-topbar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  background: #fff;
  border-bottom: 1px solid var(--od-border);
}
.app-topbar .search-box { flex: 1; max-width: 480px; }
.app-topbar .search-box .form-control {
  border: 1px solid var(--od-border-input);
  box-shadow: none;
  height: 40px;
}
.app-topbar .dropdown-toggle::after { display: none; }  /* sino sem caret */

/* Helper de seções de página (compat com `.title` do tema) */
.page-title { margin-bottom: 24px; }
.page-subtitle { color: var(--od-text-muted); margin-bottom: 22px; }

/* Estados de botão loading (p/ tarefas em background) */
.ot-btn.is-loading,
.ot-btn[disabled].is-loading {
  position: relative;
  color: transparent !important;
  pointer-events: none;
  opacity: .85;
}
.ot-btn.is-loading::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  width: 16px; height: 16px;
  margin: -8px 0 0 -8px;
  border: 2px solid rgba(255,255,255,.6);
  border-top-color: transparent;
  border-radius: 50%;
  animation: od-spin .8s linear infinite;
}
@keyframes od-spin { to { transform: rotate(360deg); } }

/* Toast解决的样式 will be added inline by app.js */
.od-toast {
  position: fixed;
  bottom: 24px; right: 24px;
  z-index: 1090;
  max-width: 360px;
  padding: 14px 18px;
  background: #2e363a;
  color: #fff;
  border-left: 4px solid var(--od-main);
  box-shadow: 0 6px 20px rgba(0,0,0,.18);
  border-radius: var(--od-radius);
  animation: od-toast-in .3s ease;
}
.od-toast.od-toast-success { border-left-color: var(--od-highlight); }
.od-toast.od-toast-error   { border-left-color: var(--od-red); }
.od-toast.od-toast-warning { border-left-color: var(--od-orange); }
.od-toast.od-toast-info    { border-left-color: var(--od-main); }
.od-toast .od-toast__close { margin-left: 12px; opacity: .6; cursor: pointer; }
.od-toast .od-toast__close:hover { opacity: 1; }
@keyframes od-toast-in { from { transform: translateX(20px); opacity: 0; } to { transform: none; opacity: 1; } }

/* =========================================================================
   DARK MODE TV (wallboard) — dark mode nativo, componentes grandes legiveis
   ========================================================================= */
:root.tv {
  --od-bg-page: #0f1419;
  --od-bg-grey: #131a20;
  --od-bg-dark: #0f1419;
  --od-text-body: #e8edf1;
  --od-text-heading: #ffffff;
  --od-text-muted: #9fb0bc;
  --od-border: #2a3440;
  --od-border-input: #2a3440;
}
body.tv-shell {
  background: var(--od-bg-page);
  color: var(--od-text-body);
  overflow: hidden;  /* TV: sem scroll */
  font-size: 1.15rem;
}
.tv-shell .tv-grid { display: grid; gap: 22px; padding: 24px; grid-template-columns: repeat(4, 1fr); }
.tv-shell .tv-card {
  background: var(--od-bg-grey);
  border: 1px solid var(--od-border);
  border-radius: 10px;
  padding: 22px;
}
.tv-shell .tv-kpi { font-size: 3rem; font-weight: 700; color: var(--od-main); line-height: 1; }
.tv-shell .tv-kpi--success { color: var(--od-highlight); }
.tv-shell .tv-kpi--warning { color: var(--od-orange); }
.tv-shell .tv-kpi--danger  { color: var(--od-red); }
.tv-shell .tv-kpi-label { color: var(--od-text-muted); text-transform: uppercase; letter-spacing: .08em; }

/* Responsividade: colapsa sidebar em telas pequenas */
@media (max-width: 991px) {
  .app-layout { grid-template-columns: 1fr; }
  .app-layout__sidebar { position: static; height: auto; }
  .sidebar { height: auto; }
}
/* =========================================================================
   Bootstrap 5 Utility Classes Polyfill for Bootstrap 3
   ========================================================================= */
.d-flex { display: flex !important; }
.align-items-center { align-items: center !important; }
.align-items-start { align-items: flex-start !important; }
.align-items-end { align-items: flex-end !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-center { justify-content: center !important; }
.flex-grow-1 { flex-grow: 1 !important; }
.flex-shrink-0 { flex-shrink: 0 !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 1rem !important; }
.ms-auto { margin-left: auto !important; }
.ms-1 { margin-left: 0.25rem !important; }
.ms-2 { margin-left: 0.5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.me-2 { margin-right: 0.5rem !important; }
.me-3 { margin-right: 1rem !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.p-2 { padding: 0.5rem !important; }
.p-4 { padding: 1.5rem !important; }
.w-100 { width: 100% !important; }
.text-dark { color: #212529 !important; }
.bg-secondary { background-color: #6c757d !important; color: #fff; }
.bg-success { background-color: #198754 !important; color: #fff; }
.bg-danger { background-color: #dc3545 !important; color: #fff; }
.bg-warning { background-color: #ffc107 !important; color: #000; }
.bg-info { background-color: #0dcaf0 !important; color: #000; }
.bg-primary { background-color: #0d6efd !important; color: #fff; }
.rounded { border-radius: 0.25rem !important; }
.rounded-pill { border-radius: 50rem !important; }
.position-absolute { position: absolute !important; }
.top-0 { top: 0 !important; }
.start-100 { left: 100% !important; }
.translate-middle { transform: translate(-50%, -50%) !important; }
.d-none { display: none !important; }
.d-block { display: block !important; }
.d-grid { display: grid !important; }
.opacity-50 { opacity: 0.5 !important; }
.opacity-75 { opacity: 0.75 !important; }
.float-end { float: right !important; }
.text-end { text-align: right !important; }
.dropdown-menu-end { right: 0 !important; left: auto !important; }
.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.25rem 1.5rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: inherit;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}
.dropdown-item:hover, .dropdown-item:focus {
  color: #1e2125;
  background-color: #e9ecef;
  text-decoration: none;
}
.dropdown-divider {
  height: 0;
  margin: 0.5rem 0;
  overflow: hidden;
  border-top: 1px solid #e9ecef;
}
.dropdown-header {
  display: block;
  padding: 0.5rem 1.5rem;
  margin-bottom: 0;
  font-size: 0.875rem;
  color: #6c757d;
  white-space: nowrap;
}
.filter-total-card { min-width:220px; }

/* =========================================================================
   Manutenção de Viagens — Layout moderno
   ========================================================================= */
.mv-page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.mv-page-header__left { display:flex; align-items:center; gap:10px; }
.mv-page-header__icon { display:grid; place-items:center; width:36px; height:36px; border-radius:8px; background:#e3f2fd; color:#1565c0; font-size:1.1rem; }
.mv-page-header__title { font-size:1.3rem; font-weight:800; color:#263238; margin:0; }
.mv-page-header__back { display:flex; align-items:center; gap:5px; padding:6px 16px; border:1px solid #e0e6ec; border-radius:8px; background:#fff; color:#546e7a; font-size:.82rem; font-weight:700; text-decoration:none; transition:background .12s,color .12s; }
.mv-page-header__back:hover { background:#f5f7fa; color:#263238; }
.mv-filters { margin-bottom:8px; }
.mv-filters__row { display:flex; align-items:flex-end; gap:10px; flex-wrap:nowrap; overflow-x:auto; }
.mv-filters__field { display:flex; flex-direction:column; gap:2px; min-width:120px; }
.mv-filters__field label { font-size:.66rem; font-weight:700; text-transform:uppercase; color:#78909c; letter-spacing:.04em; }
.mv-filters__field input, .mv-filters__field select { border:1px solid #e0e6ec; border-radius:6px; padding:5px 8px; font-size:.82rem; height:34px; background:#fff; }
.mv-filters__field input:focus, .mv-filters__field select:focus { border-color:#90caf9; outline:none; box-shadow:0 0 0 2px rgba(21,101,192,.06); }
.mv-filters__actions { display:flex; gap:6px; flex-shrink:0; padding-bottom:1px; }
.mv-btn { display:flex; align-items:center; gap:5px; padding:6px 14px; border-radius:6px; font-size:.82rem; font-weight:700; text-decoration:none; border:0; cursor:pointer; transition:background .12s,color .12s; white-space:nowrap; height:34px; }
.mv-btn--primary { background:#1565c0; color:#fff; }
.mv-btn--primary:hover { background:#0d47a1; }
.mv-btn--ghost { background:#fff; color:#78909c; border:1px solid #e0e6ec; }
.mv-btn--ghost:hover { background:#fce4ec; color:#c62828; border-color:#ef9a9a; }
.mv-btn--danger { background:#e53935; color:#fff; }
.mv-btn--danger:hover { background:#c62828; }
.mv-kpis { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:10px; }
.mv-kpi { display:flex; align-items:center; gap:10px; padding:12px 14px; border:1px solid #eef2f7; border-radius:10px; background:#fafdff; transition:box-shadow .12s; }
.mv-kpi:hover { box-shadow:0 3px 12px rgba(0,0,0,.04); }
.mv-kpi__icon { display:grid; place-items:center; width:40px; height:40px; border-radius:50%; flex-shrink:0; font-size:1.1rem; }
.mv-kpi__icon--blue { background:#e3f2fd; color:#1565c0; }
.mv-kpi__icon--green { background:#e8f5e9; color:#2e7d32; }
.mv-kpi__icon--teal { background:#e0f2f1; color:#00695c; }
.mv-kpi__icon--amber { background:#fff8e1; color:#ef6c00; }
.mv-kpi__icon--rose { background:#fce4ec; color:#c62828; }
.mv-kpi__info { display:flex; flex-direction:column; gap:1px; min-width:0; }
.mv-kpi__label { font-size:.64rem; font-weight:700; text-transform:uppercase; color:#78909c; letter-spacing:.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mv-kpi__value { font-size:1.25rem; font-weight:800; color:#263238; white-space:nowrap; }
.mv-table-wrap { background:#fff; border:1px solid #eef2f7; border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,.02); overflow:hidden; }
.mv-table { width:100%; margin-bottom:0; }
.mv-table thead th { background:#fff; border:0; border-bottom:2px solid #f0f3f7; color:#78909c; font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:8px 12px; white-space:nowrap; }
.mv-table tbody tr { border:0; transition:background .1s; }
.mv-table tbody tr:hover { background:#f8fbff; }
.mv-table tbody td { border:0; border-bottom:1px solid #f5f7fa; padding:6px 12px; font-size:.84rem; color:#37474f; vertical-align:middle; }
.mv-table__row:last-child td { border-bottom:0; }
.mv-driver { font-weight:700; color:#263238; font-size:.84rem; }
.mv-plate { font-size:.74rem; color:#90a4ae; font-weight:600; }
.mv-badge { display:inline-block; padding:3px 10px; border-radius:6px; font-size:.72rem; font-weight:700; }
.mv-badge--blue { background:#e3f2fd; color:#1565c0; }
.mv-status { display:inline-block; padding:4px 12px; border-radius:6px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.mv-status--disponivel { background:#e8f5e9; color:#2e7d32; }
.mv-status--aguardando_carga { background:#dcedb8; color:#33691e; }
.mv-status--aguardando_inicio { background:#fff8e1; color:#ef6c00; }
.mv-status--em_viagem { background:#e3f2fd; color:#1565c0; }
.mv-status--aguardando_descarga { background:#e6ee9c; color:#558b2f; }
.mv-status--em_descarga { background:#ede7f6; color:#4527a0; }
.mv-status--em_manutencao { background:#fce4ec; color:#c62828; }
.mv-actions { display:flex; align-items:center; justify-content:center; gap:6px; }
.mv-action-btn { display:grid; place-items:center; width:32px; height:32px; border-radius:6px; border:1px solid #e0e6ec; background:#fff; color:#78909c; cursor:pointer; text-decoration:none; font-size:.85rem; transition:background .12s,color .12s,border-color .12s; }
.mv-action-btn:hover { background:#f5f7fa; color:#1565c0; border-color:#90caf9; }
.mv-action-btn--eye { color:#1565c0; }
.mv-action-btn--menu { color:#78909c; }
.mv-pagination { display:flex; align-items:center; justify-content:space-between; margin-top:12px; flex-wrap:wrap; gap:8px; }
.mv-pagination__nav { display:flex; align-items:center; gap:4px; }
.mv-page-btn { display:grid; place-items:center; min-width:32px; height:32px; padding:0 8px; border:1px solid #e0e6ec; border-radius:6px; background:#fff; color:#546e7a; font-size:.82rem; font-weight:700; text-decoration:none; cursor:pointer; transition:background .12s,color .12s,border-color .12s; }
.mv-page-btn:hover { background:#f5f7fa; border-color:#90caf9; color:#1565c0; }
.mv-page-btn--active { background:#1565c0; color:#fff; border-color:#1565c0; }
.mv-page-btn--disabled { opacity:.4; cursor:default; }
.mv-page-btn--disabled:hover { background:#fff; border-color:#e0e6ec; color:#546e7a; }
.mv-pagination__perpage { display:flex; align-items:center; gap:8px; font-size:.78rem; color:#78909c; }
.mv-pagination__perpage-btns { display:flex; gap:3px; }
.mv-perpage-btn { display:grid; place-items:center; min-width:28px; height:28px; padding:0 6px; border:1px solid #e0e6ec; border-radius:5px; background:#fff; color:#78909c; font-size:.76rem; font-weight:700; text-decoration:none; transition:background .12s; }
.mv-perpage-btn:hover { background:#f5f7fa; }
.mv-perpage-btn--active { background:#1565c0; color:#fff; border-color:#1565c0; }
@media (max-width: 1200px) { .mv-kpis { grid-template-columns:repeat(3,1fr); } .mv-filters__row { flex-wrap:wrap; } }
@media (max-width: 768px) { .mv-kpis { grid-template-columns:repeat(2,1fr); } .mv-table { min-width:700px; } .mv-pagination { flex-direction:column; align-items:center; } }
@media (max-width: 480px) { .mv-kpis { grid-template-columns:1fr; } .mv-page-header__title { font-size:1.05rem; } }

/* =========================================================================
   Atualização Operacional — Layout ERP compacto
   ========================================================================= */
.op-hero-bar { display:flex; align-items:center; background:#eef3ff; border:1px solid #d0def7; border-radius:6px; padding:0 10px; margin-bottom:6px; height:72px; }
.op-hero-bar__item { display:flex; flex-direction:column; justify-content:center; flex:1; min-width:0; padding:0 16px; height:100%; }
.op-hero-bar__item--divider { border-left:1px solid #cfddef; }
.op-hero-bar__label { font-size:.66rem; font-weight:700; text-transform:uppercase; color:#607d8b; margin-bottom:4px; display:flex; align-items:center; gap:4px; }
.op-hero-bar__value { font-size:1.05rem; font-weight:800; text-transform:uppercase; color:#1565c0; line-height:1.1; word-break:break-word; }
.op-hero-bar__status { font-size:.92rem; font-weight:800; padding:6px 16px; border-radius:6px; background:#1565c0; color:#fff; white-space:nowrap; display:inline-block; width:fit-content; }
.op-summary-bar { display:flex; align-items:center; justify-content:flex-start; background:#fff; border:1px solid #e3eaf3; border-radius:6px; padding:0 12px; margin-bottom:6px; height:48px; }
.op-summary-bar__group { display:flex; align-items:center; flex:1; width:100%; }
.op-summary-bar__item { display:flex; align-items:center; gap:5px; font-size:.85rem; font-weight:700; color:#37474f; white-space:nowrap; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; }
.op-summary-bar__item i { font-size:.85rem; color:#78909c; flex-shrink:0; }
.op-summary-bar__item--wide { flex:2; }
.op-main-layout { display:flex; gap:8px; align-items:flex-start; }
.op-main-layout__table { flex:1; min-width:0; }
.op-main-layout__details { width:340px; flex-shrink:0; }
.op-occurrence-panel { background:#fff; border:1px solid #e3eaf3; border-radius:6px; padding:6px 10px; }
.occurrence-table { margin-bottom:0; width:100%; table-layout:fixed; }
.occurrence-table thead th { border:0; border-bottom:2px solid #eef2f7; color:#78909c; font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:4px 2px; }
.occurrence-table tbody tr { border:0; }
.occurrence-table tbody td { border:0; border-bottom:1px solid #f0f3f7; padding:1px 2px; vertical-align:middle; }
.occurrence-col-name { width:35%; }
.occurrence-col-date { width:15%; }
.occurrence-col-time { width:12%; }
.occurrence-col-adjust { width:18%; }
.occurrence-col-validate { width:20%; }
.occurrence-row[data-tipo] { transition:background .12s; }
.occurrence-row[data-tipo]:hover { background:#f8fbff; }
.occurrence-row--maintenance:hover { background:#fff5f5; }
.occurrence-chip { display:flex; align-items:center; padding:0 16px; border-radius:2px; font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.03em; line-height:1.1; width:100%; min-height:52px; text-align:left; border:0; box-sizing:border-box; transition:filter .1s; }
.occurrence-chip:hover { filter:brightness(.95); }
.occurrence-chip--data_venda { background:#c8e6c9; color:#1b5e20; }
.occurrence-chip--data_carregamento { background:#b2dfdb; color:#004d40; }
.occurrence-chip--inicio_viagem { background:#fff9c4; color:#f57f17; }
.occurrence-chip--chegada_destino { background:#bbdefb; color:#0d47a1; }
.occurrence-chip--inicio_descarga { background:#90caf9; color:#0d47a1; }
.occurrence-chip--fim_descarga { background:#c5cae9; color:#1a237e; }
.occurrence-chip--parada_manutencao { background:#ef9a9a; color:#b71c1c; }
.occurrence-input-date, .occurrence-input-time { max-width:100%; margin:0 auto; text-align:center; padding:4px 4px; font-size:.78rem; }
.occurrence-date-display, .occurrence-time-display { font-size:.8rem; font-weight:700; color:#37474f; }
.occurrence-locked { color:#b0bec5; font-size:.85rem; }
.occurrence-done { color:#43a047; font-size:1.1rem; }
.occurrence-maintenance-item { font-size:.74rem; font-weight:600; color:#c62828; display:inline-block; padding:2px 6px; background:#fce4ec; border-radius:4px; margin-bottom:1px; }
.occurrence-btn-adjust { background:#e53935; color:#fff; border:2px solid #c62828; border-radius:5px; width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; font-size:0; transition:background .15s,border-color .15s; }
.occurrence-btn-adjust i { font-size:1rem; }
.occurrence-btn-validate { background:#43a047; color:#fff; border:2px solid #2e7d32; border-radius:5px; width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; font-size:0; transition:background .15s,border-color .15s; }
.occurrence-btn-validate i { font-size:1.05rem; }
.occurrence-btn-adjust:hover { background:#c62828; border-color:#b71c1c; }
.occurrence-btn-validate:hover { background:#2e7d32; border-color:#1b5e20; }
.occurrence-blocked-badge { font-size:.62rem; font-weight:700; padding:3px 7px; border-radius:4px; }
.op-details-panel { background:#fff; border:1px solid #e3eaf3; border-radius:6px; display:flex; flex-direction:column; overflow:hidden; }
.op-details-panel__header { display:flex; align-items:center; gap:6px; padding:10px 14px; background:#f7f9fc; border-bottom:2px solid #eef2f7; font-size:.8rem; font-weight:800; text-transform:uppercase; color:#37474f; letter-spacing:.03em; }
.op-details-panel__header i { color:#1565c0; }
.op-details-panel__body { padding:12px; overflow-y:auto; }
.op-details-panel__section { margin-bottom:14px; }
.op-details-panel__section:last-child { margin-bottom:0; }
.op-details-panel__grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.op-details-panel__field { display:flex; flex-direction:column; gap:2px; padding:8px 10px; background:#f7f9fc; border-radius:6px; border:1px solid #eef2f7; }
.op-details-panel__field span { font-size:.64rem; font-weight:600; text-transform:uppercase; color:#78909c; }
.op-details-panel__field span i { color:#1565c0; margin-right:3px; }
.op-details-panel__field strong { font-size:.82rem; font-weight:700; color:#263238; }
.op-details-panel__finance { display:flex; flex-direction:column; gap:8px; }
.op-finance-card { padding:10px 12px; border-left:5px solid #43a047; border-radius:6px; background:#fff; border:1px solid #eef2f7; display:flex; flex-direction:column; gap:2px; }
.op-finance-card--pending { border-left-color:#fbc02d; animation:finance-pending 2.4s ease-in-out infinite; }
.op-finance-label { font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#78990c; }
.op-finance-value { font-size:1rem; font-weight:800; color:#263238; }
.op-finance-hint { font-size:.68rem; color:#90a4ae; }
.op-details-panel__back-btn { display:flex; align-items:center; justify-content:center; gap:6px; padding:10px; border:1px solid #43a047; border-radius:6px; color:#43a047; font-weight:700; font-size:.82rem; text-decoration:none; transition:background .12s,color .12s; }
.op-details-panel__back-btn:hover { background:#43a047; color:#fff; }
.op-details-panel__whatsapp { flex:1; display:flex; align-items:flex-end; }
.op-whatsapp-card { display:flex; align-items:center; gap:12px; width:100%; padding:16px 14px; background:linear-gradient(135deg,#25d366,#128c7e); border-radius:10px; text-decoration:none; transition:filter .15s; box-shadow:0 3px 12px rgba(37,211,102,.22); }
.op-whatsapp-card:hover { filter:brightness(.92); }
.op-whatsapp-card > i { font-size:1.8rem; color:#fff; flex-shrink:0; }
.op-whatsapp-card__info { display:flex; flex-direction:column; gap:2px; }
.op-whatsapp-card__info span { font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:rgba(255,255,255,.8); }
.op-whatsapp-card__info strong { font-size:1.15rem; font-weight:800; color:#fff; letter-spacing:.02em; }
@keyframes finance-pending { 0%,100% { background:#fff9dc; } 50% { background:#fff0ed; } }
@media (prefers-reduced-motion: reduce) { .op-finance-card--pending { animation:none; } }
@media (max-width: 1200px) { .op-main-layout { flex-direction:column; } .op-main-layout__details { width:100%; } }
@media (max-width: 991px) { .occurrence-table { min-width:700px; } .op-hero-bar { flex-wrap:wrap; height:auto; padding:8px 10px; } .op-hero-bar__item { padding:6px 10px; min-width:50%; } .op-hero-bar__item--divider { border:0; } }
@media (max-width: 575px) { .op-hero-bar__value { font-size:.9rem; } .op-hero-bar__status { font-size:.82rem; padding:4px 12px; } .op-hero-bar__item { min-width:100%; } .op-summary-bar { flex-wrap:wrap; height:auto; padding:8px 10px; } .op-summary-bar__group { flex-wrap:wrap; gap:6px; } .op-summary-bar__item { font-size:.78rem; } .occurrence-chip { min-height:38px; font-size:.64rem; } }

/* =========================================================================
   Dashboard Disponibilidade da Frota  (fcd-*)
   ========================================================================= */
.fcd-topbar { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin:0 0 6px; }
.fcd-topbar__refresh { display:grid; place-items:center; width:34px; height:34px; border:1px solid #dde4ee; border-radius:9px; background:#fff; color:#2d62da; cursor:pointer; transition:background .12s,transform .4s; }
.fcd-topbar__refresh:hover { background:#f3f7ff; }
.fcd-topbar__refresh.loading i { animation:fcd-spin .8s linear infinite; }
@keyframes fcd-spin { to { transform:rotate(360deg); } }
.fcd-topbar__datetime { font-size:.78rem; font-weight:700; color:#546e7a; white-space:nowrap; letter-spacing:.02em; }

.fcd-kpis { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.fcd-kpi { display:flex; align-items:center; gap:10px; min-height:86px; padding:14px 14px; border:1px solid #eef2f7; border-radius:12px; background:#fff; box-shadow:0 1px 3px rgba(20,40,80,.04); position:relative; overflow:hidden; }
.fcd-kpi::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--fcd-color,#2d62da); }
.fcd-kpi__icon { display:grid; place-items:center; width:40px; height:40px; border-radius:11px; background:color-mix(in srgb, var(--fcd-color,#2d62da) 14%, #fff); color:var(--fcd-color,#2d62da); font-size:1.05rem; flex:0 0 auto; }
.fcd-kpi__data { display:flex; flex-direction:column; min-width:0; gap:4px; line-height:1.1; }
.fcd-kpi__label { font-size:.6rem; font-weight:800; letter-spacing:.03em; color:#6b7a90; text-transform:uppercase; white-space:normal; overflow:hidden; text-overflow:ellipsis; line-height:1.15; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.fcd-kpi__value { display:flex; align-items:baseline; gap:6px; font-size:1.65rem; font-weight:800; color:#16233d; line-height:1; }
.fcd-kpi__pct { font-size:.7rem; font-weight:700; color:#9aa7bd; }
.fcd-kpi--total { background:linear-gradient(135deg,#13214a,#1d3170); border-color:#13214a; }
.fcd-kpi--total::before { background:#4778d8; }
.fcd-kpi--total .fcd-kpi__icon { background:rgba(255,255,255,.16); color:#fff; }
.fcd-kpi--total .fcd-kpi__label, .fcd-kpi--total .fcd-kpi__pct { color:#c5d2ee; }
.fcd-kpi--total .fcd-kpi__value { color:#fff; }

.fcd-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:12px; }
.fcd-card { display:flex; flex-direction:column; background:#fff; border:1px solid #eef2f7; border-radius:12px; box-shadow:0 1px 3px rgba(20,40,80,.04); overflow:hidden; min-height:230px; }
.fcd-card__header { display:flex; align-items:center; justify-content:space-between; padding:8px 12px; border-bottom:2px solid var(--fcd-color,#2d62da); }
.fcd-card__label { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.03em; color:#37474f; }
.fcd-card__badge { display:grid; place-items:center; min-width:28px; height:28px; padding:0 8px; border-radius:999px; background:var(--fcd-color,#2d62da); color:#fff; font-size:.82rem; font-weight:800; }
.fcd-card__body { flex:1; padding:6px 8px 4px; overflow-y:auto; max-height:240px; }
.fcd-card__body::-webkit-scrollbar { width:4px; }
.fcd-card__body::-webkit-scrollbar-thumb { background:#cfd8dc; border-radius:2px; }
.fcd-vrow { display:grid; grid-template-columns:78px 1fr auto; align-items:center; gap:8px; padding:5px 7px; margin-bottom:3px; border-radius:6px; background:#f7f9fc; font-size:.72rem; }
.fcd-vrow:hover { background:#edf5ff; }
.fcd-vrow__plate { font-weight:800; color:#1d3170; white-space:nowrap; }
.fcd-vrow__city { color:#7d8aa0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
.fcd-vrow__time { display:flex; align-items:center; gap:5px; justify-content:flex-end; font-weight:700; color:#33466a; white-space:nowrap; }
.fcd-vrow__bar { display:inline-block; width:18px; height:3px; border-radius:2px; background:var(--fcd-color,#2d62da); }
.fcd-card__footer { text-align:right; padding:4px 6px 6px; }
.fcd-card__all { font-size:.68rem; font-weight:700; color:#2d62da; text-decoration:none; }
.fcd-card__all:hover { text-decoration:underline; }
.fcd-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:22px 8px; text-align:center; color:#b8c4d4; }
.fcd-empty__icon { color:#d6deea; font-size:1.4rem; }
.fcd-empty__title { font-size:.78rem; font-weight:700; color:#9aa7bd; }
.fcd-empty__msg { font-size:.66rem; color:#b8c4d4; }

.fcd-card--chart { min-height:auto; }
.fcd-dist { display:flex; align-items:center; gap:12px; padding:10px; }
.fcd-donut-wrap { position:relative; display:grid; place-items:center; flex:0 0 168px; }
.fcd-donut-center { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; gap:1px; }
.fcd-donut-center__label { font-size:.56rem; font-weight:700; color:#8294b0; letter-spacing:.04em; }
.fcd-donut-center__value { font-size:1.2rem; font-weight:800; color:#1d2b45; line-height:1; }
.fcd-donut-center__sub { font-size:.56rem; color:#8294b0; }
.fcd-dist__legend { list-style:none; margin:0; padding:0; flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.fcd-dist__legend li { display:grid; grid-template-columns:12px 1fr auto; align-items:center; gap:7px; font-size:.68rem; color:#4a5b78; }
.fcd-legend__dot { width:12px; height:12px; border-radius:3px; background:var(--fcd-color,#2d62da); }
.fcd-legend__name { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fcd-legend__num { font-weight:800; color:#1d2b45; white-space:nowrap; }

.fcd-bottom { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.fcd-let-card { background:#fff; border:1px solid #eef2f7; border-radius:12px; box-shadow:0 1px 3px rgba(20,40,80,.04); padding:12px 14px; display:flex; flex-direction:column; gap:10px; }
.fcd-let-card__head { display:flex; align-items:center; gap:7px; font-size:.66rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:#7d8aa0; }
.fcd-let-card__head i { color:#2d62da; }
.fcd-let-card__body { display:flex; flex-direction:column; gap:3px; }
.fcd-let-card__plate { font-size:1.1rem; font-weight:800; color:#1d3170; line-height:1.1; }
.fcd-let-card__time { font-size:.74rem; font-weight:700; color:#546e7a; }
.fcd-let-card__rate { font-size:1.5rem; font-weight:800; color:#2e9e63; line-height:1; }
.fcd-let-card__sub { font-size:.72rem; font-weight:600; color:#7d8aa0; }

@media(max-width:1400px){ .fcd-kpis{grid-template-columns:repeat(4,1fr)} .fcd-grid{grid-template-columns:repeat(3,1fr)} .fcd-bottom{grid-template-columns:repeat(2,1fr)} }
@media(max-width:1100px){ .fcd-kpis{grid-template-columns:repeat(2,1fr)} .fcd-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:680px){ .fcd-kpis{grid-template-columns:1fr} .fcd-grid{grid-template-columns:1fr} .fcd-bottom{grid-template-columns:1fr} }

/* =========================================================================
   Dashboard Localização da Frota — Leaflet + KPIs + Sidebar
   ========================================================================= */
.fl-kpis { display:grid; grid-template-columns:repeat(7,1fr); gap:8px; margin-bottom:8px; }
.fl-kpi { display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid #eef2f7; border-radius:8px; background:#fafdff; box-shadow:0 1px 4px rgba(0,0,0,.02); transition:box-shadow .12s; }
.fl-kpi:hover { box-shadow:0 3px 10px rgba(0,0,0,.04); }
.fl-kpi__icon { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; flex-shrink:0; background:var(--kpi-color,#1565c0); color:#fff; font-size:.9rem; }
.fl-kpi__info { display:flex; flex-direction:column; gap:0; min-width:0; }
.fl-kpi__value { font-size:1.15rem; font-weight:800; color:#263238; line-height:1.1; }
.fl-kpi__label { font-size:.6rem; font-weight:700; text-transform:uppercase; color:#78909c; letter-spacing:.03em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fl-kpi__pct { font-size:.66rem; font-weight:700; color:#1565c0; }
.fl-main { display:flex; gap:10px; align-items:flex-start; }
.fl-map-area { flex:1; min-width:0; position:relative; }
.fl-sidebar { width:35%; flex-shrink:0; display:flex; flex-direction:column; }
.fl-sidebar__header { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:#fff; border:1px solid #eef2f7; border-radius:10px 10px 0 0; }
.fl-sidebar__title { display:flex; align-items:center; gap:6px; font-size:.82rem; font-weight:800; text-transform:uppercase; color:#37474f; }
.fl-sidebar__title i { color:#1565c0; font-size:.9rem; }
.fl-sidebar__all { background:none; border:1px solid #e0e6ec; border-radius:6px; padding:4px 12px; font-size:.72rem; font-weight:700; color:#1565c0; cursor:pointer; transition:background .12s; }
.fl-sidebar__all:hover { background:#e3f2fd; }
.fl-sidebar__body { background:#f7f9fc; border-left:1px solid #eef2f7; border-right:1px solid #eef2f7; max-height:480px; overflow-y:auto; padding:8px; display:flex; flex-direction:column; gap:8px; }
.fl-sidebar__body::-webkit-scrollbar { width:4px; }
.fl-sidebar__body::-webkit-scrollbar-thumb { background:#cfd8dc; border-radius:2px; }
.fl-city-card { display:flex; align-items:center; gap:6px; padding:10px 12px; background:#fff; border:1px solid #eef2f7; border-radius:10px; box-shadow:0 1px 4px rgba(0,0,0,.03); cursor:pointer; transition:box-shadow .12s,transform .12s; position:relative; }
.fl-city-card:hover { box-shadow:0 3px 12px rgba(0,0,0,.06); transform:translateY(-1px); }
.fl-city-card__city { display:flex; flex-direction:column; gap:1px; min-width:0; flex:1.5; }
.fl-city-card__city strong { font-size:.84rem; font-weight:700; color:#263238; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fl-city-card__city span { font-size:.68rem; color:#90a4ae; font-weight:500; }
.fl-city-card__uf { display:grid; place-items:center; min-width:36px; padding:4px 6px; border-radius:6px; background:#e3f2fd; color:#1565c0; font-size:.72rem; font-weight:800; text-align:center; }
.fl-city-card__qty { display:flex; flex-direction:column; align-items:center; min-width:50px; }
.fl-city-card__qty strong { font-size:1.3rem; font-weight:800; color:#263238; line-height:1; }
.fl-city-card__qty span { font-size:.58rem; color:#90a4ae; font-weight:600; text-transform:lowercase; }
.fl-city-card__badges { display:flex; gap:2px; flex-wrap:nowrap; overflow:visible; }
.fl-city-badge { display:grid; place-items:center; min-width:20px; height:20px; padding:0 3px; border-radius:50%; background:var(--badge-bg,#eef2f7); color:var(--badge-c,#546e7a); font-size:.58rem; font-weight:800; border:1.5px solid var(--badge-c,#cfd8dc); flex-shrink:0; }
.fl-city-card__arrow { position:absolute; right:10px; top:50%; transform:translateY(-50%); color:#cfd8dc; font-size:.9rem; }
.fl-map-footer { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:6px; padding:6px 14px; border:1px solid #eef2f7; border-radius:8px; background:#fff; font-size:.76rem; color:#78909c; }
.fl-map-footer__updated { font-weight:600; }
.fl-map-footer__refresh { display:grid; place-items:center; width:28px; height:28px; border:1px solid #e0e6ec; border-radius:6px; background:#fff; color:#1565c0; cursor:pointer; font-size:.78rem; transition:background .12s; }
.fl-map-footer__refresh:hover { background:#f5f7fa; }
.fl-map-footer__datetime { font-weight:700; color:#546e7a; white-space:nowrap; }
.fl-leaflet-map { width:100%; height:560px; border-radius:12px; box-shadow:0 2px 12px rgba(0,0,0,.06); z-index:1; background:#b3d9f2; overflow:hidden; }
.leaflet-container { font-family:inherit; border-radius:12px; }
.leaflet-control-zoom { margin:10px !important; border:0 !important; box-shadow:none !important; }
.leaflet-control-zoom a { display:grid; place-items:center; width:32px !important; height:32px !important; border:0 !important; border-radius:6px !important; background:#fff !important; color:#1565c0 !important; box-shadow:0 2px 6px rgba(0,0,0,.1); font-size:1.2rem !important; font-weight:700; line-height:32px !important; margin-bottom:4px !important; }
.leaflet-control-zoom a:hover { background:#f5f7fa !important; }
.fl-center-ctrl { margin:10px !important; }
.fl-center-btn { display:flex; align-items:center; gap:6px; padding:7px 14px; border:0; border-radius:8px; background:#fff; color:#1565c0; font-size:.78rem; font-weight:700; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.1); transition:background .12s; }
.fl-center-btn:hover { background:#f5f7fa; }
.fl-center-btn i { font-size:.9rem; }
.fl-map-layer-toggle { position:absolute; top:10px; left:10px; z-index:500; display:flex; gap:0; border-radius:8px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,.1); }
.fl-layer-btn { padding:7px 16px; border:0; font-size:.74rem; font-weight:700; background:#fff; color:#78909c; cursor:pointer; transition:background .12s,color .12s; }
.fl-layer-btn:hover { background:#f5f7fa; }
.fl-layer-btn--active { background:#1565c0; color:#fff; }
.fl-pin-wrap { background:transparent; border:0; }
.fl-pin { width:32px; height:32px; border-radius:50%; background:var(--pin-color,#1565c0); display:grid; place-items:center; border:3px solid #fff; box-shadow:0 2px 6px rgba(0,0,0,.2); transition:transform .12s; }
.fl-pin:hover { transform:scale(1.18); }
.fl-pin__num { font-size:.72rem; font-weight:800; color:#fff; pointer-events:none; }
.fl-cluster-wrap { background:transparent; border:0; }
.fl-cluster { width:52px; height:52px; border-radius:50%; background:#fff; border:2px solid #1565c0; display:grid; place-items:center; position:relative; box-shadow:0 2px 8px rgba(21,101,192,.18); transition:transform .12s; }
.fl-cluster:hover { transform:scale(1.06); }
.fl-cluster__halo { position:absolute; top:-5px; left:-5px; display:flex; gap:1px; }
.fl-cl-dot { width:8px; height:8px; border-radius:50%; border:1.5px solid #fff; }
.fl-cluster__num { font-size:.82rem; font-weight:800; color:#1565c0; z-index:1; }
.leaflet-marker-cluster { background:transparent !important; }
.fl-popup-wrap .leaflet-popup-content-wrapper { border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,.1); border:1px solid #eef2f7; padding:0; }
.fl-popup-wrap .leaflet-popup-content { margin:12px 16px; }
.fl-popup-wrap .leaflet-popup-tip { background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.fl-popup { min-width:200px; }
.fl-popup__plate { font-size:1rem; font-weight:800; color:#1565c0; margin-bottom:8px; padding-bottom:6px; border-bottom:1px solid #f0f3f7; }
.fl-popup__row { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; font-size:.78rem; }
.fl-popup__row span { color:#78909c; font-weight:600; }
.fl-popup__row strong { color:#263238; font-weight:700; }
.fl-tt-mini { padding:4px 8px; display:flex; flex-direction:column; gap:2px; font-size:.72rem; }
.fl-tt-mini strong { font-weight:800; color:#1565c0; }
.fl-tt-mini span { color:#546e7a; }
.fl-tt-mini i { font-style:normal; font-size:.66rem; font-weight:700; padding:2px 8px; border-radius:4px; color:#fff; display:inline-block; width:fit-content; }
.leaflet-tooltip { border:0; border-radius:6px; box-shadow:0 4px 12px rgba(0,0,0,.08); padding:6px 10px; }
@media (max-width: 1200px) { .fl-kpis { grid-template-columns:repeat(4,1fr); } .fl-main { flex-direction:column; } .fl-sidebar { width:100%; } .fl-leaflet-map { height:420px; } }
@media (max-width: 768px) { .fl-kpis { grid-template-columns:repeat(2,1fr); } .fl-leaflet-map { height:340px; } }
@media (max-width: 480px) { .fl-kpis { grid-template-columns:1fr; } .fl-layer-btn { padding:6px 10px; font-size:.68rem; } }

/* =========================================================================
   Fleet status badges (compartilhado)
   ========================================================================= */
.fleet-status { display: inline-flex; padding: 5px 9px; border-radius: 999px; color: #fff; font-size: .78rem; font-weight: 700; }
.fleet-status--disponivel { background: var(--fleet-disponivel); }
.fleet-status--aguardando_carga { background: var(--fleet-aguardando-carga); }
.fleet-status--aguardando_inicio { background: var(--fleet-aguardando-inicio); }
.fleet-status--em_viagem { background: var(--fleet-em-viagem); }
.fleet-status--aguardando_descarga { background: var(--fleet-aguardando-descarga); }
.fleet-status--em_descarga { background: var(--fleet-em-descarga); }
.fleet-status--em_manutencao { background: var(--fleet-em-manutencao); }

/* =========================================================================
   Finance status (compartilhado)
   ========================================================================= */
.finance-status { border: 1px solid var(--od-border); border-left: 5px solid var(--od-green); border-radius: 8px; padding: 16px 20px; display: grid; gap: 2px; background: #fff; }
.finance-status--pending { border-left-color: var(--od-yellow); animation: finance-pending 2.4s ease-in-out infinite; }
@keyframes finance-pending { 0%,100% { background: #fff9dc; border-left-color: var(--od-yellow); } 50% { background: #fff0ed; border-left-color: var(--od-red); } }
@media (prefers-reduced-motion: reduce) { .finance-status--pending { animation: none; background: #fff9dc; } }

/* =========================================================================
   Viagens — referência images/modelo de tela - Viagens.png
   ========================================================================= */
.vg-kpis { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.vg-kpi { min-width:0; min-height:82px; display:flex; align-items:center; gap:12px; padding:12px 14px; background:#fff; border:1px solid #e8edf3; border-radius:10px; box-shadow:0 2px 8px rgba(22,34,56,.035); }
.vg-kpi__icon { width:48px; height:48px; flex:0 0 48px; display:grid; place-items:center; border-radius:50%; font-size:1.25rem; }
.vg-kpi__icon--blue { background:#edf3ff; color:#2858d5; }
.vg-kpi__icon--amber { background:#fff4dd; color:#ee9d09; }
.vg-kpi__icon--green { background:#e6f6eb; color:#178842; }
.vg-kpi__icon--cyan { background:#e9f2ff; color:#1769d2; }
.vg-kpi__icon--purple { background:#f2eaff; color:#6933d5; }
.vg-kpi__icon--red { background:#fdebec; color:#d72c35; }
.vg-kpi > div { min-width:0; display:flex; flex-direction:column; }
.vg-kpi small { color:#405276; font-size:.64rem; font-weight:800; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vg-kpi strong { color:#15274f; font-size:1.4rem; line-height:1.2; font-weight:800; }
.vg-kpi span:not(.vg-kpi__icon) { color:#60708d; font-size:.7rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.vg-filter { margin-bottom:16px; background:#fff; border:1px solid #e5eaf1; border-radius:10px; box-shadow:0 2px 8px rgba(22,34,56,.03); overflow:hidden; }
.vg-filter__title { padding:11px 14px; border-bottom:1px solid #e8edf3; color:#17284e; font-size:.76rem; font-weight:800; text-transform:uppercase; }
.vg-filter__body { padding:14px; }
.vg-filter__grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px 12px; }
.vg-filter__field { min-width:0; display:flex; flex-direction:column; gap:5px; }
.vg-filter__field label { color:#304161; font-size:.69rem; font-weight:700; white-space:nowrap; }
.vg-filter__field .form-control,.vg-filter__field .form-select { width:100%; height:38px; border:1px solid #dce4ef; border-radius:6px; padding:0 10px; font-size:.78rem; box-shadow:none; background:#fff; }
.vg-filter__field .form-control:focus,.vg-filter__field .form-select:focus { border-color:#3970da; box-shadow:0 0 0 2px rgba(57,112,218,.08); }
.vg-filter__field .errorlist { margin:0; padding:0; list-style:none; color:#c62828; font-size:.65rem; }
.vg-filter__field--actions { display:flex; flex-direction:column; gap:5px; }
.vg-filter__field--actions label { visibility:hidden; }
.vg-filter__btn-group { display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px; align-items:end; height:38px; }
.vg-filter__btn-group .vg-btn { width:100%; min-width:0; padding:0 6px; justify-content:center; }
.vg-btn--new { min-width:0; }
.vg-btn { height:38px; display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:0 18px; border-radius:6px; border:1px solid transparent; font-size:.76rem; font-weight:800; text-transform:uppercase; text-decoration:none; cursor:pointer; transition:background .14s,border-color .14s,color .14s; }
.vg-btn--primary,.vg-btn--new { background:#1e51cf; border-color:#1e51cf; color:#fff; }
.vg-btn--primary:hover,.vg-btn--new:hover { background:#173fa9; border-color:#173fa9; color:#fff; }
.vg-btn--outline { background:#fff; border-color:#3064d9; color:#2658ce; }
.vg-btn--outline:hover { background:#edf3ff; color:#173fa9; }
.vg-btn--new { min-width:180px; margin-left:10px; }

.vg-table-card { overflow:hidden; background:#fff; border:1px solid #e4e9f0; border-radius:10px; box-shadow:0 2px 9px rgba(22,34,56,.035); }
.vg-table { width:100%; margin:0; border-collapse:collapse; }
.vg-table thead th { padding:10px 12px; border:0; border-bottom:1px solid #dfe5ed; color:#314261; background:#fff; font-size:.68rem; font-weight:800; text-transform:uppercase; white-space:nowrap; }
.vg-table thead th i { margin-right:5px; color:#49617f; }
.vg-table tbody tr { transition:background .12s; }
.vg-table tbody tr:nth-child(even) { background:#f8f9fb; }
.vg-table tbody tr:hover { background:#edf4ff; }
.vg-table tbody td { padding:7px 12px; border:0; border-bottom:1px solid #e8edf3; color:#253657; font-size:.78rem; vertical-align:middle; }
.vg-table__trip { color:#143d8f !important; font-weight:800; }
.vg-table__money { color:#1d3157 !important; white-space:nowrap; }
.vg-status-group { display:grid; grid-template-columns:auto minmax(74px,auto); gap:3px 6px; align-items:center; }
.vg-status-label { color:#8290aa; font-size:.54rem; font-weight:700; text-transform:uppercase; }
.vg-status { min-width:76px; display:inline-flex; align-items:center; justify-content:center; padding:4px 8px; border-radius:5px; font-size:.65rem; font-weight:700; white-space:nowrap; }
.vg-status--trip-finalizada { background:#e7ebf1; color:#4a5870; }
.vg-status--trip-transito { background:#e1efff; color:#1762b6; }
.vg-status--trip-cancelada { background:#fde4e5; color:#c3262e; }
.vg-status--vehicle-disponivel { background:#dcf5df; color:#21863d; }
.vg-status--vehicle-aguardando_carga,.vg-status--vehicle-aguardando_inicio { background:#dfedff; color:#2170bd; }
.vg-status--vehicle-em_viagem { background:#fff2d9; color:#b36c00; }
.vg-status--vehicle-aguardando_descarga,.vg-status--vehicle-em_descarga { background:#eee7ff; color:#6845ba; }
.vg-status--vehicle-em_manutencao { background:#fde4e5; color:#bd252d; }
.vg-status--payment-adiantamento { background:#e3f6f7; color:#087f89; grid-column:2; }
.vg-status--payment-saldo { background:#fff2d9; color:#a96800; grid-column:2; }
.vg-status--payment-paga { background:#dcf5df; color:#21863d; grid-column:2; }
.vg-open-btn { height:30px; display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:0 11px; border:1px solid #2d62da; border-radius:5px; background:#fff; color:#2456cb; font-size:.7rem; font-weight:700; text-decoration:none; transition:background .12s,color .12s; }
.vg-open-btn:hover { background:#2456cb; color:#fff; }
.vg-table-card__footer { padding:0 14px 8px; }
.vg-table-card__footer .mv-pagination { margin-top:8px; }

.vg-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); margin-bottom:12px; padding:9px 14px; border:1px solid #e6edf6; border-radius:9px; background:linear-gradient(90deg,#f4f8ff,#f9fbff); }
.vg-metric { min-width:0; display:flex; align-items:center; gap:10px; padding:2px 16px; border-right:1px solid #dce5f0; }
.vg-metric:first-child { padding-left:2px; }
.vg-metric:last-child { border-right:0; }
.vg-metric__icon { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:50%; font-size:.9rem; }
.vg-metric__icon--blue { background:#e7efff; color:#2858d5; }
.vg-metric__icon--green { background:#e6f6eb; color:#178842; }
.vg-metric__icon--purple { background:#f1eaff; color:#6933d5; }
.vg-metric > div { min-width:0; display:flex; flex-wrap:wrap; align-items:baseline; gap:0 5px; }
.vg-metric small { width:100%; color:#71809c; font-size:.61rem; font-weight:700; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vg-metric strong { color:#1a2d52; font-size:.96rem; font-weight:800; white-space:nowrap; }
.vg-metric span:not(.vg-metric__icon) { color:#71809c; font-size:.64rem; }

@media(max-width:1400px){.vg-kpis{grid-template-columns:repeat(3,1fr)}.vg-kpi{min-height:72px}.vg-filter__grid{grid-template-columns:repeat(5,minmax(150px,1fr))}.vg-metrics{grid-template-columns:repeat(5,minmax(150px,1fr));overflow-x:auto}.vg-table{min-width:940px}}
@media(max-width:900px){.vg-kpis{grid-template-columns:repeat(2,1fr)}.vg-filter__grid{grid-template-columns:repeat(2,minmax(140px,1fr))}.vg-btn{flex:1}.vg-metrics{grid-template-columns:repeat(2,1fr)}.vg-metric{border-right:0;border-bottom:1px solid #dce5f0;padding:8px}.vg-table{min-width:900px}}
@media(max-width:576px){.vg-kpis{grid-template-columns:1fr}.vg-filter__actions{flex-direction:column}.vg-btn{width:100%}.vg-kpi{min-height:68px}}

/* =========================================================================
   Dashboard — Disponibilidade da Frota II  (fii-*)
   ========================================================================= */
.fii-header { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px 16px; margin:4px 0 14px; }
.fii-header__left { min-width:0; }
.fii-header__title { font-size:1.35rem; font-weight:800; color:#1d2b45; margin:0; }
.fii-header__subtitle { font-size:.8rem; color:#7d8aa0; margin:2px 0 0; }
.fii-header__right { display:flex; align-items:center; gap:10px; font-size:.76rem; color:#7d8aa0; }
.fii-header__back { display:inline-flex; align-items:center; gap:5px; padding:6px 12px; border:1px solid #dde4ee; border-radius:8px; background:#fff; color:#34466a; font-size:.76rem; font-weight:700; text-decoration:none; transition:background .12s,color .12s; }
.fii-header__back:hover { background:#f5f7fb; color:#1d2b45; }
.fii-live-dot { width:8px; height:8px; border-radius:50%; background:#43a047; box-shadow:0 0 6px rgba(67,160,71,.5); }
.fii-header__updated { font-weight:600; white-space:nowrap; }
.fii-header__refresh { display:grid; place-items:center; width:30px; height:30px; border:1px solid #dde4ee; border-radius:8px; background:#fff; color:#2d62da; cursor:pointer; transition:background .12s; }
.fii-header__refresh:hover { background:#f5f7fb; }

.fii-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.fii-kpi { position:relative; padding:16px; border:1px solid #eaeff6; border-radius:14px; background:#fff; box-shadow:0 1px 4px rgba(20,40,80,.04); overflow:hidden; }
.fii-kpi::before { content:""; position:absolute; top:0; left:0; width:4px; height:100%; background:var(--fii-color,#2d62da); }
.fii-kpi__head { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.fii-kpi__icon { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:color-mix(in srgb, var(--fii-color,#2d62da) 14%, #fff); color:var(--fii-color,#2d62da); font-size:1rem; }
.fii-kpi__label { font-size:.72rem; font-weight:800; letter-spacing:.04em; color:#3c4d6b; }
.fii-kpi__value { font-size:2.1rem; font-weight:800; color:#16233d; line-height:1; }
.fii-kpi__pct { margin-top:6px; font-size:.74rem; font-weight:700; color:#8294b0; }
.fii-kpi--total { background:linear-gradient(135deg,#13214a,#1d3170); border-color:#13214a; }
.fii-kpi--total .fii-kpi__label, .fii-kpi--total .fii-kpi__pct { color:#c5d2ee; }
.fii-kpi--total .fii-kpi__value { color:#fff; }
.fii-kpi--total .fii-kpi__icon { background:rgba(255,255,255,.16); color:#fff; }
.fii-kpi--total::before { background:#4778d8; }

.fii-middle { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(320px,1fr); gap:16px; margin-bottom:16px; }
.fii-panel { background:#fff; border:1px solid #eaeff6; border-radius:14px; box-shadow:0 1px 4px rgba(20,40,80,.04); padding:14px 16px; }
.fii-panel__title { font-size:.74rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#3c4d6b; margin-bottom:10px; }
.fii-aside { display:flex; flex-direction:column; gap:16px; min-width:0; }

.fii-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.fii-tab { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border:1px solid #e3e8f0; border-radius:999px; background:#fff; color:#5b6b86; font-size:.74rem; font-weight:700; cursor:pointer; transition:all .12s; }
.fii-tab:hover { background:#f5f7fb; }
.fii-tab.active { background:color-mix(in srgb, var(--fii-color,#2d62da) 12%, #fff); color:#26365a; border-color:var(--fii-color,#2d62da); }
.fii-tab__count { display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 5px; border-radius:999px; background:var(--fii-color,#2d62da); color:#fff; font-size:.68rem; font-weight:800; }

.fii-table-scroll { overflow-x:auto; }
.fii-table { width:100%; border-collapse:collapse; min-width:640px; }
.fii-table th { text-align:left; padding:9px 12px; font-size:.66rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#8294b0; border-bottom:2px solid #eef2f8; }
.fii-table td { padding:9px 12px; font-size:.78rem; color:#2c3e5d; border-bottom:1px solid #f1f4f9; white-space:nowrap; }
.fii-table tbody tr:hover { background:#f7f9fd; }
.fii-cell__plate { font-weight:800; color:#2d62da; }
.fii-status { display:inline-flex; align-items:center; padding:3px 9px; border-radius:999px; font-size:.68rem; font-weight:700; background:color-mix(in srgb, var(--fii-color,#2d62da) 14%, #fff); color:var(--fii-color,#2d62da); }
.fii-empty { text-align:center; color:#b0bec5; padding:22px 0; }

.fii-table th.fii-th__actions, .fii-cell__actions { width:44px; text-align:center; }
.fii-actions { display:inline-grid; place-items:center; width:28px; height:28px; border-radius:8px; border:0; background:transparent; color:#7d8aa0; cursor:pointer; transition:background .12s,color .12s; }
.fii-actions:hover { background:#eef3fb; color:#2d62da; }
.fii-actions-wrap { position:relative; display:inline-block; }
.fii-menu { position:absolute; top:30px; right:0; z-index:40; min-width:200px; padding:6px; border:1px solid #e1e8f2; border-radius:10px; background:#fff; box-shadow:0 8px 26px rgba(20,40,80,.14); opacity:0; visibility:hidden; transform:translateY(-4px); transition:opacity .12s,transform .12s,visibility .12s; }
.fii-menu.show { opacity:1; visibility:visible; transform:translateY(0); }
.fii-menu__item { display:flex; align-items:center; gap:8px; padding:9px 12px; border-radius:7px; font-size:.76rem; font-weight:700; color:#33466a; text-decoration:none; cursor:pointer; white-space:nowrap; }
.fii-menu__item:hover { background:#f1f6ff; color:#2d62da; }
.fii-menu__item--disabled { color:#b9c4d4; cursor:not-allowed; }
.fii-menu__item--disabled:hover { background:transparent; color:#b9c4d4; }

.fii-pagination { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:12px; }
.fii-pagination__info { font-size:.72rem; color:#7d8aa0; }
.fii-pagination__pages { display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.fii-page { min-width:32px; height:32px; padding:0 8px; border:1px solid #e3e8f0; border-radius:8px; background:#fff; color:#5b6b86; font-size:.76rem; font-weight:700; cursor:pointer; display:inline-grid; place-items:center; transition:all .12s; }
.fii-page:hover:not(.disabled):not(.active) { background:#f5f7fb; border-color:#c9d4e6; }
.fii-page.active { background:#2d62da; color:#fff; border-color:#2d62da; }
.fii-page.disabled { opacity:.4; cursor:not-allowed; }
.fii-page--prev, .fii-page--next { color:#2d62da; border-color:#e3e8f0; }
.fii-page__ellipsis { padding:0 4px; color:#b0bec5; font-weight:700; }

.fii-donut-wrap { position:relative; display:grid; place-items:center; flex:0 0 46%; }
.fii-donut-center { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; gap:1px; }
.fii-donut-center__label { font-size:.6rem; font-weight:700; color:#8294b0; text-transform:uppercase; letter-spacing:.02em; }
.fii-donut-center__value { font-size:1.3rem; font-weight:800; color:#1d2b45; line-height:1; }
.fii-donut-center__sub { font-size:.6rem; color:#8294b0; }
.fii-dist { display:flex; align-items:center; gap:16px; }
.fii-dist .fii-donut-wrap { aspect-ratio:1/1; max-width:230px; width:100%; }
.fii-legend { list-style:none; margin:0; padding:0 6px 0 0; display:flex; flex-direction:column; gap:8px; flex:1; min-width:0; }
.fii-legend li { display:grid; grid-template-columns:14px 1fr auto; align-items:center; column-gap:8px; row-gap:0; font-size:.74rem; color:#4a5b78; }
.fii-legend__dot { width:12px; height:12px; border-radius:3px; background:var(--fii-color,#2d62da); flex:0 0 auto; }
.fii-legend__name { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fii-legend__num { font-weight:800; color:#1d2b45; white-space:nowrap; text-align:right; }
.fii-legend__num span { font-weight:800; color:#1d2b45; }
@media(max-width:1100px){ .fii-dist .fii-donut-wrap{ max-width:180px } }

.fii-area { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }
.fii-area__row { display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid #eef2f8; border-radius:10px; background:#f4f7fc; }
.fii-area__tag { width:6px; height:100%; min-height:38px; border-radius:999px; flex:0 0 auto; align-self:stretch; }
.fii-area__tag--max { background:#2e9e63; }
.fii-area__tag--min { background:#e11d48; }
.fii-area__info { min-width:0; flex:1; }
.fii-area__label { font-size:.62rem; font-weight:700; color:#8294b0; text-transform:uppercase; letter-spacing:.03em; }
.fii-area__value { font-size:.86rem; font-weight:800; color:#1d2b45; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fii-area__count { margin-left:auto; font-size:.68rem; font-weight:700; color:#40526e; text-align:right; white-space:nowrap; }

.fii-panel__head { margin-bottom:10px; }
.fii-feed { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; max-height:280px; overflow-y:auto; }
.fii-feed__item { display:flex; align-items:flex-start; gap:10px; padding:10px 12px; border-radius:10px; background:#f7f9fd; border:1px solid #eef2f8; transition:background .12s; }
.fii-feed__item:hover { background:#eef4ff; }
.fii-feed__icon { display:grid; place-items:center; width:30px; height:30px; flex:0 0 auto; border-radius:8px; background:color-mix(in srgb, var(--fii-color,#2d62da) 14%, #fff); color:var(--fii-color,#2d62da); font-size:.85rem; }
.fii-feed__item[data-feed-bucket="livres"] { --fii-color:#2e9e63; }
.fii-feed__item[data-feed-bucket="em_operacao"] { --fii-color:#2563eb; }
.fii-feed__item[data-feed-bucket="aguardando"] { --fii-color:#f59e0b; }
.fii-feed__item[data-feed-bucket="em_manutencao"] { --fii-color:#e11d48; }
.fii-feed__body { min-width:0; flex:1; }
.fii-feed__top { display:flex; align-items:center; gap:8px; margin-bottom:4px; flex-wrap:wrap; }
.fii-feed__plate { font-weight:800; color:#2d62da; font-size:.78rem; }
.fii-feed__action { font-size:.78rem; color:#40526e; font-weight:600; }
.fii-feed__meta { display:flex; justify-content:space-between; gap:8px; font-size:.7rem; color:#7d8aa0; }
.fii-feed__empty { text-align:center; color:#b0bec5; padding:18px 0; font-size:.78rem; }
.fii-feed__all { display:block; margin-top:12px; text-align:right; font-size:.74rem; font-weight:700; color:#2d62da; text-decoration:none; }
.fii-feed__all:hover { text-decoration:underline; }

.fii-summary { margin-bottom:16px; }
.fii-summary__grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
.fii-summary__card { display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px 10px; border:1px solid #eef2f8; border-radius:12px; background:#fbfcfe; text-align:center; }
.fii-summary__icon { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:#eaf1ff; color:#2d62da; font-size:1.15rem; }
.fii-summary__value { font-size:1.25rem; font-weight:800; color:#16233d; line-height:1; }
.fii-summary__label { font-size:.7rem; font-weight:600; color:#7d8aa0; min-height:2.4em; }

@media(max-width:1400px){.fii-kpis{grid-template-columns:repeat(3,1fr)}.fii-summary__grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:1100px){.fii-middle{grid-template-columns:1fr}.fii-kpis{grid-template-columns:repeat(2,1fr)}.fii-summary__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.fii-kpis{grid-template-columns:1fr}.fii-summary__grid{grid-template-columns:1fr}.fii-header__right{flex-wrap:wrap}}

/* =========================================================================
   Dashboard Comercial  (dc-*)
   ========================================================================= */
.dc-topbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 10px; flex-wrap:wrap; }
.dc-topbar__left { display:flex; align-items:center; gap:12px; }
.dc-topbar__comp { font-size:1rem; font-weight:800; color:#1d2b45; text-transform:capitalize; }
.dc-topbar__filters { display:inline-flex; align-items:center; gap:6px; padding:6px 14px; border:1px solid #d9e2ee; border-radius:8px; background:#fff; color:#33466a; font-size:.78rem; font-weight:700; cursor:pointer; }
.dc-topbar__filters:hover { background:#f3f7ff; }
.dc-topbar__right { display:flex; align-items:center; gap:10px; font-size:.76rem; color:#546e7a; }
.dc-topbar__refresh { display:grid; place-items:center; width:32px; height:32px; border:1px solid #dde4ee; border-radius:8px; background:#fff; color:#2d62da; cursor:pointer; }
.dc-topbar__refresh:hover { background:#f3f7ff; }
.dc-topbar__datetime { font-weight:700; white-space:nowrap; }
.dc-filters { margin-bottom:10px; }
.dc-filters__form { background:#fff; border:1px solid #eef2f8; border-radius:12px; padding:12px 16px; }
.dc-filters__row { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
.dc-filters__row label { font-size:.72rem; font-weight:700; color:#6b7a90; display:flex; flex-direction:column; gap:4px; }
.dc-filters__row select, .dc-filters__row input { max-width:140px; }

.dc-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:14px; }
.dc-kpi { display:flex; align-items:flex-start; gap:12px; padding:14px; border:1px solid #eef2f7; border-radius:12px; background:#fff; box-shadow:0 1px 3px rgba(20,40,80,.04); }
.dc-kpi__icon { display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:#eaf1ff; color:#2d62da; font-size:1.05rem; flex:0 0 auto; }
.dc-kpi__icon--blue { background:#e7efff; color:#2563eb; }
.dc-kpi__icon--green { background:#e6f6eb; color:#1f9d56; }
.dc-kpi__icon--orange { background:#fff2d9; color:#d97706; }
.dc-kpi--fat .dc-kpi__icon { background:#dcefe0; color:#1f9d56; }
.dc-kpi__data { display:flex; flex-direction:column; gap:4px; min-width:0; }
.dc-kpi__label { font-size:.62rem; font-weight:800; letter-spacing:.04em; color:#6b7a90; text-transform:uppercase; }
.dc-kpi__value { font-size:1.5rem; font-weight:800; color:#16233d; line-height:1.1; }
.dc-kpi__delta { font-size:.72rem; font-weight:700; }
.dc-delta--up { color:#1f9d56; }
.dc-delta--down { color:#e11d48; }

.dc-row2 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:14px; }
.dc-panel { background:#fff; border:1px solid #eef2f7; border-radius:12px; box-shadow:0 1px 3px rgba(20,40,80,.04); padding:14px 16px; }
.dc-panel__title { font-size:.74rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#3c4d6b; margin-bottom:12px; }
.dc-mini-kpis { display:flex; flex-direction:column; gap:10px; }
.dc-mini-kpi { display:flex; align-items:baseline; justify-content:space-between; }
.dc-mini-kpi__label { font-size:.74rem; font-weight:700; color:#7d8aa0; }
.dc-mini-kpi__value { font-size:1.1rem; font-weight:800; color:#16233d; }

.dc-panel--cap { border-top:3px solid var(--dc-sit-color,#2d62da); }
.dc-cap-body { display:flex; flex-direction:column; gap:14px; }
.dc-cap-main { display:flex; flex-direction:column; gap:2px; }
.dc-cap-label { font-size:.7rem; font-weight:700; color:#6b7a90; text-transform:uppercase; }
.dc-cap-value { font-size:1.7rem; font-weight:800; color:var(--dc-sit-color,#16233d); line-height:1; }
.dc-cap-sub { font-size:.74rem; font-weight:700; color:#7d8aa0; }
.dc-cap-numbers { display:flex; gap:12px; border-top:1px solid #f1f4f9; padding-top:10px; }
.dc-cap-num { flex:1; display:flex; flex-direction:column; gap:2px; }
.dc-cap-num__label { font-size:.62rem; font-weight:700; color:#6b7a90; text-transform:uppercase; }
.dc-cap-num__value { font-size:1rem; font-weight:800; color:#16233d; }

.dc-row3 { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.dc-row4 { display:grid; grid-template-columns:1.4fr 1fr; gap:14px; margin-bottom:14px; }
.dc-row5 { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }

.dc-tabs-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; flex-wrap:wrap; gap:8px; }
.dc-tabs { display:flex; gap:6px; }
.dc-tab { padding:6px 12px; border:1px solid #e3e8f0; border-radius:999px; background:#fff; color:#5b6b86; font-size:.68rem; font-weight:800; cursor:pointer; letter-spacing:.03em; }
.dc-tab.active { background:#2d62da; color:#fff; border-color:#2d62da; }
.dc-tab-content { display:flex; flex-direction:column; gap:8px; max-height:340px; overflow-y:auto; }
.dc-meta-row { display:grid; grid-template-columns:110px 1fr 56px 1fr; align-items:center; gap:8px; font-size:.74rem; }
.dc-meta-row__name { font-weight:800; color:#1d3170; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dc-meta-row__bar-wrap { height:8px; background:#eef2f8; border-radius:999px; overflow:hidden; }
.dc-meta-row__bar { height:100%; background:linear-gradient(90deg,#2d62da,#4778d8); border-radius:999px; transition:width .3s; }
.dc-meta-row__pct { font-weight:800; color:#16233d; text-align:right; white-space:nowrap; }
.dc-meta-row__val { font-size:.68rem; color:#7d8aa0; white-space:nowrap; text-align:right; overflow:hidden; text-overflow:ellipsis; }

.dc-emb-list { display:flex; flex-direction:column; gap:8px; max-height:340px; overflow-y:auto; }
.dc-emb-row { display:grid; grid-template-columns:1fr auto 56px; align-items:center; gap:8px; padding:8px 10px; border-radius:8px; background:#fbfcfe; border:1px solid #f1f4f9; font-size:.74rem; }
.dc-emb-row__name { font-weight:700; color:#33466a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dc-emb-row__val { font-weight:800; color:#16233d; }
.dc-emb-row__pct { text-align:right; font-weight:700; color:#2d62da; }

.dc-rank-list, .dc-oc-list { display:flex; flex-direction:column; gap:6px; max-height:280px; overflow-y:auto; }
.dc-rank-row { display:grid; grid-template-columns:24px 90px 60px 1fr; align-items:center; gap:8px; padding:7px 10px; border-radius:8px; background:#fbfcfe; border:1px solid #f1f4f9; font-size:.74rem; }
.dc-rank-row__pos { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#eaf1ff; color:#2d62da; font-weight:800; font-size:.68rem; }
.dc-rank-row__name { font-weight:800; color:#1d3170; }
.dc-rank-row__pct { font-weight:800; color:#1f9d56; text-align:right; }
.dc-rank-row__meta { font-size:.66rem; color:#7d8aa0; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.dc-oc-row { display:grid; grid-template-columns:90px 70px 1fr auto; align-items:center; gap:8px; padding:7px 10px; border-radius:8px; background:#fbfcfe; border-left:3px solid var(--sit-color,#9aa7bd); font-size:.72rem; }
.dc-oc-row__id { font-weight:800; color:#1d3170; }
.dc-oc-row__placa { font-weight:700; color:#2d62da; }
.dc-oc-row__data { color:#7d8aa0; }
.dc-oc-row__uti { font-weight:700; color:#33466a; white-space:nowrap; }

.dc-bottom { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:12px; }
.dc-let { display:flex; flex-direction:column; align-items:center; gap:8px; padding:14px 10px; border:1px solid #eef2f7; border-radius:12px; background:#fff; box-shadow:0 1px 3px rgba(20,40,80,.04); text-align:center; }
.dc-let__icon { display:grid; place-items:center; width:38px; height:38px; border-radius:10px; background:#eaf1ff; color:#2d62da; font-size:1rem; }
.dc-let__label { font-size:.62rem; font-weight:800; letter-spacing:.04em; color:#6b7a90; text-transform:uppercase; }
.dc-let__value { font-size:1.05rem; font-weight:800; color:#16233d; }

.dc-receita { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.dc-let--alt { flex-direction:row; align-items:center; justify-content:space-between; gap:12px; text-align:left; padding:12px 16px; background:linear-gradient(90deg,#f4f8ff,#fbfdff); }
.dc-let--alt .dc-let__value { font-size:1.2rem; color:#2d62da; }

.dc-empty { text-align:center; color:#b0bec5; font-size:.78rem; padding:18px 0; margin:0; }

@media(max-width:1400px){ .dc-kpis{grid-template-columns:repeat(2,1fr)} .dc-row2{grid-template-columns:1fr} .dc-bottom{grid-template-columns:repeat(3,1fr)} }
@media(max-width:1100px){ .dc-row3,.dc-row4,.dc-row5{grid-template-columns:1fr} .dc-bottom{grid-template-columns:repeat(2,1fr)} .dc-receita{grid-template-columns:1fr} }
@media(max-width:680px){ .dc-kpis{grid-template-columns:1fr} .dc-bottom{grid-template-columns:1fr} }