/* Approved Sales register and record-panel values, scoped to this workflow while
   the rest of the workspace design is released independently. The canonical
   values sheet specifies 10px button insets and #f1e9ed record avatars. */
.sales-page, .order-panel:has(.sales-page) {
  --control-height: 28px; --button-height: 28px; --text-body: 13px; --text-ui: 13px; --text-dense: 13px; --text-meta: 12px;
  --title-page: 13px; --title-panel: 16px; --title-section: 13px; --line-title: 20px; --line-panel: 22px;
  --radius: 0px; --radius-control: 0px; --radius-input: 0px; --radius-panel: 0px; --radius-menu: 0px;
  --line: #ececef; --line-soft: #f1f1f3; --input-line: #dedce1; --band: #fafafb; --table-header: #fafafb;
  --private-tint: #f7f6f9; --panel-gutter: 16px; --definition-width: 152px;
  font: 400 13px/20px var(--sans); letter-spacing: -.1px;
}
.sales-page :is(.button, .text-input, .select-input), .order-panel:has(.sales-page) > .order-panel__header .button { min-height: 28px; border-radius: 0; font-size: 13px; }
.sales-page .button, .order-panel:has(.sales-page) > .order-panel__header .button { height: 28px; padding: 0 10px; font-weight: 400; line-height: 13px; }
.sales-page :is(.button--primary, .button--dark) { font-weight: 600; }
.sales-page .button--icon, .order-panel:has(.sales-page) > .order-panel__header .button--icon { width: 28px; padding: 0; }
.sales-page .button--quiet { border-color: transparent; }
.sales-page .button--quiet:hover { background: var(--line-soft); }
.sales-page .button:disabled { opacity: .45; }
.sales-page .text-link, .sales-page .order-panel-back { color: var(--ink); text-decoration: none; }
.sales-page .text-link:hover { background: var(--line-soft); }
.sales-page .text-input:not(textarea), .sales-page .select-input { height: 28px; padding-block: 0; }
.sales-page h2, .sales-page h3 { font-weight: 600; }
.sales-index > .page-header { min-height: 44px; margin: -24px -24px 0; padding: 0 24px; gap: 16px; border-bottom: 1px solid var(--line); flex-wrap: nowrap; }
.sales-index > .page-header h1 { font: 600 13px/20px var(--sans); }
.sales-index > .page-header .page-header__identity { flex: 0 0 auto; min-width: 0; }
.sales-index > .page-header .page-header__actions { flex: 1; min-width: 0; }
.sales-index .sales-toolbar { display: flex; align-items: center; flex: 1; gap: 16px; margin: 0; min-width: 0; flex-wrap: nowrap; }
.sales-index .sales-toolbar .page-tabs { flex: 1; margin: 0; padding: 4px 0; gap: 4px; min-width: 0; }
.sales-index .page-tabs .button--tab { color: var(--muted); background: transparent; border-color: transparent; padding-inline: 8px; }
.sales-index .page-tabs .button--tab[aria-current='page'] { color: var(--ink); background: #efeff1; font-weight: 400; }
.sales-index .page-tabs__count { color: var(--muted); }
.sales-index .sales-toolbar__tools { flex-wrap: nowrap; flex-shrink: 0; }
.sales-index .sales-search { width: 180px; }
.sales-index .sales-search .search-control { width: 180px; }
.sales-index > .sales-attention { width: 100%; margin-top: 16px; border: 0; padding: 0; }
.sales-table-scroll { width: 100%; min-width: 0; overflow: auto; border: 1px solid var(--line); }
.sales-table { width: 100%; min-width: 894px; }
.sales-table-header, .sales-record-row { display: grid; grid-template-columns: 24px minmax(160px, 1.2fr) minmax(130px, 1fr) minmax(240px, 2.4fr) 88px 104px 148px; align-items: center; gap: 0; padding: 0; }
.sales-table-header { height: 32px; background: var(--table-header); color: var(--muted); font: 400 12px/18px var(--sans); border-bottom: 1px solid var(--line); }
.sales-table-header > span, .sales-record-row > span { min-width: 0; padding-inline: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sales-attention-row, .sales-attention-row:not(:has(.sales-draft-preview)) { display: block; padding: 0; }
.sales-record-row { height: 40px; color: var(--muted); font: 400 12px/18px var(--sans); text-decoration: none; }
.sales-record-row > span { height: 100%; align-content: center; }
.sales-record-row .sales-client { color: var(--ink); font-size: 13px; }
.sales-record-row:hover { background: #f7f7f8; }
.sales-record-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.sales-attention-row:not(:last-child) > .sales-record-row { border-bottom: 1px solid var(--line-soft); }
.sales-value { text-align: right; font-variant-numeric: tabular-nums; }
.sales-record-row .sales-status--attention { display: flex; align-items: center; gap: 4px; color: var(--amber); }
.sales-status--attention::before { content: ''; flex: none; width: 4px; height: 4px; background: currentColor; }
.order-panel:has(.sales-page) { width: min(560px, 100vw); --panel-action-inset: 16px; border-radius: 0; }
.order-panel:has(.sales-page)::backdrop { background: transparent; }
.order-panel:has(.sales-page) .order-panel__view, .order-panel:has(.record-panel-header) .order-panel__identity { display: none; }
.order-panel:has(.sales-page) > .order-panel__header .order-panel__close { top: 24px; right: 16px; }
.order-panel:has(.sales-page) .order-panel__actions { top: 24px; right: 52px; }
.order-panel .sales-page { padding: 16px 16px 32px; }
.order-panel .sales-page .order-record-header { margin: 0 -16px; padding: 0 16px 16px; border-bottom: 1px solid var(--line); }
.sales-page .record-panel-header { display: flex; align-items: center; gap: 12px; min-height: 40px; padding-right: 72px; }
.sales-page .record-panel-header__avatar { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; background: #f1e9ed; color: var(--accent); font-size: 13px; font-weight: 600; }
.sales-page .record-panel-header__identity { min-width: 0; flex: 1; }
.sales-page .record-panel-header h1 { margin: 0; font: 600 16px/22px var(--sans); overflow-wrap: anywhere; }
.sales-page .record-panel-header p { margin: 4px 0 0; font: 400 12px/18px var(--sans); color: var(--muted); overflow-wrap: anywhere; }
.sales-page .record-panel-header > .button { flex-shrink: 0; }
.sales-page .record-panel-header .order-panel__record { font: inherit; }
.order-panel .sales-page .breadcrumbs { margin: 0 72px 12px 0; font-size: 12px; }
.order-panel .sales-page .sales-lead-heading { margin-bottom: 0; }
.order-panel .sales-page .sales-workspace { display: block; }
.sales-page .sales-details, .sales-page .sales-correspondence { padding-block: 16px; }
.sales-page .sales-conversation > .sales-correspondence, .sales-page .sales-conversation { margin: 0; }
.sales-page .sales-conversation > .sales-correspondence { border-top: 1px solid var(--line); }
.sales-page .section-heading { margin-bottom: 8px; min-height: 20px; }
.sales-page .section-heading h2 { font: 600 13px/20px var(--sans); }
.sales-page .detail-ledger { margin: 0; }
.sales-page .detail-ledger__item, .sales-page .sales-envelope > div { display: grid; grid-template-columns: 152px minmax(0, 1fr); gap: 12px; min-height: 32px; padding: 4px 0; border: 0; }
.sales-page .detail-ledger dt, .sales-page .sales-envelope dt { font: 400 12px/18px var(--sans); color: var(--muted); }
.sales-page .detail-ledger dd, .sales-page .sales-envelope dd { margin: 0; font: 400 13px/20px var(--sans); overflow-wrap: anywhere; }
.sales-page .sales-fields .form-field, .sales-page .field-rows .form-field { display: grid; grid-template-columns: 152px minmax(0, 1fr); gap: 12px; padding: 4px 0; margin: 0; border: 0; }
.sales-page .field-label { margin: 0; padding-block: 4px; color: var(--muted); font: 400 12px/18px var(--sans); }
.sales-page .sales-draft-kind { display: grid; grid-template-columns: 152px minmax(0,1fr); gap: 12px; min-height: 32px; padding-block: 4px; font-size: 12px; }
.sales-page .sales-draft-kind > span:last-child { font-size: 13px; color: var(--ink); }
.sales-page .sales-email { padding-block: 16px; margin-top: 0; }
.sales-page .sales-correspondence > .section-heading + .sales-email { border-top: 0; padding-top: 0; }
.sales-page .sales-email.private-preview { background: transparent; border-radius: 0; padding-inline: 0; }
.sales-page .sales-email-body, .sales-page .sales-review .sales-email-body { padding: 0; border: 0; border-radius: 0; background: transparent; font: 400 13px/20px var(--sans); margin-block: 16px; }
.sales-page .sales-envelope { margin: 0 0 16px; padding: 0; border: 0; }
.sales-page .sales-review { padding-block: 16px; }
.sales-page .sales-draft-picker { padding: 0; margin: 0 0 16px; background: transparent; }
.sales-page .sales-draft-picker__form { gap: 8px; }
.sales-page .sales-form-actions { border: 0; padding: 0; gap: 8px; margin-top: 16px; }
.sales-page .sales-form-actions .inline-warning { font-size: 12px; }
.sales-page .sales-discard { background: transparent; border-color: transparent; color: var(--red-ink); }
.sales-page .sales-thread-hint { margin: 0; }
@media (max-width: 960px) { .workspace-shell > .order-panel:has(.sales-page) { width: min(560px, 100vw); border-left: 1px solid var(--line); } }
@media (max-width: 760px) {
  .sales-index > .page-header { margin: -20px -20px 0; padding-inline: 20px; gap: 8px; flex-wrap: wrap; }
  .sales-index > .page-header .page-header__identity { min-height: 44px; }
  .sales-index > .page-header .page-header__actions { flex-basis: 100%; }
  .sales-index .sales-toolbar { gap: 8px; flex-wrap: wrap; padding-bottom: 8px; }
  .sales-index .sales-toolbar .page-tabs { flex-basis: 100%; }
  .sales-index .sales-toolbar__tools { width: 100%; justify-content: space-between; }
  .sales-index .sales-search, .sales-index .sales-search .search-control { width: 100%; }
  .order-panel:has(.sales-page) { border-left: 0; }
  .sales-page .record-panel-header { flex-wrap: wrap; }
  .sales-page .record-panel-header > .button { margin-left: 52px; }
}
@media (max-width: 390px) {
  .sales-page .sales-fields .form-field, .sales-page .field-rows .form-field { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}
.sales-page .sales-draft-kind { padding-inline: 0; background: transparent; }
.sales-page .sales-draft-kind > span:last-child { min-width: 0; padding: 0; border: 0; background: transparent; }
.sales-page .text-input[readonly] { background: var(--surface); }