/* Keep the established GO BIKE form typography and palette. Search results
   are a contact list, not a second modal over the unfinished order. */
.repair-client-picker { display: grid; gap: 12px; }
.repair-client-search { position: relative; }
.repair-client-matches { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 125; max-height: 230px; overflow-y: auto; background: var(--bg-elev, #fff); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 24px #0002; }
.repair-client-matches button { display: grid; gap: 4px; width: 100%; padding: 10px 12px; border: 0; border-bottom: 1px solid var(--line); text-align: left; background: transparent; color: var(--fg); font: inherit; cursor: pointer; }
.repair-client-matches button span { font-size: 12px; color: var(--fg-3); }
.repair-client-matches button:hover, .repair-client-matches button[aria-selected="true"] { background: var(--bg-soft); }
.repair-client-picker input:read-only { background: var(--bg-soft); }
.repair-client-picker input:disabled { opacity: 1; color: var(--fg); }
.repair-client-history { padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.repair-client-history p { font-size: 12px; margin: 10px 0; }
.repair-client-history-scroll { overflow-x: auto; }
.repair-client-history table { width: 100%; border-collapse: collapse; text-align: left; font-size: 12px; }
.repair-client-history th, .repair-client-history td { padding: 8px; border-bottom: 1px solid var(--line); }
.repair-client-history th { color: var(--fg-3); font-weight: 600; }
.repair-client-history-pages { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; font-size: 12px; }
.repair-client-picker button:focus-visible, .repair-client-history button:focus-visible { outline: 2px solid var(--fg); outline-offset: 2px; }
/* The detail card has a narrow organization column. Client history is a
   separate full-width row, not part of that metadata column. */
.repair-order-fullscreen:not(.repair-order-create-dialog) .drawer-body > .repair-client-history {
  grid-column: 1 / -1;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}
.repair-client-history-scroll { min-width: 0; max-width: 100%; }
.repair-client-history table { min-width: 560px; }
.repair-client-history table .btn { white-space: nowrap; }
.repair-client-history-pages > span { white-space: nowrap; }

/* Align the master selector, start button and cancellation by their bottom
   edges; the selector label must not shift the cancellation upward. */
.repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar {
  display: flex;
  height: max-content;
  align-self: start;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}
.repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar:has(.stock-select-field) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}
.repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar .btn,
.repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar .stock-select-trigger {
  box-sizing: border-box;
  height: 38px;
  min-height: 38px;
  margin: 0;
}
@media (max-width: 860px) {
  .repair-order-fullscreen:not(.repair-order-create-dialog) .drawer-body {
    grid-template-columns: minmax(0, 1fr);
  }
  .repair-order-fullscreen:not(.repair-order-create-dialog) .status-stepper-container {
    min-width: 0;
    overflow-x: auto;
  }
}
@media (max-width: 620px) {
  .repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar:has(.stock-select-field) {
    grid-template-columns: minmax(0, 1fr);
  }
  .repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar:has(.stock-select-field) > div {
    grid-template-columns: minmax(0, 1fr);
  }
  .repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar > .repair-cancel-trigger {
    justify-self: start;
  }
  .repair-order-fullscreen:not(.repair-order-create-dialog) .order-action-bar .btn {
    max-width: 100%;
    height: auto;
    white-space: normal;
  }
}
@media (max-width: 600px) { .repair-client-history-pages { flex-wrap: wrap; } }