:root {
  --bg: #f4f6f8;
  --surface: #ffffff;
  --surface-2: #eef2f5;
  --text: #17202a;
  --muted: #637083;
  --line: #d9e0e7;
  --nav: #16212c;
  --nav-text: #edf3f8;
  --blue: #2563eb;
  --green: #1f8a5b;
  --amber: #b7791f;
  --red: #c24135;
  --teal: #0f766e;
  --shadow: 0 10px 28px rgba(20, 32, 44, 0.08);
}

#receivedMacroHistoryView thead th,
#unlinkedTravelTable thead th { position:sticky !important; top:0; z-index:9; background:var(--surface-2); }

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
}

button,
input,
select {
  font: inherit;
}

textarea {
  font: inherit;
}

input,
select,
textarea {
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--blue) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

button {
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
}

button:hover {
  transform: translateY(-1px);
}

button:disabled {
  cursor: not-allowed;
  opacity: .6;
  transform: none;
}

/* ---------- Login overlay ---------- */

.login-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  inset: 0;
  background: linear-gradient(135deg, #101d2b 0%, #1e3355 100%);
  z-index: 9999;
}

.login-card {
  background: var(--surface);
  border-radius: 12px;
  box-shadow: 0 32px 80px rgba(10, 20, 35, 0.45);
  padding: 36px 40px;
  width: min(400px, calc(100vw - 32px));
}

.login-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
}

.login-brand .brand-mark {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: #f2b84b;
  color: #1f2933;
  font-weight: 800;
  font-size: 18px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.brand-logo-img {
  height: 48px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
  flex-shrink: 0;
}

.sidebar-logo {
  height: 38px;
  max-width: 130px;
}

.login-brand strong {
  display: block;
  font-size: 18px;
}

.login-brand span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-top: 2px;
}

.login-version {
  display: block;
  margin-top: 8px;
  color: #7b8aa0;
  font-size: 12px;
  font-weight: 700;
}

.login-field {
  display: grid;
  gap: 6px;
  margin-bottom: 16px;
}

.login-field label {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
}

.login-field input {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--surface);
  color: var(--text);
  font-size: 15px;
  transition: border-color 0.15s;
}

.login-field input:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.login-error {
  background: #fde0dd;
  color: var(--red);
  border: 1px solid #f5c6c3;
  border-radius: 7px;
  padding: 9px 13px;
  font-size: 13px;
  margin-bottom: 14px;
}

.recaptcha-box {
  min-height: 82px;
  margin: 2px 0 14px;
}

.login-hint {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.login-submit {
  width: 100%;
  min-height: 44px;
  font-size: 15px;
  font-weight: 700;
  border-radius: 8px;
  margin-top: 4px;
}

.login-submit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.back-to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 900;
  min-height: 38px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: var(--blue, #2563eb);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 12px 30px rgba(37, 99, 235, 0.25);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
}

.back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* ---------- Sidebar footer ---------- */

.sidebar-footer {
  margin-top: auto;
  padding-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.user-badge {
  font-size: 12px;
  color: #aebbc8;
  overflow-wrap: anywhere;
  word-break: break-all;
}

.logout-button {
  min-height: 36px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 7px;
  background: transparent;
  color: var(--nav-text);
  cursor: pointer;
  padding: 0 12px;
  font-size: 13px;
  text-align: left;
}

.logout-button:hover {
  background: #263545;
}

/* ---------- App shell ---------- */

.app-shell {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  background: var(--nav);
  color: var(--nav-text);
  padding: 18px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 26px;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: #f2b84b;
  color: #1f2933;
  font-weight: 800;
}

.brand strong,
.brand span {
  display: block;
}

.brand span {
  color: #aebbc8;
  font-size: 13px;
  margin-top: 2px;
}

.nav-tabs {
  display: grid;
  gap: 6px;
}

.nav-group-menu {
  display: contents;
}

.nav-tab {
  min-height: 42px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--nav-text);
  cursor: pointer;
  text-align: left;
  padding: 0 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.nav-open-tab {
  border: 0;
  background: rgba(255,255,255,0.08);
  color: inherit;
  border-radius: 5px;
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0;
}

.nav-tab:hover .nav-open-tab,
.nav-tab:focus-within .nav-open-tab {
  opacity: 1;
}

.app-shell.menu-top {
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
}

.app-shell.menu-top .sidebar {
  min-height: auto;
  flex-direction: row;
  align-items: center;
  gap: 18px;
  padding: 10px 18px;
  position: sticky;
  top: 0;
  z-index: 100;
}

.app-shell.menu-top .brand {
  margin-bottom: 0;
  min-width: 220px;
}

.app-shell.menu-top .nav-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  overflow: visible;
}

.app-shell.menu-top .nav-group {
  position: relative;
  flex: 0 0 auto;
}

.app-shell.menu-top .nav-group-header {
  padding: 0 10px;
  min-height: 34px;
  display: flex;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #d8e6ee;
  cursor: pointer;
  white-space: nowrap;
}

.app-shell.menu-top .nav-group-header::after {
  content: '\25BE';
  margin-left: 7px;
  font-size: 9px;
}

.app-shell.menu-top .nav-group:hover > .nav-group-header,
.app-shell.menu-top .nav-group:focus-within > .nav-group-header {
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
}

.app-shell.menu-top .nav-group-menu,
.app-shell.menu-top .nav-group:not(.is-open) > .nav-group-menu {
  display: none;
  position: absolute;
  left: 0;
  top: calc(100% + 4px);
  z-index: 125;
  min-width: 255px;
  max-width: 330px;
  max-height: min(72vh, 680px);
  overflow-y: auto;
  padding: 8px;
  border: 1px solid rgba(174,187,200,.2);
  border-radius: 8px;
  background: #0b2432;
  box-shadow: 0 18px 40px rgba(2,12,20,.34);
}

.app-shell.menu-top .nav-group:hover > .nav-group-menu,
.app-shell.menu-top .nav-group:focus-within > .nav-group-menu,
.app-shell.menu-top .nav-group.is-open > .nav-group-menu {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.app-shell.menu-top .nav-group-menu > .nav-tab,
.app-shell.menu-top .nav-group-menu > .nav-submenu {
  width: 100%;
  flex: 0 0 auto;
}

.app-shell.menu-top .nav-submenu {
  position: relative;
}

.app-shell.menu-top .nav-submenu-items {
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 220px;
  background: var(--nav);
  padding: 8px;
  border: 1px solid rgba(174, 187, 200, 0.18);
  border-radius: 8px;
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.28);
  z-index: 120;
}

.app-shell.menu-top .nav-submenu:hover .nav-submenu-items,
.app-shell.menu-top .nav-submenu:focus-within .nav-submenu-items {
  display: flex;
}

.app-shell.menu-top .sidebar-footer {
  margin-top: 0;
  flex-direction: row;
  align-items: center;
}

.app-shell.menu-top .nav-submenu .nav-submenu-items,
.app-shell.menu-top .nav-submenu.is-open .nav-submenu-items,
.app-shell.menu-top .nav-submenu-items.open {
  display: none !important;
}

.app-shell.menu-top .nav-submenu:hover .nav-submenu-items,
.app-shell.menu-top .nav-submenu:focus-within .nav-submenu-items {
  display: flex !important;
}

.nav-tab:hover,
.nav-tab.is-active {
  background: #263545;
}

.main {
  min-width: 0;
  min-height: 100vh;
  padding: 24px;
  display: flex;
  flex-direction: column;
}

.app-footer {
  min-height: 30px;
  margin: auto -24px -24px;
  padding: 5px 24px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  background: #070c16;
  color: #8795ad;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 11px;
  line-height: 1;
}

.app-footer-contact {
  color: #b7c3d7;
  font-size: 13px;
}

.app-footer-version {
  color: #6f7f99;
  font-size: 11px;
  font-weight: 700;
}

.fleet-top-controls {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.tower-top-controls {
  max-width: 470px;
}

.fleet-top-controls input,
.fleet-top-controls select {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  font-size: 12px;
  background: #fff;
}

.fleet-top-controls input {
  width: min(190px, 18vw);
}

.tower-top-controls input {
  width: 230px;
}

.tower-top-controls select {
  width: 86px;
}

.fleet-top-controls .secondary-button {
  min-height: 34px;
  padding: 0 12px;
  font-size: 12px;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.top-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  position: relative;
}

.server-state {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  background: #edf2f7;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  padding: 0 10px;
}

.server-state.online {
  background: #dff3e8;
  color: var(--green);
}

h1,
h2,
p {
  margin: 0;
}

h1 {
  font-size: 24px;
  line-height: 1.2;
}

h2 {
  font-size: 16px;
}

.topbar p {
  color: var(--muted);
  margin-top: 5px;
}

.export-button,
.secondary-button,
.clear-button,
.pagination button {
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  padding: 0 10px;
  font-size: 12px;
}

.export-button {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
  font-weight: 700;
}

.secondary-button {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
  font-weight: 700;
}

.secondary-button.is-hidden,
.is-hidden {
  display: none !important;
}

.filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) repeat(4, minmax(132px, 1fr)) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 18px;
}

.filters label {
  display: grid;
  gap: 5px;
}

.filters span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.filters input,
.filters select {
  min-height: 38px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text);
  padding: 0 10px;
}

.view {
  display: none;
}

.view.is-active {
  display: block;
}

.global-locator {
  position: relative;
  min-width: min(420px, 42vw);
}

.global-locator input {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0 12px;
  box-shadow: 0 10px 24px rgba(15, 27, 41, .06);
}

.global-locator-results {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 340px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 18px 44px rgba(15, 27, 41, .18);
  padding: 6px;
}

.global-locator-item {
  width: 100%;
  display: grid;
  gap: 2px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text);
  padding: 10px;
  text-align: left;
  cursor: pointer;
}

.global-locator-item:hover,
.global-locator-item:focus-visible {
  background: var(--surface-2);
  outline: none;
}

.global-locator-item span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.control-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 18px;
  border: 1px solid rgba(13, 148, 136, .18);
  border-radius: 8px;
  background: linear-gradient(135deg, #f8fafc 0%, #ecfeff 100%);
  box-shadow: var(--shadow);
}

.control-hero span {
  display: block;
  color: #0f766e;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.control-hero h2 {
  margin: 6px 0;
  font-size: 26px;
  line-height: 1.18;
}

.control-hero p {
  max-width: 780px;
  color: var(--muted);
}

.control-hero-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.control-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(100px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.metric-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
  padding: 7px 10px;
  min-height: 58px;
}

.metric-card span {
  color: var(--muted);
  display: block;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.metric-card strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
}

.metric-card small {
  color: var(--muted);
}

.metric-card.warning {
  border-color: rgba(217, 119, 6, .28);
  background: #fffaf0;
}

.metric-card.critical {
  border-color: rgba(220, 38, 38, .28);
  background: #fff5f5;
}

.workflow-panel {
  margin-bottom: 16px;
}

.workflow-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(110px, 1fr));
  gap: 7px;
  margin-bottom: 8px;
}

.workflow-mini-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 7px 9px;
  min-height: 48px;
}

.workflow-mini-card span {
  color: var(--muted);
  display: block;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.workflow-mini-card strong {
  display: block;
  margin-top: 5px;
  font-size: 18px;
}

.workflow-mini-card.warning {
  border-color: rgba(217, 119, 6, .3);
  background: #fffaf0;
}

.workflow-mini-card.critical {
  border-color: rgba(220, 38, 38, .3);
  background: #fff5f5;
}

.workflow-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 260px;
}

.workflow-step {
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #475569;
  background: #f8fafc;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  padding: 5px 7px;
}

.workflow-step.ok {
  border-color: rgba(13, 148, 136, .25);
  color: #0f766e;
  background: #ecfdf5;
}

.workflow-step.warn {
  border-color: rgba(217, 119, 6, .25);
  color: #92400e;
  background: #fffbeb;
}

.workflow-step.blocked {
  border-color: rgba(220, 38, 38, .25);
  color: #991b1b;
  background: #fef2f2;
}

.control-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  gap: 16px;
  margin-bottom: 16px;
}

.control-map-shell {
  min-height: 330px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(15, 118, 110, .08) 1px, transparent 1px),
    linear-gradient(180deg, rgba(15, 118, 110, .08) 1px, transparent 1px),
    radial-gradient(circle at 72% 28%, rgba(14, 165, 233, .18), transparent 28%),
    linear-gradient(135deg, #f8fafc, #eef7f7);
  background-size: 34px 34px, 34px 34px, auto, auto;
  position: relative;
}

.control-map-grid {
  position: absolute;
  inset: 0;
}

.control-map-pin {
  position: absolute;
  min-width: 56px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background: #0f1b29;
  color: white;
  padding: 4px 7px;
  box-shadow: 0 8px 18px rgba(15, 27, 41, .18);
  font-size: 10px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid rgba(255, 255, 255, .65);
}

.control-map-pin::before {
  content: none;
}

.control-map-pin::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -5px;
  width: 8px;
  height: 8px;
  background: inherit;
  transform: translateX(-50%) rotate(45deg);
}

.control-map-pin span {
  font-size: 12px;
  line-height: 1;
}

.control-map-pin strong {
  font-size: 10px;
  line-height: 1;
}

.control-map-pin .fleet-truck-pin {
  flex-direction: row;
  gap: 3px;
}

.control-map-pin .fleet-truck-pin svg {
  width: 15px;
  height: 15px;
}

.control-map-pin .fleet-truck-pin strong {
  max-width: 58px;
  padding: 0;
  background: transparent;
  font-size: 9px;
}

.control-map-pin.is-late {
  background: #dc2626;
}

.control-map-pin.is-stop {
  background: #d97706;
}

.control-map-pin.is-trip {
  background: #0f8f7e;
}

.compact-table table {
  min-width: 640px;
}

.metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(128px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.metric {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 14px;
  min-height: 86px;
}

.metric span {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.metric strong {
  display: block;
  font-size: 26px;
  margin-top: 8px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.8fr);
  gap: 14px;
}

.dashboard-insights {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  margin-top: 16px;
}

.dashboard-chart {
  height: 220px;
  position: relative;
}

.dashboard-module-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-module-card,
.dashboard-list-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  padding: 12px;
}

.dashboard-module-card {
  display: grid;
  gap: 6px;
}

.dashboard-module-card span,
.dashboard-list-row span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dashboard-module-card strong {
  font-size: 22px;
}

.dashboard-list {
  display: grid;
  gap: 10px;
}

.dashboard-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.dashboard-list-row strong {
  font-size: 16px;
}

.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 16px;
}

.panel-head {
  margin-bottom: 14px;
}

.status-bars {
  display: grid;
  gap: 12px;
}

.bar-row {
  display: grid;
  gap: 6px;
}

.bar-label {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
}

.bar-track {
  height: 12px;
  background: var(--surface-2);
  border-radius: 999px;
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  min-width: 3px;
}

.carrier-list,
.carrier-cards {
  display: grid;
  gap: 10px;
}

.carrier-row,
.carrier-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}

.carrier-card {
  grid-template-columns: minmax(0, 1fr) repeat(4, auto);
  background: var(--surface);
}

.carrier-name {
  font-weight: 700;
  overflow-wrap: anywhere;
}

.pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  min-width: 74px;
  border-radius: 999px;
  padding: 0 9px;
  font-size: 12px;
  font-weight: 800;
}

.pill.ok {
  background: #dff3e8;
  color: var(--green);
}

.pill.alerta {
  background: #fff0c2;
  color: var(--amber);
}

.pill.pendente {
  background: #ffe3bd;
  color: #9a5b13;
}

.pill.reprovado {
  background: #fde0dd;
  color: var(--red);
}

.pill.valido {
  background: #dff3e8;
  color: var(--green);
}

.pill.vencido {
  background: #fde0dd;
  color: var(--red);
}

.pill.cancelado {
  background: #eef2f5;
  color: var(--muted);
}

/* ---------- Checklist filters ---------- */

.checklist-filters {
  display: grid;
  grid-template-columns: minmax(260px, 1.4fr) minmax(160px, auto);
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
}

.checklist-filters label {
  display: grid;
  gap: 5px;
}

.checklist-filters span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.checklist-filters input,
.checklist-filters select {
  min-height: 38px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text);
  padding: 0 10px;
}

/* ---------- Checklist tecnologia field ---------- */

.checklist-tec-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.checklist-tec-row select {
  min-width: 200px;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  background: var(--surface);
  color: var(--text);
}

.checklist-outro-inline {
  display: flex;
  gap: 8px;
  align-items: center;
  flex: 1;
}

.checklist-outro-inline input {
  flex: 1;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  color: var(--text);
}

.table-toolbar,
.pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.table-toolbar span {
  color: var(--muted);
}

.header-search {
  min-height: 34px;
  width: min(320px, 28vw);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  padding: 0 11px;
  font-size: 13px;
}

.header-search:focus {
  outline: 2px solid rgba(37, 99, 235, .18);
  border-color: #93c5fd;
}

.table-wrap {
  overflow: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  max-height: min(72vh, 720px);
}

table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
}

.row-actions {
  display: inline-flex;
  gap: 6px;
}

.row-actions button,
.icon-button {
  min-width: 34px;
  min-height: 28px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  padding: 3px 8px;
  font-size: 11px;
}

.row-actions button:hover,
.icon-button:hover {
  background: var(--surface-2);
}

.sortable-th {
  cursor: pointer;
  user-select: none;
}

.sortable-th.sort-asc::after {
  content: " ▲";
  font-size: 9px;
  color: var(--muted);
}

.sortable-th.sort-desc::after {
  content: " ▼";
  font-size: 9px;
  color: var(--muted);
}

.is-hidden-col {
  display: none !important;
}

.is-hidden-row {
  display: none !important;
}

.grid-page-control {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.grid-page-gap {
  color: var(--muted);
  padding: 0 2px;
}
.paginated-grid { display:flex; flex-direction:column; gap:0 !important; min-width:0; min-height:0; align-self:start; width:100%; isolation:isolate; }
.paginated-grid > .table-wrap { margin-bottom:0 !important; flex:0 1 auto; position:relative; z-index:0; overflow:auto !important; }
.paginated-grid > .grid-page-control { margin:0 !important; position:relative !important; z-index:20; flex:0 0 auto; width:100%; background:var(--surface); }
body.grid-pagination-in-view #backToTopBtn { display:none !important; }
.tower2-table-panel > .paginated-grid { align-self:stretch; overflow:hidden; }
.tower2-table-panel > .paginated-grid > .table-wrap { min-height:200px; flex:1 1 auto; }
.tower2-table-panel:has(> .paginated-grid) { grid-template-rows:auto minmax(0,1fr); min-height:420px; max-height:none; height:640px; gap:0; }
.trip-timing-summary { display:flex; flex-wrap:wrap; gap:6px 16px; padding:10px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.trip-timing-summary strong,.trip-timing-summary small { flex-basis:100%; }
.trip-timing-summary small { color:var(--muted); font-size:10px; }
.trip-arrival-list div { padding:7px 0; border-bottom:1px solid var(--line); }
.trip-arrival-list span,.trip-arrival-list small { display:block; font-size:11px; color:var(--muted); }
.departure-panel { min-width:0; padding:0; margin-bottom:14px; }
.departure-panel h2 { font-size:14px; margin:0; }
.departure-panel .control-metrics { padding:10px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.departure-grid { max-height:580px; min-height:120px; overflow:auto; }
.departure-grid table { min-width:1250px; }
.departure-grid td small { display:block; }
@media(max-width:900px) { .departure-panel .control-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:759px) { #backToTopBtn { bottom:90px !important; } }

.grid-page-control button {
  min-height: 26px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  padding: 0 8px;
  font-size: 11px;
}

.grid-page-control button.is-active {
  background: var(--blue);
  border-color: var(--blue);
  color: #fff;
}

.icon-eye-btn {
  min-width: 26px;
  min-height: 24px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  font-size: 12px;
}

.doc-hidden {
  display: inline-block;
  margin-left: 6px;
  max-width: 360px;
  color: var(--muted);
  font-size: 11px;
  vertical-align: middle;
}

.trip-dialog {
  width: min(920px, calc(100vw - 28px));
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 24px 80px rgba(20, 32, 44, 0.24);
  padding: 0;
}

.trip-dialog::backdrop {
  background: rgba(12, 20, 28, 0.42);
}

.trip-dialog form {
  padding: 18px;
}

.trip-dialog label,
.dialog-form label,
.form-grid label,
.tform-field,
.login-field,
.locais-form-fields label,
.routes-form-fields label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.trip-dialog input,
.trip-dialog select,
.trip-dialog textarea,
.dialog-form input,
.dialog-form select,
.dialog-form textarea,
.locais-form-fields input,
.locais-form-fields select,
.routes-form-fields input,
.routes-form-fields select,
.routes-form-fields textarea {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
}

.trip-dialog fieldset {
  border-color: var(--line);
}

.dialog-head,
.dialog-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dialog-head {
  margin-bottom: 16px;
}

.dialog-actions {
  justify-content: flex-end;
  margin-top: 16px;
}

.quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

/* ---- Trip form layout ---- */
.tform { display: flex; flex-direction: column; gap: 0; }
.tform-group {
  padding: 8px 0 10px;
  border-bottom: 1px solid var(--line, #e5e7eb);
}
.tform-group:last-child { border-bottom: none; }
.tform-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted, #6b7280);
  margin-bottom: 6px;
}
.tform-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: flex-end;
}
.tform-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 12px;
  min-width: 120px;
}
.tform-field span {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted, #6b7280);
  white-space: nowrap;
}
.tform-field input,
.tform-field select {
  height: 34px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 6px;
  padding: 0 8px;
  font-size: 13px;
  background: #fff;
  box-sizing: border-box;
  width: 100%;
}
.tform-field input:focus,
.tform-field select:focus { outline: none; border-color: var(--primary, #2563eb); box-shadow: 0 0 0 2px rgba(37,99,235,.12); }
.tform-grow { flex: 1 1 160px; }

.map-toolbar {
  display: flex;
  align-items: end;
  gap: 10px;
  margin-bottom: 12px;
}

.map-toolbar label {
  display: grid;
  gap: 5px;
  min-width: min(420px, 100%);
}

.map-toolbar span,
.map-toolbar label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.map-toolbar select {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
}

#map {
  width: 100%;
  height: min(680px, calc(100vh - 245px));
  min-height: 420px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
  box-shadow: var(--shadow);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.form-grid label {
  display: grid;
  gap: 5px;
}

.form-grid span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--text);
  padding: 8px 10px;
}

.form-grid textarea {
  resize: vertical;
}

.wide {
  grid-column: 1 / -1;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 10px;
  text-align: left;
  vertical-align: top;
  font-size: 13px;
}

th {
  background: #edf2f7;
  color: #354254;
  position: sticky;
  top: 0;
  z-index: 1;
}

td {
  max-width: 270px;
  overflow-wrap: anywhere;
}

tr:last-child td {
  border-bottom: 0;
}

.pagination {
  justify-content: flex-end;
  margin-top: 12px;
}

.pagination button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

@media (max-width: 1080px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    min-height: auto;
  }

  .nav-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .filters,
  .metrics,
  .dashboard-grid,
  .dashboard-insights {
    grid-template-columns: 1fr 1fr;
  }

  .app-footer {
    margin: auto -24px -24px;
    min-height: 30px;
    padding: 5px 24px;
    flex-direction: row;
    align-items: center;
  }

  .app-footer > div:last-child {
    text-align: left;
  }
}

/* =============================================
   Routes view – interactive map with routing
   ============================================= */

.routes-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 16px;
  height: calc(100vh - 220px);
  min-height: 540px;
}

.routes-left-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.routes-right-panel {
  position: relative;
  min-height: 420px;
}

#routesMap {
  width: 100%;
  height: 100%;
  min-height: 420px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
  box-shadow: var(--shadow);
}

/* Route form panel */
.routes-form-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  overflow-y: auto;
  flex-shrink: 0;
}

.routes-form-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.routes-form-header h3 {
  margin: 0;
  font-size: 15px;
}

.routes-form-fields {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 10px;
}

.routes-form-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.routes-form-fields label span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.routes-form-fields input {
  width: 100%;
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  font-size: 13px;
  color: var(--text);
  background: var(--surface);
  outline: none;
  transition: border-color 0.15s;
}

.routes-form-fields input:focus {
  border-color: var(--blue);
}

.routes-point-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
  align-items: end;
}

.map-pick-btn {
  min-height: 36px;
  min-width: 56px;
  border: 1.5px solid var(--blue);
  border-radius: 7px;
  background: var(--surface);
  color: var(--blue);
  font-weight: 700;
  font-size: 11px;
  cursor: pointer;
  padding: 0 10px;
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}

.map-pick-btn.is-active,
.map-pick-btn:hover {
  background: var(--blue);
  color: #fff;
}

.routes-hint {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  margin: 4px 0 0;
}

/* Routes list panel */
#routesListPanel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: auto;
  height: 100%;
}

.routes-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
}

.route-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  box-shadow: 0 2px 6px rgba(20, 32, 44, 0.04);
  transition: border-color 0.15s;
  cursor: pointer;
}

.route-card:hover {
  border-color: var(--blue);
}

.route-card-info {
  margin-bottom: 8px;
}

.route-card-info strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
}

.route-card-info span {
  display: block;
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

.route-wp-badge {
  display: inline-block;
  background: #dff3e8;
  color: var(--green);
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  margin-top: 4px;
}

.routes-empty {
  color: var(--muted);
  font-size: 13px;
  text-align: center;
  padding: 32px 12px;
}

/* Hide LRM directions panel – keep only the map route line */
.leaflet-routing-container {
  display: none !important;
}

/* Crosshair cursor while picking a map point */
.leaflet-container.route-pick-mode,
.leaflet-container.route-pick-mode .leaflet-interactive {
  cursor: crosshair !important;
}

.fleet-map-layout {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: calc(100vh - 170px);
}

#fleetMap {
  min-height: calc(100vh - 330px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
  box-shadow: var(--shadow);
}

.fleet-map-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  padding: 7px;
  overflow: hidden;
  max-height: none;
}

.fleet-map-layout.is-side-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);
  grid-template-areas: "fleet-map fleet-panel";
  align-items: stretch;
}

.fleet-map-layout.is-side-panel #fleetMap {
  grid-area: fleet-map;
  min-height: calc(100vh - 230px);
}

.fleet-map-layout.is-side-panel .fleet-map-panel {
  grid-area: fleet-panel;
  max-height: calc(100vh - 230px);
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 8px;
}

.fleet-map-layout.is-side-panel .fleet-map-resize {
  display: none;
}

.fleet-map-panel strong,
.fleet-map-panel small {
  display: block;
}

.fleet-map-panel small {
  color: var(--muted);
  margin-top: 3px;
}

.fleet-map-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 5px;
}

.fleet-map-summary article {
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 4px 7px;
  background: var(--surface-2);
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
}

.fleet-map-summary span {
  display: inline;
  font-size: 10px;
  color: var(--muted);
  font-weight: 800;
  text-transform: uppercase;
}

.fleet-map-summary strong {
  display: inline;
  font-size: 14px;
  margin-top: 0;
}

.inline-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.inline-actions input,
.inline-actions select {
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  background: var(--surface);
  color: var(--text);
  font-size: 13px;
}

.control-history-panel {
  margin-top: 14px;
}

.control-history-panel .table-toolbar {
  align-items: center;
  gap: 10px;
}

.control-history-panel .inline-actions input {
  min-width: 260px;
}

.compact-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 8px;
  margin: 8px 0 10px;
}

.compact-metrics article {
  min-height: 42px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.compact-metrics span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.compact-metrics strong {
  display: block;
  margin-top: 1px;
  color: var(--text);
  font-size: 16px;
}

.patio-metrics {
  margin-bottom: 12px;
}

.patio-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.patio-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  min-height: 104px;
  box-shadow: var(--soft-shadow);
}

.patio-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.patio-card-head strong {
  display: block;
  font-size: 13px;
  line-height: 1.2;
}

.patio-card-head span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.patio-card-head .secondary-button {
  min-height: 28px;
  padding: 0 9px;
  font-size: 11px;
  white-space: nowrap;
}

.patio-card-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-top: 10px;
}

.patio-card-stats span {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 5px;
  color: var(--muted);
  font-size: 10px;
}

.patio-card-stats b {
  display: block;
  color: var(--text);
  font-size: 14px;
}

.patio-occupancy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
}

.patio-occupancy div {
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: #e5e7eb;
}

.patio-occupancy span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #0f8f7e;
}

.patio-card.is-warning .patio-occupancy span {
  background: #d97706;
}

.patio-card.is-full .patio-occupancy span {
  background: #dc2626;
}

.patio-occupancy strong {
  font-size: 12px;
}

.patio-map-dialog {
  width: min(1120px, calc(100vw - 42px));
  height: min(760px, calc(100vh - 42px));
  padding: 0;
  overflow: hidden;
}

.patio-map-dialog.is-expanded {
  width: calc(100vw - 16px);
  height: calc(100vh - 16px);
  max-width: none;
  max-height: none;
}

.patio-map-dialog .modal-header {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  height: 34px;
  min-height: 34px;
  padding: 0 8px 0 10px;
  border-bottom: 1px solid var(--line);
  background: #fff;
  box-sizing: border-box;
}

.patio-map-dialog .modal-header strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  line-height: 1;
}

.patio-map-dialog .compact-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  min-width: 0;
  margin: 0;
}

.patio-map-dialog .compact-actions .secondary-button,
.patio-map-dialog .compact-actions .icon-button {
  min-height: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 6px;
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
}

.patio-map-dialog .compact-actions .icon-button {
  width: 24px;
  padding: 0;
}

.patio-map-dialog iframe {
  display: block;
  width: 100%;
  height: calc(100% - 34px);
  border: 0;
}

.transit-chart-grid {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(260px, 1.2fr) minmax(260px, 1.2fr);
  gap: 12px;
  margin-bottom: 12px;
}

.transit-kpi-grid {
  grid-template-columns: repeat(6, minmax(110px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.transit-kpi-grid .metric-card {
  min-height: 58px;
  padding: 7px 10px;
  gap: 2px;
}

.transit-kpi-grid .metric-card strong {
  margin-top: 2px;
  font-size: 18px;
  line-height: 1.1;
}

.transit-kpi-grid .metric-card small {
  display: block;
  margin-top: 1px;
  font-size: 9px;
}

#transitTimeView .table-wrap table {
  font-size: 12px;
}

#transitTimeView .table-wrap th,
#transitTimeView .table-wrap td {
  padding: 7px 8px;
}

.transit-chart-card {
  min-height: 210px;
}

.transit-chart-card h2 {
  font-size: 13px;
  margin: 0 0 8px;
}

.transit-chart {
  position: relative;
  width: 100%;
  height: 155px;
}

.transit-chart-card:first-child .transit-chart {
  height: 118px;
}

.transit-status-legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 8px;
  margin-top: 4px;
  color: var(--muted);
  font-size: 10px;
}

.transit-status-legend span {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  white-space: nowrap;
}

.transit-status-legend i {
  width: 18px;
  height: 7px;
  border-radius: 2px;
  flex: 0 0 auto;
}

.transit-status-legend strong {
  color: var(--text);
  font-size: 10px;
}

.transit-form-panel {
  margin-bottom: 12px;
}

.transit-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
}

.transit-form label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.transit-form label span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.transit-form input,
.transit-form select {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  background: var(--surface);
  color: var(--text);
}

.transit-form button {
  align-self: end;
  min-height: 34px;
}

.transit-tracking-toolbar {
  margin-top: 12px;
}

.transit-tracking-toolbar input,
.transit-tracking-toolbar select {
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  background: var(--surface);
  color: var(--text);
}

.transit-progress-cell {
  min-width: 175px;
}

.transit-progress-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--text);
  font-size: 11px;
  margin-bottom: 4px;
}

.transit-progress-meta span,
.transit-progress-cell small {
  color: var(--muted);
  font-size: 10px;
}

.transit-progress-bar {
  height: 8px;
  width: 100%;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
}

.transit-progress-bar span {
  display: block;
  height: 100%;
  min-width: 3px;
  border-radius: inherit;
}

.transit-progress-bar .is-ok {
  background: #0f8f7e;
}

.transit-progress-bar .is-risk {
  background: #f59e0b;
}

.transit-progress-bar .is-late {
  background: #dc2626;
}

.tag-operacao {
  display: inline-flex;
  align-items: center;
  border-radius: 6px;
  background: #eef5ff;
  color: #1d4ed8;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: 3px 7px;
}

#macroMappingView .dashboard-insights {
  gap: 10px;
}

#macroMappingView .panel {
  padding: 10px;
}

#macroMappingView .panel-head h2 {
  font-size: 15px;
}

#macroMappingView .panel-head small,
#macroMappingView .dashboard-row,
#macroMappingView .table-wrap table {
  font-size: 12px;
}

#macroMappingView .finance-metrics {
  grid-template-columns: repeat(3, minmax(100px, 1fr));
  gap: 7px;
}

#macroMappingView .metric-card,
#macroMappingView .finance-card {
  min-height: 54px;
  padding: 7px 9px;
}

#macroMappingView .metric-card span,
#macroMappingView .finance-card span {
  font-size: 9px;
}

#macroMappingView .metric-card strong,
#macroMappingView .finance-card strong {
  font-size: 17px;
}

#macroMappingView .dashboard-list {
  gap: 6px;
}

#macroMappingView .dashboard-row {
  padding: 7px 8px;
}

#macroMappingView .table-wrap th,
#macroMappingView .table-wrap td {
  padding: 7px 8px;
}

#relatoriosView .table-wrap table {
  font-size: 12px;
}

#relatoriosView .table-wrap th,
#relatoriosView .table-wrap td {
  padding: 7px 8px;
}

#relatoriosView .finance-metrics .metric-card,
#relatoriosView .finance-metrics .finance-card {
  min-height: 58px;
  padding: 8px 10px;
}

.fleet-map-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.fleet-panel-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.fleet-tabs {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}

.fleet-tab {
  min-height: 24px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  padding: 0 8px;
  cursor: pointer;
  white-space: nowrap;
}

.fleet-tab.is-active {
  background: var(--blue);
  color: #fff;
}

.fleet-panel-actions input {
  min-height: 30px;
  width: 170px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  font-size: 11px;
}

.fleet-panel-actions .clear-button {
  min-height: 30px;
  padding: 0 9px;
  font-size: 11px;
}

.fleet-position-list {
  max-height: calc(100vh - 440px);
  min-height: 320px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.fleet-position-card {
  width: 100%;
  display: grid;
  grid-template-columns: 76px 64px minmax(170px, 1fr) 126px 112px 112px 104px 96px 94px 66px 96px;
  gap: 5px;
  align-items: center;
  border: 0;
  border-bottom: 1px solid var(--line);
  padding: 4px 8px;
  background: var(--surface);
  text-align: left;
  cursor: pointer;
}

.fleet-position-head {
  position: sticky;
  top: 0;
  z-index: 2;
  cursor: default;
  background: #eef4f9;
}

.fleet-position-head span {
  font-weight: 900;
  color: #314158;
  text-transform: uppercase;
  letter-spacing: 0;
}

.fleet-position-card > * {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fleet-position-card:hover {
  background: var(--surface-2);
}

.fleet-position-card:last-child {
  border-bottom: 0;
}

.fleet-position-card strong {
  color: var(--ink);
  font-size: 11px;
}

.fleet-position-card span {
  display: block;
  color: var(--muted);
  font-size: 10px;
  margin-top: 0;
}

.fleet-map-layout.is-side-panel .fleet-position-list {
  max-height: none;
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
}

.fleet-map-layout.is-side-panel .fleet-map-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.fleet-map-layout.is-side-panel .fleet-map-panel-head {
  align-items: stretch;
  flex-direction: column;
}

.fleet-map-layout.is-side-panel .fleet-panel-actions {
  justify-content: flex-start;
}

.fleet-map-layout.is-side-panel .fleet-tabs {
  width: 100%;
}

.fleet-map-layout.is-side-panel .fleet-tab {
  flex: 1;
}

.fleet-map-layout.is-side-panel .fleet-panel-actions input {
  width: 100%;
  flex: 1 1 100%;
}

.fleet-map-layout.is-side-panel .fleet-position-card {
  grid-template-columns: 72px minmax(0, 1fr) 52px 76px 78px;
  min-width: 0;
}

.fleet-map-layout.is-side-panel .fleet-position-card span,
.fleet-map-layout.is-side-panel .fleet-position-card strong {
  font-size: 10px;
}

.fleet-map-layout.is-side-panel .fleet-position-head span {
  font-size: 9px;
}

.fleet-map-layout.is-side-panel .fleet-location-cell span {
  white-space: normal;
  line-height: 1.2;
}

.fleet-map-legend {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 11px;
}

.fleet-map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.fleet-truck-marker {
  width: 72px !important;
  height: 42px !important;
  display: grid;
  place-items: center;
  background: transparent;
  border: 0;
  color: #111827;
  filter: drop-shadow(0 3px 5px rgba(15, 23, 42, .28));
}

.fleet-truck-marker.is-compact {
  width: 30px !important;
  height: 30px !important;
  filter: drop-shadow(0 2px 4px rgba(15, 23, 42, .22));
}

.fleet-truck-marker.is-trip {
  color: #2563eb;
}

.fleet-truck-marker.is-maintenance {
  color: #7c3aed;
}

.fleet-truck-marker.is-stale {
  color: #d97706;
}

.fleet-truck-pin {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  line-height: 1;
  pointer-events: none;
}

.fleet-truck-pin svg {
  display: block;
}

.fleet-truck-pin strong {
  display: block;
  max-width: 68px;
  padding: 2px 5px;
  border-radius: 3px;
  background: #111827;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fleet-map-legend .fleet-truck-marker {
  position: static;
  width: 18px !important;
  height: 14px !important;
  filter: none;
}

.fleet-map-legend .fleet-truck-marker::before {
  content: "";
  width: 17px;
  height: 12px;
  display: block;
  background: currentColor;
  clip-path: polygon(0 28%, 58% 28%, 58% 10%, 78% 10%, 100% 42%, 100% 70%, 88% 70%, 82% 92%, 68% 92%, 62% 70%, 35% 70%, 29% 92%, 15% 92%, 9% 70%, 0 70%);
}

.fleet-map-resize {
  height: 10px;
  margin: -3px 0;
  border-radius: 999px;
  cursor: ns-resize;
  background: linear-gradient(90deg, transparent, rgba(99, 112, 131, .28), transparent);
  position: relative;
}

.fleet-map-resize::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 54px;
  height: 3px;
  border-radius: 999px;
  background: rgba(99, 112, 131, .48);
  transform: translate(-50%, -50%);
}

.fleet-map-resize:hover::after {
  background: var(--blue);
}

.fleet-location-cell {
  display: flex !important;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.fleet-location-cell > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fleet-street-link {
  flex: 0 0 auto;
  min-height: 20px;
  border: 1px solid rgba(37, 99, 235, .22);
  border-radius: 6px;
  background: #eff6ff;
  color: var(--blue);
  font-size: 9px;
  font-weight: 800;
  padding: 0 6px;
  cursor: pointer;
}

.fleet-popup-actions {
  margin-top: 7px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.fleet-map-links {
  display: flex !important;
  align-items: center;
  gap: 5px;
}

@media (max-width: 1000px) {
  #fleetMap,
  .fleet-map-panel {
    min-height: 380px;
    max-height: none;
  }
  .fleet-map-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .fleet-position-card {
    grid-template-columns: 1fr;
  }
  .fleet-map-layout.is-side-panel {
    display: flex;
  }
  .fleet-map-layout.is-side-panel .fleet-map-resize {
    display: block;
  }
}

/* Responsive: stack on smaller screens */
@media (max-width: 900px) {
  .transit-chart-grid,
  .transit-form {
    grid-template-columns: 1fr;
  }

  .routes-layout {
    grid-template-columns: 1fr;
    height: auto;
    min-height: unset;
  }

  .routes-left-panel {
    max-height: 340px;
  }

  #routesMap {
    min-height: 360px;
  }
}

/* =============================================
   Locais view – all locations on an interactive map
   ============================================= */

.locais-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 16px;
  height: auto;
  min-height: 540px;
  align-items: stretch;
}

.locais-left-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: visible;
}

.locais-right-panel {
  position: relative;
  min-height: 420px;
}

#locaisMap {
  width: 100%;
  height: 100%;
  min-height: 420px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-2);
  box-shadow: var(--shadow);
}

/* Locais form panel */
.locais-form-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  overflow-y: auto;
  max-height: calc(100vh - 185px);
  flex-shrink: 0;
}

.locais-form-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.locais-form-header h3 {
  margin: 0;
  font-size: 15px;
}

.locais-form-fields {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-bottom: 10px;
}

.locais-form-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.locais-form-fields label span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.locais-form-fields input {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  font-size: 13px;
  color: var(--text);
  background: var(--surface);
  outline: none;
  transition: border-color 0.15s;
}

.locais-form-fields input:focus {
  border-color: var(--blue);
}

.locais-form-fields select {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  font-size: 13px;
  color: var(--text);
  background: var(--surface);
  outline: none;
  transition: border-color 0.15s;
  cursor: pointer;
}

.locais-form-fields select:focus {
  border-color: var(--blue);
}

.locais-coord-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.map-pick-btn.full-width {
  width: 100%;
  min-height: 34px;
  justify-content: center;
}

.locais-hint {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  margin: 4px 0 0;
}

/* Locais list panel */
#locaisListPanel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
  height: 100%;
}

.locais-search {
  width: 100%;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  font-size: 13px;
  color: var(--text);
  background: var(--surface);
  outline: none;
  flex-shrink: 0;
}

.locais-search:focus {
  border-color: var(--blue);
}

.locais-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow-y: auto;
  flex: 1;
}

/* Local card */
.local-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  box-shadow: 0 2px 4px rgba(20, 32, 44, 0.04);
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.local-card:hover {
  border-color: var(--blue);
}

.local-card.is-selected {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.local-card-info {
  margin-bottom: 7px;
}

.local-card-info strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
}

.local-card-sub {
  display: block;
  font-size: 12px;
  color: var(--muted);
  margin-top: 1px;
}

.local-coord-badge {
  display: inline-block;
  background: #e8f0fe;
  color: var(--blue);
  font-size: 11px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  margin-top: 4px;
  font-family: monospace;
}

.local-no-coord {
  display: inline-block;
  background: #fef3cd;
  color: var(--amber);
  font-size: 11px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  margin-top: 4px;
}

.local-area-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  margin-top: 4px;
  margin-left: 4px;
}

.local-area-raio {
  background: #dbeafe;
  color: var(--blue);
}

.local-area-poligono {
  background: #d1fae5;
  color: #1f8a5b;
}

.locais-empty {
  color: var(--muted);
  font-size: 13px;
  text-align: center;
  padding: 32px 12px;
}

@media (max-width: 900px) {
  .locais-layout {
    grid-template-columns: 1fr;
    height: auto;
    min-height: unset;
  }

  .locais-left-panel {
    max-height: 380px;
  }

  #locaisMap {
    min-height: 360px;
  }
}

@media (max-width: 720px) {
  .main {
    padding: 16px;
  }

  .app-footer {
    margin: auto -16px -16px;
    min-height: 30px;
    padding: 5px 18px;
  }

  .topbar,
  .table-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .filters,
  .metrics,
  .control-metrics,
  .control-layout,
  .dashboard-grid,
  .dashboard-insights,
  .dashboard-module-grid,
  .nav-tabs,
  .carrier-card,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .top-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .global-locator {
    min-width: 100%;
    width: 100%;
  }

  .control-hero {
    grid-template-columns: 1fr;
  }

  .control-hero-actions {
    justify-content: stretch;
  }

  .control-hero-actions button {
    flex: 1;
  }

  .map-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
}

/* ---------- Bulk selection checkbox ---------- */

.bulk-checkbox {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--blue);
  vertical-align: middle;
}

th.bulk-col,
td.bulk-col {
  width: 36px;
  min-width: 36px;
  padding: 8px 6px;
  text-align: center;
  vertical-align: middle;
}

/* ---------- Floating bulk-action bar ---------- */

.bulk-action-bar {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 200;
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--nav);
  color: var(--nav-text);
  border-radius: 10px;
  padding: 12px 20px;
  box-shadow: 0 8px 32px rgba(12, 22, 36, 0.36);
  font-size: 14px;
  font-weight: 600;
  animation: slideUp 0.18s ease;
}

@keyframes slideUp {
  from { opacity: 0; transform: translateX(-50%) translateY(12px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.bulk-delete-btn {
  min-height: 36px;
  border: none;
  border-radius: 7px;
  background: var(--red);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  padding: 0 16px;
}

.bulk-delete-btn:hover {
  opacity: 0.88;
}

.bulk-cancel-btn {
  min-height: 36px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 7px;
  background: transparent;
  color: var(--nav-text);
  font-size: 13px;
  cursor: pointer;
  padding: 0 14px;
}

.bulk-cancel-btn:hover {
  background: #263545;
}

/* ---------- Catalog pagination ---------- */

.catalog-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 0 4px;
  font-size: 13px;
}

.catalog-pagination span {
  color: var(--text-muted, #8a9bb0);
  min-width: 110px;
  text-align: center;
}

/* ---------- Dashboard toolbar ---------- */

.dashboard-control {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 8px 22px rgba(18, 32, 48, 0.06);
  padding: 9px 10px;
  margin-bottom: 10px;
}

.dashboard-control strong {
  display: block;
  font-size: 14px;
}

.dashboard-control small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.dashboard-control-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.dashboard-control select {
  min-height: 30px;
  min-width: 210px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  background: #fff;
  font-size: 12px;
}

.dashboard-control .secondary-button,
.dashboard-toolbar .danger-button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
  border-radius: 7px;
}

.dashboard-toolbar {
  display: flex;
  justify-content: flex-end;
  padding: 8px 0 6px;
}

.danger-button {
  min-height: 34px;
  border: none;
  border-radius: 7px;
  background: var(--red);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  padding: 0 16px;
  transition: opacity 0.15s;
}

.danger-button:hover {
  opacity: 0.85;
}

/* ---------- Import button ---------- */

.import-button {
  background: var(--accent, #2563eb);
  color: #fff;
  border: none;
  font-weight: 600;
}

.import-button:hover {
  opacity: 0.88;
}

/* ---------- Carrier card checkbox ---------- */

.carrier-card {
  grid-template-columns: auto minmax(0, 1fr) repeat(4, auto);
}

.carrier-select-label {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.carrier-select-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

/* ---------- Vehicles submenu ---------- */

.nav-submenu {
  display: flex;
  flex-direction: column;
}

.nav-submenu-toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nav-caret {
  font-size: 11px;
  opacity: 0.72;
  transition: transform 0.18s ease;
}

.nav-submenu.is-open .nav-caret {
  transform: rotate(180deg);
}

.nav-submenu-items {
  display: none;
  flex-direction: column;
  padding-left: 12px;
  gap: 4px;
  margin: 3px 0 6px;
  border-left: 1px solid rgba(174, 187, 200, 0.18);
}

.nav-submenu.is-open .nav-submenu-toggle {
  background: #263545;
}

.nav-submenu.is-open .nav-submenu-items,
.nav-submenu-items.open {
  display: flex;
}

.nav-subtab {
  min-height: 36px;
  font-size: 12px;
  padding: 0 10px;
  border-radius: 6px;
}

/* ---------- Confirm delete modal ---------- */

#confirmDeleteModal {
  border-radius: 10px;
  border: 1px solid var(--line);
  box-shadow: 0 24px 80px rgba(20, 32, 44, 0.32);
}

#confirmDeleteModal::backdrop {
  background: rgba(12, 20, 28, 0.50);
}

/* ---------- Audit timeline ---------- */

.audit-timeline {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 440px;
  overflow-y: auto;
}

.audit-event {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
}

.audit-event-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.audit-data {
  font-size: 11px;
  background: #f1f5f9;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px;
  overflow: auto;
  max-height: 180px;
  margin: 6px 0 0;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ---------- Permissions grid ---------- */

#permissionsGrid {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface-2);
  margin-top: 12px;
}

#permissionsGrid h3 {
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
  margin: 0 0 10px;
  text-transform: uppercase;
}

/* ---------- Location type badges ---------- */

.tipo-local-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  margin-top: 4px;
  background: #e8f0fe;
  color: var(--blue);
}

/* ---------- History button in audit history modal ---------- */

#auditHistoryModal {
  border-radius: 10px;
  border: 1px solid var(--line);
  box-shadow: 0 24px 80px rgba(20, 32, 44, 0.24);
}

#auditHistoryModal::backdrop {
  background: rgba(12, 20, 28, 0.42);
}

/* ---------- Nav groups (VIAGENS / CADASTRO / REFERÊNCIA) ---------- */

.nav-group {
  display: flex;
  flex-direction: column;
  margin-bottom: 2px;
}

.nav-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--muted);
  padding: 9px 12px;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  border: 1px solid transparent;
  border-radius: 6px;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.nav-group-header::after {
  content: "\25BE";
  font-size: 10px;
  opacity: .72;
  transition: transform .18s ease;
}

.nav-group-header:hover,
.nav-group.is-open > .nav-group-header {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.08);
  color: var(--nav-text);
}

.nav-group.is-open > .nav-group-header::after {
  transform: rotate(180deg);
}

.nav-group:not(.is-open) > :not(.nav-group-header) {
  display: none !important;
}

.nav-sublevel {
  padding-left: 24px !important;
  font-size: 12px;
  min-height: 32px;
}

/* ---------- Row expiry colors ---------- */

tr.row-expired td {
  background: #fff1f0 !important;
  color: #c0392b;
}

tr.row-expiring td {
  background: #fff8e1 !important;
  color: #b7700d;
}

/* ---------- Trip status badges ---------- */

.pill.agendada { background: #e8f4fd; color: #1a6fa0; }
.pill.em-viagem { background: #e6f9f0; color: #1a8a4a; }
.pill.finalizada { background: #f0f4f8; color: #555; }
.pill.cancelada { background: #fff0f0; color: #c0392b; }

/* ---------- Trip dialog extras ---------- */

.destinos-field {
  grid-column: 1 / -1;
}

.destino-extra-row {
  margin-bottom: 4px;
}

.dialog-actions-extra {
  display: flex;
  gap: 8px;
  padding: 6px 24px 0;
  flex-wrap: wrap;
}

/* ---------- Pedagio calculator ---------- */

#pedagioCalculator label {
  cursor: pointer;
  width: 100%;
}

/* ---------- Drivers table CPF mask ---------- */

.cpf-masked {
  font-family: monospace;
  letter-spacing: 0.05em;
  color: var(--muted);
}

/* ---------- Vehicle form sections ---------- */
.vehicle-dialog { max-width: 560px; width: 95vw; }

.vform-section {
  margin-bottom: 16px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 8px;
  overflow: visible;
}

.vform-body {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  max-height: 68vh;
  padding-right: 4px;
  margin-bottom: 12px;
}

.vform-section-title {
  background: var(--accent, #f0f4ff);
  color: var(--primary, #1d4ed8);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-bottom: 1px solid var(--line, #e5e7eb);
}

.vform-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 14px;
  padding: 12px 14px;
}

.vform-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}

.vform-grid label span {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--muted, #6b7280);
}

.vform-grid input,
.vform-grid select,
.vform-grid textarea {
  height: 34px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 6px;
  padding: 0 8px;
  font-size: 13px;
  background: #fff;
  width: 100%;
  box-sizing: border-box;
}

.vform-grid select { height: 34px; }
.vform-grid select[multiple] {
  height: auto;
  min-height: 136px;
  padding: 6px 8px;
}

.vform-span2 { grid-column: span 2; }

/* ---------- Resizable / fullscreen dialogs ---------- */
.vform-dialog {
  max-width: 560px;
  width: 95vw;
  resize: both;
  overflow: auto;
  min-width: 320px;
  min-height: 200px;
}

.trip-dialog.is-fullscreen,
.vform-dialog.is-fullscreen {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  max-height: 100vh !important;
  margin: 0 !important;
  border-radius: 0 !important;
  resize: none !important;
}

.trip-dialog.is-minimized {
  width: min(520px, 94vw) !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.trip-dialog.is-minimized .dialog-head ~ *,
.trip-dialog.is-minimized .vform-header ~ * {
  display: none !important;
}

/* headButtons inline layout */
.dialog-head { display:flex; justify-content:space-between; align-items:center; }

/* ---------- Maintenance experience ---------- */
.view.maintenance-view {
  display: none;
}

.view.maintenance-view.is-active {
  display: grid;
  gap: 16px;
}

.maintenance-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(130px, 0.45fr));
  gap: 12px;
  align-items: stretch;
}

.maintenance-intro,
.maintenance-stat {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 14px;
}

.maintenance-intro {
  display: grid;
  gap: 6px;
}

.maintenance-kicker {
  color: var(--teal);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.maintenance-intro strong {
  font-size: 18px;
  line-height: 1.25;
}

.maintenance-intro span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.maintenance-stat {
  display: grid;
  align-content: center;
  gap: 4px;
}

.maintenance-stat span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.maintenance-stat strong {
  font-size: 24px;
  line-height: 1;
}

.maintenance-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(160px, 220px) auto auto;
  gap: 10px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  box-shadow: var(--shadow);
}

.maintenance-toolbar input,
.maintenance-toolbar select {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  width: 100%;
}

.finance-toolbar {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) auto;
  gap: 10px;
  align-items: end;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 12px;
  margin-bottom: 16px;
}

.finance-toolbar label,
.finance-form label {
  display: grid;
  gap: 5px;
}

.finance-toolbar span,
.finance-form span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.finance-toolbar input,
.finance-toolbar select,
.finance-form input,
.finance-form select,
.finance-form textarea {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  width: 100%;
}

.finance-form textarea {
  min-height: 72px;
  padding: 8px 10px;
}

.finance-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 12px;
}

.metric-card,
.finance-card {
  display: grid;
  gap: 5px;
  min-height: 94px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
}

.metric-card span,
.finance-card span,
.metric-label {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.metric-card strong,
.finance-card strong,
.metric-value {
  color: var(--text);
  font-size: 21px;
  line-height: 1.1;
}

.metric-card small,
.finance-card small {
  color: var(--muted);
  font-size: 12px;
}

.finance-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.maintenance-table-wrap {
  overflow-x: auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.empty-state-row td {
  padding: 34px 18px;
  text-align: center;
  color: var(--muted);
}

.maintenance-dialog {
  max-width: 980px;
  width: min(980px, calc(100vw - 24px));
  max-height: calc(100vh - 28px);
}

.maintenance-dialog form {
  padding: 0;
}

.vform-header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  padding: 16px 18px;
}

.vform-header h2 {
  font-size: 18px;
}

.vform-section {
  margin: 14px 18px;
  background: #fff;
}

.vform-section legend {
  padding: 0 8px;
  color: var(--teal);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.vform-actions {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  background: var(--surface);
  border-top: 1px solid var(--line);
  padding: 14px 18px;
}

.vform-grid textarea {
  height: auto;
  line-height: 1.4;
  padding: 9px 10px;
}

.check-item {
  background: #f8fafc;
  border: 1px solid #e7edf4;
  border-radius: 7px;
  padding: 8px;
}

.check-item select {
  background: #fff;
}

.peca-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 80px 130px 38px;
  gap: 8px;
  align-items: end;
}

.peca-row label {
  display: grid;
  gap: 4px;
}

.peca-row span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.peca-row input {
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 8px;
}

@media (max-width: 960px) {
  .maintenance-hero,
  .maintenance-toolbar,
  .finance-toolbar,
  .finance-metrics,
  .finance-form {
    grid-template-columns: 1fr;
  }

  .vform-grid,
  .vform-grid[style],
  .peca-row {
    grid-template-columns: 1fr !important;
  }

  .vform-span2 {
    grid-column: span 1;
  }
}

/* ---------- Map satellite toggle ---------- */

/* ---------- Modern UI refresh ---------- */

:root {
  --bg: #eef3f7;
  --surface: #ffffff;
  --surface-2: #f5f8fb;
  --text: #13202f;
  --muted: #66758a;
  --line: #dce4ec;
  --nav: #101b28;
  --nav-text: #eef5fb;
  --blue: #1d5fd1;
  --green: #13835f;
  --teal: #0b766f;
  --shadow: 0 14px 36px rgba(18, 32, 48, 0.10);
}

body {
  background: linear-gradient(180deg, #f8fafc 0%, #eef3f7 48%, #e8eef5 100%);
}

.sidebar {
  background: linear-gradient(180deg, #0f1b29 0%, #132338 100%);
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 8px 0 28px rgba(15, 27, 41, 0.12);
}

.brand {
  padding: 6px 6px 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.nav-tab {
  border: 1px solid transparent;
  border-radius: 8px;
  font-weight: 700;
}

.nav-tab:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.08);
}

.nav-tab.is-active,
.nav-submenu.is-open .nav-submenu-toggle {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.12);
}

.main {
  padding: 28px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.app-footer {
  margin: auto -28px -28px;
  min-height: 30px;
  padding: 5px 28px;
}

.topbar {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(220, 228, 236, 0.88);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(18, 32, 48, 0.07);
  padding: 12px 14px;
}

.topbar h1 {
  font-size: 23px;
  line-height: 1.08;
}

.topbar p {
  font-size: 13px;
  line-height: 1.25;
}

.top-actions {
  gap: 8px;
}

.top-actions .secondary-button,
.top-actions .export-button,
.top-actions .clear-button {
  min-height: 34px;
  padding: 0 12px;
  font-size: 12px;
}

.filters,
.finance-toolbar,
.maintenance-toolbar,
.table-toolbar,
.map-toolbar {
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 8px 22px rgba(18, 32, 48, 0.06);
  padding: 12px;
}

input,
select,
textarea,
.filters input,
.filters select,
.trip-dialog input,
.trip-dialog select,
.trip-dialog textarea,
.dialog-form input,
.dialog-form select,
.dialog-form textarea,
.vform-grid input,
.vform-grid select,
.finance-toolbar input,
.finance-toolbar select,
.finance-form input,
.finance-form select {
  border-radius: 8px;
  border-color: #d8e2ec;
  background: #fff;
}

.export-button,
.secondary-button,
.clear-button,
.danger-button,
.row-actions button,
.icon-button,
.pagination button {
  border-radius: 8px;
}

.export-button {
  background: linear-gradient(180deg, #256fdf 0%, #1d5fd1 100%);
  border-color: #1d5fd1;
  box-shadow: 0 8px 18px rgba(29, 95, 209, 0.18);
}

.secondary-button {
  background: linear-gradient(180deg, #0d8f84 0%, #0b766f 100%);
  border-color: #0b766f;
  box-shadow: 0 8px 18px rgba(11, 118, 111, 0.16);
}

.clear-button,
.row-actions button,
.icon-button {
  background: #fff;
}

.table-wrap,
.maintenance-table-wrap,
.panel,
.metric,
.locais-form-panel,
.routes-form-panel,
.local-card {
  border-radius: 10px;
  border-color: #dce4ec;
  box-shadow: 0 12px 30px rgba(18, 32, 48, 0.08);
}

table thead th {
  position: sticky;
  top: 0;
  z-index: 6;
  background: #f4f8fb;
  color: #46586d;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: inset 0 -1px 0 var(--line);
}

.adjustable-table thead th {
  position: relative;
  user-select: none;
  touch-action: none;
}

.adjustable-table thead th[draggable="true"] {
  cursor: grab;
}

.adjustable-table thead th.is-dragging-column {
  opacity: .55;
  cursor: grabbing;
}

.adjustable-table thead th.is-column-drop-target {
  box-shadow: inset 3px 0 0 var(--blue, #2563eb);
  background: #eaf2ff;
}

.column-resize-handle {
  position: absolute;
  top: 0;
  right: -3px;
  width: 7px;
  height: 100%;
  cursor: col-resize;
  z-index: 3;
}

.column-resize-handle::after {
  content: "";
  position: absolute;
  top: 24%;
  bottom: 24%;
  left: 3px;
  width: 1px;
  background: rgba(100, 116, 139, .34);
  opacity: 0;
  transition: opacity .15s ease;
}

.adjustable-table thead th:hover .column-resize-handle::after,
.is-resizing-column .column-resize-handle::after {
  opacity: 1;
}

.is-resizing-column,
.is-resizing-column * {
  cursor: col-resize !important;
}

.main .top-actions {
  gap: 6px;
}

.main .top-actions .secondary-button,
.main .top-actions .export-button,
.main .top-actions .clear-button,
.main .fleet-top-controls .secondary-button,
.report-action-bar .secondary-button,
.report-action-bar .export-button,
.telemetry-actions .secondary-button,
.fleet-panel-actions .clear-button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
  border-radius: 7px;
}

.report-console {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 8px 22px rgba(18, 32, 48, 0.06);
  padding: 10px;
  margin-bottom: 12px;
}

.report-console-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.report-console h2 {
  margin: 0;
  font-size: 18px;
}

.report-console p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.report-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) repeat(2, minmax(125px, .7fr)) repeat(3, minmax(145px, 1fr));
  gap: 8px;
  align-items: end;
}

.report-controls label,
.telemetry-actions {
  min-width: 0;
}

.report-controls span {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.report-controls input,
.report-controls select {
  width: 100%;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  font-size: 12px;
  background: #fff;
}

.report-action-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  margin-top: 8px;
}

.telemetry-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.telemetry-actions input {
  min-height: 30px !important;
  font-size: 12px;
  max-width: 140px;
}

.telemetry-actions select {
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  font-size: 12px;
  background: #fff;
  max-width: 150px;
}

.telemetry-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 10px;
}

.telemetry-tab {
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.82);
  color: var(--ink);
  padding: 0 10px;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.telemetry-tab.is-active {
  border-color: rgba(15, 143, 131, .35);
  background: #0f8f83;
  color: #fff;
  box-shadow: 0 8px 18px rgba(15, 143, 131, .18);
}

.telemetry-chart-panel {
  margin-bottom: 12px;
  padding: 10px;
}

.telemetry-chart-panel .panel-head {
  margin-bottom: 8px;
}

.telemetry-chart-panel h2 {
  margin: 0;
  font-size: 15px;
}

.telemetry-chart-panel p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11px;
}

.telemetry-chart {
  height: 210px;
}

#telemetriaView .dashboard-grid {
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 8px;
  margin-bottom: 10px !important;
}

#telemetriaView .metric-card {
  min-height: 56px;
  padding: 8px 10px;
  gap: 2px;
  box-shadow: 0 6px 14px rgba(15, 23, 42, .05);
}

#telemetriaView .metric-card span {
  font-size: 9px;
}

#telemetriaView .metric-card strong {
  font-size: 18px;
  margin-top: 0;
}

#telemetriaView .metric-card small {
  font-size: 10px;
}

@media (max-width: 1100px) {
  #telemetriaView .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .report-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

table tbody tr:hover td {
  background: #f8fbff;
}

.trip-dialog,
.vform-dialog,
.maintenance-dialog {
  border-radius: 12px;
  box-shadow: 0 30px 90px rgba(18, 32, 48, 0.34);
}

.dialog-head,
.maintenance-dialog .dialog-head {
  background: #f8fbfe;
}

/* ---------- Usability polish ---------- */

.topbar {
  align-items: flex-start;
  backdrop-filter: blur(10px);
}

.topbar h1 {
  letter-spacing: 0;
}

.topbar-actions {
  gap: 8px;
}

.filters,
.finance-toolbar,
.maintenance-toolbar,
.table-toolbar,
.map-toolbar,
.panel,
.metric,
.table-wrap,
.maintenance-table-wrap {
  backdrop-filter: blur(8px);
}

.metric {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfe 100%);
  min-height: 84px;
}

.metric span {
  color: #5c6b7e;
  font-size: 11px;
}

.metric strong {
  font-size: clamp(20px, 2vw, 28px);
}

.finance-metrics {
  grid-template-columns: repeat(auto-fit, minmax(154px, 1fr));
  margin-bottom: 16px;
}

.finance-toolbar {
  grid-template-columns: repeat(3, minmax(140px, 1fr)) auto;
}

.trip-dialog {
  max-width: min(1040px, calc(100vw - 28px));
}

.trip-dialog form {
  max-height: min(82vh, 760px);
}

.trip-finance-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(92px, 1fr));
  gap: 8px;
}

.trip-finance-grid .tform-field {
  min-width: 0;
}

.trip-finance-grid .tform-field span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.trip-finance-grid .tform-field input {
  height: 32px;
  padding: 0 7px;
  font-size: 12px;
}

.field-hint {
  display: block;
  margin-top: 3px;
  color: #b45309;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  text-transform: none;
}

.tform-field > .clear-button {
  align-self: flex-start;
  margin-top: 4px;
  padding: 5px 9px;
  font-size: 11px;
}

.nav-submenu-items {
  gap: 4px;
}

.nav-sublevel {
  padding-left: 24px;
}

.nav-sublevel-nested {
  padding-left: 36px;
  font-size: 11px;
  color: #cbd5e1;
}

.nav-sublevel-nested::before {
  content: "↳";
  margin-right: 6px;
  opacity: 0.7;
}

.data-table th,
.data-table td,
table th,
table td {
  vertical-align: middle;
}

@media (max-width: 900px) {
  .finance-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .trip-finance-grid {
    grid-template-columns: repeat(3, minmax(88px, 1fr));
  }
}

@media (max-width: 560px) {
  .finance-toolbar,
  .trip-finance-grid {
    grid-template-columns: 1fr;
  }
}

.vform-section-title,
.tform-label {
  color: #164f9f;
}

.municipio-field {
  position: relative !important;
  overflow: visible !important;
}

.municipio-field:focus-within {
  z-index: 50;
}

.municipio-dropdown {
  position: absolute;
  z-index: 200000;
  max-height: 240px;
  overflow-y: auto;
  min-width: 220px;
  background: #fff;
  border: 1px solid #cfdbe8;
  border-radius: 8px;
  box-shadow: 0 18px 40px rgba(18, 32, 48, 0.20);
  padding: 4px;
}

.municipio-option {
  display: block;
  width: 100%;
  min-height: 34px;
  border: 0;
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font-size: 13px;
  padding: 8px 10px;
  text-align: left;
  white-space: nowrap;
  transform: none;
}

.municipio-option:hover,
.municipio-option:focus {
  background: #eaf2ff;
  color: #164f9f;
}

.municipio-empty {
  color: var(--muted);
  font-size: 13px;
  padding: 8px 10px;
}

.inline-action-field {
  display: flex;
  gap: 8px;
  align-items: center;
}

.inline-action-field input,
.inline-action-field select {
  flex: 1;
  min-width: 0;
}

.inline-action-field .clear-button {
  min-height: 34px;
  padding: 0 10px;
  white-space: nowrap;
}

.inline-action-field .square-action {
  width: 36px;
  min-width: 36px;
  padding: 0;
  font-weight: 800;
}

.role-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.field-label {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.role-check-grid label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 4px 6px;
  border-radius: 6px;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}

.role-check-grid input {
  width: 16px;
  height: 16px;
}

.sequence-badge {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 28px;
  border-radius: 999px;
  background: #eaf2ff;
  color: #164f9f;
  border: 1px solid #cfe0ff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.map-layer-btn {
  position: absolute;
  top: 72px;
  right: 10px;
  z-index: 1001;
  background: #fff;
  border: 2px solid rgba(0,0,0,.2);
  border-radius: 4px;
  padding: 5px 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 1px 5px rgba(0,0,0,.4);
  white-space: nowrap;
}
.map-layer-btn:hover { background: #f4f4f4; }
.map-layer-btn:nth-of-type(2) { top: 104px; }
.map-fullscreen-css {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 9999 !important;
  border-radius: 0 !important;
}

.sinistro-filters {
  align-items: end;
}

.split-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.status-row {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) minmax(100px, 2fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
}

.status-row span {
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
}

.status-row strong {
  font-size: 12px;
}

.status-track {
  height: 9px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--surface-2);
}

.status-fill {
  height: 100%;
  min-width: 4px;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--teal), var(--blue));
}

@media (max-width: 760px) {
  .split-list {
    grid-template-columns: 1fr;
  }
}

/* Compactacao operacional global: mais area util para tabelas, mapas e workflow. */
.main .topbar {
  padding: 8px 10px;
  margin-bottom: 10px;
  border-radius: 10px;
  align-items: center;
}

.main .topbar h1 {
  font-size: 21px;
  line-height: 1.05;
}

.main .topbar p {
  display: none;
}

.main .top-actions {
  gap: 6px;
  justify-content: flex-end;
}

.main .top-actions .secondary-button,
.main .top-actions .export-button,
.main .top-actions .clear-button,
.main .fleet-top-controls .secondary-button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
}

.main .fleet-top-controls input,
.main .fleet-top-controls select {
  min-height: 30px;
  font-size: 11px;
}

.main .server-state {
  min-height: 24px;
  font-size: 10px;
  padding: 0 8px;
}

.global-locator {
  display: none !important;
}

#fleetMap {
  height: min(660px, calc(100vh - 275px));
  min-height: 430px;
}

.fleet-map-layout.is-side-panel #fleetMap {
  height: min(720px, calc(100vh - 220px));
  min-height: 480px;
}

/* Ajustes finais de densidade operacional. Mantem os mapas e grids como foco da tela. */
#controlTowerView .control-metrics,
#transitTimeView .transit-kpi-grid,
#controlTowerView .workflow-strip {
  gap: 6px !important;
  margin-bottom: 8px !important;
}

#controlTowerView .control-metrics {
  grid-template-columns: repeat(5, minmax(88px, 1fr)) !important;
}

#transitTimeView .transit-kpi-grid {
  grid-template-columns: repeat(6, minmax(86px, 1fr)) !important;
}

#transitTimeView.is-active,
#trackingView.is-active {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 116px);
}

#transitTimeView .transit-summary-toolbar,
#trackingView .tracking-summary-toolbar {
  flex: 0 0 auto;
}

#controlTowerView .metric-card,
#transitTimeView .metric-card,
#controlTowerView .workflow-mini-card {
  min-height: 42px !important;
  padding: 6px 8px !important;
  gap: 1px !important;
  border-radius: 7px !important;
}

#controlTowerView .metric-card span,
#transitTimeView .metric-card span,
#controlTowerView .workflow-mini-card span {
  font-size: 8.5px !important;
  line-height: 1.05 !important;
}

#controlTowerView .metric-card strong,
#transitTimeView .metric-card strong,
#controlTowerView .workflow-mini-card strong {
  margin-top: 2px !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

#controlTowerView .metric-card small,
#transitTimeView .metric-card small {
  display: none !important;
}

#controlTowerView .workflow-panel {
  margin-bottom: 8px !important;
}

#controlTowerView .panel-head,
#transitTimeView .panel-head {
  padding-bottom: 6px !important;
}

#towerMapPanel.is-expanded {
  position: fixed !important;
  inset: 14px !important;
  z-index: 5000 !important;
  display: flex !important;
  flex-direction: column !important;
  max-height: none !important;
}

#towerMapPanel.is-expanded .control-map-shell {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

#towerMapPanel.is-expanded .control-map-grid {
  min-height: calc(100vh - 120px) !important;
}

@media (max-width: 1100px) {
  #controlTowerView .control-metrics,
  #transitTimeView .transit-kpi-grid {
    grid-template-columns: repeat(3, minmax(100px, 1fr)) !important;
  }
}

/* Ajuste fino das telas operacionais: cabecalho baixo, controles na mesma linha e grids com rolagem propria. */
.main .topbar {
  min-height: 42px;
}

.main .topbar > div:first-child {
  min-width: 170px;
}

.main .top-actions {
  flex-wrap: nowrap;
  min-width: 0;
}

.main .top-actions > * {
  flex: 0 0 auto;
}

.main .fleet-top-controls.tower-top-controls {
  max-width: none;
  width: auto;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}

.main .fleet-top-controls.tower-top-controls input {
  width: min(230px, 22vw);
  min-width: 180px;
}

.main .fleet-top-controls.tower-top-controls select {
  width: 82px;
}

.main .fleet-top-controls.tower-top-controls .secondary-button {
  min-width: 72px;
}

#viagensAndamentoView .control-history-strip {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-top: 0;
}

#viagensAndamentoView .control-history-strip > .table-toolbar,
#transitTimeView .transit-summary-toolbar {
  min-height: 48px;
  padding: 8px 12px;
  align-items: center;
}

#viagensAndamentoView .control-history-strip .table-toolbar > div:first-child,
#transitTimeView .transit-summary-toolbar > div:first-child {
  min-width: 180px;
}

#viagensAndamentoView .control-history-strip small {
  display: inline;
  margin-left: 4px;
  font-size: 11px;
}

#viagensAndamentoView .control-history-strip .inline-actions,
#transitTimeView .transit-summary-toolbar .inline-actions {
  flex-wrap: nowrap;
}

#viagensAndamentoView .control-history-strip .inline-actions input {
  min-width: 180px;
  width: min(260px, 24vw);
}

#viagensAndamentoView .control-history-strip .inline-actions select,
#transitTimeView .transit-summary-toolbar .inline-actions select {
  min-width: 150px;
}

#viagensAndamentoView .compact-metrics,
#transitTimeView .transit-kpi-grid {
  grid-template-columns: repeat(6, minmax(92px, 1fr)) !important;
  gap: 6px !important;
  margin: 6px 0 8px !important;
}

#viagensAndamentoView .compact-metrics article,
#transitTimeView .metric-card {
  min-height: 38px !important;
  padding: 5px 8px !important;
}

#viagensAndamentoView .compact-metrics span,
#transitTimeView .metric-card span {
  font-size: 8px !important;
}

#viagensAndamentoView .compact-metrics strong,
#transitTimeView .metric-card strong {
  font-size: 15px !important;
  margin-top: 1px !important;
}

#viagensAndamentoView .andamento-grid-toolbar {
  margin-top: 8px;
}

#viagensAndamentoView .andamento-grid-toolbar select {
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 8px;
}

#viagensAndamentoView .andamento-grid-wrap {
  max-height: min(520px, calc(100vh - 260px));
  overflow: auto;
}

#transitTimeView .transit-grid-wrap {
  max-height: min(470px, calc(100vh - 330px));
  overflow: auto;
}

#transitTimeView .transit-grid-wrap table {
  min-width: 1380px;
}

#transitTimeView .transit-grid-wrap th,
#transitTimeView .transit-grid-wrap td {
  font-size: 11px;
  padding: 6px 7px;
}

#trackingView .tracking-summary-toolbar {
  min-height: 48px;
  padding: 8px 12px;
  align-items: center;
}

#trackingView .tracking-summary-toolbar .inline-actions {
  flex-wrap: nowrap;
}

#trackingView .tracking-summary-toolbar input {
  min-width: 220px;
  width: min(320px, 30vw);
}

#trackingView .tracking-summary-toolbar small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
}

#trackingView .tracking-sheet-link {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

#trackingView .tracking-summary-toolbar select {
  min-width: 150px;
}

#trackingView .tracking-kpi-grid {
  grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  gap: 6px !important;
  margin: 6px 0 8px !important;
}

#trackingView .tracking-kpi-grid .metric-card {
  min-height: 38px !important;
  padding: 5px 8px !important;
}

#trackingView .tracking-kpi-grid .metric-card span {
  font-size: 8px !important;
}

#trackingView .tracking-kpi-grid .metric-card strong {
  font-size: 15px !important;
  margin-top: 1px !important;
}

#trackingView .tracking-grid-wrap {
  max-height: min(540px, calc(100vh - 255px));
  overflow: auto;
}

#trackingView .tracking-grid-wrap th,
#trackingView .tracking-grid-wrap td {
  font-size: 11px;
  padding: 6px 7px;
}

#transitTimeView .transit-chart-grid {
  flex: 0 0 auto;
  grid-template-columns: minmax(180px, 0.8fr) minmax(220px, 1fr) minmax(220px, 1fr);
  gap: 8px !important;
  margin-bottom: 8px !important;
}

#transitTimeView .transit-chart-card {
  min-height: 128px !important;
  padding: 8px 10px !important;
}

#transitTimeView .transit-chart-card h2 {
  font-size: 11px !important;
  margin-bottom: 4px !important;
}

#transitTimeView .transit-chart,
#transitTimeView .transit-chart-card:first-child .transit-chart {
  height: 86px !important;
}

#transitTimeView .transit-status-legend {
  font-size: 10px;
  gap: 2px 6px;
}

#transitTimeView .transit-grid-wrap {
  flex: 1 1 auto;
  height: calc(100vh - 300px);
  max-height: none !important;
  min-height: 360px;
}

#trackingView .tracking-grid-wrap {
  flex: 1 1 auto;
  height: calc(100vh - 230px);
  max-height: none !important;
  min-height: 420px;
}

#transitTimeView .grid-page-control,
#trackingView .grid-page-control {
  flex: 0 0 auto;
}

@media (max-width: 1180px) {
  .main .top-actions {
    flex-wrap: wrap;
  }

  .main .fleet-top-controls.tower-top-controls {
    flex-wrap: wrap;
  }

  #viagensAndamentoView .control-history-strip .inline-actions,
  #transitTimeView .transit-summary-toolbar .inline-actions,
  #trackingView .tracking-summary-toolbar .inline-actions {
    flex-wrap: wrap;
  }

  #viagensAndamentoView .compact-metrics,
  #transitTimeView .transit-kpi-grid {
    grid-template-columns: repeat(3, minmax(100px, 1fr)) !important;
  }
}

/* Prioridade operacional: Tracking e Transit Time devem usar a tela para listar viagens. */
#transitTimeView.is-active,
#trackingView.is-active {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 6px;
  min-height: calc(100vh - 106px);
}

#transitTimeView .transit-summary-toolbar,
#trackingView .tracking-summary-toolbar {
  min-height: 36px !important;
  padding: 5px 8px !important;
  margin: 0 !important;
}

#transitTimeView .transit-summary-toolbar small,
#trackingView .tracking-summary-toolbar small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.1;
}

#transitTimeView .transit-summary-toolbar input,
#trackingView .tracking-summary-toolbar input,
#transitTimeView .transit-summary-toolbar select,
#trackingView .tracking-summary-toolbar select {
  min-height: 28px !important;
  font-size: 11px !important;
}

#transitTimeView .transit-kpi-grid,
#trackingView .tracking-kpi-grid {
  margin: 0 !important;
  gap: 5px !important;
}

#transitTimeView .metric-card,
#trackingView .metric-card {
  min-height: 30px !important;
  padding: 4px 7px !important;
}

#transitTimeView .metric-card small,
#trackingView .metric-card small {
  display: none !important;
}

#transitTimeView .transit-chart-grid {
  display: none !important;
}

#transitTimeView .transit-grid-wrap,
#trackingView .tracking-grid-wrap {
  height: min(68vh, 720px) !important;
  max-height: min(68vh, 720px) !important;
  min-height: 430px !important;
  overflow: auto !important;
  overscroll-behavior: contain;
}

#transitTimeView .transit-grid-wrap table,
#trackingView .tracking-grid-wrap table {
  margin-bottom: 0;
}

#transitTimeView .grid-page-control,
#trackingView .grid-page-control {
  position: static;
  z-index: 5;
  margin: 0 !important;
  padding: 5px 8px !important;
  background: rgba(238, 244, 249, 0.96);
  border: 1px solid var(--line);
  border-radius: 8px;
}

#transitTimeView .transit-grid-wrap thead th,
#trackingView .tracking-grid-wrap thead th {
  top: 0;
  z-index: 8;
}

.logistic-status-strip {
  display: grid;
  grid-template-columns: repeat(8, minmax(112px, 1fr));
  gap: 8px;
  margin: 0 0 8px;
  overflow-x: auto;
}

.logistic-status-card {
  min-height: 46px;
  border-radius: 7px;
  padding: 7px 9px;
  color: #fff;
  display: grid;
  align-content: center;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
}

.logistic-status-card strong {
  font-size: 18px;
  line-height: 1;
}

.logistic-status-card span {
  font-size: 9px;
  font-weight: 800;
  line-height: 1.15;
  text-transform: uppercase;
}

.logistic-status-card.is-stop { background: #f59e0b; }
.logistic-status-card.is-purple { background: #a855f7; }
.logistic-status-card.is-blue { background: #6366f1; }
.logistic-status-card.is-danger { background: #ef4444; }
.logistic-status-card.is-green { background: #22c55e; }
.logistic-status-card.is-yellow { background: #eab308; }

#coletasEntregasView.is-active {
  display: grid !important;
  grid-template-rows: auto auto minmax(260px, .85fr) minmax(0, 1fr);
  gap: 7px;
  min-height: calc(100vh - 106px);
}

.delivery-monitor-shell {
  display: contents;
}

.delivery-monitor-topbar {
  min-height: 42px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.delivery-monitor-topbar strong {
  display: block;
  font-size: 15px;
}

.delivery-monitor-topbar small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.2;
}

.delivery-monitor-topbar input,
.delivery-monitor-topbar select {
  min-height: 29px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 9px;
  font-size: 11px;
}

.delivery-status-row {
  display: grid;
  grid-template-columns: repeat(7, minmax(98px, 1fr));
  gap: 6px;
}

.delivery-status-card {
  min-height: 42px;
  border-radius: 7px;
  padding: 6px 8px;
  color: #fff;
  display: grid;
  align-content: center;
  overflow: hidden;
  position: relative;
}

.delivery-status-card strong {
  font-size: 18px;
  line-height: 1;
}

.delivery-status-card span {
  font-size: 8.5px;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.delivery-status-card::after {
  content: "";
  position: absolute;
  right: -15px;
  top: -14px;
  width: 58px;
  height: 58px;
  border: 5px solid rgba(255, 255, 255, .24);
  border-radius: 50%;
}

.delivery-status-card.is-trip { background: #f97316; }
.delivery-status-card.is-ok { background: #43a047; }
.delivery-status-card.is-neutral { background: #9ca3af; }
.delivery-status-card.is-alert { background: #f59e0b; }
.delivery-status-card.is-danger { background: #e11d48; }

.delivery-monitor-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .95fr);
  gap: 7px;
  min-height: 0;
}

.delivery-map-panel,
.delivery-chart-panel,
.delivery-table-panel,
.delivery-notification-panel {
  padding: 8px !important;
  min-height: 0;
}

.delivery-map-lite {
  position: relative;
  height: 100%;
  min-height: 190px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(15, 118, 110, .09) 1px, transparent 1px),
    linear-gradient(180deg, rgba(15, 118, 110, .09) 1px, transparent 1px),
    radial-gradient(circle at 80% 25%, rgba(14, 165, 233, .18), transparent 28%),
    linear-gradient(135deg, #f8fafc, #e8f7f8);
  background-size: 34px 34px, 34px 34px, auto, auto;
}

.delivery-map-pin {
  position: absolute;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  color: #fff;
  background: #0f8f7e;
  padding: 3px 6px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .18);
  border: 1px solid rgba(255,255,255,.65);
}

.delivery-map-pin.is-ok { background: #16a34a; }
.delivery-map-pin.is-late { background: #dc2626; }
.delivery-map-pin.is-nosignal { background: #64748b; }

.delivery-map-pin .fleet-truck-pin {
  flex-direction: row;
  gap: 3px;
}

.delivery-map-pin .fleet-truck-pin svg {
  width: 15px;
  height: 15px;
}

.delivery-map-pin .fleet-truck-pin strong {
  max-width: 58px;
  padding: 0;
  background: transparent;
  font-size: 9px;
}

.delivery-map-legend {
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 6px 8px;
  border-radius: 7px;
  background: rgba(255,255,255,.92);
  color: var(--text);
  font-size: 10px;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .12);
}

.delivery-map-legend span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.delivery-map-legend i,
.mini-status {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  display: inline-block;
}

.delivery-map-legend .is-trip { background: #0f8f7e; }
.delivery-map-legend .is-ok { background: #16a34a; }
.delivery-map-legend .is-late { background: #dc2626; }
.delivery-map-legend .is-nosignal { background: #64748b; }

.delivery-donut-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  height: calc(100% - 28px);
  min-height: 190px;
}

.delivery-donut-row > div {
  min-height: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
}

.delivery-donut-row h3 {
  margin: 0 0 4px;
  font-size: 11px;
  text-align: center;
  color: var(--text);
}

.delivery-donut-row canvas {
  width: 100% !important;
  height: calc(100% - 18px) !important;
}

.delivery-grid-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 7px;
  min-height: 0;
}

.delivery-grid-wrap {
  height: 100%;
  min-height: 260px;
  overflow: auto;
}

.delivery-grid-wrap th,
.delivery-grid-wrap td {
  font-size: 11px;
  padding: 7px 8px;
}

.delivery-grid-wrap table {
  min-width: 1320px;
}

.delivery-notification-panel .dashboard-list {
  max-height: 100%;
  overflow: auto;
}

.mini-status {
  margin-right: 5px;
  vertical-align: -1px;
}

.mini-status.ok { background: #16a34a; }
.mini-status.pending { background: #94a3b8; }

.transit-detail-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 6px;
  margin-bottom: 8px;
}

.transit-detail-grid article {
  border: 1px solid rgba(148, 163, 184, .26);
  border-radius: 8px;
  padding: 7px 8px;
  background: #fff;
}

.transit-detail-grid span {
  display: block;
  color: #64748b;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.transit-detail-grid strong {
  display: block;
  margin-top: 3px;
  color: #0f172a;
  font-size: 11px;
}

#coletasEntregasView .grid-page-control {
  position: sticky;
  bottom: 0;
  z-index: 5;
  margin: 0 !important;
  padding: 5px 8px !important;
  background: rgba(238, 244, 249, 0.96);
  border: 1px solid var(--line);
  border-radius: 8px;
}

@media (max-width: 1180px) {
  .delivery-monitor-topbar,
  .delivery-monitor-layout,
  .delivery-grid-layout {
    grid-template-columns: 1fr;
  }

  .delivery-monitor-topbar {
    flex-wrap: wrap;
  }

  .delivery-status-row {
    grid-template-columns: repeat(3, minmax(110px, 1fr));
  }

  .logistic-status-strip {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
  }
}

/* Refinamento visual leve para torre, monitor e navegação. */
:root {
  --nav: #0b2230;
  --nav-2: #102f3d;
  --accent-violet: #5b2be0;
  --accent-blue: #2563eb;
  --accent-cyan: #0891b2;
  --accent-green: #16a34a;
  --accent-red: #ef4444;
  --accent-amber: #f59e0b;
}

.sidebar {
  background:
    radial-gradient(circle at 18% 0%, rgba(148, 163, 184, .12), transparent 34%),
    linear-gradient(180deg, var(--nav) 0%, #061927 100%) !important;
  border-right: 1px solid rgba(148, 163, 184, .18);
  box-shadow: 10px 0 26px rgba(2, 6, 23, .18);
}

.brand {
  margin-bottom: 18px;
  padding: 8px 8px 18px;
  border-bottom: 1px solid rgba(226, 232, 240, .12);
}

.nav-tabs {
  gap: 4px;
}

.nav-group-header {
  color: #9fb0c2;
  font-size: 10px;
  letter-spacing: .11em;
  padding: 10px 12px 7px;
}

.nav-tab {
  min-height: 34px;
  border-radius: 7px;
  color: #eef5f8;
  font-size: 12px;
  font-weight: 750;
  padding: 0 11px;
}

.nav-sublevel {
  min-height: 29px;
  padding-left: 24px !important;
}

.nav-tab:hover {
  background: rgba(148, 163, 184, .12);
  border-color: rgba(148, 163, 184, .20);
}

.nav-tab.is-active,
.nav-submenu.is-open .nav-submenu-toggle {
  background: rgba(255, 255, 255, .12);
  border-color: rgba(148, 163, 184, .24);
  box-shadow: inset 3px 0 0 #2f6f73;
}

.metric-card,
.fleet-map-summary article,
.patio-card {
  border: 1px solid rgba(148, 163, 184, .26);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.94));
  box-shadow: 0 8px 22px rgba(15, 23, 42, .06);
}

.metric-card span,
.fleet-map-summary span {
  color: #64748b;
  font-size: 10px;
  letter-spacing: .06em;
}

.metric-card strong,
.fleet-map-summary strong {
  color: #0f172a;
  font-size: 19px;
}

.metric-card.critical {
  background: linear-gradient(180deg, #fff, #fff5f5);
  border-color: rgba(239, 68, 68, .32);
}

.metric-card.warning {
  background: linear-gradient(180deg, #fff, #fffbeb);
  border-color: rgba(245, 158, 11, .34);
}

.delivery-status-row {
  grid-template-columns: repeat(7, minmax(112px, 1fr));
}

.delivery-status-card {
  min-height: 48px;
  border-radius: 9px;
  padding: 8px 10px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, .10);
}

.delivery-status-card strong {
  font-size: 20px;
}

.delivery-status-card span {
  font-size: 9px;
}

.delivery-status-card.is-trip { background: linear-gradient(135deg, #5b2be0, #7c3aed); }
.delivery-status-card.is-ok { background: linear-gradient(135deg, #16a34a, #22c55e); }
.delivery-status-card.is-neutral { background: linear-gradient(135deg, #64748b, #94a3b8); }
.delivery-status-card.is-alert { background: linear-gradient(135deg, #f59e0b, #f97316); }
.delivery-status-card.is-danger { background: linear-gradient(135deg, #ef4444, #e11d48); }

#coletasEntregasView.is-active {
  grid-template-rows: auto auto 228px minmax(0, 1fr);
  min-height: 0;
  max-height: calc(100vh - 124px);
  overflow: hidden;
  padding-bottom: 6px;
}

.delivery-monitor-layout {
  grid-template-columns: minmax(0, 1fr) 320px;
}

.delivery-chart-panel {
  overflow: hidden;
}

.delivery-donut-row {
  min-height: 160px;
  height: calc(100% - 30px);
}

.delivery-donut-row > div {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  align-items: start;
  border-radius: 10px;
  background: #fff;
}

.delivery-chart-percent {
  justify-self: center;
  font-size: 24px;
  color: #0f172a;
  line-height: 1;
}

.delivery-donut-row small {
  justify-self: center;
  color: #64748b;
  font-size: 10px;
}

.delivery-grid-layout {
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
}

.delivery-notification-panel {
  display: none;
}

.delivery-grid-wrap {
  max-height: calc(100vh - 485px);
  min-height: 220px;
  padding-bottom: 46px;
}

.delivery-grid-wrap th,
.delivery-grid-wrap td {
  font-size: 10.5px;
  padding: 6px 7px;
}

.delivery-grid-wrap .transit-progress-cell {
  min-width: 150px;
}

#coletasEntregasView .grid-page-control {
  justify-content: flex-end;
  gap: 5px;
}

.tower-alert-layout {
  grid-template-columns: minmax(0, 1fr) minmax(300px, .72fr);
}

#controlTowerView .control-layout {
  margin-bottom: 8px;
}

#controlTowerView .control-map-panel,
#towerMapPanel {
  display: none !important;
}

#controlTowerView .control-metrics {
  gap: 8px;
  margin-bottom: 8px;
}

.logistic-status-card {
  min-height: 50px;
  border-radius: 9px;
}

.logistic-status-card.is-stop { background: linear-gradient(135deg, #f59e0b, #f97316); }
.logistic-status-card.is-purple { background: linear-gradient(135deg, #8b5cf6, #c026d3); }
.logistic-status-card.is-blue { background: linear-gradient(135deg, #2563eb, #06b6d4); }
.logistic-status-card.is-danger { background: linear-gradient(135deg, #ef4444, #e11d48); }
.logistic-status-card.is-green { background: linear-gradient(135deg, #22c55e, #14b8a6); }
.logistic-status-card.is-yellow { background: linear-gradient(135deg, #eab308, #f59e0b); }

@media (max-width: 1180px) {
  #coletasEntregasView.is-active {
    max-height: none;
    overflow: visible;
  }

  .delivery-monitor-layout,
  .tower-alert-layout {
    grid-template-columns: 1fr;
  }

  .delivery-grid-wrap {
    max-height: none;
  }
}

/* Monitor v2.9.69: grids com cabecalho fixo, rolagem interna e tabela ajustavel. */
body.delivery-monitor-active .main,
body:has(#coletasEntregasView.is-active) .main {
  overflow: visible;
  padding-top: 10px;
}

#coletasEntregasView.is-active {
  grid-template-rows: auto 44px 76px minmax(560px, auto) !important;
  min-height: calc(100vh - 88px) !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  gap: 5px !important;
  padding-bottom: 0;
}

#coletasEntregasView .delivery-monitor-topbar {
  min-height: 36px;
  padding: 4px 9px;
}

#coletasEntregasView .delivery-status-row {
  grid-template-columns: repeat(7, minmax(118px, 1fr)) !important;
  gap: 6px;
}

#coletasEntregasView .delivery-status-card {
  min-height: 44px !important;
  border-radius: 9px;
  padding: 6px 10px 6px 12px;
  color: #0f172a;
  background: #fff !important;
  border: 1px solid rgba(148, 163, 184, .28);
  border-left: 5px solid #64748b;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .07);
}

#coletasEntregasView .delivery-status-card::after {
  right: 9px;
  top: 10px;
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 8px;
  opacity: .14;
  background: currentColor;
}

#coletasEntregasView .delivery-status-card strong {
  color: #0f172a;
  font-size: 18px;
  font-weight: 850;
}

#coletasEntregasView .delivery-status-card span {
  color: #475569;
  font-size: 9.5px;
  letter-spacing: .02em;
}

#coletasEntregasView .delivery-status-card.is-trip {
  border-left-color: #4f46e5;
  color: #4f46e5;
}

#coletasEntregasView .delivery-status-card.is-ok {
  border-left-color: #0f9f6e;
  color: #0f9f6e;
}

#coletasEntregasView .delivery-status-card.is-neutral {
  border-left-color: #64748b;
  color: #64748b;
}

#coletasEntregasView .delivery-status-card.is-alert {
  border-left-color: #f59e0b;
  color: #f59e0b;
}

#coletasEntregasView .delivery-status-card.is-danger {
  border-left-color: #e11d48;
  color: #e11d48;
}

#coletasEntregasView .delivery-monitor-layout {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 0;
  overflow: visible;
}

#coletasEntregasView .delivery-chart-panel {
  min-height: 0;
  padding: 5px 9px !important;
  overflow: hidden;
}

#coletasEntregasView .delivery-chart-panel .panel-head {
  margin-bottom: 2px;
}

#coletasEntregasView .delivery-chart-panel .panel-head h2 {
  font-size: 13px;
}

#coletasEntregasView .delivery-chart-panel .panel-head small {
  font-size: 9px;
}

#coletasEntregasView .delivery-donut-row {
  min-height: 0 !important;
  height: calc(100% - 20px) !important;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 8px;
}

#coletasEntregasView .delivery-donut-row > div {
  grid-template-columns: auto auto 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 8px;
  padding: 4px 8px;
  overflow: hidden;
}

#coletasEntregasView .delivery-donut-row h3 {
  grid-column: 1 / span 2;
  font-size: 11px;
  margin-bottom: 0;
  text-align: left;
}

#coletasEntregasView .delivery-chart-percent {
  font-size: 18px;
  margin-top: 0;
  justify-self: start;
}

#coletasEntregasView .delivery-donut-row small {
  justify-self: start;
  font-size: 9px;
}

#coletasEntregasView .delivery-donut-row canvas {
  grid-row: 1 / span 2;
  grid-column: 3;
  justify-self: end;
  width: 70px !important;
  height: 48px !important;
  max-height: 48px;
}

#coletasEntregasView .delivery-grid-layout {
  min-height: 0;
  height: auto;
  overflow: visible;
}

#coletasEntregasView .delivery-table-panel {
  min-height: 560px;
  max-height: calc(100vh - 42px);
  display: grid;
  grid-template-rows: 30px minmax(0, 1fr) 40px;
  height: clamp(560px, calc(100vh - 176px), 820px);
  overflow: hidden;
  padding: 8px !important;
  resize: vertical;
}

#coletasEntregasView .delivery-table-panel .panel-head {
  margin-bottom: 4px;
}

#coletasEntregasView .delivery-table-panel .panel-head h2 {
  font-size: 14px;
}

#coletasEntregasView .delivery-grid-wrap {
  height: 100% !important;
  max-height: none !important;
  min-height: 455px !important;
  overflow: auto;
  padding-bottom: 0;
  overscroll-behavior: contain;
}

#coletasEntregasView .delivery-grid-wrap th,
#coletasEntregasView .delivery-grid-wrap td {
  font-size: 10.5px;
  padding: 5px 7px;
  line-height: 1.15;
  vertical-align: middle;
}

#coletasEntregasView .delivery-grid-wrap table {
  min-width: 1180px;
}

#coletasEntregasView .delivery-grid-wrap thead th {
  top: 0;
  z-index: 8;
}

#coletasEntregasView .grid-page-control {
  flex-shrink: 0;
  min-height: 36px;
  position: static !important;
  background: rgba(244, 246, 248, .98) !important;
}

.grid-page-size-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: 4px;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}

.grid-page-size-label select {
  min-height: 26px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text);
  padding: 0 7px;
  font-size: 11px;
}

@media (max-width: 1180px) {
  #coletasEntregasView.is-active {
    max-height: none !important;
    overflow: visible !important;
    grid-template-rows: auto !important;
  }

  #coletasEntregasView .delivery-status-row {
    grid-template-columns: repeat(2, minmax(130px, 1fr)) !important;
  }

  #coletasEntregasView .delivery-donut-row {
    grid-template-columns: 1fr;
    height: auto !important;
  }
}

/* Torre de Controle 2 - ambiente SLA executivo, leve e integrado ao tenant. */
#controlTower2View.is-active {
  display: block;
}

.tower2-shell {
  display: grid;
  gap: 12px;
}

.tower2-hero {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(520px, 1.2fr);
  gap: 16px;
  align-items: center;
  padding: 16px;
  border: 1px solid #d5e1ec;
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff 0%, #f4fbfa 48%, #edf5ff 100%);
  box-shadow: 0 16px 40px rgba(15, 35, 55, .08);
}

.tower2-eyebrow {
  display: inline-flex;
  margin-bottom: 4px;
  color: #0f766e;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.tower2-hero h2 {
  margin: 0;
  font-size: 26px;
}

.tower2-hero p {
  max-width: 780px;
  margin: 4px 0 0;
  color: #52647a;
}

.tower2-actions {
  display: grid;
  grid-template-columns: minmax(140px, .8fr) minmax(130px, .7fr) minmax(220px, 1.2fr) auto;
  gap: 8px;
}

.tower2-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.tower2-kpis article {
  min-height: 92px;
  padding: 14px;
  border: 1px solid #d8e3ef;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 35, 55, .06);
}

.tower2-kpis span,
.tower2-kpis small {
  display: block;
  color: #5d7188;
  font-size: 12px;
  font-weight: 800;
}

.tower2-kpis strong {
  display: block;
  margin: 4px 0;
  color: #132033;
  font-size: 32px;
  line-height: 1;
}

.tower2-grid {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(300px, 1fr) minmax(260px, .85fr);
  gap: 12px;
}

.tower2-card {
  min-height: 260px;
}

.tower2-donut-wrap {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

.tower2-donut {
  position: relative;
  display: grid;
  width: 162px;
  height: 162px;
  place-items: center;
  border-radius: 50%;
}

.tower2-donut::after {
  position: absolute;
  inset: 34px;
  border-radius: 50%;
  background: #fff;
  content: "";
}

.tower2-donut strong,
.tower2-donut span {
  position: relative;
  z-index: 1;
}

.tower2-donut strong {
  font-size: 30px;
}

.tower2-donut span {
  margin-top: 34px;
  color: #61738a;
  font-size: 11px;
  font-weight: 800;
}

.tower2-legend,
.tower2-bars,
.tower2-reasons {
  display: grid;
  gap: 8px;
}

.tower2-legend span {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #405166;
}

.tower2-legend i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.tower2-legend .ok { background: #57998a; }
.tower2-legend .late { background: #cd7982; }
.tower2-legend .progress { background: #9a8ab7; }

.tower2-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, .8fr) 44px;
  gap: 10px;
  align-items: center;
  padding: 9px;
  border: 1px solid #e5edf5;
  border-radius: 8px;
  background: #fbfdff;
}

.tower2-bar-row strong,
.tower2-reason-row strong {
  display: block;
  overflow-wrap: anywhere;
}

.tower2-bar-row span,
.tower2-reason-row span {
  color: #63758b;
  font-size: 12px;
}

.tower2-meter {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #e7edf4;
}

.tower2-meter span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #6b9e99;
}

.tower2-reason-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border: 1px solid #e5edf5;
  border-radius: 8px;
  background: #fbfdff;
}

.tower2-table-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 520px;
  max-height: min(72vh, 820px);
  resize: vertical;
  overflow: hidden;
}

.tower2-table-wrap {
  min-height: 430px;
  max-height: none;
  overflow: auto;
}

.tower2-table-wrap table {
  min-width: 1180px;
}

.tower2-table-wrap thead th {
  position: sticky;
  top: 0;
  z-index: 8;
}

@media (max-width: 1180px) {
  .tower2-hero,
  .tower2-grid {
    grid-template-columns: 1fr;
  }
  .tower2-actions,
  .tower2-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Torre 2 v2.9.69 - proporcao alinhada ao ambiente SLA de referencia. */
.tower2-shell {
  gap: 10px;
}

.tower2-hero {
  grid-template-columns: minmax(220px, .7fr) minmax(560px, 1.3fr);
  padding: 10px 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 35, 55, .06);
}

.tower2-hero h2 {
  font-size: 21px;
}

.tower2-hero p {
  max-width: 620px;
  font-size: 12px;
  line-height: 1.3;
}

.tower2-actions select,
.tower2-actions input,
.tower2-actions button {
  min-height: 34px;
  font-size: 12px;
}

.tower2-kpis {
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 8px;
}

.tower2-kpis article {
  min-height: 72px;
  padding: 10px 12px;
  border-left: 5px solid #0f766e;
}

.tower2-kpis article:nth-child(2) { border-left-color: #2563eb; }
.tower2-kpis article:nth-child(3) { border-left-color: #dc2626; }
.tower2-kpis article:nth-child(4) { border-left-color: #7c3aed; }

.tower2-kpis strong {
  font-size: 27px;
}

.tower2-grid {
  grid-template-columns: minmax(280px, .8fr) minmax(320px, 1fr) minmax(280px, .85fr);
}

.tower2-card {
  min-height: 230px;
  padding: 14px;
}

/* v2.9.69: navegacao operacional integrada e area util priorizada. */
.operational-module-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 34px;
  padding: 3px;
  overflow-x: auto;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 8px;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 5px 16px rgba(15, 23, 42, .05);
  scrollbar-width: thin;
}

.operational-module-nav button {
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #52637a;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
  cursor: pointer;
}

.operational-module-nav button:hover {
  border-color: #cad7e3;
  background: #f4f7fa;
  color: #102b3a;
}

.operational-module-nav button.is-current {
  border-color: #175f62;
  background: #175f62;
  color: #fff;
  cursor: default;
}

#coletasEntregasView.is-active {
  grid-template-rows: 34px auto auto auto minmax(560px, auto) !important;
}

#transitTimeView.is-active {
  grid-template-rows: 34px auto auto auto minmax(520px, 1fr) !important;
}

#trackingView.is-active {
  grid-template-rows: 34px auto auto minmax(560px, 1fr) !important;
}

#trackingView .tracking-grid-wrap,
#transitTimeView .transit-grid-wrap {
  min-height: 480px;
  overscroll-behavior: contain;
}

#trackingView .tracking-grid-wrap thead th,
#transitTimeView .transit-grid-wrap thead th,
#coletasEntregasView .delivery-grid-wrap thead th {
  position: sticky;
  top: 0;
  z-index: 9;
  background: #f3f7fa;
  box-shadow: inset 0 -1px 0 #cbd7e2;
}

@media (max-width: 760px) {
  .operational-module-nav {
    justify-content: flex-start;
  }

  #coletasEntregasView.is-active,
  #transitTimeView.is-active,
  #trackingView.is-active {
    grid-template-rows: auto !important;
  }
}

.tower2-donut {
  width: 138px;
  height: 138px;
}

.tower2-donut::after {
  inset: 29px;
}

.tower2-donut strong {
  font-size: 26px;
}

.tower2-donut-wrap {
  grid-template-columns: 146px minmax(0, 1fr);
}

.tower2-table-panel {
  min-height: 560px;
  max-height: min(76vh, 860px);
}

.tower2-table-wrap {
  min-height: 470px;
}

/* v2.9.70: integração operacional, seleção em lote e administração segura. */
.trip-grid-delete:disabled,
#importTrafegusTripsBtn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

[data-trip-grid-select],
[data-select-all-trips],
[data-trafegus-trip-select],
#checkAllTrafegusTrips {
  width: 16px;
  height: 16px;
  accent-color: #0f766e;
  cursor: pointer;
}

.trafegus-trip-panel .panel-head {
  align-items: flex-end;
}

.trafegus-trip-grid {
  max-height: 440px;
  overscroll-behavior: contain;
}

.trafegus-trip-grid thead th {
  position: sticky;
  top: 0;
  z-index: 8;
  background: #f3f7fa;
}

.admin-cleanup-panel {
  max-width: 1100px;
}

.generic-grid-selection {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
}

.generic-grid-selection label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
}

.generic-grid-checkbox {
  width: 16px;
  height: 16px;
  margin-right: 9px;
  vertical-align: middle;
  accent-color: #0f766e;
}

.app-shell.menu-top .sidebar {
  flex-wrap: wrap;
  overflow: visible;
}

.app-shell.menu-top .brand {
  min-width: 170px;
  padding: 4px 8px;
  border: 0;
}

.app-shell.menu-top .nav-tabs {
  flex-wrap: wrap;
  justify-content: flex-start;
  overflow: visible;
}

.app-shell.menu-top .nav-group-header {
  font-size: 10px;
  letter-spacing: 0;
}

.app-shell.menu-top .nav-submenu-items {
  position: static;
  min-width: 0;
  box-shadow: none;
  border: 0;
  padding: 2px 0 2px 10px;
}

.app-shell.menu-top .nav-group-menu::before {
  content: '';
  position: absolute;
  top: -6px;
  left: 0;
  right: 0;
  height: 6px;
}

.app-shell.menu-top .nav-group-menu { top:100%; }
.position-evidence-dialog { width:min(1320px,96vw); max-height:94dvh; padding:0; overflow:auto; border:1px solid #dce4eb; border-radius:8px; color:#223843; background:#fff; box-shadow:0 20px 70px #102a3a30; }
.position-evidence-dialog::backdrop { background:#102a3a66; }
.position-evidence-dialog button { cursor:pointer; padding:6px 10px; border:1px solid #d8e3e9; border-radius:5px; color:#294c5e; background:#fff; font:inherit; font-size:11px; box-shadow:none; }
.position-evidence-dialog button:hover { background:#f0f5f8; border-color:#9aafbb; }
.position-evidence-dialog button:disabled { opacity:.45; cursor:default; }
.position-evidence-dialog td button { padding:3px 0; border:0; color:#176b96; background:transparent; text-align:left; }
.position-evidence-dialog a { color:#176b96; }
.position-evidence-dialog h2 { font-size:15px; margin:0; }
#positionEvidenceHint { margin:0; padding:10px 16px; font-size:11px; color:#64748b; border-bottom:1px solid #e2e8f0; }
.position-evidence-workspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.8fr); min-height:540px; }
#positionEvidenceMap { min-height:540px; }
.position-evidence-records { min-width:0; padding:12px; }
.position-evidence-records .table-wrap { height:360px; overflow:auto; }
.position-evidence-records th { position:sticky; top:0; z-index:2; background:#f5f7fa; }
.position-evidence-records table { min-width:480px; font-size:11px; }
.position-evidence-records td small { display:block; font-size:10px; color:#64748b; }
.position-evidence-pager { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-top:10px; }
#positionEvidenceTargets { max-height:140px; overflow:auto; }
#positionEvidenceTargets div { padding:6px 0; border-bottom:1px solid #e2e8f0; }
#positionEvidenceTargets span { display:block; font-size:11px; color:#64748b; }
.telemetry-driver > strong { display:block; font-size:12px; }
.telemetry-driver-meta { display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; margin-top:4px; }
.telemetry-driver-meta .telemetry-last-event { margin:0; }
.view .telemetry-driver-meta .telemetry-location-button { font-size:10px; min-height:20px; padding:2px 5px; margin:0; color:#b42332; background:#fff3f4; border:0; border-radius:4px; box-shadow:none; }
body[data-theme="dark"] .position-evidence-records th { background:#18252d; }
body[data-theme="dark"] .position-evidence-dialog { color:#d7e1e8; background:#1e242c; border-color:#384650; }
body[data-theme="dark"] .position-evidence-dialog button { color:#c9dce7; background:#25343e; border-color:#42535f; }
@media(max-width:759px) { .position-evidence-workspace { grid-template-columns:minmax(0,1fr); } #positionEvidenceMap { height:320px; min-height:320px; } }

#coletasEntregasView .delivery-donut-row canvas {
  width: 80px !important;
  height: 80px !important;
  max-height: 80px;
}

#coletasEntregasView .delivery-chart-panel {
  min-height: 140px;
  overflow: visible;
}

#coletasEntregasView .delivery-table-panel {
  min-height: 660px;
  height: clamp(660px, calc(100vh - 140px), 880px);
  grid-template-rows: 40px minmax(560px, 1fr) 40px;
}

#coletasEntregasView .delivery-grid-wrap {
  min-height: 560px !important;
}

#coletasEntregasView .delivery-grid-wrap tbody > tr:not(.tracking-detail-row) {
  height: 48px;
}

.app-shell.menu-top .nav-group:last-child .nav-group-menu {
  left: auto;
  right: 0;
}

/* v2.9.71: operação unificada, com área de trabalho e indicadores legíveis. */
.main {
  background: #f3f6f8;
}

.topbar {
  background: transparent;
  box-shadow: none;
  border: 0;
  padding: 14px 0 18px;
}

.topbar h1 {
  font-size: 24px;
  font-weight: 750;
  color: #192a35;
}

.operational-module-nav {
  border: 0;
  border-bottom: 1px solid #d6e0e6;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  min-height: 44px;
  gap: 10px;
}

.operational-module-nav button {
  min-height: 38px;
  border-radius: 4px;
  padding: 0 12px;
  font-size: 12px;
}

.operational-module-nav button.is-current {
  background: #e5eef1;
  color: #135e69;
  border-color: transparent;
  box-shadow: inset 0 -3px 0 #167b85;
}

.operational-module-nav .operational-sync-button {
  margin-left: auto;
  color: #167482;
  border: 1px solid #bfdae0;
  background: #fff;
}

.table-toolbar,
.delivery-monitor-topbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  min-height: 76px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #dbe5eb;
  border-radius: 8px;
  box-shadow: none;
}

.tracking-summary-toolbar > div:first-child,
.transit-summary-toolbar > div:first-child,
.delivery-monitor-topbar > div:first-child {
  flex: 1 1 240px;
  min-width: 0;
}

.tracking-summary-toolbar strong,
.transit-summary-toolbar strong,
.delivery-monitor-topbar strong {
  display: block;
  font-size: 18px;
  line-height: 1.4;
}

.tracking-summary-toolbar small,
.transit-summary-toolbar small,
.delivery-monitor-topbar small {
  display: block;
  margin-top: 5px;
  color: #69808d;
  font-size: 11px;
  line-height: 1.4;
  max-width: 540px;
  overflow-wrap: anywhere;
}

.tracking-summary-toolbar .inline-actions,
.transit-summary-toolbar .inline-actions,
.delivery-monitor-topbar .inline-actions {
  flex: 2 1 570px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.inline-actions input[type='search'] {
  min-width: 180px;
  flex: 1 1 190px;
}

.metric-card,
.tower2-kpis article {
  min-height: 112px;
  padding: 18px;
  background: #fff;
  border: 1px solid #dce5ea;
  border-top: 3px solid #167b85;
  border-left: 1px solid #dce5ea !important;
  border-radius: 8px;
  box-shadow: 0 3px 10px rgba(28, 49, 60, .035);
}

.metric-card strong,
.tower2-kpis strong {
  font-size: 32px;
  line-height: 1.2;
  margin: 8px 0;
  color: #18313e;
}

.metric-card span,
.tower2-kpis span {
  color: #647b87;
  font-size: 12px;
  font-weight: 650;
}

.metric-card:nth-child(2), .tower2-kpis article:nth-child(2) { border-top-color: #398464; }
.metric-card:nth-child(3), .tower2-kpis article:nth-child(3) { border-top-color: #d15e68; }
.metric-card:nth-child(4), .tower2-kpis article:nth-child(4) { border-top-color: #4c72ac; }

#coletasEntregasView.is-active {
  display: block !important;
  height: auto !important;
  overflow: visible !important;
}

#coletasEntregasView .delivery-monitor-shell {
  display: grid;
  grid-template-rows: auto auto auto auto auto !important;
  height: auto !important;
  gap: 16px;
  overflow: visible;
}

#coletasEntregasView .delivery-status-row {
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
}

#coletasEntregasView .delivery-status-card {
  min-height: 108px;
  padding: 16px !important;
  border: 1px solid #d9e4e9 !important;
  border-radius: 8px;
  background: #fff !important;
  box-shadow: none;
  overflow: visible;
}

#coletasEntregasView .delivery-status-card::before,
#coletasEntregasView .delivery-status-card::after { display: none; }

#coletasEntregasView .delivery-status-card strong {
  font-size: 30px;
  font-weight: 750;
  margin-bottom: 10px;
}

#coletasEntregasView .delivery-status-card span {
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.45;
}

#coletasEntregasView .delivery-status-card.is-trip { color: #267c8a; background: #edf6f8 !important; }
#coletasEntregasView .delivery-status-card.is-ok { color: #338260; background: #eff7f2 !important; }
#coletasEntregasView .delivery-status-card.is-neutral { color: #526c7b; }
#coletasEntregasView .delivery-status-card.is-alert { color: #ad7b28; background: #fffaf0 !important; }
#coletasEntregasView .delivery-status-card.is-danger { color: #bb5863; background: #fff3f4 !important; }

#coletasEntregasView .delivery-chart-panel {
  min-height: 185px;
  padding: 16px !important;
  border-radius: 8px;
}

#coletasEntregasView .delivery-chart-panel .panel-head h2 { font-size: 16px; }
#coletasEntregasView .delivery-chart-panel .panel-head small { font-size: 11px; }
#coletasEntregasView .delivery-donut-row { height: auto !important; min-height: 126px !important; }
#coletasEntregasView .delivery-donut-row > div {
  padding: 14px 18px;
  border: 0;
  border-right: 1px solid #dbe5ea;
  border-radius: 0;
}
#coletasEntregasView .delivery-donut-row > div:last-child { border-right: 0; }
#coletasEntregasView .delivery-chart-percent { font-size: 32px; }
#coletasEntregasView .delivery-donut-row h3 { font-size: 14px; }
#coletasEntregasView .delivery-donut-row canvas { width: 110px !important; height: 110px !important; max-height: 110px; }

.trip-history-grid {
  min-height: 520px;
  max-height: 720px;
  overflow: auto;
  resize: vertical;
}

.table-wrap thead th {
  background: #eef4f7;
  color: #4f6977;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  white-space: nowrap;
}

.table-wrap tbody tr:not(.tracking-detail-row):hover { background: #f0f7f8; }
.table-wrap td { border-bottom-color: #e5edf1; }
.row-actions button { border-radius: 5px; padding: 5px 9px; background: #f5f8fa; color: #3e6575; }

.trip-saved-dialog {
  width: min(440px, 94vw);
  padding: 28px;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  box-shadow: 0 18px 70px rgba(24, 45, 58, .2);
}
.trip-saved-dialog::backdrop { background: rgba(19, 36, 49, .38); }
.trip-saved-dialog h2 { font-size: 21px; margin: 18px 0 8px; }
.trip-saved-dialog p { color: #657d89; margin-bottom: 24px; }
.saved-confirmation-mark { width: 44px; height: 44px; border-radius: 50%; background: #e1f3eb; color: #23805a; display: grid; place-items: center; font-size: 25px; }

body, button, input, select, textarea { font-family: Arial, sans-serif; }

#coletasEntregasView .delivery-table-panel .panel-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  margin: 0;
}

.grid-compact-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 180px;
  line-height: 1.3;
}

#coletasEntregasView .delivery-grid-wrap table { min-width: 1480px; table-layout: fixed; }
#coletasEntregasView .delivery-grid-wrap th:first-child { width: 38px; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(4) { width: 92px; }
#coletasEntregasView .delivery-grid-wrap td:nth-child(4) { white-space: nowrap; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(5) { width: 150px; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(6) { width: 165px; }
#coletasEntregasView .delivery-grid-wrap th:last-child { width: 170px; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(3) { width: 150px; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(11) { width: 160px; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(12) { width: 110px; }
#coletasEntregasView .delivery-grid-wrap th:nth-child(13) { width: 180px; }
#coletasEntregasView .delivery-grid-wrap .row-actions button { white-space: nowrap; }
#coletasEntregasView .delivery-grid-wrap small { display: block; font-size: 9px; }

@media (max-width: 760px) {
  .tracking-summary-toolbar .inline-actions,
  .transit-summary-toolbar .inline-actions,
  .delivery-monitor-topbar .inline-actions { flex-basis: 100%; }
  #coletasEntregasView .delivery-donut-row { grid-template-columns: 1fr; }
  #coletasEntregasView .delivery-donut-row > div { border: 0; border-bottom: 1px solid #dbe5ea; }
  #coletasEntregasView .delivery-donut-row > div { grid-template-columns: minmax(0, 1fr) 110px; grid-template-rows: auto auto auto; }
  #coletasEntregasView .delivery-donut-row h3,
  #coletasEntregasView .delivery-donut-row strong,
  #coletasEntregasView .delivery-donut-row small { grid-column: 1; }
  #coletasEntregasView .delivery-donut-row canvas { grid-column: 2; grid-row: 1 / span 3; }
  #coletasEntregasView .delivery-table-panel .panel-head { height: auto; min-height: 60px; flex-wrap: wrap; }
  #coletasEntregasView .delivery-table-panel { height: auto; max-height: none; grid-template-rows: auto minmax(560px, 1fr) auto; }
  .grid-page-control { flex-wrap: wrap; min-height: 44px; height: auto; gap: 6px; }
}

.admin-cleanup-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
  margin-top: 16px;
}

/* Operational themes share layout; only colors and contrast change. */
body[data-theme="light"] { --bg: #f3f6f4; --surface: #fff; --surface-2: #edf3ef; --text: #19382f; --muted: #61766d; --line: #dce6df; }
body[data-theme="light"], body[data-theme="light"] .main { background: #f3f6f4; }
body[data-theme="light"] .sidebar,
body[data-theme="light"] .app-shell.menu-top .sidebar { background: #fff !important; color: #254f40 !important; border-color: #dbe6df; }
body[data-theme="light"] .sidebar .brand,
body[data-theme="light"] .sidebar .brand-subtitle,
body[data-theme="light"] .sidebar .nav-tab,
body[data-theme="light"] .sidebar .nav-group-header,
body[data-theme="light"] .sidebar-footer { color: #295343 !important; text-shadow: none; }
body[data-theme="light"] .nav-group-header { background: transparent !important; border: 0; }
body[data-theme="light"] .sidebar .nav-tab:hover,
body[data-theme="light"] .sidebar .nav-tab.is-active { background: #e7f2eb !important; color: #145c46 !important; border-color: #c8dfd2 !important; }
body[data-theme="light"] .app-shell .nav-group-menu { background: rgba(255,255,255,.94) !important; border-color: #dce6df; box-shadow: 0 12px 30px rgba(29,64,45,.1); }
.theme-control { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; font-size: 12px; color: var(--text); }
[hidden] { display: none !important; }
body[data-theme="light"] .logout-button { color: #295343; background: #edf4ef; border-color: #d3e2d8; }
body[data-theme="light"] .sidebar .brand-subtitle { color: #61796c !important; }
.theme-control input { width: 16px; height: 16px; accent-color: #19664f; }
.trip-map-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; padding: 16px 0; }
.trip-map-metrics div { border-left: 3px solid #277b62; padding-left: 12px; }
.trip-map-metrics span { display: block; font-size: 11px; color: var(--muted); margin-bottom: 6px; }
.trip-map-metrics strong { font-size: 17px; }
.deadline-rankings { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; padding: 24px 0; }
.deadline-rankings h2 { font-size: 16px; margin: 0 0 12px; }
.deadline-rankings .table-wrap { background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }
#selectedTripMapHint { font-size: 12px; line-height: 1.6; color: var(--muted); margin: 8px 0; }
body[data-theme="dark"] { --bg: #101b18; --surface: #192823; --surface-2: #22372f; --text: #e0ece6; --muted: #a6bfb2; --line: #365043; --shadow: 0 8px 24px rgba(0,0,0,.15); color-scheme: dark; }
body[data-theme="dark"], body[data-theme="dark"] .main { background: #101b18 !important; color: #e0ece6; }
body[data-theme="dark"] .sidebar,
body[data-theme="dark"] .app-shell.menu-top .sidebar { background: #122b21 !important; }
body[data-theme="dark"] .app-shell .nav-group-menu { background: rgba(19,44,33,.95) !important; }
body[data-theme="dark"] .panel,
body[data-theme="dark"] .metric-card,
body[data-theme="dark"] .delivery-kpi,
body[data-theme="dark"] .delivery-monitor-kpis article,
body[data-theme="dark"] .tower2-kpis article,
body[data-theme="dark"] .table-wrap,
body[data-theme="dark"] .tracking-summary-toolbar,
body[data-theme="dark"] .transit-summary-toolbar,
body[data-theme="dark"] .delivery-monitor-topbar,
body[data-theme="dark"] .delivery-table-panel,
body[data-theme="dark"] .delivery-donut-row > div,
body[data-theme="dark"] dialog,
body[data-theme="dark"] .view-header { background: #192823 !important; color: #e0ece6 !important; border-color: #365043 !important; }
body[data-theme="dark"] input,
body[data-theme="dark"] select,
body[data-theme="dark"] textarea { background: #10251b !important; color: #e0ece6 !important; border-color: #456452 !important; }
body[data-theme="dark"] .table-wrap th,
body[data-theme="dark"] .grid-page-control,
body[data-theme="dark"] .row-actions button { background: #253c30 !important; color: #deebe3 !important; border-color: #456452; }
body[data-theme="dark"] td,
body[data-theme="dark"] strong,
body[data-theme="dark"] h1,
body[data-theme="dark"] h2,
body[data-theme="dark"] h3 { color: #e0ece6; }
body[data-theme="dark"] .table-wrap tbody tr:hover { background: #294837 !important; }
body[data-theme="dark"] small,
body[data-theme="dark"] .muted { color: #b0c8bb !important; }
body[data-theme="dark"] .operational-module-nav button { color: #c9ddd0; }
body[data-theme="dark"] .operational-module-nav button.is-current { background: #24523a; }
body[data-theme="dark"] .operational-module-nav button { background: transparent !important; color: #c9ddd0 !important; }
body[data-theme="dark"] .operational-module-nav button.is-current { background: #24523a !important; }
body[data-theme="dark"] #coletasEntregasView .delivery-status-card,
body[data-theme="dark"] #coletasEntregasView .delivery-status-card.is-trip,
body[data-theme="dark"] #coletasEntregasView .delivery-status-card.is-ok,
body[data-theme="dark"] #coletasEntregasView .delivery-status-card.is-alert,
body[data-theme="dark"] #coletasEntregasView .delivery-status-card.is-danger { background: #203b2d !important; border-color: #3a5d48 !important; }
body[data-theme="dark"] #coletasEntregasView .delivery-status-card.is-alert { background: #403923 !important; }
body[data-theme="dark"] #coletasEntregasView .delivery-status-card.is-danger { background: #40272b !important; }
body[data-theme="dark"] #coletasEntregasView .delivery-status-card strong,
body[data-theme="dark"] #coletasEntregasView .delivery-status-card span { color: #e2eee5 !important; }
body[data-theme="dark"] #coletasEntregasView .grid-page-control { background: #243d2f !important; }
body[data-theme="dark"] .grid-page-control span,
body[data-theme="dark"] .grid-page-control label { color: #c4d9cb !important; }
body[data-theme="dark"] .tower2-hero,
body[data-theme="dark"] .tower2-bar-row { background: #192823 !important; border-color: #365043 !important; }
@media (max-width: 760px) { .deadline-rankings { grid-template-columns: 1fr; } .trip-map-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } }

.trip-inspection-dialog, .trip-map-dialog {
  width: min(1100px, 94vw);
  max-height: 92vh;
  overflow: auto;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  padding: 24px;
}
.trip-inspection-dialog::backdrop, .trip-map-dialog::backdrop { background: rgba(16, 32, 42, .45); }
.trip-inspection-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px; margin: 24px 0; }
.trip-inspection-fields dt { color: #617984; font-size: 12px; margin-bottom: 5px; }
.trip-inspection-fields dd { margin: 0; overflow-wrap: anywhere; }
#selectedTripMap { height: 520px; min-height: 360px; width: 100%; }
#selectedTripMapStops { padding-left: 0; list-style: none; }
#selectedTripMapStops li { padding: 8px 0; border-bottom: 1px solid #e4ecf1; }
.performance-grid { min-height: 160px; max-height: 480px; overflow: auto; }
.performance-grid table { min-width: 680px; }
#telemetriaView > h2 { font-size: 17px; margin-top: 28px; }
@media (max-width: 700px) { #selectedTripMap { height: 420px; } }

.app-shell .nav-group-menu {
  background: rgba(11, 36, 50, .88);
  backdrop-filter: blur(12px);
}
.app-shell.menu-top .nav-group-menu { background: rgba(11, 36, 50, .88); }
.deadline-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:8px 0; }
.hub-overview { display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; padding:10px 0; border-bottom:1px solid var(--line); font-size:12px; }
.hub-overview b { font-size:16px; }
.hub-tabs { display:flex; flex-wrap:wrap; gap:4px; padding:8px 0; }
.hub-tabs button,.hub-pager button,#journeyHubsView button,.hub-editor button { border:1px solid var(--line); background:var(--surface); color:var(--text); border-radius:4px; padding:6px 9px; cursor:pointer; font-size:12px; }
#journeyHubsView .hub-tabs button[aria-pressed="true"] { background:var(--accent,#167e7a); color:white; border-color:var(--accent,#167e7a); }
.hub-pager { display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:flex-end; margin:0; padding:6px 8px; border:1px solid var(--line); }
.hub-pager select { padding:4px; background:var(--surface); color:var(--text); border:1px solid var(--line); }
.hub-data-grid { min-height:0; max-height:570px; overflow:auto; margin-bottom:0!important; }
.hub-data-grid th { position:sticky; top:0; z-index:2; background:var(--surface); }
.hub-data-grid table { min-width:1020px; }
.hub-editor { width:520px; max-width:calc(100vw - 32px); padding:18px; border:1px solid var(--line); border-radius:8px; background:var(--surface); color:var(--text); }
.hub-editor header,.hub-editor footer { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.hub-editor h2 { font-size:17px; }
.hub-editor label { display:grid; gap:5px; margin:12px 0; font-size:12px; }
.hub-editor input,.hub-editor select,.hub-editor textarea { width:100%; min-width:0; padding:8px; border:1px solid var(--line); background:var(--surface); color:var(--text); border-radius:4px; }
#trafegusFallbackModeField span { display:flex; align-items:center; gap:8px; }
#trafegusFallbackModeField input { width:16px; height:16px; min-height:16px; flex:0 0 16px; }
.deadline-card { text-align:left; border:1px solid var(--line); background:var(--surface); color:var(--text); border-radius:6px; padding:8px 12px; cursor:pointer; }
.deadline-card span,.deadline-card small { display:block; font-size:11px; color:var(--muted); }
.deadline-card strong { display:block; font-size:22px; line-height:1.3; }
.deadline-card strong small { display:inline; font-size:13px; }
.deadline-card.ok { border-left:3px solid #159568; }
.deadline-card.late { border-left:3px solid #d54b57; }
.deadline-card[aria-pressed="true"] { outline:2px solid var(--accent); }
#departureMetrics strong small { font-size:12px; font-weight:500; }
#controlTowerView .metric-card,#controlTower2View .metric-card,#controlTowerView .control-metrics .metric,#controlTower2View .tower2-kpis article { min-height:58px!important; padding:7px 10px!important; }
#journeyHubsView td button { border:1px solid var(--line); border-radius:4px; background:var(--surface); color:var(--text); padding:5px 8px; cursor:pointer; }
#controlTowerView .metric-card strong,#controlTower2View .metric-card strong { font-size:22px!important; }
#trackingView .tracking-kpi-grid { align-items:start; grid-auto-rows:min-content; }
@media(max-width:600px){.deadline-card-grid,#trackingView .tracking-kpi-grid{grid-template-columns:1fr!important;}}
.app-shell .nav-group.menu-dismissed > .nav-group-menu { display: none !important; }
.app-shell:not(.menu-top) .nav-group.is-open > .nav-group-menu {
  display: flex;
  flex-direction: column;
  padding: 6px;
  border-radius: 6px;
}

#trackingView .metric-card,
#trackingView .tracking-kpi-grid .metric-card,
#transitTimeView .metric-card { min-height: 64px !important; padding: 8px 12px !important; display:grid!important; grid-template-columns:minmax(0,1fr) auto; gap:3px 10px!important; align-content:center; }
#trackingView .metric-card strong,#transitTimeView .metric-card strong { grid-column:2; grid-row:1 / 3; align-self:center; margin:0!important; }
#trackingView .metric-card span,#transitTimeView .metric-card span { margin:0!important; }
#trackingView .metric-card small,#transitTimeView .metric-card small { margin:0!important; }
#trackingView .metric-card span,
#trackingView .tracking-kpi-grid .metric-card span,
#transitTimeView .metric-card span { font-size: 11px !important; }
#trackingView .metric-card strong,
#trackingView .tracking-kpi-grid .metric-card strong,
#transitTimeView .metric-card strong { font-size: 22px !important; line-height: 1.2; }
#trackingView .metric-card small,
#transitTimeView .metric-card small { display: block !important; font-size: 10px !important; }
#transitTimeView .transit-chart-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); }
#transitTimeView .transit-chart-card { min-height: 240px; padding: 16px !important; }
#transitTimeView .transit-chart-card h2 { font-size: 14px !important; }
#transitTimeView .table-wrap table { min-width: 2100px; }
#trackingView .table-wrap table { min-width: 1700px; }
#transitTimeView .table-wrap td,
#trackingView .table-wrap td { white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
#trackingView .table-wrap td.trip-actions-cell,
#transitTimeView .table-wrap td.trip-actions-cell { position:sticky; right:0; z-index:2; width:240px; min-width:240px; max-width:none; overflow:visible; white-space:normal; background:var(--surface); border-left:1px solid var(--line); }
#trackingView .trip-actions-cell .row-actions,
#transitTimeView .trip-actions-cell .row-actions { display:flex; flex-wrap:wrap; gap:4px; }
#transitTimeView .table-wrap .row-actions button,
#trackingView .table-wrap .row-actions button { white-space: nowrap; }
#transitTimeView .transit-chart,
#transitTimeView .transit-chart-card:first-child .transit-chart { height: 180px !important; }

@media (max-width: 1079px) {
  .app-shell:not(.mobile-menu-open) .sidebar nav,
  .app-shell:not(.mobile-menu-open) .sidebar-footer { display: none !important; }
  .sidebar { min-height: 0 !important; height: auto !important; }
}
@media (max-width: 760px) {
  #transitTimeView .transit-chart-grid { grid-template-columns: 1fr; }
}

.admin-cleanup-option {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 12px;
  border: 1px solid #d8e1e8;
  border-radius: 8px;
  background: #f8fafb;
  cursor: pointer;
}

.admin-cleanup-option:has(input:checked) {
  border-color: #b42318;
  background: #fff5f4;
}

.admin-cleanup-option input {
  width: 18px;
  height: 18px;
  accent-color: #b42318;
}

.admin-cleanup-option span,
.admin-cleanup-option strong,
.admin-cleanup-option small {
  display: block;
}

.admin-cleanup-option small {
  margin-top: 4px;
  color: #64748b;
}

.admin-cleanup-confirm {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid #d8e1e8;
}

.admin-cleanup-confirm label span {
  display: block;
  margin-bottom: 5px;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.admin-cleanup-confirm input {
  min-height: 38px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  padding: 0 10px;
}

@media (max-width: 1079px) {
  .nav-group-menu {
    display: contents;
  }
}

@media (max-width: 700px) {
  .admin-cleanup-confirm {
    align-items: stretch;
    flex-direction: column;
  }
}

/* v2.9.75: navigation must remain above Leaflet and preserve readable contrast. */
.app-shell .sidebar { position: sticky; top: 0; z-index: 2200; align-self: start; }
.app-shell:not(.menu-top) .sidebar { height: 100dvh; overflow-y: auto; }
.app-shell.menu-top .sidebar, .app-shell.menu-top .nav-tabs { overflow: visible !important; }
.app-shell.menu-top .nav-tabs { min-width: 0; flex-wrap: wrap; }
.app-shell .nav-group-menu { z-index: 2300; }
.fleet-map-layout, #fleetMap { isolation: isolate; position: relative; z-index: 0; }
.map-fullscreen-css { top: var(--expanded-map-top,0px) !important; left: var(--expanded-map-left,0px) !important; width: calc(100vw - var(--expanded-map-left,0px)) !important; height: calc(100dvh - var(--expanded-map-top,0px)) !important; z-index: 1500 !important; }
body[data-theme="light"] .app-shell.menu-top .sidebar { background: #edf4f1 !important; border-color: #d9e5df; box-shadow:0 2px 8px rgba(40,65,56,.04); }
body[data-theme="light"] .app-shell.menu-top .brand strong { color: #203f37 !important; font-size: 20px; font-weight: 700; }
body[data-theme="light"] .app-shell.menu-top .brand span { color: #58706a !important; }
body[data-theme="light"] .app-shell.menu-top .nav-group-header,
body[data-theme="light"] .app-shell.menu-top .sidebar-footer,
body[data-theme="light"] .app-shell.menu-top .user-badge { color: #36574e !important; }
body[data-theme="light"] .app-shell .nav-group-menu,
body[data-theme="light"] .app-shell .nav-submenu-items { background: #f6faf7 !important; color: #254638 !important; }
body[data-theme="light"] .app-shell .nav-group-menu .nav-tab,
body[data-theme="light"] .app-shell .nav-submenu-items .nav-tab { background: transparent !important; color: #254638 !important; }
body[data-theme="light"] .sidebar .brand span { color: #506c5b; }
.filters { grid-template-columns: minmax(180px,1.5fr) repeat(5,minmax(130px,1fr)) auto; }
.table-wrap td { overflow-wrap: normal; word-break: normal; border-bottom-color: var(--line); }
.table-wrap .pill { white-space: nowrap !important; overflow-wrap: normal !important; }
#historicoViagensView table { min-width: 1580px; table-layout: auto; }
#tripHistoryTable td:nth-child(3), #tripHistoryTable td:nth-child(8) { white-space: nowrap; min-width: 130px; }
#tripHistoryTable td:nth-child(9) { min-width: 130px; }
body[data-theme="dark"] { --bg:#14181d; --surface:#1e242c; --surface-2:#282f38; --text:#e4e9ee; --muted:#b1bcc8; --line:#39434f; }
body[data-theme="dark"], body[data-theme="dark"] .main { background:#14181d !important; color:#e4e9ee; }
body[data-theme="dark"] .app-shell .sidebar { background:#293940 !important; }
body[data-theme="dark"] .sidebar .brand strong { color:#fff !important; font-size:20px; }
body[data-theme="dark"] .sidebar .brand span { color:#c1ccd7 !important; }
body[data-theme="dark"] .app-shell .nav-group-menu,
body[data-theme="dark"] .app-shell .nav-submenu-items { background:#242d37 !important; color:#e4e9ee !important; }
body[data-theme="dark"] .panel, body[data-theme="dark"] .metric-card,
body[data-theme="dark"] .table-wrap, body[data-theme="dark"] dialog,
body[data-theme="dark"] .delivery-table-panel,
body[data-theme="dark"] .delivery-chart-panel,
body[data-theme="dark"] .delivery-donut-row > div,
body[data-theme="dark"] .delivery-monitor-topbar,
body[data-theme="dark"] .tracking-summary-toolbar,
body[data-theme="dark"] .transit-summary-toolbar,
body[data-theme="dark"] .tower2-hero, body[data-theme="dark"] .tower2-bar-row,
body[data-theme="dark"] .tower2-kpis article { background:#1e242c !important; color:#e4e9ee !important; border-color:#39434f !important; }
body[data-theme="dark"] #coletasEntregasView .delivery-status-row .delivery-status-card { background:#25303a !important; border-color:#45515e !important; }
body[data-theme="dark"] .table-wrap td { background:#1e242c; color:#e4e9ee; border-color:#35404b !important; }
body[data-theme="dark"] .table-wrap tbody tr:hover td { background:#293541 !important; }
body[data-theme="dark"] .table-wrap th, body[data-theme="dark"] .grid-page-control,
body[data-theme="dark"] #coletasEntregasView .grid-page-control { background:#29343f !important; color:#dce6ef !important; }
body[data-theme="dark"] .filters { background:#1e242c; color:#dce6ef; border-color:#39434f; }
body[data-theme="dark"] .table-toolbar,
body[data-theme="dark"] .finance-toolbar,
body[data-theme="dark"] .maintenance-toolbar,
body[data-theme="dark"] .map-toolbar,
body[data-theme="dark"] .report-controls,
body[data-theme="dark"] .control-hero,
body[data-theme="dark"] .control-metrics .metric,
body[data-theme="dark"] .dialog-head,
body[data-theme="dark"] .panel-head { background:#1e242c !important; color:#e4e9ee !important; border-color:#39434f !important; }
body[data-theme="dark"] .clear-button { background:#2a3541 !important; color:#e0e8f0 !important; border-color:#4c5968 !important; }
body[data-theme="dark"] .map-layer-btn, body[data-theme="dark"] .leaflet-bar a { background:#242d37; color:#e4e9ee; border-color:#53606e; }
body[data-theme="dark"] .leaflet-popup-content-wrapper, body[data-theme="dark"] .leaflet-popup-tip { background:#1e242c; color:#e4e9ee; }
body[data-theme="dark"] .leaflet-container a.leaflet-popup-close-button { color:#c5d1de; }
body[data-theme="dark"] .leaflet-control-attribution { background:rgba(30,36,44,.9); color:#b1bcc8; }
body[data-theme="dark"] .leaflet-control-attribution a { color:#9dc7ff; }
body[data-theme="dark"] small, body[data-theme="dark"] .muted { color:#b1bcc8 !important; }
.table-toolbar > div:first-child strong, .table-toolbar > div:first-child small { display:block; }
.table-toolbar > div:first-child small { margin-top:5px; }
body[data-theme="dark"] input, body[data-theme="dark"] select, body[data-theme="dark"] textarea { background:#141c25 !important; color:#e4e9ee !important; border-color:#53606e !important; }
.trip-map-location-select { display:block; width:100%; max-width:500px; margin-top:6px; }
.trip-map-summary { display:grid; gap:5px; padding:12px 0; overflow-wrap:anywhere; color:var(--text); }
.trip-map-summary strong { font-size:18px; }
.app-shell.menu-top .nav-group-header { font-size:11px; font-weight:600; }
body[data-theme="light"] .app-shell.menu-top .nav-group-header:hover { background:#dfece5 !important; }
.panel:has(canvas),.transit-chart-card,.delivery-chart-panel,.telemetry-chart,.tower2-grid > .panel { box-shadow:none !important; }
.transit-chart-card h2,.delivery-chart-panel h2 { font-weight:600; }
.tower2-donut { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; }
.tower2-donut::after { inset:16px; background:var(--surface,#fff); }
.tower2-donut strong { font-size:24px; font-weight:600; }
.tower2-donut span { font-weight:400; margin-top:0; }
body[data-theme="dark"] .tower2-donut span,body[data-theme="dark"] .tower2-legend,body[data-theme="dark"] .transit-status-legend { color:#b7c5cc; }
.fleet-vehicle-popup { min-width:220px; max-width:310px; padding:4px; }
.fleet-vehicle-popup > strong { display:block; font-size:19px; color:inherit; padding-bottom:10px; border-bottom:1px solid #94a3b844; }
.fleet-vehicle-popup dl { margin:10px 0; display:grid; gap:10px; }
.fleet-vehicle-popup dt { font-size:11px; color:#64748b; margin-bottom:3px; }
.fleet-vehicle-popup dd { margin:0; font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.fleet-vehicle-popup small { display:block; font-size:11px; }
.fleet-vehicle-popup .fleet-popup-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }
.fleet-vehicle-popup .fleet-popup-actions button,.fleet-vehicle-popup .fleet-popup-actions a { display:inline-flex; align-items:center; min-height:30px; padding:6px 10px; border:1px solid #cbdadd; border-radius:5px; background:#f5f8f9; color:#244d58; font:600 12px Arial,sans-serif; text-decoration:none; cursor:pointer; }
.fleet-vehicle-popup .fleet-popup-actions button { background:#176c63; color:#fff; border-color:#176c63; }
.logistic-status-card[class] { background:#fff; color:#203941; border:1px solid #dce5e5; border-top:3px solid var(--status-accent,#527786); padding:14px; min-height:105px; border-radius:7px; box-shadow:none; display:flex; flex-direction:column; justify-content:space-between; gap:12px; }
.logistic-status-card[class] span { color:#52686f; font-size:11px; line-height:1.4; text-transform:none; font-weight:600; }
.logistic-status-card[class] strong { color:#203941; font-size:25px; line-height:1.1; }
.logistic-status-card.is-stop,.logistic-status-card.is-yellow { --status-accent:#b8872c; }
.logistic-status-card.is-purple { --status-accent:#7b6c9a; }
.logistic-status-card.is-blue { --status-accent:#4a7bac; }
.logistic-status-card.is-danger { --status-accent:#bd5967; }
.logistic-status-card.is-green { --status-accent:#328375; }
body[data-theme="dark"] .logistic-status-card[class] { background:#202830; color:#edf1f4; border-color:#45515e; border-top-color:var(--status-accent); }
body[data-theme="dark"] .logistic-status-card[class] strong { color:#edf1f4; }
body[data-theme="dark"] .logistic-status-card[class] span,body[data-theme="dark"] .fleet-vehicle-popup dt { color:#b6c5cf; }
@media(max-width:1100px) { .filters { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) { .filters { grid-template-columns:1fr; } .app-shell:not(.menu-top) .sidebar { height:auto; max-height:80dvh; } }
@media(max-width:700px) { .table-toolbar { flex-direction:column; align-items:stretch; gap:12px; } }

/* Focused trip workspace: route and one vehicle, without a second map frame. */
#selectedTripMapDialog { width:min(1420px,96vw); height:min(820px,92dvh); max-height:92dvh; padding:0; overflow:hidden; }
#selectedTripMapDialog[open] { display:grid; grid-template-rows:auto minmax(0,1fr); }
.trip-focus-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:10px 18px; border-bottom:1px solid var(--line); }
.trip-focus-header small { display:none; }
.trip-focus-header h2 { font-size:16px; line-height:1.3; margin:0; }
.trip-focus-actions { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.trip-focus-actions form { margin:0; }
.trip-focus-workspace { display:grid; grid-template-columns:minmax(0,1fr) 400px; min-height:0; }
.trip-focus-stage { position:relative; min-width:0; min-height:0; isolation:isolate; }
.trip-map-tools { position:absolute; right:12px; top:12px; display:flex; gap:6px; z-index:500; }
.trip-map-tools button { padding:7px 10px; font-size:11px; border:1px solid #c9dbe1; border-radius:5px; background:#fff; color:#2c535e; cursor:pointer; }
.trip-map-tools button:disabled { opacity:.55; cursor:default; }
#selectedTripMapDialog #selectedTripMap { width:100%; height:100%; min-height:0; }
.trip-focus-details { padding:20px; overflow-y:auto; min-width:0; border-left:1px solid var(--line); background:var(--surface,#fff); }
.trip-focus-details .trip-map-summary { padding:0 0 18px; gap:9px; }
.trip-focus-details .trip-map-summary strong { font-size:15px; line-height:1.45; }
.trip-focus-details .trip-map-summary > span:last-child { color:var(--muted); font-size:12px; }
.trip-focus-status { align-self:start; width:fit-content; font-size:11px; padding:4px 8px; border-radius:4px; color:#286354; background:#eaf4ef; }
.trip-focus-section { padding:18px 0; border-top:1px solid var(--line); }
.trip-focus-section h3 { font-size:13px; margin:0 0 14px; }
#selectedTripMapMetrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px; }
#selectedTripMapMetrics > div { padding:0; border:0; background:none; min-width:0; }
#selectedTripMapMetrics span { display:block; font-size:11px; color:var(--muted); line-height:1.4; }
#selectedTripMapMetrics strong { display:block; margin-top:5px; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
#selectedTripMapMetrics > div:nth-child(2) strong { font-size:20px; color:#2365bf; }
#selectedTripMapMetrics > div:nth-child(4) strong { color:#137e79; font-size:15px; }
.trip-focus-section:has(#selectedTripMapStops:empty) { display:none; }
.trip-route-progress { margin-top:18px; font-size:11px; color:var(--muted); }
.trip-route-progress progress { display:block; width:100%; height:5px; margin-top:8px; border:0; border-radius:4px; accent-color:#16a34a; }
.trip-focus-facts { margin:0; padding:18px 0; border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px; }
.trip-focus-facts dt { font-size:11px; color:var(--muted); margin-bottom:5px; }
.trip-focus-facts dd { margin:0; font-size:12px; font-weight:600; line-height:1.5; overflow-wrap:anywhere; }
#selectedTripMapStops { margin:0; font-size:12px; line-height:1.5; }
#selectedTripMapStops li { padding:8px 0; border-color:var(--line); }
.trip-route-legend { position:absolute; left:16px; bottom:24px; z-index:500; display:flex; flex-wrap:wrap; gap:9px 14px; align-items:center; max-width:calc(100% - 32px); background:rgba(255,255,255,.94); border:1px solid #d6e1e5; border-radius:6px; padding:10px 12px; font-size:11px; color:#304d57; }
.trip-route-legend i { display:inline-block; width:18px; height:4px; vertical-align:middle; margin-right:6px; border-radius:2px; }
.route-completed { background:#16a34a; }
.route-remaining { background:#2563eb; }
#selectedTripMapRouteState:empty { display:none; }
.trip-stop-marker span { display:grid; place-items:center; width:24px; height:24px; box-sizing:border-box; border:2px solid #fff; border-radius:50%; background:#668290; color:#fff; font:700 11px Arial,sans-serif; box-shadow:0 1px 4px #182f4644; }
.trip-stop-marker.is-origin span { background:#16a34a; }
.trip-stop-marker.is-destination span { background:#c75d66; }
.trip-vehicle-marker .fleet-truck-pin { display:flex; justify-content:center; align-items:center; width:40px; height:36px; color:#fff; background:#2563eb; border:2px solid #fff; border-radius:8px; box-shadow:0 2px 8px #152f4930; }
.trip-vehicle-marker.fleet-truck-marker.is-compact { width:40px !important; height:36px !important; filter:none; }
.trip-vehicle-distance { border:1px solid #d6e1e5; box-shadow:0 2px 8px #182f4618; border-radius:5px; color:#244c5a; padding:6px 9px; font-size:11px; font-weight:600; }
.fleet-restore-focus { position:absolute; left:12px; bottom:28px; z-index:800; background:#fff; color:#244c5a; border:1px solid #c8d9df; border-radius:5px; padding:8px 12px; font-size:12px; cursor:pointer; }
.fleet-restore-focus[hidden],#restoreFleetMapBtn[hidden] { display:none; }
body[data-theme="dark"] .trip-route-legend { background:rgba(30,36,44,.95); color:#dce6ec; border-color:#53616d; }
body[data-theme="dark"] .trip-focus-status { color:#bce3d0; background:#29443a; }
body[data-theme="dark"] .trip-map-tools button { color:#dce6ec; background:#26343e; border-color:#53616d; }
@media(max-width:760px) {
  #selectedTripMapDialog { width:96vw; height:94dvh; max-height:94dvh; overflow-y:auto; }
  #selectedTripMapDialog[open] { display:block; }
  .trip-focus-header { padding:12px; gap:8px; }
  .trip-focus-header h2 { font-size:16px; }
  .trip-focus-actions { gap:5px; }
  .trip-focus-actions button { font-size:11px; padding:7px; }
  .trip-focus-workspace { grid-template-columns:minmax(0,1fr); }
  .trip-focus-stage { height:44dvh; min-height:280px; }
  .trip-focus-details { border-left:0; border-top:1px solid var(--line); padding:18px; overflow:visible; }
  .trip-route-legend { bottom:18px; left:10px; font-size:10px; padding:8px; }
}

/* Shared operational workspace, v2.9.81. */
.app-shell { font-size:12px; line-height:1.4; --shadow:none; }
.app-shell .main { padding:12px 18px 42px !important; }
.app-shell .main .topbar { min-height:38px; padding:3px 0 8px; margin:0 0 8px; gap:12px; border-radius:0; }
.app-shell .main .topbar h1 { font-size:18px; line-height:1.3; margin:0; font-weight:650; }
.main .topbar > div:first-child { min-width:0; }
.main .topbar p { display:none; }
.app-shell .top-actions { gap:7px; flex-wrap:wrap; }
.app-shell .top-actions button,.app-shell .top-actions select { min-height:30px; padding:6px 10px; font-size:11px; box-shadow:none; }
.app-shell .table-toolbar,.app-shell .delivery-monitor-topbar,.app-shell .finance-toolbar,.app-shell .maintenance-toolbar,.app-shell .report-controls { min-height:0; padding:6px 0 10px; gap:8px; margin-bottom:12px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; box-shadow:none; }
.app-shell .table-toolbar > strong,.app-shell .table-toolbar > div > strong,.app-shell .delivery-monitor-topbar strong { font-size:13px; line-height:1.4; }
.app-shell .filters { padding:4px 0 12px; gap:8px; margin-bottom:12px; border:0; border-bottom:1px solid var(--line); border-radius:0; box-shadow:none; background:transparent; }
.app-shell .filters span,.app-shell label > span { font-size:10px; font-weight:600; }
.app-shell input,.app-shell select,.app-shell textarea { font-size:12px; line-height:1.4; }
.app-shell .filters input,.app-shell .filters select { min-height:32px; padding:5px 9px; }
.app-shell button { font-size:11px; letter-spacing:0; }
.app-shell button,.nav-group-header { touch-action:manipulation; }
.app-shell button:hover { transform:none; }
.app-shell .primary-button,.app-shell .secondary-button { min-height:30px; padding:6px 10px; box-shadow:none; border-radius:6px; }
.app-shell .secondary-button { background:#fff; color:#365362; border:1px solid #d6e1e7; }
.app-shell .top-actions > button[id^="new"],#refreshTelemetryBtn { background:#137e79; color:#fff; border-color:#137e79; }
.app-shell .panel { padding:12px; border-radius:8px; }
.app-shell .panel-head { min-height:0; padding:0 0 8px; margin-bottom:6px; gap:10px; }
.app-shell .panel-head h2,.app-shell .view > h2 { font-size:13px; font-weight:600; line-height:1.4; margin:0; }
.app-shell .view h2 { font-size:13px !important; line-height:1.4; }
.app-shell .panel-head p,.app-shell .panel-head small { font-size:11px; line-height:1.4; margin:3px 0 0; }
.app-shell .dashboard-grid,.app-shell .metrics,.app-shell .control-metrics { gap:9px; margin-bottom:10px; }
.app-shell .metric-card,.app-shell .control-metrics .metric,.app-shell .tower2-kpis article { padding:10px 12px; min-height:66px; box-shadow:none; border-radius:8px; }
.app-shell .metric-card strong,.app-shell .control-metrics .metric strong,.app-shell .tower2-kpis article strong { font-size:22px; line-height:1.15; font-weight:650; }
.app-shell .metric-card > span,.app-shell .metric-card small { font-size:10px; line-height:1.4; }
.app-shell .table-wrap th { font-size:10px; font-weight:600; padding:7px 9px; line-height:1.35; letter-spacing:0; }
.app-shell .table-wrap td { font-size:12px; padding:7px 9px; line-height:1.4; font-variant-numeric:tabular-nums; }
.app-shell .table-wrap td small { font-size:10px; }
.app-shell .grid-page-control { min-height:34px; padding:5px 8px; gap:6px; font-size:10px; }
.app-shell .operational-module-nav { min-height:34px; margin-bottom:8px; gap:4px; }
.app-shell .operational-module-nav button { min-height:30px; padding:5px 9px; font-size:11px; }
.app-shell .tower2-hero,.app-shell .control-hero { padding:12px; min-height:0; }
.app-shell .tower2-hero h2,.app-shell .control-hero h2 { font-size:18px; margin:3px 0; }
.app-shell .tower2-hero p,.app-shell .control-hero p { display:none; }
.app-shell .sidebar .brand strong { font-size:18px !important; }
.app-shell .sidebar .brand span { font-size:10px; line-height:1.4; }
.app-shell.menu-top .sidebar { padding:7px 14px; gap:12px; }
.app-shell.menu-top .brand { min-width:140px; flex:0 0 154px; padding:0; gap:8px; }
.app-shell.menu-top .brand img { width:46px; max-height:32px; object-fit:contain; }
.app-shell.menu-top .brand span { white-space:nowrap; max-width:103px; overflow:hidden; text-overflow:ellipsis; }
.app-shell.menu-top .nav-tabs { display:flex; flex-wrap:nowrap; gap:1px; }
.app-shell.menu-top .nav-group-header { min-height:30px; padding:5px 5px; font-size:11px; font-weight:600; text-transform:none; border-radius:5px; }
.app-shell.menu-top .nav-group-header::after { margin-left:4px; }
.app-shell .nav-group-menu .nav-tab { min-height:32px; font-size:11px; padding:7px 10px; }
.app-shell.menu-top .sidebar-footer { gap:6px; margin:0; padding:0; }
.app-shell.menu-top .sidebar-footer button { min-height:30px; padding:6px 9px; font-size:10px; box-shadow:none; }
@media(min-width:1080px) and (max-width:1399px) {
  .app-shell.menu-top .nav-tabs { display:grid; grid-template-columns:repeat(6,max-content); gap:2px 5px; justify-content:start; }
}
.app-shell .logistic-status-card[class] { min-height:88px; padding:10px 12px; gap:10px; }
.app-shell .logistic-status-card[class] strong { font-size:22px; }
.trip-focus-header > div:first-child { min-width:0; }
.trip-focus-header h2 { overflow-wrap:anywhere; }
dialog { font-size:12px; line-height:1.4; }
dialog h2 { font-size:18px; }
dialog h3 { font-size:13px; }
dialog label > span { font-size:11px; }
dialog input:not([type="checkbox"]):not([type="radio"]),dialog select,dialog textarea { font-size:12px; }

#telemetriaView .table-toolbar { align-items:center; }
#telemetriaView .telemetry-actions input,#telemetriaView .telemetry-actions select { min-height:32px !important; font-size:11px; max-width:150px; }
#telemetriaView .telemetry-menu { gap:5px; margin:0 0 9px; }
#telemetriaView .telemetry-tab { min-height:30px; padding:6px 10px; font-size:11px; font-weight:600; box-shadow:none; }
#telemetriaView .telemetry-tab.is-active[data-telemetry-mode="speed"] { background:#fff0f1; color:#b83142; border-color:#efc4ca; }
#telemetriaView .metric-card:first-child { border-top-color:#dc4754; }
#telemetriaView .metric-card:first-child strong { color:#be3445; }
#telemetriaView .telemetry-chart-panel { padding:12px; margin-bottom:10px; }
#telemetriaView .telemetry-chart { position:relative; width:100%; min-width:0; }
#telemetriaView .telemetry-chart canvas { display:block; }
#telemetriaView .telemetry-ranking-panel { padding:0; overflow:hidden; margin-bottom:10px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:10px 12px; border-bottom:1px solid var(--line); }
.telemetry-ranking-heading > div:first-child { display:flex; align-items:center; gap:8px; }
.telemetry-ranking-heading strong { font-size:12px; font-weight:650; }
.ranking-alert-mark { display:grid; place-items:center; width:17px; height:17px; border:1px solid #dc4754; border-radius:50%; color:#bd3343; font-size:11px; font-weight:700; flex-shrink:0; }
.telemetry-export-actions { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.telemetry-export-actions > span { font-size:10px; margin-right:5px; }
.telemetry-export-actions .export-xls { background:#f0faf5; color:#287553; border:1px solid #cce8da; }
.telemetry-export-actions .export-pdf { background:#fff3f4; color:#b73346; border:1px solid #f0cdd3; }
#telemetriaView .telemetry-ranking-grid { border:0; border-radius:0; box-shadow:none; max-height:520px; }
.telemetry-ranking-grid table { min-width:780px; }
.telemetry-ranking-grid td:first-child { width:45px; }
.telemetry-ranking-grid .telemetry-driver { font-weight:600; min-width:200px; }
.telemetry-last-event { display:block; font-size:10px; color:var(--muted); font-weight:400; margin-top:3px; }
.telemetry-ranking-grid .telemetry-vehicles { font-size:11px; color:var(--muted); min-width:140px; }
.telemetry-rank { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; background:var(--surface-2); color:var(--muted); font-size:11px; font-weight:600; }
.telemetry-rank.is-leading { color:#ba3040; background:#ffe5e8; }
.telemetry-event-badge { display:inline-grid; place-items:center; min-width:23px; height:22px; padding:0 5px; border-radius:5px; background:var(--surface-2); font-size:11px; font-weight:600; }
.telemetry-event-badge.is-speed { background:#fff0f2; color:#bc3444; }
.telemetry-peak { white-space:nowrap; font-weight:600; }
.telemetry-peak.is-speed { color:#b83142; }
.telemetry-excess-value { font-size:11px; }
.telemetry-excess-track { display:block; width:72px; height:4px; background:var(--surface-2); margin-top:4px; overflow:hidden; border-radius:3px; }
.telemetry-excess-track i { display:block; height:100%; background:#dc4754; }
.telemetry-workbench { display:grid; grid-template-columns:minmax(280px,.30fr) minmax(0,.70fr); gap:14px; align-items:start; }
#telemetriaView .telemetry-workbench .panel { margin:0; min-width:0; }
#telemetriaView .telemetry-metrics { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:9px 0; margin-bottom:14px !important; gap:0; }
#telemetriaView .telemetry-metrics .metric-card { border:0; border-right:1px solid var(--line); padding:3px 16px; border-radius:0; min-height:54px; background:transparent !important; box-shadow:none; }
#telemetriaView .telemetry-metrics .metric-card:first-child { padding-left:0; }
#telemetriaView .telemetry-metrics .metric-card:last-child { border-right:0; }
#telemetriaView .telemetry-metrics .metric-card small { display:none; }
.telemetry-safety-details { margin-top:14px; border-top:1px solid var(--line); }
.telemetry-safety-details summary { padding:12px 0; font-weight:600; cursor:pointer; }
.telemetry-safety-details summary span { font-size:11px; font-weight:400; color:var(--muted); margin-left:12px; }
.app-shell .tower-top-controls input,.app-shell .tower-top-controls select { display:none; }
.app-shell .tower2-hero { border:0; border-bottom:1px solid var(--line); padding:0 0 12px; background:transparent !important; box-shadow:none; border-radius:0; }
.app-shell .tower2-hero > div:first-child { display:none; }
.app-shell .tower2-actions { width:100%; }
.app-shell .tower2-actions #tower2Search { flex:1; }
body[data-theme="light"] .app-shell.menu-top .sidebar { background:#fff !important; border-bottom:1px solid #e0e8ed; box-shadow:none; }
body[data-theme="light"] .app-shell .main { background:#f5f7fa !important; }
body[data-theme="dark"] #selectedTripMapMetrics > div:nth-child(2) strong { color:#91b9f1; }
body[data-theme="dark"] #selectedTripMapMetrics > div:nth-child(4) strong { color:#8dc8bc; }
body[data-theme="dark"] .app-shell .table-toolbar,body[data-theme="dark"] .app-shell .finance-toolbar,body[data-theme="dark"] .app-shell .maintenance-toolbar,body[data-theme="dark"] .app-shell .filters,body[data-theme="dark"] .app-shell .report-controls { background:transparent !important; }
body[data-theme="dark"] .app-shell .secondary-button { background:#25313b; color:#dce6ed; border-color:#4b5c69; }
@media(max-width:1199px) { .telemetry-workbench { grid-template-columns:minmax(0,1fr); } }
@media(max-width:1079px) {
  #controlTower2View,#controlTower2View .tower2-shell,#controlTower2View .tower2-table-panel,#controlTower2View .paginated-grid { min-width:0; max-width:100%; }
  #controlTower2View .tower2-grid,#controlTower2View .tower2-hero { grid-template-columns:minmax(0,1fr); }
  #controlTower2View .tower2-grid > * { min-width:0; }
  #controlTower2View .deadline-rankings { grid-template-columns:minmax(0,1fr); min-width:0; }
  #controlTower2View .deadline-rankings > .panel,#controlTower2View .performance-grid { min-width:0; max-width:100%; }
  #controlTower2View .tower2-actions { display:flex; flex-wrap:wrap; min-width:0; }
  #controlTower2View .tower2-actions > * { flex:1 1 140px; min-width:0; max-width:100%; }
}
@media(max-width:759px) {
  #controlTower2View .tower2-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #controlTower2View .tower2-donut-wrap { grid-template-columns:110px minmax(0,1fr); }
  #controlTower2View .tower2-donut { width:100px; height:100px; }
}
#telemetriaView > h2 { font-size:13px; margin:4px 0 7px; }
body[data-theme="dark"] .telemetry-rank.is-leading,body[data-theme="dark"] .telemetry-event-badge.is-speed { background:#493139; color:#ffc2cb; }
body[data-theme="dark"] .telemetry-peak.is-speed { color:#ff9caa; }
body[data-theme="dark"] #telemetriaView .telemetry-tab.is-active[data-telemetry-mode="speed"] { background:#493139; color:#ffc2cb; border-color:#86505a; }
body[data-theme="dark"] .telemetry-export-actions .secondary-button { background:#283640; border-color:#4d626e; color:#dde8ef; }
@media(max-width:1079px) { .app-shell .main { padding:10px 12px 42px !important; } }
@media(max-width:700px) {
  .app-shell .main .topbar { align-items:flex-start; flex-wrap:wrap; gap:8px; }
  .app-shell .top-actions { justify-content:flex-start; }
  .app-shell .filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .app-shell .filters label:first-child { grid-column:1/-1; }
  .app-shell .table-toolbar { align-items:flex-start; gap:8px; }
  .app-shell .telemetry-actions { justify-content:flex-start; width:100%; }
  #telemetriaView .telemetry-actions input,#telemetriaView .telemetry-actions select { flex:1 1 130px; max-width:none; }
  #telemetriaView .telemetry-actions input,#telemetriaView .telemetry-actions select { font-size:16px; }
  .app-shell input,.app-shell select,.app-shell textarea { font-size:16px; }
  dialog input:not([type="checkbox"]):not([type="radio"]),dialog select,dialog textarea { font-size:16px; }
  .app-shell .filters input,.app-shell .filters select,.app-shell .top-actions button,.app-shell .primary-button,.app-shell .secondary-button { min-height:36px; }
  .telemetry-export-actions > span { display:none; }
  #telemetriaView .dashboard-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  #telemetriaView .telemetry-metrics .metric-card { padding:8px; }
  .telemetry-safety-details summary span { display:block; margin:4px 0 0; }
}

#freightBillingView .freight-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--border);padding:6px 0}
#freightBillingView .freight-tabs button{background:transparent;color:var(--text);border:0;border-bottom:2px solid transparent;border-radius:0;padding:9px 12px}
#freightBillingView .freight-tabs button.is-active{border-color:#087f8c;color:#087f8c}
#freightBillingView .freight-grid{height:560px;min-height:360px;overflow:auto;resize:vertical;margin-bottom:0}
#freightBillingView th,#telemetryReviewRanking th{position:sticky!important;top:0;z-index:9;background:var(--surface-2)}
#freightBillingView td{font-size:12px;max-width:320px;overflow-wrap:anywhere;vertical-align:top}
#freightBillingView #freightPager{margin-top:0;padding:8px;background:var(--surface-2);border:1px solid var(--border)}
.freight-editor{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:18px 0;border-top:1px solid var(--border)}
.freight-editor label{display:grid;gap:5px;min-width:160px;flex:1}
#freightLinkDialog{max-width:min(700px,94vw)}
#freightLinkDialog form{display:grid;gap:12px;padding:16px}
#freightLinkDialog select{max-width:100%;white-space:normal}
.telemetry-review-ranking{margin-top:12px;border-top:2px solid #d92d20;padding:12px 0;overflow:auto;max-height:470px}
.telemetry-review-ranking h3{font-size:14px;margin:0 0 6px}
.telemetry-review-ranking p,.trip-arrival-list p{font-size:12px;color:var(--muted);margin:6px 0}
#freightFilters{display:grid;grid-template-columns:160px 160px minmax(200px,1fr) auto auto;gap:10px;align-items:end;margin:14px 0}
#freightBillingView button{font:inherit;min-height:32px;border:1px solid var(--line);border-radius:5px;padding:6px 10px;background:var(--surface);color:var(--text);cursor:pointer}
#freightBillingView button:disabled{opacity:.5;cursor:default}
#freightFilters button[type=submit]{background:#087f8c;color:#fff;border-color:#087f8c}
#freightMetrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:14px 0}
#freightMetrics>div{display:grid;gap:7px;align-content:start;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:6px}
#freightMetrics small{font-size:11px;color:var(--muted)}
#freightMetrics strong{font-size:22px;line-height:1.2;font-variant-numeric:tabular-nums}
#freightMetrics>div:last-child{border-top:2px solid #087f8c}
#freightBillingView .freight-tabs{border-color:var(--line)}
#freightBillingView #freightPager{border-color:var(--line)}
#freightBillingView .freight-editor{border-color:var(--line)}
@media(max-width:760px){#freightFilters{grid-template-columns:1fr 1fr}#freightFilters>label:nth-child(3){grid-column:1/-1}#freightMetrics{grid-template-columns:repeat(2,minmax(0,1fr))}#freightMetrics strong{font-size:19px}#freightBillingView .freight-grid{height:480px}#freightPager{flex-wrap:wrap}}
@media(max-width:760px){body:has(#freightBillingView.is-active) .topbar{padding:10px 12px;gap:10px;min-height:0}body:has(#freightBillingView.is-active) .topbar .top-actions{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:7px}body:has(#freightBillingView.is-active) .topbar .top-actions>*{width:auto;margin:0}body:has(#freightBillingView.is-active) .topbar h1{font-size:18px}}
.sidebar a.brand{text-decoration:none;color:inherit}
.home-nav-button{display:flex;align-items:center;gap:8px}
.home-nav-button>span:first-child{font-size:23px;line-height:1}
.sidebar-footer .home-nav-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 32px;width:32px;min-width:32px;height:32px;padding:0;border:1px solid var(--line);border-radius:5px;background:var(--surface);color:var(--text)}
#freightTripRateDialog{max-width:min(740px,94vw);width:680px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text)}
#freightTripRateDialog form{display:grid;gap:12px;padding:18px}
#freightTripRateDialog label{display:grid;gap:6px}
#freightTripRateDialog select,#freightTripRateDialog textarea{width:100%;max-width:100%;min-width:0}

/* Plilog interface */
body:not([data-theme="dark"]) .main {
  background: #f5f7fb;
}
.main .topbar {
  border-bottom: 1px solid var(--line, #d9e2ef);
  padding-bottom: 16px;
}
.topbar h1 {
  letter-spacing: -.035em;
}
.main .panel, .main .metric-card {
  border: 1px solid var(--line, #d9e2ef);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(20, 38, 65, .06);
}
.main .metric-card strong {
  font-variant-numeric: tabular-nums;
}
.main .panel-head h2 {
  letter-spacing: -.02em;
}
:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid #3372d0;
  outline-offset: 3px;
}
.status-distribution {
  display: grid;
  gap: 13px;
  padding: 12px 0;
}
.status-distribution-row {
  display: grid;
  grid-template-columns: minmax(6rem, 1fr) 4ch minmax(3rem, 1.5fr) 4ch;
  align-items: center;
  gap: 8px;
  font-variant-numeric: tabular-nums;
}
.status-distribution-row strong,
.status-distribution-row small {
  text-align: right;
}
.status-distribution-row progress {
  width: 100%;
  height: .65rem;
  accent-color: #29756a;
}
.status-distribution-row[data-tone="warning"] progress { accent-color: #9b5f12; }
.status-distribution-row[data-tone="pending"] progress { accent-color: #3466ac; }
.status-distribution-row[data-tone="critical"] progress { accent-color: #b24157; }
.first-access-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 20px;
  background: #edf2fa;
  color: #172842;
}
.first-access-card {
  width: min(100%, 520px);
  padding: clamp(20px, 5vw, 40px);
  border: 1px solid #d9e2ef;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 36px rgba(20, 38, 65, .08);
}
.first-access-brand {
  color: #2459a0;
  font-weight: 800;
  letter-spacing: .16em;
}
.first-access-card form, .first-access-card label {
  display: grid;
  gap: 7px;
}
.first-access-card form { gap: 14px; margin-top: 24px; }
.first-access-card label[hidden] { display: none; }
.first-access-card input, .first-access-card select {
  width: 100%;
  border: 1px solid #aebcd2;
  border-radius: 8px;
  padding: 9px 11px;
  background: #fff;
  color: #172842;
}
.first-access-card a, .login-card a { color: #21549c; }


/* Plilog 3.1 workspace */
body:not([data-theme="dark"]) .app-shell { background: #eef2f7; }
body:not([data-theme="dark"]) .main { background: #eef2f7; }
body:not([data-theme="dark"]) .main .topbar { background: #f8fafd; }
.app-shell .brand strong { letter-spacing: -.04em; font-size: 1.2rem; }
.app-shell .workspace-home-link {
  background: #24496a; color: #fff; margin: 4px 0 12px; border-radius: 9px; font-weight: 700;
}
.app-shell .workspace-home-link.is-active { background: #16736a; color: #fff; }
.workspace-hub { color: var(--text, #172b42); }
.workspace-hero {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 20px;
  background: #142940; color: #f2f8ff; border-radius: 20px;
  padding: clamp(24px, 5vw, 50px); margin-bottom: 18px;
}
.workspace-hero h2 { font-size: clamp(1.8rem, 4vw, 3.4rem); line-height: 1.03; letter-spacing: -.055em; margin: 12px 0; color: inherit; }
.workspace-hero p { color: #c9dbeb; margin: 0; }
.workspace-hero .workspace-eyebrow, .workspace-badge { font-size: .72rem; letter-spacing: .13em; font-weight: 800; }
.workspace-badge { color: #a7ecda; border: 1px solid #426d77; border-radius: 99px; padding: 8px 12px; white-space: nowrap; }
.workspace-summary { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: 12px; }
.workspace-kpi, .workspace-module {
  border: 1px solid var(--line, #cdd8e4); background: var(--panel, #fff); color: inherit; border-radius: 14px;
}
.workspace-kpi {
  display: grid; gap: 7px; text-align: left; padding: 18px; cursor: pointer;
  font: inherit; min-width: 0;
}
.workspace-kpi strong { font-size: 2rem; font-variant-numeric: tabular-nums; line-height: 1.15; }
.workspace-kpi progress { width: 100%; height: 8px; accent-color: #158276; }
.workspace-kpi:hover, .workspace-module button:hover { border-color: #148375; }
.workspace-directory { margin-top: 24px; }
.workspace-directory-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 0 0 14px; }
.workspace-directory-head h2, .workspace-directory-head p { margin: 0; }
.workspace-search { display: grid; gap: 5px; width: min(100%, 320px); }
.workspace-search input { border-radius: 9px; width: 100%; }
.workspace-modules { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(240px,100%),1fr)); align-items: start; gap: 12px; }
.workspace-module { padding: 15px; }
.workspace-module h3 { font-size: .74rem; letter-spacing: .08em; margin: 0 0 8px; }
.workspace-module button {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%;
  text-align: left; padding: 8px; min-height: 38px; border-radius: 7px;
  background: transparent; color: inherit; border: 1px solid transparent; cursor: pointer; font: inherit;
}
body[data-theme="dark"] .workspace-kpi, body[data-theme="dark"] .workspace-module { background: #1b2b3b; }
@media (max-width: 620px) {
  .workspace-hero { padding: 22px; }
  .workspace-badge { display: none; }
  .workspace-directory-head { align-items: stretch; flex-direction: column; }
}
#workspaceHub .workspace-hero h2 { font-size: clamp(1.85rem, 3.5vw, 3.1rem) !important; line-height: 1.07; font-weight: 750; }
#workspaceHub .workspace-hero p:not(.workspace-eyebrow) { font-size: clamp(.9rem, 1.3vw, 1.05rem); }
#workspaceHub .workspace-directory-head h2 { font-size: 1.25rem !important; }
#workspaceHub .workspace-search input { border: 1px solid var(--line, #cdd8e4); min-height: 38px; padding: 8px 12px; }

/* Plilog workspace and shared module surfaces */
.app-shell .workspace-home-link,
.app-shell .workspace-home-link.is-active {
  background: transparent;
  color: inherit;
  box-shadow: none;
}
.app-shell .workspace-home-link.is-active {
  border: 1px solid var(--line);
  font-weight: 700;
}
#workspaceHub .workspace-hero {
  background: var(--panel, #fff);
  color: var(--text, #152839);
  border: 1px solid var(--line, #dbe5ea);
  padding: clamp(18px, 2.5vw, 30px);
}
#workspaceHub .workspace-hero p { color: inherit; }
#workspaceHub .workspace-hero h2 { font-size: clamp(1.65rem, 2.6vw, 2.4rem) !important; }
#workspaceHub .workspace-badge { color: inherit; border-color: var(--line); }
.workspace-controls,
.workspace-kpi header,
.workspace-kpi footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.workspace-controls { margin: 18px 0 10px; }
.workspace-controls h2,.workspace-controls p { margin: 0; }
.workspace-controls p { font-size: .82rem; opacity: .75; margin-top: 4px; }
.workspace-kpi { cursor: default; }
.workspace-kpi header > div { display: grid; gap: 4px; }
.workspace-kpi footer { margin-top: 4px; flex-wrap: wrap; }
.workspace-summary { grid-template-columns: repeat(auto-fit, minmax(min(275px,100%),1fr)); }
.workspace-sla { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.workspace-sla > div {
  display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 5px;
  padding: 10px; border: 1px solid var(--line); border-radius: 9px;
}
.workspace-sla > div span { grid-column: 1 / -1; font-weight: 650; }
.workspace-sla > div strong { font-size: 1.4rem; }
.workspace-sla [data-tone="ok"] { border-inline-start: 3px solid #26846b; }
.workspace-sla [data-tone="late"] { border-inline-start: 3px solid #bf5160; }
.workspace-queue { margin-top: 15px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel,#fff); }
.workspace-queue[hidden] { display: none; }
.workspace-queue h2 { margin: 0 0 8px; }
.workspace-queue ul { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(245px,100%),1fr)); gap: 8px; list-style: none; padding: 0; margin: 0; }
.workspace-queue li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; }
.main .view .table-wrap { border-radius: 12px; border-color: var(--line); }
.main .view .table-wrap th { letter-spacing: .02em; }
.main .view .table-wrap td { font-variant-numeric: tabular-nums; }
.main .view .row-actions { gap: 5px; }
.main .view .row-actions button { border-radius: 7px; }

/* Plilog 3.3 shared interface */
body {
  --ui-canvas:#eef3f8; --ui-surface:#fff; --ui-raised:#f4f7fb;
  --ui-ink:#172e46; --ui-muted:#4d6278; --ui-line:#cbd8e6;
  --ui-accent:#116a64; --ui-selected:#d9efeb; --ui-danger:#b1405a;
}
body[data-theme="dark"] {
  --ui-canvas:#101923; --ui-surface:#192735; --ui-raised:#223447;
  --ui-ink:#edf4fc; --ui-muted:#b6c9dc; --ui-line:#425971;
  --ui-accent:#8de4d5; --ui-selected:#224b50; --ui-danger:#ff9cae;
}
body .app-shell, body .app-shell .main { background:var(--ui-canvas) !important; color:var(--ui-ink); }
body .app-shell .sidebar, body .app-shell .main .topbar {
  background:var(--ui-surface) !important; color:var(--ui-ink); border-color:var(--ui-line) !important;
}
body .app-shell .sidebar .nav-tab.is-active {
  background:var(--ui-selected) !important; color:var(--ui-ink) !important; border-color:var(--ui-line) !important;
}
body .app-shell .main .view .panel, body .app-shell .main .view .table-wrap {
  background:var(--ui-surface) !important; color:var(--ui-ink); border-color:var(--ui-line) !important; border-radius:14px;
}
body .app-shell .main .view .table-wrap table thead th {
  background:var(--ui-raised) !important; color:var(--ui-ink) !important;
  border-color:var(--ui-line) !important; font-weight:700;
}
body .app-shell .main .view .table-wrap table tbody tr:hover td { background:var(--ui-raised) !important; color:var(--ui-ink); }
body .app-shell .main .view .table-toolbar { border-radius:11px; padding-block:10px; gap:8px; }
body .app-shell .main :where(button,input,select,textarea):focus-visible { outline:2px solid var(--ui-accent); outline-offset:3px; }
body #workspaceHub :is(.workspace-hero,.workspace-queue,.workspace-kpi,.operations-rank) {
  background:var(--ui-surface) !important; color:var(--ui-ink) !important; border:1px solid var(--ui-line) !important;
}
body #workspaceHub :is(.workspace-hero,.workspace-queue,.workspace-kpi,.operations-rank) :is(h2,h3,strong,small,p,li) { color:inherit; }
body #workspaceHub :is(.workspace-eyebrow,.workspace-controls p,.operations-board-note,.operations-rank small,.operations-rank p) {
  color:var(--ui-muted) !important; opacity:1;
}
body #workspaceHub .workspace-queue li, body #workspaceHub .workspace-sla > div { background:var(--ui-raised); border-color:var(--ui-line); }
body #workspaceHub .workspace-sla [data-tone="ok"] { border-inline-start:3px solid var(--ui-accent); }
body #workspaceHub .workspace-sla [data-tone="late"] { border-inline-start:3px solid var(--ui-danger); }
.operations-board { margin-top:24px; color:var(--ui-ink); }
.operations-board[hidden] { display:none; }
.operations-board-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.operations-board-heading p, .operations-board-heading h2 { margin:0; }
#workspaceHub .operations-board-heading h2 { font-size:clamp(1.3rem,2.3vw,2rem) !important; line-height:1.25; }
.operations-period { padding:7px 10px; border:1px solid var(--ui-line); border-radius:99px; white-space:nowrap; color:var(--ui-muted); }
.operations-rankings { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(270px,100%),1fr)); align-items:start; gap:12px; }
.operations-rank { border-radius:12px; padding:16px; min-width:0; }
.operations-rank h3 { margin:0 0 8px; font-size:1rem; }
.operations-rank p { margin:0 0 8px; font-size:.85rem; }
.operations-rank ol { display:grid; gap:8px; padding:0; margin:0; list-style:none; }
.operations-rank li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3px 9px; align-items:center; padding:8px 0; border-top:1px solid var(--ui-line); }
.operations-rank li > div { display:grid; gap:3px; overflow-wrap:anywhere; }
.operations-rank li > b { font-variant-numeric:tabular-nums; }
.operations-rank progress { grid-column:1 / -1; width:100%; height:.5rem; accent-color:var(--ui-accent); }
.operations-rank progress.is-late { accent-color:var(--ui-danger); }
.operations-rank li.operations-empty { display:block; color:var(--ui-muted); }
.fleet-map-panel .fleet-pagination {
  display:flex; flex:0 0 auto; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 12px;
  border-top:1px solid var(--ui-line); color:var(--ui-ink); background:var(--ui-surface);
}
.fleet-pagination [role="status"] { margin-inline-end:auto; font-variant-numeric:tabular-nums; }
.fleet-pagination label { display:flex; gap:5px; align-items:center; }
.fleet-pagination button:disabled { opacity:.55; }
.fleet-map-layout.is-side-panel .fleet-position-list { min-height:0; }

/* Plilog 3.4 compact filters, resizable cards and report navigation */
body .main > .filters:not(.is-hidden) {
  display:flex !important; flex-wrap:nowrap !important; align-items:end; gap:7px;
  overflow-x:auto; padding-block:8px;
}
body .main > .filters > label { flex:1 1 100px; min-width:94px; max-width:175px; }
body .main > .filters > label:has(#searchInput) { flex:1 1 155px; min-width:132px; max-width:225px; }
body .main > .filters > label:has(input[type="date"]) { flex:0 0 116px; min-width:116px; }
body .main > .filters > label :is(input,select) { width:100%; min-width:0 !important; box-sizing:border-box; }
body .main > .filters > button { flex:0 0 auto; }
#historicoViagensView > .table-toolbar { min-height:0 !important; padding:6px 0 !important; gap:8px; }
#historicoViagensView > .table-toolbar > div:first-child { margin-right:auto; }
#historicoViagensView #historyMore[hidden] { display:none; }
#gestaoPatioView > .table-toolbar:first-child .inline-actions {
  display:flex; flex-wrap:nowrap; align-items:center; min-width:0; overflow-x:auto; gap:6px;
}
#gestaoPatioView > .table-toolbar:first-child .inline-actions input { min-width:95px; }
#gestaoPatioView #patioSearch { width:180px; }
#gestaoPatioView #patioMovementPlate { width:100px; }
#controlTower2View :is(.tower2-grid,.tower2-kpis) {
  display:grid !important; grid-template-columns:repeat(12,minmax(0,1fr)); align-items:start; gap:8px;
}
#controlTower2View .tower2-grid > article { grid-column:span 4; height:215px; min-height:0 !important; overflow:auto; padding:10px !important; }
#controlTower2View .tower2-grid > article[data-card-size="compact"] { grid-column:span 3; height:170px; }
#controlTower2View .tower2-grid > article[data-card-size="large"] { grid-column:span 6; height:345px; }
#controlTower2View .tower2-kpis > article { grid-column:span 3; min-height:0 !important; padding:8px 10px !important; }
#controlTower2View .tower2-kpis > article[data-card-size="compact"] { grid-column:span 2; }
#controlTower2View .tower2-kpis > article[data-card-size="large"] { grid-column:span 6; }
#controlTower2View .tower2-bar-row { padding:6px; }
#controlTower2View .tower2-donut { width:106px; height:106px; }
.tower-size-control { display:flex; gap:5px; align-items:center; margin-top:7px; font-size:.72rem; }
.tower-size-control select { font-size:.72rem; padding:2px 5px; min-height:22px; }
#transitTimeView .transit-chart-card { min-height:0 !important; padding:10px !important; }
#transitTimeView .transit-chart, #transitTimeView .transit-chart-card:first-child .transit-chart { height:126px !important; }
#workspaceHub .operations-rankings { align-items:stretch; }
#workspaceHub .operations-rank { box-sizing:border-box; height:255px; display:flex; flex-direction:column; }
#workspaceHub .operations-rank ol { overflow:auto; min-height:0; }
.report-category-menu { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:6px; margin:4px 0 8px; }
.report-category-menu details { position:relative; }
.report-category-menu summary { cursor:pointer; border:1px solid var(--ui-line); border-radius:7px; padding:7px 10px; background:var(--ui-surface); }
.report-category-menu details[open] { min-width:190px; }
.report-category-menu details button { display:block; width:100%; text-align:left; padding:6px 8px; background:var(--ui-surface); color:var(--ui-ink); border:1px solid var(--ui-line); }
.report-category-menu button[aria-pressed="true"] { background:var(--ui-selected); font-weight:700; }
@media(max-width:900px) {
  #controlTower2View .tower2-grid > article, #controlTower2View .tower2-grid > article[data-card-size] { grid-column:span 6; }
  #controlTower2View .tower2-kpis > article, #controlTower2View .tower2-kpis > article[data-card-size] { grid-column:span 6; }
}
@media(max-width:580px) {
  #controlTower2View .tower2-grid > article, #controlTower2View .tower2-grid > article[data-card-size] { grid-column:span 12; }
}
.report-category-menu details[open] { min-width:0; }
.report-category-menu .report-category-items {
  position:absolute; z-index:12; top:calc(100% + 4px); left:0; width:min(280px,72vw);
  max-height:320px; overflow:auto; padding:4px;
  background:var(--ui-surface); border:1px solid var(--ui-line); border-radius:8px;
  box-shadow:0 10px 22px #0002;
}
.report-category-menu .report-category-items button { border-color:transparent; border-radius:5px; }
.report-category-menu .report-category-items button:hover { background:var(--ui-raised); }