/* ============================================================================
   Order Management (OMS): module components only. Tokens only (no hex
   values); harness classes are consumed as-is (DESIGN.md rules 1-2).
   ============================================================================ */

.oms-mono { font-family: var(--font-mono); font-size: var(--fs-sm); }
.oms-note { font-size: var(--fs-sm); color: var(--color-label); line-height: var(--lh-base); margin: 0; }
.oms-pad { padding: var(--space-3) 0; }
.oms-wide { grid-column: 1 / -1; }
.oms-host:empty { display: none; }
.oms-warn-text { color: var(--color-warn-text); font-size: var(--fs-sm); }
.oms-link { background: none; border: 0; padding: 0; color: var(--color-accent); cursor: pointer; font: inherit; }
.oms-link:hover { text-decoration: underline; }

/* ---- Orders --------------------------------------------------------------- */
.oms-tab-right { display: inline-flex; align-items: center; gap: var(--space-2); }
.oms-tick { padding: 0; }
.oms-tick-none { display: inline-block; width: 16px; }
.oms-stage-cell { display: inline-flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; }
.oms-reason { font-size: var(--fs-sm); color: var(--color-label); white-space: normal; line-height: var(--lh-tight); }
.oms-reason--cell { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oms-reason--bad { color: var(--color-danger-text); }

/* ---- Source marks ---------------------------------------------------------- */
.oms-origin { display: inline-flex; align-items: center; gap: var(--space-2); min-width: 0; white-space: nowrap; }
.oms-origin-via { font-size: var(--fs-xs); color: var(--color-muted); }
.oms-mark { display: inline-flex; width: 16px; height: 16px; flex: none; }
.oms-mark svg { display: block; }
.oms-mark--icon { align-items: center; justify-content: center; border-radius: var(--radius-input); background: var(--color-surface-alt); color: var(--color-label); }
.oms-mark--icon .icon { width: 12px; height: 12px; }

/* ---- Drawer ---------------------------------------------------------------- */
.oms-kv-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3) var(--space-4); }
.oms-kv { min-width: 0; }
.oms-kv-label { font-size: var(--fs-xs); color: var(--color-muted); margin-bottom: 2px; }
.oms-kv-value { font-size: var(--fs-sm); color: var(--color-text); overflow-wrap: anywhere; }
.oms-fixes { display: flex; flex-direction: column; gap: var(--space-2); }
.oms-fix { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-3); border: 1px solid var(--color-danger-border); border-radius: var(--radius-card); background: var(--color-bg); }
.oms-fix-msg { display: flex; gap: var(--space-2); align-items: flex-start; font-size: var(--fs-sm); color: var(--color-text); line-height: var(--lh-base); }
.oms-fix-msg .icon { color: var(--color-danger-strong); flex: none; margin-top: 2px; }
.oms-fix-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: center; }
.oms-warnings, .oms-issues, .oms-notes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-1); }
.oms-warnings li, .oms-issues li { display: flex; gap: var(--space-2); align-items: flex-start; font-size: var(--fs-sm); color: var(--color-label); line-height: var(--lh-base); }
.oms-warnings .icon { color: var(--color-warn-strong); flex: none; margin-top: 2px; }
.oms-issues .icon { color: var(--color-danger-strong); flex: none; margin-top: 2px; }
.oms-notes li { font-size: var(--fs-sm); color: var(--color-label); }
.oms-peek-banner { padding: var(--space-4) var(--space-5) 0; }
.oms-sent { display: flex; flex-direction: column; gap: 1px; min-width: 150px; }
.oms-sent-k { font-size: var(--fs-xs); color: var(--color-muted); }
.oms-sent-desc { font-size: var(--fs-xs); color: var(--color-label); }

/* ---- Mapping wizard ------------------------------------------------------------ */
.oms-wiz-line { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-3); padding: var(--space-3); border-radius: var(--radius-card); background: var(--color-surface-cream); }
.oms-wiz-h { margin: var(--space-4) 0 var(--space-2); font-size: var(--fs-xs); font-weight: var(--fw-semibold); text-transform: uppercase; letter-spacing: .05em; color: var(--color-label); }
.oms-wiz-list { display: flex; flex-direction: column; gap: var(--space-1); margin-top: var(--space-2); max-height: 260px; overflow: auto; }
.oms-wiz-opt { display: flex; align-items: center; gap: var(--space-3); width: 100%; text-align: left; padding: var(--space-2) var(--space-3); border: 1px solid var(--color-border);
  border-radius: var(--radius-input); background: var(--color-bg); color: var(--color-text); cursor: pointer; font: inherit; }
.oms-wiz-opt:hover { background: var(--color-hover); }
.oms-wiz-opt.is-on { border-color: var(--color-accent); box-shadow: var(--focus-ring); }
.oms-wiz-opt-main { flex: 1; min-width: 0; font-size: var(--fs-sm); }
.oms-wiz-score { font-size: var(--fs-xs); color: var(--color-label); font-variant-numeric: tabular-nums; }
.oms-search-wide { display: block; width: 100%; max-width: 100%; }
.oms-wiz-picked { min-height: 24px; }
.oms-wiz-choice { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-sm); flex-wrap: wrap; }
.oms-wiz-choice .icon { color: var(--color-success-strong); }

/* ---- Release dialog --------------------------------------------------------------- */
.oms-rel { display: flex; flex-direction: column; gap: var(--space-3); }
.oms-rel-sum, .oms-rel-counts { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.oms-rel-chip { padding: var(--space-1) var(--space-3); border-radius: var(--radius-pill); background: var(--color-surface-cream); font-size: var(--fs-sm); }
.oms-rel-count { display: inline-flex; align-items: center; gap: var(--space-1); font-size: var(--fs-sm); }
.oms-rel-prog { padding: var(--space-6) 0; display: flex; justify-content: center; }

/* ---- Import ------------------------------------------------------------------------- */
.oms-import { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-5) 0 var(--space-8); }
.oms-imp-top { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--space-5); align-items: start; }
.oms-imp-zone { display: flex; flex-direction: column; gap: var(--space-2); }
.oms-imp-side { display: flex; flex-direction: column; gap: var(--space-3); }
.oms-imp-btns { display: flex; gap: var(--space-2); justify-content: flex-end; flex-wrap: wrap; }
.oms-imp-out { display: flex; flex-direction: column; gap: var(--space-3); }
.oms-imp-sum { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; }
.oms-imp-orders { display: flex; flex-direction: column; gap: var(--space-3); }
.oms-imp-card { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-bg); }
.oms-imp-card-h { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }

/* ---- Document (PDF) import ------------------------------------------------- */
.oms-doc-text { max-height: 360px; overflow: auto; font-family: var(--font-mono); font-size: var(--fs-xs); line-height: 1.55;
  background: var(--color-surface-cream); border-radius: var(--radius-input); padding: var(--space-2) 0; }
.oms-doc-line { display: flex; gap: var(--space-3); padding: 0 var(--space-3); white-space: pre; }
.oms-doc-page { color: var(--color-muted); border-top: 1px dashed var(--color-border); margin: var(--space-1) 0; }
.oms-doc-no { flex: none; width: 40px; text-align: right; color: var(--color-muted); user-select: none; }
.oms-doc-t { color: var(--color-text); }
.oms-tpl-fields { display: flex; flex-direction: column; gap: var(--space-1); }
.oms-tpl-row { display: grid; grid-template-columns: 170px 130px minmax(0, 1fr); gap: var(--space-2); align-items: center; }
.oms-tpl-k { font-size: var(--fs-sm); color: var(--color-label); }

/* ---- Channels ------------------------------------------------------------------------- */
.oms-ch { padding: var(--space-5) 0 var(--space-8); display: flex; flex-direction: column; gap: var(--space-6); }
.oms-ch-group { display: flex; flex-direction: column; gap: var(--space-3); }
.oms-ch-group-h { display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.oms-ch-group-t { margin: 0; font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--color-text); }
.oms-ch-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--space-3); }
.oms-ch-card { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-bg); }
.oms-ch-card--off { border-style: dashed; }
.oms-ch-card-h { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-3); }
.oms-ch-name { font-size: var(--fs-base); font-weight: var(--fw-semibold); color: var(--color-text); }
.oms-ch-rules { display: flex; flex-direction: column; gap: var(--space-2); }
.oms-ch-rule { display: flex; flex-direction: column; font-size: var(--fs-sm); color: var(--color-text); }
.oms-ch-counts { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.oms-ch-count { display: inline-flex; align-items: center; gap: var(--space-1); background: none; border: 0; padding: 0; cursor: pointer; font: inherit; font-size: var(--fs-sm); color: var(--color-text); }
.oms-ch-notes { border-top: 1px solid var(--color-border-faint); padding-top: var(--space-2); }
.oms-ch-foot { display: flex; gap: var(--space-2); margin-top: auto; }
.oms-switch-row { display: flex; align-items: center; gap: var(--space-3); }
.oms-steps { display: flex; flex-direction: column; gap: var(--space-1); }
.oms-step { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-1) var(--space-2); border: 1px solid var(--color-border-faint); border-radius: var(--radius-input); }
.oms-step .ui-check { flex: 1; }
.oms-step-btns { display: inline-flex; gap: 2px; }

/* ---- Settings ------------------------------------------------------------------------------ */
.oms-settings { padding-top: var(--space-4); }
.oms-events-wrap { display: flex; flex-direction: column; }

@media (max-width: 900px) {
  .oms-kv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oms-imp-top { grid-template-columns: 1fr; }
  .oms-wiz-line { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.oms-code { font-family: var(--font-mono); font-size: var(--fs-sm); font-variant-numeric: tabular-nums; }
