.flow-workspace { padding: 24px; color: #20252b; background: #fff; min-width: 0; }
.flow-workspace table.unloading-review-table { display: table; width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; }
.flow-workspace .unloading-review-table thead { display: table-header-group; }
.flow-workspace .unloading-review-table tbody { display: table-row-group; }
.flow-workspace .unloading-review-table tr { display: table-row; }
.flow-workspace .unloading-review-table th,
.flow-workspace .unloading-review-table td { display: table-cell; min-width: 0; width: auto; height: auto; padding: 10px 8px; white-space: normal; overflow-wrap: anywhere; vertical-align: middle; }
.flow-workspace .unloading-review-table button { max-width: 100%; white-space: normal; padding: 6px 8px; }
.flow-payment-upload { position: relative; min-width: 0; }
.flow-payment-upload[hidden], .flow-payment-preview [hidden] { display: none !important; }
.flow-payment-preview { display: flex; align-items: center; justify-content: center; height: 150px; width: 100%; box-sizing: border-box; border: 1px dashed #8aa7b7; border-radius: 6px; background: #f5f9fb; color: #286e94; overflow: hidden; }
.flow-payment-preview img { width: 100%; height: 100%; object-fit: contain; }
#flow-form .flow-payment-input { position: absolute; bottom: 0; left: 0; width: 100%; height: 150px; opacity: 0; cursor: pointer; }
.flow-payment-upload:focus-within .flow-payment-preview { outline: 2px solid #347da5; outline-offset: 2px; }
.driver-flow-order-details.has-payment-details { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.driver-flow-order-details small { display: block; margin-top: 6px; color: #607080; font-weight: 400; overflow-wrap: anywhere; }
#flow-form:is([data-action="receipt"], [data-action="receipt_return"]) .flow-cargo-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#flow-form .flow-receipt-confirm { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; }
#flow-form .flow-receipt-confirm input { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; }
@media (max-width: 600px) {
  .driver-flow-order-details.has-payment-details,
  #flow-form:is([data-action="receipt"], [data-action="receipt_return"]) .flow-cargo-summary { grid-template-columns: minmax(0, 1fr); }
}
.flow-payment-layout { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.flow-payment-values { display: grid; gap: 14px; min-width: 0; }
.flow-payment-proofs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; min-width: 0; }
.flow-payment-layout .biz-field { margin: 0; min-width: 0; }
#flow-form[data-action="payment_proofs"] .flow-payment-layout { grid-template-columns: minmax(0, 1fr); }
#flow-form:is([data-action="pay"], [data-action="payment_proofs"]) #flow-error:empty { display: none; }
#flow-form:is([data-action="pay"], [data-action="payment_proofs"]) .upload-modal-body { padding: 16px 20px; }
#flow-form:is([data-action="pay"], [data-action="payment_proofs"]) .upload-modal-body > p:first-child { margin: 0 0 12px; overflow-wrap: anywhere; }
#flow-form:is([data-action="pay"], [data-action="payment_proofs"]) .upload-modal-actions { padding: 12px 20px; }
@media (max-width: 600px) {
  .flow-payment-layout { grid-template-columns: minmax(0, 1fr); }
}
.workflow-system.flow-active > .command-panel,
.workflow-system.flow-active .submodule-detail { box-shadow: none; border: 0; border-radius: 0; padding: 0; margin: 0; background: #fff; }
.workflow-system.flow-active #module-grid { display: none; }
#flow-preview-label { background: #e9f1f4; color: #284c60; text-align: center; padding: 6px 16px; font-size: 13px; }
.flow-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 20px 0; flex-wrap: wrap; }
.flow-heading h4 { margin: 0; font-size: 20px; font-weight: 600; }
.flow-heading p { margin: 8px 0 0; color: #626a74; }
.flow-actions { display: flex; flex-wrap: wrap; gap: 8px; }
/* Keep workflow dialog actions outlined, including a lone close button. */
:is(#flow-detail-modal, #flow-exception-modal, #flow-project-modal, #flow-modal, #flow-inspection-confirm, #safety-material-confirm) .upload-modal-actions button {
  appearance: none;
  min-height: 38px;
  padding: 8px 16px;
  border: 1px solid var(--blue);
  border-radius: 6px;
  background: #fff;
  color: var(--blue);
  font: inherit;
  cursor: pointer;
}
:is(#flow-detail-modal, #flow-exception-modal, #flow-project-modal, #flow-modal, #flow-inspection-confirm, #safety-material-confirm) .upload-modal-actions button:hover:not(:disabled) {
  background: #eef6fb;
}
:is(#flow-detail-modal, #flow-exception-modal, #flow-project-modal, #flow-modal, #flow-inspection-confirm, #safety-material-confirm) .upload-modal-actions button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 3px;
}
#flow-detail-modal [data-flow-action="payment_proofs"] {
  appearance: none;
  min-height: 38px;
  max-width: 100%;
  margin-top: 10px;
  padding: 8px 16px;
  border: 1px solid var(--blue);
  border-radius: 6px;
  background: #fff;
  color: var(--blue);
  font: inherit;
  line-height: 1.4;
  cursor: pointer;
}
#flow-detail-modal [data-flow-action="payment_proofs"]:hover { background: #eef6fb; }
#flow-detail-modal [data-flow-action="payment_proofs"]:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.flow-workspace button, .flow-dialog button { border: 1px solid #cdd4d9; background: #fff; color: #26343e; border-radius: 6px; padding: 8px 12px; font-size: 14px; max-width: 100%; white-space: normal; cursor: pointer; }
.flow-workspace button:hover, .flow-dialog button:hover { background: #f0f4f5; }
.flow-workspace [data-flow-action], .flow-dialog button[type="submit"] { background: #edf4f0; color: #215444; border-color: #bfcfc8; }
.flow-workspace button:focus-visible, .flow-dialog button:focus-visible { outline: 2px solid #28758c; outline-offset: 3px; }
.flow-workspace small { display: block; color: #69717b; margin-top: 5px; font-size: 12px; }
.flow-workspace td { overflow-wrap: anywhere; }
.flow-workspace .detail-table { min-width: 600px; }
.flow-list-workspace { padding: 22px 28px 28px; }
.flow-list-workspace .flow-heading { padding: 0 0 14px; margin: 0; border-bottom: 1px solid #e1e5e8; }
.flow-list-workspace .flow-heading h4 { font-size: 18px; color: #20313b; }
.flow-list-workspace .flow-heading p { margin: 4px 0 0; font-size: 13px; color: #69747d; }
.flow-transport-dashboard { margin-top: 14px; }
.flow-dashboard-head { margin-bottom: 10px; }
.flow-dashboard-head h5 { margin: 0; color: #242a30; font-size: 17px; font-weight: 650; }
.flow-dashboard-head p { margin: 4px 0 0; color: #69747d; font-size: 11px; }
.flow-dashboard-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.flow-dashboard-kpi { display: grid; min-height: 104px; padding: 14px 16px; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; align-items: start; border: 1px solid #dfe3e6; border-radius: 8px; background: #fff; box-shadow: 0 2px 8px rgba(35, 50, 59, .05); }
.flow-dashboard-kpi-icon { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 6px; color: #286e94; background: #e7f1f6; font-size: 14px; font-weight: 700; }
.flow-dashboard-kpi.is-dispatch .flow-dashboard-kpi-icon { color: #8b6826; background: #f7eed9; }
.flow-dashboard-kpi.is-active .flow-dashboard-kpi-icon { color: #315f78; background: #e7f0f4; }
.flow-dashboard-kpi.is-complete .flow-dashboard-kpi-icon { color: #2d6a58; background: #e2f1eb; }
.flow-dashboard-kpi > div > span { display: block; color: #69717a; font-size: 12px; }
.flow-dashboard-kpi > div > strong { display: block; margin-top: 8px; color: #20262d; font-size: 25px; font-weight: 650; line-height: 1; }
.flow-dashboard-kpi > div > strong em { margin-left: 4px; color: #737b83; font-size: 11px; font-style: normal; font-weight: 500; }
.flow-dashboard-kpi > div > small { margin-top: 12px; padding-top: 8px; border-top: 1px solid #ededee; color: #858b92; }
.flow-dashboard-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.flow-dashboard-panel { min-width: 0; min-height: 176px; padding: 13px 14px; grid-column: span 3; border: 1px solid #dfe3e6; border-radius: 8px; background: #fff; box-shadow: 0 2px 8px rgba(35, 50, 59, .05); }
.flow-dashboard-panel > header { display: flex; min-height: 37px; align-items: flex-start; justify-content: space-between; gap: 10px; padding-bottom: 9px; border-bottom: 1px solid #ededee; }
.flow-dashboard-panel h6 { margin: 0; color: #242a30; font-size: 13px; font-weight: 650; }
.flow-dashboard-panel header p { margin: 4px 0 0; color: #777f87; font-size: 10px; }
.flow-dashboard-panel header > span { color: #666d75; font-size: 11px; white-space: nowrap; }
.flow-dashboard-trend { grid-column: span 6; }
.flow-trend-chart { display: grid; height: 108px; padding: 12px 3px 0; grid-template-columns: repeat(7, minmax(24px, 1fr)); gap: 7px; align-items: end; }
.flow-trend-chart > div { display: grid; height: 100%; grid-template-rows: 16px 1fr 16px; align-items: end; justify-items: center; }
.flow-trend-chart strong { color: #315f78; font-size: 10px; }
.flow-trend-chart i { width: min(26px, 74%); min-height: 3px; border-radius: 3px 3px 0 0; background: #5c91ad; }
.flow-trend-chart span { color: #7b838a; font-size: 9px; }
.flow-dashboard-share-list { display: grid; gap: 9px; padding-top: 11px; }
.flow-dashboard-share-list button { display: grid; min-height: 0; padding: 0; grid-template-columns: minmax(0, 1fr) 34px; gap: 4px 8px; border: 0; background: transparent; text-align: left; }
.flow-dashboard-share-list button:hover { background: transparent; }
.flow-dashboard-share-list span { display: flex; grid-column: 1 / -1; justify-content: space-between; color: #58636c; font-size: 11px; }
.flow-dashboard-share-list span b { color: #303a41; }
.flow-dashboard-share-list i { height: 5px; overflow: hidden; border-radius: 3px; background: #edf0f2; }
.flow-dashboard-share-list i em { display: block; height: 100%; min-width: 2px; background: #6e9bb2; }
.flow-dashboard-share-list i em.is-dispatch { background: #c59b45; }
.flow-dashboard-share-list i em.is-complete { background: #4b8a76; }
.flow-dashboard-share-list small { margin: 0; color: #747c84; text-align: right; }
.flow-route-list { display: grid; gap: 7px; padding-top: 11px; }
.flow-route-list div { display: grid; padding: 6px 0; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 7px; align-items: center; border-bottom: 1px solid #f0f1f2; }
.flow-route-list div:last-child { border-bottom: 0; }
.flow-route-list b { display: grid; width: 18px; height: 18px; place-items: center; border-radius: 4px; color: #315f78; background: #eaf2f6; font-size: 10px; }
.flow-route-list span { overflow: hidden; color: #48545c; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.flow-route-list strong { color: #303a41; font-size: 11px; }
.flow-route-list p { color: #858d94; font-size: 11px; text-align: center; }
.flow-list-workspace .detail-table-wrap { margin-top: 14px; overflow-x: hidden; }
.flow-dispatch-summary { cursor: pointer; }
.flow-dispatch-summary:hover > td { background: #edf5f8; }
.flow-list-workspace .flow-list-table .flow-dispatch-toggle { border: 0; background: transparent; color: #315f78; padding: 2px; width: 22px; height: 24px; }
.flow-dispatch-toggle:focus-visible { outline: 2px solid #315f78; }
.flow-dispatch-detail { padding: 8px; text-align: left; background: #f7fafb; }
.flow-dispatch-order-status { margin-left: 16px; color: #52616b; }
.flow-member-table { width: 100%; table-layout: fixed; border-collapse: collapse; margin-top: 8px; }
.flow-list-workspace .flow-member-table th { width: auto !important; }
.flow-list-workspace .flow-member-table th,
.flow-list-workspace .flow-member-table td { border: 1px solid #dce3e8; padding: 8px; text-align: left; }
.flow-list-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.flow-list-filters button { min-width: 100px; font-weight: 600; }
.flow-list-filters button { color: #315f78; border-color: #b9d1df; background: #edf5fb; }
.flow-list-filters button.active { color: #fff; border-color: #347da5; background: #347da5; }
.flow-list-workspace .flow-list-table th,
.flow-list-workspace .flow-list-table td {
  min-width: 0;
  padding: 9px 6px;
  text-align: center;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.flow-list-workspace .flow-list-table th { color: #5f6972; background: #f4f5f6; font-weight: 600; }
.flow-list-workspace .flow-list-table td { color: #202b32; }
.flow-list-workspace .flow-list-table small { text-align: center; }
.flow-list-workspace .flow-list-table { width: 100%; min-width: 0; table-layout: fixed; font-size: 12px; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(1) { width: 4%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(2) { width: 15%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(3) { width: 9%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(4) { width: 8%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(5) { width: 14%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(6) { width: 8%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(7) { width: 8%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(8) { width: 7%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(9) { width: 9%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(10) { width: 8%; }
.flow-dispatch-capacity .flow-list-table > thead > tr > th:nth-child(11) { width: 10%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(1) { width: 4%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(2) { width: 14%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(3) { width: 8%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(4) { width: 7%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(5) { width: 13%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(6) { width: 7%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(7) { width: 7%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(8) { width: 6%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(9) { width: 7%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(10) { width: 9%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(11) { width: 10%; }
.flow-waybill-capacity .flow-list-table > thead > tr > th:nth-child(12) { width: 8%; }
.flow-list-workspace .flow-list-table small { display: block; margin-top: 3px; overflow-wrap: anywhere; }
.flow-list-workspace .flow-list-table .flow-stage-badge { min-width: 0; max-width: 100%; padding: 4px 6px; white-space: normal; }
.flow-list-workspace .flow-list-table button { max-width: 100%; padding: 6px 8px; white-space: normal; }
.flow-list-workspace .flow-list-table th:nth-child(1) { width: 4%; }
.flow-list-workspace .flow-list-table th:nth-child(2) { width: 14%; }
.flow-list-workspace .flow-list-table th:nth-child(3) { width: 9%; }
.flow-list-workspace .flow-list-table th:nth-child(4) { width: 9%; }
.flow-list-workspace .flow-list-table th:nth-child(5) { width: 15%; }
.flow-list-workspace .flow-list-table th:nth-child(6) { width: 9%; }
.flow-list-workspace .flow-list-table th:nth-child(7) { width: 8%; }
.flow-list-workspace .flow-list-table th:nth-child(8) { width: 7%; }
.flow-list-workspace .flow-list-table th:nth-child(9) { width: 7%; }
.flow-list-workspace .flow-list-table th:nth-child(10) { width: 10%; }
.flow-list-workspace .flow-list-table th:nth-child(11) { width: 8%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table {
  min-width: 1080px;
  table-layout: fixed;
}
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th,
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table td {
  padding: 10px 7px;
}
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(1) { width: 4%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(2) { width: 16%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(3) { width: 10%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(4) { width: 9%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(5) { width: 11%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(6) { width: 8%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(7) { width: 10%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(8) { width: 10%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(9) { width: 8%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(10) { width: 7%; }
.workflow-system.flow-active .flow-workspace.flow-beidou-workspace .flow-list-table th:nth-child(11) { width: 7%; }
.flow-gps-detail-workspace { padding: 22px 28px 28px; }
.flow-gps-detail-head { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid #e1e5e8; }
.flow-gps-detail-head button { margin-bottom: 12px; }
.flow-gps-detail-head h4 { margin: 0; color: #20313b; font-size: 20px; }
.flow-gps-detail-head p { margin: 5px 0 0; color: #69747d; font-size: 13px; }
.flow-gps-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 18px 0; border: 1px solid #dce2e6; border-radius: 6px; overflow: hidden; }
.flow-gps-facts div { min-height: 70px; padding: 13px 16px; border-right: 1px solid #e2e6e9; border-bottom: 1px solid #e2e6e9; }
.flow-gps-facts div:nth-child(4n) { border-right: 0; }
.flow-gps-facts dt { color: #6a7680; font-size: 12px; }
.flow-gps-facts dd { margin: 6px 0 0; color: #20313b; font-weight: 600; }
.flow-gps-interface { display: grid; min-height: 420px; place-items: center; border: 1px solid #d5dde2; border-radius: 6px; background: #f7f9fa; }
.flow-gps-empty { display: grid; gap: 7px; text-align: center; color: #74808a; }
.flow-gps-empty strong { color: #435661; font-size: 16px; }
.flow-gps-empty span { font-size: 13px; }
.flow-stage-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 64px; padding: 4px 9px; border-radius: 4px; font-size: 13px; font-weight: 600; line-height: 1.3; }
.flow-stage-badge.is-pending { color: #805d0e; background: #fff1c7; }
.flow-stage-badge.is-active { color: #17654f; background: #dcefe6; }
.flow-stage-badge.is-complete { color: #315f78; background: #e1eef5; }
.flow-stage-badge.is-warning { color: #a0393d; background: #f8dddd; }
.flow-stage-badge.is-neutral { color: #59636b; background: #edf0f2; }
.flow-dispatch-stage-stack { display: grid; gap: 6px; justify-items: center; }
.flow-exception-link { padding: 2px 0; border: 0; background: transparent; color: #59636b; font-size: 12px; text-decoration: underline; text-underline-offset: 2px; }
.flow-exception-link.has-pending { color: #a0393d; font-weight: 600; }
.flow-exception-link:hover { background: transparent; color: #244f68; }
.flow-exception-stage,
.flow-exception-stage:hover { padding: 5px 10px; border: 1px solid #e3b7b9; background: #fff4f4; color: #a0393d; text-decoration: none; }
.flow-exception-dialog { width: min(1040px, calc(100vw - 48px)); }
.flow-exception-order-card { margin-bottom: 14px; border: 1px solid #d8e0e5; background: #f7fafb; }
.flow-exception-order-card header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 14px; border-bottom: 1px solid #d8e0e5; background: #eef5f8; }
.flow-exception-order-card header div { display: grid; gap: 3px; }
.flow-exception-order-card header span:not(.flow-stage-badge) { color: #68747d; font-size: 12px; }
.flow-exception-order-card header strong { color: #1f313d; font-size: 16px; }
.flow-exception-order-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; }
.flow-exception-order-card dl div { min-width: 0; padding: 11px 14px; border-right: 1px solid #e1e6e9; border-bottom: 1px solid #e1e6e9; }
.flow-exception-order-card dl div:nth-child(2n) { border-right: 0; }
.flow-exception-order-card dl div:nth-last-child(-n + 2) { border-bottom: 0; }
.flow-exception-order-card dt { margin-bottom: 4px; color: #68747d; font-size: 12px; }
.flow-exception-order-card dd { margin: 0; color: #1f313d; font-weight: 600; overflow-wrap: anywhere; }
.flow-exception-table { min-width: 820px; }
.flow-exception-table th:nth-child(1) { width: 17%; }
.flow-exception-table th:nth-child(2) { width: 14%; }
.flow-exception-table th:nth-child(3) { width: 31%; }
.flow-exception-table th:nth-child(4) { width: 18%; }
.flow-exception-table th:nth-child(5) { width: 20%; }
@media (max-width: 760px) {
  .flow-exception-order-card dl { grid-template-columns: 1fr; }
  .flow-exception-order-card dl div { border-right: 0; }
  .flow-exception-order-card dl div:nth-last-child(2) { border-bottom: 1px solid #e1e6e9; }
}
.flow-row-actions { display: grid; gap: 6px; justify-items: stretch; }
.flow-row-actions button { width: 100%; padding: 7px 6px; }
.flow-row-actions .flow-dispatch-button { color: #fff; border-color: #2c8068; background: #2c8068; }
.flow-row-actions .flow-dispatch-button:hover { border-color: #246c59; background: #246c59; }
.flow-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 24px; margin: 24px 0; }
.flow-facts dt { font-size: 13px; color: #69717b; margin-bottom: 6px; }
.flow-facts dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.flow-section { border-top: 1px solid #e4e6e9; padding-top: 18px; }
.flow-section h5 { font-size: 15px; margin: 0 0 12px; }
.flow-document { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 16px; padding: 12px 0; }
.flow-file { background: #f3f5f7; color: #215c89; border: 1px solid #dce2e7; margin: 0 8px 8px 0; overflow-wrap: anywhere; }
.flow-fold { border-top: 1px solid #e4e6e9; padding: 16px 0; }
.flow-fold summary { cursor: pointer; font-weight: 500; }
.flow-fold p { overflow-wrap: anywhere; }
.flow-history { padding-left: 22px; }
.flow-history li { padding: 8px 0; }
.flow-dialog { width: min(640px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; border-radius: 8px; }
.flow-dialog.is-dispatch { width: min(1080px, calc(100vw - 40px)); }
.flow-dialog.is-finance { width: min(920px, calc(100vw - 32px)); }
.flow-finance-summary { padding-top: 12px; }
.flow-finance-summary .modal-info-table { width: 100%; table-layout: fixed; }
.flow-finance-summary .modal-info-table th { width: 22%; }
.flow-finance-summary .modal-info-table td { width: 28%; }
.flow-finance-summary .modal-info-table th,
.flow-finance-summary .modal-info-table td { padding: 8px 10px; overflow-wrap: anywhere; }
.flow-dialog.is-finance .biz-field-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; align-items: start; margin-top: 12px; }
.flow-dialog.is-finance .biz-field-grid > .biz-field { grid-column: span 4; min-width: 0; gap: 6px; align-content: start; }
.flow-dialog.is-finance .biz-field:has(input:is([name="commission"], [name="toll"], [name="oil"], [name="elec"])) { grid-column: span 3; }
.flow-dialog.is-finance .biz-field:has([name="reason"]) { grid-column: 1 / -1; }
.flow-dialog.is-finance .biz-field input:not([type="file"]) { height: 38px; }
.flow-dialog.is-finance .biz-field input[type="file"] { font-size: 13px; padding: 6px; }
.flow-dialog.is-finance .biz-field button { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .flow-dialog.is-finance .biz-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow-dialog.is-finance .biz-field-grid > .biz-field { grid-column: span 1; }
  .flow-dialog.is-finance .biz-field:has(input:is([name="commission"], [name="toll"], [name="oil"], [name="elec"])) { grid-column: span 1; }
  .flow-dialog.is-finance .biz-field:has(input[type="file"]),
  .flow-dialog.is-finance .biz-field:has([name="reason"]) { grid-column: 1 / -1; }
  .flow-finance-summary .modal-info-table th,
  .flow-finance-summary .modal-info-table td { padding: 6px; font-size: 12px; }
}
.flow-detail-dialog { width: min(960px, 92vw); max-width: 960px; }
.flow-detail-dialog .upload-modal-head > div p { margin: 4px 0 0; color: #64748b; font-size: 12px; }
.flow-detail-dialog .upload-modal-body { max-height: 66vh; overflow: auto; }
.flow-detail-dialog .upload-modal-actions { justify-content: space-between; }
.flow-dialog h3 { font-size: 20px; }
.flow-dialog .biz-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.flow-dialog.is-dispatch .biz-field-grid { display: block; }
.flow-dispatch-order-summary { display: grid; grid-template-columns: 1fr 1fr 1.6fr .8fr .8fr; margin: 0 0 14px; border: 1px solid #b9d1df; border-radius: 6px; background: #f8fbfd; overflow: hidden; }
.flow-dispatch-order-summary > div { min-width: 0; padding: 9px 11px; border-right: 1px solid #dbe6ec; }
.flow-dispatch-order-summary > div:last-child { border-right: 0; }
.flow-dispatch-order-summary .is-waybill { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid #dbe6ec; background: #fff; }
.flow-dispatch-order-summary dt { margin-bottom: 3px; color: #6a7780; font-size: 11px; }
.flow-dispatch-order-summary dd { margin: 0; color: #20313b; font-size: 13px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.flow-dispatch-roster { min-width: 0; }
.flow-dispatch-roster-toolbar { display: flex; margin-bottom: 8px; align-items: center; justify-content: space-between; }
.flow-dispatch-roster-toolbar strong { color: #26343d; font-size: 14px; }
.flow-dispatch-roster-toolbar button { min-height: 32px; padding: 0 12px; }
.flow-dispatch-roster .detail-table-wrap { max-height: 390px; overflow: auto; border: 1px solid #cfd9df; border-radius: 6px; }
.flow-dispatch-roster table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.flow-dispatch-roster th { position: sticky; top: 0; z-index: 1; height: 38px; padding: 0 12px; border-right: 1px solid #d8e0e5; border-bottom: 1px solid #cfd9df; color: #43535d; background: #f1f4f6; font-size: 13px; }
.flow-dispatch-roster td { height: 56px; padding: 6px; border-right: 1px solid #d8e0e5; border-bottom: 1px solid #d8e0e5; }
.flow-dispatch-roster th:last-child, .flow-dispatch-roster td:last-child { border-right: 0; }
.flow-roster-heading { display: flex; align-items: center; justify-content: space-between; gap: 6px 12px; flex-wrap: wrap; padding: 8px 0; }
.flow-roster-heading [aria-live] { font-size: 12px; font-weight: 400; color: #245f80; overflow-wrap: anywhere; text-align: right; margin-left: auto; }
.flow-dispatch-roster tr:last-child td { border-bottom: 0; }
.flow-dispatch-roster-choice { display: flex; width: 100%; min-height: 42px; padding: 7px 10px; align-items: center; justify-content: space-between; border: 1px solid #c8d6de; border-radius: 5px; color: #49606e; background: #fff; }
.flow-dispatch-roster-choice:hover { border-color: #76a9c5; background: #f7fbfd; }
.flow-dispatch-roster-choice.is-selected { border-color: #347da5; color: #245f80; background: #edf6fb; }
.flow-dispatch-roster-choice span { min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
.flow-dispatch-roster-choice small { flex: 0 0 auto; margin-left: 8px; color: #70808a; }
.flow-dispatch-roster-empty { display: flex; min-height: 42px; padding: 0 10px; align-items: center; color: #7a858d; background: #f6f8f9; }
.flow-dispatch-selector-dialog { width: min(1040px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); }
.flow-dispatch-selector-dialog .upload-modal-head { padding: 12px 16px; }
.flow-dispatch-selector-dialog .upload-modal-head p { margin: 4px 0 0; }
.flow-dispatch-selector-dialog .upload-modal-body { max-height: calc(100dvh - 150px); overflow: auto; }
.flow-dispatch-candidates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: stretch; }
.flow-dispatch-candidate { display: block; width: 100%; min-width: 0; padding: 8px 10px; border: 1px solid #dce3e7; border-radius: 6px; background: #fff; cursor: pointer; text-align: left; }
.flow-dispatch-candidate:hover { border-color: #9eb9c8; background: #f8fbfc; }
.flow-dispatch-candidate.is-disabled { background: #f6f7f8; cursor: not-allowed; }
.flow-dispatch-candidate-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.flow-dispatch-candidate-head strong { color: #26343d; font-size: 14px; overflow-wrap: anywhere; }
.flow-dispatch-candidate-head em { padding: 2px 6px; border-radius: 4px; color: #17654f; background: #dcefe6; font-size: 11px; font-style: normal; }
.flow-dispatch-candidate.is-disabled .flow-dispatch-candidate-head em { color: #a0393d; background: #f8dddd; }
.flow-dispatch-qualification { display: block; margin-top: 7px; padding-top: 7px; border-top: 1px solid #e1e6e9; }
.flow-dispatch-qualification dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; margin: 0; }
.flow-dispatch-candidate.is-vehicle .flow-dispatch-qualification dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.flow-dispatch-qualification dl > div { min-width: 0; }
@media (max-width: 700px) {
  .flow-dispatch-candidates { grid-template-columns: minmax(0, 1fr); }
}
.flow-dispatch-qualification dt { margin-bottom: 2px; color: #707a83; font-size: 12px; }
.flow-dispatch-qualification dd { margin: 0; color: #25333c; font-size: 13px; line-height: 1.25; overflow-wrap: anywhere; }
.flow-dispatch-empty { margin: 0; color: #8a939a; font-size: 13px; }
.flow-dispatch-reasons { display: block; margin-top: 8px; color: #a0393d; font-size: 12px; line-height: 1.4; }
.flow-dispatch-not-required { min-height: 92px; padding: 14px; border: 1px dashed #d7dfe3; border-radius: 6px; color: #7a858d; background: #fafbfb; font-size: 13px; }
.flow-dialog input, .flow-dialog select, .flow-dialog textarea { box-sizing: border-box; width: 100%; min-width: 0; }
#flow-error { color: #ad3035; overflow-wrap: anywhere; }
.flow-dialog:has(form[data-action="loading"], form[data-action="unloading"]) { width: min(760px, calc(100vw - 32px)); }
.flow-dialog:has(form[data-action="loading"], form[data-action="unloading"]) .upload-modal-body { padding: 16px 20px; }
.flow-cargo-summary { display: grid; grid-template-columns: 3fr 2fr; margin: 0 0 16px; border: 1px solid #d5dfe5; background: #f7f9fa; }
.flow-cargo-summary > div { min-width: 0; padding: 10px 12px; }
.flow-cargo-summary > div + div { border-left: 1px solid #d5dfe5; }
.flow-cargo-summary dt { font-size: 12px; color: #65727c; margin-bottom: 4px; }
.flow-cargo-summary dd { margin: 0; font-size: 14px; font-weight: 600; color: #26343d; overflow-wrap: anywhere; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field-grid { grid-template-columns: 2fr 1fr; gap: 12px; align-items: start; margin: 0; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field { min-width: 0; gap: 6px; align-content: start; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field:has([name="files"], [name="note"]) { grid-column: 1 / -1; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) input:not([type="file"]) { height: 38px; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) input[type="file"] { height: auto; padding: 8px; font: inherit; font-size: 13px; background: #fff; border: 1px solid #cdd7df; border-radius: 5px; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) input::file-selector-button { padding: 7px 12px; margin-right: 10px; border: 1px solid #347da5; border-radius: 4px; color: #245f80; background: #fff; font: inherit; cursor: pointer; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) textarea { min-height: 72px; height: 72px; padding: 9px 10px; resize: vertical; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) #flow-error:empty { display: none; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .upload-modal-actions { padding: 12px 20px; gap: 10px; }
@media (max-width: 540px) {
  .flow-cargo-summary { grid-template-columns: 1fr; }
  .flow-cargo-summary > div + div { border-left: 0; border-top: 1px solid #d5dfe5; }
}
.flow-load-summary { display: block; padding: 8px 0; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.flow-load-summary.is-overload { color: #b42318 !important; font-weight: 600; }
.flow-load-dashboard { padding: 16px 0; border-top: 1px solid #d5dfe5; }
.flow-load-dashboard h4 { margin: 0 0 12px; font-size: 15px; }
.flow-load-dashboard dl { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; }
.flow-load-dashboard dl > div { padding: 8px 14px; border-left: 1px solid #d5dfe5; min-width: 0; }
.flow-load-dashboard dt { color: #65727c; font-size: 13px; }
.flow-load-dashboard dd { margin: 8px 0 0; font-size: 21px; font-weight: 600; overflow-wrap: anywhere; }
.flow-load-dashboard small { font-size: 12px; margin-left: 5px; font-weight: 400; }
@media (max-width: 800px) { .flow-load-dashboard dl { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; } }
.flow-loading-info h4 { margin: 0 0 8px; font-size: 14px; color: #26343d; }
.flow-loading-info .flow-cargo-summary > div:nth-child(odd) { border-left: 0; }
.flow-loading-info .flow-cargo-summary > div:nth-child(n+3) { border-top: 1px solid #d5dfe5; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field:has([name="quantity"]) { grid-column: 1 / -1; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field:has(input[type="file"]) { grid-column: auto; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) input[type="file"] { height: 38px; padding: 3px; }
#flow-form:is([data-action="loading"], [data-action="unloading"]) input::file-selector-button { padding: 5px 8px; margin-right: 6px; }
@media (max-width: 640px) {
  #flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #flow-form:is([data-action="loading"], [data-action="unloading"]) .biz-field:has(input[type="file"]) { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .flow-workspace { padding: 16px; }
  .flow-list-workspace { padding: 16px; }
  .flow-dashboard-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow-dashboard-grid { grid-template-columns: 1fr; }
  .flow-dashboard-panel, .flow-dashboard-trend { grid-column: 1; }
  .flow-gps-detail-workspace { padding: 16px; }
  .flow-gps-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow-gps-facts div:nth-child(4n) { border-right: 1px solid #e2e6e9; }
  .flow-gps-facts div:nth-child(2n) { border-right: 0; }
  .flow-gps-interface { min-height: 320px; }
  .flow-facts, .flow-dialog .biz-field-grid { grid-template-columns: 1fr; }
  .flow-document { grid-template-columns: 1fr; gap: 8px; }
  .flow-heading { align-items: flex-start; }
  .flow-dispatch-order-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flow-dispatch-order-summary > div { border-bottom: 1px solid #dbe6ec; }
  .flow-dispatch-order-summary > div:nth-child(odd):not(.is-waybill) { border-right: 0; }
  .flow-dispatch-order-summary > div:last-child { border-bottom: 0; }
  .flow-dispatch-roster { overflow-x: auto; }
  .flow-dispatch-roster table { min-width: 660px; }
  .flow-dispatch-candidate.is-vehicle .flow-dispatch-qualification dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.flow-safety-documents { width: 100%; min-width: 700px; table-layout: fixed; }
.flow-safety-documents th:nth-child(1) { width: 32%; }
.flow-safety-documents th:nth-child(2) { width: 22%; }
.flow-safety-documents th:nth-child(3) { width: 16%; }
.flow-safety-documents th:nth-child(4) { width: 30%; }
.flow-safety-documents th, .flow-safety-documents td { overflow-wrap: anywhere; vertical-align: top; padding: 10px; }
.flow-safety-documents button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }

/* Two-level order/project review, matching the document approval work surface. */
.flow-safety-order { width: min(860px, 94vw); }
.flow-safety-order .selected-file { margin-bottom: 8px; }
.flow-project-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.flow-project-table th, .flow-project-table td { padding: 9px 10px; overflow-wrap: anywhere; text-align: left; }
.flow-project-table th:nth-child(1) { width: 23%; }
.flow-project-table th:nth-child(2) { width: 30%; }
.flow-project-table th:nth-child(3) { width: 16%; }
.flow-project-table th:nth-child(4) { width: 16%; }
.flow-project-table th:nth-child(5) { width: 15%; }
.flow-project-dialog { width: min(1000px, 94vw); }
.flow-project-submission { margin-top: 16px; border-top: 1px solid #d7dfe8; padding-top: 12px; }
.flow-project-preview img { display: block; max-width: 100%; max-height: 650px; margin: auto; object-fit: contain; }
.flow-project-preview iframe { width: 100%; height: 520px; border: 0; }
.flow-project-preview { padding: 12px; background: #f6f8fa; min-height: 80px; }
.flow-checklist-scroll { overflow: auto; max-height: 520px; }
.flow-checklist-table { width: 100%; min-width: 730px; border-collapse: collapse; }
.flow-checklist-table th, .flow-checklist-table td { padding: 8px; border: 1px solid #d7dfe8; white-space: normal; }
.flow-project-decision { padding: 12px; margin-top: 10px; background: #f6f8fa; }
#safety-material-confirm { z-index: 1400; }

.flow-safety-order .upload-modal-body, .flow-project-dialog .upload-modal-body { padding: 12px 16px; }
.flow-safety-order .selected-file, .flow-project-dialog .selected-file { padding: 8px 10px; gap: 3px; margin: 0 0 6px; min-height: 0; }
.flow-safety-order .selected-file strong, .flow-project-dialog .selected-file strong { font-size: 13px; }
.flow-safety-order .upload-modal-head .eyebrow, .flow-project-dialog .upload-modal-head .eyebrow { display: block; margin: 0 0 4px; font-size: 12px; }
.flow-safety-order .approval-doc-list { margin-top: 10px; }
.flow-safety-order .flow-safety-summary-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, .6fr); gap: 0; border: 1px solid #d7e1e8; margin: 10px 0 14px; background: #f8fafb; }
.flow-safety-order .flow-safety-summary-row > .selected-file { min-width: 0; min-height: 0; margin: 0; padding: 8px 10px; border: 0; border-right: 1px solid #d7e1e8; border-radius: 0; background: transparent; box-shadow: none; }
.flow-safety-order .flow-safety-summary-row > .selected-file:last-child { border-right: 0; }
.flow-safety-order .flow-safety-summary-row strong { overflow-wrap: anywhere; line-height: 1.4; }
.flow-safety-order .upload-modal-body > .flow-actions:empty { display: none; }
.flow-safety-order .flow-safety-summary-row { margin: 0; }
.flow-safety-order .flow-safety-summary-row + .approval-doc-list { margin-top: 0; }
@media (max-width: 520px) {
  .flow-safety-order .flow-safety-summary-row { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
  .flow-safety-order .flow-safety-summary-row > .selected-file:first-child { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid #d7e1e8; }
}
.flow-safety-order .flow-project-table th, .flow-safety-order .flow-project-table td { padding: 6px 9px; font-size: 13px; }
.flow-project-status { display: inline-block; padding: 2px 5px; background: #f2f4f6; border: 1px solid #d7dfe8; white-space: nowrap; }
.flow-project-dialog .approval-form-grid > .selected-file { grid-column: auto; }
.flow-project-dialog .flow-project-summary-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
  margin-bottom: 8px;
}
.flow-project-dialog .flow-project-summary-grid > .flow-section {
  grid-column: 1 / -1;
  margin: 0;
}
.flow-project-dialog .flow-project-summary-grid > .selected-file {
  margin: 0;
}
.flow-project-dialog .flow-project-summary-grid > .selected-file:first-of-type {
  grid-column: auto;
}
.flow-project-dialog .flow-project-summary-grid > .selected-file:last-child {
  grid-column: auto;
}
.flow-project-dialog .upload-modal-actions .flow-audit-outline,
.flow-project-dialog .upload-modal-actions .flow-audit-outline:first-child,
.flow-project-dialog .upload-modal-actions .flow-audit-outline:last-child {
  border-color: var(--blue);
  background: #fff;
  color: var(--blue);
}
.flow-project-dialog .upload-modal-actions .flow-audit-outline:hover {
  background: #eef6fb;
}

.flow-workspace .biz-analytics-card header small { display: inline; margin-top: 0; margin-left: 3px; font-size: 11px; }

.flow-loading-review-meta, .flow-loading-review-media { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 0 0 16px; }
.flow-loading-review-meta > div { min-width: 0; }
.flow-loading-review-meta dt { color: #657481; font-size: 13px; margin-bottom: 6px; }
.flow-loading-review-meta dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.flow-loading-review-media > section { min-width: 0; }
.flow-loading-review-media h4 { font-size: 14px; margin: 0 0 8px; }
.flow-loading-inline-preview { height: 280px; margin-bottom: 10px; background: #f5f7f9; border: 1px solid #d7e1e8; display: grid; place-items: center; overflow: hidden; }
.flow-loading-inline-preview .flow-loading-preview-button { display: block; width: 100%; height: 100%; padding: 8px; border: 0; border-radius: 0; background: transparent; cursor: zoom-in; }
.flow-loading-inline-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.flow-loading-inline-preview iframe { width: 100%; height: 100%; border: 0; }
.flow-loading-review-status { font-size: 13px; color: #657481; }
@media (max-width: 640px) {
  .flow-loading-review-meta, .flow-loading-review-media { grid-template-columns: minmax(0, 1fr); }
}

.flow-exception-order-card dl.flow-exception-transport-facts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid #d7e1e8;
}
.flow-exception-order-card .flow-exception-transport-facts > div { border-bottom: 0; border-right: 1px solid #d7e1e8; }
.flow-exception-order-card .flow-exception-transport-facts > div:last-child { border-right: 0; }
.flow-exception-transport-facts dd { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .flow-exception-order-card dl.flow-exception-transport-facts { grid-template-columns: 1fr; }
  .flow-exception-order-card .flow-exception-transport-facts > div { border-right: 0; border-bottom: 1px solid #d7e1e8; }
  .flow-project-dialog .flow-project-summary-grid { grid-template-columns: 1fr; }
  .flow-project-dialog .flow-project-summary-grid > .selected-file:first-of-type { grid-column: auto; }
}
.flow-preaudit-workspace .biz-analytics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.flow-preaudit-tabs { display: flex; gap: 24px; margin: 12px 0 16px; border-bottom: 1px solid #d7e1e8; }
.flow-preaudit-tabs [role="tab"] { background: transparent; color: #606d78; border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: 12px 0; font-weight: 600; }
.flow-preaudit-tabs [aria-selected="true"] { color: #28617e; border-bottom-color: #28617e; }
.flow-preaudit-tabs [role="tab"]:focus-visible { outline: 2px solid #28617e; outline-offset: 3px; }
.flow-preaudit-workspace [role="tabpanel"][hidden] { display: none; }
@media (max-width: 1500px) {
  .flow-preaudit-workspace .biz-analytics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .flow-preaudit-workspace .biz-analytics-grid { grid-template-columns: minmax(0, 1fr); }
}
#daily-log-modal .biz-field-grid { grid-template-columns: minmax(120px, 1fr) minmax(0, 3fr); }
#daily-log-modal .biz-field, #daily-log-modal select { min-width: 0; width: 100%; }
#daily-log-modal table { width: 100%; table-layout: fixed; }
#daily-log-modal td { overflow-wrap: anywhere; }
#daily-log-modal button, #daily-log-upload button { border: 1px solid #9dbccc; border-radius: 5px; padding: 8px 14px; background: #f5f9fc; color: #245d79; }
#daily-log-modal .flow-file { max-width: 100%; overflow-wrap: anywhere; }
#daily-log-upload input[type="file"], #daily-log-upload textarea { width: 100%; box-sizing: border-box; }
.log-followup-workspace table, #log-followup-modal table { width: 100%; table-layout: fixed; }
.log-followup-workspace { border: 0; border-radius: 0; box-shadow: none; padding: 16px; }
.log-followup-workspace > [data-log-followup-body] > .biz-field { max-width: 220px; margin-bottom: 12px; }
.log-followup-workspace td, #log-followup-modal td { overflow-wrap: anywhere; }
#log-followup-modal .biz-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 16px; }
#log-followup-modal .biz-field:last-child { grid-column: 1 / -1; }
#log-followup-modal input, #log-followup-modal select, #log-followup-modal textarea { width: 100%; min-width: 0; box-sizing: border-box; }
#log-followup-modal button { border: 1px solid #9dbccc; border-radius: 5px; padding: 8px 14px; background: #f5f9fc; color: #245d79; }
#log-overdue-modal table { width: 100%; table-layout: fixed; margin: 12px 0; }
#log-overdue-modal .upload-modal-body { display: block; padding: 16px; }
#log-overdue-modal .upload-modal-body > p { margin: 8px 0; }
#log-overdue-modal td { overflow-wrap: anywhere; white-space: pre-wrap; }
#log-overdue-modal h4 { font-size: 15px; margin: 16px 0 8px; }
#log-overdue-modal .overdue-fields { border-top: 1px solid #d7e1e8; margin-top: 16px; padding-top: 12px; }
#log-overdue-modal .biz-field { margin-bottom: 12px; }
#log-overdue-modal input, #log-overdue-modal select, #log-overdue-modal textarea { width: 100%; min-width: 0; box-sizing: border-box; }
#log-overdue-modal [hidden] { display: none !important; }
#log-overdue-modal button { border: 1px solid #9dbccc; border-radius: 5px; padding: 8px 14px; background: #f5f9fc; color: #245d79; }
.log-followup-workspace .flow-preaudit-tabs { flex-wrap: wrap; gap: 16px; }
.flow-log-table { grid-column: 1 / -1; min-width: 0; }
.flow-log-table table { width: 100%; min-width: 660px; table-layout: fixed; }
.flow-log-table th:last-child { width: 48px; }
.flow-log-table input { width: 100%; min-width: 0; box-sizing: border-box; }
.flow-log-table > button { margin-top: 10px; }
#flow-modal .flow-dialog.is-driving-log { width: min(1120px, calc(100vw - 32px)); max-width: calc(100vw - 32px); }
#flow-modal .is-driving-log .upload-modal-body { display: block; padding: 16px 20px; }
#flow-modal .is-driving-log .upload-modal-body > p { margin: 0 0 12px; overflow-wrap: anywhere; }
#flow-modal .is-driving-log .biz-field-grid { gap: 12px; }
#flow-modal .is-driving-log .flow-log-table table { width: 100%; min-width: 0; border-collapse: collapse; table-layout: fixed; }
#flow-modal .is-driving-log .flow-log-table th, #flow-modal .is-driving-log .flow-log-table td { padding: 6px; border: 1px solid #d7e1e8; }
#flow-modal .is-driving-log .flow-log-table th { background: #f4f6f8; font-size: 13px; }
#flow-modal .is-driving-log .flow-log-table th:nth-child(2), #flow-modal .is-driving-log .flow-log-table th:nth-child(4) { width: 25%; }
#flow-modal .is-driving-log .flow-log-table th:last-child { width: 44px; }
#flow-modal .is-driving-log .flow-log-table input { display: block; width: 100%; min-width: 0; max-width: 100%; height: 36px; padding: 4px 6px; border: 1px solid #cbd7df; border-radius: 4px; font-size: 13px; }
#flow-modal .is-driving-log #flow-error:empty { display: none; }
@media (max-width: 760px) {
  #flow-modal .is-driving-log .flow-log-table table, #flow-modal .is-driving-log .flow-log-table tbody { display: block; }
  #flow-modal .is-driving-log .flow-log-table thead { display: none; }
  #flow-modal .is-driving-log .flow-log-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin-bottom: 8px; }
  #flow-modal .is-driving-log .flow-log-table td { min-width: 0; }
  #flow-modal .is-driving-log .flow-log-table td::before { display: block; font-size: 12px; margin-bottom: 4px; color: #657481; }
  #flow-modal .is-driving-log .flow-log-table td:nth-child(1)::before { content: "出发地点"; }
  #flow-modal .is-driving-log .flow-log-table td:nth-child(2)::before { content: "出发时间"; }
  #flow-modal .is-driving-log .flow-log-table td:nth-child(3)::before { content: "停车地点"; }
  #flow-modal .is-driving-log .flow-log-table td:nth-child(4)::before { content: "停车时间"; }
  #flow-modal .is-driving-log .flow-log-table td:last-child { grid-column: 1 / -1; text-align: right; }
  #flow-modal .is-driving-log .biz-field-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
  #flow-modal .is-driving-log .flow-log-table tr { grid-template-columns: minmax(0, 1fr); }
}
.log-followup-workspace .biz-analytics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.log-followup-workspace.flow-workspace { border: 0; border-radius: 0; box-shadow: none; padding: 8px 12px; }
@media (max-width: 600px) {
  .log-followup-workspace .biz-analytics-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  #log-followup-modal .biz-field-grid { grid-template-columns: minmax(0, 1fr); }
  #daily-log-modal .biz-field-grid { grid-template-columns: minmax(0, 1fr); }
}
/* The unified audit list must not inherit multi-column upload form layout. */
.material-audit-dialog { width: min(1080px, calc(100vw - 32px)); max-width: 1080px; }
.material-audit-dialog .upload-modal-body { display: block; padding: 20px; overflow: auto; }
.material-audit-dialog .detail-table-wrap { width: 100%; }
.material-audit-dialog .detail-table { width: 100%; border-collapse: collapse; table-layout: auto; }
.material-audit-dialog .detail-table th,
.material-audit-dialog .detail-table td { padding: 10px 12px; border: 1px solid #d8e0e6; text-align: left; vertical-align: middle; overflow-wrap: anywhere; }
.material-audit-dialog .detail-table th { background: #f4f6f8; color: #59656e; }
.material-audit-dialog button { padding: 7px 12px; border: 1px solid #b9cedb; background: #f8fbfd; color: #315f75; border-radius: 4px; font: inherit; cursor: pointer; white-space: nowrap; }
.material-audit-dialog button:hover { background: #e9f1f5; }
.material-audit-dialog button:disabled { opacity: .5; cursor: default; }
.material-audit-dialog .upload-modal-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; }
.material-audit-dialog select { min-height: 36px; padding: 6px 10px; border: 1px solid #bdcdd8; border-radius: 4px; }
.material-audit-dialog .flow-project-preview img { max-width: 100%; height: auto; max-height: 55vh; object-fit: contain; }
.material-audit-dialog .flow-project-preview iframe { width: 100%; height: 55vh; border: 0; }
.material-audit-confirm { max-width: 520px; }
.material-audit-confirm textarea { display: block; box-sizing: border-box; width: 100%; min-height: 96px; margin-top: 8px; border: 1px solid #bdcdd8; border-radius: 4px; padding: 10px; }
@media (max-width: 700px) {
  .material-audit-dialog .detail-table { min-width: 620px; }
  .material-audit-dialog .detail-table-wrap { overflow-x: auto; }
  .material-audit-dialog h3 { overflow-wrap: anywhere; font-size: 18px; }
}
.safety-warning-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 0 0 12px;
  border-bottom: 1px solid #d6e1e7;
  margin-bottom: 16px;
}
.safety-warning-categories button {
  min-height: 38px;
  padding: 8px 18px;
  border: 1px solid transparent;
  border-radius: 4px;
  background: transparent;
  color: #526572;
  font: inherit;
  cursor: pointer;
}
.safety-warning-categories button:hover { background: #f0f5f7; }
.safety-warning-categories button.active {
  background: #e7f0f5;
  border-color: #bdd1dd;
  color: #2f6179;
  font-weight: 600;
}
.safety-warning-categories button:focus-visible { outline: 2px solid #327a9c; outline-offset: 2px; }
#warning-test-modal .upload-modal-card { width: min(920px, calc(100vw - 32px)); }
#warning-test-modal .upload-modal-actions button,
#warning-test-confirm .upload-modal-actions button {
  background: #fff;
  color: #2f6179;
  border: 1px solid #b8cbd7;
  min-height: 36px;
  padding: 8px 16px;
  border-radius: 4px;
}
#warning-test-modal button[type="submit"],
#warning-test-confirm [data-confirm] { background: #2f6179; color: #fff; }
#warning-test-form input, #warning-test-form textarea { width: 100%; min-width: 0; box-sizing: border-box; }
#warning-test-form table { table-layout: fixed; overflow-wrap: anywhere; }
#warning-test-form th { width: 112px; }
#warning-test-form [role="alert"] { color: #a52f39; margin: 8px 0 0; }
@media (max-width: 600px) {
  #warning-test-form th { width: 68px; }
  #warning-test-form th, #warning-test-form td { padding: 8px; }
}
/* Order context stays above each original document, including multi-driver uploads. */
#flow-project-modal .material-order-summary {margin:0 0 12px;font-size:14px;line-height:1.45;}
#flow-project-modal .material-order-summary dl {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;border-top:1px solid #d4dee5;border-left:1px solid #d4dee5;}
#flow-project-modal .material-order-summary dl>div {display:grid;grid-template-columns:88px minmax(0,1fr);min-width:0;border-right:1px solid #d4dee5;border-bottom:1px solid #d4dee5;}
#flow-project-modal .material-order-summary dt {margin:0;padding:7px 10px;background:#f3f6f8;color:#536572;font-weight:500;}
#flow-project-modal .material-order-summary dd {margin:0;padding:7px 10px;overflow-wrap:anywhere;white-space:normal;color:#25343e;}
#flow-project-modal .material-submission-meta {display:flex;flex-wrap:wrap;gap:6px 24px;padding-top:8px;color:#637583;font-size:13px;}
@media(max-width:650px){#flow-project-modal .material-order-summary dl{grid-template-columns:1fr;}}