/* Online operations use the same quiet list and stable action surfaces as sales
   and tables. Full platform references and addresses remain in the detail. */
.online-workspace .online-page-toolbar h1 { font-weight: var(--weight-medium); }
.online-workspace .online-automation button {
  border-color: transparent;
  background: var(--color-surface-subtle);
  padding-inline: var(--space-3);
  font-weight: var(--weight-regular);
}
.online-workspace .online-automation button:hover:not(:disabled) { border-color: var(--color-border-strong); background: var(--color-primary-subtle); }
.online-workspace .online-orders-list { border-radius: var(--radius-lg); }
.online-workspace :is(.online-list-head, .online-order-card) {
  grid-template-columns: minmax(150px, 1.15fr) minmax(130px, 1.5fr) 72px 64px minmax(128px, 1fr) 116px;
  column-gap: var(--space-4);
}
.online-workspace .online-list-head { height: 40px; background: var(--color-surface-subtle); }
.online-workspace .online-list-head span:nth-child(3), .online-workspace .online-address { display: none; }
.online-workspace .online-list-head span:nth-child(4), .online-workspace .online-item-count { display: block; }
.online-workspace .online-order-card {
  height: 72px;
  min-height: 72px;
  padding-block: var(--space-3);
  box-shadow: none;
}
.online-workspace .online-order-card.is-new { background: color-mix(in srgb, var(--color-warning-subtle) 40%, var(--color-surface)); }
.online-workspace .online-order-card:hover { background: var(--color-surface-hover); }
.online-workspace .online-order-card.is-new:hover { background: var(--color-warning-subtle); }
.online-workspace .online-order-card.is-selected {
  background: var(--color-selected-bg);
  box-shadow: none;
  outline: 1px solid var(--color-selected-border);
  outline-offset: -1px;
}
.online-workspace .online-order-card:focus-visible { outline: var(--focus-ring); outline-offset: -2px; }
.online-workspace .online-order-id { gap: var(--space-1); }
.online-workspace .online-order-id strong { color: var(--color-primary); font-size: var(--text-md); font-weight: var(--weight-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.online-workspace .online-order-id small { font-size: var(--text-xs); }
.online-workspace .online-customer { font-size: var(--text-base); font-weight: var(--weight-regular); }
.online-workspace .online-row-total { color: var(--color-primary); font-size: var(--text-md); font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; }
.online-workspace .online-order-card > time { font-variant-numeric: tabular-nums; }
.online-workspace .online-order-card.is-new .online-row-status {
  justify-self: start;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  background: var(--color-warning-subtle);
  color: var(--color-warning);
}
.online-workspace .online-order-details h2 { font-weight: var(--weight-medium); }
.online-workspace .online-detail-heading strong { background: transparent; padding-inline: 0; font-weight: var(--weight-regular); }
.online-workspace .online-order-reference { flex-wrap: wrap; overflow-wrap: anywhere; }
.online-workspace .online-order-reference strong { min-width: 0; overflow-wrap: anywhere; }
.online-workspace .online-detail-customer { align-items: flex-start; }
.online-workspace .online-detail-customer strong { min-width: 0; overflow-wrap: anywhere; font-weight: var(--weight-medium); }
.online-workspace .online-detail-customer > span { flex: none; font-variant-numeric: tabular-nums; }
.online-workspace .online-contact span { overflow-wrap: anywhere; }
.online-workspace .online-contact svg { flex: none; }
.online-workspace .online-note { background: var(--color-surface-subtle); }
.online-workspace .online-note span { color: var(--color-text-muted); }
.online-workspace .online-note p { overflow-wrap: anywhere; }
.online-workspace .online-item-row { padding-block: var(--space-3); }
.online-workspace .online-item-row strong { color: var(--color-primary); font-weight: var(--weight-medium); }
.online-workspace .online-detail-footer {
  margin: 0 calc(-1 * var(--space-4)) calc(-1 * var(--space-4));
  padding: var(--space-3) var(--space-4) var(--space-4);
  border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-primary-subtle) 45%, var(--color-surface));
}
.online-workspace .online-detail-footer .total-box { min-height: var(--control-md); padding: 0; align-items: center; }
.online-workspace .online-detail-footer .total-box > span { font-size: var(--text-sm); font-weight: var(--weight-regular); }
.online-workspace .online-detail-footer .total-box > strong { color: var(--color-primary); font-weight: var(--weight-medium); }
.online-workspace .online-decision-buttons button { font-size: var(--text-base); font-weight: var(--weight-medium); }
.online-workspace .online-reject-button { border-color: var(--color-border-control); background: var(--color-surface); color: var(--color-text-secondary); }
.online-workspace .online-reject-button:hover:not(:disabled) { border-color: var(--color-danger-border); background: var(--color-danger-subtle); color: var(--color-danger); }
.online-workspace .online-decision-buttons button:disabled { opacity: 1; background: var(--color-surface-sunken); border-color: var(--color-border); color: var(--color-text-disabled); }
.online-workspace .online-status-message { line-height: var(--leading-normal); padding: var(--space-2); }
.online-workspace .online-status-message.is-accepted { background: transparent; color: var(--color-text-secondary); }

@container (max-width: 1050px) {
  .online-workspace :is(.online-list-head, .online-order-card) {
    grid-template-columns: minmax(120px, 1fr) minmax(100px, 1.1fr) 56px 52px minmax(112px, .9fr) 96px;
    column-gap: var(--space-3);
  }
}
@container (max-width: 760px) {
  .online-workspace .online-page-toolbar h1 { margin-right: 0; }
  .online-workspace :is(.online-platform-filter-trigger, .online-channels-button) { gap: 6px; padding-inline: var(--space-2); font-size: var(--text-xs); }
  .online-workspace :is(.online-platform-filter-trigger, .online-channels-button) > strong { font-size: var(--text-xs); }
  .online-workspace .online-automation button { padding-inline: var(--space-2); gap: 6px; font-size: var(--text-xs); }
  .online-workspace .online-page-toolbar .search-box { flex-basis: 100px; min-width: 100px; }
  .online-workspace .online-status-filter { flex-basis: 148px; }
  .online-workspace .online-list-head { display: none; }
  .online-workspace .online-order-card {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: 'code total' 'customer time' 'items status';
    height: 116px;
    min-height: 116px;
    gap: 6px var(--space-3);
    padding-block: var(--space-3);
  }
  .online-workspace .online-order-id { grid-area: code; }
  .online-workspace .online-row-total { grid-area: total; }
  .online-workspace .online-customer { grid-area: customer; }
  .online-workspace .online-order-card > time { grid-area: time; text-align: right; }
  .online-workspace .online-item-count { grid-area: items; }
  .online-workspace .online-row-status { grid-area: status; justify-self: end; }
  .online-workspace .online-order-card.is-new .online-row-status { justify-self: end; }
}
@media (max-width: 899px) {
  .pos-shell.is-compact .online-workspace .online-page-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-2); }
  .pos-shell.is-compact .online-workspace .online-page-toolbar h1 { grid-column: 1 / -1; }
  .pos-shell.is-compact .online-workspace .online-platform-filter,
  .pos-shell.is-compact .online-workspace .online-channels-button { min-width: 0; }
  .pos-shell.is-compact .online-workspace .online-platform-filter-trigger { width: 100%; gap: 6px; padding-inline: var(--space-2); font-size: var(--text-xs); }
  .pos-shell.is-compact .online-workspace .online-platform-filter-trigger strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: var(--text-xs); }
  .pos-shell.is-compact .online-workspace .online-platform-filter-trigger > svg { flex: none; }
  .pos-shell.is-compact .online-workspace .online-channels-button { gap: 6px; padding-inline: var(--space-2); font-size: var(--text-xs); }
  .pos-shell.is-compact .online-workspace .online-channels-button strong { font-size: var(--text-xs); padding-left: 6px; }
  .pos-shell.is-compact .online-workspace .online-automation { grid-column: 1 / -1; order: 4; min-width: 0; }
  .pos-shell.is-compact .online-workspace .online-automation button { min-width: 0; gap: var(--space-2); padding-inline: var(--space-2); font-size: var(--text-xs); }
  .pos-shell.is-compact .online-workspace .online-page-toolbar .search-box { flex: 1 1 140px; max-width: none; margin-left: 0; }
  .pos-shell.is-compact .online-workspace .online-status-filter { flex: 0 1 160px; }
  .pos-shell.is-compact .online-workspace .online-order-card {
    grid-template-areas: 'code total' 'customer time' 'items status';
    height: 116px;
    min-height: 116px;
  }
  .pos-shell.is-compact .online-workspace .online-order-card > .online-order-id { grid-area: code; }
  .pos-shell.is-compact .online-workspace .online-order-card > .online-row-total { grid-area: total; }
  .pos-shell.is-compact .online-workspace .online-order-card > .online-customer { grid-area: customer; }
  .pos-shell.is-compact .online-workspace .online-order-card > time { grid-area: time; }
  .pos-shell.is-compact .online-workspace .online-order-card > .online-address { display: none; }
  .pos-shell.is-compact .online-workspace .online-order-card > .online-item-count { grid-area: items; }
  .pos-shell.is-compact .online-workspace .online-order-card > .online-row-status { grid-area: status; }
  .pos-shell.is-compact .online-workspace .online-platform-popover { position: fixed; top: calc(56px + env(safe-area-inset-top) + 90px); left: var(--space-3); right: var(--space-3); width: auto; max-height: calc(100dvh - 220px); overflow-y: auto; }
  .pos-shell.is-compact .online-workspace .online-order-details { display: flex; }
  .pos-shell.is-compact .online-workspace .online-item-card { flex: 1 0 auto; }
  .pos-shell.is-compact .online-workspace .online-item-list { overflow: visible; }
  .pos-shell.is-compact .online-workspace .online-detail-footer { flex: none; margin-bottom: calc(-16px - env(safe-area-inset-bottom)); padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
}
@media (min-width: 600px) and (max-width: 899px) {
  .pos-shell.is-compact .online-workspace .online-page-toolbar { display: flex; }
  .pos-shell.is-compact .online-workspace .online-page-toolbar h1 { flex: 0 0 auto; }
  .pos-shell.is-compact .online-workspace .online-platform-filter,
  .pos-shell.is-compact .online-workspace .online-channels-button { flex: 0 0 auto; }
  .pos-shell.is-compact .online-workspace .online-automation { flex: 0 0 auto; order: 0; }
}
