:root {
  --blue: #195e9f;
  --blue-dark: #0e467e;
  --green: #14795a;
  --line: #cfd9ce;
  --paper: #f5f3eb;
  --cell: #fbfcf8;
  --ink: #101820;
  --load: #fff1c7;
  --load-line: #e0ad42;
  --continue: #eef8f2;
  --driver: #dcefe7;
  --trailer: #ddeef6;
  --need: #f8d9d9;
  --need-line: #c53737;
  --icon-blue: #2f7db8;
  --icon-blue-dark: #1f639e;
  --icon-blue-soft: #92c9ea;
  --icon-blue-panel: #e9f5fb;
  --sidebar-width: 238px;
  --sidebar-collapsed-width: 72px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  transition: grid-template-columns 160ms ease;
}

body.sidebar-collapsed {
  grid-template-columns: var(--sidebar-collapsed-width) 1fr;
}

.sidebar {
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, #17568f 0%, #124a7c 52%, #0f416f 100%);
  color: white;
  min-height: 100vh;
  padding: 0;
  overflow: hidden;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.13);
}

.sidebar-brand {
  min-height: 64px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 30px;
  gap: 8px;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(13, 58, 99, 0.42);
}

.brand-mark {
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: var(--icon-blue-panel);
  border: 1px solid rgba(255, 255, 255, 0.48);
  box-shadow: inset 0 0 0 1px rgba(31, 99, 158, 0.08);
}

.brand-text {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.brand-text strong {
  font-size: 15px;
  line-height: 18px;
}

.brand-text span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  font-weight: 700;
}

.sidebar-collapse-toggle {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  color: #ffffff;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.sidebar-collapse-toggle:hover {
  background: rgba(255, 255, 255, 0.2);
}

.sidebar-collapse-toggle svg {
  width: 18px;
  height: 18px;
}

.sidebar-nav {
  flex: 1;
  padding: 12px 8px;
  display: grid;
  align-content: start;
  grid-auto-rows: min-content;
  gap: 10px;
  overflow: auto;
}

.nav-section {
  display: grid;
  gap: 3px;
}

.nav-section + .nav-section {
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.nav-section-title {
  padding: 0 10px 2px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 10px;
  font-weight: 900;
  line-height: 14px;
  text-transform: uppercase;
}

.nav-item,
.nav-subitem {
  width: 100%;
  min-height: 38px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #ffffff;
  cursor: pointer;
  text-align: left;
  text-decoration: none;
}

.nav-item {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  padding: 0 8px 0 6px;
  font-weight: 700;
  position: relative;
  border-left: 3px solid transparent;
}

.sidebar-nav > .nav-item {
  grid-template-columns: 30px minmax(0, 1fr) auto;
}

.nav-group {
  display: grid;
  gap: 2px;
}

.nav-icon {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: rgba(233, 245, 251, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.32);
  box-shadow: inset 0 0 0 1px rgba(31, 99, 158, 0.06);
}

.nav-icon svg {
  width: 20px;
  height: 20px;
}

.brand-icon {
  width: 30px;
  height: 30px;
}

.icon-line,
.icon-fill {
  stroke: var(--icon-blue-dark);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.icon-line {
  fill: none;
}

.icon-fill {
  fill: var(--icon-blue-soft);
}

.icon-accent {
  fill: var(--icon-blue);
}

.icon-soft {
  fill: var(--icon-blue-soft);
  stroke: var(--icon-blue-dark);
  stroke-width: 1.2;
}

.nav-label {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 13px;
  line-height: 16px;
}

.nav-chevron {
  text-align: center;
  font-size: 13px;
  font-weight: 900;
  color: rgba(255, 255, 255, 0.72);
}

.nav-group:not(.open) .nav-submenu {
  display: none;
}

.nav-submenu {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  padding: 3px 0 4px 44px;
}

.nav-subitem {
  min-height: 31px;
  padding: 0 9px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  border-left: 2px solid rgba(255, 255, 255, 0.18);
}

.nav-item.active,
.nav-subitem.active {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

.nav-item.active {
  border-left-color: #ffffff;
}

.nav-subitem.active {
  border-left-color: #ffffff;
}

.nav-item.active .nav-icon {
  background: #ffffff;
}

.nav-item:hover,
.nav-subitem:hover {
  background: rgba(255, 255, 255, 0.16);
}

main {
  min-width: 0;
  padding: 12px;
}

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

h1 {
  font-size: 23px;
  margin: 0;
}

p {
  margin: 3px 0 0;
  color: #53605d;
}

button,
input,
select {
  font: inherit;
}

button {
  border: 1px solid #becabe;
  background: white;
  border-radius: 6px;
  padding: 8px 12px;
  cursor: pointer;
}

button:hover {
  border-color: var(--green);
}

button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.sidebar button {
  border: 0;
}

.sidebar .brand-mark {
  width: 34px;
  height: 34px;
  padding: 0;
  border-radius: 6px;
  background: var(--icon-blue-panel);
  border: 1px solid rgba(255, 255, 255, 0.48);
}

.sidebar .nav-item {
  border: 0;
  color: #ffffff;
  border-radius: 6px;
}

.sidebar .nav-item:hover {
  border: 0;
  background: rgba(255, 255, 255, 0.18);
}

.sidebar-account {
  display: grid;
  gap: 3px;
  margin-top: auto;
  padding: 12px 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  color: #ffffff;
  font-size: 12px;
  background: rgba(13, 58, 99, 0.26);
}

.sidebar-account span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 800;
}

.sidebar-account small {
  color: rgba(255, 255, 255, 0.76);
}

.sidebar-account button {
  width: fit-content;
  margin-top: 5px;
  padding: 5px 8px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
}

body.sidebar-collapsed .sidebar-brand {
  grid-template-columns: 1fr;
  justify-items: center;
  min-height: 58px;
  padding: 10px 0;
}

body.sidebar-collapsed .brand-mark,
body.sidebar-collapsed .brand-text,
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .nav-section-title,
body.sidebar-collapsed .nav-chevron,
body.sidebar-collapsed .nav-submenu,
body.sidebar-collapsed .sidebar-account span,
body.sidebar-collapsed .sidebar-account small,
body.sidebar-collapsed .sidebar-account button {
  display: none;
}

body.sidebar-collapsed .sidebar-nav {
  padding: 10px 7px;
  gap: 7px;
  overflow-x: hidden;
}

body.sidebar-collapsed .nav-section {
  gap: 5px;
}

body.sidebar-collapsed .nav-section + .nav-section {
  padding-top: 8px;
}

body.sidebar-collapsed .nav-item {
  grid-template-columns: 1fr;
  justify-items: center;
  min-height: 42px;
  padding: 0;
  border-left: 0;
}

body.sidebar-collapsed .nav-icon {
  width: 32px;
  height: 32px;
}

body.sidebar-collapsed .nav-icon svg {
  width: 22px;
  height: 22px;
}

body.sidebar-collapsed .nav-badge {
  position: absolute;
  top: 3px;
  right: 5px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  font-size: 9px;
}

body.sidebar-collapsed .sidebar-account {
  min-height: 52px;
  padding: 10px 0;
  justify-items: center;
}

body.sidebar-collapsed .sidebar-account::before {
  content: "";
  width: 32px;
  height: 32px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.24);
}

.auth-page {
  display: grid;
  min-height: 100vh;
  grid-template-columns: 1fr;
  place-items: center;
  background: #eef1eb;
}

.auth-shell {
  width: min(430px, calc(100vw - 24px));
  padding: 0;
}

.auth-card {
  display: grid;
  gap: 16px;
  padding: 24px;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 18px 50px rgba(30, 45, 38, 0.14);
}

.auth-brand {
  display: grid;
  gap: 4px;
}

.auth-brand strong {
  color: var(--blue);
  font-size: 26px;
}

.auth-brand span,
.auth-link {
  color: #56635f;
}

.auth-form {
  display: grid;
  gap: 12px;
}

.auth-form button {
  justify-content: center;
}

.auth-message {
  min-height: 18px;
  color: #8a330d;
  font-size: 13px;
}

.auth-link {
  width: fit-content;
  font-size: 13px;
  font-weight: 800;
}

.status,
.controls,
.board,
.resource-panel {
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 7px;
  margin-bottom: 8px;
}

.status {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  align-items: center;
  padding: 8px 10px;
  font-size: 14px;
}

.status[hidden] {
  display: none;
}

.status span {
  white-space: nowrap;
}

.status.success {
  color: #0f5132;
  background: #e8f5ee;
  border-color: #a9d5ba;
}

.status.error {
  color: #842029;
  background: #f8d7da;
  border-color: #e8aeb4;
}

.status-footer {
  margin-top: 8px;
  margin-bottom: 0;
  padding: 7px 10px;
  color: #56635f;
  background: rgba(255, 255, 255, 0.55);
  font-size: 12px;
}

.status-footer strong {
  color: #2a3b34;
}

.status-footer .sync-running,
.status-footer .sync-idle {
  font-weight: 700;
}

.sync-running {
  color: #a16400;
  font-weight: 800;
}

.sync-idle {
  color: var(--green);
  font-weight: 800;
}

.last-refresh {
  color: #66756f;
  font-size: 12px;
}

.settings-link-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 12px;
  padding: 12px;
}

.settings-link-card {
  display: grid;
  gap: 6px;
  padding: 14px;
  color: #102019;
  text-decoration: none;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.settings-link-card:hover {
  border-color: var(--green);
}

.settings-link-card span {
  color: #56635f;
  font-size: 13px;
}

.account-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 12px;
  align-items: start;
}

.account-main-column {
  display: grid;
  gap: 12px;
}

.account-panel,
.account-summary-panel {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.account-panel {
  display: grid;
  gap: 12px;
}

.account-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.account-panel-head h2,
.account-summary-panel h2 {
  margin: 0;
  font-size: 20px;
}

.account-summary-panel {
  position: sticky;
  top: 14px;
  grid-row: span 2;
}

.account-summary-panel > p:last-of-type {
  margin: 5px 0 12px;
  color: #596661;
  word-break: break-word;
}

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

.account-form label {
  display: grid;
  gap: 5px;
  color: #2a3b34;
  font-size: 12px;
  font-weight: 800;
}

.account-form input {
  min-width: 0;
}

.account-security-form .account-current-password {
  grid-column: 1 / -1;
  max-width: 520px;
}

.account-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
}

.account-summary-grid {
  display: grid;
  gap: 8px;
}

.account-summary-grid div {
  padding: 9px;
  background: #fbfcf8;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.account-summary-grid span {
  display: block;
  margin-bottom: 3px;
  color: #596661;
  font-size: 12px;
  font-weight: 800;
}

.account-summary-grid strong {
  display: block;
  color: #17231e;
}

.account-force-notice {
  color: #7a4d00;
  background: #fff4d6;
  border-color: #e6c676;
  font-weight: 800;
}

.account-form input:disabled,
.account-form button:disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

@media (max-width: 900px) {
  .account-layout {
    grid-template-columns: 1fr;
  }

  .account-summary-panel {
    position: static;
    grid-row: auto;
  }

  .account-form {
    grid-template-columns: 1fr;
  }
}

.status-page main {
  display: grid;
  gap: 14px;
}

.status-page .modern-page-header {
  align-items: center;
}

.status-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
}

.status-card,
.status-detail-card {
  border: 1px solid var(--portal-line, #dbe3ef);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.status-card {
  display: grid;
  gap: 6px;
  min-height: 86px;
  padding: 16px;
}

.status-card span,
.status-card small {
  color: #64748b;
  font-size: 12px;
}

.status-card strong {
  color: #0f172a;
  font-size: 24px;
  line-height: 1;
}

.status-card-blue {
  border-left: 4px solid #2563eb;
}

.status-card-green {
  border-left: 4px solid #16a34a;
}

.status-card-amber {
  border-left: 4px solid #d97706;
}

.status-card-red {
  border-left: 4px solid #dc2626;
}

.status-page-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 14px;
}

.status-detail-card {
  display: grid;
  gap: 10px;
  padding: 16px;
}

.status-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 1px solid #eef2f7;
}

.status-card-head h2 {
  margin: 0;
  color: #0f172a;
  font-size: 16px;
}

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

.status-action-button,
.status-danger-button {
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 800;
}

.status-action-button {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.status-danger-button {
  border-color: #fecaca;
  background: #fff1f2;
  color: #be123c;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.status-pill.success {
  background: #dcfce7;
  color: #166534;
}

.status-pill.warning {
  background: #fef3c7;
  color: #92400e;
}

.status-pill.danger {
  background: #fee2e2;
  color: #991b1b;
}

.status-list {
  display: grid;
  gap: 8px;
}

.status-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #edf2f7;
  border-radius: 10px;
  background: #fbfdff;
}

.status-row div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.status-row strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.status-row span,
.status-row small,
.status-empty span {
  color: #64748b;
  font-size: 12px;
}

.status-empty {
  display: grid;
  gap: 5px;
  padding: 14px;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  background: #f8fafc;
  color: #475569;
  font-size: 13px;
}

.backup-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.backup-summary div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #edf2f7;
  border-radius: 10px;
  background: #f8fafc;
}

.backup-summary strong {
  color: #0f172a;
  font-size: 12px;
}

.backup-summary span {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.backup-restore-note {
  background: #ffffbf;
}

.backup-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.controls {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: end;
  padding: 9px 10px;
}

.board-search-field {
  min-width: 130px;
}

.board-search-field input {
  width: 130px;
}

.board-filter-group {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  padding-bottom: 1px;
}

.board-filter-group button,
.board-refresh-panel button {
  min-height: 32px;
  padding: 6px 9px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 800;
}

.board-filter-group button.active {
  color: #ffffff;
  background: var(--green);
  border-color: var(--green);
}

.board-refresh-panel {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  padding-bottom: 1px;
  color: #66756f;
  font-size: 12px;
  font-weight: 800;
}

.board-refresh-panel button.refreshing {
  cursor: wait;
  opacity: 0.72;
}

.schedule-changes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: -1px 0 8px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.72);
  color: #3c4a45;
  font-size: 12px;
  font-weight: 800;
}

.schedule-changes[hidden] {
  display: none;
}

.schedule-change-chip {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 7px;
  border: 1px solid #c5d0c4;
  border-radius: 999px;
  background: #ffffff;
  color: #31423b;
  font-size: 12px;
}

label {
  display: grid;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  color: #4a5753;
}

input,
select {
  border: 1px solid #c5d0c4;
  border-radius: 6px;
  padding: 7px 9px;
  background: white;
}

.dashboard-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 8px;
  align-items: start;
}

.board {
  max-height: calc(100vh - 174px);
  overflow: auto;
  margin-bottom: 0;
  background: #ffffff;
  scrollbar-gutter: stable both-edges;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.grid {
  display: grid;
  min-width: max(1080px, 100%);
}

.corner,
.day-header {
  position: sticky;
  top: 0;
  z-index: 4;
  background: #e7eee6;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid #abb9aa;
  padding: 7px 8px;
  font-weight: 800;
  font-size: 13px;
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.corner {
  left: 0;
  z-index: 6;
  justify-content: flex-start;
  box-shadow: 1px 0 0 var(--line), 0 1px 0 #abb9aa;
}

.day-header.today {
  background: #fff5dc;
  box-shadow: inset 0 3px 0 #d89216;
}

.truck {
  position: sticky;
  left: 0;
  z-index: 3;
  min-height: 74px;
  color: #111;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 8px 6px;
  text-align: center;
  display: grid;
  align-content: center;
  gap: 5px;
  box-shadow: 1px 0 0 rgba(16, 24, 32, 0.1);
}

.truck.board-filter-hidden,
.cell.board-filter-hidden {
  display: none;
}

.truck strong {
  font-size: 17px;
  line-height: 1;
}

.truck span {
  font-size: 9.5px;
  text-transform: uppercase;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.cell {
  position: relative;
  min-height: 74px;
  background: var(--cell);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 4px;
  align-content: start;
  content-visibility: auto;
  contain-intrinsic-size: 74px 160px;
  transition: box-shadow 120ms ease, background-color 120ms ease;
}

.cell-note-add {
  position: absolute;
  top: 2px;
  right: 2px;
  z-index: 2;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 1px solid #9eb8d0;
  border-radius: 4px;
  background: #f4fbff;
  color: #145a86;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  opacity: 0;
}

.cell:hover .cell-note-add,
.cell:focus-within .cell-note-add {
  opacity: 1;
}

.cell.today-cell {
  background: #fffaf0;
  box-shadow: inset 2px 0 0 #d89216, inset -2px 0 0 #d89216;
}

.cell.row-hover {
  box-shadow: inset 0 0 0 1px rgba(25, 94, 159, 0.24);
}

.cell.today-cell.row-hover {
  box-shadow: inset 2px 0 0 #d89216, inset -2px 0 0 #d89216, inset 0 0 0 1px rgba(25, 94, 159, 0.24);
}

.truck.row-hover {
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.55), 1px 0 0 rgba(16, 24, 32, 0.1);
}

.resource,
.load-card,
.last-location,
.moved-location-marker,
.truck-status-card {
  display: grid;
  width: 100%;
  min-width: 0;
  text-align: left;
  border-radius: 5px;
  margin-bottom: 4px;
  transition: outline-color 120ms ease, box-shadow 120ms ease;
}

.cell > :last-child {
  margin-bottom: 0;
}

.resource {
  min-height: 18px;
  padding: 2px 6px;
  border: 1px solid #b7d5ca;
  color: #0f1b24;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.resource.driver {
  background: var(--driver);
}

.resource.driver-resource-pill {
  display: flex;
  align-items: center;
  gap: 3px;
  min-height: 22px;
  padding: 1px 5px;
}

.resource-driver-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.driver-role-icons {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-right: 4px;
  vertical-align: -2px;
}

.driver-role-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  object-fit: contain;
}

.resource .driver-role-icons {
  gap: 1px;
  margin-right: 0;
  vertical-align: middle;
}

.resource .driver-role-icon {
  width: 20px;
  height: 20px;
  flex-basis: 20px;
}

.resource .driver-role-icon.trainee-icon {
  width: 24px;
  height: 22px;
  flex-basis: 24px;
}

.driver-name-with-icons {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.driver-name-with-icons .driver-role-icons {
  margin-right: 0;
}

.resource.trailer {
  background: var(--trailer);
  border-color: #bfd6e4;
}

.resource.resource-change-alert {
  background: #fef3c7;
  border-color: #f59e0b;
  color: #7c2d12;
  box-shadow: inset 0 0 0 1px rgba(245, 158, 11, 0.32);
}

.resource.resource-empty {
  visibility: hidden;
}

.resource.trailer-missing {
  background: #ffe4e4;
  border-color: #e35d5d;
  color: #b51f1f;
}

.load-card {
  gap: 2px;
  border: 1px solid var(--load-line);
  background: var(--load);
  padding: 5px 6px;
}

.load-card.continuing {
  border-style: dashed;
  border-color: #b8d8c4;
  background: var(--continue);
}

.load-card.empty-move {
  border-color: #8798a5;
  background: #dfe7ed;
}

.load-card.empty-move.continuing {
  border-color: #9aaab5;
  background: #eef3f6;
}

.load-card.load-usps {
  border-color: #c79600;
  background: #ffc000;
  color: #111;
}

.load-card.load-dhl {
  border-color: #8db376;
  background: #c6e0b4;
  color: #10210f;
}

.load-card.load-other-customer {
  border-color: #0088ba;
  background: #00b0f0;
  color: #051b24;
}

.load-card.load-high-value {
  border-color: #777;
  background: #b7b7b7;
  color: #111;
}

.load-card.load-to-dispatch {
  border-color: #7f61b8;
  border-left: 4px solid #6846a2;
  background: #e4d9ff;
  color: #1e1435;
}

.load-card.load-loadstop-assigned {
  border-color: #bf7b00;
  border-left: 4px solid #9a6400;
  background: #fff0bd;
  color: #412900;
}

.load-card.load-dfw-ready-team {
  border-color: #b56a12;
  border-left: 4px solid #9a4f08;
  background: #ffe0a3;
  color: #482300;
  cursor: pointer;
}

.load-card.load-dfw-ready-team .ready-team-needs-load {
  color: #b91c1c;
  font-weight: 900;
}

.load-card.load-dfw-ready-team .ready-team-instruction-alert {
  color: #9a3412;
  font-weight: 900;
  opacity: 1;
}

.load-card.load-usps small,
.load-card.load-dhl small,
.load-card.load-other-customer small,
.load-card.load-high-value small,
.load-card.load-to-dispatch small,
.load-card.load-loadstop-assigned small,
.load-card.load-dfw-ready-team small {
  color: inherit;
  opacity: 0.88;
}

.dispatch-workflow-main {
  min-width: 0;
  padding: 0 28px 48px;
}

.dispatch-workflow-header {
  margin: 0 -28px 22px;
  padding: 22px 28px;
}

.dispatch-safety-banner {
  align-items: center;
  background: #eefbf2;
  border: 1px solid #7bdfa0;
  border-radius: 16px;
  color: #075b2c;
  display: flex;
  gap: 26px;
  margin-bottom: 20px;
  padding: 18px 22px;
}

.dispatch-kpis {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
}

.dispatch-kpis article {
  align-items: center;
  background: #fff;
  border: 2px solid #d8e1ef;
  border-radius: 16px;
  display: flex;
  gap: 14px;
  min-height: 88px;
  padding: 16px 20px;
}

.dispatch-kpis strong {
  font-size: 32px;
}

.dispatch-kpi-local { border-color: #8b6bc4 !important; }
.dispatch-kpi-assigned { border-color: #d49a2e !important; }
.dispatch-kpi-sent { border-color: #9aa5b1 !important; }
.dispatch-kpi-accepted { border-color: #45b979 !important; }

.dispatch-workflow-controls {
  align-items: center;
  background: #fff;
  border: 1px solid #d7e0ec;
  border-radius: 16px;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  margin-bottom: 16px;
  padding: 14px;
}

.dispatch-state-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.dispatch-state-tabs button.active {
  background: #2864e8;
  color: #fff;
}

#dispatchSearch {
  max-width: 430px;
  width: 100%;
}

.dispatch-message {
  border-radius: 12px;
  font-weight: 800;
  margin-bottom: 16px;
  padding: 14px 18px;
}

.dispatch-message.success {
  background: #dcfce7;
  border: 1px solid #6fd694;
  color: #075b2c;
}

.dispatch-message.error {
  background: #fee2e2;
  border: 1px solid #f2a2a2;
  color: #991b1b;
}

.dispatch-workflow-list {
  display: grid;
  gap: 14px;
}

.dispatch-workflow-list.is-loading {
  opacity: 0.6;
  pointer-events: none;
}

.dispatch-workflow-card {
  align-items: stretch;
  background: #fff;
  border: 2px solid #d8e1ef;
  border-left-width: 8px;
  border-radius: 16px;
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr) 230px;
  min-height: 152px;
  overflow: hidden;
}

.dispatch-state-local { border-color: #7650af; }
.dispatch-state-assigned { border-color: #c98200; }
.dispatch-state-sent { border-color: #a5adb6; background: #f3f4f6; }
.dispatch-state-accepted { border-color: #21a35b; background: #ecfdf3; }

.dispatch-card-status {
  align-items: center;
  background: rgba(255, 255, 255, 0.48);
  display: flex;
  font-size: 14px;
  font-weight: 900;
  justify-content: center;
  padding: 20px;
  text-align: center;
}

.dispatch-card-body {
  border-left: 1px solid rgba(100, 116, 139, 0.25);
  padding: 18px 22px;
}

.dispatch-card-heading {
  align-items: flex-start;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.dispatch-card-heading h2 {
  margin: 0 0 5px;
}

.dispatch-card-times {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  margin-top: 12px;
}

.dispatch-card-resources {
  font-weight: 800;
  margin: 10px 0 0;
}

.dispatch-request-details {
  color: #64748b;
  display: block;
  margin-top: 7px;
}

.dispatch-card-error {
  color: #b91c1c;
  font-weight: 800;
  margin: 8px 0 0;
}

.dispatch-card-action {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 18px;
}

.dispatch-primary-action,
.dispatch-send-action,
.dispatch-accept-action {
  min-height: 48px;
  width: 100%;
}

.dispatch-send-action {
  background: #d98c00;
  border-color: #b87400;
  color: #fff;
}

.dispatch-accept-action {
  background: #1fac62;
  border-color: #168248;
  color: #fff;
  margin-top: 10px;
}

.dispatch-pilot-note,
.dispatch-waiting-note,
.dispatch-accepted-note {
  color: #5f6b7a;
  font-weight: 800;
  text-align: center;
}

.dispatch-accepted-note {
  color: #08783a;
}

.dispatch-empty {
  background: #fff;
  border: 1px solid #d8e1ef;
  border-radius: 16px;
  color: #64748b;
  padding: 36px;
  text-align: center;
}

@media (max-width: 1050px) {
  .dispatch-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dispatch-workflow-card {
    grid-template-columns: 160px minmax(0, 1fr);
  }

  .dispatch-card-action {
    border-top: 1px solid #d8e1ef;
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  .dispatch-kpis {
    grid-template-columns: 1fr;
  }

  .dispatch-workflow-controls,
  .dispatch-safety-banner {
    align-items: stretch;
    flex-direction: column;
  }

  .dispatch-workflow-card {
    display: block;
  }
}

.load-card.connection-load-card {
  border-color: #e36f6f;
  border-left: 4px solid #ba1d1d;
  background: #ffe1e1;
  color: #8d1414;
}

.load-card.connection-load-card small {
  color: #8d1414;
}

.load-card.connection-load-card.is-not-needed {
  border-color: #cbd5e1;
  border-left-color: #64748b;
  background: #e5e7eb;
  color: #334155;
}

.load-card.connection-load-card.is-not-needed small {
  color: #475569;
}

.load-card.cancelled-load-card {
  border-color: #d76b6b;
  border-left: 4px solid #b42020;
  background: #ffdede;
  color: #8d1414;
}

.load-card.cancelled-load-card small {
  color: #8d1414;
}

.schedule-note-card {
  display: grid;
  width: 100%;
  min-width: 0;
  text-align: left;
  border: 1px solid #9ec5dc;
  border-color: color-mix(in srgb, var(--note-color, #24769f) 35%, #ffffff);
  border-left: 4px solid var(--note-color, #24769f);
  border-radius: 4px;
  background: var(--note-bg, #e8f6ff);
  color: #14384a;
  padding: 5px 6px;
  margin-bottom: 4px;
}

.schedule-note-card b {
  font-size: 10px;
  line-height: 1.1;
}

.schedule-note-card span {
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  white-space: normal;
  overflow-wrap: anywhere;
}

.load-card b,
.last-location b,
.moved-location-marker b,
.truck-status-card b {
  font-size: 10px;
  line-height: 1.12;
}

.load-card span,
.last-location span,
.moved-location-marker span,
.truck-status-card span {
  font-size: 11.5px;
  font-weight: 800;
  line-height: 1.15;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.load-card small,
.last-location small,
.moved-location-marker small,
.truck-status-card small {
  font-size: 9.5px;
  line-height: 1.18;
  color: #56625d;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.last-location {
  gap: 2px;
  border: 1px solid #e78f8f;
  border-left: 4px solid var(--need-line);
  background: var(--need);
  color: #9f1f1f;
  padding: 5px 6px;
}

.last-location small {
  color: #9f1f1f;
}

.moved-location-marker {
  gap: 2px;
  border: 1px solid #d9a900;
  border-left: 4px solid #d9a900;
  background: #fff4bd;
  color: #5d4300;
  padding: 5px 6px;
}

.moved-location-marker small {
  color: #5d4300;
}

.truck-status-card {
  gap: 2px;
  border: 1px solid #8f98a3;
  border-left: 4px solid #4f5965;
  background: #d8dde2;
  color: #202a33;
  padding: 5px 6px;
}

.load-card:hover,
.last-location:hover,
.moved-location-marker:hover,
.truck-status-card:hover,
.schedule-note-card:hover,
.home-reset-card:hover {
  outline: 2px solid rgba(16, 24, 32, 0.14);
  outline-offset: 0;
}

.truck-status-card small {
  color: #4f5965;
}

.truck-ready-location {
  border-color: #d87d7d;
  background: #ffe0e0;
}

.home-reset-card {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 42px;
  gap: 1px;
  align-content: center;
  border: 1px solid #b969bd;
  border-left: 4px solid #8a3d90;
  border-radius: 4px;
  background: #d183d4;
  color: #111111;
  padding: 4px 18px 4px 6px;
}

.home-reset-card b {
  font-size: 10px;
  line-height: 1.1;
}

.home-reset-card span {
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.home-reset-card small {
  font-size: 9px;
  line-height: 1.15;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.home-reset-remove {
  position: absolute;
  right: 3px;
  top: 2px;
  border: 0;
  background: transparent;
  padding: 1px 3px;
  color: #111111;
  font-size: 12px;
  line-height: 1;
}

.empty {
  padding: 16px;
}

.loading-state {
  color: #53605d;
  font-weight: 800;
}

.error {
  color: #b42020;
}

.resource-panel {
  position: sticky;
  top: 12px;
  max-height: calc(100vh - 174px);
  overflow: auto;
  padding: 8px;
  margin-bottom: 0;
}

.resource-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  margin-bottom: 7px;
}

.resource-tabs button {
  padding: 7px 5px;
  font-size: 12px;
}

.resource-tabs button.active {
  color: white;
  background: var(--green);
  border-color: var(--green);
}

#resourceSearch {
  width: 100%;
  margin-bottom: 7px;
}

.resource-filters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 7px;
}

.schedule-modern-page .resource-date-range-field {
  grid-column: 1 / -1;
  min-width: 0;
}

.schedule-modern-page .resource-date-range-field .jitc-calendar-field {
  width: 100%;
  min-width: 0;
}

.schedule-modern-page .resource-date-range-field .jitc-calendar-trigger {
  white-space: nowrap;
}

.resource-filter-field {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.resource-filter-field span {
  color: #4e625d;
  font-size: 10px;
  font-weight: 800;
}

.resource-filter-field input,
.resource-filter-field select,
.resource-filter-field summary,
.resource-filters > input,
.resource-filters > select {
  min-width: 0;
  width: 100%;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
}

.resource-filter-field summary {
  display: flex;
  align-items: center;
  cursor: pointer;
  list-style: none;
}

.resource-filter-field summary::-webkit-details-marker {
  display: none;
}

.resource-filter-field summary::after {
  content: "v";
  margin-left: auto;
  color: #647a73;
  font-size: 10px;
}

.multi-filter {
  position: relative;
}

.multi-filter-menu {
  position: absolute;
  z-index: 20;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 260px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(20, 35, 30, 0.18);
  padding: 6px;
}

.resource-state-search {
  width: 100%;
  min-height: 28px;
  margin-bottom: 6px;
  padding: 5px 7px;
  border: 1px solid #b7c8c2;
  border-radius: 0;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.multi-filter-menu label {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 3px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.multi-filter-menu label[hidden] {
  display: none !important;
}

.multi-filter-menu .resource-state-select-all {
  border-bottom: 1px solid #e3ebe7;
  margin-bottom: 4px;
  padding-bottom: 6px;
}

.multi-filter-menu input {
  width: auto;
  min-height: auto;
  padding: 0;
}

.resource-match-context {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid #c6d8d0;
  background: #edf7f2;
  border-radius: 6px;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.25;
}

.resource-match-context button {
  padding: 4px 8px;
  font-size: 11px;
}

.resource-summary {
  border: 1px solid #c6d8d0;
  background: #edf7f2;
  border-radius: 6px;
  padding: 8px;
  margin-bottom: 7px;
  font-size: 13px;
  font-weight: 800;
}

.resource-list {
  display: grid;
  gap: 5px;
}

.panel-card {
  display: grid;
  gap: 2px;
  width: 100%;
  text-align: left;
  padding: 7px 8px;
  border-left: 4px solid var(--load-line);
}

.panel-card[draggable="true"] {
  cursor: grab;
}

.panel-card[draggable="true"]:active {
  cursor: grabbing;
}

.panel-card.schedule-load-dragging {
  opacity: 0.5;
}

.truck.schedule-load-drop-target {
  box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.9), 1px 0 0 rgba(16, 24, 32, 0.1);
}

.cell.schedule-load-drop-target {
  background: #e7f3ff;
  box-shadow: inset 0 0 0 2px #2764ed;
}

.cell.today-cell.schedule-load-drop-target {
  background: #e7f3ff;
  box-shadow: inset 0 0 0 2px #2764ed;
}

.panel-card b {
  font-size: 13px;
  line-height: 1.15;
}

.panel-card span {
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
}

.panel-card small,
.panel-card em {
  color: #53605d;
  font-size: 10px;
  font-style: normal;
  line-height: 1.2;
}

.panel-empty {
  color: #66736f;
  font-size: 13px;
  padding: 8px;
}

.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(16, 24, 32, 0.36);
}

.modal-overlay[hidden] {
  display: none;
}

.modal-panel {
  position: relative;
  width: min(720px, 100%);
  max-height: 86vh;
  overflow: auto;
  background: white;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  box-shadow: 0 16px 50px rgba(0, 0, 0, 0.22);
}

.modal-close {
  position: absolute;
  right: 14px;
  top: 14px;
}

.eyebrow {
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
  margin: 0 0 4px;
}

.modal-panel h2 {
  margin: 0 0 14px;
  font-size: 22px;
}

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

.detail-grid div {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  background: #fbfcf8;
}

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

.detail-grid span {
  display: block;
  color: #52605c;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 4px;
}

.detail-grid strong {
  display: block;
  font-size: 14px;
  line-height: 1.35;
}

.connection-detail-grid small {
  display: block;
  margin-top: 4px;
  color: #52605c;
  line-height: 1.35;
}

.load-detail-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.load-detail-toolbar h3 {
  margin: 0;
  font-size: 16px;
}

.load-detail-toolbar label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #52605c;
  font-size: 12px;
  font-weight: 800;
}

.match-list {
  display: grid;
  gap: 7px;
  margin-top: 8px;
}

.match-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid #b8d7cc;
  border-left: 4px solid var(--green);
  border-radius: 6px;
  background: #f4fbf7;
  padding: 8px 10px;
}

.match-card.match-risk {
  border-color: #e2bd73;
  border-left-color: #d18b00;
  background: #fff8e6;
}

.match-card b,
.match-card span,
.match-card small {
  display: block;
}

.match-card b {
  font-size: 14px;
}

.match-card span {
  font-size: 12px;
  font-weight: 800;
}

.match-card small {
  color: #52605c;
  font-size: 11px;
}

.match-meta {
  min-width: 116px;
  text-align: right;
}

.empty-location-card small {
  display: block;
  margin-top: 3px;
  color: #52605c;
  font-size: 13px;
  font-weight: 800;
}

.empty-location-edit {
  display: grid;
  gap: 6px;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}

.primary-action {
  color: white;
  background: var(--green);
  border-color: var(--green);
}

.danger-action {
  color: white;
  background: #a92222;
  border-color: #a92222;
}

.empty-move-form {
  display: grid;
  gap: 10px;
}

.empty-move-form .detail-grid label,
.truck-status-form .detail-grid label,
.truck-status-eta-form .detail-grid label,
.truck-ready-form .detail-grid label {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  background: #fbfcf8;
}

.empty-move-form .wide-field,
.truck-status-form .wide-field,
.truck-status-eta-form .wide-field,
.truck-ready-form .wide-field {
  grid-column: 1 / -1;
}

.truck-status-form .checkbox-field,
.truck-ready-form .checkbox-field {
  display: flex;
  align-items: center;
  gap: 8px;
}

.truck-status-form .checkbox-field input,
.truck-ready-form .checkbox-field input {
  width: auto;
}

.truck-status-form,
.truck-status-note-form,
.truck-status-eta-form,
.truck-ready-form {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.truck-status-eta-form,
.truck-ready-form {
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.truck-status-eta-form h3,
.truck-ready-form h3 {
  margin: 0;
}

.status-notes-panel {
  margin-top: 10px;
}

.form-hint {
  margin-top: 2px;
  font-size: 13px;
  color: #53605d;
}

@media (max-width: 900px) {
  body {
    grid-template-columns: var(--sidebar-collapsed-width) 1fr;
  }

  .detail-grid {
    grid-template-columns: 1fr;
  }

  .sidebar-brand {
    grid-template-columns: 1fr;
    justify-items: center;
    min-height: 58px;
    padding: 10px 0;
  }

  .brand-mark,
  .brand-text,
  .nav-label,
  .nav-section-title,
  .nav-chevron,
  .nav-submenu,
  .sidebar-account span,
  .sidebar-account small,
  .sidebar-account button {
    display: none;
  }

  .sidebar-nav {
    padding: 10px 7px;
    gap: 7px;
    overflow-x: hidden;
  }

  .nav-section {
    gap: 5px;
  }

  .nav-section + .nav-section {
    padding-top: 8px;
  }

  .nav-item {
    grid-template-columns: 1fr;
    justify-items: center;
    min-height: 42px;
    padding: 0;
    border-left: 0;
  }

  .nav-icon {
    width: 32px;
    height: 32px;
  }

  .nav-icon svg {
    width: 22px;
    height: 22px;
  }

  .nav-badge {
    position: absolute;
    top: 3px;
    right: 5px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    font-size: 9px;
  }

  .sidebar-account {
    min-height: 52px;
    padding: 10px 0;
    justify-items: center;
  }

  .sidebar-account::before {
    content: "";
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.24);
  }

  .dashboard-layout {
    grid-template-columns: 1fr;
  }

  .resource-panel {
    position: static;
    max-height: none;
  }

  .user-toolbar-actions,
  .user-modal-grid {
    grid-template-columns: 1fr;
  }

  .user-toolbar-actions {
    display: grid;
  }

  .user-filter-bar {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .user-filter-bar label {
    grid-column: 1 / -1;
    margin-left: 0;
  }

  .user-detail-grid {
    grid-template-columns: 1fr;
  }

  .access-profile-layout,
  .access-profile-fields,
  .permission-checks {
    grid-template-columns: 1fr;
  }

  .access-profile-editor-head {
    display: grid;
  }
}

.routing-controls {
  display: flex;
  align-items: end;
  gap: 12px;
  padding: 9px 10px;
  margin-bottom: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.78);
}

.routing-window {
  min-height: 37px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border: 1px solid #d6dfd3;
  border-radius: 6px;
  background: #f9fbf5;
  font-weight: 700;
  color: #32423d;
}

.routing-layout {
  display: grid;
  grid-template-columns: minmax(720px, 1fr) 300px;
  gap: 8px;
  align-items: start;
}

.routing-loads-panel,
.routing-resource-panel {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.64);
}

.routing-loads-panel {
  padding: 8px;
}

.routing-resource-panel {
  position: sticky;
  top: 10px;
  display: grid;
  gap: 8px;
  padding: 8px;
  max-height: calc(100vh - 20px);
  overflow: auto;
}

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

.routing-panel-head h2,
.routing-group h3 {
  margin: 0;
}

.routing-panel-head h2 {
  font-size: 17px;
}

.routing-panel-head span {
  color: #53605d;
  font-weight: 700;
}

.routing-group {
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
}

.routing-group h3 {
  padding: 4px 7px;
  background: #e7eee6;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 13px;
}

.routing-load-list {
  display: grid;
  gap: 5px;
}

.routing-load-card {
  display: grid;
  grid-template-columns: minmax(245px, 0.95fr) minmax(420px, 1.55fr) auto;
  gap: 4px 8px;
  align-items: center;
  border: 1px solid #dfc06a;
  border-left: 4px solid #d18816;
  border-radius: 6px;
  background: #fff4cf;
  padding: 6px 8px;
}

.routing-load-card.priority {
  border-color: #d9912a;
  background: #fff0bd;
}

.routing-load-card.ready-confirm {
  border-color: #9f8bd3;
  border-left-color: #6846a2;
  background: #f3edff;
}

.routing-load-card.split-yard-leg {
  border-color: #7fb4aa;
  border-left-color: #0f7f72;
  background: #ecfaf6;
}

.routing-load-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 1px 5px;
  border: 1px solid #7fb4aa;
  border-radius: 4px;
  background: #d8f2ea;
  color: #0e5d54;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.3;
  vertical-align: middle;
}

.routing-load-card header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.routing-load-card h3 {
  display: inline-block;
  margin: 1px 0 0;
  padding: 2px 5px;
  border: 1px solid #c9d8d3;
  border-radius: 5px;
  background: #e7f0ec;
  font-size: 13px;
  line-height: 1.15;
}

.routing-load-card header span {
  color: #6a5d34;
  font-weight: 700;
  font-size: 12px;
  text-align: right;
  white-space: nowrap;
}

.routing-load-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  color: #5e675f;
  font-size: 11px;
  line-height: 1.2;
}

.routing-slots {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  grid-column: 2;
  grid-row: 1 / span 2;
  gap: 5px;
}

.routing-load-actions {
  display: flex;
  justify-content: flex-end;
  grid-column: 3;
  grid-row: 1 / span 2;
  gap: 6px;
}

.routing-load-actions button {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.broker-out-panel {
  margin-top: 10px;
}

.broker-load-list {
  display: grid;
  justify-items: center;
  overflow-x: auto;
}

.broker-load-list .routing-group {
  width: fit-content;
  max-width: 100%;
}

.broker-main-table {
  width: fit-content;
  min-width: 1100px;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid #d9e1ea;
  border-radius: 6px;
  background: white;
}

.broker-main-head,
.broker-main-row {
  display: grid;
  grid-template-columns: 60px 230px 230px 185px 250px 96px;
}

.broker-main-head {
  background: #f1f1f4;
  color: #8b86a3;
  font-size: 11px;
  font-weight: 700;
}

.broker-main-head div,
.broker-main-row > div {
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
  padding: 2px 5px;
  border-right: 1px solid #e2e7ee;
}

.broker-main-head div:last-child,
.broker-main-row > div:last-child {
  border-right: 0;
}

.broker-main-item {
  border-bottom: 1px dashed #cddbea;
  background: #fff7df;
  cursor: pointer;
}

.broker-main-item:last-child {
  border-bottom: 0;
}

.broker-main-row {
  color: #192a40;
  font-size: 13px;
  line-height: 1.12;
}

.broker-main-row strong,
.broker-main-row p {
  margin: 0;
}

.broker-main-pickup,
.broker-main-delivery {
  gap: 1px;
  justify-items: center !important;
  text-align: center !important;
  font-weight: 800;
  line-height: 1.1;
}

.broker-main-pickup > strong,
.broker-main-delivery > strong {
  display: block;
}

.broker-load-link button {
  border: 0;
  background: transparent;
  padding: 0;
  color: #0057a8;
  font: inherit;
  font-weight: 800;
  text-decoration: underline;
  cursor: pointer;
}

.broker-main-requirements {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  align-items: center;
  justify-items: center;
}

.broker-main-requirements .broker-requirements {
  grid-column: auto;
  grid-row: auto;
  gap: 0;
  font-size: 11px;
  line-height: 1.1;
}

.broker-main-requirements .broker-requirements strong {
  font-size: 12px;
}

.broker-main-note {
  min-width: 0;
}

.broker-main-note button {
  width: auto;
  max-width: 100%;
  border: 1px solid transparent;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.38);
  color: #26352f;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.15;
  padding: 3px 6px;
  min-height: 24px;
}

.broker-main-note button:hover {
  border-color: #b9c9c1;
  background: #ffffff;
}

.broker-main-action button {
  min-height: 32px;
  padding: 4px 7px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.1;
  white-space: normal;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 1px;
  width: auto;
  min-width: 78px;
}

.broker-main-action button span {
  display: block;
}

.broker-source-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 4px 8px;
  border-radius: 5px;
  background: #eef1ff;
  color: #264288;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
  text-align: center;
}

.broker-out-page main,
.broker-out-page main *,
.broker-out-page strong,
.broker-out-page b,
.broker-out-page button,
.broker-out-page input,
.broker-out-page select {
  letter-spacing: 0;
}

.broker-middle-stop-row {
  background: #f8fcff;
  color: #41515f;
}

.broker-middle-stop-row > div {
  border-top: 1px solid #e6edf3;
}

.broker-wide-cell {
  grid-column: span 2;
}

.broker-load-card {
  grid-template-columns: minmax(280px, 0.95fr) minmax(260px, 0.82fr) minmax(210px, 0.55fr);
  background: #fff7df;
  cursor: pointer;
}

.broker-load-card header {
  grid-column: 1;
}

.broker-load-card .routing-load-meta {
  grid-column: 1;
}

.broker-requirements {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid;
  align-content: center;
  gap: 1px;
  min-width: 0;
  color: #17231f;
  font-size: 11px;
  line-height: 1.16;
}

.broker-requirements strong {
  font-size: 12px;
  color: #07110e;
}

.broker-notes {
  display: grid;
  gap: 4px;
}

.broker-note,
.broker-note-empty {
  border: 1px solid #d6dfd5;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.72);
  padding: 4px 6px;
  color: #48524d;
  font-size: 11px;
  line-height: 1.2;
}

.broker-note {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 8px;
}

.broker-note span {
  color: #6d7770;
  white-space: nowrap;
}

.broker-note p {
  grid-column: 1 / -1;
  margin: 0;
}

.broker-notes-panel {
  display: grid;
  gap: 6px;
  justify-items: center;
}

.broker-latest-note {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  color: #17231f;
  font-size: 12px;
  line-height: 1.25;
}

.broker-latest-note span {
  color: #52605c;
  font-weight: 700;
}

.broker-latest-note strong {
  display: inline;
  color: #07110e;
  font-size: 12px;
}

.broker-latest-note button {
  border: 0;
  background: transparent;
  color: var(--green);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  padding: 0;
}

.broker-latest-note button:hover {
  text-decoration: underline;
}

.broker-older-notes {
  display: grid;
  gap: 5px;
  width: min(520px, 100%);
}

.broker-older-notes[hidden] {
  display: none;
}

.broker-actions {
  grid-column: 3;
  grid-row: 1 / span 2;
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  align-content: center;
  align-items: center;
}

.broker-actions > div {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}

.broker-actions button {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.broker-detail-modal {
  width: min(880px, 100%);
  text-align: center;
}

.broker-detail-modal .eyebrow,
.broker-detail-modal h2 {
  text-align: center;
}

.broker-detail-grid pre {
  margin: 0;
  white-space: pre-wrap;
  font: inherit;
  font-size: 12px;
  color: #17231f;
}

.broker-detail-grid > div {
  text-align: center;
}

.broker-detail-grid > div > span {
  text-align: center;
}

.broker-stop-table {
  display: grid;
  grid-template-columns: 88px 84px minmax(185px, 1fr) 84px minmax(185px, 1fr);
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: white;
}

.broker-stop-head,
.broker-stop-cell {
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: white;
  padding: 8px 10px;
}

.broker-stop-head {
  background: #f1f1f4;
  color: #8b86a3;
  font-size: 11px;
  font-weight: 700;
}

.broker-stop-cell {
  border-top: 1px solid #dbe3ed;
}

.broker-stop-table div:nth-child(5n) {
  border-right: 0;
}

.broker-stop-table strong {
  display: block;
  color: #192a40;
  font-size: 12px;
  line-height: 1.25;
}

.broker-stop-table p {
  margin: 2px 0 0;
  color: #192a40;
  font-size: 12px;
  line-height: 1.25;
}

.broker-stop-timeline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  padding: 0;
}

.detail-grid .broker-stop-timeline,
.detail-grid .broker-stop-timeline div {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
}

.detail-grid .broker-stop-timeline {
  border: 1px solid var(--line);
  padding: 0;
}

.detail-grid .broker-stop-timeline .broker-timeline-stop {
  position: relative;
  min-height: 148px;
  border: 0;
  border-right: 1px solid #dbe3ed;
  padding: 10px 12px 12px;
  text-align: center;
}

.detail-grid .broker-stop-timeline .broker-timeline-stop:last-child {
  border-right: 0;
}

.broker-timeline-title {
  border: 0;
  padding: 0;
  color: #5c6661;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.broker-timeline-marker {
  position: relative;
  border: 0;
  height: 28px;
  margin: 4px 0 8px;
  padding: 0;
}

.broker-timeline-marker::before {
  content: "";
  position: absolute;
  left: 50%;
  right: -50%;
  top: 13px;
  height: 1px;
  background: #ccd6d0;
}

.broker-timeline-stop:last-child .broker-timeline-marker::before {
  right: 0;
}

.broker-timeline-marker span {
  position: relative;
  z-index: 1;
  display: block;
  width: 22px;
  height: 22px;
  border: 4px solid #202525;
  border-radius: 50%;
  background: #fff;
  margin: 0 auto;
}

.broker-timeline-stop strong {
  color: #07110e;
  font-size: 13px;
  line-height: 1.25;
}

.broker-timeline-stop p {
  margin: 3px 0 0;
  color: #111b18;
  font-size: 12px;
  line-height: 1.25;
}

.broker-timeline-appt {
  display: grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  justify-content: center;
  gap: 10px;
  border: 0;
  padding: 0;
  margin-top: 12px;
}

.broker-timeline-appt span {
  margin: 0;
  color: #111b18;
  font-size: 12px;
  font-weight: 500;
}

.broker-timeline-appt strong {
  font-size: 12px;
  font-weight: 500;
}

.broker-load-number-cell strong {
  font-size: 14px;
}

.broker-date-cell strong {
  font-weight: 500;
}

.broker-detail-grid .broker-requirements {
  grid-column: auto;
  grid-row: auto;
  margin-top: 3px;
}

.modal-broker-notes {
  max-height: 180px;
  overflow: auto;
  margin-top: 4px;
}

.broker-modal-actions {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.broker-modal-actions textarea {
  min-height: 66px;
  resize: vertical;
  border: 1px solid #c7d4c7;
  border-radius: 5px;
  padding: 7px 9px;
  font: inherit;
  font-size: 12px;
}

.broker-modal-actions > div {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
}

.routing-slot {
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 5px 7px;
  border: 1px dashed #aab8aa;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.74);
  color: #54615b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.15;
  min-width: 0;
}

.routing-slot span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.routing-slot.filled {
  border-style: solid;
  background: #e2f1eb;
  color: #102c23;
}

.routing-slot.drag-over {
  outline: 2px solid var(--green);
  background: #d6f0e5;
}

.routing-slot button {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  padding: 0;
  border-radius: 4px;
  color: #456056;
  font-size: 12px;
}

.routing-resource-list {
  max-height: none;
}

.routing-resource-card {
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--green);
  border-radius: 6px;
  background: #fafdf7;
  cursor: grab;
}

.routing-resource-card:active {
  cursor: grabbing;
}

.routing-resource-card strong {
  font-size: 12px;
}

.routing-resource-card span,
.routing-resource-card small {
  color: #50605a;
  font-size: 11px;
}

.driver-detail-trigger {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  padding: 0;
  text-align: left;
  cursor: pointer;
}

.driver-detail-trigger:hover,
.driver-detail-trigger:focus-visible {
  color: #155bd7;
  text-decoration: underline;
}

.driver-card-latest-note {
  color: #244f3b !important;
  font-weight: 700;
}

.routing-resource-card.driver-profile-card {
  cursor: pointer;
}

.routing-resource-card.driver-profile-card:hover,
.routing-resource-card.driver-profile-card:focus-visible {
  border-color: #6ba489;
  box-shadow: 0 0 0 3px rgba(52, 125, 94, 0.12);
  outline: none;
}

.driver-resource-select {
  justify-self: start;
  margin-top: 5px;
  padding: 4px 8px;
  border: 1px solid #9db7d3;
  border-radius: 6px;
  background: #f1f6fc;
  color: #174a82;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}

.driver-resource-select:hover,
.driver-resource-select:focus-visible {
  border-color: #347d5e;
  background: #e8f6ef;
  color: #245c46;
}

.driver-detail-panel {
  width: min(720px, calc(100vw - 32px));
}

.driver-detail-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}

.driver-detail-summary > div {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfd;
  padding: 9px 10px;
}

.driver-detail-summary > div.wide {
  grid-column: 1 / -1;
}

.driver-detail-summary dt {
  color: #627386;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.driver-detail-summary dd {
  margin: 3px 0 0;
  color: #13253a;
  font-size: 13px;
  font-weight: 700;
}

.driver-detail-notes {
  display: grid;
  gap: 8px;
}

.driver-detail-notes h3 {
  margin: 4px 0;
}

.driver-detail-notes article {
  border-left: 4px solid #4b8d68;
  border-radius: 7px;
  background: #f1f8f4;
  padding: 9px 11px;
}

.driver-detail-notes article p {
  margin: 0 0 4px;
  white-space: pre-wrap;
}

.driver-detail-notes article small {
  color: #607080;
}

.driver-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(145px, auto) repeat(5, auto);
  gap: 6px;
  align-items: end;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 7px 8px;
  margin-bottom: 6px;
}

.driver-filters input[type="search"] {
  min-width: 220px;
}

.driver-filter-check {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  white-space: nowrap;
}

.driver-export-btn {
  white-space: nowrap;
  align-self: end;
  background: var(--green);
  border-color: var(--green);
  color: #ffffff;
  font-weight: 700;
}

.driver-export-btn:hover {
  background: #0f684d;
  border-color: #0f684d;
}

.driver-list {
  display: grid;
  gap: 4px;
}

.driver-card {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid var(--line);
  border-left: 4px solid #d18816;
  border-radius: 6px;
  padding: 6px 8px;
}

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

.driver-card h3 {
  margin: 0 0 2px;
  font-size: 13px;
  line-height: 1.2;
}

.driver-source-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  border-radius: 5px;
  background: #e2f0ff;
  color: #155b9c;
  font-size: 11px;
  font-weight: 800;
  vertical-align: middle;
}

.driver-meta,
.driver-load-line {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 8px;
  color: #4c5c57;
  font-size: 11px;
  line-height: 1.25;
}

.driver-load-line {
  margin-top: 3px;
  font-weight: 700;
}

.driver-confirm-line {
  margin-top: 2px;
  color: #1b7358;
  font-size: 11px;
  font-weight: 800;
}

.driver-badge {
  align-self: start;
  white-space: nowrap;
  border-radius: 4px;
  padding: 3px 6px;
  font-size: 10px;
  font-weight: 800;
  background: #fff0c4;
  color: #7b4d00;
}

.driver-badge.available {
  background: #dff1e8;
  color: var(--green);
}

.driver-badge.on_load {
  background: #dfeafa;
  color: #195e9f;
}

.driver-badge.vacation {
  background: #f1def6;
  color: #78408b;
}

.driver-badge.away_from_home {
  background: #f7e3c4;
  color: #8a4b00;
}

.driver-badge.dns,
.driver-badge.unresponsive {
  background: #f8d9d9;
  color: var(--need-line);
}

.driver-notes {
  margin-top: 3px;
  font-size: 11px;
  color: #4c5c57;
  line-height: 1.25;
}

.driver-latest-note {
  display: inline;
  margin-right: 6px;
}

.driver-notes-empty {
  color: #77837f;
}

.driver-all-notes {
  display: grid;
  gap: 3px;
  margin-top: 5px;
  padding: 6px 8px;
  border-radius: 6px;
  background: #f4f6f1;
  border: 1px solid #d8e0d5;
}

.driver-all-notes[hidden],
.open-truck-all-notes[hidden] {
  display: none;
}

.text-action {
  border: 0;
  background: transparent;
  color: var(--green);
  padding: 0;
  font-size: 11px;
  font-weight: 800;
}

.driver-inline-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) repeat(5, auto);
  gap: 5px;
  align-items: end;
  margin-top: 5px;
  padding-top: 5px;
  border-top: 1px solid #d9e1d6;
}

.driver-inline-form input {
  padding: 5px 7px;
}

.driver-inline-form button {
  min-height: 30px;
  padding: 5px 8px;
  font-size: 11px;
}

.driver-note-field {
  min-width: 180px;
}

.driver-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px;
}

.driver-checkin-modern-page main {
  background: #f3f6fb;
}

.driver-checkin-modern-page .driver-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 14px;
  margin: 0 0 14px;
}

.driver-checkin-modern-page .driver-kpi-card {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 82px;
  padding: 16px;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

.driver-checkin-modern-page .driver-kpi-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 14px;
  background: #dbeafe;
  color: #2563eb;
  font-size: 11px;
  font-weight: 900;
}

.driver-checkin-modern-page .driver-kpi-card strong {
  display: block;
  color: #0f172a;
  font-size: 22px;
  line-height: 1;
}

.driver-checkin-modern-page .driver-kpi-card span:last-child {
  display: block;
  margin-top: 5px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.driver-checkin-modern-page .driver-kpi-card.green .driver-kpi-icon {
  background: #dcfce7;
  color: #059669;
}

.driver-checkin-modern-page .driver-kpi-card.red .driver-kpi-icon {
  background: #ffe4e6;
  color: #e11d48;
}

.driver-checkin-modern-page .driver-kpi-card.purple .driver-kpi-icon {
  background: #ede9fe;
  color: #7c3aed;
}

.driver-checkin-modern-page .driver-filters {
  grid-template-columns: minmax(300px, 1.6fr) auto repeat(4, minmax(120px, auto)) auto;
  gap: 12px;
  align-items: end;
  margin: 0 0 12px;
  padding: 14px;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

.driver-checkin-modern-page .driver-filters label {
  color: #475569;
  font-size: 11px;
  font-weight: 850;
}

.driver-checkin-modern-page .driver-filters input,
.driver-checkin-modern-page .driver-filters select {
  min-height: 40px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
}

.driver-checkin-modern-page .driver-filters input[type="search"] {
  min-width: 300px;
  padding-left: 14px;
}

.driver-checkin-modern-page .driver-filter-check {
  min-height: 40px;
  border-color: #dbe3ef;
  border-radius: 10px;
  color: #334155;
  font-weight: 850;
}

.driver-checkin-modern-page .driver-export-btn {
  min-height: 40px;
  border-color: #10b981;
  border-radius: 10px;
  background: #ffffff;
  color: #047857;
  box-shadow: none;
}

.driver-checkin-modern-page #driverSummary {
  margin: 0 0 10px;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: #334155;
  font-weight: 850;
}

.driver-checkin-modern-page .driver-list {
  gap: 8px;
}

.driver-checkin-modern-page .driver-check-card {
  position: relative;
  display: grid;
  grid-template-columns: 96px minmax(300px, 1fr) minmax(560px, 1.7fr);
  gap: 14px;
  align-items: center;
  min-height: 94px;
  padding: 14px;
  border: 1px solid #dbe3ef;
  border-left: 4px solid #f59e0b;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045);
}

.driver-checkin-modern-page .driver-check-card:hover {
  background: #f8fbff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.07);
}

.driver-checkin-modern-page .driver-check-card.ready {
  border-left-color: #10b981;
}

.driver-checkin-modern-page .driver-check-card.unresponsive {
  border-left-color: #ef4444;
}

.driver-checkin-modern-page .driver-check-card.called {
  border-left-color: #8b5cf6;
}

.driver-checkin-modern-page .driver-status-mark {
  display: inline-flex;
  min-width: 78px;
  min-height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border-radius: 999px;
  background: #fef3c7;
  color: #d97706;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.driver-checkin-modern-page .driver-check-card.ready .driver-status-mark {
  background: #dcfce7;
  color: #059669;
}

.driver-checkin-modern-page .driver-check-card.unresponsive .driver-status-mark {
  background: #ffe4e6;
  color: #e11d48;
}

.driver-checkin-modern-page .driver-check-card.called .driver-status-mark {
  background: #ede9fe;
  color: #7c3aed;
}

.driver-checkin-modern-page .driver-name-line {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.driver-checkin-modern-page .driver-name-line h3 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
  line-height: 1.2;
}

.driver-checkin-modern-page .driver-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 4px 12px;
  margin-top: 7px;
  color: #475569;
  font-size: 12px;
}

.driver-checkin-modern-page .driver-info-grid b {
  color: #64748b;
  font-weight: 850;
}

.driver-checkin-modern-page .driver-badge {
  border-radius: 999px;
  padding: 4px 8px;
  background: #fef3c7;
  color: #b45309;
  font-size: 10px;
}

.driver-checkin-modern-page .driver-badge.available {
  background: #dcfce7;
  color: #047857;
}

.driver-checkin-modern-page .driver-badge.unresponsive,
.driver-checkin-modern-page .driver-badge.dns {
  background: #ffe4e6;
  color: #be123c;
}

.driver-checkin-modern-page .driver-notes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: 8px;
}

.driver-checkin-modern-page .driver-latest-note,
.driver-checkin-modern-page .driver-notes-empty,
.driver-checkin-modern-page .text-action {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
}

.driver-checkin-modern-page .text-action {
  border: 0;
  background: #eff6ff;
  color: #2563eb;
}

.driver-checkin-modern-page .driver-all-notes {
  flex-basis: 100%;
  border-color: #dbe3ef;
  border-radius: 10px;
  background: #f8fafc;
}

.driver-checkin-modern-page .driver-check-actions {
  min-width: 0;
}

.driver-checkin-modern-page .driver-inline-form {
  display: grid;
  grid-template-columns: 132px 110px minmax(180px, 1fr) repeat(6, auto);
  gap: 8px;
  align-items: end;
  margin: 0;
  padding: 0;
  border: 0;
}

.driver-checkin-modern-page .driver-inline-form label {
  display: grid;
  gap: 4px;
  color: #475569;
  font-size: 11px;
  font-weight: 850;
}

.driver-checkin-modern-page .driver-inline-form input {
  min-height: 38px;
  padding: 7px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  font-size: 12px;
}

.driver-checkin-modern-page .driver-inline-form button,
.driver-checkin-modern-page .driver-call-btn {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  padding: 0 12px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font-size: 12px;
  font-weight: 850;
  text-decoration: none;
  white-space: nowrap;
}

.driver-checkin-modern-page .driver-inline-form .primary-action {
  border-color: #2563eb;
  background: #2563eb;
  color: #ffffff;
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.18);
}

.driver-checkin-modern-page .driver-inline-form [data-action="dns"] {
  color: #be123c;
}

.driver-checkin-modern-page .driver-inline-form [data-action="unresponsive"] {
  color: #b45309;
}

.driver-checkin-modern-page .driver-call-btn {
  border-color: #fde68a;
  background: #fef3c7;
  color: #b45309;
}

.driver-checkin-modern-page .driver-call-btn.disabled {
  color: #94a3b8;
  pointer-events: none;
}

.driver-checkin-modern-page .driver-pager {
  justify-content: space-between;
  margin-top: 10px;
  padding: 14px 16px;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #ffffff;
  color: #475569;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045);
}

.driver-checkin-modern-page .driver-pager div {
  display: inline-flex;
  gap: 8px;
  align-items: center;
}

.driver-checkin-modern-page .driver-pager b,
.driver-checkin-modern-page .driver-pager button {
  display: grid;
  min-width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 10px;
}

.driver-checkin-modern-page .driver-pager b {
  background: #2563eb;
  color: #ffffff;
}

@media (max-width: 1500px) {
  .driver-checkin-modern-page .driver-kpi-grid {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .driver-checkin-modern-page .driver-filters {
    grid-template-columns: repeat(4, minmax(140px, 1fr));
  }

  .driver-checkin-modern-page .driver-filters input[type="search"] {
    grid-column: span 2;
  }

  .driver-checkin-modern-page .driver-check-card {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  .driver-checkin-modern-page .driver-check-actions {
    grid-column: 2;
  }

  .driver-checkin-modern-page .driver-inline-form {
    grid-template-columns: repeat(3, minmax(120px, 1fr)) repeat(6, auto);
  }
}

/* Settings: active Samsara-to-Planning driver mapping. */
.samsara-mapping-page main {
  max-width: none;
}

.samsara-mapping-topbar {
  align-items: flex-start;
}

.samsara-mapping-topbar .eyebrow {
  margin-bottom: 4px;
}

.samsara-mapping-message {
  margin: 0 0 14px;
  padding: 12px 16px;
  border: 1px solid #bfdbfe;
  border-radius: 12px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
}

.samsara-mapping-message.is-success {
  border-color: #86efac;
  background: #f0fdf4;
  color: #15803d;
}

.samsara-mapping-message.is-error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b42318;
}

.samsara-mapping-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.samsara-mapping-summary button,
.samsara-mapping-summary article {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 14px 18px;
  border: 1px solid #d9e3f1;
  border-radius: 15px;
  background: #fff;
  color: #334155;
  text-align: left;
}

.samsara-mapping-summary button {
  cursor: pointer;
}

.samsara-mapping-summary button.is-active {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.samsara-mapping-summary strong {
  min-width: 38px;
  color: #0f172a;
  font-size: 26px;
}

.samsara-mapping-summary span {
  font-weight: 800;
}

.samsara-mapping-panel {
  overflow: hidden;
  border: 1px solid #d9e3f1;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.samsara-mapping-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
}

.samsara-mapping-toolbar label {
  display: grid;
  flex: 1;
  max-width: 720px;
  gap: 7px;
  font-weight: 800;
}

.samsara-mapping-toolbar input,
.planning-driver-cell select {
  width: 100%;
  min-height: 46px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  font: inherit;
}

.samsara-mapping-toolbar input {
  padding: 0 13px;
}

.samsara-mapping-warning {
  margin: 0 18px 10px;
  padding: 10px 13px;
  border: 1px solid #fde68a;
  border-radius: 10px;
  background: #fffbeb;
  color: #92400e;
  font-weight: 700;
}

.samsara-mapping-table-head,
.samsara-mapping-row {
  display: grid;
  grid-template-columns: minmax(280px, 0.95fr) minmax(380px, 1.2fr);
}

.samsara-mapping-table-head {
  border-top: 1px solid #e2e8f0;
  border-bottom: 1px solid #dbe5f1;
  background: linear-gradient(90deg, #fff7db 0 45%, #eaf5ff 45% 100%);
  color: #334155;
  font-weight: 900;
}

.samsara-mapping-table-head span {
  padding: 12px 18px;
}

.samsara-mapping-row {
  min-height: 72px;
  border-bottom: 1px solid #e7edf5;
  background: #fff;
}

.samsara-mapping-row.is-mapped {
  background: #ecfdf3;
}

.samsara-mapping-row.planning-unmapped-row {
  background: #f8fbff;
}

.samsara-driver-cell,
.planning-driver-cell {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 12px 18px;
}

.samsara-driver-cell {
  border-right: 1px solid #dbe5f1;
}

.samsara-driver-cell div {
  display: grid;
  gap: 4px;
}

.samsara-driver-cell strong {
  color: #0f172a;
}

.samsara-driver-cell small {
  color: #64748b;
}

.samsara-mapping-status {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  border: 2px solid #94a3b8;
  border-radius: 50%;
  background: #fff;
}

.samsara-mapping-row.is-mapped .samsara-mapping-status {
  border-color: #16a34a;
  background: #22c55e;
  box-shadow: inset 0 0 0 4px #ecfdf3;
}

.planning-driver-cell select {
  padding: 0 12px;
}

.planning-unmapped-state {
  display: grid;
  gap: 4px;
}

.planning-unmapped-state strong {
  color: #1d4ed8;
}

.planning-unmapped-state small {
  color: #64748b;
}

.samsara-mapping-rows .empty-state {
  padding: 28px 18px;
}

@media (max-width: 900px) {
  .samsara-mapping-summary {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  .samsara-mapping-table-head {
    display: none;
  }

  .samsara-mapping-row {
    grid-template-columns: 1fr;
  }

  .samsara-driver-cell {
    border-right: 0;
    border-bottom: 1px solid #dbe5f1;
  }
}

/* Settings: read-only LoadStop fleet snapshots and Planning-owned mappings. */
.loadstop-mapping-page main {
  max-width: none;
}

.loadstop-mapping-topbar {
  align-items: flex-start;
}

.loadstop-readonly-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
  padding: 14px 18px;
  border: 1px solid #86efac;
  border-radius: 14px;
  background: #f0fdf4;
  color: #166534;
}

.loadstop-readonly-banner strong {
  flex: 0 0 auto;
  text-transform: uppercase;
}

.loadstop-mapping-message {
  margin: 0 0 14px;
  padding: 12px 16px;
  border: 1px solid #bfdbfe;
  border-radius: 12px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
}

.loadstop-mapping-message.is-success {
  border-color: #86efac;
  background: #f0fdf4;
  color: #15803d;
}

.loadstop-mapping-message.is-error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b42318;
}

.loadstop-mapping-audit {
  margin-bottom: 14px;
  padding: 18px;
  border: 1px solid #d9e3f1;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.loadstop-audit-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 8px;
}

.loadstop-audit-heading h2,
.loadstop-audit-card h3 {
  margin: 0;
}

.loadstop-audit-heading p {
  margin: 3px 0 0;
  color: #64748b;
}

.loadstop-audit-heading button {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-weight: 800;
}

.loadstop-audit-status {
  margin: 0 0 12px;
  color: #475569;
  font-weight: 700;
}

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

.loadstop-audit-card {
  padding: 14px;
  border: 1px solid #dbe5f1;
  border-radius: 14px;
  background: #f8fafc;
}

.loadstop-audit-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.loadstop-audit-badge {
  padding: 4px 8px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}

.loadstop-audit-badge.is-ready {
  background: #dcfce7;
  color: #166534;
}

.loadstop-audit-badge.is-in_progress {
  background: #dbeafe;
  color: #1d4ed8;
}

.loadstop-audit-badge.is-needs_attention {
  background: #fee2e2;
  color: #b42318;
}

.loadstop-audit-badge.is-not_started,
.loadstop-audit-badge.is-no_snapshot {
  background: #fef3c7;
  color: #92400e;
}

.loadstop-audit-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.loadstop-audit-metrics p {
  display: grid;
  margin: 0;
  padding: 9px;
  border-radius: 10px;
  background: #fff;
}

.loadstop-audit-metrics strong {
  color: #0f172a;
  font-size: 20px;
}

.loadstop-audit-metrics span,
.loadstop-audit-detail {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.loadstop-audit-detail {
  margin: 10px 0 0;
  line-height: 1.45;
}

.loadstop-resource-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}

.loadstop-resource-tabs button {
  min-width: 130px;
  padding: 11px 18px;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font-weight: 900;
  cursor: pointer;
}

.loadstop-resource-tabs button.is-active {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}

.loadstop-mapping-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.loadstop-mapping-summary > article,
.loadstop-mapping-summary > button {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 14px 18px;
  border: 1px solid #d9e3f1;
  border-radius: 15px;
  background: #fff;
}

.loadstop-mapping-summary > button {
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.loadstop-mapping-summary > button:hover,
.loadstop-mapping-summary > button.is-active {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

.loadstop-mapping-summary strong {
  color: #0f172a;
  font-size: 26px;
}

.loadstop-mapping-summary span {
  color: #334155;
  font-weight: 800;
}

.loadstop-mapping-panel {
  overflow: hidden;
  border: 1px solid #d9e3f1;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.loadstop-mapping-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
}

.loadstop-mapping-toolbar label {
  display: grid;
  flex: 1;
  min-width: 240px;
  gap: 7px;
  font-weight: 800;
}

.loadstop-mapping-toolbar input,
.planning-resource-cell select {
  width: 100%;
  min-height: 46px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  font: inherit;
}

.loadstop-mapping-toolbar input {
  padding: 0 13px;
}

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

.loadstop-refresh-status {
  margin: 0;
  padding: 0 18px 14px;
  color: #64748b;
  font-weight: 700;
}

.loadstop-mapping-table-head,
.loadstop-mapping-row {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(380px, 1.15fr);
}

.loadstop-mapping-table-head {
  border-top: 1px solid #e2e8f0;
  border-bottom: 1px solid #dbe5f1;
  background: linear-gradient(90deg, #fff7db 0 47%, #eaf5ff 47% 100%);
  color: #334155;
  font-weight: 900;
}

.loadstop-mapping-table-head span {
  padding: 12px 18px;
}

.loadstop-mapping-table-head[hidden] {
  display: none;
}

.loadstop-planning-view-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 10px;
  padding: 18px;
}

.loadstop-planning-view-card {
  display: grid;
  gap: 4px;
  padding: 13px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  background: #f8fafc;
}

.loadstop-planning-view-card strong {
  color: #0f172a;
}

.loadstop-planning-view-card small {
  color: #64748b;
}

.loadstop-mapping-row {
  min-height: 76px;
  border-bottom: 1px solid #e7edf5;
}

.loadstop-mapping-row.is-mapped {
  background: #ecfdf3;
}

.loadstop-mapping-row.is-inactive {
  opacity: 0.68;
}

.loadstop-mapping-row.is-pending-unmap {
  background: #fff7ed;
}

.loadstop-resource-cell,
.planning-resource-cell {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 12px 18px;
}

.loadstop-resource-cell {
  border-right: 1px solid #dbe5f1;
}

.loadstop-resource-cell div {
  display: grid;
  gap: 4px;
}

.loadstop-resource-cell strong {
  color: #0f172a;
}

.loadstop-resource-cell small {
  color: #64748b;
}

.loadstop-mapping-status {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  border: 2px solid #94a3b8;
  border-radius: 50%;
  background: #fff;
}

.loadstop-mapping-row.is-mapped .loadstop-mapping-status {
  border-color: #16a34a;
  background: #22c55e;
  box-shadow: inset 0 0 0 4px #ecfdf3;
}

.planning-resource-cell select {
  padding: 0 12px;
}

.loadstop-confirmed-cell {
  justify-content: space-between;
}

.loadstop-confirmed-cell > div {
  display: grid;
  gap: 4px;
}

.loadstop-confirmed-cell small {
  color: #64748b;
}

.loadstop-confirmed-cell button {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid #dc2626;
  border-radius: 9px;
  background: #fff;
  color: #b91c1c;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.loadstop-mapping-rows .empty-state,
.loadstop-planning-unmatched .empty-state {
  padding: 24px 18px;
}

.loadstop-mapping-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 14px 18px;
  border-top: 1px solid #e2e8f0;
}

.loadstop-mapping-pagination[hidden] {
  display: none;
}

.loadstop-mapping-pagination button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

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

.loadstop-mapping-pagination span {
  color: #475569;
  font-weight: 800;
}

.loadstop-planning-unmatched {
  padding: 18px;
  background: #f8fafc;
}

.loadstop-planning-unmatched h2 {
  margin: 0 0 4px;
  font-size: 18px;
}

.loadstop-planning-unmatched > p {
  margin: 0 0 12px;
  color: #64748b;
}

#loadstopPlanningUnmatchedList {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.loadstop-unmatched-pill {
  display: grid;
  gap: 2px;
  padding: 9px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
}

.loadstop-unmatched-pill small {
  color: #64748b;
}

@media (max-width: 1050px) {
  .loadstop-audit-grid {
    grid-template-columns: 1fr;
  }

  .loadstop-mapping-summary {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

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

  .loadstop-mapping-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 800px) {
  .loadstop-readonly-banner {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .loadstop-mapping-table-head {
    display: none;
  }

  .loadstop-mapping-row {
    grid-template-columns: 1fr;
  }

  .loadstop-resource-cell {
    border-right: 0;
    border-bottom: 1px solid #dbe5f1;
  }
}

@media (max-width: 980px) {
  .driver-checkin-modern-page .driver-kpi-grid,
  .driver-checkin-modern-page .driver-filters,
  .driver-checkin-modern-page .driver-check-card,
  .driver-checkin-modern-page .driver-inline-form,
  .driver-checkin-modern-page .driver-info-grid {
    grid-template-columns: 1fr;
  }

  .driver-checkin-modern-page .driver-filters input[type="search"],
  .driver-checkin-modern-page .driver-check-actions {
    grid-column: auto;
  }

  .driver-checkin-modern-page .driver-pager {
    align-items: stretch;
    flex-direction: column;
  }
}

.empty-state {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.75);
  color: #53605d;
}

@media (max-width: 1200px) {
  .routing-layout {
    grid-template-columns: 1fr;
  }

  .routing-resource-panel {
    position: static;
    max-height: none;
  }

  .routing-load-card {
    grid-template-columns: 1fr;
  }

  .routing-slots {
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr 1fr;
  }

  .routing-load-actions {
    grid-column: auto;
    grid-row: auto;
  }

  .tracking-card {
    grid-template-columns: 1fr;
  }

  .tracking-message {
    grid-column: auto;
  }

  .tracking-grid {
    grid-template-columns: 1fr;
  }

  .tracking-grid section {
    padding: 0;
    border-left: 0;
  }

  .driver-filters {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .driver-inline-form {
    grid-template-columns: 1fr 1fr;
  }

  .user-form,
  .reset-request {
    grid-template-columns: 1fr 1fr;
  }

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

  .user-toolbar-actions {
    align-items: stretch;
  }

  .user-toolbar-actions input {
    width: 100%;
  }
}

.database-filters {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 130px 150px 150px 90px;
  gap: 8px;
  align-items: center;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 9px;
  margin-bottom: 8px;
}

.load-db-filters {
  grid-template-columns: minmax(260px, 1fr) minmax(290px, 340px) 110px 110px 180px 90px;
  align-items: end;
}

.load-db-date-range-field {
  display: grid;
  min-width: 290px;
  gap: 5px;
}

.load-db-date-range-field > span {
  color: #45576f;
  font-size: 11px;
  font-weight: 800;
}

.load-db-date-range-field .jitc-calendar-trigger {
  white-space: nowrap;
}

.note-history-filters {
  grid-template-columns: minmax(260px, 1fr) 120px 140px 150px 150px;
}

.user-admin-layout {
  display: grid;
  gap: 8px;
}

.user-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.user-toolbar h2 {
  margin: 0;
  font-size: 18px;
}

.user-toolbar p {
  margin: 3px 0 0;
  color: #596661;
}

.user-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.user-toolbar-actions input {
  width: min(300px, 32vw);
}

.user-filter-bar {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 8px;
  padding: 9px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.user-filter {
  min-height: 36px;
  padding: 0 12px;
  font-weight: 800;
}

.user-filter.active {
  color: white;
  background: #174d3a;
  border-color: #174d3a;
}

.user-filter-bar label {
  min-width: 180px;
  margin-left: auto;
}

.user-form {
  display: grid;
  grid-template-columns: minmax(240px, 1.2fr) minmax(180px, 1fr) 140px minmax(180px, 1fr) 90px auto;
  gap: 8px;
  align-items: end;
  padding: 9px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.check-label {
  display: flex;
  gap: 7px;
  align-items: center;
  min-height: 36px;
}

.check-label input {
  width: auto;
}

.user-form-actions {
  display: flex;
  gap: 6px;
}

.user-filters {
  grid-template-columns: minmax(240px, 1fr);
}

.user-modal-panel {
  width: min(620px, 96vw);
}

.reset-password-panel {
  width: min(440px, 94vw);
}

.reset-password-panel label + label {
  margin-top: 10px;
}

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

.user-active-check {
  align-self: end;
}

.user-force-password-check {
  align-self: end;
  grid-column: span 2;
}

.user-group-badge,
.user-status {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 800;
}

.user-group-badge {
  color: #1e3329;
  background: #e5eee7;
  border: 1px solid #bdcfc1;
}

.user-profile-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  color: #183d64;
  background: #e8f1ff;
  border: 1px solid #adcaf4;
  border-radius: 5px;
  font-size: 12px;
  font-weight: 800;
}

.user-group-badge.group-dispatch {
  color: #0f5031;
  background: #def5e6;
  border-color: #94d4aa;
}

.user-group-badge.group-accounting {
  color: #16436b;
  background: #deefff;
  border-color: #93c6ef;
}

.user-group-badge.group-tracking {
  color: #46335f;
  background: #eee6fb;
  border-color: #c3addf;
}

.user-group-badge.group-planning {
  color: #644900;
  background: #fff2bd;
  border-color: #dfc765;
}

.user-group-badge.group-admin {
  color: #762020;
  background: #ffe1df;
  border-color: #eba39f;
}

.user-status.active {
  color: #0e5a37;
  background: #dff6e8;
  border: 1px solid #9bd5af;
}

.user-status.inactive {
  color: #744018;
  background: #fff1d7;
  border: 1px solid #dfc184;
}

.user-status.pending {
  margin-top: 4px;
  color: #7a4d00;
  background: #fff4d6;
  border: 1px solid #e6c676;
}

.muted-action {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  color: #6d7872;
  font-size: 12px;
  font-weight: 800;
}

.selected-row {
  background: #eef7f0;
  box-shadow: inset 3px 0 #174d3a;
}

.user-detail-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 18;
  width: min(420px, 96vw);
  height: 100vh;
  padding: 16px;
  overflow: auto;
  background: #ffffff;
  border-left: 1px solid var(--line);
  box-shadow: -18px 0 45px rgba(0, 0, 0, 0.18);
}

.user-detail-drawer[hidden] {
  display: none;
}

.user-detail-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.user-detail-head h2 {
  margin: 0;
  font-size: 22px;
}

.user-detail-head p:last-child {
  margin: 4px 0 0;
  color: #596661;
}

.user-detail-body {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.user-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.user-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.user-detail-grid div {
  padding: 9px;
  background: #fbfcf8;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.user-detail-grid span {
  display: block;
  margin-bottom: 3px;
  color: #596661;
  font-size: 12px;
  font-weight: 800;
}

.user-detail-grid strong {
  display: block;
  color: #17231e;
}

.user-history {
  display: grid;
  gap: 7px;
}

.user-history h3 {
  margin: 4px 0 0;
  font-size: 16px;
}

.user-history p {
  margin: 0;
  color: #596661;
}

.user-history-item {
  display: grid;
  gap: 2px;
  padding: 9px;
  background: #f8fbf8;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.user-history-item span,
.user-history-item small {
  color: #596661;
  font-size: 12px;
}

.reset-request-panel {
  display: grid;
  gap: 8px;
}

.reset-request-panel:empty {
  display: none;
}

.reset-request-panel h2 {
  margin: 4px 0 0;
  font-size: 16px;
}

.reset-request-list {
  display: grid;
  gap: 6px;
}

.reset-request {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  background: #fff9e8;
  border: 1px solid #e3c978;
  border-radius: 7px;
}

.reset-request span {
  color: #655b45;
  font-size: 12px;
}

.access-profile-layout {
  display: grid;
  grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.access-profile-list,
.access-profile-editor {
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(16, 39, 68, 0.08);
}

.access-profile-list {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.access-profile-list h2,
.access-profile-editor h2 {
  margin: 0;
  font-size: 20px;
}

.access-profile-list p {
  margin: 3px 0 0;
  color: #596661;
}

.access-profile-card {
  display: grid;
  width: 100%;
  gap: 4px;
  margin-bottom: 8px;
  padding: 10px;
  text-align: left;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 7px;
  box-shadow: none;
}

.access-profile-card.active {
  color: #ffffff;
  background: #2463ea;
  border-color: #2463ea;
}

.access-profile-card span,
.access-profile-card small {
  color: #596661;
}

.access-profile-card.active span,
.access-profile-card.active small {
  color: rgba(255, 255, 255, 0.86);
}

.access-profile-editor {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.access-profile-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.access-profile-fields {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr);
  gap: 10px;
}

.access-profile-fields .wide-field {
  grid-column: 1 / -1;
}

.permission-groups {
  display: grid;
  gap: 12px;
}

.permission-group {
  padding: 12px;
  background: #f8fbff;
  border: 1px solid #d8e4f5;
  border-radius: 8px;
}

.permission-group h3 {
  margin: 0 0 10px;
  font-size: 15px;
}

.permission-checks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.permission-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 9px;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 7px;
}

.permission-check input {
  width: auto;
  margin-top: 2px;
}

.permission-check strong,
.permission-check small {
  display: block;
}

.permission-check small {
  margin-top: 3px;
  color: #64736d;
  line-height: 1.35;
}

.database-table-wrap {
  max-height: calc(100vh - 220px);
  overflow: auto;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.database-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.database-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #e7eee6;
  color: #1c2723;
  text-align: left;
  padding: 8px;
  border-bottom: 1px solid #abb9aa;
}

.sort-button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.sort-button.active {
  color: var(--green);
}

.sort-button span {
  min-width: 12px;
  text-align: center;
}

.database-table td {
  padding: 7px 8px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.database-table td small {
  display: block;
  margin-top: 2px;
  color: #596661;
}

.database-table tbody tr:hover {
  background: #f5fbf7;
}

.owner-drivers-page .database-filters {
  grid-template-columns: minmax(260px, 1fr) 180px 120px;
}

.owner-driver-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: #28518f;
  font-size: 12px;
  font-weight: 900;
}

.owner-driver-status.available {
  background: #e8f8ee;
  color: #137641;
}

.owner-driver-status.on_load,
.owner-driver-status.away_from_home {
  background: #fff4df;
  color: #92600c;
}

.owner-driver-status.dns,
.owner-driver-status.unresponsive {
  background: #ffe9ed;
  color: #a32838;
}

.note-color-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 6px;
  border-radius: 50%;
  vertical-align: middle;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.14);
}

.note-action {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 7px;
  border-radius: 5px;
  background: #e9f1ec;
  color: #23473c;
  font-size: 11px;
  font-weight: 800;
}

.note-action.edited {
  background: #fff3cd;
  color: #685100;
}

.note-action.deleted {
  background: #ffe1e1;
  color: #9d1d1d;
}

.flag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.flag-list span {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 6px;
  border-radius: 5px;
  background: #e9f1ec;
  color: #23473c;
  font-size: 11px;
  font-weight: 700;
}

.row-actions {
  display: flex;
  gap: 5px;
  justify-content: flex-end;
}

.row-actions button {
  padding: 5px 8px;
  font-size: 12px;
}

.empty-cell {
  text-align: center;
  color: #65706b;
  padding: 24px !important;
}

.owner-preview {
  min-width: 92px;
  max-width: 150px;
  padding: 10px 8px;
  border-radius: 5px;
  text-align: center;
  font-weight: 900;
  font-size: 13px;
}

.owner-nickname-input {
  width: min(260px, 100%);
}

.owner-color-input {
  display: none;
}

.jitc-color-palette {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  max-width: 240px;
}

.jitc-color-swatch {
  position: relative;
  width: 27px;
  height: 25px;
  padding: 0;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: var(--jitc-swatch-color);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.38);
  cursor: pointer;
}

.jitc-color-swatch.active {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

.jitc-color-swatch.active::after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.74);
  background: rgba(255, 255, 255, 0.72);
}

.jitc-color-swatch:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.schedule-note-color-field {
  align-content: start;
  gap: 7px;
}

.load-status {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  padding: 2px 7px;
  border-radius: 5px;
  background: #e9f1ec;
  color: #23473c;
  font-size: 11px;
  font-weight: 800;
}

.small-action {
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid #0a7b5d;
  border-radius: 5px;
  background: #0b8464;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.small-action:disabled {
  opacity: 0.65;
  cursor: wait;
}

.broker-queue-pill {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 3px 8px;
  border-radius: 5px;
  background: #eef1ff;
  color: #264288;
  font-size: 12px;
  font-weight: 800;
}

.broker-view-link {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border: 1px solid #4f6db5;
  border-radius: 5px;
  background: #eef3ff;
  color: #24458f;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.broker-view-link:hover {
  background: #dfe9ff;
}

.status-broker-posted {
  background: #fff1c7;
  color: #8a4b00;
}

.panel-load-brokerage-badge,
.open-load-brokerage-badge {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border: 1px solid #e8b85d;
  border-radius: 999px;
  background: #fff1c7;
  color: #8a4b00;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.panel-load-brokerage-badge {
  margin-top: 2px;
}

.onboarding-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px;
  margin-bottom: 8px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.secondary-link {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: #12332a;
  font-weight: 700;
  text-decoration: none;
}

.secondary-link:hover {
  background: #eef6f0;
}

.onboarding-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 10px;
  align-items: start;
}

.onboarding-archive-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: 8px;
}

.onboarding-column {
  min-height: calc(100vh - 190px);
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 8px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.onboarding-column > header {
  padding: 12px;
  border-radius: 6px;
  text-align: center;
  color: #151b18;
  font-size: 18px;
  font-weight: 900;
  text-transform: uppercase;
}

.onboarding-column.pending > header {
  background: #ffd07b;
}

.onboarding-column.negative > header {
  background: #9fceee;
}

.onboarding-column.ready > header {
  background: #9de0b8;
}

.onboarding-list {
  display: grid;
  align-content: start;
  gap: 8px;
}

.onboarding-card {
  display: grid;
  gap: 6px;
  padding: 10px;
  background: #ffffff;
  border: 1px solid #d2ddd1;
  border-left: 5px solid var(--green);
  border-radius: 7px;
}

.onboarding-column.pending .onboarding-card {
  border-left-color: #d18816;
}

.onboarding-column.negative .onboarding-card {
  border-left-color: #377caf;
}

.onboarding-card.archived {
  opacity: 0.75;
  background: #f1f1ed;
}

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

.onboarding-driver-heading {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.onboarding-card strong {
  font-size: 14px;
}

.onboarding-role-badges {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 5px;
}

.onboarding-role-pill {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  gap: 4px;
  padding: 2px 7px 2px 5px;
  border: 1px solid #cfe0dc;
  border-radius: 999px;
  background: #f6fbf8;
  color: #23443a;
  font-size: 11px;
  font-weight: 850;
}

.onboarding-role-pill img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}

.onboarding-card p {
  margin: 0;
  color: #3f4d48;
  font-size: 12px;
}

.onboarding-meta {
  color: #56635f;
  font-size: 12px;
}

.onboarding-card footer {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 3px;
}

.onboarding-card footer button {
  padding: 5px 8px;
  font-size: 12px;
}

.onboarding-archived {
  white-space: nowrap;
  border-radius: 5px;
  padding: 2px 6px;
  background: #e8e8e8;
  color: #5b625f;
  font-size: 11px;
  font-weight: 800;
}

.onboarding-empty {
  padding: 12px;
  color: #66756f;
  text-align: center;
  background: rgba(255, 255, 255, 0.58);
  border: 1px dashed #cbd6ca;
  border-radius: 7px;
}

.onboarding-small-dialog {
  width: min(620px, 96vw);
}

.onboarding-small-dialog label {
  margin-bottom: 10px;
}

.onboarding-small-dialog textarea {
  width: 100%;
  min-height: 90px;
  resize: vertical;
}

.onboarding-history-dialog {
  width: min(720px, 96vw);
}

.onboarding-history-list {
  display: grid;
  gap: 7px;
}

.onboarding-history-item {
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fbfcf8;
}

.onboarding-history-item span,
.onboarding-history-item small {
  color: #596661;
  font-size: 12px;
}

.onboarding-history-item p {
  margin: 2px 0 0;
  color: #303c37;
  font-size: 13px;
}

.status-open {
  background: #e1f5ec;
  color: #106240;
}

.status-assigned {
  background: #e5efff;
  color: #144f96;
}

.status-brokered,
.status-completed {
  background: #f0eee9;
  color: #6c6258;
}

.status-cancelled {
  background: #ffe0e0;
  color: #9f1f1f;
}

.tracking-filters {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 220px;
  gap: 6px;
  align-items: center;
  padding: 7px 8px;
  margin-bottom: 6px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 6px;
}

.tracking-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 7px 8px;
  margin-bottom: 6px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 13px;
}

.tracking-count {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  border: 1px solid transparent;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

button.tracking-count:hover {
  filter: brightness(0.97);
}

.tracking-count.active {
  border-color: currentColor;
  box-shadow: inset 0 0 0 1px currentColor;
}

.tracking-count.all {
  background: #eef3ef;
  color: #273a34;
}

.tracking-count.danger {
  background: #f8d9d9;
  color: #a31919;
}

.tracking-count.warning {
  background: #fff1c7;
  color: #875b00;
}

.tracking-count.missing {
  background: #e5efff;
  color: #144f96;
}

.tracking-count.ok {
  background: #e1f5ec;
  color: #106240;
}

.tracking-count.no-next {
  background: #f0eee9;
  color: #5e655f;
}

.tracking-list {
  display: grid;
  gap: 5px;
}

.tracking-card {
  display: grid;
  grid-template-columns: minmax(145px, 0.35fr) minmax(0, 1fr);
  gap: 5px 8px;
  align-items: start;
  padding: 7px 8px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid var(--line);
  border-left: 4px solid #84908a;
  border-radius: 6px;
}

.tracking-card.danger {
  border-left-color: #c53737;
  background: #fff6f6;
}

.tracking-card.warning {
  border-left-color: #d48a00;
  background: #fffaf0;
}

.tracking-card.missing_eta {
  border-left-color: #2b6fb3;
}

.tracking-card.ok {
  border-left-color: var(--green);
}

.tracking-card.no_next {
  border-left-color: #77837d;
}

.tracking-card-head {
  display: grid;
  gap: 4px;
  align-content: start;
}

.tracking-card-head div {
  display: grid;
  gap: 1px;
}

.tracking-card-head strong {
  font-size: 15px;
}

.tracking-card-head span {
  color: #53605d;
  font-size: 11px;
  line-height: 1.25;
}

.tracking-pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  width: fit-content;
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.tracking-pill.danger {
  background: #f8d9d9;
  color: #a31919;
}

.tracking-pill.warning {
  background: #fff1c7;
  color: #875b00;
}

.tracking-pill.missing_eta {
  background: #e5efff;
  color: #144f96;
}

.tracking-pill.ok {
  background: #e1f5ec;
  color: #106240;
}

.tracking-pill.no_next {
  background: #f0eee9;
  color: #5e655f;
}

.tracking-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.tracking-grid section {
  display: grid;
  align-content: start;
  gap: 2px;
  min-height: 0;
  padding: 0 8px;
  border-left: 1px solid #d8e0d5;
}

.tracking-grid small {
  color: #53605d;
  font-weight: 800;
  font-size: 10px;
  text-transform: uppercase;
}

.tracking-grid b {
  font-size: 12px;
  line-height: 1.2;
}

.tracking-grid span {
  color: #53605d;
  font-size: 11px;
  line-height: 1.25;
}

.tracking-message {
  grid-column: 2;
  font-size: 11px;
  font-weight: 800;
  color: #24332e;
  line-height: 1.25;
}

.empty-tracking {
  color: #65706b;
}

.edit-overlay {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(12, 17, 14, 0.35);
}

.edit-dialog {
  width: min(900px, 96vw);
  max-height: 90vh;
  overflow: auto;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
  padding: 14px;
}

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

.edit-head h2 {
  margin: 2px 0 0;
  font-size: 21px;
}

.mini-kicker {
  color: var(--green);
  font-size: 12px;
  font-weight: 800;
}

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

.edit-grid input,
.edit-grid select,
.edit-grid textarea {
  width: 100%;
}

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

.note-time-row button {
  height: 34px;
  white-space: nowrap;
}

.edit-grid textarea {
  min-height: 84px;
  resize: vertical;
}

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

.check-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 14px 0;
}

.check-grid label {
  display: flex;
  grid-auto-flow: column;
  align-items: center;
  gap: 6px;
  color: #26332f;
}

.edit-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.primary-action {
  background: var(--green);
  border-color: var(--green);
  color: #ffffff;
}

.nav-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  margin-left: auto;
  padding: 0 6px;
  border-radius: 999px;
  background: #ffe3a3;
  color: #5c4100;
  font-size: 11px;
  font-weight: 900;
}

.nav-badge[hidden] {
  display: none;
}

.nav-badge.overdue {
  background: #ffd5d5;
  color: #9f1f1f;
}

.nav-badge.due-today {
  background: #fff0aa;
  color: #6d5100;
}

body.sidebar-collapsed .nav-badge {
  position: absolute;
  top: 3px;
  right: 5px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  font-size: 9px;
}

@media (max-width: 900px) {
  .sidebar .nav-badge {
    position: absolute;
    top: 3px;
    right: 5px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    font-size: 9px;
  }
}

.tasks-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.task-board {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
  padding: 10px;
}

.task-form-panel {
  width: min(760px, 96vw);
}

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

.task-form label {
  min-width: 0;
}

.task-form input,
.task-form select,
.task-form textarea {
  width: 100%;
}

.task-form .check-label {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0;
  line-height: 1.25;
}

.task-form .check-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-height: 0;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  accent-color: #1767d4;
}

.task-form select[multiple] {
  min-height: 132px;
}

.task-native-select {
  display: none;
}

.task-assign-field {
  display: grid;
  gap: 4px;
  position: relative;
}

.task-picker {
  position: relative;
}

.task-picker-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  padding: 7px 9px;
  border: 1px solid #b8c7c1;
  border-radius: 6px;
  background: #ffffff;
  color: var(--ink);
  font-size: 14px;
  font-weight: 800;
  text-align: left;
}

.task-picker-button.open {
  border-color: #1767d4;
  box-shadow: 0 0 0 2px rgba(23, 103, 212, 0.12);
}

.task-picker-button span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-picker-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + 4px);
  left: 0;
  width: min(360px, 100%);
  max-height: 340px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(20, 35, 30, 0.18);
}

.task-picker-menu[hidden] {
  display: none;
}

.task-picker-menu input[type="search"] {
  width: 100%;
  min-height: 34px;
  margin-bottom: 8px;
  border-radius: 0;
  font-weight: 800;
}

.task-picker-select-all,
.task-picker-options label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 27px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
}

.task-picker-select-all {
  border-bottom: 1px solid #e3ebe7;
  padding-bottom: 7px;
  margin-bottom: 5px;
}

.task-picker-select-all input,
.task-picker-options input {
  width: 15px;
  height: 15px;
  min-height: 0;
  margin: 0;
  padding: 0;
  accent-color: #1767d4;
}

.task-picker-reset {
  display: block;
  width: 100%;
  margin: 2px 0 7px;
  padding: 5px;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 13px;
  font-weight: 900;
  text-align: center;
}

.task-picker-options {
  display: grid;
  gap: 2px;
}

.task-picker-options label {
  padding: 3px 2px;
}

.task-picker-options label[hidden] {
  display: none;
}

.task-form textarea {
  min-height: 110px;
  resize: vertical;
}

.task-wide,
.task-form-actions {
  grid-column: 1 / -1;
}

.task-form-actions,
.task-toolbar,
.task-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.task-toolbar {
  justify-content: space-between;
  margin-bottom: 8px;
}

.task-toolbar-right {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.task-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.task-tabs button.active,
.task-view-switch button.active {
  border-color: var(--green);
  background: var(--green);
  color: #ffffff;
}

.task-view-switch {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #eef5f0;
}

.task-view-switch button {
  min-height: 30px;
  padding: 4px 10px;
  border-color: transparent;
  background: transparent;
}

#taskSearch {
  min-width: 240px;
}

.task-list {
  display: grid;
  gap: 4px;
}

.task-card,
.task-empty {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-left: 3px solid #8ba79d;
  border-radius: 6px;
  background: #fbfdfb;
  padding: 4px 6px;
}

.task-card.overdue {
  border-left-color: #ba1d1d;
  background: #fff6f6;
}

.task-card.urgent {
  border-left-color: #d89216;
  background: #fffaf0;
}

.task-card.today {
  border-left-color: #d6aa00;
  background: #fffdf0;
}

.task-card.tomorrow {
  border-left-color: #24769f;
  background: #f2fbff;
}

.task-card.upcoming {
  border-left-color: #7f8a8c;
  background: #f8faf9;
}

.task-card.pending-review {
  border-left-color: #7c4ba8;
  background: #faf5ff;
}

.task-card.completed {
  border-left-color: #6ca36f;
  background: #f3faf4;
  opacity: 0.9;
}

.task-card.archived {
  border-left-color: #6b7280;
  background: #f3f4f6;
  opacity: 0.92;
}

.task-card-main {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(260px, 42%);
  gap: 6px;
  align-items: center;
  min-width: 0;
}

.task-card small {
  color: var(--green);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.task-card h2 {
  margin: 0;
  font-size: 14px;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-card p {
  margin: 0;
  color: #4f5f59;
  font-size: 11px;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 8px;
  color: #4f5d58;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.1;
}

.task-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 14px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.task-meta-secondary {
  color: #7a8580;
}

.task-actions {
  justify-content: flex-end;
  gap: 5px;
  margin-top: 0;
  flex-wrap: nowrap;
}

.task-actions button {
  min-height: 24px;
  padding: 2px 7px;
  border-radius: 5px;
  font-size: 11px;
}

.task-calendar-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin: 6px 0;
}

.task-calendar-controls strong {
  min-width: 170px;
  color: #182923;
  font-size: 16px;
}

.task-calendar {
  display: grid;
  grid-template-columns: repeat(7, minmax(104px, 1fr));
  gap: 4px;
  align-items: stretch;
}

.task-calendar-weekday {
  padding: 4px 7px;
  border-radius: 5px;
  background: #dfece4;
  color: #39514a;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.task-calendar-day {
  min-height: 82px;
  padding: 5px;
  border: 1px solid var(--line);
  border-left: 3px solid #9ab0a7;
  border-radius: 6px;
  background: #fbfdfb;
  cursor: pointer;
}

.task-calendar-day:hover {
  border-color: #83aa9d;
  background: #f5fbf7;
}

.task-calendar-day.outside-month {
  background: #f3f4f2;
  opacity: 0.7;
}

.task-calendar-day.is-today {
  border-left-color: var(--green);
  box-shadow: inset 0 0 0 1px rgba(10, 122, 82, 0.3);
}

.task-calendar-day.has-overdue {
  border-left-color: #ba1d1d;
}

.task-calendar-date {
  width: 23px;
  min-height: 22px;
  padding: 2px;
  border: 0;
  border-radius: 50%;
  background: #e8f0eb;
  color: #213a32;
  font-size: 12px;
  font-weight: 900;
}

.task-calendar-chips {
  display: grid;
  gap: 3px;
  margin-top: 4px;
}

.task-calendar-chip,
.task-calendar-more {
  display: grid;
  gap: 1px;
  width: 100%;
  min-height: 0;
  padding: 3px 5px;
  border: 1px solid #e0c767;
  border-left: 3px solid #d6aa00;
  border-radius: 5px;
  background: #fff4b8;
  color: #1e2824;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
  text-align: left;
}

.task-calendar-chip span {
  color: #4c5b55;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.task-calendar-chip.overdue {
  border-color: #e5b5b5;
  border-left-color: #ba1d1d;
  background: #ffe1e1;
}

.task-calendar-chip.urgent {
  border-color: #e9c27e;
  border-left-color: #d89216;
  background: #fff0cf;
}

.task-calendar-chip.tomorrow {
  border-color: #a9d6e8;
  border-left-color: #24769f;
  background: #e8f8ff;
}

.task-calendar-chip.pending-review {
  border-color: #d8bee9;
  border-left-color: #7c4ba8;
  background: #f7eaff;
}

.task-calendar-chip.completed {
  border-color: #b9dbbd;
  border-left-color: #6ca36f;
  background: #e9f7ea;
}

.task-calendar-chip.archived {
  border-color: #d4d7dc;
  border-left-color: #6b7280;
  background: #eef0f3;
}

.task-calendar-more {
  border-color: #cfdbd4;
  border-left-color: #8aa098;
  background: #f1f5f2;
  color: #50635c;
}

.task-calendar-note {
  grid-column: 1 / -1;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8faf9;
  color: #53605d;
  font-size: 13px;
  font-weight: 800;
}

.task-calendar-controls[hidden],
.task-calendar[hidden],
.task-list[hidden] {
  display: none;
}

@media (max-width: 1100px) {
  .task-calendar {
    grid-template-columns: repeat(7, minmax(96px, 1fr));
    overflow-x: auto;
  }

  .task-calendar-day {
    min-width: 96px;
  }
}

@media (max-width: 760px) {
  .task-card,
  .task-empty {
    grid-template-columns: 1fr;
  }

  .task-card-main {
    grid-template-columns: 1fr;
  }

  .task-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .task-toolbar-right,
  #taskSearch {
    width: 100%;
  }

  .task-view-switch {
    width: 100%;
  }

  .task-view-switch button {
    flex: 1;
  }

  .task-calendar {
    grid-template-columns: repeat(7, minmax(88px, 1fr));
  }
}

.task-events {
  margin-top: 8px;
  border-top: 1px solid #e4ebe6;
  padding-top: 7px;
}

.task-events summary {
  cursor: pointer;
  color: #4d635b;
  font-size: 12px;
  font-weight: 900;
}

.task-events div {
  display: grid;
  gap: 2px;
  padding: 6px 0;
  border-bottom: 1px solid #edf2ef;
  color: #53605d;
  font-size: 12px;
}

.task-events div:last-child {
  border-bottom: 0;
}

.task-detail-panel {
  width: min(820px, 96vw);
}

.task-detail-panel h2 {
  margin: 0 44px 10px 0;
}

.task-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.task-detail-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 5px;
  background: #edf4ef;
  color: #31443b;
  font-size: 12px;
  font-weight: 800;
}

.task-detail-section {
  display: grid;
  gap: 7px;
  padding: 10px 0;
  border-top: 1px solid #e4ebe6;
}

.task-detail-section h3 {
  margin: 0;
  font-size: 15px;
}

.task-detail-section > p,
.task-muted {
  margin: 0;
  color: #4f5f59;
  white-space: pre-wrap;
}

.task-comment,
.task-event {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #e1e9e4;
  border-radius: 6px;
  background: #fbfdfb;
}

.task-comment p,
.task-event p {
  margin: 0;
  color: #2d3c35;
  white-space: pre-wrap;
}

.task-comment span,
.task-event span {
  color: #596661;
  font-size: 12px;
}

.task-reply-form {
  display: grid;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid #e4ebe6;
}

.task-reply-form textarea,
.task-action-panel textarea {
  width: 100%;
  min-height: 88px;
  resize: vertical;
}

.task-action-panel {
  width: min(520px, 94vw);
}

.task-attachment-preview {
  display: grid;
  gap: 7px;
}

.task-attachment-chip {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 6px;
  border: 1px solid #dce7e0;
  border-radius: 6px;
  background: #f8fbf8;
}

.task-attachment-chip img {
  width: 54px;
  height: 42px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid #ccd8d1;
}

.task-attachment-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 800;
}

.task-attachment-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px;
}

.task-attachment-item {
  display: grid;
  gap: 5px;
  color: #23362f;
  text-decoration: none;
  font-size: 12px;
  font-weight: 800;
}

.task-attachment-item img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid #d6e1da;
  border-radius: 6px;
  background: #f8fbf8;
}

.open-truck-filters {
  display: grid;
  grid-template-columns: auto minmax(320px, 1fr);
  gap: 8px;
  align-items: end;
  padding: 6px 8px;
  margin-bottom: 5px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #ffffff;
}

.open-truck-filter-left {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: end;
}

.open-truck-filters label {
  display: grid;
  gap: 2px;
  color: #53605d;
  font-size: 11px;
  font-weight: 800;
}

.open-truck-filter-left > label {
  min-width: 126px;
}

.open-truck-filter-left > label > input,
.open-truck-filter-left > label > select,
.open-truck-search-field input {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #ffffff;
  color: var(--ink);
  font-size: 12px;
}

.open-truck-search-field {
  justify-self: stretch;
  min-width: 320px;
}

.open-truck-state-filter {
  position: relative;
  min-width: 145px;
}

.open-truck-state-filter summary {
  display: flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #ffffff;
  color: var(--ink);
  font-size: 12px;
  cursor: pointer;
  list-style: none;
}

.open-truck-state-filter summary::-webkit-details-marker {
  display: none;
}

.open-truck-state-filter summary::after {
  content: "v";
  margin-left: auto;
  color: #647a73;
  font-size: 10px;
}

.open-truck-state-filter .multi-filter-menu {
  right: auto;
  width: 190px;
  min-width: 190px;
  max-height: 300px;
  padding: 8px;
  overflow-y: auto;
}

.open-truck-state-search {
  width: 100%;
  min-height: 28px;
  margin-bottom: 6px;
  padding: 5px 7px;
  border: 1px solid #b7c8c2;
  border-radius: 0;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.open-truck-state-filter .multi-filter-menu label {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 4px 3px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.open-truck-state-filter .multi-filter-menu label[hidden] {
  display: none !important;
}

.open-truck-state-filter .multi-filter-menu input[type="checkbox"] {
  width: 13px;
  height: 13px;
  min-height: 0;
  margin: 0;
  padding: 0;
  flex: 0 0 auto;
  accent-color: #1767d4;
}

.open-truck-state-reset {
  display: block;
  width: 100%;
  margin: 2px 0 6px;
  padding: 5px;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  cursor: pointer;
}

.open-truck-state-options {
  display: grid;
  gap: 1px;
}

.open-truck-list {
  display: grid;
  gap: 4px;
}

.open-truck-market-group {
  display: grid;
  gap: 4px;
  margin-bottom: 8px;
}

.open-truck-market-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 8px;
  border: 1px solid #c9d7c8;
  border-radius: 5px;
  background: #e8f1e8;
  color: #0f2b22;
  font-size: 12px;
  font-weight: 900;
}

.open-truck-market-header span:last-child {
  color: #52645c;
  font-size: 11px;
  font-weight: 800;
}

.open-truck-card {
  display: grid;
  gap: 3px;
  padding: 5px 7px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--truck-owner-color, var(--green));
  border-radius: 5px;
  background: #ffffff;
}

.open-truck-main {
  display: flex;
  gap: 4px;
  align-items: stretch;
  min-width: 0;
}

.open-truck-main section,
.open-truck-main button {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 1px;
  min-width: 0;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: rgba(248, 250, 246, 0.85);
}

.open-truck-main button {
  appearance: none;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: center;
}

.open-truck-main button:hover {
  border-color: var(--green);
  background: #f0faf4;
}

.open-truck-number {
  flex: 0 0 104px;
}

.open-truck-location {
  flex: 0 1 210px;
  max-width: 260px;
}

.open-truck-last-load {
  flex: 0 1 330px;
  max-width: 450px;
}

.open-truck-next-load {
  flex: 0 1 260px;
  max-width: 360px;
  border-color: #f1b84b !important;
  background: #fff3d4 !important;
}

.open-truck-card.is-connection {
  border-left-color: #d22f2f;
}

.open-truck-card.is-on-hold {
  border-left-color: #d92d20;
  background: #fff5f5;
}

.open-truck-card.is-on-hold .open-truck-number {
  border-color: #f2b8b5;
  background: #fff0f0;
}

.open-truck-card.is-on-hold .open-truck-number strong,
.open-truck-card.is-on-hold .open-truck-number span {
  color: #7a271a;
}

.open-truck-next-load small {
  color: #7a4c00;
}

.open-truck-load-link {
  transition: border-color 0.12s ease, background 0.12s ease, box-shadow 0.12s ease;
}

.open-truck-load-link:hover {
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
}

.open-truck-note-card {
  flex: 1 1 240px;
  min-width: 210px;
  background: var(--open-note-color, #d8ecff) !important;
  border-color: rgba(36, 118, 159, 0.35) !important;
}

.open-truck-note-card.is-empty {
  background: #f6f8f4 !important;
}

.open-truck-note-card:not(.is-empty):hover {
  filter: brightness(0.98);
}

.open-truck-main small {
  color: #53605d;
  font-size: 10px;
  font-weight: 900;
  line-height: 12px;
}

.open-truck-main b,
.open-truck-number strong {
  overflow: hidden;
  color: #10201c;
  font-size: 12px;
  line-height: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-truck-main span {
  overflow: hidden;
  color: #53605d;
  font-size: 11px;
  line-height: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-truck-main .open-truck-number-link {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.open-truck-main .open-truck-number-link:hover {
  border-color: transparent;
  background: transparent;
}

.open-truck-wait {
  color: #9a6b00 !important;
  font-weight: 900;
}

.open-truck-missing-eta {
  color: #b42318 !important;
  font-weight: 900;
}

.open-truck-hold-line {
  color: #b42318 !important;
  font-weight: 800;
}

.open-truck-hold-line.is-stale {
  font-weight: 950;
}

.open-truck-main .open-truck-hold-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  min-height: 22px;
  margin-top: 2px;
  padding: 3px 8px;
  border-color: #d0d9e5;
  border-radius: 999px;
  background: #ffffff;
  color: #334155;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.open-truck-main .open-truck-hold-button:hover {
  border-color: #d92d20;
  background: #fff5f5;
  color: #b42318;
}

.open-truck-main .open-truck-hold-button.is-active {
  border-color: #d92d20;
  background: #d92d20;
  color: #ffffff;
}

.open-truck-number strong {
  font-size: 15px;
  line-height: 18px;
}

.open-truck-note-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
}

.open-truck-note-row textarea {
  width: 100%;
  min-height: 24px;
  height: 24px;
  padding: 3px 5px;
  resize: none;
  font-size: 11px;
  line-height: 15px;
}

.open-truck-note-row button {
  align-self: start;
  min-height: 24px;
  padding: 3px 9px;
  background: var(--green);
  border-color: var(--green);
  color: #ffffff;
  font-size: 12px;
}

.open-truck-note-meta {
  color: #65706b;
  font-size: 10px;
  line-height: 12px;
}

.open-truck-note-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: #394842;
  font-size: 11px;
  line-height: 14px;
}

.open-truck-note-preview .text-action {
  font-size: 11px;
}

.open-truck-all-notes {
  margin-top: 2px;
}

.open-truck-detail-panel small {
  color: #52605c;
  font-size: 12px;
  line-height: 1.35;
}

.open-truck-note-panel {
  max-width: 720px;
}

.open-truck-note-context {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 8px 0 10px;
}

.open-truck-note-context > div {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: rgba(248, 250, 246, 0.85);
}

.open-truck-note-context small,
.open-truck-note-label span,
.open-truck-note-color-row span {
  color: #53605d;
  font-size: 11px;
  font-weight: 900;
}

.open-truck-note-context b,
.open-truck-note-context span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-truck-note-label {
  display: grid;
  gap: 4px;
}

.open-truck-note-label textarea {
  min-height: 76px;
  resize: vertical;
}

.open-truck-note-color-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-top: 8px;
}

.open-truck-note-panel h3 {
  margin: 10px 0 4px;
  font-size: 15px;
}

.open-truck-note-history {
  display: grid;
  gap: 5px;
  max-height: 260px;
  overflow: auto;
}

.open-truck-note-history-item {
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border: 1px solid rgba(36, 118, 159, 0.22);
  border-left: 4px solid var(--open-note-color, #d8ecff);
  border-radius: 6px;
  background: color-mix(in srgb, var(--open-note-color, #d8ecff) 26%, #ffffff);
}

.open-truck-note-history-item b {
  color: #31413c;
  font-size: 11px;
}

.open-truck-note-history-item span {
  white-space: pre-wrap;
}

.open-truck-note-history-empty {
  padding: 8px;
  color: #65706b;
}

.open-truck-empty {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #ffffff;
  color: #53605d;
}

@media (max-width: 1200px) {
  .database-filters {
    grid-template-columns: 1fr 1fr;
  }

  .load-db-date-range-field {
    min-width: 0;
  }

  .open-truck-filters {
    grid-template-columns: 1fr;
  }

  .open-truck-filter-left {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .open-truck-search-field {
    min-width: 0;
  }

  .open-truck-main {
    flex-wrap: wrap;
  }

  .open-truck-number,
  .open-truck-location,
  .open-truck-last-load,
  .open-truck-next-load,
  .open-truck-note-card {
    flex: 1 1 220px;
    max-width: none;
  }
}

/* Modern Schedule Board pilot */
.schedule-modern-page {
  --modern-bg: #f5f7fb;
  --modern-surface: #ffffff;
  --modern-text: #0f172a;
  --modern-muted: #64748b;
  --modern-line: #dbe3ef;
  --modern-blue: #2563eb;
  --modern-blue-dark: #1d4ed8;
  background: var(--modern-bg);
  color: var(--modern-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.schedule-modern-page .sidebar {
  background:
    radial-gradient(circle at 16% 0%, rgba(37, 99, 235, 0.24), transparent 30%),
    linear-gradient(180deg, #08182c 0%, #0b213c 48%, #071426 100%);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.08), 8px 0 24px rgba(15, 23, 42, 0.12);
}

.schedule-modern-page .sidebar-brand {
  min-height: 80px;
  padding: 16px 14px;
  background: rgba(255, 255, 255, 0.02);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.schedule-modern-page .brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, #ffffff 0%, #dbeafe 100%);
}

.schedule-modern-page .brand-text strong {
  font-size: 16px;
  letter-spacing: 0;
}

.schedule-modern-page .brand-text span {
  color: rgba(226, 232, 240, 0.8);
  font-size: 11px;
  font-weight: 600;
}

.schedule-modern-page .sidebar-collapse-toggle {
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
}

.schedule-modern-page .sidebar-nav {
  padding: 14px 10px;
  gap: 14px;
}

.schedule-modern-page .nav-section + .nav-section {
  border-top-color: rgba(255, 255, 255, 0.08);
}

.schedule-modern-page .nav-section-title {
  padding-left: 8px;
  color: rgba(203, 213, 225, 0.72);
  font-size: 10px;
  letter-spacing: 0.03em;
}

.schedule-modern-page .nav-item {
  min-height: 40px;
  border-radius: 10px;
  border-left: 0;
  color: rgba(241, 245, 249, 0.88);
  font-weight: 650;
}

.schedule-modern-page .nav-item:hover,
.schedule-modern-page .nav-group.open > .nav-group-toggle {
  background: rgba(255, 255, 255, 0.08);
}

.schedule-modern-page .nav-item.active,
.schedule-modern-page .nav-subitem.active {
  color: #ffffff;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.28);
}

.schedule-modern-page .nav-icon {
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.08);
}

.schedule-modern-page .nav-item.active .nav-icon {
  background: rgba(255, 255, 255, 0.18);
}

.schedule-modern-page .nav-submenu {
  margin-left: 36px;
  border-left: 1px solid rgba(148, 163, 184, 0.2);
}

.schedule-modern-page .nav-subitem {
  min-height: 34px;
  padding-left: 12px;
  border-radius: 8px;
  color: rgba(226, 232, 240, 0.8);
  font-weight: 600;
}

.schedule-modern-page .sidebar-account {
  margin-top: auto;
  padding: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(2, 6, 23, 0.22);
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.schedule-modern-page .sidebar-account-avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.26);
}

.schedule-modern-page .sidebar-account-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
  justify-items: start;
}

.schedule-modern-page .sidebar-account span {
  color: #ffffff;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
}

.schedule-modern-page .sidebar-account small {
  color: rgba(226, 232, 240, 0.72);
  font-size: 11px;
  font-weight: 500;
}

.schedule-modern-page .sidebar-account button {
  width: 26px;
  height: 26px;
  overflow: hidden;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgba(226, 232, 240, 0.78);
  font-size: 0;
}

.schedule-modern-page .sidebar-account button::before {
  content: "v";
  font-size: 13px;
  font-weight: 800;
}

.schedule-modern-page .sidebar-account button:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

.schedule-modern-main {
  min-width: 0;
  padding: 22px 22px 46px;
  background: var(--modern-bg);
}

.schedule-modern-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
}

.schedule-modern-header h1 {
  margin: 0;
  color: #0f172a;
  font-size: 28px;
  line-height: 1.08;
  letter-spacing: 0;
}

.schedule-modern-header p {
  margin: 5px 0 0;
  color: var(--modern-muted);
  font-size: 14px;
}

.schedule-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.view-toggle {
  display: inline-flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--modern-line);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.view-toggle button,
.new-load-action,
.schedule-modern-page .board-refresh-panel button {
  min-height: 34px;
  border-radius: 8px;
  padding: 7px 12px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}

.view-toggle button {
  border: 0;
  background: transparent;
  color: #475569;
}

.view-toggle button.active,
.new-load-action {
  color: #ffffff;
  background: var(--modern-blue);
  border-color: var(--modern-blue);
}

.view-toggle button:disabled {
  cursor: default;
  opacity: 0.65;
}

.new-load-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--modern-blue);
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.18);
}

.new-load-action::before {
  content: "+";
  font-size: 16px;
  line-height: 1;
}

.schedule-modern-page .board-refresh-panel {
  margin-left: 0;
  padding: 0;
  gap: 8px;
  color: var(--modern-muted);
  font-size: 12px;
}

.schedule-modern-page .board-refresh-panel button {
  color: #334155;
  background: #ffffff;
  border: 1px solid var(--modern-line);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.schedule-modern-page .board-refresh-panel span {
  min-width: 92px;
}

.schedule-modern-page .controls.schedule-filter-bar {
  display: grid;
  grid-template-columns: minmax(390px, 1.35fr) repeat(6, minmax(120px, 0.75fr));
  gap: 12px;
  align-items: end;
  padding: 14px;
  margin-bottom: 12px;
  background: var(--modern-surface);
  border: 1px solid var(--modern-line);
  border-radius: 14px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.schedule-modern-page .schedule-filter-bar > .jitc-calendar-range-field {
  min-width: 390px;
  grid-template-columns: 42px minmax(290px, 1fr) 42px;
  align-items: end;
}

.schedule-modern-page .schedule-filter-bar .date-range-field {
  min-width: 0;
}

.schedule-modern-page .schedule-filter-bar .date-range-field .jitc-calendar-trigger {
  white-space: nowrap;
}

.schedule-modern-page .controls label {
  gap: 6px;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.schedule-modern-page .controls label > span {
  color: #475569;
}

.schedule-modern-page input,
.schedule-modern-page select {
  min-height: 38px;
  border-color: var(--modern-line);
  border-radius: 9px;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.schedule-modern-page input:focus,
.schedule-modern-page select:focus {
  outline: 2px solid rgba(37, 99, 235, 0.18);
  border-color: #93c5fd;
}

.schedule-modern-page .board-search-field,
.schedule-modern-page .board-search-field input {
  width: auto;
  min-width: 0;
}

.schedule-modern-page .board-filter-group {
  gap: 6px;
  align-content: end;
  padding: 0;
  grid-column: span 6;
}

.schedule-modern-page .board-filter-group button {
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid var(--modern-line);
  border-radius: 9px;
  background: #ffffff;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.schedule-modern-page .board-filter-group button.active {
  background: var(--modern-blue);
  border-color: var(--modern-blue);
  color: #ffffff;
  box-shadow: 0 9px 18px rgba(37, 99, 235, 0.18);
}

.schedule-modern-page .schedule-changes {
  border-color: #bfdbfe;
  border-radius: 12px;
  background: #eff6ff;
  color: #1e3a8a;
}

.schedule-modern-page .dashboard-layout {
  grid-template-columns: minmax(0, 1fr) 328px;
  gap: 14px;
}

.schedule-modern-page .board,
.schedule-modern-page .resource-panel,
.schedule-modern-page .status-footer {
  border: 1px solid var(--modern-line);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07);
}

.schedule-modern-page .board {
  max-height: calc(100vh - 234px);
  scrollbar-width: auto;
  scrollbar-color: #94a3b8 #e2e8f0;
}

.schedule-modern-page .board::-webkit-scrollbar {
  width: 14px;
  height: 14px;
}

.schedule-modern-page .board::-webkit-scrollbar-track {
  background: #e2e8f0;
}

.schedule-modern-page .board::-webkit-scrollbar-thumb {
  border: 3px solid #e2e8f0;
  border-radius: 999px;
  background: #94a3b8;
}

.schedule-modern-page .board::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

.schedule-modern-page .grid {
  background: #ffffff;
}

.schedule-modern-page .corner,
.schedule-modern-page .day-header {
  min-height: 44px;
  padding: 9px 10px;
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #0f172a;
  font-size: 13px;
  font-weight: 750;
}

.schedule-modern-page .day-header.today {
  background: #eff6ff;
  color: #1d4ed8;
  box-shadow: inset 0 3px 0 var(--modern-blue);
}

.schedule-modern-page .truck {
  min-height: 88px;
  border-color: #e2e8f0;
  padding: 10px 8px;
  box-shadow: 1px 0 0 rgba(15, 23, 42, 0.08);
}

.schedule-modern-page .truck strong {
  font-size: 21px;
  line-height: 1;
  letter-spacing: 0;
}

.schedule-modern-page .truck span {
  font-size: 10px;
  font-weight: 650;
  line-height: 1.2;
}

.schedule-modern-page .cell {
  min-height: 88px;
  padding: 6px;
  background: #fcfdfb;
  border-color: #e2e8f0;
  contain-intrinsic-size: 88px 170px;
}

.schedule-modern-page .cell.today-cell {
  background: #f8fbff;
  box-shadow: inset 2px 0 0 rgba(37, 99, 235, 0.42), inset -2px 0 0 rgba(37, 99, 235, 0.42);
}

.schedule-modern-page .resource,
.schedule-modern-page .load-card,
.schedule-modern-page .last-location,
.schedule-modern-page .moved-location-marker,
.schedule-modern-page .truck-status-card,
.schedule-modern-page .home-reset-card,
.schedule-modern-page .schedule-note-card {
  border-radius: 8px;
  margin-bottom: 5px;
  box-shadow: 0 2px 7px rgba(15, 23, 42, 0.08);
  text-align: center;
  justify-items: center;
}

.schedule-modern-page .resource {
  min-height: 21px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 750;
  text-align: center;
  justify-items: center;
}

.schedule-modern-page .resource.driver-resource-pill {
  justify-content: center;
}

.schedule-modern-page .load-card,
.schedule-modern-page .last-location,
.schedule-modern-page .moved-location-marker,
.schedule-modern-page .truck-status-card {
  gap: 3px;
  padding: 7px 8px;
}

.schedule-modern-page .load-card b,
.schedule-modern-page .last-location b,
.schedule-modern-page .moved-location-marker b,
.schedule-modern-page .truck-status-card b,
.schedule-modern-page .home-reset-card b {
  font-size: 11px;
  font-weight: 800;
}

.schedule-modern-page .load-card span,
.schedule-modern-page .last-location span,
.schedule-modern-page .moved-location-marker span,
.schedule-modern-page .truck-status-card span,
.schedule-modern-page .home-reset-card span {
  font-size: 13px;
  line-height: 1.12;
  font-weight: 800;
}

.schedule-modern-page .load-card small,
.schedule-modern-page .last-location small,
.schedule-modern-page .moved-location-marker small,
.schedule-modern-page .truck-status-card small,
.schedule-modern-page .home-reset-card small {
  font-size: 10.5px;
  line-height: 1.2;
}

.schedule-modern-page .load-card:hover,
.schedule-modern-page .last-location:hover,
.schedule-modern-page .moved-location-marker:hover,
.schedule-modern-page .truck-status-card:hover,
.schedule-modern-page .schedule-note-card:hover,
.schedule-modern-page .home-reset-card:hover {
  outline: 2px solid rgba(37, 99, 235, 0.22);
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.14);
}

.schedule-modern-page .cell-note-add {
  top: 4px;
  right: 4px;
  border-radius: 7px;
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

.resource-panel-head {
  display: none;
}

.schedule-modern-page .resource-panel {
  top: 14px;
  max-height: calc(100vh - 234px);
  padding: 12px;
}

.schedule-modern-page .resource-panel-head {
  display: block;
  margin-bottom: 10px;
}

.schedule-modern-page .resource-panel-head h2 {
  margin: 0;
  color: #0f172a;
  font-size: 17px;
  line-height: 1.1;
}

.schedule-modern-page .resource-panel-loads-only .resource-panel-head {
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--modern-line);
}

.schedule-modern-page .resource-panel-loads-only #resourceSearch {
  margin-bottom: 12px;
}

.schedule-modern-page .resource-panel-loads-only .resource-filters {
  margin-bottom: 12px;
}

.schedule-modern-page .resource-panel-loads-only .resource-summary {
  margin-bottom: 12px;
}

.schedule-modern-page .resource-tabs {
  gap: 8px;
  margin-bottom: 10px;
}

.schedule-modern-page .resource-tabs button {
  min-height: 38px;
  border-radius: 10px;
  border-color: var(--modern-line);
  background: #ffffff;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

.schedule-modern-page .resource-tabs button.active {
  background: var(--modern-blue);
  border-color: var(--modern-blue);
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.18);
}

.schedule-modern-page #resourceSearch {
  margin-bottom: 10px;
}

.schedule-modern-page .resource-filters {
  gap: 8px;
  margin-bottom: 10px;
}

.schedule-modern-page .resource-filter-field span {
  color: #64748b;
  font-weight: 700;
}

.schedule-modern-page .resource-filter-field input,
.schedule-modern-page .resource-filter-field select,
.schedule-modern-page .resource-filter-field summary,
.schedule-modern-page .resource-filters > input,
.schedule-modern-page .resource-filters > select {
  min-height: 36px;
  border-color: var(--modern-line);
  border-radius: 9px;
}

.schedule-modern-page .resource-summary {
  border-color: #dbeafe;
  background: #eff6ff;
  color: #1e3a8a;
  border-radius: 10px;
  padding: 9px 10px;
}

.schedule-modern-page .resource-list {
  gap: 8px;
}

.schedule-modern-page .panel-card {
  position: relative;
  gap: 3px;
  padding: 9px 10px 9px 12px;
  border: 1px solid var(--modern-line);
  border-left: 4px solid var(--modern-blue);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.06);
}

.schedule-modern-page .panel-card b {
  color: #0f172a;
  font-size: 14px;
}

.schedule-modern-page .panel-card span {
  color: #1e293b;
  font-size: 12px;
}

.schedule-modern-page .panel-card small,
.schedule-modern-page .panel-card em {
  color: #64748b;
  font-size: 11px;
}

.schedule-modern-page .status-footer {
  position: sticky;
  bottom: 0;
  z-index: 12;
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-top: 12px;
  padding: 10px 14px;
  color: #475569;
  font-size: 12px;
}

.schedule-modern-page .status-footer strong {
  color: #0f172a;
}

@media (min-width: 1181px) {
  .schedule-modern-main {
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 16px;
  }

  body.schedule-positioning-empty .schedule-modern-main {
    grid-template-rows: auto auto minmax(0, 1fr) auto;
  }

  .schedule-modern-page .dashboard-layout {
    height: 100%;
    min-height: 0;
    align-items: stretch;
    overflow: hidden;
  }

  .schedule-modern-page .board,
  .schedule-modern-page .resource-panel {
    height: 100%;
    min-height: 0;
    max-height: none;
  }

  .schedule-modern-page .resource-panel {
    position: static;
  }

  .schedule-modern-page .status-footer {
    position: static;
  }
}

.schedule-modern-page .sync-running {
  color: #0f766e;
}

@media (max-width: 1480px) {
  .schedule-modern-page .controls.schedule-filter-bar {
    grid-template-columns: minmax(390px, 1.5fr) repeat(3, minmax(140px, 1fr));
  }

  .schedule-modern-page .board-filter-group {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1180px) {
  .status-kpi-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }

  .status-page-grid {
    grid-template-columns: 1fr;
  }

  .schedule-modern-header {
    display: grid;
  }

  .schedule-header-actions {
    justify-content: flex-start;
  }

  .schedule-modern-page .dashboard-layout {
    grid-template-columns: 1fr;
  }

  .schedule-modern-page .resource-panel {
    position: static;
    max-height: none;
  }
}

/* Global modern portal polish */
body:not(.auth-page) {
  --portal-bg: #f5f7fb;
  --portal-surface: #ffffff;
  --portal-line: #dbe3ef;
  --portal-text: #0f172a;
  --portal-muted: #64748b;
  --portal-blue: #2563eb;
  --portal-blue-dark: #1d4ed8;
  --portal-green: #0f8a64;
  --portal-yellow: #f59e0b;
  --portal-red: #dc2626;
  background: var(--portal-bg);
  color: var(--portal-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

body:not(.auth-page) main {
  min-width: 0;
  padding: 22px;
  background: var(--portal-bg);
}

body:not(.auth-page) .sidebar {
  background:
    radial-gradient(circle at 18% 0%, rgba(37, 99, 235, 0.24), transparent 32%),
    linear-gradient(180deg, #08182c 0%, #0b213c 52%, #071426 100%);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.08), 8px 0 24px rgba(15, 23, 42, 0.12);
}

body:not(.auth-page) .sidebar-brand {
  min-height: 80px;
  padding: 16px 14px;
  background: rgba(255, 255, 255, 0.02);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

body:not(.auth-page) .brand-mark,
body:not(.auth-page) .sidebar .brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, #ffffff 0%, #dbeafe 100%);
}

body:not(.auth-page) .brand-text strong {
  color: #ffffff;
  font-size: 16px;
  letter-spacing: 0;
}

body:not(.auth-page) .brand-text span {
  color: rgba(226, 232, 240, 0.8);
  font-size: 11px;
  font-weight: 600;
}

body:not(.auth-page) .sidebar-collapse-toggle {
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
}

body:not(.auth-page) .sidebar-nav {
  padding: 14px 10px;
  gap: 14px;
}

body:not(.auth-page) .nav-section + .nav-section {
  border-top-color: rgba(255, 255, 255, 0.08);
}

body:not(.auth-page) .nav-section-title {
  padding-left: 8px;
  color: rgba(203, 213, 225, 0.72);
  font-size: 10px;
  letter-spacing: 0.03em;
}

body:not(.auth-page) .nav-item {
  min-height: 40px;
  border-left: 0;
  border-radius: 10px;
  color: rgba(241, 245, 249, 0.88);
  font-weight: 650;
}

body:not(.auth-page) .nav-item:hover,
body:not(.auth-page) .nav-group.open > .nav-group-toggle {
  background: rgba(255, 255, 255, 0.08);
}

body:not(.auth-page) .nav-item.active,
body:not(.auth-page) .nav-subitem.active {
  color: #ffffff;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.28);
}

body:not(.auth-page) .nav-icon {
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.08);
}

body:not(.auth-page) .nav-item.active .nav-icon {
  background: rgba(255, 255, 255, 0.18);
}

body:not(.auth-page) .nav-submenu {
  margin-left: 36px;
  border-left: 1px solid rgba(148, 163, 184, 0.2);
}

body:not(.auth-page) .nav-subitem {
  min-height: 34px;
  padding-left: 12px;
  border-radius: 8px;
  color: rgba(226, 232, 240, 0.8);
  font-weight: 600;
}

body:not(.auth-page) .sidebar-account {
  margin-top: auto;
  padding: 14px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(2, 6, 23, 0.22);
}

body:not(.auth-page) .sidebar-account-avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.26);
}

body:not(.auth-page) .sidebar-account-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

body:not(.auth-page) .sidebar-account span {
  color: #ffffff;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
}

body:not(.auth-page) .sidebar-account small {
  color: rgba(226, 232, 240, 0.72);
  font-size: 11px;
  font-weight: 500;
}

body:not(.auth-page) .sidebar-account button {
  width: 26px;
  height: 26px;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgba(226, 232, 240, 0.78);
  font-size: 0;
}

body:not(.auth-page) .sidebar-account button::before {
  content: "v";
  font-size: 13px;
  font-weight: 800;
}

body:not(.auth-page) .sidebar-account button:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account {
  grid-template-columns: 1fr;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account-avatar {
  width: 34px;
  height: 34px;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account::before {
  display: none;
}

body:not(.auth-page) .sidebar-account {
  position: relative;
  display: block;
  padding: 12px;
}

body:not(.auth-page) .sidebar-account-toggle {
  width: 100%;
  height: auto;
  min-height: 54px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  overflow: visible;
  padding: 8px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #ffffff;
  text-align: left;
  font-size: inherit;
}

body:not(.auth-page) .sidebar-account-toggle::before,
body:not(.auth-page) .sidebar-account-menu button::before {
  content: none;
}

body:not(.auth-page) .sidebar-account-toggle:hover,
body:not(.auth-page) .sidebar-account-toggle[aria-expanded="true"] {
  background: rgba(255, 255, 255, 0.08);
}

body:not(.auth-page) .sidebar-account-chevron {
  width: 8px;
  height: 8px;
  justify-self: center;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}

body:not(.auth-page) .sidebar-account-toggle[aria-expanded="true"] .sidebar-account-chevron {
  margin-top: 5px;
  transform: rotate(-135deg);
}

body:not(.auth-page) .sidebar-account-menu {
  position: absolute;
  right: 12px;
  bottom: 76px;
  left: 12px;
  z-index: 30;
  display: grid;
  gap: 4px;
  padding: 8px;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 8px;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.24);
}

body:not(.auth-page) .sidebar-account-menu[hidden] {
  display: none;
}

body:not(.auth-page) .sidebar-account-menu a,
body:not(.auth-page) .sidebar-account-menu button {
  width: 100%;
  height: auto;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #17231e;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  text-decoration: none;
}

body:not(.auth-page) .sidebar-account-menu a:hover,
body:not(.auth-page) .sidebar-account-menu button:hover {
  background: #eef5f1;
  color: #174d3a;
}

body:not(.auth-page) .sidebar-account-menu button[data-sign-out] {
  color: #b42318;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account {
  padding: 10px 7px;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account-toggle {
  grid-template-columns: 1fr;
  justify-items: center;
  min-height: 44px;
  padding: 5px;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account .sidebar-account-avatar {
  display: grid;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account-copy,
body.sidebar-collapsed:not(.auth-page) .sidebar-account-chevron,
body.sidebar-collapsed:not(.auth-page) .sidebar-account-menu {
  display: none;
}

body:not(.auth-page) .sidebar-account {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
}

body:not(.auth-page) .sidebar-account-link {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 8px;
  color: #ffffff;
  text-decoration: none;
  border-radius: 10px;
}

body:not(.auth-page) .sidebar-account-link:hover,
body:not(.auth-page) .sidebar-account-link:focus-visible {
  background: rgba(255, 255, 255, 0.08);
  outline: none;
}

body:not(.auth-page) .sidebar-account .sidebar-account-logout {
  width: 100%;
  height: 34px;
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  margin: 0;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.92);
  font-size: 12px;
  font-weight: 800;
}

body:not(.auth-page) .sidebar-account .sidebar-account-logout::before {
  content: none;
}

body:not(.auth-page) .sidebar-account .sidebar-account-logout:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account {
  padding: 10px 7px;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account-link {
  grid-template-columns: 1fr;
  justify-items: center;
  min-height: 44px;
  padding: 5px;
}

body.sidebar-collapsed:not(.auth-page) .sidebar-account .sidebar-account-logout {
  display: none;
}

body:not(.auth-page) .topbar {
  align-items: flex-start;
  margin-bottom: 14px;
}

body:not(.auth-page) .topbar h1,
body:not(.auth-page) h1 {
  color: #0f172a;
  font-size: 28px;
  line-height: 1.08;
  letter-spacing: 0;
}

body:not(.auth-page) .topbar p,
body:not(.auth-page) p {
  color: var(--portal-muted);
}

body:not(.auth-page) button,
body:not(.auth-page) .secondary-link,
body:not(.auth-page) .primary-action,
body:not(.auth-page) .danger-action {
  min-height: 36px;
  border-radius: 9px;
  border: 1px solid var(--portal-line);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  font-weight: 700;
}

body:not(.auth-page) button:hover,
body:not(.auth-page) .secondary-link:hover {
  border-color: #93c5fd;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

body:not(.auth-page) .primary-action,
body:not(.auth-page) .resource-tabs button.active,
body:not(.auth-page) .user-filter.active,
body:not(.auth-page) .task-tabs button.active,
body:not(.auth-page) .task-view-switch button.active {
  color: #ffffff;
  background: var(--portal-blue);
  border-color: var(--portal-blue);
}

body:not(.auth-page) .danger-action {
  color: #ffffff;
  background: var(--portal-red);
  border-color: var(--portal-red);
}

body:not(.auth-page) input,
body:not(.auth-page) select,
body:not(.auth-page) textarea,
body:not(.auth-page) summary {
  border-color: var(--portal-line);
  border-radius: 9px;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

body:not(.auth-page) input:focus,
body:not(.auth-page) select:focus,
body:not(.auth-page) textarea:focus {
  outline: 2px solid rgba(37, 99, 235, 0.18);
  border-color: #93c5fd;
}

body:not(.auth-page) .status,
body:not(.auth-page) .controls,
body:not(.auth-page) .board,
body:not(.auth-page) .resource-panel,
body:not(.auth-page) .database-filters,
body:not(.auth-page) .database-table-wrap,
body:not(.auth-page) .tracking-filters,
body:not(.auth-page) .tracking-summary,
body:not(.auth-page) .tracking-card,
body:not(.auth-page) .task-board,
body:not(.auth-page) .task-card,
body:not(.auth-page) .task-empty,
body:not(.auth-page) .task-form-panel,
body:not(.auth-page) .task-toolbar,
body:not(.auth-page) .task-calendar-controls,
body:not(.auth-page) .user-toolbar,
body:not(.auth-page) .user-filter-bar,
body:not(.auth-page) .user-detail-drawer,
body:not(.auth-page) .routing-controls,
body:not(.auth-page) .routing-loads-panel,
body:not(.auth-page) .routing-resource-panel,
body:not(.auth-page) .driver-filters,
body:not(.auth-page) .open-truck-filters,
body:not(.auth-page) .open-truck-row,
body:not(.auth-page) .onboarding-toolbar,
body:not(.auth-page) .onboarding-column,
body:not(.auth-page) .settings-link-card,
body:not(.auth-page) .broker-out-panel {
  border: 1px solid var(--portal-line);
  border-radius: 14px;
  background: var(--portal-surface);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

body:not(.auth-page) .controls,
body:not(.auth-page) .database-filters,
body:not(.auth-page) .tracking-filters,
body:not(.auth-page) .driver-filters,
body:not(.auth-page) .open-truck-filters,
body:not(.auth-page) .onboarding-toolbar,
body:not(.auth-page) .routing-controls {
  padding: 14px;
}

body:not(.auth-page) .database-table {
  border-collapse: separate;
  border-spacing: 0;
}

body:not(.auth-page) .database-table th {
  background: #f8fafc;
  color: #64748b;
  border-bottom: 1px solid var(--portal-line);
  font-size: 12px;
  text-transform: none;
}

body:not(.auth-page) .database-table td {
  border-bottom: 1px solid #edf2f7;
}

body:not(.auth-page) .database-table tbody tr:hover {
  background: #f8fbff;
}

body:not(.auth-page) .panel-card,
body:not(.auth-page) .routing-load-card,
body:not(.auth-page) .routing-resource-card,
body:not(.auth-page) .tracking-card,
body:not(.auth-page) .task-card,
body:not(.auth-page) .onboarding-card,
body:not(.auth-page) .open-truck-row,
body:not(.auth-page) .settings-link-card {
  border-radius: 12px;
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.06);
}

body:not(.auth-page) .modal-overlay {
  z-index: 80;
  padding: 28px;
  background: rgba(15, 23, 42, 0.48);
  backdrop-filter: blur(2px);
}

body:not(.auth-page) .modal-panel {
  border: 1px solid rgba(219, 227, 239, 0.95);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.28);
  padding: 22px;
}

body:not(.auth-page) .modal-close {
  top: 16px;
  right: 16px;
  min-height: 34px;
  border-radius: 9px;
}

body:not(.auth-page) .eyebrow {
  color: var(--portal-green);
  letter-spacing: 0.02em;
}

body:not(.auth-page) .modal-panel h2 {
  color: #0f172a;
  letter-spacing: 0;
}

body:not(.auth-page) .detail-grid {
  gap: 10px;
}

body:not(.auth-page) .detail-grid div,
body:not(.auth-page) .empty-move-form .detail-grid label,
body:not(.auth-page) .truck-status-form .detail-grid label,
body:not(.auth-page) .truck-status-eta-form .detail-grid label,
body:not(.auth-page) .truck-ready-form .detail-grid label {
  border-color: var(--portal-line);
  border-radius: 12px;
  background: #f8fafc;
}

body:not(.auth-page) .detail-grid span {
  color: #64748b;
}

body:not(.auth-page) .detail-grid strong {
  color: #0f172a;
}

body:not(.auth-page) .modal-actions,
body:not(.auth-page) .broker-modal-actions > div,
body:not(.auth-page) .task-actions,
body:not(.auth-page) .row-actions {
  gap: 8px;
}

@media (max-width: 900px) {
  body:not(.auth-page) main {
    padding: 14px;
  }

  body:not(.auth-page) .topbar {
    display: grid;
  }
}

/* Brighter sidebar refinement */
body:not(.auth-page) .sidebar,
.schedule-modern-page .sidebar {
  background:
    radial-gradient(circle at 14% 0%, rgba(125, 184, 255, 0.26), transparent 34%),
    linear-gradient(180deg, #1b497a 0%, #173f6c 44%, #11365f 100%);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.14), 8px 0 24px rgba(15, 23, 42, 0.1);
}

body:not(.auth-page) .sidebar-brand,
.schedule-modern-page .sidebar-brand {
  grid-template-columns: 32px minmax(0, 1fr) 32px;
  min-height: 76px;
  padding: 14px 12px;
  background: rgba(255, 255, 255, 0.07);
  border-bottom-color: rgba(255, 255, 255, 0.16);
}

body:not(.auth-page) .brand-wordmark,
.schedule-modern-page .brand-wordmark {
  display: grid;
  grid-column: 2;
  align-content: center;
  justify-items: center;
  color: #ffffff;
  line-height: 1;
  text-align: center;
}

body:not(.auth-page) .brand-wordmark strong,
.schedule-modern-page .brand-wordmark strong {
  color: #ffffff;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: 0;
}

body:not(.auth-page) .brand-wordmark span,
.schedule-modern-page .brand-wordmark span {
  margin-top: 3px;
  color: rgba(255, 255, 255, 0.9);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.38em;
  padding-left: 0.38em;
}

body:not(.auth-page) .brand-mark,
.schedule-modern-page .brand-mark {
  display: none;
}

body:not(.auth-page) .brand-text strong,
.schedule-modern-page .brand-text strong {
  display: none;
}

body:not(.auth-page) .brand-text span,
.schedule-modern-page .brand-text span {
  display: none;
}

body:not(.auth-page) .nav-section-title,
.schedule-modern-page .nav-section-title {
  color: rgba(219, 234, 254, 0.86);
}

body:not(.auth-page) .nav-item,
.schedule-modern-page .nav-item,
body:not(.auth-page) .nav-subitem,
.schedule-modern-page .nav-subitem {
  color: rgba(248, 250, 252, 0.94);
}

body:not(.auth-page) .nav-icon,
.schedule-modern-page .nav-icon {
  background: rgba(219, 234, 254, 0.13);
  border: 1px solid rgba(191, 219, 254, 0.26);
  color: #dbeafe;
  box-shadow: none;
}

body:not(.auth-page) .nav-icon .icon-line,
.schedule-modern-page .nav-icon .icon-line {
  stroke: #dbeafe;
}

body:not(.auth-page) .nav-icon .icon-fill,
body:not(.auth-page) .nav-icon .icon-accent,
body:not(.auth-page) .nav-icon .icon-soft,
.schedule-modern-page .nav-icon .icon-fill,
.schedule-modern-page .nav-icon .icon-accent,
.schedule-modern-page .nav-icon .icon-soft {
  fill: none;
  stroke: #bfdbfe;
}

body:not(.auth-page) .nav-item:hover,
body:not(.auth-page) .nav-group.open > .nav-group-toggle,
.schedule-modern-page .nav-item:hover,
.schedule-modern-page .nav-group.open > .nav-group-toggle {
  background: rgba(255, 255, 255, 0.11);
}

body:not(.auth-page) .nav-item.active,
body:not(.auth-page) .nav-subitem.active,
.schedule-modern-page .nav-item.active,
.schedule-modern-page .nav-subitem.active {
  background: linear-gradient(135deg, #2f6df6 0%, #1f5cdf 100%);
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22);
}

body:not(.auth-page) .nav-item.active .nav-icon,
.schedule-modern-page .nav-item.active .nav-icon {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.34);
}

body:not(.auth-page) .nav-item.active .nav-icon .icon-line,
.schedule-modern-page .nav-item.active .nav-icon .icon-line {
  stroke: #ffffff;
}

body:not(.auth-page) .nav-item.active .nav-icon .icon-fill,
body:not(.auth-page) .nav-item.active .nav-icon .icon-accent,
body:not(.auth-page) .nav-item.active .nav-icon .icon-soft,
.schedule-modern-page .nav-item.active .nav-icon .icon-fill,
.schedule-modern-page .nav-item.active .nav-icon .icon-accent,
.schedule-modern-page .nav-item.active .nav-icon .icon-soft {
  fill: none;
  stroke: #ffffff;
}

body:not(.auth-page) .sidebar-account,
.schedule-modern-page .sidebar-account {
  background: rgba(255, 255, 255, 0.07);
  border-top-color: rgba(255, 255, 255, 0.14);
}

body.sidebar-collapsed:not(.auth-page) .sidebar-brand {
  grid-template-columns: 1fr;
}

body.sidebar-collapsed:not(.auth-page) .brand-wordmark {
  display: none;
}

/* Schedule board readability polish */
.schedule-modern-page .board-density-field {
  display: flex;
  align-items: end;
  gap: 8px;
  min-width: 0;
  grid-column: span 2;
}

.schedule-modern-page .board-density-field > span {
  padding-bottom: 10px;
  color: #475569;
  font-size: 12px;
  font-weight: 750;
}

.schedule-modern-page .board-density-toggle {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--modern-line);
  border-radius: 11px;
  background: #f8fafc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.schedule-modern-page .board-density-toggle button {
  min-height: 32px;
  padding: 5px 9px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #475569;
  box-shadow: none;
  font-size: 12px;
  font-weight: 750;
}

.schedule-modern-page .board-density-toggle button.active {
  color: #ffffff;
  background: var(--modern-blue);
  box-shadow: 0 6px 12px rgba(37, 99, 235, 0.18);
}

.schedule-modern-page .day-header.today {
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.11), rgba(37, 99, 235, 0.045));
}

.schedule-modern-page .cell.today-cell {
  background: rgba(37, 99, 235, 0.035);
  box-shadow: inset 2px 0 0 rgba(37, 99, 235, 0.24), inset -2px 0 0 rgba(37, 99, 235, 0.18);
}

.schedule-modern-page .load-card,
.schedule-modern-page .last-location,
.schedule-modern-page .moved-location-marker,
.schedule-modern-page .truck-status-card,
.schedule-modern-page .home-reset-card,
.schedule-modern-page .schedule-note-card {
  transition: transform 120ms ease, box-shadow 120ms ease, outline-color 120ms ease;
}

.schedule-modern-page .load-card b,
.schedule-modern-page .last-location b,
.schedule-modern-page .moved-location-marker b,
.schedule-modern-page .truck-status-card b,
.schedule-modern-page .home-reset-card b {
  font-size: 11.5px;
  font-weight: 850;
  line-height: 1.05;
}

.schedule-modern-page .load-card span,
.schedule-modern-page .last-location span,
.schedule-modern-page .moved-location-marker span,
.schedule-modern-page .truck-status-card span,
.schedule-modern-page .home-reset-card span {
  font-size: 12.5px;
  font-weight: 750;
  line-height: 1.12;
}

.schedule-modern-page .load-card small,
.schedule-modern-page .last-location small,
.schedule-modern-page .moved-location-marker small,
.schedule-modern-page .truck-status-card small,
.schedule-modern-page .home-reset-card small {
  font-size: 10px;
  font-weight: 650;
  line-height: 1.18;
  opacity: 0.9;
}

.schedule-modern-page .load-card:hover,
.schedule-modern-page .last-location:hover,
.schedule-modern-page .moved-location-marker:hover,
.schedule-modern-page .truck-status-card:hover,
.schedule-modern-page .schedule-note-card:hover,
.schedule-modern-page .home-reset-card:hover {
  transform: translateY(-1px);
  outline: 2px solid rgba(37, 99, 235, 0.18);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16);
  cursor: pointer;
}

.schedule-modern-page .status-footer strong,
.schedule-modern-page .status-footer span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.schedule-modern-page .status-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.12);
}

.schedule-modern-page .status-dot-ok {
  background: #16a34a;
}

.schedule-modern-page .status-dot-idle {
  background: #f59e0b;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.14);
}

body.board-density-compact.schedule-modern-page .corner,
body.board-density-compact.schedule-modern-page .day-header {
  min-height: 38px;
  padding: 7px 8px;
}

body.board-density-compact.schedule-modern-page .truck,
body.board-density-compact.schedule-modern-page .cell {
  min-height: 76px;
}

body.board-density-compact.schedule-modern-page .cell {
  padding: 4px;
  contain-intrinsic-size: 76px 150px;
}

body.board-density-compact.schedule-modern-page .resource {
  min-height: 18px;
  padding: 2px 6px;
  font-size: 10px;
}

body.board-density-compact.schedule-modern-page .load-card,
body.board-density-compact.schedule-modern-page .last-location,
body.board-density-compact.schedule-modern-page .moved-location-marker,
body.board-density-compact.schedule-modern-page .truck-status-card {
  gap: 2px;
  padding: 5px 6px;
}

body.board-density-compact.schedule-modern-page .load-card b,
body.board-density-compact.schedule-modern-page .last-location b,
body.board-density-compact.schedule-modern-page .moved-location-marker b,
body.board-density-compact.schedule-modern-page .truck-status-card b {
  font-size: 10.5px;
}

body.board-density-compact.schedule-modern-page .load-card span,
body.board-density-compact.schedule-modern-page .last-location span,
body.board-density-compact.schedule-modern-page .moved-location-marker span,
body.board-density-compact.schedule-modern-page .truck-status-card span {
  font-size: 11.5px;
}

body.board-density-compact.schedule-modern-page .load-card small,
body.board-density-compact.schedule-modern-page .last-location small,
body.board-density-compact.schedule-modern-page .moved-location-marker small,
body.board-density-compact.schedule-modern-page .truck-status-card small {
  font-size: 9.5px;
}

body.board-view-loads-only.schedule-modern-page .cell > .resource {
  display: none;
}

body.board-view-loads-only.schedule-modern-page .truck,
body.board-view-loads-only.schedule-modern-page .cell {
  min-height: 54px;
}

body.board-view-loads-only.schedule-modern-page .cell {
  contain-intrinsic-size: 54px 150px;
}

/* Modern Tracking page layout */
.tracking-modern-page main {
  background: var(--portal-bg);
}

.tracking-modern-page .topbar {
  align-items: center;
  margin-bottom: 14px;
}

.tracking-modern-page .topbar button {
  min-width: 96px;
  border-color: var(--portal-line);
  background: #ffffff;
  color: #0f172a;
}

.tracking-modern-page .tracking-filters {
  display: grid;
  grid-template-columns: minmax(360px, 1fr);
  gap: 12px;
  padding: 14px;
  margin-bottom: 12px;
  border: 1px solid var(--portal-line);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.tracking-modern-page .tracking-filters input,
.tracking-modern-page .tracking-filters select {
  min-height: 42px;
  border-radius: 10px;
  font-size: 14px;
}

.tracking-modern-page .tracking-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) auto;
  gap: 10px;
  align-items: stretch;
  padding: 0;
  margin-bottom: 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.tracking-modern-page .tracking-count {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 2px 10px;
  align-items: center;
  min-height: 64px;
  padding: 12px;
  border: 1px solid var(--portal-line);
  border-radius: 13px;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.055);
  text-align: left;
}

.tracking-modern-page .tracking-count::before {
  display: none;
}

.tracking-modern-page .tracking-count-icon {
  grid-row: 1 / span 2;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 999px;
  background: #eff6ff;
  color: #2563eb;
  box-shadow: inset 0 0 0 1px #bfdbfe;
}

.tracking-modern-page .tracking-icon {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tracking-modern-page .tracking-count strong {
  font-size: 18px;
  line-height: 1;
}

.tracking-modern-page .tracking-count span {
  color: #64748b;
  font-size: 12px;
  font-weight: 750;
}

.tracking-modern-page .tracking-count.active {
  border-color: #93c5fd;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.1), 0 10px 24px rgba(15, 23, 42, 0.075);
}

.tracking-modern-page .tracking-count.all .tracking-count-icon {
  background: #eff6ff;
  color: #2563eb;
  box-shadow: inset 0 0 0 1px #bfdbfe;
}

.tracking-modern-page .tracking-count.danger .tracking-count-icon {
  background: #fff1f2;
  color: #ef4444;
  box-shadow: inset 0 0 0 1px #fecdd3;
}

.tracking-modern-page .tracking-count.warning .tracking-count-icon {
  background: #fffbeb;
  color: #f59e0b;
  box-shadow: inset 0 0 0 1px #fde68a;
}

.tracking-modern-page .tracking-count.missing .tracking-count-icon {
  background: #eff6ff;
  color: #60a5fa;
  box-shadow: inset 0 0 0 1px #bfdbfe;
}

.tracking-modern-page .tracking-count.ok .tracking-count-icon {
  background: #ecfdf5;
  color: #10b981;
  box-shadow: inset 0 0 0 1px #bbf7d0;
}

.tracking-modern-page .tracking-count.no-next .tracking-count-icon {
  background: #f8fafc;
  color: #94a3b8;
  box-shadow: inset 0 0 0 1px #e2e8f0;
}

.tracking-modern-page .tracking-count.danger strong {
  color: #be123c;
}

.tracking-modern-page .tracking-count.warning strong {
  color: #b45309;
}

.tracking-modern-page .tracking-count.missing strong {
  color: #2563eb;
}

.tracking-modern-page .tracking-count.ok strong {
  color: #047857;
}

.tracking-modern-page .tracking-count.no-next strong {
  color: #64748b;
}

.tracking-modern-page .last-refresh {
  align-self: center;
  justify-self: end;
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}

.tracking-modern-page .tracking-list {
  display: grid;
  gap: 8px;
}

.tracking-modern-page .tracking-card {
  display: grid;
  grid-template-columns: minmax(190px, 0.95fr) minmax(250px, 1.45fr) minmax(210px, 1.05fr) minmax(210px, 1.05fr) minmax(250px, 1.35fr);
  gap: 0;
  align-items: stretch;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--portal-line);
  border-left: 6px solid #94a3b8;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.055);
  transition: background-color 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
}

.tracking-modern-page .tracking-card:hover {
  background: #fbfdff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.09);
}

.tracking-modern-page .tracking-card.danger {
  border-left-color: #ef4444;
  background: #fffafa;
}

.tracking-modern-page .tracking-card.warning {
  border-left-color: #f59e0b;
  background: #fffdf5;
}

.tracking-modern-page .tracking-card.missing_eta {
  border-left-color: #3b82f6;
}

.tracking-modern-page .tracking-card.ok {
  border-left-color: #10b981;
}

.tracking-modern-page .tracking-card.no_next {
  border-left-color: #94a3b8;
}

.tracking-modern-page .tracking-card-head,
.tracking-modern-page .tracking-column {
  display: grid;
  align-content: center;
  gap: 4px;
  min-width: 0;
  padding: 14px 16px;
  border-left: 1px solid #edf2f7;
}

.tracking-modern-page .tracking-card-head {
  border-left: 0;
}

.tracking-modern-page .tracking-card-head strong {
  color: #0f172a;
  font-size: 19px;
  line-height: 1.05;
}

.tracking-modern-page .tracking-card-head span,
.tracking-modern-page .tracking-column span {
  color: #475569;
  font-size: 12px;
  line-height: 1.3;
}

.tracking-modern-page .tracking-column small {
  color: #64748b;
  font-size: 10.5px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tracking-modern-page .tracking-column b {
  color: #0f172a;
  font-size: 14px;
  line-height: 1.2;
}

.tracking-modern-page .tracking-load-stack {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tracking-modern-page .tracking-pill {
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 7px;
  font-size: 11.5px;
}

.tracking-modern-page .tracking-pill.danger {
  background: #ffe4e6;
  color: #be123c;
}

.tracking-modern-page .tracking-pill.warning {
  background: #fef3c7;
  color: #92400e;
}

.tracking-modern-page .tracking-pill.missing_eta {
  background: #dbeafe;
  color: #1d4ed8;
}

.tracking-modern-page .tracking-pill.ok {
  background: #d1fae5;
  color: #047857;
}

.tracking-modern-page .tracking-pill.no_next {
  background: #f1f5f9;
  color: #475569;
}

.tracking-modern-page .tracking-progress-row {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.tracking-modern-page .tracking-progress-track {
  position: relative;
  height: 7px;
  border-radius: 999px;
  background: #e2e8f0;
}

.tracking-modern-page .tracking-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  min-width: 18px;
  border-radius: inherit;
  background: #94a3b8;
}

.tracking-modern-page .tracking-progress-truck {
  position: absolute;
  top: 50%;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  color: #0f172a;
  transform: translate(-50%, -50%);
}

.tracking-modern-page .tracking-progress-truck .tracking-icon {
  width: 17px;
  height: 17px;
  filter: drop-shadow(0 1px 1px rgba(15, 23, 42, 0.2));
}

.tracking-modern-page .tracking-progress-fill.danger {
  background: #ef4444;
}

.tracking-modern-page .tracking-progress-fill.warning {
  background: #f59e0b;
}

.tracking-modern-page .tracking-progress-fill.missing {
  background: #3b82f6;
}

.tracking-modern-page .tracking-progress-fill.ok {
  background: #10b981;
}

.tracking-modern-page .tracking-message {
  color: #1e293b;
  font-size: 12px;
  font-weight: 750;
}

.tracking-modern-page .tracking-buffer {
  color: #047857;
  font-weight: 800;
}

.tracking-modern-page .empty-tracking {
  display: block;
  padding: 22px;
  color: #64748b;
}

@media (max-width: 1500px) {
  .tracking-modern-page .tracking-summary {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .tracking-modern-page .last-refresh {
    justify-self: start;
  }

  .tracking-modern-page .tracking-card {
    grid-template-columns: minmax(170px, 0.8fr) minmax(230px, 1.25fr) minmax(190px, 1fr) minmax(190px, 1fr) minmax(230px, 1.15fr);
  }
}

@media (max-width: 1100px) {
  .tracking-modern-page .tracking-filters {
    grid-template-columns: 1fr;
  }

  .tracking-modern-page .tracking-card {
    grid-template-columns: 1fr;
  }

  .tracking-modern-page .tracking-card-head,
  .tracking-modern-page .tracking-column {
    border-left: 0;
    border-top: 1px solid #edf2f7;
  }

  .tracking-modern-page .tracking-card-head {
    border-top: 0;
  }
}

/* Modern Tasks page layout */
.tasks-modern-page main {
  background: #f6f8fb;
}

.tasks-modern-page .topbar {
  align-items: flex-start;
  margin-bottom: 18px;
}

.tasks-modern-page .topbar h1 {
  color: #0f172a;
  font-size: 28px;
  letter-spacing: 0;
}

.tasks-modern-page .topbar p {
  color: #64748b;
  font-size: 15px;
}

.tasks-modern-page #newTaskButton {
  min-height: 48px;
  padding: 0 22px;
  border-radius: 10px;
  background: #2563eb;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.22);
}

.tasks-modern-page .task-board {
  display: grid;
  gap: 14px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.tasks-modern-page .task-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
}

.tasks-modern-page .task-kpi-card {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 82px;
  padding: 16px 18px;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.tasks-modern-page .task-kpi-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  font-size: 13px;
  font-weight: 900;
}

.tasks-modern-page .task-kpi-card strong {
  display: block;
  color: #0f172a;
  font-size: 22px;
  line-height: 1;
}

.tasks-modern-page .task-kpi-card span:last-child {
  display: block;
  margin-top: 5px;
  color: #334155;
  font-size: 13px;
  font-weight: 750;
}

.tasks-modern-page .task-kpi-card.blue .task-kpi-icon {
  background: #dbeafe;
  color: #2563eb;
}

.tasks-modern-page .task-kpi-card.amber .task-kpi-icon {
  background: #fef3c7;
  color: #d97706;
}

.tasks-modern-page .task-kpi-card.red .task-kpi-icon {
  background: #ffe4e6;
  color: #e11d48;
}

.tasks-modern-page .task-kpi-card.purple .task-kpi-icon {
  background: #ede9fe;
  color: #7c3aed;
}

.tasks-modern-page .task-kpi-card.green .task-kpi-icon {
  background: #dcfce7;
  color: #059669;
}

.tasks-modern-page .task-toolbar {
  display: grid;
  grid-template-columns: auto minmax(680px, 1fr);
  gap: 14px 28px;
  align-items: end;
  margin: 0;
  padding: 14px;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.05);
}

.tasks-modern-page .task-tabs {
  gap: 6px;
}

.tasks-modern-page .task-tabs button {
  min-height: 38px;
  padding: 0 14px;
  border-color: #dbe3ef;
  border-radius: 12px;
  background: #ffffff;
  color: #0f172a;
  font-weight: 800;
}

.tasks-modern-page .task-tabs button.active {
  border-color: #2563eb;
  background: #2563eb;
  color: #ffffff;
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.18);
}

.tasks-modern-page .task-toolbar-right {
  display: grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr)) minmax(450px, 2fr);
  gap: 10px;
  align-items: end;
}

.tasks-modern-page .task-filter-select {
  display: grid;
  gap: 5px;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.tasks-modern-page .task-filter-select select,
.tasks-modern-page #taskSearch {
  min-height: 40px;
  border-radius: 10px;
}

.tasks-modern-page #taskSearch {
  min-width: 0;
  padding-left: 14px;
}

.tasks-modern-page #taskSummary {
  min-height: 0;
  padding: 0 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: #64748b;
  font-size: 13px;
}

.tasks-modern-page .task-content-grid {
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}

.tasks-modern-page .task-today-panel,
.tasks-modern-page .task-calendar-panel {
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

.tasks-modern-page .task-today-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 640px;
  padding: 14px;
}

.tasks-modern-page .task-today-header {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: center;
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid #edf2f7;
  border-radius: 10px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.tasks-modern-page .task-today-header b {
  display: grid;
  min-width: 25px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: #dbeafe;
  color: #2563eb;
}

.tasks-modern-page .task-today-list {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px 0;
}

.tasks-modern-page .task-today-card {
  position: relative;
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 96px;
  padding: 14px;
  border: 1px solid #e2e8f0;
  border-left: 3px solid #2563eb;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
  cursor: pointer;
}

.tasks-modern-page .task-today-card::before {
  content: "";
  position: absolute;
  left: 45px;
  top: 54px;
  bottom: -17px;
  width: 1px;
  background: #e2e8f0;
}

.tasks-modern-page .task-today-card:last-child::before {
  display: none;
}

.tasks-modern-page .task-today-card:hover {
  background: #f8fbff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.tasks-modern-page .task-today-card time {
  color: #ef4444;
  font-size: 13px;
  font-weight: 900;
}

.tasks-modern-page .task-today-card h3 {
  margin: 0;
  overflow: hidden;
  color: #0f172a;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-modern-page .task-today-card p,
.tasks-modern-page .task-today-card span {
  margin: 4px 0 0;
  color: #475569;
  font-size: 12px;
}

.tasks-modern-page .task-today-card b {
  align-self: start;
  padding: 3px 7px;
  border-radius: 999px;
  background: #eff6ff;
  color: #2563eb;
  font-size: 10px;
}

.tasks-modern-page .task-category-pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  gap: 6px;
  margin-top: 7px;
  color: #475569;
  font-size: 12px;
  font-weight: 750;
}

.tasks-modern-page .task-category-pill i {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 7px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 9px;
  font-style: normal;
  font-weight: 900;
}

.tasks-modern-page .task-category-pill.usps i,
.tasks-modern-page .task-category-pill.planning i {
  background: #dbeafe;
  color: #2563eb;
}

.tasks-modern-page .task-category-pill.dispatch i {
  background: #dcfce7;
  color: #047857;
}

.tasks-modern-page .task-category-pill.driver i {
  background: #ede9fe;
  color: #6d28d9;
}

.tasks-modern-page .task-category-pill.truck i,
.tasks-modern-page .task-category-pill.maintenance i {
  background: #ffedd5;
  color: #c2410c;
}

.tasks-modern-page .task-category-pill.payroll i,
.tasks-modern-page .task-category-pill.accounting i,
.tasks-modern-page .task-category-pill.completed i {
  background: #dcfce7;
  color: #047857;
}

.tasks-modern-page .task-category-pill.review i,
.tasks-modern-page .task-category-pill.admin i {
  background: #fef3c7;
  color: #b45309;
}

.tasks-modern-page .task-today-card.overdue,
.tasks-modern-page .task-today-card.urgent {
  border-left-color: #f43f5e;
}

.tasks-modern-page .task-today-card.completed {
  border-left-color: #10b981;
}

.tasks-modern-page .task-today-card.pending-review {
  border-left-color: #8b5cf6;
}

.tasks-modern-page .task-today-empty,
.tasks-modern-page .task-view-all {
  border: 1px solid #dbe3ef;
  border-radius: 10px;
  background: #ffffff;
}

.tasks-modern-page .task-today-empty {
  display: grid;
  gap: 9px;
  padding: 22px;
  color: #64748b;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.tasks-modern-page .task-today-empty-label {
  color: #2563eb;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tasks-modern-page .task-today-empty strong {
  color: #0f172a;
  font-size: 15px;
}

.tasks-modern-page .task-today-empty span {
  color: #64748b;
  font-size: 13px;
}

.tasks-modern-page .task-next-reminder {
  display: grid;
  gap: 3px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}

.tasks-modern-page .task-next-reminder span {
  color: #64748b;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.tasks-modern-page .task-next-reminder b {
  color: #0f172a;
  font-size: 13px;
}

.tasks-modern-page .task-next-reminder small {
  color: #2563eb;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.55;
}

.tasks-modern-page .task-view-all {
  min-height: 40px;
  justify-content: flex-start;
  margin-bottom: 16px;
  padding: 0 14px;
  border-color: transparent;
  background: transparent;
  color: #1e3a8a;
  font-weight: 850;
  text-align: left;
  box-shadow: none;
}

.tasks-modern-page .task-view-all::before {
  content: "->";
  margin-right: 8px;
}

.tasks-modern-page .task-view-all:hover {
  background: #f8fbff;
  color: #2563eb;
}

.tasks-modern-page .task-calendar-panel {
  min-width: 0;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03), 0 12px 30px rgba(15, 23, 42, 0.05);
}

.tasks-modern-page .task-calendar-controls {
  display: grid;
  grid-template-columns: 42px auto 42px auto 1fr;
  gap: 10px;
  align-items: center;
  margin: 0;
  padding: 14px 16px;
  border: 0;
  border-bottom: 1px solid #edf2f7;
  border-radius: 14px 14px 0 0;
  background: #ffffff;
  box-shadow: none;
}

.tasks-modern-page .task-calendar-controls strong {
  min-width: 0;
  color: #0f172a;
  font-size: 22px;
  text-align: center;
}

.tasks-modern-page .task-calendar-controls strong::before {
  content: "CAL";
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 22px;
  margin-right: 8px;
  border-radius: 7px;
  background: #dbeafe;
  color: #2563eb;
  font-size: 9px;
  vertical-align: middle;
}

.tasks-modern-page .task-calendar-controls > button {
  min-height: 38px;
  border-radius: 10px;
}

.tasks-modern-page .task-view-switch {
  justify-self: end;
  gap: 0;
  padding: 3px;
  border-color: #dbe3ef;
  border-radius: 10px;
  background: #ffffff;
}

.tasks-modern-page .task-view-switch button {
  min-height: 34px;
  padding: 0 15px;
  border-radius: 8px;
  color: #334155;
  font-weight: 850;
}

.tasks-modern-page .task-view-switch button.active {
  border-color: #2563eb;
  background: #2563eb;
  color: #ffffff;
}

.tasks-modern-page .task-calendar {
  grid-template-columns: repeat(7, minmax(118px, 1fr));
  gap: 0;
  border-top: 0;
  background: #dbe4f0;
}

.tasks-modern-page .task-calendar-weekday {
  padding: 9px 10px;
  border-right: 1px solid #dbe4f0;
  border-bottom: 1px solid #dbe4f0;
  border-radius: 0;
  background: #f8fafc;
  color: #334155;
  text-align: center;
}

.tasks-modern-page .task-calendar-day {
  min-height: 136px;
  padding: 13px;
  border: 0;
  border-right: 1px solid #dbe4f0;
  border-bottom: 1px solid #dbe4f0;
  border-radius: 0;
  background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%);
}

.tasks-modern-page .task-calendar.task-calendar-week .task-calendar-day {
  min-height: 430px;
}

.tasks-modern-page .task-calendar-day.is-weekend {
  background: #f4f7fb;
}

.tasks-modern-page .task-calendar-day.outside-month {
  background: #f3f6fa;
  color: #94a3b8;
  opacity: 1;
}

.tasks-modern-page .task-calendar-day.has-tasks {
  background: #ffffff;
}

.tasks-modern-page .task-calendar-day.is-today {
  background: #eff6ff;
  box-shadow: inset 0 0 0 2px rgba(37, 99, 235, 0.22);
}

.tasks-modern-page .task-calendar-day:hover {
  background: #f8fbff;
}

.tasks-modern-page .task-calendar-date {
  display: inline-grid;
  gap: 2px;
  width: auto;
  min-width: 26px;
  min-height: 24px;
  padding: 2px 7px;
  border-radius: 999px;
  background: transparent;
  color: #0f172a;
}

.tasks-modern-page .task-calendar-day.is-today .task-calendar-date {
  border-radius: 9px;
  background: transparent;
  color: #2563eb;
}

.tasks-modern-page .task-calendar-date > span:last-child {
  line-height: 1.1;
}

.tasks-modern-page .task-calendar-today-label {
  color: #2563eb;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.tasks-modern-page .task-calendar-chips {
  gap: 4px;
  margin-top: 8px;
}

.tasks-modern-page .task-calendar-chip,
.tasks-modern-page .task-calendar-more {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  min-height: 42px;
  padding: 7px 8px;
  border: 1px solid #bfdbfe;
  border-left: 0;
  border-radius: 6px;
  background: #dbeafe;
  color: #1e3a8a;
  font-size: 11px;
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
  white-space: normal;
}

.tasks-modern-page .task-calendar-chip span {
  color: inherit;
  font-size: 10px;
  font-weight: 900;
  text-transform: none;
}

.tasks-modern-page .task-calendar-chip b {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: inherit;
  font-size: 11px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tasks-modern-page .task-calendar-chip.usps {
  border-color: #bfdbfe;
  background: #dbeafe;
  color: #1d4ed8;
}

.tasks-modern-page .task-calendar-chip.dispatch,
.tasks-modern-page .task-calendar-chip.planning {
  border-color: #bbf7d0;
  background: #dcfce7;
  color: #047857;
}

.tasks-modern-page .task-calendar-chip.driver {
  border-color: #ddd6fe;
  background: #ede9fe;
  color: #6d28d9;
}

.tasks-modern-page .task-calendar-chip.truck,
.tasks-modern-page .task-calendar-chip.maintenance {
  border-color: #fed7aa;
  background: #ffedd5;
  color: #c2410c;
}

.tasks-modern-page .task-calendar-chip.payroll,
.tasks-modern-page .task-calendar-chip.accounting {
  border-color: #a7f3d0;
  background: #d1fae5;
  color: #047857;
}

.tasks-modern-page .task-calendar-chip.overdue,
.tasks-modern-page .task-calendar-chip.urgent {
  border-color: #fecdd3;
  background: #ffe4e6;
  color: #be123c;
}

.tasks-modern-page .task-calendar-chip.today,
.tasks-modern-page .task-calendar-chip.tomorrow {
  border-color: #fed7aa;
  background: #ffedd5;
  color: #c2410c;
}

.tasks-modern-page .task-calendar-chip.pending-review {
  border-color: #ddd6fe;
  background: #ede9fe;
  color: #6d28d9;
}

.tasks-modern-page .task-calendar-chip.completed {
  border-color: #bbf7d0;
  background: #dcfce7;
  color: #047857;
}

.tasks-modern-page .task-calendar-more {
  border-color: transparent;
  background: transparent;
  color: #64748b;
}

.tasks-modern-page .task-calendar-note {
  margin: 12px;
  border-color: #dbe3ef;
  border-radius: 10px;
  background: #f8fafc;
}

.tasks-modern-page .task-list {
  padding: 14px;
}

.tasks-modern-page .task-card,
.tasks-modern-page .task-empty {
  min-height: 72px;
  padding: 10px 12px;
  border-color: #dbe3ef;
  border-radius: 12px;
  background: #ffffff;
}

.tasks-modern-page .task-empty {
  display: grid;
  gap: 6px;
  color: #64748b;
}

.tasks-modern-page .task-empty strong {
  color: #0f172a;
}

.tasks-modern-page .task-card h2 {
  font-size: 15px;
}

@media (max-width: 1400px) {
  .tasks-modern-page .task-kpi-grid {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .tasks-modern-page .task-toolbar,
  .tasks-modern-page .task-toolbar-right {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .tasks-modern-page .task-content-grid {
    grid-template-columns: 1fr;
  }

  .tasks-modern-page .task-today-panel {
    min-height: 0;
  }
}

@media (max-width: 780px) {
  .tasks-modern-page .task-kpi-grid {
    grid-template-columns: 1fr;
  }

  .tasks-modern-page .task-toolbar-right {
    grid-template-columns: 1fr;
  }

  .tasks-modern-page .task-calendar-controls {
    grid-template-columns: auto 1fr auto;
  }

  .tasks-modern-page #taskCalendarToday,
  .tasks-modern-page .task-view-switch {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .tasks-modern-page .task-calendar {
    grid-template-columns: repeat(7, minmax(92px, 1fr));
    overflow-x: auto;
  }
}

/* Routing audit */
.routing-audit-page main {
  background: #f5f7fb;
  min-height: 100vh;
  padding: 24px;
}

.routing-audit-page .modern-page-header,
.routing-audit-page .audit-filter-panel,
.routing-audit-page .audit-panel {
  background: #fff;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.routing-audit-page .modern-page-header {
  padding: 18px 20px;
  margin-bottom: 14px;
}

.routing-audit-page .modern-page-header h1 {
  margin: 0;
  color: #0f172a;
  font-size: 28px;
  line-height: 1.1;
}

.routing-audit-page .modern-page-header p {
  margin: 6px 0 0;
  color: #64748b;
}

.audit-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(130px, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.audit-card {
  min-height: 82px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.audit-card span,
.audit-card small {
  display: block;
  color: #64748b;
  font-size: 12px;
}

.audit-card strong {
  display: block;
  margin: 5px 0 2px;
  color: #0f172a;
  font-size: 24px;
  line-height: 1.1;
}

.audit-card-blue { border-left: 4px solid #2563eb; }
.audit-card-green { border-left: 4px solid #059669; }
.audit-card-amber { border-left: 4px solid #f59e0b; }
.audit-card-red { border-left: 4px solid #ef4444; }

.audit-filter-panel {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) repeat(3, minmax(150px, 0.8fr));
  gap: 12px;
  align-items: end;
  padding: 14px;
  margin-bottom: 14px;
}

.audit-filter-panel label {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.audit-filter-panel input,
.audit-filter-panel select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  padding: 0 12px;
  font: inherit;
}

.audit-page-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.36fr) minmax(520px, 1fr);
  gap: 14px;
  align-items: start;
}

.audit-panel {
  padding: 14px;
}

.audit-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.audit-panel-head h2 {
  margin: 0;
  color: #0f172a;
  font-size: 18px;
}

.audit-panel-head p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
}

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

.audit-mismatch-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 12px;
  border: 1px solid #fecaca;
  border-left: 4px solid #ef4444;
  border-radius: 10px;
  background: #fff7f7;
}

.audit-mismatch-row strong,
.audit-mismatch-row span,
.audit-mismatch-row small {
  display: block;
}

.audit-mismatch-row strong {
  color: #991b1b;
}

.audit-mismatch-row span {
  margin-top: 4px;
  color: #0f172a;
}

.audit-mismatch-row small {
  margin-top: 4px;
  color: #64748b;
}

.audit-table-wrap {
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.audit-table {
  width: 100%;
  min-width: 920px;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
}

.audit-table th,
.audit-table td {
  padding: 11px 12px;
  border-bottom: 1px solid #e2e8f0;
  color: #0f172a;
  font-size: 13px;
  text-align: left;
  vertical-align: middle;
}

.audit-table th {
  background: #f8fafc;
  color: #64748b;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.audit-table tr:hover td {
  background: #f8fbff;
}

.audit-table td:nth-child(5) strong,
.audit-table td:nth-child(5) span {
  display: block;
}

.audit-table td:nth-child(5) span {
  margin-top: 4px;
  color: #64748b;
  font-size: 12px;
}

.audit-source-pill,
.audit-event-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.audit-source-pill.planning {
  color: #1d4ed8;
  background: #dbeafe;
}

.audit-source-pill.loadstop {
  color: #047857;
  background: #d1fae5;
}

.audit-event-pill.blue {
  color: #1d4ed8;
  background: #dbeafe;
}

.audit-event-pill.green {
  color: #047857;
  background: #d1fae5;
}

.audit-event-pill.warning {
  color: #92400e;
  background: #fef3c7;
}

.audit-event-pill.danger {
  color: #991b1b;
  background: #fee2e2;
}

@media (max-width: 1180px) {
  .audit-kpi-grid {
    grid-template-columns: repeat(3, minmax(140px, 1fr));
  }

  .audit-page-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .routing-audit-page main {
    padding: 14px;
  }

  .audit-kpi-grid,
  .audit-filter-panel {
    grid-template-columns: 1fr;
  }
}

/* Modern Open Trucks page */
.open-trucks-page main {
  background: #f4f7fb;
}

.open-trucks-page .topbar {
  align-items: flex-start;
  margin-bottom: 18px;
}

.open-trucks-page .topbar h1 {
  color: #0f172a;
  font-size: 28px;
  line-height: 1.12;
}

.open-trucks-page .topbar p {
  margin-top: 4px;
  color: #536681;
}

.open-trucks-page #refreshOpenTrucks {
  min-height: 40px;
  padding: 0 18px;
  border: 1px solid #dbe4f0;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font-weight: 800;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

.open-trucks-page #refreshOpenTrucks:hover {
  border-color: #b9c8dd;
  background: #f8fbff;
}

.open-truck-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.open-truck-kpi-card {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  align-items: center;
  min-height: 82px;
  padding: 16px;
  border: 1px solid #dfe7f2;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.open-truck-kpi-icon {
  position: relative;
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #eaf2ff;
}

.open-truck-kpi-icon::before {
  content: "";
  width: 17px;
  height: 17px;
  border: 2px solid #2563eb;
  border-radius: 5px;
}

.open-truck-kpi-card.is-purple .open-truck-kpi-icon {
  background: #f1eaff;
}

.open-truck-kpi-card.is-purple .open-truck-kpi-icon::before {
  border-color: #7c3aed;
}

.open-truck-kpi-card.is-pink .open-truck-kpi-icon {
  background: #ffeaf1;
}

.open-truck-kpi-card.is-pink .open-truck-kpi-icon::before {
  border-color: #db2777;
  border-radius: 50%;
}

.open-truck-kpi-card.is-cyan .open-truck-kpi-icon {
  background: #e7f8ff;
}

.open-truck-kpi-card.is-cyan .open-truck-kpi-icon::before {
  border-color: #0284c7;
  border-radius: 50%;
}

.open-truck-kpi-card.is-amber .open-truck-kpi-icon {
  background: #fff3d6;
}

.open-truck-kpi-card.is-amber .open-truck-kpi-icon::before {
  border-color: #d97706;
}

.open-truck-kpi-card strong,
.open-truck-kpi-card span,
.open-truck-kpi-card small {
  display: block;
}

.open-truck-kpi-card strong {
  color: #0f172a;
  font-size: 22px;
  line-height: 1;
}

.open-truck-kpi-card span {
  margin-top: 5px;
  color: #1e293b;
  font-size: 13px;
  font-weight: 850;
}

.open-truck-kpi-card small {
  margin-top: 3px;
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}

.open-trucks-page .open-truck-filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  gap: 16px;
  align-items: end;
  padding: 14px;
  margin-bottom: 12px;
  border: 1px solid #dfe7f2;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.open-trucks-page .open-truck-filter-left {
  gap: 12px;
}

.open-trucks-page .open-truck-filters label {
  gap: 7px;
  color: #42526e;
  font-size: 12px;
  font-weight: 800;
}

.open-trucks-page .open-truck-filter-left > label {
  min-width: 160px;
}

.open-trucks-page .open-truck-filter-left > label > input,
.open-trucks-page .open-truck-filter-left > label > select,
.open-trucks-page .open-truck-search-field input,
.open-trucks-page .open-truck-state-filter summary {
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid #d6e0ed;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font-size: 14px;
  font-weight: 750;
  box-shadow: none;
}

.open-trucks-page .open-truck-search-field {
  min-width: 180px;
}

.open-trucks-page .open-truck-state-filter .multi-filter-menu {
  border: 1px solid #d6e0ed;
  border-radius: 12px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}

.open-trucks-page #openTruckSummary {
  min-height: 0;
  margin: 0 0 10px;
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: #475569;
  font-size: 13px;
  font-weight: 750;
  box-shadow: none;
}

.open-trucks-page .open-truck-list {
  gap: 12px;
}

.open-trucks-page .open-truck-market-group {
  overflow: hidden;
  gap: 0;
  margin: 0 0 14px;
  border: 1px solid #dfe7f2;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.open-trucks-page .open-truck-market-header {
  padding: 10px 14px;
  border: 0;
  border-bottom: 1px solid #d7e6da;
  border-radius: 0;
  background: #ecf4ee;
  color: #102a1f;
  font-size: 14px;
}

.open-trucks-page .open-truck-market-header span:last-child {
  color: #52645c;
  font-size: 12px;
}

.open-trucks-page .open-truck-card {
  position: relative;
  display: block;
  padding: 0;
  border: 0;
  border-left: 0;
  border-radius: 0;
  background: #ffffff;
  transition: background 0.12s ease, box-shadow 0.12s ease;
}

.open-trucks-page .open-truck-card + .open-truck-card {
  border-top: 1px solid #e7edf5;
}

.open-trucks-page .open-truck-card::before {
  content: "";
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 0;
  width: 4px;
  border-radius: 0 6px 6px 0;
  background: var(--truck-owner-color, #10b981);
}

.open-trucks-page .open-truck-card.is-connection::before,
.open-trucks-page .open-truck-card.is-on-hold::before {
  background: #dc2626;
}

.open-trucks-page .open-truck-card:hover {
  background: #fbfdff;
  box-shadow: inset 0 0 0 999px rgba(37, 99, 235, 0.015);
}

.open-trucks-page .open-truck-main {
  display: grid;
  grid-template-columns: 126px minmax(180px, 0.95fr) minmax(230px, 1.2fr) minmax(220px, 1.1fr) minmax(190px, 0.95fr);
  gap: 0;
  align-items: stretch;
  min-height: 94px;
  padding: 10px 12px 10px 16px;
}

.open-trucks-page .open-truck-main section,
.open-trucks-page .open-truck-main button {
  min-width: 0;
  min-height: 0;
  padding: 8px 12px;
  border: 0;
  border-left: 1px solid #edf2f7;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.open-trucks-page .open-truck-main > :first-child {
  border-left: 0;
}

.open-trucks-page .open-truck-number,
.open-trucks-page .open-truck-location,
.open-trucks-page .open-truck-last-load,
.open-trucks-page .open-truck-next-load,
.open-trucks-page .open-truck-note-card {
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
}

.open-trucks-page .open-truck-number {
  gap: 7px;
  flex: initial;
}

.open-trucks-page .open-truck-main .open-truck-number-link {
  width: auto;
  padding: 0;
  border: 0;
}

.open-trucks-page .open-truck-number strong {
  color: #0f172a;
  font-size: 21px;
  line-height: 1;
  letter-spacing: 0;
}

.open-trucks-page .open-truck-card.is-on-hold .open-truck-number {
  background: transparent;
}

.open-trucks-page .open-truck-card.is-on-hold .open-truck-number strong {
  color: #991b1b;
}

.open-trucks-page .open-truck-card.is-dfw-ready-team::before {
  background: #d97706;
}

.open-trucks-page .open-truck-ready-team-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 7px;
  border-radius: 999px;
  background: #fff1c2;
  color: #9a3412;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.03em;
}

.open-trucks-page .open-truck-ready-team-status b {
  color: #c22718;
}

.open-trucks-page .open-truck-location,
.open-trucks-page .open-truck-last-load,
.open-trucks-page .open-truck-next-load {
  flex: initial;
  max-width: none;
}

.open-trucks-page .open-truck-next-load {
  border-left: 1px solid #f6d89f !important;
  background: #fff8e7 !important;
}

.open-trucks-page .open-truck-main small {
  color: #64748b;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.2;
  text-transform: none;
}

.open-trucks-page .open-truck-main b,
.open-trucks-page .open-truck-main span {
  max-width: 100%;
  white-space: normal;
}

.open-trucks-page .open-truck-main b {
  color: #0f172a;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
}

.open-trucks-page .open-truck-main span {
  color: #475569;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
}

.open-trucks-page .open-truck-wait {
  font-weight: 900;
}

.open-trucks-page .open-truck-wait.is-ok {
  color: #047857 !important;
}

.open-trucks-page .open-truck-wait.is-warning {
  color: #b45309 !important;
}

.open-trucks-page .open-truck-wait.is-critical {
  color: #b42318 !important;
}

.open-trucks-page .open-truck-main .open-truck-hold-button {
  min-height: 26px;
  padding: 4px 10px;
  border: 1px solid #d7e1ed;
  border-radius: 999px;
  background: #ffffff;
  color: #334155;
  font-size: 11px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.open-trucks-page .open-truck-main .open-truck-hold-button.is-active {
  border-color: #dc2626;
  background: #dc2626;
  color: #ffffff;
}

.open-trucks-page .open-truck-note-card {
  flex: initial;
  min-width: 0;
  border-left: 1px solid #edf2f7 !important;
  background: color-mix(in srgb, var(--open-note-color, #d8ecff) 42%, #ffffff) !important;
}

.open-trucks-page .open-truck-note-card.is-empty {
  background: transparent !important;
}

.open-trucks-page .open-truck-load-link:hover,
.open-trucks-page .open-truck-note-card:hover,
.open-trucks-page .open-truck-number-link:hover {
  background: #f8fbff;
}

.open-trucks-page .open-truck-empty {
  border: 1px solid #dfe7f2;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

@media (max-width: 1350px) {
  .open-truck-kpis {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .open-trucks-page .open-truck-main {
    grid-template-columns: 110px minmax(170px, 1fr) minmax(220px, 1fr) minmax(210px, 1fr);
  }

  .open-trucks-page .open-truck-note-card {
    grid-column: 2 / -1;
    border-top: 1px solid #edf2f7 !important;
  }
}

@media (max-width: 900px) {
  .open-truck-kpis,
  .open-trucks-page .open-truck-filters {
    grid-template-columns: 1fr;
  }

  .open-trucks-page .open-truck-main {
    grid-template-columns: 1fr;
    padding: 8px 12px 8px 16px;
  }

  .open-trucks-page .open-truck-main section,
  .open-trucks-page .open-truck-main button {
    border-left: 0;
    border-top: 1px solid #edf2f7;
  }

  .open-trucks-page .open-truck-main > :first-child {
    border-top: 0;
  }
}

/* Open Trucks polish v84 */
.open-trucks-page .open-truck-filters {
  grid-template-columns: 1fr;
}

.open-trucks-page .open-truck-filter-left {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(380px, 430px) minmax(150px, 170px) minmax(150px, 170px);
  align-items: end;
}

.open-trucks-page .open-truck-date-range-field {
  min-width: 290px;
}

.open-trucks-page .open-truck-date-nav {
  display: grid;
  grid-template-columns: 38px minmax(290px, 1fr) 38px;
  align-items: end;
  gap: 8px;
}

.open-trucks-page .open-truck-date-nav > button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 42px;
  padding: 0;
  border: 1px solid #cdd9e8;
  border-radius: 9px;
  background: #ffffff;
  color: #174879;
  cursor: pointer;
}

.open-trucks-page .open-truck-date-nav > button svg {
  display: block;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.open-trucks-page .open-truck-date-nav > button:hover,
.open-trucks-page .open-truck-date-nav > button:focus-visible {
  border-color: #2563eb;
  background: #eff6ff;
  outline: none;
}

.open-trucks-page .open-truck-date-range-field .jitc-calendar-trigger {
  white-space: nowrap;
}

.open-trucks-page .open-truck-search-field {
  min-width: 0;
}

.open-truck-kpi-card {
  position: relative;
  grid-template-columns: 58px 1fr;
  min-height: 92px;
  overflow: hidden;
}

.open-truck-kpi-card::before {
  content: "";
  position: absolute;
  inset: 16px auto 16px 0;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: #2563eb;
}

.open-truck-kpi-card.is-purple::before {
  background: #7c3aed;
}

.open-truck-kpi-card.is-pink::before {
  background: #db2777;
}

.open-truck-kpi-card.is-cyan::before {
  background: #0284c7;
}

.open-truck-kpi-card.is-amber::before {
  background: #d97706;
}

.open-truck-kpi-icon {
  width: 50px;
  height: 50px;
  border-radius: 18px;
  background: linear-gradient(135deg, #eaf2ff, #dbeafe);
}

.open-truck-kpi-card.is-purple .open-truck-kpi-icon {
  background: linear-gradient(135deg, #f5efff, #ede3ff);
}

.open-truck-kpi-card.is-pink .open-truck-kpi-icon {
  background: linear-gradient(135deg, #ffeaf1, #ffd7e4);
}

.open-truck-kpi-card.is-cyan .open-truck-kpi-icon {
  background: linear-gradient(135deg, #e7f8ff, #d6f1ff);
}

.open-truck-kpi-card.is-amber .open-truck-kpi-icon {
  background: linear-gradient(135deg, #fff3d6, #ffe4ad);
}

.open-truck-kpi-icon::before {
  width: 25px;
  height: 25px;
  border: 0;
  border-radius: 0;
  background: #2563eb;
  mask: var(--kpi-icon) center / contain no-repeat;
  -webkit-mask: var(--kpi-icon) center / contain no-repeat;
}

.open-truck-kpi-card.is-purple .open-truck-kpi-icon::before {
  background: #7c3aed;
}

.open-truck-kpi-card.is-pink .open-truck-kpi-icon::before {
  background: #db2777;
}

.open-truck-kpi-card.is-cyan .open-truck-kpi-icon::before {
  background: #0284c7;
}

.open-truck-kpi-card.is-amber .open-truck-kpi-icon::before {
  background: #d97706;
}

.open-truck-kpi-icon.icon-truck {
  --kpi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17h4V5H2v12h3'/%3E%3Cpath d='M14 17h1m4 0h3v-6l-3-4h-5'/%3E%3Ccircle cx='7.5' cy='17.5' r='2.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='2.5'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-calendar {
  --kpi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='M8 14h.01M12 14h.01M16 14h.01M8 18h.01M12 18h.01'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-pin {
  --kpi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-clock {
  --kpi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 9v6M14 9v6'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-flag {
  --kpi-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 22V4'/%3E%3Cpath d='M5 4h13l-2 5 2 5H5'/%3E%3C/svg%3E");
}

.open-trucks-page .open-truck-market-header {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  min-height: 44px;
  padding: 8px 16px;
}

.open-trucks-page .open-truck-market-header span:first-child {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.02em;
}

.open-trucks-page .open-truck-market-header span:last-child {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.open-trucks-page .open-truck-card {
  transition: background 0.12s ease, box-shadow 0.12s ease;
}

.open-trucks-page .open-truck-card:hover {
  background: #f8fbff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06), inset 0 0 0 999px rgba(37, 99, 235, 0.018);
}

.open-trucks-page .open-truck-main {
  grid-template-columns: 132px minmax(190px, 0.95fr) minmax(230px, 1.12fr) minmax(220px, 1.05fr) minmax(190px, 0.9fr);
  min-height: 102px;
  align-items: stretch;
}

.open-trucks-page .open-truck-number,
.open-trucks-page .open-truck-location,
.open-trucks-page .open-truck-last-load,
.open-trucks-page .open-truck-next-load,
.open-trucks-page .open-truck-note-card {
  align-content: center;
  justify-content: center;
  justify-items: center;
}

.open-trucks-page .open-truck-number {
  gap: 8px;
  border-radius: 10px;
}

.open-truck-mini-icon {
  width: 24px;
  height: 24px;
  border-radius: 9px;
  background: #eff6ff;
  position: relative;
}

.open-truck-mini-icon::before {
  content: "";
  position: absolute;
  inset: 5px;
  background: #2563eb;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17h4V5H2v12h3'/%3E%3Cpath d='M14 17h1m4 0h3v-6l-3-4h-5'/%3E%3Ccircle cx='7.5' cy='17.5' r='2.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17h4V5H2v12h3'/%3E%3Cpath d='M14 17h1m4 0h3v-6l-3-4h-5'/%3E%3Ccircle cx='7.5' cy='17.5' r='2.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.open-trucks-page .open-truck-number strong {
  font-size: 28px;
}

.open-trucks-page .open-truck-time-stack {
  display: grid;
  gap: 3px;
  margin-top: 2px;
}

.open-trucks-page .open-truck-time-stack span {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: baseline;
  gap: 6px;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  text-align: left;
}

.open-trucks-page .open-truck-time-stack small {
  color: #64748b;
  font-size: 10px;
  letter-spacing: 0.05em;
}

.open-trucks-page .open-truck-wait-card {
  display: grid;
  gap: 3px;
  margin-top: 3px;
  justify-items: center;
}

.open-trucks-page .open-truck-wait-card small {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #64748b;
  font-size: 10px;
  letter-spacing: 0.05em;
}

.open-trucks-page .open-truck-wait-card b {
  font-size: 15px;
}

.open-truck-dot,
.open-truck-note-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
}

.open-truck-wait-card.is-warning .open-truck-dot {
  background: #f59e0b;
}

.open-truck-wait-card.is-critical .open-truck-dot {
  background: #ef4444;
}

.open-trucks-page .open-truck-hold-line {
  display: grid;
  gap: 3px;
  margin-top: 4px;
  color: #991b1b;
  text-align: center;
}

.open-trucks-page .open-truck-hold-line small {
  color: #991b1b;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.open-trucks-page .open-truck-hold-line span {
  color: #991b1b;
  font-size: 12px;
  font-weight: 850;
}

.open-trucks-page .open-truck-hold-line.is-stale span {
  font-size: 13px;
  font-weight: 950;
}

.open-truck-note-dot {
  background: #7c3aed;
}

.open-trucks-page .open-truck-note-card small {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.open-trucks-page .open-truck-note-card.is-empty {
  color: #2563eb;
}

.open-trucks-page .open-truck-note-card.is-empty b {
  color: #2563eb;
  font-size: 13px;
}

@media (max-width: 1350px) {
  .open-trucks-page .open-truck-filter-left {
    grid-template-columns: repeat(2, minmax(170px, 1fr));
  }
}

@media (max-width: 900px) {
  .open-trucks-page .open-truck-filter-left {
    grid-template-columns: 1fr;
  }
}

/* Open Trucks visual calm-down v85 */
.open-trucks-page {
  font-weight: 500;
}

.open-trucks-page .topbar h1,
.open-trucks-page h1 {
  font-weight: 800;
}

.open-truck-kpis {
  gap: 14px;
}

.open-truck-kpi-card {
  grid-template-columns: 44px 1fr;
  min-height: 74px;
  padding: 14px 18px 14px 20px;
}

.open-truck-kpi-card::before {
  inset: 14px auto 14px 0;
  width: 3px;
}

.open-truck-kpi-icon {
  width: 36px;
  height: 36px;
  border-radius: 14px;
}

.open-truck-kpi-icon::before {
  width: 19px;
  height: 19px;
}

.open-truck-kpi-card strong {
  font-size: 21px;
  font-weight: 750;
}

.open-truck-kpi-card span {
  font-size: 13px;
  font-weight: 650;
}

.open-truck-kpi-card small {
  font-size: 11px;
  font-weight: 500;
}

.open-trucks-page .open-truck-market {
  margin-bottom: 16px;
}

.open-trucks-page .open-truck-market-header {
  min-height: 36px;
  padding: 7px 14px;
}

.open-trucks-page .open-truck-market-header span:first-child {
  font-size: 13px;
  font-weight: 750;
  letter-spacing: 0.01em;
}

.open-trucks-page .open-truck-market-header span:last-child {
  font-size: 11px;
  font-weight: 650;
}

.open-trucks-page .open-truck-card {
  background: #fff;
  transition: background 0.12s ease, box-shadow 0.12s ease;
}

.open-trucks-page .open-truck-card:hover {
  background: #fbfdff;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.045);
}

.open-trucks-page .open-truck-main {
  grid-template-columns: 120px minmax(175px, 0.95fr) minmax(220px, 1.1fr) minmax(210px, 1.05fr) minmax(175px, 0.9fr);
  min-height: 82px;
}

.open-trucks-page .open-truck-number,
.open-trucks-page .open-truck-location,
.open-trucks-page .open-truck-last-load,
.open-trucks-page .open-truck-next-load,
.open-trucks-page .open-truck-note-card {
  padding: 9px 12px;
}

.open-trucks-page .open-truck-number {
  gap: 5px;
}

.open-truck-mini-icon {
  width: 18px;
  height: 18px;
  border-radius: 7px;
}

.open-truck-mini-icon::before {
  inset: 4px;
}

.open-trucks-page .open-truck-number strong {
  font-size: 22px;
  line-height: 1;
  font-weight: 750;
  letter-spacing: 0;
}

.open-trucks-page .open-truck-number .button-small {
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 650;
}

.open-trucks-page .open-truck-location small,
.open-trucks-page .open-truck-last-load small,
.open-trucks-page .open-truck-next-load small,
.open-trucks-page .open-truck-note-card small {
  font-size: 10px;
  font-weight: 650;
  color: #64748b;
}

.open-trucks-page .open-truck-location strong,
.open-trucks-page .open-truck-last-load strong,
.open-trucks-page .open-truck-next-load strong,
.open-trucks-page .open-truck-note-card strong {
  font-size: 12.5px;
  line-height: 1.25;
  font-weight: 700;
}

.open-trucks-page .open-truck-location span,
.open-trucks-page .open-truck-last-load span,
.open-trucks-page .open-truck-next-load span,
.open-trucks-page .open-truck-note-card span {
  font-size: 11.5px;
  line-height: 1.25;
  font-weight: 500;
}

.open-trucks-page .open-truck-time-stack {
  gap: 1px;
  margin-top: 1px;
}

.open-trucks-page .open-truck-time-stack span {
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 5px;
  font-size: 11.5px;
  font-weight: 650;
}

.open-trucks-page .open-truck-time-stack small {
  font-size: 9.5px;
  letter-spacing: 0.04em;
}

.open-trucks-page .open-truck-wait-card {
  gap: 1px;
  margin-top: 2px;
}

.open-trucks-page .open-truck-wait-card small {
  gap: 4px;
  font-size: 9.5px;
  letter-spacing: 0.04em;
}

.open-trucks-page .open-truck-wait-card b {
  font-size: 13px;
  font-weight: 750;
}

.open-truck-dot,
.open-truck-note-dot {
  width: 6px;
  height: 6px;
}

.open-trucks-page .open-truck-hold-line {
  gap: 1px;
  margin-top: 2px;
}

.open-trucks-page .open-truck-hold-line span {
  font-size: 11px;
  font-weight: 650;
}

.open-trucks-page .open-truck-hold-line.is-stale span {
  font-size: 11.5px;
  font-weight: 750;
}

.open-trucks-page .open-truck-note-card {
  min-height: 0;
  background: #f8fafc;
}

.open-trucks-page .open-truck-note-card:not(.is-empty) {
  background: #f6f9ff;
}

.open-trucks-page .open-truck-note-card.is-empty {
  background: transparent;
}

.open-trucks-page .open-truck-note-card.is-empty b {
  font-size: 12px;
  font-weight: 650;
}

.open-trucks-page .open-truck-card b,
.open-trucks-page .open-truck-card strong {
  letter-spacing: 0;
}

.open-trucks-page .open-truck-card .is-danger,
.open-trucks-page .open-truck-card .is-warning {
  font-weight: 700;
}

/* Open Trucks filled KPI icons v86 */
.open-truck-kpi-icon {
  position: relative;
  display: inline-grid;
  place-items: center;
  overflow: visible;
}

.open-truck-kpi-icon::before {
  content: "";
  position: absolute;
  inset: 5px;
  width: auto;
  height: auto;
  border-radius: 50%;
  background: #2563eb;
  mask: none;
  -webkit-mask: none;
}

.open-truck-kpi-icon::after {
  content: "";
  position: relative;
  width: 18px;
  height: 18px;
  background: #fff;
  mask: var(--kpi-icon) center / contain no-repeat;
  -webkit-mask: var(--kpi-icon) center / contain no-repeat;
}

.open-truck-kpi-card.is-purple .open-truck-kpi-icon::before {
  background: #7c3aed;
}

.open-truck-kpi-card.is-pink .open-truck-kpi-icon::before {
  background: #db2777;
}

.open-truck-kpi-card.is-cyan .open-truck-kpi-icon::before {
  background: #0284c7;
}

.open-truck-kpi-card.is-amber .open-truck-kpi-icon::before {
  background: #f59e0b;
}

.open-truck-kpi-card.is-purple .open-truck-kpi-icon::after,
.open-truck-kpi-card.is-pink .open-truck-kpi-icon::after,
.open-truck-kpi-card.is-cyan .open-truck-kpi-icon::after,
.open-truck-kpi-card.is-amber .open-truck-kpi-icon::after {
  background: #fff;
}

.open-truck-kpi-icon.icon-truck::after,
.open-truck-kpi-icon.icon-calendar::after,
.open-truck-kpi-icon.icon-pin::after,
.open-truck-kpi-icon.icon-clock::after,
.open-truck-kpi-icon.icon-flag::after {
  background-color: transparent;
  mask: none;
  -webkit-mask: none;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.open-truck-kpi-icon.icon-truck::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17h4V5H2v12h3'/%3E%3Cpath d='M14 17h1m4 0h3v-6l-3-4h-5'/%3E%3Ccircle cx='7.5' cy='17.5' r='2.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='2.5'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-calendar::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2.5'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='M8 14h.01M12 14h.01M16 14h.01M8 18h.01M12 18h.01'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-pin::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-clock::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 9v6M14 9v6'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-flag::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='white' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 22V4' fill='none'/%3E%3Cpath d='M5 4h13l-2 5 2 5H5Z'/%3E%3C/svg%3E");
}

/* Open Trucks density and line-icon polish v87 */
.open-trucks-page .topbar {
  margin-bottom: 12px;
}

.open-truck-kpi-card {
  grid-template-columns: 42px 1fr;
  min-height: 68px;
  padding: 12px 16px 12px 20px;
}

.open-truck-kpi-card::before {
  inset: 12px auto 12px 0;
}

.open-truck-kpi-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
}

.open-truck-kpi-icon::before {
  inset: 0;
  border-radius: 50%;
  opacity: 0.16;
}

.open-truck-kpi-icon::after {
  width: 21px;
  height: 21px;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  mask: none;
  -webkit-mask: none;
}

.open-truck-kpi-icon.icon-truck::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17h4V5H2v12h3'/%3E%3Cpath d='M14 17h1m4 0h3v-6l-3-4h-5'/%3E%3Ccircle cx='7.5' cy='17.5' r='2.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='2.5'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-calendar::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2.5'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='m8 15 2 2 4-5'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-pin::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23db2777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-clock::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 9v6M14 9v6'/%3E%3C/svg%3E");
}

.open-truck-kpi-icon.icon-flag::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 22V4'/%3E%3Cpath d='M5 4h13l-2 5 2 5H5'/%3E%3C/svg%3E");
}

.open-truck-kpi-card strong {
  font-size: 20px;
  line-height: 1;
}

.open-truck-kpi-card span {
  font-size: 12.5px;
}

.open-truck-kpi-card small {
  font-size: 10.5px;
}

.open-trucks-page .open-truck-filters {
  margin-bottom: 10px;
  padding: 14px 16px;
}

.open-trucks-page .open-truck-filter-left {
  gap: 12px;
}

.open-trucks-page .open-truck-list {
  gap: 12px;
}

.open-trucks-page .open-truck-market {
  margin-bottom: 12px;
}

.open-trucks-page .open-truck-market-header {
  min-height: 34px;
  padding: 6px 13px;
}

.open-trucks-page .open-truck-card:hover {
  background: #f8fbff;
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.055);
}

.open-trucks-page .open-truck-main {
  min-height: 68px;
  grid-template-columns: 112px minmax(165px, 0.9fr) minmax(210px, 1.08fr) minmax(205px, 1.02fr) minmax(165px, 0.86fr);
}

.open-trucks-page .open-truck-number,
.open-trucks-page .open-truck-location,
.open-trucks-page .open-truck-last-load,
.open-trucks-page .open-truck-next-load,
.open-trucks-page .open-truck-note-card {
  padding: 7px 11px;
}

.open-trucks-page .open-truck-number {
  gap: 4px;
}

.open-trucks-page .open-truck-number strong {
  font-size: 22px;
}

.open-trucks-page .open-truck-location strong,
.open-trucks-page .open-truck-last-load strong,
.open-trucks-page .open-truck-next-load strong,
.open-trucks-page .open-truck-note-card strong {
  font-size: 12.5px;
  line-height: 1.15;
}

.open-trucks-page .open-truck-location span,
.open-trucks-page .open-truck-last-load span,
.open-trucks-page .open-truck-next-load span,
.open-trucks-page .open-truck-note-card span {
  font-size: 11.5px;
  line-height: 1.15;
}

.open-trucks-page .open-truck-location small,
.open-trucks-page .open-truck-last-load small,
.open-trucks-page .open-truck-next-load small,
.open-trucks-page .open-truck-note-card small {
  font-size: 9.5px;
  line-height: 1.1;
}

.open-trucks-page .open-truck-time-stack {
  gap: 0;
  margin-top: 0;
}

.open-trucks-page .open-truck-time-stack span {
  font-size: 11px;
  line-height: 1.15;
}

.open-trucks-page .open-truck-wait-card {
  gap: 0;
  margin-top: 0;
}

.open-trucks-page .open-truck-wait-card b {
  font-size: 12px;
  line-height: 1.1;
}

.open-trucks-page .open-truck-note-card {
  min-height: 48px;
}

.open-trucks-page .open-truck-note-card:not(.is-empty) {
  background: #f7fbff;
}

.open-trucks-page .open-truck-note-card.is-empty {
  min-height: 40px;
}

.open-trucks-page .open-truck-note-card.is-empty b {
  font-size: 11.5px;
}

.ca-departures-page {
  --ca-bg: #f5f7fb;
  --ca-surface: #ffffff;
  --ca-line: #dde6f2;
  --ca-ink: #0f2238;
  --ca-muted: #64748b;
  --ca-blue: #2563eb;
  --ca-blue-soft: #eef5ff;
  --ca-green: #16a34a;
  --ca-green-soft: #eaf8ee;
  background: var(--ca-bg);
  color: var(--ca-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.ca-departures-page main {
  padding: 22px 26px;
}

.ca-departures-page .ca-departures-header {
  margin-bottom: 18px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.ca-departures-page .ca-departures-header h1 {
  margin: 0 0 4px;
  color: var(--ca-ink);
  font-size: 29px;
  font-weight: 850;
  letter-spacing: 0;
}

.ca-departures-page .ca-departures-header p {
  color: var(--ca-muted);
  font-size: 15px;
}

.ca-departures-page .routing-controls {
  display: flex;
  align-items: center;
  gap: 34px;
  min-height: 88px;
  margin-bottom: 14px;
  padding: 18px 20px;
  border-color: var(--ca-line);
  border-radius: 14px;
  background: var(--ca-surface);
  box-shadow: 0 12px 32px rgba(15, 34, 56, 0.07);
}

.ca-departures-page .routing-date-field {
  display: grid;
  gap: 6px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.ca-departures-page .routing-date-field input {
  width: 154px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--ca-line);
  border-radius: 10px;
  background: #ffffff;
  color: var(--ca-ink);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(15, 34, 56, 0.03);
}

.ca-departures-page .routing-window {
  min-height: 42px;
  max-width: 620px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  border: 1px solid #ccebd7;
  border-radius: 10px;
  background: var(--ca-green-soft);
  color: #14532d;
  font-size: 14px;
  font-weight: 850;
  box-shadow: none;
}

.ca-departures-page .routing-window .jitc-icon {
  width: 21px;
  height: 21px;
  color: #168449;
  stroke-width: 2.2;
}

.ca-departures-page .routing-layout {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);
  gap: 12px;
}

.ca-departures-page .routing-loads-panel,
.ca-departures-page .routing-resource-panel {
  border-color: var(--ca-line);
  border-radius: 14px;
  background: var(--ca-surface);
  box-shadow: 0 12px 32px rgba(15, 34, 56, 0.07);
}

.ca-departures-page .routing-loads-panel {
  padding: 16px 14px;
  min-width: 0;
}

.ca-departures-page .routing-resource-panel {
  top: 14px;
  gap: 10px;
  padding: 14px;
  min-width: 0;
  max-height: calc(100vh - 28px);
}

.ca-departures-page .routing-panel-head {
  margin: 0 2px 12px;
  align-items: start;
}

.ca-departures-page .routing-panel-head h2 {
  color: var(--ca-ink);
  font-size: 19px;
  font-weight: 850;
}

.ca-departures-page .routing-panel-head span {
  padding-top: 4px;
  color: #40546c;
  font-size: 14px;
  font-weight: 850;
}

.ca-departures-page .routing-group {
  gap: 8px;
  margin-bottom: 10px;
}

.ca-departures-page .routing-group > h3 {
  padding: 0 2px;
  border: 0;
  background: transparent;
  color: var(--ca-blue);
  font-size: 13px;
  font-weight: 850;
}

.ca-departures-page .routing-load-list {
  gap: 8px;
}

.ca-departures-page .routing-load-card {
  grid-template-columns: 44px minmax(0, 1fr) minmax(132px, 150px);
  gap: 8px 12px;
  min-height: 68px;
  padding: 11px 10px;
  min-width: 0;
  border: 1px solid var(--ca-line);
  border-left: 0;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 5px 18px rgba(15, 34, 56, 0.05);
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.ca-departures-page .routing-load-card:hover {
  border-color: #c7d6ea;
  box-shadow: 0 9px 24px rgba(15, 34, 56, 0.08);
  transform: translateY(-1px);
}

.ca-departures-page .routing-load-card.ready-confirm,
.ca-departures-page .routing-load-card.split-yard-leg {
  border-color: var(--ca-line);
  background: #ffffff;
}

.ca-departures-page .routing-load-icon {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  grid-column: 1;
  grid-row: 1 / span 3;
  border-radius: 50%;
  background: var(--ca-blue-soft);
  color: var(--ca-blue);
}

.ca-departures-page .routing-load-icon .jitc-icon {
  width: 23px;
  height: 23px;
  stroke-width: 2.15;
}

.ca-departures-page .routing-load-main {
  grid-column: 2;
  grid-row: 1;
  display: block;
  min-width: 0;
}

.ca-departures-page .routing-load-main strong {
  display: inline-flex;
  min-width: 68px;
  color: var(--ca-blue);
  font-size: 15px;
  font-weight: 900;
}

.ca-departures-page .routing-load-card h3 {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ca-ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.25;
}

.ca-departures-page .routing-load-meta {
  grid-column: 2;
  grid-row: 2;
  gap: 4px 7px;
  color: var(--ca-muted);
  font-size: 11.5px;
  font-weight: 650;
}

.ca-departures-page .routing-load-meta span:not(:last-child)::after {
  content: "|";
  margin-left: 7px;
  color: #9aacbd;
}

.ca-departures-page .routing-load-customer {
  grid-column: 3;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: end;
  max-width: 150px;
  overflow-wrap: anywhere;
  text-align: right;
  color: #334767;
  font-size: 11.5px;
  font-weight: 850;
  text-transform: uppercase;
}

.ca-departures-page .routing-slots {
  grid-column: 2;
  grid-row: 3;
  grid-template-columns: repeat(4, minmax(86px, 1fr));
  gap: 7px;
  min-width: 0;
}

.ca-departures-page .routing-slot {
  min-height: 38px;
  padding: 7px 8px;
  border: 1px solid var(--ca-line);
  border-radius: 9px;
  background: #ffffff;
  color: #40546c;
  font-size: 12px;
  font-weight: 750;
}

.ca-departures-page .routing-slot.filled {
  border-color: #b7d9c6;
  background: #f0fbf4;
  color: #173b2f;
}

.ca-departures-page .routing-slot.drag-over {
  outline: 2px solid rgba(37, 99, 235, 0.32);
  border-color: var(--ca-blue);
  background: #eef5ff;
}

.dfw-departures-page .topbar {
  align-items: center;
}

.dfw-ready-message {
  margin: 10px 16px 0;
  border: 1px solid #9bc7aa;
  border-radius: 7px;
  background: #eaf8ef;
  color: #174c2b;
  padding: 9px 12px;
  font-weight: 700;
}

.dfw-ready-message.error {
  border-color: #e3a1a1;
  background: #fff0f0;
  color: #8d1f1f;
}

.dfw-ready-team-list {
  display: grid;
  gap: 10px;
}

.dfw-ready-team-card {
  display: grid;
  gap: 10px;
  border: 1px solid #d8b575;
  border-left: 5px solid #b56a12;
  border-radius: 9px;
  background: #fff8e8;
  padding: 12px;
}

.dfw-ready-team-card.status-draft {
  border-color: #a9b7c4;
  border-left-color: #657786;
  background: #f5f7f9;
}

.dfw-ready-team-card.status-assigned {
  border-color: #9d87c8;
  border-left-color: #6846a2;
  background: #f4efff;
}

.dfw-ready-team-card.status-assigned.dispatch-confirmed {
  border-color: #82c99a;
  border-left-color: #218246;
  background: #edf9f1;
}

.dfw-ready-team-card > header,
.dfw-ready-team-card > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dfw-ready-team-card h3,
.dfw-ready-team-card p {
  margin: 2px 0 0;
}

.dfw-ready-status {
  display: inline-flex;
  border-radius: 999px;
  background: #9a4f08;
  color: #fff;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.status-draft .dfw-ready-status {
  background: #657786;
}

.status-assigned .dfw-ready-status {
  background: #6846a2;
}

.status-assigned.dispatch-confirmed .dfw-ready-status {
  background: #218246;
}

.dfw-ready-slots {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 7px;
}

.dfw-ready-slots .routing-slot {
  min-height: 56px;
}

.dfw-ready-slots .routing-slot > span {
  display: grid;
  gap: 2px;
}

.dfw-ready-slots .routing-slot small {
  color: #607080;
  font-size: 10px;
  text-transform: uppercase;
}

.dfw-ready-slots .routing-slot.pending-checkin,
.ca-departures-page .routing-slot.pending-checkin {
  border-color: #8bb7e8;
  background: #eef6ff;
}

.ready-driver-pending {
  display: block;
  margin-top: 3px;
  color: #175a9c;
  font-size: 10px;
  font-style: normal;
  font-weight: 850;
  line-height: 1.25;
}

.ready-driver-attention {
  display: block;
  margin-top: 3px;
  color: #b91c1c;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.25;
}

.dfw-ready-team-card .routing-slot.driver-attention {
  border-color: #ef4444;
  background: #fff1f2;
}

.dfw-departures-page .routing-resource-card.future-driver,
.ca-departures-page .routing-resource-card.future-driver {
  border-color: #9fc4eb;
  border-left-color: #2774bd;
  background: #f1f7ff;
}

.driver-future-availability,
.driver-current-availability {
  width: fit-content;
  margin: 2px 0;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 10px !important;
  font-weight: 900;
}

.driver-future-availability {
  background: #dbeeff;
  color: #14558f !important;
}

.driver-current-availability {
  background: #dcf7e7;
  color: #17623b !important;
}

.dfw-ready-slots .routing-slot.locked {
  cursor: default;
}

.dfw-departures-page .routing-resource-card {
  width: 100%;
  text-align: left;
}

.dfw-departures-page .routing-resource-card.selected {
  outline: 3px solid rgba(52, 125, 94, 0.3);
  border-color: #347d5e;
  background: #e8f6ef;
}

@media (max-width: 1050px) {
  .dfw-ready-slots {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }
}

@media (max-width: 680px) {
  .dfw-ready-slots {
    grid-template-columns: 1fr;
  }

  .dfw-ready-team-card > header,
  .dfw-ready-team-card > footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

.ca-departures-page .routing-slot button {
  border-color: #cbd8e8;
  background: #f8fbff;
  color: #53657c;
}

.ca-departures-page .routing-load-actions {
  grid-column: 3;
  grid-row: 3;
  align-self: stretch;
  flex-direction: column;
  justify-content: stretch;
  gap: 8px;
  min-width: 0;
}

.ca-departures-page .routing-load-actions button {
  width: 100%;
  min-height: 34px;
  padding: 0 8px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 900;
}

.ca-departures-page .routing-load-actions .primary-action {
  border-color: #6b95ee;
  background: #7ca0ef;
  color: #ffffff;
}

.ca-departures-page .routing-load-actions .primary-action:hover:not(:disabled) {
  background: #5d86e4;
}

.ca-departures-page .routing-load-actions button:not(.primary-action) {
  border-color: var(--ca-line);
  background: #ffffff;
  color: #0f2238;
}

.ca-departures-page .routing-load-badge {
  border-color: #bde5ce;
  border-radius: 999px;
  background: #ecfdf3;
  color: #166534;
}

.ca-departures-page .routing-resource-panel .resource-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
}

.ca-departures-page .routing-resource-panel .resource-tabs button {
  min-height: 32px;
  padding: 6px 3px;
  border: 1px solid var(--ca-line);
  border-radius: 7px;
  background: #ffffff;
  color: var(--ca-ink);
  font-size: 11.5px;
  font-weight: 850;
  line-height: 1.1;
  white-space: nowrap;
}

.ca-departures-page .routing-resource-panel .resource-tabs button.active {
  border-color: var(--ca-blue);
  background: var(--ca-blue);
  color: #ffffff;
}

.ca-departures-page #routingResourceSearch {
  min-height: 40px;
  border: 1px solid var(--ca-line);
  border-radius: 9px;
  background: #ffffff;
  color: var(--ca-ink);
  font-size: 13px;
}

.ca-departures-page #routingResourceSearch::placeholder {
  color: #94a3b8;
}

.ca-departures-page #routingResourceSummary {
  min-height: 35px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border-radius: 9px;
  background: #eff8f2;
  color: #25533b;
  font-size: 12px;
  font-weight: 900;
}

.ca-departures-page #routingResourceSummary .jitc-icon {
  width: 15px;
  height: 15px;
  color: #7890a9;
}

.ca-departures-page .routing-resource-list {
  gap: 7px;
}

.ca-departures-page .routing-resource-card {
  position: relative;
  gap: 3px;
  padding: 10px 11px 10px 14px;
  border: 1px solid var(--ca-line);
  border-left: 0;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(15, 34, 56, 0.05);
}

.ca-departures-page .routing-resource-card strong {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--ca-ink);
  font-size: 12.5px;
  font-weight: 900;
}

.ca-departures-page .routing-resource-card strong .jitc-icon {
  width: 15px;
  height: 15px;
  color: var(--ca-blue);
}

.ca-departures-page .routing-availability-dot {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
  border-radius: 999px;
  background: #16c46b;
  box-shadow: 0 0 0 3px rgba(22, 196, 107, 0.12);
}

.ca-departures-page .routing-resource-card span,
.ca-departures-page .routing-resource-card small {
  color: var(--ca-muted);
  font-size: 11px;
  line-height: 1.25;
}

@media (max-width: 1280px) {
  .ca-departures-page .routing-layout {
    grid-template-columns: 1fr;
  }

  .ca-departures-page .routing-resource-panel {
    position: static;
    max-height: none;
  }
}

@media (max-width: 980px) {
  .ca-departures-page main {
    padding: 16px;
  }

  .ca-departures-page .routing-controls {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  .ca-departures-page .routing-load-card {
    grid-template-columns: 42px 1fr;
  }

  .ca-departures-page .routing-load-icon {
    width: 38px;
    height: 38px;
  }

  .ca-departures-page .routing-load-main,
  .ca-departures-page .routing-load-meta,
  .ca-departures-page .routing-load-customer,
  .ca-departures-page .routing-slots,
  .ca-departures-page .routing-load-actions {
    grid-column: 2;
    grid-row: auto;
  }

  .ca-departures-page .routing-slots {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }

  .ca-departures-page .routing-load-actions {
    justify-content: flex-start;
  }
}

.broker-out-page {
  --broker-bg: #f5f7fb;
  --broker-surface: #ffffff;
  --broker-line: #dde6f2;
  --broker-ink: #0f2238;
  --broker-muted: #64748b;
  --broker-blue: #2563eb;
  --broker-blue-soft: #eef5ff;
  --broker-green: #16a34a;
  --broker-green-soft: #eaf8ee;
  background: var(--broker-bg);
  color: var(--broker-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.broker-out-page main {
  padding: 22px 26px;
}

.broker-out-page .broker-out-header {
  margin-bottom: 18px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.broker-out-page .broker-out-header h1 {
  margin: 0 0 4px;
  color: var(--broker-ink);
  font-size: 29px;
  font-weight: 850;
  letter-spacing: 0;
}

.broker-out-page .broker-out-header p {
  color: var(--broker-muted);
  font-size: 15px;
}

.broker-out-page .routing-controls {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 88px;
  margin-bottom: 14px;
  padding: 18px 20px;
  border-color: var(--broker-line);
  border-radius: 14px;
  background: var(--broker-surface);
  box-shadow: 0 12px 32px rgba(15, 34, 56, 0.07);
}

.broker-out-page .broker-filter-field {
  display: grid;
  gap: 6px;
  color: #475569;
  font-size: 12px;
  font-weight: 850;
}

.broker-out-page .broker-filter-field input,
.broker-out-page .broker-filter-field select {
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--broker-line);
  border-radius: 10px;
  background: #ffffff;
  color: var(--broker-ink);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(15, 34, 56, 0.03);
}

.broker-out-page .broker-filter-field input {
  width: 154px;
}

.broker-out-page .broker-filter-field select {
  width: 170px;
}

.broker-out-page .routing-window {
  min-height: 42px;
  max-width: 900px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  border: 1px solid #ccebd7;
  border-radius: 10px;
  background: var(--broker-green-soft);
  color: #14532d;
  font-size: 14px;
  font-weight: 850;
  box-shadow: none;
}

.broker-out-page .routing-window .jitc-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  color: #168449;
  stroke-width: 2.2;
}

.broker-out-page .broker-out-panel {
  margin-top: 0;
  padding: 16px 14px 20px;
  border-color: var(--broker-line);
  border-radius: 14px;
  background: var(--broker-surface);
  box-shadow: 0 12px 32px rgba(15, 34, 56, 0.07);
}

.broker-out-page .routing-panel-head {
  margin: 0 2px 18px;
  align-items: start;
}

.broker-out-page .routing-panel-head h2 {
  color: var(--broker-ink);
  font-size: 19px;
  font-weight: 850;
}

.broker-out-page .routing-panel-head span {
  padding-top: 4px;
  color: #40546c;
  font-size: 14px;
  font-weight: 850;
}

.broker-out-page .broker-load-list {
  display: grid;
  justify-items: stretch;
  gap: 18px;
  overflow-x: auto;
}

.broker-out-page .broker-load-list .routing-group {
  width: 100%;
  max-width: 100%;
  gap: 0;
}

.broker-out-page .routing-group > h3 {
  min-height: 43px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid #dce9e4;
  border-bottom: 0;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(90deg, #eff8f2, #f8fbff);
  color: var(--broker-ink);
  font-size: 17px;
  font-weight: 900;
}

.broker-out-page .broker-date-icon {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  color: var(--broker-blue);
  background: var(--broker-blue-soft);
}

.broker-out-page .broker-date-icon .jitc-icon {
  width: 15px;
  height: 15px;
}

.broker-out-page .broker-main-table {
  width: 100%;
  min-width: 1080px;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid var(--broker-line);
  border-radius: 0 0 12px 12px;
  background: #ffffff;
  box-shadow: 0 5px 18px rgba(15, 34, 56, 0.05);
}

.broker-out-page .broker-main-head,
.broker-out-page .broker-main-row {
  display: grid;
  grid-template-columns: minmax(145px, 0.7fr) minmax(185px, 1fr) minmax(185px, 1fr) minmax(220px, 1.05fr) minmax(220px, 1fr) minmax(145px, 0.72fr);
}

.broker-out-page .broker-main-head {
  min-height: 40px;
  border-bottom: 1px solid var(--broker-line);
  background: #fbfcff;
  color: #60718a;
  font-size: 13px;
  font-weight: 850;
}

.broker-out-page .broker-main-head div,
.broker-out-page .broker-main-row > div {
  display: grid;
  align-content: center;
  justify-items: center;
  min-width: 0;
  padding: 8px 12px;
  border-right: 1px solid #edf2f7;
  text-align: center;
}

.broker-out-page .broker-main-head div:last-child,
.broker-out-page .broker-main-row > div:last-child {
  border-right: 0;
}

.broker-out-page .broker-main-item {
  border-bottom: 1px solid #edf2f7;
  background: #ffffff;
  cursor: pointer;
  transition: background 150ms ease, box-shadow 150ms ease;
}

.broker-out-page .broker-main-item:hover {
  background: #f8fbff;
  box-shadow: inset 3px 0 0 var(--broker-blue);
}

.broker-out-page .broker-main-item:last-child {
  border-bottom: 0;
}

.broker-out-page .broker-main-row {
  min-height: 68px;
  color: var(--broker-ink);
  font-size: 12.5px;
  line-height: 1.18;
}

.broker-out-page .broker-load-link {
  grid-template-columns: auto minmax(0, 1fr);
  justify-content: center;
  justify-items: center !important;
  gap: 8px;
  text-align: center !important;
}

.broker-out-page .broker-load-icon {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--broker-blue-soft);
  color: var(--broker-blue);
}

.broker-out-page .broker-load-icon .jitc-icon {
  width: 18px;
  height: 18px;
  stroke-width: 2.15;
}

.broker-out-page .broker-load-link button {
  display: inline-flex;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--broker-blue);
  font: inherit;
  font-size: 13.5px;
  font-weight: 850;
  text-decoration: underline;
  cursor: pointer;
}

.broker-out-page .broker-load-link small {
  display: block;
  margin-top: 6px;
  color: var(--broker-muted);
  font-size: 12px;
  font-weight: 800;
}

.broker-out-page .broker-main-pickup,
.broker-out-page .broker-main-delivery {
  gap: 4px;
  justify-items: center !important;
  text-align: center !important;
  color: var(--broker-ink);
  font-weight: 800;
  line-height: 1.18;
}

.broker-out-page .broker-stop-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #60718a;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.broker-out-page .broker-stop-label .jitc-icon {
  width: 13px;
  height: 13px;
  color: var(--broker-blue);
}

.broker-out-page .broker-main-pickup > strong,
.broker-out-page .broker-main-delivery > strong {
  display: block;
  color: var(--broker-ink);
  font-size: 12.5px;
  font-weight: 800;
}

.broker-out-page .broker-main-requirements .broker-requirements {
  gap: 2px;
  color: #162334;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1.18;
}

.broker-out-page .broker-main-requirements .broker-requirements strong {
  color: #0f2238;
  font-size: 12px;
  font-weight: 850;
}

.broker-out-page .broker-main-note button {
  min-height: 34px;
  width: auto;
  max-width: 100%;
  padding: 6px 12px;
  border: 1px solid var(--broker-line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--broker-blue);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.2;
  box-shadow: 0 1px 2px rgba(15, 34, 56, 0.03);
}

.broker-out-page .broker-main-note button:hover {
  border-color: #c7d6ea;
  background: #f8fbff;
}

.broker-out-page .broker-icon-button {
  min-height: 36px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 13px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 850;
  line-height: 1.1;
  white-space: normal;
}

.broker-out-page .broker-icon-button .jitc-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}

.broker-out-page .broker-main-action .broker-icon-button span {
  display: inline;
}

.broker-out-page .broker-source-pill {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid var(--broker-line);
  border-radius: 8px;
  background: #f8fbff;
  color: #35506c;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.1;
  text-align: center;
}

.broker-out-page .broker-source-pill .jitc-icon {
  width: 15px;
  height: 15px;
  color: var(--broker-blue);
}

.broker-out-page .broker-note,
.broker-out-page .broker-note-empty {
  border-color: var(--broker-line);
  border-radius: 8px;
  background: #ffffff;
  color: #48566a;
}

.broker-out-page .broker-detail-modal {
  width: min(920px, 100%);
  border-radius: 14px;
}

.broker-out-page .broker-modal-actions textarea {
  border-radius: 10px;
}

.broker-out-page .broker-modal-actions .broker-icon-button span {
  display: inline;
}

@media (max-width: 1280px) {
  .broker-out-page .broker-main-table {
    min-width: 980px;
  }

  .broker-out-page .broker-main-head,
  .broker-out-page .broker-main-row {
    grid-template-columns: 135px 175px 175px 205px 205px 135px;
  }
}

@media (max-width: 980px) {
  .broker-out-page main {
    padding: 16px;
  }

  .broker-out-page .routing-controls {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  .broker-out-page .broker-filter-field input,
  .broker-out-page .broker-filter-field select,
  .broker-out-page .routing-window {
    width: 100%;
    max-width: none;
  }
}

/* Shared JITC icon system v88 */
.jitc-icon {
  display: block;
  width: 1em;
  height: 1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.open-trucks-page .open-truck-kpi-icon {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #2563eb;
  background: #dbeafe;
}

.open-trucks-page .open-truck-kpi-icon::before,
.open-trucks-page .open-truck-kpi-icon::after {
  content: none !important;
}

.open-trucks-page .open-truck-kpi-icon .jitc-icon {
  width: 21px;
  height: 21px;
}

.open-trucks-page .open-truck-kpi-card.is-purple .open-truck-kpi-icon {
  color: #7c3aed;
  background: #ede9fe;
}

.open-trucks-page .open-truck-kpi-card.is-pink .open-truck-kpi-icon {
  color: #db2777;
  background: #fce7f3;
}

.open-trucks-page .open-truck-kpi-card.is-cyan .open-truck-kpi-icon {
  color: #0284c7;
  background: #e0f2fe;
}

.open-trucks-page .open-truck-kpi-card.is-amber .open-truck-kpi-icon {
  color: #d97706;
  background: #fef3c7;
}

/* Shared KPI icon sizing v91 */
.tracking-modern-page .tracking-count-icon .jitc-icon,
.tracking-modern-page .tracking-progress-truck .jitc-icon,
.tasks-modern-page .task-kpi-icon .jitc-icon,
.driver-checkin-modern-page .driver-kpi-icon .jitc-icon {
  width: 20px;
  height: 20px;
}

/* Open Trucks compact row density v92 */
.open-trucks-page .open-truck-filters {
  align-items: center;
  justify-content: space-between;
}

.open-trucks-page .open-truck-toolbar-controls {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  align-self: end;
  margin-right: auto;
}

.open-trucks-page .open-truck-show-control,
.open-trucks-page .open-truck-density-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 1px solid #dbe4f0;
  border-radius: 12px;
  background: #f8fafc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.open-trucks-page .open-truck-show-control span,
.open-trucks-page .open-truck-density-control span {
  padding: 0 6px;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.open-trucks-page .open-truck-show-control button,
.open-trucks-page .open-truck-density-control button {
  height: 32px;
  padding: 0 13px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.open-trucks-page .open-truck-show-control button.active,
.open-trucks-page .open-truck-density-control button.active {
  background: #2563eb;
  color: #fff;
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.22);
}

.open-trucks-page.open-truck-density-compact .open-truck-list {
  gap: 8px;
}

.open-trucks-page.open-truck-density-compact .open-truck-market-group {
  border-radius: 13px;
  overflow: hidden;
}

.open-trucks-page.open-truck-density-compact .open-truck-market-header {
  min-height: 30px;
  padding: 5px 12px;
  font-size: 12.5px;
}

.open-trucks-page.open-truck-density-compact .open-truck-market-header span:first-child {
  letter-spacing: 0.01em;
}

.open-trucks-page.open-truck-density-compact .open-truck-market-header span:last-child {
  font-size: 11.5px;
}

.open-trucks-page.open-truck-density-compact .open-truck-card {
  min-height: 0;
  background: #fff;
  transition: background 150ms ease, box-shadow 150ms ease;
}

.open-trucks-page.open-truck-density-compact .open-truck-card:hover {
  background: #f8fbff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.055);
}

.open-trucks-page.open-truck-density-compact .open-truck-card::before {
  top: 8px;
  bottom: 8px;
  width: 4px;
}

.open-trucks-page.open-truck-density-compact .open-truck-main {
  min-height: 60px;
  grid-template-columns: 92px minmax(155px, 0.9fr) minmax(220px, 1.25fr) minmax(220px, 1.12fr) minmax(150px, 0.78fr);
  align-items: stretch;
}

.open-trucks-page.open-truck-density-compact .open-truck-number,
.open-trucks-page.open-truck-density-compact .open-truck-location,
.open-trucks-page.open-truck-density-compact .open-truck-last-load,
.open-trucks-page.open-truck-density-compact .open-truck-next-load,
.open-trucks-page.open-truck-density-compact .open-truck-note-card {
  min-height: 60px;
  padding: 5px 9px;
  gap: 2px;
  justify-content: center;
  text-align: center;
}

.open-trucks-page.open-truck-density-compact .open-truck-number {
  gap: 3px;
}

.open-trucks-page.open-truck-density-compact .open-truck-mini-icon {
  width: 16px;
  height: 16px;
  margin-bottom: 0;
}

.open-trucks-page.open-truck-density-compact .open-truck-number strong {
  font-size: 19px;
  line-height: 1;
  letter-spacing: 0;
}

.open-trucks-page.open-truck-density-compact .open-truck-main .open-truck-hold-button {
  min-height: 21px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10.5px;
  line-height: 1;
}

.open-trucks-page.open-truck-density-compact .open-truck-location > small,
.open-trucks-page.open-truck-density-compact .open-truck-last-load > small,
.open-trucks-page.open-truck-density-compact .open-truck-next-load > small,
.open-trucks-page.open-truck-density-compact .open-truck-note-card > small {
  margin: 0;
  font-size: 9.5px;
  line-height: 1.05;
}

.open-trucks-page.open-truck-density-compact .open-truck-location b,
.open-trucks-page.open-truck-density-compact .open-truck-last-load b,
.open-trucks-page.open-truck-density-compact .open-truck-next-load b,
.open-trucks-page.open-truck-density-compact .open-truck-note-card b {
  max-width: 100%;
  font-size: 12px;
  line-height: 1.12;
}

.open-trucks-page.open-truck-density-compact .open-truck-last-load b,
.open-trucks-page.open-truck-density-compact .open-truck-next-load b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-trucks-page.open-truck-density-compact .open-truck-location span,
.open-trucks-page.open-truck-density-compact .open-truck-last-load span,
.open-trucks-page.open-truck-density-compact .open-truck-next-load span,
.open-trucks-page.open-truck-density-compact .open-truck-note-card span {
  max-width: 100%;
  font-size: 10.8px;
  line-height: 1.1;
}

.open-trucks-page.open-truck-density-compact .open-truck-time-stack {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1px 10px;
  margin-top: 0;
}

.open-trucks-page.open-truck-density-compact .open-truck-time-stack span {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  font-size: 10.8px;
  line-height: 1.1;
}

.open-trucks-page.open-truck-density-compact .open-truck-time-stack small {
  font-size: 9px;
  line-height: 1;
}

.open-trucks-page.open-truck-density-compact .open-truck-wait-card {
  display: inline-flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
  margin-top: 0;
  padding: 0;
  background: transparent;
  border-radius: 0;
}

.open-trucks-page.open-truck-density-compact .open-truck-wait-card small,
.open-trucks-page.open-truck-density-compact .open-truck-wait-card b {
  font-size: 10.8px;
  line-height: 1.05;
}

.open-trucks-page.open-truck-density-compact .open-truck-hold-line {
  margin-top: 0;
  gap: 1px;
}

.open-trucks-page.open-truck-density-compact .open-truck-hold-line small {
  font-size: 9.5px;
}

.open-trucks-page.open-truck-density-compact .open-truck-hold-line span {
  font-size: 10.8px;
  line-height: 1.08;
}

.open-trucks-page.open-truck-density-compact .open-truck-note-card {
  min-height: 44px;
  border-radius: 0;
}

.open-trucks-page.open-truck-density-compact .open-truck-note-card:not(.is-empty) {
  padding: 4px 9px;
  background: color-mix(in srgb, var(--open-note-color, #d8ecff) 54%, #fff 46%);
}

.open-trucks-page.open-truck-density-compact .open-truck-note-card.is-empty {
  min-height: 32px;
  padding: 4px 8px;
  background: transparent;
}

.open-trucks-page.open-truck-density-compact .open-truck-note-card.is-empty b {
  color: #2563eb;
  font-size: 11px;
}

.open-trucks-page.open-truck-density-comfortable .open-truck-density-control button[data-open-truck-density="comfortable"] {
  background: #2563eb;
  color: #fff;
}

@media (max-width: 1200px) {
  .open-trucks-page .open-truck-toolbar-controls {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Brokered Loads board v136 */
.brokered-loads-page main {
  display: grid;
  gap: 14px;
}

.brokered-loads-page .modern-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.brokered-loads-page .modern-page-header h1 {
  margin: 0;
  color: #0f172a;
  font-size: 30px;
  line-height: 1.08;
}

.brokered-loads-page .modern-page-header p {
  margin: 5px 0 0;
  color: #64748b;
  font-size: 15px;
}

.brokered-loads-toolbar {
  display: grid;
  grid-template-columns: 145px 145px minmax(260px, 1fr) minmax(180px, 240px);
  gap: 10px;
  align-items: end;
  padding: 14px;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.brokered-loads-toolbar label {
  display: grid;
  gap: 6px;
  margin: 0;
}

.brokered-loads-toolbar span {
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.brokered-loads-toolbar input,
.brokered-loads-toolbar select {
  min-height: 42px;
  border-radius: 9px;
  border-color: #d5dfec;
  background: #ffffff;
  color: #0f172a;
  font-weight: 800;
}

.brokered-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 12px;
}

.brokered-kpi {
  display: grid;
  gap: 7px;
  min-height: 86px;
  padding: 16px;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.brokered-kpi span {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.brokered-kpi strong {
  color: #0f172a;
  font-size: 28px;
  line-height: 1;
}

.brokered-kpi-blue {
  border-left: 4px solid #2563eb;
}

.brokered-kpi-green {
  border-left: 4px solid #16a34a;
}

.brokered-kpi-amber {
  border-left: 4px solid #d97706;
}

.brokered-day-board {
  display: grid;
  gap: 12px;
}

.brokered-day-card,
.brokered-empty {
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.07);
}

.brokered-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(90deg, #eef7f1 0%, #f8fbff 100%);
  border-bottom: 1px solid #dbe3ef;
}

.brokered-day-head div {
  display: grid;
  gap: 4px;
}

.brokered-day-date {
  color: #2563eb;
  font-size: 15px;
  font-weight: 1000;
}

.brokered-day-head strong {
  color: #334155;
  font-size: 13px;
}

.brokered-day-pay {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  color: #065f46;
  background: #dcfce7;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 1000;
}

.brokered-load-head,
.brokered-load-row {
  display: grid;
  grid-template-columns: minmax(160px, 1.05fr) minmax(170px, 1.1fr) minmax(170px, 1.1fr) minmax(160px, 0.9fr) minmax(110px, 0.55fr);
  gap: 12px;
  align-items: center;
}

.brokered-load-head {
  padding: 10px 16px;
  color: #64748b;
  background: #f8fafc;
  border-bottom: 1px solid #e5edf7;
  font-size: 12px;
  font-weight: 1000;
}

.brokered-load-list {
  display: grid;
}

.brokered-load-row {
  min-height: 78px;
  padding: 12px 16px;
  border-bottom: 1px solid #e8eef7;
}

.brokered-load-row:last-child {
  border-bottom: 0;
}

.brokered-load-row:hover {
  background: #f8fbff;
}

.brokered-load-main {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.brokered-load-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  color: #2563eb;
  background: #eaf2ff;
  border-radius: 50%;
}

.brokered-load-icon .jitc-icon {
  width: 20px;
  height: 20px;
}

.brokered-load-number {
  color: #2563eb;
  font-size: 16px;
  font-weight: 1000;
  text-decoration: none;
}

.brokered-load-number:hover {
  text-decoration: underline;
}

.brokered-load-main small,
.brokered-route small,
.brokered-carrier span,
.brokered-pay span,
.brokered-empty span {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.brokered-route strong,
.brokered-carrier strong,
.brokered-pay strong,
.brokered-empty strong {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 14px;
  font-weight: 1000;
}

.brokered-carrier strong {
  color: #064e3b;
}

.brokered-pay strong {
  color: #854d0e;
}

.brokered-empty {
  display: grid;
  gap: 4px;
  padding: 18px;
}

@media (max-width: 1200px) {
  .brokered-load-head,
  .brokered-load-row {
    grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(130px, 0.9fr) minmax(95px, 0.55fr);
  }
}

@media (max-width: 900px) {
  .brokered-loads-page .modern-page-header,
  .brokered-day-head {
    align-items: stretch;
    flex-direction: column;
  }

  .brokered-loads-toolbar,
  .brokered-kpis {
    grid-template-columns: 1fr;
  }

  .brokered-load-head {
    display: none;
  }

  .brokered-load-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

/* Brokered Loads 7-day calendar v137 */
.brokered-loads-page .brokered-loads-toolbar {
  grid-template-columns: 150px minmax(280px, 1fr) minmax(180px, 240px) 100px;
}

.brokered-week-note {
  display: grid;
  gap: 6px;
  min-height: 42px;
  align-self: end;
  padding: 7px 10px;
  color: #0f172a;
  background: #f8fbff;
  border: 1px solid #d5dfec;
  border-radius: 9px;
}

.brokered-week-note span {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
}

.brokered-week-note strong {
  color: #0f172a;
  font-size: 13px;
  line-height: 1;
}

.brokered-loads-page .brokered-day-board {
  overflow-x: auto;
  padding-bottom: 8px;
}

.brokered-calendar-board {
  display: grid;
  grid-template-columns: repeat(7, minmax(230px, 1fr));
  gap: 10px;
  min-width: 1680px;
  align-items: start;
}

.brokered-calendar-day {
  min-height: 520px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.07);
}

.brokered-calendar-day.is-empty {
  background: rgba(255, 255, 255, 0.72);
}

.brokered-calendar-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 64px;
  padding: 12px;
  background: linear-gradient(180deg, #eff6ff 0%, #f8fbff 100%);
  border-bottom: 1px solid #dbe3ef;
}

.brokered-calendar-day-head div {
  display: grid;
  gap: 3px;
}

.brokered-calendar-day-head strong {
  color: #1d4ed8;
  font-size: 15px;
  font-weight: 1000;
  line-height: 1.05;
}

.brokered-calendar-day-head span {
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.brokered-calendar-day-head small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  min-height: 26px;
  padding: 4px 8px;
  color: #075985;
  background: #e0f2fe;
  border: 1px solid #bae6fd;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 1000;
}

.brokered-calendar-day-total {
  min-height: 36px;
  padding: 8px 12px;
  color: #065f46;
  background: #ecfdf5;
  border-bottom: 1px solid #d1fae5;
  font-size: 14px;
  font-weight: 1000;
  text-align: right;
}

.brokered-calendar-loads {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.brokered-calendar-load {
  display: grid;
  gap: 7px;
  padding: 10px;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-left: 4px solid #16a34a;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.brokered-calendar-load-head {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.brokered-calendar-load .brokered-load-icon {
  width: 28px;
  height: 28px;
  color: #2563eb;
}

.brokered-calendar-load .brokered-load-icon .jitc-icon {
  width: 15px;
  height: 15px;
}

.brokered-calendar-load .brokered-load-number {
  min-width: 0;
  overflow: hidden;
  color: #1d4ed8;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brokered-calendar-route {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.brokered-calendar-route strong {
  min-width: 0;
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brokered-calendar-route span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
}

.brokered-calendar-carrier {
  min-height: 30px;
  padding: 6px 8px;
  color: #064e3b;
  background: #dcfce7;
  border: 1px solid #bbf7d0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 1000;
  overflow-wrap: anywhere;
}

.brokered-calendar-pay {
  min-height: 30px;
  padding: 6px 8px;
  color: #854d0e;
  background: #fef3c7;
  border: 1px solid #fde68a;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 1000;
  text-align: right;
}

.brokered-calendar-empty {
  min-height: 96px;
  display: grid;
  place-items: center;
  color: #94a3b8;
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 900;
}

@media (max-width: 1200px) {
  .brokered-calendar-board {
    min-width: 1540px;
    grid-template-columns: repeat(7, minmax(210px, 1fr));
  }
}

@media (max-width: 900px) {
  .brokered-loads-page .brokered-loads-toolbar {
    grid-template-columns: 1fr;
  }

  .brokered-calendar-board {
    min-width: 0;
    grid-template-columns: 1fr;
  }

  .brokered-calendar-day {
    min-height: auto;
  }
}

/* Brokered Loads compact density v138 */
.brokered-loads-page .brokered-kpis {
  grid-template-columns: repeat(3, minmax(130px, 1fr));
  gap: 8px;
}

.brokered-loads-page .brokered-kpi {
  min-height: 62px;
  padding: 10px 12px;
  border-radius: 10px;
}

.brokered-loads-page .brokered-kpi strong {
  font-size: 22px;
}

.brokered-loads-page .brokered-loads-toolbar {
  padding: 10px;
  border-radius: 10px;
}

.brokered-loads-page .brokered-loads-toolbar input,
.brokered-loads-page .brokered-loads-toolbar select,
.brokered-loads-page .brokered-week-note {
  min-height: 36px;
}

.brokered-loads-page .brokered-day-board {
  padding-bottom: 4px;
}

.brokered-loads-page .brokered-calendar-board {
  grid-template-columns: repeat(7, minmax(190px, 1fr));
  gap: 8px;
  min-width: 1340px;
}

.brokered-loads-page .brokered-calendar-day {
  min-height: 440px;
  border-radius: 10px;
}

.brokered-loads-page .brokered-calendar-day-head {
  min-height: 50px;
  padding: 8px 10px;
}

.brokered-loads-page .brokered-calendar-day-head strong {
  font-size: 14px;
}

.brokered-loads-page .brokered-calendar-day-head span {
  font-size: 11px;
}

.brokered-loads-page .brokered-calendar-day-head small {
  min-width: 44px;
  min-height: 22px;
  padding: 3px 7px;
  font-size: 10px;
}

.brokered-loads-page .brokered-calendar-day-total {
  min-height: 28px;
  padding: 5px 10px;
  font-size: 12px;
}

.brokered-loads-page .brokered-calendar-loads {
  gap: 6px;
  padding: 7px;
}

.brokered-loads-page .brokered-calendar-load {
  gap: 5px;
  padding: 7px 8px;
  border-left-width: 3px;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}

.brokered-compact-head {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

.brokered-loads-page .brokered-calendar-load .brokered-load-icon {
  width: 20px;
  height: 20px;
}

.brokered-loads-page .brokered-calendar-load .brokered-load-icon .jitc-icon {
  width: 12px;
  height: 12px;
}

.brokered-loads-page .brokered-calendar-load .brokered-load-number {
  font-size: 13px;
}

.brokered-compact-pay {
  min-height: 22px;
  padding: 3px 6px;
  color: #854d0e;
  background: #fef3c7;
  border: 1px solid #fde68a;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 1000;
  line-height: 1.1;
  white-space: nowrap;
}

.brokered-compact-route {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.brokered-compact-route strong {
  min-width: 0;
  overflow: hidden;
  color: #0f172a;
  font-size: 12px;
  font-weight: 1000;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brokered-compact-route span {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.brokered-compact-carrier {
  min-height: 24px;
  padding: 4px 6px;
  overflow: hidden;
  color: #064e3b;
  background: #dcfce7;
  border: 1px solid #bbf7d0;
  border-radius: 7px;
  font-size: 11px;
  font-weight: 1000;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brokered-loads-page .brokered-calendar-empty {
  min-height: 72px;
  font-size: 12px;
}

@media (max-width: 1200px) {
  .brokered-loads-page .brokered-calendar-board {
    grid-template-columns: repeat(7, minmax(180px, 1fr));
    min-width: 1260px;
  }
}

@media (max-width: 900px) {
  .brokered-loads-page .brokered-calendar-board {
    min-width: 0;
    grid-template-columns: 1fr;
  }

  .brokered-compact-route strong,
  .brokered-compact-carrier {
    white-space: normal;
  }
}

/* Brokered Loads compact lane cards v139 */
.brokered-loads-page button.brokered-calendar-load {
  width: 100%;
  min-height: 0;
  padding: 6px 8px;
  border: 1px solid rgba(37, 99, 235, 0.16);
  border-left: 3px solid #16a34a;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  grid-template-areas:
    "icon number rate"
    "icon carrier carrier"
    "icon lane time";
  gap: 1px 7px;
  text-align: left;
  font: inherit;
  color: #06142e;
  cursor: pointer;
}

.brokered-loads-page button.brokered-calendar-load:hover,
.brokered-loads-page button.brokered-calendar-load:focus-visible {
  border-color: rgba(37, 99, 235, 0.42);
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.13);
  outline: none;
  transform: translateY(-1px);
}

.brokered-state-load .brokered-load-icon {
  grid-area: icon;
  width: 20px;
  height: 20px;
  align-self: center;
}

.brokered-mini-load-number {
  grid-area: number;
  color: inherit;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.05;
  white-space: nowrap;
}

.brokered-mini-rate {
  grid-area: rate;
  justify-self: end;
  font-size: 0.82rem;
  font-weight: 950;
  line-height: 1.05;
  white-space: nowrap;
}

.brokered-mini-carrier {
  grid-area: carrier;
  min-width: 0;
  color: inherit;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.08;
  opacity: 0.9;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brokered-mini-lane {
  grid-area: lane;
  font-size: 0.8rem;
  font-weight: 900;
  line-height: 1.05;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.brokered-mini-time {
  grid-area: time;
  color: inherit;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.05;
  white-space: nowrap;
  justify-self: end;
  opacity: 0.86;
}

.brokered-loads-page button.brokered-calendar-load.load-usps {
  border-color: #c79600;
  border-left-color: #c79600;
  background: #ffc000;
  color: #111111;
}

.brokered-loads-page button.brokered-calendar-load.load-dhl {
  border-color: #8db376;
  border-left-color: #8db376;
  background: #c6e0b4;
  color: #10210f;
}

.brokered-loads-page button.brokered-calendar-load.load-other-customer {
  border-color: #0088ba;
  border-left-color: #0088ba;
  background: #00b0f0;
  color: #051b24;
}

.brokered-loads-page button.brokered-calendar-load.load-usps .brokered-load-icon,
.brokered-loads-page button.brokered-calendar-load.load-dhl .brokered-load-icon,
.brokered-loads-page button.brokered-calendar-load.load-other-customer .brokered-load-icon {
  background: rgba(255, 255, 255, 0.55);
  color: inherit;
}

.brokered-load-modal[hidden] {
  display: none;
}

.brokered-load-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 24px;
}

.brokered-load-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(6, 20, 46, 0.48);
  backdrop-filter: blur(3px);
}

.brokered-load-dialog {
  position: relative;
  z-index: 1;
  width: min(620px, calc(100vw - 28px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 26px 70px rgba(15, 23, 42, 0.26);
}

.brokered-load-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}

.brokered-load-dialog-head span {
  display: block;
  margin-bottom: 3px;
  color: #008061;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.brokered-load-dialog-head h2 {
  margin: 0;
  color: #06142e;
  font-size: 1.35rem;
}

.brokered-load-dialog-head button {
  min-width: 78px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  border-radius: 10px;
  background: #ffffff;
  color: #06142e;
  font-weight: 900;
  padding: 10px 14px;
  cursor: pointer;
}

.brokered-load-dialog-body {
  padding: 18px 20px 20px;
}

.brokered-detail-summary {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  margin-bottom: 14px;
}

.brokered-detail-summary > div {
  border: 1px solid rgba(22, 163, 74, 0.2);
  border-radius: 12px;
  background: #ecfdf3;
  padding: 11px 12px;
}

.brokered-detail-summary span,
.brokered-detail-row span {
  display: block;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
}

.brokered-detail-summary strong {
  display: block;
  margin-top: 3px;
  color: #005f49;
  font-size: 1.05rem;
  font-weight: 950;
}

.brokered-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.brokered-detail-row {
  min-height: 62px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 12px;
  background: #f8fbff;
  padding: 10px 12px;
}

.brokered-detail-row strong {
  display: block;
  margin-top: 4px;
  color: #06142e;
  font-size: 0.94rem;
  line-height: 1.2;
}

@media (max-width: 620px) {
  .brokered-detail-summary,
  .brokered-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* Brokered Loads sheet redesign v141 */
.brokered-loads-page .brokered-loads-toolbar {
  grid-template-columns: 150px minmax(260px, 1fr) minmax(180px, 240px) minmax(120px, auto);
  margin-bottom: 12px;
  background: #ffffff;
}

.brokered-week-tabs {
  display: grid;
  grid-template-columns: repeat(7, minmax(100px, 1fr));
  gap: 6px;
  margin: 0 0 12px;
  padding: 10px;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.brokered-week-tab {
  min-height: 54px;
  display: grid;
  gap: 4px;
  align-content: center;
  justify-items: center;
  padding: 8px 6px;
  background: #ffffff;
  border: 1px solid #d5dfec;
  border-radius: 9px;
  color: #06142e;
  cursor: pointer;
  font: inherit;
  transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.brokered-week-tab span {
  font-size: 0.92rem;
  font-weight: 950;
  line-height: 1;
}

.brokered-week-tab small {
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 850;
}

.brokered-week-tab.active {
  border-color: #06142e;
  box-shadow: inset 0 0 0 1px #06142e, 0 6px 16px rgba(15, 23, 42, 0.08);
}

.brokered-week-tab:hover,
.brokered-week-tab:focus-visible {
  border-color: #64748b;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.1);
  outline: none;
  transform: translateY(-1px);
}

.brokered-tracking-refresh-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 58px;
  margin: 0 0 12px;
  padding: 11px 14px;
  border: 1px solid #cfe0f5;
  border-radius: 12px;
  background: #f3f8ff;
  color: #17375e;
}

.brokered-tracking-refresh-status > div {
  display: grid;
  gap: 3px;
}

.brokered-tracking-refresh-status strong {
  color: #06142e;
  font-size: 0.9rem;
  font-weight: 950;
}

.brokered-tracking-refresh-status span {
  color: #4b6280;
  font-size: 0.8rem;
  font-weight: 750;
}

.brokered-tracking-refresh-status.ready {
  border-color: #bfe5ce;
  background: #f0faf4;
}

.brokered-tracking-refresh-status button {
  min-height: 38px;
  flex: 0 0 auto;
  padding: 8px 14px;
  border: 1px solid #1f64e5;
  border-radius: 9px;
  background: #2368e8;
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 900;
}

.brokered-tracking-refresh-status button:disabled {
  border-color: #cbd5e1;
  background: #e8edf4;
  color: #7a899d;
  cursor: not-allowed;
}

.brokered-eta-filters {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}

.brokered-filter-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 2px 12px;
  align-items: center;
  min-height: 70px;
  padding: 12px 14px;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  background: #ffffff;
  color: #06142e;
  cursor: pointer;
  font: inherit;
  text-align: left;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.055);
  transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.brokered-filter-card:hover,
.brokered-filter-card:focus-visible {
  border-color: #93c5fd;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.09);
  outline: none;
  transform: translateY(-1px);
}

.brokered-filter-card.active {
  border-color: #93c5fd;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.1), 0 10px 24px rgba(15, 23, 42, 0.075);
}

.brokered-filter-icon {
  grid-row: 1 / span 2;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 999px;
  background: #eff6ff;
  color: #2563eb;
  box-shadow: inset 0 0 0 1px #bfdbfe;
}

.brokered-filter-svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.brokered-filter-card strong {
  color: #06142e;
  font-size: 1.28rem;
  font-weight: 1000;
  line-height: 1;
}

.brokered-filter-card > span:last-child {
  color: #64748b;
  font-size: 0.8rem;
  font-weight: 850;
  line-height: 1.1;
}

.brokered-filter-card.late .brokered-filter-icon {
  background: #fff1f2;
  color: #ef4444;
  box-shadow: inset 0 0 0 1px #fecdd3;
}

.brokered-filter-card.tight .brokered-filter-icon {
  background: #fffbeb;
  color: #f59e0b;
  box-shadow: inset 0 0 0 1px #fde68a;
}

.brokered-filter-card.missing .brokered-filter-icon {
  background: #eff6ff;
  color: #60a5fa;
  box-shadow: inset 0 0 0 1px #bfdbfe;
}

.brokered-filter-card.ok .brokered-filter-icon {
  background: #ecfdf5;
  color: #10b981;
  box-shadow: inset 0 0 0 1px #bbf7d0;
}

.brokered-filter-card.late strong {
  color: #be123c;
}

.brokered-filter-card.tight strong {
  color: #b45309;
}

.brokered-filter-card.missing strong {
  color: #2563eb;
}

.brokered-filter-card.ok strong {
  color: #047857;
}

.brokered-loads-page .brokered-day-board {
  overflow-x: visible;
}

.brokered-sheet-panel {
  overflow: hidden;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 12px;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.08);
}

.brokered-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
}

.brokered-sheet-head h2 {
  margin: 0;
  color: #06142e;
  font-size: 1.25rem;
}

.brokered-sheet-head p {
  margin: 4px 0 0;
  color: #64748b;
  font-weight: 750;
}

.brokered-sheet-summary {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #06142e;
  white-space: nowrap;
}

.brokered-sheet-summary span,
.brokered-sheet-summary strong {
  padding: 7px 10px;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  border-radius: 9px;
  font-weight: 950;
}

.brokered-sheet-table-wrap {
  overflow-x: auto;
}

.brokered-sheet-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: separate;
  border-spacing: 0;
  background: #ffffff;
}

.brokered-sheet-table th,
.brokered-sheet-table td {
  border-right: 1px solid #e2e8f0;
  border-bottom: 1px solid #e2e8f0;
  padding: 9px 10px;
  color: #06142e;
  text-align: center;
  vertical-align: middle;
}

.brokered-sheet-table th:last-child,
.brokered-sheet-table td:last-child {
  border-right: 0;
}

.brokered-sheet-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #ffffff;
  color: #334155;
  font-size: 0.78rem;
  font-weight: 950;
  white-space: nowrap;
}

.brokered-sheet-table tbody tr {
  background: #ffffff;
}

.brokered-sheet-table tbody tr:hover {
  background: #f8fafc;
}

.brokered-sheet-table td {
  font-size: 0.86rem;
  font-weight: 780;
  line-height: 1.25;
}

.brokered-sheet-table td strong {
  display: block;
  color: #06142e;
  font-weight: 950;
  text-align: center;
}

.brokered-sheet-table td span {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
  text-align: center;
}

.brokered-table-load-cell {
  width: 92px;
}

.brokered-load-number-chip {
  min-width: 74px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 9px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  color: #06142e;
  cursor: pointer;
  font: inherit;
  font-weight: 1000;
  line-height: 1;
}

.brokered-load-number-chip.load-usps {
  border-color: #c79600;
  background: #ffc000;
  color: #111111;
}

.brokered-load-number-chip.load-dhl {
  border-color: #8db376;
  background: #c6e0b4;
  color: #10210f;
}

.brokered-load-number-chip.load-other-customer {
  border-color: #0088ba;
  background: #00b0f0;
  color: #051b24;
}

.brokered-load-number-chip:hover,
.brokered-load-number-chip:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16);
}

.brokered-rate-cell {
  white-space: nowrap;
  font-weight: 950;
}

.brokered-eta-cell {
  min-width: 132px;
}

.brokered-eta-stack {
  display: grid;
  gap: 5px;
  align-content: center;
  justify-items: center;
  text-align: center;
}

.brokered-eta-stack strong {
  font-weight: 950;
  white-space: nowrap;
}

.brokered-eta-tag,
.brokered-coming-soon {
  display: inline-flex !important;
  width: fit-content;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.72rem !important;
  font-weight: 950 !important;
  line-height: 1;
}

.brokered-eta-tag.tight {
  border: 1px solid #f4c542;
  background: #fff4c2;
  color: #7a4b00 !important;
}

.brokered-eta-tag.late {
  border: 1px solid #fda4af;
  background: #ffe4e8;
  color: #a10f2b !important;
}

.brokered-coming-soon {
  border: 1px solid #dbe3ef;
  background: #f8fafc;
  color: #64748b !important;
}

.brokered-driver-ping-list {
  display: grid;
  min-width: 190px;
  gap: 5px;
  justify-items: center;
  text-align: center;
}

.brokered-driver-ping-line,
.brokered-driver-no-tracking {
  color: #334155 !important;
  font-size: 0.78rem !important;
  font-weight: 850;
  line-height: 1.25;
  text-align: center;
}

.brokered-driver-ping-line.is-stale {
  color: #c1122f !important;
  font-weight: 950;
}

.brokered-driver-no-tracking {
  color: #64748b !important;
}

.brokered-complete-cell {
  text-align: center;
  color: #334155 !important;
}

.brokered-complete-cell span {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 118px;
  min-height: 28px;
  padding: 5px 12px;
  border: 1px solid #d7dee9;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155 !important;
  font-size: 0.78rem !important;
  font-weight: 950;
}

.brokered-sheet-empty {
  height: 180px;
  color: #94a3b8 !important;
  text-align: center !important;
  vertical-align: middle !important;
  font-weight: 950 !important;
}

@media (max-width: 1200px) {
  .brokered-week-tabs {
    grid-template-columns: repeat(4, minmax(110px, 1fr));
  }

  .brokered-eta-filters {
    grid-template-columns: repeat(3, minmax(130px, 1fr));
  }
}

@media (max-width: 900px) {
  .brokered-loads-page .brokered-loads-toolbar,
  .brokered-week-tabs {
    grid-template-columns: 1fr;
  }

  .brokered-eta-filters {
    grid-template-columns: 1fr;
  }

  .brokered-sheet-head {
    align-items: stretch;
    flex-direction: column;
  }

  .brokered-sheet-summary {
    justify-content: space-between;
  }

  .brokered-tracking-refresh-status {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Reset Location Settings */
.reset-location-manager {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--portal-line, #dbe3ef);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.reset-location-manager-head,
.reset-location-editor-head,
.reset-location-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.reset-location-manager-head h2,
.reset-location-editor h3 {
  margin: 0;
}

.reset-location-manager-head p:not(.eyebrow),
.reset-location-editor p:not(.eyebrow) {
  margin: 6px 0 0;
  color: #64748b;
  line-height: 1.5;
}

.reset-location-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px;
  padding: 6px;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  background: #f1f5f9;
}

.reset-location-tabs button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #475569;
  background: transparent;
  box-shadow: none;
}

.reset-location-tabs button span {
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 800;
}

.reset-location-tabs button.active {
  border-color: #bfdbfe;
  color: #1d4ed8;
  background: #ffffff;
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.08);
}

.reset-location-editor {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid #bfdbfe;
  border-radius: 12px;
  background: #eff6ff;
}

.reset-location-editor[hidden] {
  display: none;
}

.reset-location-fields {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(110px, 180px) auto;
  gap: 12px;
  align-items: end;
}

.reset-location-fields label {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 0.82rem;
  font-weight: 850;
}

.reset-location-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 10px;
  max-height: 560px;
  overflow-y: auto;
  padding: 2px 4px 4px 2px;
}

.reset-location-card {
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
}

.reset-location-card.inactive {
  opacity: 0.68;
  background: #f8fafc;
}

.reset-location-card > div {
  display: grid;
  gap: 2px;
}

.reset-location-card span,
.reset-location-card small,
.reset-location-protected {
  color: #64748b;
  font-size: 0.74rem;
}

.reset-location-protected {
  white-space: nowrap;
  font-weight: 850;
}

@media (max-width: 1000px) {
  .reset-location-list {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  .reset-location-fields {
    grid-template-columns: 1fr 120px;
  }

  .reset-location-fields .primary-action {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .reset-location-manager-head,
  .reset-location-editor-head {
    align-items: stretch;
    flex-direction: column;
  }

  .reset-location-tabs,
  .reset-location-fields,
  .reset-location-list {
    grid-template-columns: 1fr;
  }

  .reset-location-fields .primary-action {
    grid-column: auto;
  }
}

.planning-activity-page main {
  background: #f3f7fc;
}

.activity-mode-tabs button[hidden],
.activity-filter-panel label[hidden],
.activity-diagnostic[hidden],
.activity-load-more[hidden] {
  display: none !important;
}

.activity-mode-tabs {
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr));
  gap: 5px;
  margin-bottom: 14px;
  padding: 5px;
  border: 1px solid #d8e2ef;
  border-radius: 13px;
  background: #eaf0f7;
}

.activity-mode-tabs button {
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #475569;
  font-weight: 850;
}

.activity-mode-tabs button.active {
  background: #fff;
  color: #1557d5;
  box-shadow: 0 2px 9px rgba(20, 50, 90, 0.12);
}

.activity-filter-panel {
  display: grid;
  grid-template-columns: repeat(6, minmax(135px, 1fr));
  gap: 12px;
  padding: 16px;
  border: 1px solid #dbe5f0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(34, 65, 105, 0.07);
}

.activity-filter-panel label {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 0.78rem;
  font-weight: 850;
}

.activity-filter-panel input,
.activity-filter-panel select {
  min-width: 0;
  width: 100%;
}

.activity-coverage {
  margin: 12px 0;
  padding: 10px 13px;
  border: 1px solid #c9daf1;
  border-radius: 11px;
  background: #edf5ff;
  color: #48627f;
  font-size: 0.82rem;
}

.activity-diagnostic {
  margin: 14px 0;
  padding: 18px;
  border: 1px solid #b9d2f4;
  border-left: 5px solid #2465de;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(34, 65, 105, 0.08);
}

.activity-diagnostic-not_needed,
.activity-diagnostic-empty_move,
.activity-diagnostic-home_reset,
.activity-diagnostic-same_location {
  border-left-color: #e49b16;
}

.activity-diagnostic-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.activity-diagnostic-head span,
.activity-diagnostic-route small {
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.activity-diagnostic-head h2 {
  margin: 2px 0 0;
}

.activity-diagnostic > p {
  margin: 10px 0;
  color: #52677f;
}

.activity-diagnostic-route {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px;
  border-radius: 11px;
  background: #f5f8fc;
}

.activity-diagnostic-route div {
  display: grid;
  gap: 2px;
}

.activity-diagnostic-route b {
  color: #2b66c8;
  font-size: 1.4rem;
}

.activity-diagnostic-route em {
  color: #64748b;
  font-size: 0.75rem;
  font-style: normal;
}

.activity-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 12px;
  margin: 14px 0;
}

.activity-history-panel {
  padding: 18px;
  border: 1px solid #dbe5f0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(34, 65, 105, 0.07);
}

.activity-event-list {
  display: grid;
  gap: 9px;
  margin-top: 14px;
}

.activity-event-row {
  display: grid;
  grid-template-columns: 165px minmax(0, 1fr) 130px;
  gap: 16px;
  padding: 14px;
  border: 1px solid #e1e8f0;
  border-radius: 12px;
  background: #fbfdff;
}

.activity-event-time,
.activity-event-source {
  display: grid;
  align-content: start;
  gap: 7px;
  color: #64748b;
  font-size: 0.76rem;
}

.activity-actor {
  width: fit-content;
  padding: 3px 7px;
  border-radius: 999px;
  background: #e8f1ff;
  color: #1f5fc4;
  font-weight: 850;
}

.activity-actor.system {
  background: #edf1f5;
  color: #536273;
}

.activity-event-main > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  color: #60738a;
  font-size: 0.78rem;
}

.activity-action-pill {
  padding: 4px 8px;
  border-radius: 7px;
  background: #e7f5ed;
  color: #157446;
  font-weight: 850;
}

.activity-event-main h3 {
  margin: 7px 0 3px;
  color: #102a4f;
  font-size: 0.95rem;
}

.activity-event-main p,
.activity-event-main small {
  display: block;
  margin: 3px 0 0;
  color: #60738a;
}

.activity-event-source {
  justify-items: end;
  text-align: right;
}

.activity-load-more {
  display: block;
  margin: 15px auto 0;
}

@media (max-width: 1100px) {
  .activity-filter-panel {
    grid-template-columns: repeat(3, minmax(150px, 1fr));
  }

  .activity-kpi-grid {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
  }
}

@media (max-width: 720px) {
  .activity-mode-tabs,
  .activity-filter-panel,
  .activity-kpi-grid {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .activity-diagnostic-head,
  .activity-diagnostic-route {
    align-items: flex-start;
    flex-direction: column;
  }

  .activity-event-row {
    grid-template-columns: 1fr;
  }

  .activity-event-source {
    justify-items: start;
    text-align: left;
  }
}

/* USPS Master */
.usps-master-main {
  width: 100%;
  max-width: 1540px;
  margin: 0 auto;
  padding: 28px 32px 52px;
}

.usps-master-topbar {
  align-items: flex-start;
  margin-bottom: 18px;
}

.page-kicker {
  display: block;
  margin-bottom: 5px;
  color: #178551;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.usps-memory-badge,
.usps-result-badge,
.usps-history-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-weight: 850;
  white-space: nowrap;
}

.usps-memory-badge {
  padding: 9px 14px;
  border: 1px solid #a7d9bd;
  background: #eaf8f0;
  color: #126d40;
  font-size: 0.82rem;
}

.usps-rule-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  margin-bottom: 20px;
  border: 1px solid #d6e2ef;
  border-radius: 14px;
  background: #d6e2ef;
  box-shadow: 0 10px 28px rgba(20, 52, 85, 0.06);
}

.usps-rule-card > div {
  display: grid;
  gap: 5px;
  padding: 17px 19px;
  background: #ffffff;
}

.usps-rule-card strong {
  color: #12345b;
  font-size: 0.9rem;
}

.usps-rule-card span {
  color: #61758d;
  font-size: 0.8rem;
  line-height: 1.45;
}

.dhl-period-card {
  margin-bottom: 20px;
  padding: 20px;
  border: 1px solid #cbdced;
  border-radius: 14px;
  background: #f8fbff;
  box-shadow: 0 10px 28px rgba(20, 52, 85, 0.06);
}

.dhl-period-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.dhl-period-heading h2 {
  margin: 3px 0 0;
  color: #102a4f;
  font-size: 1.12rem;
}

.dhl-period-heading p {
  margin: 5px 0 0;
  color: #61758d;
  font-size: 0.82rem;
}

.dhl-period-suggested {
  padding: 7px 11px;
  border-radius: 999px;
  background: #e8f1ff;
  color: #205bc3;
  font-size: 0.76rem;
  font-weight: 850;
}

.dhl-period-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(170px, 1fr) minmax(170px, 1fr) minmax(260px, 1.6fr);
  gap: 14px;
  margin-top: 17px;
  align-items: end;
}

.dhl-period-controls label {
  display: grid;
  gap: 6px;
}

.dhl-period-controls label > span {
  color: #49647f;
  font-size: 0.76rem;
  font-weight: 800;
}

.dhl-period-controls select,
.dhl-period-controls input {
  min-height: 42px;
  width: 100%;
  padding: 0 11px;
  border: 1px solid #c9d8e8;
  border-radius: 9px;
  background: #ffffff;
  color: #17375e;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 750;
}

.dhl-period-controls input:read-only {
  background: #f1f5f9;
  color: #45627e;
}

.dhl-period-status {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 9px 12px;
  border: 1px solid #a7d9bd;
  border-radius: 9px;
  background: #eaf8f0;
  color: #126d40;
  font-size: 0.8rem;
  font-weight: 800;
}

.dhl-period-warnings {
  margin: 16px 0;
  padding: 15px 18px;
  border: 1px solid #efcf8b;
  border-radius: 12px;
  background: #fff8e7;
  color: #704d00;
}

.dhl-period-warnings > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.dhl-period-warnings ul {
  margin: 10px 0 0 20px;
  padding: 0;
  font-size: 0.82rem;
  line-height: 1.55;
}

.usps-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.usps-upload-card,
.usps-results,
.usps-history-panel {
  border: 1px solid #d7e2ee;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(20, 52, 85, 0.08);
}

.usps-upload-card {
  position: relative;
  padding: 24px;
}

.usps-upload-card h2,
.usps-results h2,
.usps-history-panel h2 {
  margin: 0;
  color: #102a4f;
}

.usps-upload-card h2 {
  padding-right: 46px;
  font-size: 1.18rem;
}

.usps-upload-card p,
.usps-panel-head p,
.usps-results-head p {
  margin: 6px 0 0;
  color: #677b91;
  line-height: 1.45;
}

.usps-upload-card p {
  min-height: 2.3em;
  font-size: 0.85rem;
}

.usps-step {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #e8f1ff;
  color: #205bc3;
  font-weight: 900;
}

.usps-drop-zone {
  min-height: 155px;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 20px;
  border: 2px dashed #aac4e1;
  border-radius: 13px;
  background: #f6faff;
  color: #61758d;
  cursor: pointer;
  text-align: center;
  transition: border-color 140ms ease, background 140ms ease, transform 140ms ease;
}

.usps-drop-zone:hover,
.usps-drop-zone.dragging {
  border-color: #2765d4;
  background: #edf5ff;
  transform: translateY(-1px);
}

.usps-upload-card.has-file .usps-drop-zone {
  border-style: solid;
  border-color: #65bd89;
  background: #f1fbf5;
}

.usps-drop-zone input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.usps-drop-zone strong {
  color: #174f92;
  font-size: 0.95rem;
}

.usps-drop-zone span:not(.usps-upload-icon) {
  font-size: 0.8rem;
}

.usps-upload-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #2d68d5;
  color: #ffffff;
  font-size: 1.4rem;
  font-weight: 900;
}

.usps-file-selection {
  min-height: 20px;
  margin-top: 12px;
  color: #6a7d91;
  font-size: 0.8rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.usps-upload-card.has-file .usps-file-selection {
  color: #147547;
}

.usps-action-bar,
.usps-download-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.usps-action-bar {
  margin: 18px 0;
  padding: 17px 20px;
  border: 1px solid #d7e2ee;
  border-radius: 13px;
  background: #ffffff;
}

.usps-action-bar > div,
.usps-download-panel > div {
  display: grid;
  gap: 4px;
}

.usps-action-bar strong,
.usps-download-panel strong {
  color: #17375e;
}

.usps-action-bar span,
.usps-download-panel span {
  color: #6b7e93;
  font-size: 0.8rem;
}

.usps-action-buttons {
  display: flex;
  align-items: center;
  gap: 10px;
}

.usps-reset-button {
  min-height: 43px;
  padding: 0 18px;
  border: 1px solid #c7d4e2;
  border-radius: 10px;
  background: #ffffff;
  color: #34516f;
  font-weight: 850;
}

.usps-reset-button:hover:not(:disabled) {
  border-color: #8fa8c1;
  background: #f3f7fb;
}

.usps-reset-button:disabled {
  color: #9aa9b9;
  background: #f4f6f8;
  cursor: not-allowed;
}

.usps-primary-button {
  min-height: 43px;
  padding: 0 20px;
  border: 0;
  border-radius: 10px;
  background: #2864d7;
  color: #ffffff;
  font-weight: 850;
  box-shadow: 0 7px 16px rgba(40, 100, 215, 0.2);
}

.usps-primary-button:hover:not(:disabled) {
  background: #1f53ba;
}

.usps-primary-button:disabled {
  background: #aab8ca;
  box-shadow: none;
  cursor: not-allowed;
}

.usps-message {
  margin-bottom: 18px;
  padding: 13px 16px;
  border: 1px solid #bdd2ea;
  border-radius: 11px;
  background: #edf5ff;
  color: #1d518b;
  font-weight: 700;
}

.usps-message.success {
  border-color: #a9d8bc;
  background: #edf9f2;
  color: #116c40;
}

.usps-message.danger {
  border-color: #efb3b3;
  background: #fff0f0;
  color: #a42b2b;
}

.usps-results,
.usps-history-panel {
  margin-top: 20px;
  padding: 24px;
}

.usps-results-head,
.usps-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.usps-results-head h2,
.usps-history-panel h2 {
  font-size: 1.3rem;
}

.usps-result-badge {
  padding: 8px 12px;
  background: #eaf8f0;
  color: #137044;
  font-size: 0.78rem;
}

.usps-result-badge.warning {
  background: #fff4d8;
  color: #8a5b00;
}

.usps-result-badge.danger {
  background: #ffe7e7;
  color: #a02727;
}

.usps-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 11px;
  margin-top: 20px;
}

.usps-kpi {
  min-height: 100px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 15px;
  border: 1px solid #dce6f0;
  border-radius: 12px;
  background: #f8fafc;
}

.usps-kpi span,
.usps-kpi small {
  color: #667a91;
  font-size: 0.76rem;
  font-weight: 750;
}

.usps-kpi strong {
  color: #15355c;
  font-size: 1.55rem;
}

.usps-kpi.success {
  border-color: #bde1cb;
  background: #f2fbf6;
}

.usps-kpi.warning {
  border-color: #ead29a;
  background: #fffaec;
}

.usps-kpi.danger {
  border-color: #efbaba;
  background: #fff3f3;
}

.usps-issue-panel {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid #e1e8f0;
}

.usps-panel-head h3 {
  margin: 0;
  color: #17375e;
}

.usps-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 24px;
  margin-left: 7px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #fff2d7;
  color: #8b5b00;
  font-size: 0.75rem;
  vertical-align: middle;
}

.usps-count-badge.danger {
  background: #ffe5e5;
  color: #a32929;
}

.usps-table-wrap {
  margin-top: 13px;
  overflow: auto;
  border: 1px solid #dde6ef;
  border-radius: 11px;
}

.usps-review-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.usps-review-table th,
.usps-review-table td {
  padding: 11px 13px;
  border-bottom: 1px solid #e5ebf2;
  text-align: left;
  vertical-align: top;
}

.usps-review-table th {
  background: #f3f7fb;
  color: #425b77;
  font-size: 0.73rem;
  text-transform: uppercase;
}

.usps-review-table td strong,
.usps-review-table td span {
  display: block;
}

.usps-review-table td span {
  margin-top: 3px;
  color: #8c5050;
  font-size: 0.75rem;
}

.usps-empty-row td {
  padding: 22px;
  color: #6a7d92;
  text-align: center;
}

.usps-table-note {
  margin: 10px 2px 0;
  color: #6a7d92;
  font-size: 0.78rem;
}

.usps-download-panel {
  flex-wrap: wrap;
  margin-top: 22px;
  padding: 18px;
  border-radius: 12px;
  background: #eff6ff;
}

.usps-reconciliation-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
  padding: 18px;
  border: 1px solid #d9e4ef;
  border-radius: 12px;
  background: #f8fafc;
}

.usps-reconciliation-panel h3,
.usps-reconciliation-panel p {
  margin: 0;
}

.usps-reconciliation-panel p {
  margin-top: 5px;
  color: #667a91;
  font-size: 0.84rem;
}

.usps-report-button {
  flex: 0 0 auto;
}

.usps-acknowledge {
  flex: 1 0 100%;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding-bottom: 14px;
  border-bottom: 1px solid #d0def0;
  color: #3f5874;
  cursor: pointer;
}

.usps-acknowledge input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.usps-history-list {
  margin-top: 16px;
  border: 1px solid #dde6ef;
  border-radius: 12px;
  overflow: hidden;
}

.usps-history-row {
  display: grid;
  grid-template-columns: 1fr 1.4fr 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 13px 15px;
  border-bottom: 1px solid #e4ebf2;
}

.usps-history-row:last-child {
  border-bottom: 0;
}

.usps-history-row > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.usps-history-row strong {
  color: #18395f;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.usps-history-row span {
  color: #6c7f93;
  font-size: 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.usps-history-status {
  padding: 6px 9px;
  background: #eaf8f0;
  color: #147446 !important;
}

.usps-history-status.failed {
  background: #ffeaea;
  color: #a32929 !important;
}

.usps-history-empty {
  padding: 22px;
  color: #6a7d92;
  text-align: center;
}

@media (max-width: 1100px) {
  .usps-rule-card {
    grid-template-columns: 1fr;
  }

  .usps-kpi-grid {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
  }

  .usps-history-row {
    grid-template-columns: 1fr 1fr;
  }

  .dhl-period-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .usps-master-main {
    padding: 20px 16px 40px;
  }

  .usps-upload-grid,
  .usps-kpi-grid {
    grid-template-columns: 1fr;
  }

  .dhl-period-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .dhl-period-suggested {
    align-self: flex-start;
  }

  .dhl-period-controls {
    grid-template-columns: 1fr;
  }

  .usps-action-bar,
  .usps-download-panel,
  .usps-reconciliation-panel,
  .usps-results-head,
  .usps-panel-head {
    align-items: stretch;
    flex-direction: column;
  }

  .usps-primary-button {
    width: 100%;
  }

  .usps-action-buttons {
    width: 100%;
    flex-direction: column-reverse;
  }

  .usps-reset-button {
    width: 100%;
  }

  .usps-history-row {
    grid-template-columns: 1fr;
  }
}

/* Open Trucks: additive regional view of the same Open Loads feed used on the main board. */
.open-trucks-page .open-truck-market-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(310px, 360px);
  align-items: stretch;
  min-width: 0;
}

.open-trucks-page .open-truck-market-trucks {
  min-width: 0;
  border-right: 1px solid #dfe7f2;
}

.open-trucks-page .open-truck-market-loads-slot {
  position: relative;
  min-width: 0;
  min-height: 0;
}

.open-trucks-page .open-truck-regional-loads {
  position: static;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: visible;
  background: #f8fbff;
}

.open-trucks-page .open-truck-regional-loads-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 48px;
  padding: 8px 11px;
  border-bottom: 1px solid #dfe7f2;
  background: #eef5ff;
}

.open-trucks-page .open-truck-regional-loads-head div {
  display: grid;
  gap: 1px;
}

.open-trucks-page .open-truck-regional-loads-head strong {
  color: #163b7a;
  font-size: 13px;
}

.open-trucks-page .open-truck-regional-loads-head small {
  color: #64748b;
  font-size: 10.5px;
  font-weight: 700;
}

.open-trucks-page .open-truck-regional-cutoff {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 5px;
  color: #42526e;
  font-size: 10.5px;
  font-weight: 800;
}

.open-trucks-page .open-truck-regional-cutoff select {
  min-width: 92px;
  height: 27px;
  padding: 3px 22px 3px 7px;
  border: 1px solid #bdd0eb;
  border-radius: 7px;
  background: #fff;
  color: #173c72;
  font: inherit;
  cursor: pointer;
}

.open-trucks-page .open-truck-regional-loads-head > span {
  display: inline-grid;
  min-width: 27px;
  height: 27px;
  place-items: center;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.open-trucks-page .open-truck-regional-load-list {
  display: grid;
  flex: 1 1 auto;
  grid-auto-rows: max-content;
  align-content: start;
  gap: 7px;
  min-height: 0;
  padding: 9px;
  max-height: 720px;
  overflow: auto;
}

/* When a truck search narrows the left side, keep every load from that truck's
   region visible on the right and let the page provide the scrollbar. */
.open-trucks-page .open-truck-market-group.is-truck-search-active .open-truck-market-loads-slot {
  min-height: max-content;
}

.open-trucks-page .open-truck-market-group.is-truck-search-active .open-truck-regional-loads {
  position: static;
  overflow: visible;
}

.open-trucks-page .open-truck-market-group.is-truck-search-active .open-truck-regional-load-list {
  flex: 0 1 auto;
  overflow: visible;
}

.open-trucks-page .open-truck-regional-load-card {
  display: grid;
  width: 100%;
  overflow: hidden;
  border: 1px solid #d8e3f1;
  border-left: 4px solid #2563eb;
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  font: inherit;
  text-align: left;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.04);
}

.open-trucks-page .open-truck-regional-load-card[draggable="true"] {
  cursor: grab;
}

.open-trucks-page .open-truck-regional-load-card[draggable="true"]:active {
  cursor: grabbing;
}

.open-trucks-page .open-truck-regional-load-card.is-dragging {
  opacity: 0.5;
}

.open-trucks-page .open-truck-regional-load-card:hover {
  border-color: #93b4e7;
  background: #f7faff;
}

.open-trucks-page .open-truck-regional-load-details {
  display: grid;
  gap: 3px;
  width: 100%;
  padding: 9px 10px 7px;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.open-trucks-page .open-truck-regional-load-card b {
  overflow: hidden;
  color: #14213d;
  font-size: 11.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-trucks-page .open-truck-regional-load-details > span,
.open-trucks-page .open-truck-regional-load-details em {
  overflow: hidden;
  color: #64748b;
  font-size: 10.5px;
  font-style: normal;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-trucks-page .open-truck-regional-load-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.open-trucks-page .open-truck-regional-load-topline strong {
  color: #173f91;
  font-size: 14px;
}

.open-trucks-page .open-truck-regional-load-meta {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
}

.open-trucks-page .open-truck-regional-load-meta .open-load-brokerage-badge {
  overflow: visible;
  color: #8a4b00;
  font-size: 8px;
  font-weight: 900;
  text-overflow: clip;
}

.open-trucks-page .open-truck-regional-load-topline small {
  color: #64748b;
  font-size: 10.5px;
  font-weight: 800;
}

.open-trucks-page .open-truck-regional-load-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px 7px 10px;
  border-top: 1px solid #edf2f8;
}

.open-trucks-page .open-truck-regional-load-actions > span {
  color: #7b8799;
  font-size: 9.5px;
  font-weight: 800;
}

.open-trucks-page .open-truck-regional-load-actions > button {
  min-height: 27px;
  padding: 4px 10px;
  border: 1px solid #b9cff2;
  border-radius: 7px;
  background: #eef5ff;
  color: #1d4ed8;
  font-size: 10.5px;
  font-weight: 900;
  cursor: pointer;
}

.open-trucks-page .open-truck-card.is-load-drop-zone {
  transition: background 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.open-trucks-page .open-truck-card.is-load-drop-target {
  z-index: 2;
  background: #e7f1ff;
  box-shadow: inset 0 0 0 3px #2563eb, 0 8px 18px rgba(37, 99, 235, 0.18);
  transform: translateY(-1px);
}

.open-truck-assignment-panel {
  width: min(620px, calc(100vw - 28px));
}

.open-truck-assignment-lane {
  margin: -4px 0 16px;
  color: #475569;
  font-weight: 800;
}

.open-truck-assignment-select {
  display: grid;
  gap: 7px;
}

.open-truck-assignment-select > span {
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.open-truck-assignment-select select {
  min-height: 44px;
  padding: 8px 11px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #fff;
  color: #0f172a;
  font: inherit;
}

.open-truck-assignment-help {
  margin: 10px 0 0;
  color: #64748b;
  font-size: 12px;
}

.open-truck-assignment-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0;
}

.open-truck-assignment-summary > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid #dce6f2;
  border-radius: 9px;
  background: #f8fafc;
}

.open-truck-assignment-summary span {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.open-truck-assignment-summary strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-truck-assignment-summary strong.is-missing {
  color: #9a3412;
}

.open-truck-assignment-notice {
  margin: 10px 0 16px;
  padding: 11px 12px;
  border: 1px solid #bbddc8;
  border-radius: 9px;
  background: #effaf3;
  color: #166534;
  font-size: 12px;
  font-weight: 800;
}

.open-truck-assignment-notice.is-error {
  border-color: #fecaca;
  background: #fff1f2;
  color: #b42318;
}

.open-trucks-page .open-truck-regional-load-empty {
  padding: 20px 10px;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

.open-trucks-page .open-truck-regional-load-empty.is-error {
  color: #b42318;
}

@media (max-width: 1500px) {
  .open-trucks-page .open-truck-market-columns {
    grid-template-columns: 1fr;
  }

  .open-trucks-page .open-truck-market-trucks {
    border-right: 0;
    border-bottom: 1px solid #dfe7f2;
  }

  .open-trucks-page .open-truck-market-loads-slot {
    position: static;
  }

  .open-trucks-page .open-truck-regional-loads {
    position: static;
    overflow: visible;
  }

  .open-trucks-page .open-truck-regional-load-list {
    flex: 0 1 auto;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    max-height: 720px;
  }
}

/* Open Trucks: mapped Samsara HOS is informational and does not affect eligibility. */
.open-trucks-page .open-truck-main {
  grid-template-columns: 96px minmax(150px, 0.78fr) minmax(150px, 0.82fr) minmax(205px, 1.08fr) minmax(195px, 1fr) minmax(150px, 0.78fr);
}

.open-trucks-page .open-truck-card:not(.is-connection) .open-truck-note-card {
  grid-column: span 2;
}

.open-trucks-page .open-truck-drivers-hos {
  display: grid;
  align-content: center;
  gap: 5px;
  min-width: 0;
  padding: 7px 10px;
  border-right: 1px solid #e2e8f0;
  background: #fbfdff;
}

.open-trucks-page .open-truck-driver-hos {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1px 7px;
  min-width: 0;
  padding-bottom: 4px;
  border-bottom: 1px dashed #dbe5f1;
  text-align: left;
}

.open-trucks-page .open-truck-driver-hos:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.open-trucks-page .open-truck-driver-hos strong {
  grid-column: 1 / -1;
  overflow: hidden;
  color: #13213b;
  font-size: 11px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.open-trucks-page .open-truck-driver-hos span {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.open-trucks-page .open-truck-driver-hos span b {
  color: #64748b;
  font-size: 9.5px;
  text-transform: uppercase;
}

.open-trucks-page .open-truck-driver-hos em {
  color: #059669;
  font-size: 14px;
  line-height: 1;
  font-style: normal;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.open-trucks-page .open-truck-driver-hos em.is-zero {
  color: #e11d48;
}

.open-trucks-page .open-truck-driver-hos.is-unavailable {
  grid-template-columns: 1fr;
}

.open-trucks-page .open-truck-driver-hos.is-unavailable span {
  color: #94a3b8;
}

.open-trucks-page .open-truck-detail-hos {
  margin-top: 7px;
}

.open-trucks-page.open-truck-density-compact .open-truck-main {
  grid-template-columns: 78px minmax(138px, 0.72fr) minmax(145px, 0.78fr) minmax(205px, 1.12fr) minmax(195px, 1.02fr) minmax(140px, 0.7fr);
}

.open-trucks-page.open-truck-density-compact .open-truck-drivers-hos {
  min-height: 60px;
  padding: 5px 8px;
  gap: 3px;
}

.open-trucks-page.open-truck-density-compact .open-truck-driver-hos {
  gap: 0 5px;
  padding-bottom: 2px;
}

.open-trucks-page.open-truck-density-compact .open-truck-driver-hos strong {
  font-size: 9.5px;
}

.open-trucks-page.open-truck-density-compact .open-truck-driver-hos span {
  font-size: 10px;
}

.open-trucks-page.open-truck-density-compact .open-truck-driver-hos span b {
  font-size: 8.5px;
}

.open-trucks-page.open-truck-density-compact .open-truck-driver-hos em {
  font-size: 12px;
}

/* Open Trucks v195: make connection travel timing visible inside the next-load card. */
.open-trucks-page .open-truck-next-load-travel {
  display: grid;
  width: 100%;
  gap: 3px;
  margin-top: 4px;
  padding-top: 5px;
  border-top: 1px solid #efd69f;
}

.open-trucks-page .open-truck-next-load-travel > span {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
}

.open-trucks-page .open-truck-next-load-travel small {
  color: #8a5a10;
  font-size: 9.5px;
  font-weight: 900;
  white-space: nowrap;
}

.open-trucks-page .open-truck-next-load-travel strong {
  color: #7c2d12;
  font-size: 11.5px;
  font-weight: 900;
  line-height: 1.15;
  white-space: nowrap;
}

.open-trucks-page.open-truck-density-compact .open-truck-next-load-travel {
  gap: 2px;
  margin-top: 2px;
  padding-top: 3px;
}

.open-trucks-page.open-truck-density-compact .open-truck-next-load-travel small {
  font-size: 8.5px;
}

.open-trucks-page.open-truck-density-compact .open-truck-next-load-travel strong {
  font-size: 10px;
}

@media (max-width: 1100px) {
  .open-trucks-page .open-truck-main,
  .open-trucks-page.open-truck-density-compact .open-truck-main {
    grid-template-columns: 90px minmax(150px, 1fr) minmax(170px, 1fr);
  }

  .open-trucks-page .open-truck-card:not(.is-connection) .open-truck-note-card {
    grid-column: auto;
  }
}

/* Preloaded trailers Phase 1 */
.preload-main { min-width: 0; }
.preload-topbar { align-items: center; gap: 24px; }
.preload-topbar p { margin: 6px 0 0; color: #5a6b85; }
.preload-message { margin: 0 24px 14px; padding: 14px 18px; border-radius: 14px; font-weight: 700; }
.preload-message.warning { background: #fff7d6; color: #775a00; border: 1px solid #f0d56b; }
.preload-message.error { background: #fff0f0; color: #9d2020; border: 1px solid #f0aaaa; }
.preload-safety-note { margin: 0 24px 16px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; background: #eef7ff; border: 1px solid #c7ddf6; border-radius: 16px; color: #234a75; }
.preload-source-tabs { display: flex; gap: 10px; margin: 0 24px 16px; overflow-x: auto; }
.preload-source-tabs button { min-width: 190px; padding: 14px 18px; border: 1px solid #d8e1ed; border-radius: 14px; background: #fff; text-align: left; cursor: pointer; }
.preload-source-tabs button.is-active { border-color: #2865e8; box-shadow: inset 0 0 0 1px #2865e8; background: #f2f7ff; }
.preload-source-tabs span { display: block; font-weight: 900; font-size: 18px; color: #13243d; }
.preload-source-tabs small { display: block; margin-top: 4px; text-transform: capitalize; color: #66758b; }
.preload-source-tabs .source-ok { color: #0d8a4b; }
.preload-source-tabs .source-error { color: #bd2d2d; }
.preload-kpis { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 12px; margin: 0 24px 16px; }
.preload-kpis button { padding: 16px; display: flex; align-items: center; gap: 12px; border: 1px solid #d8e1ed; border-radius: 16px; background: #fff; cursor: pointer; color: #263750; }
.preload-kpis button.is-active { border-color: #2865e8; background: #f2f7ff; }
.preload-kpis strong { font-size: 26px; color: #11243f; }
.preload-kpis span { font-weight: 800; }
.preload-panel { margin: 0 24px 28px; background: #fff; border: 1px solid #d8e1ed; border-radius: 18px; overflow: hidden; box-shadow: 0 12px 28px rgba(30,57,91,.06); }
.preload-toolbar { padding: 16px 18px; display: flex; justify-content: space-between; gap: 20px; align-items: end; border-bottom: 1px solid #e5ebf2; }
.preload-toolbar label { display: flex; flex-direction: column; gap: 6px; flex: 1; max-width: 620px; font-weight: 800; color: #42536b; }
.preload-toolbar input { padding: 12px 14px; border: 1px solid #cad6e4; border-radius: 12px; font: inherit; }
.preload-last-check { display: flex; flex-direction: column; text-align: right; color: #607089; }
.preload-last-check strong { color: #2a3c56; }
.preload-table-wrap { overflow: auto; }
.preload-table { width: 100%; min-width: 1300px; border-collapse: collapse; }
.preload-table th { padding: 13px 14px; text-align: left; font-size: 13px; color: #5c6c82; background: #f7f9fc; border-bottom: 1px solid #dde5ef; white-space: nowrap; }
.preload-table td { padding: 14px; vertical-align: middle; border-bottom: 1px solid #e8edf3; color: #1e2f47; }
.preload-table td small { display: block; color: #718097; margin-top: 3px; }
.preload-state { display: inline-block; padding: 7px 10px; border-radius: 999px; font-weight: 900; font-size: 12px; white-space: nowrap; }
.preload-state.loading { background: #fff2a8; color: #6e5500; }
.preload-state.ready { background: #d9f7e7; color: #087240; }
.preload-state.matched { background: #dce9ff; color: #164fa8; }
.preload-state.review { background: #ffe1d1; color: #9a3f0a; }
.preload-state.complete { background: #f0e8ff; color: #6541a5; }
.preload-state.missing { background: #e6e9ee; color: #556174; }
.preload-progress { width: 90px; height: 9px; overflow: hidden; border-radius: 999px; background: #e9eef4; margin-bottom: 4px; }
.preload-progress span { display: block; height: 100%; background: #60b348; border-radius: inherit; }
.preload-empty { padding: 35px !important; text-align: center !important; color: #69788e !important; }
.muted { color: #758399; }
@media (max-width: 1050px) {
  .preload-kpis { grid-template-columns: repeat(2,minmax(150px,1fr)); }
  .preload-toolbar { align-items: stretch; flex-direction: column; }
  .preload-last-check { text-align: left; }
}

/* Preloaded trailers Phase 2 — informational cards only */
.schedule-modern-page .load-card.preload-temporary-card,
.schedule-modern-page .panel-card.preload-temporary-card {
  border: 1px solid #dca900;
  border-left: 5px solid #d18b00;
  background: linear-gradient(135deg, #fff7bf, #ffe576);
  color: #3f3100;
  cursor: default;
  box-shadow: 0 5px 14px rgba(151, 105, 0, .15);
}

.schedule-modern-page .load-card.preload-temporary-card b,
.schedule-modern-page .panel-card.preload-temporary-card b {
  color: #795400;
  font-size: 10px;
  letter-spacing: .02em;
}

.schedule-modern-page .load-card.preload-temporary-card span,
.schedule-modern-page .panel-card.preload-temporary-card span {
  color: #2d2507;
  font-weight: 900;
}

.schedule-modern-page .load-card.preload-temporary-card small,
.schedule-modern-page .panel-card.preload-temporary-card small,
.schedule-modern-page .panel-card.preload-temporary-card em {
  color: #6b5410;
}
.dedicated-route-strip {
  margin: 0 0 12px;
  padding: 12px;
  border: 1px solid #d6c45a;
  border-radius: 12px;
  background: #fffceb;
}

.dedicated-route-strip-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  color: #544700;
}

.dedicated-route-strip-heading span {
  font-size: 12px;
}

.dedicated-route-strip-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
}

.dedicated-route-pending-card,
.dedicated-route-card {
  border: 2px dashed #b79b00 !important;
  background: #fff9c9 !important;
  color: #413800 !important;
  text-align: left;
}

.dedicated-route-pending-card {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border-radius: 9px;
  cursor: pointer;
}

.dedicated-route-pending-card span,
.dedicated-route-pending-card small,
.dedicated-route-card span,
.dedicated-route-card small {
  display: block;
}

.dedicated-route-pending-card.matched,
.dedicated-route-card.matched {
  border-color: #16885b !important;
  background: #e8fff3 !important;
  color: #064d32 !important;
}

.dedicated-route-pending-card.conflict,
.dedicated-route-card.conflict {
  border-color: #c73535 !important;
  background: #fff0f0 !important;
  color: #721c24 !important;
}

.dedicated-route-actions {
  flex-wrap: wrap;
}

/* Dedicated route workspace */
.dedicated-route-summary {
  min-height: 42px;
  margin: 0 0 10px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid #d8e1ed;
  border-left: 5px solid #c59c00;
  border-radius: 10px;
  background: #fffdf3;
  color: #47566d;
  font-size: 12px;
}

.dedicated-route-summary div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 14px;
}

.dedicated-route-summary strong { color: #1b2f4a; font-size: 14px; }
.dedicated-route-summary .to-dispatch { color: #6545ad; font-weight: 900; }
.dedicated-route-summary a { color: #1458c4; font-weight: 900; white-space: nowrap; }

.dedicated-routes-main { min-width: 0; }
.dedicated-routes-header { align-items: center; }
.dedicated-routes-header p { margin: 5px 0 0; color: #64748b; }

.dedicated-route-explainer {
  margin: 0 24px 16px;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid #d5c9f0;
  border-left: 5px solid #7a57c8;
  border-radius: 14px;
  background: #f6f1ff;
  color: #4f3b78;
}

.dedicated-route-explainer strong { color: #402b70; white-space: nowrap; }
.dedicated-route-lane-tabs {
  margin: 0 24px 12px;
  padding: 5px;
  display: flex;
  width: fit-content;
  gap: 5px;
  border: 1px solid #dbe3ed;
  border-radius: 12px;
  background: #fff;
}
.dedicated-route-lane-tabs button { min-height: 36px; border: 0; border-radius: 8px; background: transparent; color: #52627a; font-weight: 900; }
.dedicated-route-lane-tabs button.active { background: #1458c4; color: #fff; box-shadow: 0 4px 10px rgba(20, 88, 196, .2); }
.brokered-dedicated-badge { display: block; width: fit-content; margin-top: 5px; padding: 3px 6px; border-radius: 999px; background: #d9f7f4; color: #08706e; font-size: 10px; font-weight: 900; white-space: nowrap; }
.dedicated-route-controls {
  margin: 0 24px 16px;
  padding: 14px 16px;
  display: flex;
  align-items: end;
  gap: 14px;
  border: 1px solid #dbe3ed;
  border-radius: 14px;
  background: #fff;
}

.dedicated-route-controls label {
  display: grid;
  gap: 6px;
  color: #52627a;
  font-size: 12px;
  font-weight: 900;
}

.dedicated-route-controls input,
.dedicated-route-controls select,
.dedicated-route-table select {
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #cbd6e3;
  border-radius: 9px;
  background: #fff;
  color: #1d2d44;
  font: inherit;
}

.dedicated-route-controls select { min-width: 220px; }
.dedicated-route-kpis {
  margin: 0 24px 16px;
  display: grid;
  grid-template-columns: repeat(6, minmax(135px, 1fr));
  gap: 10px;
}

.dedicated-route-kpis article {
  min-height: 76px;
  padding: 13px 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid #dbe3ed;
  border-radius: 13px;
  background: #fff;
  color: #52627a;
  font-weight: 800;
}

.dedicated-route-kpis strong { color: #172b47; font-size: 28px; }
.dedicated-route-kpis .waiting { border-left: 5px solid #c3a200; }
.dedicated-route-kpis .needs-truck { border-left: 5px solid #e28116; }
.dedicated-route-kpis .carrier-confirmed { border-left: 5px solid #0f8b8d; }
.dedicated-route-kpis .to-dispatch { border-left: 5px solid #7a57c8; }
.dedicated-route-kpis .dispatched { border-left: 5px solid #178a56; }
.dedicated-route-kpis .closed { border-left: 5px solid #8995a5; }

.dedicated-route-workspace {
  margin: 0 24px 28px;
  overflow: hidden;
  border: 1px solid #dbe3ed;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(27, 52, 88, .07);
}

.dedicated-route-panel-head {
  padding: 16px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  border-bottom: 1px solid #e4eaf1;
}

.dedicated-route-panel-head h2,
.dedicated-route-panel-head p { margin: 0; }
.dedicated-route-panel-head p,
.dedicated-route-panel-head > span { margin-top: 4px; color: #728097; font-size: 12px; }
.dedicated-route-message { margin: 12px 18px 0; padding: 10px 12px; border-radius: 9px; background: #e8f8ef; color: #096b3d; font-weight: 800; }
.dedicated-route-message.error { background: #fff0f0; color: #a22626; }
.dedicated-route-table-wrap { overflow: auto; }
.dedicated-route-table { width: 100%; min-width: 1120px; border-collapse: collapse; }
.dedicated-route-table th { padding: 12px 14px; text-align: left; background: #f7f9fc; color: #5e6d82; font-size: 12px; white-space: nowrap; }
.dedicated-route-table td { padding: 13px 14px; vertical-align: middle; border-top: 1px solid #e8edf3; color: #1d2d44; }
.dedicated-route-table td strong,
.dedicated-route-table td span,
.dedicated-route-table td small { display: block; }
.dedicated-route-table td span,
.dedicated-route-table td small { margin-top: 3px; color: #718097; font-size: 12px; }
.dedicated-route-table select { width: 160px; }
.dedicated-route-status { display: inline-block !important; width: fit-content; padding: 7px 10px; border-radius: 999px; font-size: 11px !important; font-weight: 900; text-transform: uppercase; }
.dedicated-route-status.waiting { background: #fff5bd; color: #715900; }
.dedicated-route-status.needs-truck { background: #ffe7cc; color: #914a00; }
.dedicated-route-status.to-dispatch { background: #eadfff; color: #5e3da7; }
.dedicated-route-status.dispatched { background: #d9f7e7; color: #087240; }
.dedicated-route-status.carrier-confirmed { background: #d9f7f4; color: #08706e; }
.dedicated-route-status.closed { background: #e9edf2; color: #5d6979; }
.dedicated-route-status.error { background: #ffe0e0; color: #a12323; }
.dedicated-route-warning { color: #b12626 !important; font-weight: 800; }
.dedicated-route-row-actions { white-space: nowrap; }
.dedicated-route-row-actions button { margin: 2px 4px 2px 0; }
.dedicated-route-empty { padding: 34px !important; text-align: center; color: #738197 !important; }

@media (max-width: 1050px) {
  .dedicated-route-kpis { grid-template-columns: repeat(2, minmax(145px, 1fr)); }
  .dedicated-route-controls { align-items: stretch; flex-direction: column; }
  .dedicated-route-controls input,
  .dedicated-route-controls select { width: 100%; }
  .dedicated-route-explainer { align-items: flex-start; flex-direction: column; gap: 5px; }
}

.dedicated-rotation-weeks { padding: 0 18px 18px; }
.dedicated-carrier-group { margin-top: 16px; overflow: hidden; border: 1px solid #cfe0e2; border-radius: 14px; background: #fff; }
.dedicated-carrier-group > header { padding: 13px 15px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #eef9f8; border-bottom: 1px solid #d5e9e7; }
.dedicated-carrier-group > header h3 { margin: 3px 0 0; color: #153e4a; }
.dedicated-carrier-group > header span { color: #0f7779; font-size: 11px; font-weight: 900; text-transform: uppercase; }
.dedicated-carrier-group > header > strong { color: #0b686a; }
.dedicated-carrier-list { display: grid; }
.dedicated-carrier-leg { padding: 12px 14px; display: grid; grid-template-columns: 130px 1fr 150px minmax(210px, 1fr) 175px auto; align-items: center; gap: 12px; border-top: 1px solid #e4eeee; }
.dedicated-carrier-leg:first-child { border-top: 0; }
.dedicated-carrier-leg > div { min-width: 0; }
.dedicated-carrier-leg strong,
.dedicated-carrier-leg span { display: block; }
.dedicated-carrier-leg > div > span:not(.dedicated-route-status) { margin-top: 3px; color: #718097; font-size: 11px; }
.dedicated-rotation-week { padding-top: 16px; }
.dedicated-rotation-week + .dedicated-rotation-week { margin-top: 18px; border-top: 2px solid #e5ebf2; }
.dedicated-rotation-week h3 { margin: 0 0 10px; color: #253a56; }
.dedicated-rotation-grid { display: grid; grid-template-columns: repeat(2, minmax(420px, 1fr)); gap: 14px; }
.dedicated-rotation-card { overflow: hidden; border: 1px solid #d8e1ec; border-radius: 14px; background: #fbfcfe; }
.dedicated-rotation-card.is-filtered,
.dedicated-rotation-leg.is-filtered { display: none; }
.dedicated-rotation-card > header { padding: 14px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid #dfe6ef; background: #f3f7fc; }
.dedicated-rotation-card > header > div:first-child { display: grid; gap: 3px; }
.dedicated-rotation-name { color: #1e5eaf; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .03em; }
.dedicated-rotation-card header small { color: #6c7b90; }
.dedicated-rotation-assignment { display: flex; align-items: end; gap: 8px; }
.dedicated-rotation-assignment label,
.dedicated-rotation-leg-truck label { display: grid; gap: 4px; color: #596981; font-size: 11px; font-weight: 900; }
.dedicated-rotation-assignment select,
.dedicated-rotation-leg-truck select { min-height: 36px; padding: 7px 9px; border: 1px solid #cbd6e3; border-radius: 8px; background: #fff; color: #1d2d44; }
.dedicated-rotation-leg-list { display: grid; }
.dedicated-rotation-leg { padding: 11px 12px; display: grid; grid-template-columns: 82px minmax(135px, .8fr) minmax(360px, 2fr) minmax(125px, .7fr) auto; align-items: center; gap: 10px; border-top: 1px solid #e5eaf1; background: #fff; }
.dedicated-rotation-leg:first-child { border-top: 0; }
.dedicated-rotation-leg-time,
.dedicated-rotation-leg-route,
.dedicated-rotation-leg-truck,
.dedicated-rotation-leg-status { min-width: 0; }
.dedicated-rotation-leg-time strong,
.dedicated-rotation-leg-time span,
.dedicated-rotation-leg-route strong,
.dedicated-rotation-leg-route span,
.dedicated-rotation-leg-truck strong,
.dedicated-rotation-leg-truck span,
.dedicated-rotation-leg-status small { display: block; }
.dedicated-rotation-leg-time span,
.dedicated-rotation-leg-route span,
.dedicated-rotation-leg-truck span,
.dedicated-rotation-leg-status small { margin-top: 3px; color: #718097; font-size: 11px; }
.dedicated-rotation-leg-truck { display: flex; align-items: end; flex-wrap: wrap; gap: 5px; }
.dedicated-leg-resource-grid { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(150px, 1fr)); gap: 6px; }
.dedicated-rotation-leg-truck .dedicated-leg-resource-grid select { width: 100%; }
.dedicated-rotation-leg-truck button { min-height: 34px; padding: 6px 8px; font-size: 11px; }

@media (max-width: 1500px) {
  .dedicated-rotation-grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .dedicated-rotation-card > header { align-items: stretch; flex-direction: column; }
  .dedicated-rotation-assignment { align-items: stretch; flex-direction: column; }
  .dedicated-rotation-leg { grid-template-columns: 90px 1fr; }
  .dedicated-rotation-leg-truck,
  .dedicated-rotation-leg-status,
  .dedicated-rotation-leg .dedicated-route-row-actions { grid-column: 2; }
  .dedicated-leg-resource-grid { grid-template-columns: 1fr; }
  .dedicated-carrier-leg { grid-template-columns: 1fr 1fr; }
  .dedicated-route-lane-tabs { width: auto; overflow-x: auto; }
}

/* Final Schedule alignment: keep every cell card readable and centered. */
body.schedule-modern-page .cell > .load-card,
body.schedule-modern-page .cell > .last-location,
body.schedule-modern-page .cell > .moved-location-marker,
body.schedule-modern-page .cell > .truck-status-card,
body.schedule-modern-page .cell > .home-reset-card,
body.schedule-modern-page .cell > .schedule-note-card {
  text-align: center;
  justify-items: center;
}

body.schedule-modern-page .cell > .load-card > b,
body.schedule-modern-page .cell > .load-card > span,
body.schedule-modern-page .cell > .load-card > small,
body.schedule-modern-page .cell > .last-location > b,
body.schedule-modern-page .cell > .last-location > span,
body.schedule-modern-page .cell > .last-location > small,
body.schedule-modern-page .cell > .moved-location-marker > b,
body.schedule-modern-page .cell > .moved-location-marker > span,
body.schedule-modern-page .cell > .moved-location-marker > small,
body.schedule-modern-page .cell > .truck-status-card > b,
body.schedule-modern-page .cell > .truck-status-card > span,
body.schedule-modern-page .cell > .truck-status-card > small,
body.schedule-modern-page .cell > .home-reset-card > b,
body.schedule-modern-page .cell > .home-reset-card > span,
body.schedule-modern-page .cell > .home-reset-card > small {
  width: 100%;
  text-align: center;
}

body.schedule-modern-page .cell > .resource {
  text-align: center;
  justify-content: center;
  justify-items: center;
}

body.schedule-modern-page .cell > .resource .resource-driver-name {
  text-align: center;
}

/* Shared JITC calendar standard */
.jitc-calendar-native,
input[data-calendar-range-end] { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; border: 0 !important; white-space: nowrap !important; }
.jitc-calendar-field { display: block; min-width: 150px; }
.jitc-calendar-range-field { display: grid; grid-template-columns: 42px minmax(150px, 1fr) 42px; gap: 8px; align-items: center; }
.jitc-calendar-shift { width: 42px; height: 42px; padding: 0; border: 1px solid #cbd8e7; border-radius: 11px; background: #fff; color: #174f9e; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 2px rgba(18,44,78,.04); }
.jitc-calendar-shift svg { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; }
.jitc-calendar-shift:hover,.jitc-calendar-shift:focus-visible { border-color: #2870e8; box-shadow: 0 0 0 3px rgba(40,112,232,.13); outline: none; }
.jitc-calendar-trigger { width: 100%; min-height: 42px; padding: 10px 42px 10px 13px; border: 1px solid #cbd8e7; border-radius: 11px; background: #fff; color: #6b7a90; font: inherit; font-weight: 700; text-align: left; cursor: pointer; position: relative; box-shadow: 0 1px 2px rgba(18,44,78,.04); }
.jitc-calendar-trigger::after { content: "▦"; position: absolute; right: 13px; top: 50%; transform: translateY(-50%); color: #57749a; font-size: 17px; }
.jitc-calendar-trigger:hover,.jitc-calendar-trigger:focus-visible { border-color: #2870e8; box-shadow: 0 0 0 3px rgba(40,112,232,.13); outline: none; }
.jitc-calendar-trigger.has-value { color: #12243d; }
.jitc-calendar-trigger:disabled { cursor: not-allowed; opacity: .72; background: #f3f6fa; box-shadow: none; }
.jitc-calendar-popover { position: fixed; z-index: 10050; max-width: calc(100vw - 24px); border: 1px solid #d5e0ec; border-radius: 18px; background: rgba(255,255,255,.98); box-shadow: 0 24px 70px rgba(20,45,78,.22); backdrop-filter: blur(18px); overflow: hidden; }
.jitc-calendar-popover[hidden] { display: none !important; }
.jitc-calendar-head { min-height: 48px; padding: 10px 14px 9px 20px; border-bottom: 1px solid #e6edf5; display: flex; align-items: center; justify-content: space-between; color: #132640; }
.jitc-calendar-head strong { font-size: 14px; letter-spacing: .01em; }
.jitc-calendar-head button { width: 32px; height: 32px; border: 0; border-radius: 9px; background: transparent; color: #5b6d85; font-size: 24px; cursor: pointer; }
.jitc-calendar-head button:hover { background: #edf3fb; }
.jitc-calendar-body { display: grid; grid-template-columns: minmax(0,1fr) 168px; }
.jitc-calendar-main { position: relative; padding: 18px 42px 22px; min-width: 0; }
.jitc-calendar-months { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px; }
.jitc-calendar-month h3 { margin: 0 0 13px; color: #132640; text-align: center; font-size: 14px; }
.jitc-calendar-weekdays,.jitc-calendar-days { display: grid; grid-template-columns: repeat(7,minmax(28px,1fr)); }
.jitc-calendar-weekdays span { padding: 5px 0 8px; color: #7a8799; font-size: 11px; font-weight: 800; text-align: center; }
.jitc-calendar-days button { height: 35px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #283a53; font: inherit; font-size: 12px; cursor: pointer; position: relative; }
.jitc-calendar-days button:hover { background: #eaf2ff; border-radius: 9px; }
.jitc-calendar-days button.outside { color: #a9b3c1; }
.jitc-calendar-days button.today { box-shadow: inset 0 0 0 1px #2b6ee8; border-radius: 9px; }
.jitc-calendar-days button.in-range { background: #dce9ff; color: #164eaa; }
.jitc-calendar-days button.selected { background: #1768dd; color: #fff; font-weight: 900; border-radius: 9px; box-shadow: 0 5px 12px rgba(23,104,221,.22); }
.jitc-calendar-nav { position: absolute; top: 15px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 9px; background: transparent; color: #23415f; display: inline-flex; align-items: center; justify-content: center; font-size: 25px; line-height: 1; text-align: center; cursor: pointer; }
.jitc-calendar-nav:hover { background: #edf3fb; }
.jitc-calendar-nav.previous { left: 8px; }
.jitc-calendar-nav.next { right: 8px; }
.jitc-calendar-presets { padding: 14px 10px; border-left: 1px solid #e6edf5; background: #f8fafd; display: flex; flex-direction: column; gap: 4px; }
.jitc-calendar-presets button { padding: 11px 12px; border: 0; border-radius: 10px; background: transparent; color: #365475; font: inherit; font-size: 13px; font-weight: 750; text-align: left; cursor: pointer; }
.jitc-calendar-presets button:hover { background: #e7f0ff; color: #1657b8; }
@media (max-width: 720px) {
  .jitc-calendar-body { grid-template-columns: 1fr; }
  .jitc-calendar-main { padding: 15px 35px 18px; }
  .jitc-calendar-months { grid-template-columns: 1fr; }
  .jitc-calendar-months .jitc-calendar-month:nth-child(2) { display: none; }
  .jitc-calendar-presets { border-left: 0; border-top: 1px solid #e6edf5; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .jitc-calendar-presets button { text-align: center; }
}
.positioning-needs-panel {
  margin: 14px 0;
  padding: 16px;
  border: 1px solid #d7e1ef;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(20, 44, 78, 0.06);
}

.positioning-schedule-panel {
  margin: 8px 0;
  padding: 10px 14px;
}

.positioning-schedule-panel .positioning-needs-head {
  margin-bottom: 8px;
}

.positioning-schedule-panel .positioning-needs-list {
  grid-template-columns: repeat(auto-fit, minmax(260px, 360px));
}

.positioning-needs-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.positioning-needs-head h2 {
  margin: 0 0 3px;
  color: #071a3a;
  font-size: 18px;
}

.positioning-needs-head span {
  color: #52647c;
  font-size: 13px;
}

.positioning-needs-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px;
}

.positioning-need-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 13px;
  border: 1px solid #e0a227;
  border-left: 5px solid #e28a00;
  border-radius: 12px;
  background: #fff7df;
  color: #071a3a;
  text-align: left;
  cursor: pointer;
}

.positioning-need-card:hover,
.positioning-need-card:focus-visible {
  border-color: #2563eb;
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.14);
  outline: none;
}

.positioning-need-card.priority-high {
  border-left-color: #ef6c00;
}

.positioning-need-card.priority-urgent {
  border-color: #ef4444;
  border-left-color: #c81e1e;
  background: #fff0f0;
}

.positioning-need-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.positioning-need-badges b {
  padding: 3px 7px;
  border-radius: 999px;
  background: #dbeafe;
  color: #174ea6;
  font-size: 10px;
}

.positioning-need-badges .needs-load {
  background: #fee2e2;
  color: #b91c1c;
}

.positioning-need-badges .booked {
  background: #dcfce7;
  color: #16733b;
}

.positioning-need-card strong,
.positioning-need-card small,
.positioning-need-card em {
  overflow: hidden;
  text-overflow: ellipsis;
}

.positioning-need-card small {
  color: #354a66;
}

.positioning-need-card em {
  color: #7a4d00;
  font-size: 12px;
  font-style: normal;
}

.positioning-candidate {
  font-weight: 700;
  color: #0b63ce !important;
}

.positioning-warning {
  color: #b91c1c !important;
  font-weight: 800;
}

.positioning-need-modal {
  width: min(920px, calc(100vw - 32px));
}

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

.positioning-form-grid label,
.positioning-link-row label {
  display: grid;
  gap: 5px;
  color: #31445e;
  font-size: 12px;
  font-weight: 700;
}

.positioning-form-grid input,
.positioning-form-grid select,
.positioning-form-grid textarea,
.positioning-link-row input {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid #cad7e8;
  border-radius: 8px;
  background: #fff;
  color: #071a3a;
}

.positioning-form-grid textarea {
  min-height: 78px;
  resize: vertical;
}

.positioning-form-grid .wide {
  grid-column: span 2;
}

.positioning-next-load-lookup {
  display: flex;
  align-items: end;
  gap: 10px;
  grid-column: 1 / -1 !important;
}

.positioning-next-load-lookup label {
  flex: 1;
}

.positioning-next-load-lookup button,
.positioning-link-row button,
.positioning-match-preview button {
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid #1d5fd1;
  border-radius: 9px;
  background: #2563eb;
  color: #fff;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.positioning-form-grid input[readonly] {
  background: #edf4fb;
  color: #27415f;
}

.positioning-form-grid .positioning-repeat-week {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 10px 12px;
  border: 1px solid #cfe0f2;
  border-radius: 10px;
  background: #f6faff;
}

.positioning-form-grid .positioning-repeat-week input {
  width: 18px;
  min-height: 18px;
  height: 18px;
  margin: 0;
  flex: 0 0 auto;
}

.positioning-repeat-week span {
  display: grid;
  gap: 2px;
}

.positioning-repeat-week small {
  color: #56708f;
  font-weight: 500;
}

.positioning-derived-summary,
.positioning-match-preview {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #b9d8ff;
  border-radius: 10px;
  background: #eef7ff;
  color: #27415f;
  font-size: 12px;
}

.positioning-derived-summary {
  grid-column: 1 / -1 !important;
}

.positioning-derived-summary b,
.positioning-match-preview b,
.positioning-match-preview strong {
  color: #071a3a;
}

.positioning-departure-deadline {
  color: #9a4d00;
  font-weight: 800;
}

.positioning-match-preview {
  margin-top: 12px;
  border-color: #7ed3a2;
  background: #effbf4;
}

.positioning-match-preview[hidden] {
  display: none;
}

.positioning-match-valid {
  color: #08783c;
  font-weight: 800;
}

.positioning-match-preview button {
  justify-self: start;
  border-color: #118347;
  background: #159653;
}

.positioning-current-status,
.positioning-link-row {
  display: flex;
  align-items: end;
  gap: 10px;
  margin-top: 14px;
  padding: 12px;
  border-radius: 10px;
  background: #f3f7fc;
}

.positioning-current-status {
  align-items: center;
  flex-wrap: wrap;
}

.positioning-current-status b {
  color: #174ea6;
}

.positioning-current-status span {
  color: #52647c;
}

.positioning-link-row label {
  flex: 1;
}

.load-card.positioning-schedule-card {
  border-color: #e28a00;
  background: #ffe1a6;
  color: #201000;
}

.load-card.positioning-schedule-card .needs-load {
  color: #bd1717;
}

.load-card.positioning-schedule-card.move-empty {
  border-color: #7690a8;
  background: #dfe9f2;
  color: #10283c;
}

body.staging-environment {
  padding-top: 42px !important;
}

.staging-environment-banner {
  align-items: center;
  background: #9f1239;
  border-bottom: 3px solid #fda4af;
  color: #fff;
  display: flex;
  font-size: 14px;
  font-weight: 900;
  height: 42px;
  justify-content: center;
  left: 0;
  letter-spacing: 0.04em;
  position: fixed;
  right: 0;
  text-align: center;
  text-transform: uppercase;
  top: 0;
  z-index: 100000;
}

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

@media (max-width: 600px) {
  .positioning-needs-head,
  .positioning-link-row,
  .positioning-next-load-lookup {
    align-items: stretch;
    flex-direction: column;
  }

  .positioning-form-grid {
    grid-template-columns: 1fr;
  }

  .positioning-form-grid .wide {
    grid-column: auto;
  }
}

.nav-access-badge {
  margin-left: auto;
  padding: 2px 7px;
  border: 1px solid rgba(191, 219, 254, 0.32);
  border-radius: 999px;
  background: rgba(219, 234, 254, 0.12);
  color: #bfdbfe;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;
}

body.sidebar-collapsed .nav-access-badge {
  display: none;
}
