/* Version 3.96949: keep hidden desktop columns out of both header and body. */
@media (min-width: 721px) {
  html body #customerServiceDeliveredView .table-section,
  html body #customerServiceDeliveredView .table-scroll {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  html body #customerServiceDeliveredView .table-scroll table {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
  }

  html body #customerServiceDeliveredView .table-scroll thead {
    display: table-header-group !important;
  }

  html body #customerServiceDeliveredView .table-scroll tbody {
    display: table-row-group !important;
    width: auto !important;
  }

  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row {
    display: table-row !important;
    height: 64px !important;
  }

  html body #customerServiceDeliveredView .table-scroll thead > tr > th,
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td {
    display: table-cell !important;
    height: 64px !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 8px 6px !important;
    overflow: hidden !important;
    vertical-align: middle !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    line-height: 1.2 !important;
  }

  html body #customerServiceDeliveredView .desktop-customer-name {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    line-height: inherit !important;
  }

  html body #customerServiceDeliveredView .mobile-customer-route,
  html body #customerServiceDeliveredView .mobile-customer-route span {
    display: none !important;
  }

  html body #customerServiceDeliveredView .timestamp-cell,
  html body #customerServiceDeliveredView .timestamp-cell strong,
  html body #customerServiceDeliveredView .timestamp-cell span {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body #customerServiceDeliveredView .status-pill-select {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 128px !important;
  }

  html body #customerServiceDeliveredView .delivered-load-copy {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(1) { width: 52px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(2) { width: 58px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(3) { width: 132px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(4) { width: 106px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(5) { width: 96px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(6) { width: 96px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(7) { width: 22% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(8) { width: 84px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(9) { width: 16% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(10) { width: 16% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(11) { width: 82px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(12) { width: 60px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(13) { width: 82px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(14) { width: 104px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(15) { width: 72px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(16) { width: 104px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(17) { width: 52px !important; }
}

/* Drop lower-priority data first so the core route columns remain usable. */
@media (min-width: 721px) and (max-width: 2600px) {
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(12),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(13),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(15),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(16) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 2300px) {
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(8),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(11),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(14) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 1500px) {
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(2),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(5) {
    display: none !important;
  }

  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(7) { width: 24% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(9),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(10) { width: 17% !important; }
}

@media (min-width: 721px) and (max-width: 1100px) {
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(1),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(6) {
    display: none !important;
  }

  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(7) { width: 24% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(9),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(10) { width: 16% !important; }
}

@media (min-width: 721px) and (max-width: 1500px) {
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(2),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(5) {
    display: table-cell !important;
  }
}

/* Current 17-column Customer Service Delivered layout. Keep colgroup,
   headers, and body cells synchronized so hidden columns cannot reserve space. */
@media (min-width: 721px) {
  html body #customerServiceDeliveredView .customer-service-delivered-tms-header {
    align-items: center !important;
    display: table-cell !important;
    white-space: nowrap !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-tms-header > span {
    display: inline-block;
    margin-left: 5px;
    vertical-align: middle;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-tms-header button {
    display: inline-grid !important;
    vertical-align: middle;
  }

  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(1) { width: 44px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(2) { width: 76px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(3) { width: 116px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(4) { width: 100px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(5),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(6) { width: 88px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(7) { width: 18% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(9),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(10) { width: 22% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(17) { width: 58px !important; }
}

@media (min-width: 721px) and (max-width: 2600px) {
  html body #customerServiceDeliveredView col:nth-child(12),
  html body #customerServiceDeliveredView col:nth-child(13),
  html body #customerServiceDeliveredView col:nth-child(15),
  html body #customerServiceDeliveredView col:nth-child(16) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 2300px) {
  html body #customerServiceDeliveredView col:nth-child(8),
  html body #customerServiceDeliveredView col:nth-child(11),
  html body #customerServiceDeliveredView col:nth-child(14) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 1500px) {
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(2),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(5) {
    display: table-cell !important;
  }

  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(7) { width: 20% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(9),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(10) { width: 19% !important; }
}

/* The table reset above is intentionally specific; these matching selectors ensure
   optional body cells do not remain after their headers have been removed. */
@media (min-width: 721px) and (max-width: 2600px) {
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(12),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(13),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(15),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(16) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 2300px) {
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(8),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(11),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(14) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 1500px) {
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(2),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(5) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 1100px) {
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(1),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(6) {
    display: none !important;
  }
}

/* Keep the TMS and pickup-date columns available on compact desktop layouts. */
@media (min-width: 721px) and (max-width: 1500px) {
  html body #customerServiceDeliveredView .table-scroll thead > tr > th:nth-child(2),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(2),
  html body #customerServiceDeliveredView .table-scroll thead > tr > th:nth-child(5),
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td:nth-child(5) {
    display: table-cell !important;
  }
}

/* Final 18-column alignment: TMS, Select, Alert, board data, Actions. */
@media (min-width: 721px) {
  html body #customerServiceDeliveredView .table-scroll col {
    display: table-column !important;
  }

  html body #customerServiceDeliveredView .table-scroll thead > tr > th,
  html body #customerServiceDeliveredView .table-scroll tbody > tr.shipment-row > td {
    display: table-cell !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-auto-tms-toggle {
    background: #fff !important;
    border: 1px solid #9fc4d4 !important;
    border-radius: 7px !important;
    color: #28788b !important;
    display: inline-grid !important;
    height: 30px !important;
    min-width: 30px !important;
    place-items: center !important;
    width: 30px !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-auto-tms-toggle svg {
    display: none !important;
    height: 15px !important;
    width: 15px !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-auto-tms-toggle .auto-tms-start-icon {
    display: block !important;
    fill: currentColor !important;
    stroke: none !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-auto-tms-toggle.is-running {
    background: #fff7ed !important;
    border-color: #fb923c !important;
    color: #c2410c !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-auto-tms-toggle.is-running .auto-tms-start-icon {
    display: none !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-auto-tms-toggle.is-running .auto-tms-stop-icon {
    display: block !important;
    fill: currentColor !important;
  }

  html body #customerServiceDeliveredView .delivered-row-alert-actions {
    justify-content: center !important;
  }

  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(1) { width: 58px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(2) { width: 68px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(3) { width: 58px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(4) { width: 116px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(5) { width: 100px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(6),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(7) { width: 88px !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(8) { width: 18% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(10),
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(11) { width: 21% !important; }
  html body #customerServiceDeliveredView .table-scroll :is(th, td):nth-child(18) { width: 58px !important; }
}

@media (min-width: 721px) and (max-width: 2600px) {
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(13),
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(14),
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(16),
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(17) {
    display: none !important;
  }
}

@media (min-width: 721px) and (max-width: 2300px) {
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(9),
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(12),
  html body #customerServiceDeliveredView .table-scroll :is(col, th, td):nth-child(15) {
    display: none !important;
  }
}

/* 3.97215: authoritative delivered-board map. Keep colgroup, headers and rows
   on the same 18-column index after moving Auto TMS to column one. */
@media (min-width: 721px) {
  html body #customerServiceDeliveredView .customer-service-delivered-table col,
  html body #customerServiceDeliveredView .customer-service-delivered-table th,
  html body #customerServiceDeliveredView .customer-service-delivered-table tbody > tr.shipment-row > td {
    display: table-cell !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-table col {
    display: table-column !important;
  }

  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(1) { width: 56px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(2) { width: 64px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(3) { width: 54px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(4) { width: 112px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(5) { width: 94px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(6),
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(7) { width: 84px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(8) { width: 15% !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(10),
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(11) { width: 17% !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(15) { width: 13% !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(17) { width: 124px !important; }
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(18) { width: 58px !important; }

  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(9),
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(12),
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(13),
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(14),
  html body #customerServiceDeliveredView .customer-service-delivered-table :is(col, th, td):nth-child(16) {
    display: none !important;
  }

  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(1),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(2),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(3),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(4),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(5),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(6),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(7),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(8),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(10),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(11),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(15),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(17),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table :is(col, th, td):nth-child(18) {
    display: table-cell !important;
  }

  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(1),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(2),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(3),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(4),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(5),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(6),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(7),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(8),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(10),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(11),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(15),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(17),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table col:nth-child(18) {
    display: table-column !important;
  }
}

/* 3.97218: final row-level override. Older responsive rules target tbody
   cells more specifically than the shared header/body map above. */
@media (min-width: 721px) {
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(1),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(2),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(3),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(4),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(5),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(6),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(7),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(8),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(10),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(11),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(15),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(17),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(18) {
    display: table-cell !important;
  }

  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(9),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(12),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(13),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(14),
  html body #customerServiceDeliveredView .table-scroll .customer-service-delivered-table tbody > tr.shipment-row > td:nth-child(16) {
    display: none !important;
  }
}
