:root {
  --fw-bg: #f8fafc;
  --fw-surface: #ffffff;
  --fw-surface-muted: #f1f5f9;
  --fw-border: #e2e8f0;
  --fw-border-strong: #cbd5e1;
  --fw-text: #0f172a;
  --fw-text-muted: #475569;
  --fw-text-subtle: #64748b;
  --fw-primary: #2563eb;
  --fw-primary-hover: #1d4ed8;
  --fw-primary-soft: #dbeafe;
  --fw-success: #16a34a;
  --fw-warning: #d97706;
  --fw-danger: #dc2626;
  --fw-info: #0284c7;
  --status-info-bg: #eff6ff;
  --status-info-border: #bfdbfe;
  --status-info-text: #1d4ed8;
  --status-success-bg: #f0fdf4;
  --status-success-border: #bbf7d0;
  --status-success-text: #15803d;
  --status-warning-bg: #fffbeb;
  --status-warning-border: #fde68a;
  --status-warning-text: #92400e;
  --status-danger-bg: #fef2f2;
  --status-danger-border: #fecaca;
  --status-danger-text: #991b1b;
  --status-neutral-bg: #f8fafc;
  --status-neutral-border: #e2e8f0;
  --status-neutral-text: #475569;
  --fw-sidebar-bg: #0f172a;
  --fw-sidebar-active: #1e293b;
  --fw-sidebar-text: #e2e8f0;
  --bg: var(--fw-bg);
  --bg-elevated: var(--fw-surface-muted);
  --panel: var(--fw-surface);
  --panel-strong: var(--fw-surface);
  --panel-soft: var(--fw-surface-muted);
  --ink: var(--fw-text);
  --muted: var(--fw-text-muted);
  --muted-strong: var(--fw-text);
  --line: var(--fw-border);
  --line-strong: var(--fw-border-strong);
  --accent: var(--fw-primary);
  --accent-deep: var(--fw-primary-hover);
  --accent-soft: var(--fw-primary-soft);
  --accent-fog: rgba(37, 99, 235, 0.1);
  --accent-tint: rgba(37, 99, 235, 0.06);
  --danger: var(--fw-danger);
  --danger-soft: #fee2e2;
  --danger-line: #fecaca;
  --danger-ink: #991b1b;
  --radius-panel: 8px;
  --radius-card: 8px;
  --radius-control: 6px;
  --shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-panel: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-control: none;
}

.inline-filter-field {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #475569;
  font-size: 13px;
  font-weight: 600;
}

.inline-filter-field input {
  min-height: 34px;
}

.offline-sync-batch-list {
  margin-top: 12px;
}

.offline-sync-batch-row {
  display: grid;
  grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.4fr);
  gap: 12px;
  align-items: start;
}

.candidate-row-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: #475569;
  font-size: 13px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "Avenir Next", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  line-height: 1.45;
  background: var(--fw-bg);
  color: var(--ink);
}

/* Issue #1295 — real, paid-only petty cash register. */
.petty-cash-panel {
  background: #f6f8fb;
}

.petty-cash-page-head {
  margin-bottom: 18px;
}

.petty-cash-page-head h2 {
  margin: 3px 0 0;
}

.petty-cash-root,
.petty-cash-shell {
  min-width: 0;
}

.petty-cash-shell {
  display: grid;
  gap: 18px;
}

.petty-cash-policy-banner {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  padding: 17px 19px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #eff6ff;
  color: #1e3a8a;
}

.petty-cash-policy-banner > div:first-child {
  display: grid;
  gap: 5px;
}

.petty-cash-kicker {
  color: #2563eb;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.petty-cash-kicker.danger {
  color: #b91c1c;
}

.petty-cash-head-actions,
.petty-cash-form-actions,
.petty-cash-filter-actions,
.petty-cash-dialog-actions,
.petty-cash-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.petty-cash-head-actions {
  flex: 0 0 auto;
}

.petty-cash-notice {
  display: none;
  padding: 12px 14px;
  border: 1px solid var(--status-info-border);
  border-radius: 8px;
  background: var(--status-info-bg);
  color: var(--status-info-text);
  font-size: 13px;
  font-weight: 800;
}

.petty-cash-notice.is-visible {
  display: block;
}

.petty-cash-notice.tone-success {
  border-color: var(--status-success-border);
  background: var(--status-success-bg);
  color: var(--status-success-text);
}

.petty-cash-notice.tone-danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-text);
}

.petty-cash-card {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--fw-border);
  border-radius: 10px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}

.petty-cash-entry-card {
  border-top: 3px solid #2563eb;
}

.petty-cash-card-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 17px;
}

.petty-cash-card-head > div {
  display: flex;
  gap: 10px;
  align-items: center;
}

.petty-cash-card-head h3,
.petty-cash-card-head p {
  margin: 0;
}

.petty-cash-card-head p {
  color: var(--fw-text-subtle);
  font-size: 12px;
  text-align: right;
}

.petty-cash-step {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #e0e7ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 900;
}

.petty-cash-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px 18px;
}

.petty-cash-form label,
.petty-cash-filters label,
.petty-cash-void-dialog label {
  display: grid;
  gap: 7px;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.petty-cash-form input,
.petty-cash-form select,
.petty-cash-form textarea,
.petty-cash-filters input,
.petty-cash-filters select,
.petty-cash-void-dialog textarea {
  width: 100%;
  min-height: 42px;
  padding: 9px 11px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  background: #fff;
  color: #0f172a;
  font: inherit;
}

.petty-cash-form input:focus,
.petty-cash-form select:focus,
.petty-cash-form textarea:focus,
.petty-cash-filters input:focus,
.petty-cash-filters select:focus,
.petty-cash-void-dialog textarea:focus {
  border-color: #2563eb;
  outline: 3px solid rgba(37, 99, 235, .12);
}

.petty-cash-form input[readonly] {
  background: #f8fafc;
  color: #475569;
  font-weight: 900;
}

.petty-cash-form textarea,
.petty-cash-void-dialog textarea {
  min-height: 70px;
  resize: vertical;
}

.petty-cash-span-2 {
  grid-column: 1 / -1;
}

.petty-cash-proof-field {
  padding: 13px;
  border: 1px dashed #93c5fd;
  border-radius: 8px;
  background: #f8fbff;
}

.petty-cash-proof-field small,
.petty-cash-form-actions span {
  color: #64748b;
  font-size: 11px;
  font-weight: 600;
}

.petty-cash-form-actions {
  padding-top: 4px;
}

.petty-cash-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
  border-radius: 8px;
  background: #f8fafc;
}

.petty-cash-filter-actions {
  align-self: end;
}

.petty-cash-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.petty-cash-summary-grid article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 14px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fbff;
}

.petty-cash-summary-grid span,
.petty-cash-summary-grid small {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.petty-cash-summary-grid strong {
  overflow-wrap: anywhere;
  color: #0f172a;
  font-size: 20px;
}

.petty-cash-breakdowns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.petty-cash-breakdown {
  min-width: 0;
  padding: 13px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.petty-cash-breakdown > div {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.petty-cash-breakdown span {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: #475569;
  font-size: 11px;
}

.petty-cash-breakdown em {
  min-width: 0;
  overflow-wrap: anywhere;
  font-style: normal;
}

.petty-cash-breakdown b {
  flex: 0 0 auto;
  color: #0f172a;
}

.petty-cash-table-wrap {
  max-width: 100%;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.petty-cash-table {
  width: 100%;
  min-width: 1240px;
  border-collapse: collapse;
  background: #fff;
}

.petty-cash-table th,
.petty-cash-table td {
  padding: 12px 11px;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
  vertical-align: top;
  font-size: 12px;
}

.petty-cash-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  letter-spacing: .02em;
}

.petty-cash-table td strong,
.petty-cash-table td small {
  display: block;
}

.petty-cash-table td small {
  margin-top: 5px;
  max-width: 260px;
  color: #64748b;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.petty-cash-table tr.is-void td {
  background: #fff7f7;
  color: #64748b;
}

.petty-cash-amount {
  color: #0f172a;
  font-weight: 900;
  white-space: nowrap;
}

.petty-cash-proof-list {
  display: grid;
  gap: 6px;
}

.petty-cash-proof-missing {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 999px;
  background: #fff7ed;
  color: #c2410c;
  font-size: 10px;
  font-weight: 900;
}

.petty-cash-empty {
  display: grid;
  place-items: center;
  gap: 6px;
  min-height: 140px;
  padding: 28px;
  color: #64748b;
  text-align: center;
}

.petty-cash-pagination {
  justify-content: flex-end;
  margin-top: 13px;
  color: #64748b;
  font-size: 12px;
}

.petty-cash-void-dialog {
  width: min(520px, calc(100vw - 32px));
  padding: 0;
  border: 0;
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}

.petty-cash-void-dialog::backdrop {
  background: rgba(15, 23, 42, .58);
}

.petty-cash-void-dialog form {
  display: grid;
  gap: 14px;
  padding: 22px;
}

.petty-cash-void-dialog h3,
.petty-cash-void-dialog p {
  margin: 0;
}

.petty-cash-void-dialog p {
  color: #64748b;
  font-size: 13px;
  line-height: 1.55;
}

.petty-cash-dialog-actions {
  justify-content: flex-end;
}

.required,
.is-required::after {
  color: #dc2626;
}

.required {
  margin-left: 3px;
}

.is-required::after {
  content: " *";
}

@media (max-width: 1020px) {
  .petty-cash-filters,
  .petty-cash-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .petty-cash-breakdowns {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .petty-cash-policy-banner,
  .petty-cash-card-head {
    align-items: stretch;
    flex-direction: column;
  }

  .petty-cash-card-head p {
    text-align: left;
  }

  .petty-cash-head-actions button {
    flex: 1 1 140px;
  }

  .petty-cash-card {
    padding: 15px;
  }

  .petty-cash-form,
  .petty-cash-filters,
  .petty-cash-summary-grid {
    grid-template-columns: 1fr;
  }

  .petty-cash-span-2 {
    grid-column: auto;
  }

  .petty-cash-form-actions button,
  .petty-cash-filter-actions button {
    flex: 1 1 120px;
  }
}

.hidden-screen {
  display: none !important;
}

.auth-api-config[hidden] {
  display: none !important;
}

.auth-page {
  min-height: 100vh;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: center;
  justify-content: center;
}

.test-home-entry {
  width: min(1200px, 100%);
  padding: 24px;
}

.test-home-badge {
  display: inline-flex;
  margin: 0;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(143, 45, 45, 0.26);
  background: var(--danger-soft);
  color: var(--danger-ink);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.test-home-grid {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
}

.test-home-link {
  appearance: none;
  border: 1px solid var(--line-strong);
  background: linear-gradient(180deg, #fffdf8 0%, #f4ecdf 100%);
  border-radius: 12px;
  min-height: 72px;
  text-align: left;
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 700;
  color: var(--accent-deep);
  cursor: pointer;
}

.test-home-link:hover {
  border-color: var(--accent);
  box-shadow: var(--shadow-soft);
}

.auth-shell {
  width: min(1200px, 100%);
  display: grid;
  grid-template-columns: 1.25fr 0.95fr;
  gap: 24px;
  align-items: stretch;
}

.auth-session-validation {
  width: min(560px, 100%);
  padding: 32px;
  text-align: center;
}

.auth-session-validation h1 {
  margin: 8px 0 10px;
}

.auth-session-validation-actions {
  margin-top: 18px;
  display: flex;
  justify-content: center;
  gap: 10px;
}

.auth-brand,
.auth-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 28px;
  box-shadow: var(--shadow-panel);
}

.auth-brand {
  padding: 36px;
  display: grid;
  gap: 20px;
  align-content: center;
  background:
    radial-gradient(circle at top right, rgba(13, 92, 99, 0.14), transparent 30%),
    linear-gradient(180deg, #fffdf8 0%, #f4eddf 100%);
}

.auth-brand-points {
  display: grid;
  gap: 14px;
}

.auth-brand-points article {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(13, 92, 99, 0.1);
  backdrop-filter: blur(8px);
}

.auth-brand-points strong {
  font-size: 18px;
  color: var(--accent);
}

.auth-card {
  padding: 26px;
  display: grid;
  gap: 16px;
  align-content: center;
  background: linear-gradient(180deg, #fffdf8 0%, #fbf6ee 100%);
}

.auth-card .hero-card {
  margin: 0;
  box-shadow: none;
}

.auth-form {
  margin-top: 4px;
}

.auth-card :is(input, button) {
  scroll-margin: 96px 0 160px;
}

.forced-password-change-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  overflow: auto;
  background: rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(10px);
}

.forced-password-change-card {
  width: min(100%, 460px);
  max-height: calc(100vh - 40px);
  max-height: calc(100svh - 40px);
  overflow: auto;
  padding: 28px;
  border: 1px solid #d9e4f4;
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.24);
  color: #111827;
}

.forced-password-change-icon {
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 17px;
  background: #eaf2ff;
  color: #2767d8;
}

.forced-password-change-icon svg {
  width: 29px;
  height: 29px;
}

.forced-password-change-eyebrow {
  margin: 0 0 6px;
  color: #2767d8;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.forced-password-change-card h1 {
  margin: 0;
  font-size: 30px;
  line-height: 1.16;
}

.forced-password-change-lead {
  margin: 12px 0 18px;
  color: #667085;
  font-size: 15px;
  line-height: 1.55;
}

.forced-password-change-account {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 12px;
  margin-bottom: 20px;
  padding: 13px 15px;
  border: 1px solid #dce7f6;
  border-radius: 14px;
  background: #f6f9fe;
}

.forced-password-change-account span {
  grid-column: 1 / -1;
  color: #778399;
  font-size: 12px;
  font-weight: 700;
}

.forced-password-change-account strong,
.forced-password-change-account small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.forced-password-change-account small {
  color: #667085;
  text-align: right;
}

.forced-password-change-form {
  display: grid;
  gap: 14px;
}

.forced-password-change-form label {
  display: grid;
  gap: 7px;
  font-weight: 800;
}

.forced-password-change-form input {
  width: 100%;
  min-height: 50px;
  padding: 11px 13px;
  border: 1px solid #cdd8e7;
  border-radius: 12px;
  background: #fff;
  color: #111827;
  font: inherit;
}

.forced-password-change-form input:focus {
  border-color: #2767d8;
  outline: 3px solid rgba(39, 103, 216, 0.14);
}

.forced-password-change-rules {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 12px 14px 12px 30px;
  border-radius: 12px;
  background: #f7f8fb;
  color: #667085;
  font-size: 12px;
}

.forced-password-change-error {
  min-height: 20px;
  margin: -2px 0 0;
  color: #b42318;
  font-size: 13px;
  font-weight: 700;
}

.forced-password-change-submit {
  min-height: 52px;
  border: 0;
  border-radius: 13px;
  background: #2767d8;
  color: #fff;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.forced-password-change-submit:disabled {
  cursor: wait;
  opacity: 0.68;
}

.direct-loop-version-info {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #dbe4ef;
  border-radius: 8px;
  background: #f8fafc;
  color: #0f172a;
  font-size: 12px;
  line-height: 1.35;
}

.direct-loop-version-info div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.direct-loop-version-info strong,
.direct-loop-version-info b {
  color: #475569;
  font-weight: 900;
}

.direct-loop-version-info span {
  min-width: 0;
  overflow-wrap: anywhere;
  text-align: right;
  font-weight: 800;
}

.direct-loop-version-methods {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 8px !important;
  margin-top: 2px;
}

.direct-loop-version-methods span {
  text-align: left;
}

.app-shell {
  display: grid;
  gap: 0;
  width: min(1680px, 100%);
  margin: 0 auto;
  padding: 12px 14px 24px;
}

.eyebrow {
  margin: 0 0 8px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--accent);
  font-size: 14px;
  font-weight: 700;
}

h1,
h2,
h3 {
  margin: 0;
}

.subtle {
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
  max-width: 720px;
}

.hero-card,
.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-panel);
  box-shadow: var(--shadow-soft);
}

.category-library-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.category-library-card {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
  border-radius: var(--radius-card);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.94) 0%, rgba(245, 237, 224, 0.78) 100%);
  box-shadow: var(--shadow-soft);
}

.category-library-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.category-library-head strong {
  font-size: 18px;
  color: var(--accent-deep);
}

.category-library-head span {
  font-size: 14px;
  color: var(--muted);
}

.category-library-sub-list {
  display: grid;
  gap: 10px;
}

.category-library-sub-item {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(205, 191, 165, 0.66);
  background: rgba(255, 255, 255, 0.72);
}

.category-library-sub-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.category-library-sub-text span {
  font-weight: 700;
  color: var(--ink);
}

.clerk-pda-shell {
  display: grid;
  gap: 16px;
}

.clerk-pda-head {
  display: grid;
  gap: 6px;
  padding: 18px;
  border-radius: var(--radius-card);
  color: #fff;
  background: linear-gradient(135deg, var(--accent-deep), var(--accent));
}

.clerk-pda-head .eyebrow,
.clerk-pda-head p {
  color: rgba(255, 255, 255, 0.82);
}

.store-package-card-list {
  display: grid;
  gap: 14px;
}

.store-package-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: var(--panel-strong);
  box-shadow: var(--shadow-soft);
}

.store-package-card-head,
.store-package-step-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.store-package-title {
  margin-top: 8px;
  font-size: 24px;
  font-weight: 800;
}

.store-package-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.store-package-grid span {
  display: grid;
  gap: 3px;
  min-height: 64px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(245, 237, 224, 0.72);
}

.store-package-grid b {
  color: var(--muted);
  font-size: 13px;
}

.store-package-primary {
  min-width: 142px;
  min-height: 58px;
  font-size: 20px;
}

.store-package-shelving-step,
.store-package-flow-block {
  display: grid;
  gap: 14px;
}

.store-package-flow-block {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: rgba(255, 255, 255, 0.62);
}

.store-package-price-choices {
  align-items: stretch;
}

.store-print-preview-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}

.store-print-label-preview {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px dashed var(--line-strong);
  border-radius: 12px;
  background: #fff;
}

.store-print-label-price {
  font-size: 24px;
  font-weight: 900;
}

.store-print-barcode {
  padding: 8px 10px;
  border-radius: 8px;
  background: #f0f0ed;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px;
}

.store-generated-item-list {
  display: grid;
  gap: 10px;
}

.store-generated-item-row {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.store-generated-item-row small {
  display: block;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.store-item-lineage-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 6px;
}

.store-item-lineage-summary > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 7px 8px;
  border-radius: 8px;
  background: rgba(245, 247, 250, 0.9);
  color: var(--text);
  overflow-wrap: anywhere;
}

.store-item-lineage-summary b {
  color: var(--muted);
  font-size: 12px;
}

.category-library-sub-text em {
  font-style: normal;
  font-size: 13px;
  color: var(--muted);
}

.warehouse-workbench-panel {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top right, rgba(17, 93, 100, 0.045), transparent 24%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.97) 0%, rgba(244, 236, 223, 0.9) 100%);
}

.warehouse-workbench-panel::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, rgba(17, 93, 100, 0.8) 0%, rgba(239, 187, 94, 0.56) 100%);
  opacity: 0.72;
}

.warehouse-workbench-panel-primary {
  box-shadow: 0 18px 42px rgba(23, 20, 17, 0.055);
  border-color: rgba(187, 169, 139, 0.72);
}

.warehouse-support-panel {
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.74) 0%, rgba(243, 235, 222, 0.6) 100%);
  border-style: dashed;
  box-shadow: none;
}

.warehouse-support-panel .panel-head {
  opacity: 0.88;
}

.warehouse-step-form {
  gap: 14px;
}

.warehouse-step-form > button[type="submit"] {
  margin-top: 4px;
}

.store-role-panel {
  position: relative;
  overflow: hidden;
}

.store-role-panel::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  opacity: 0.74;
}

.store-role-panel-manager {
  background:
    radial-gradient(circle at top right, rgba(17, 93, 100, 0.045), transparent 22%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.97) 0%, rgba(244, 236, 223, 0.88) 100%);
}

.store-role-panel-manager::before {
  background: linear-gradient(90deg, rgba(17, 93, 100, 0.86) 0%, rgba(83, 131, 138, 0.42) 100%);
}

.store-role-panel-clerk {
  background:
    radial-gradient(circle at top right, rgba(239, 187, 94, 0.09), transparent 18%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(245, 237, 224, 0.9) 100%);
}

.store-role-panel-clerk::before {
  background: linear-gradient(90deg, rgba(239, 187, 94, 0.72) 0%, rgba(17, 93, 100, 0.46) 100%);
}

.store-support-panel {
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.72) 0%, rgba(243, 235, 222, 0.58) 100%);
  border-style: dashed;
  box-shadow: none;
}

.hero-card {
  padding: 18px;
  display: grid;
  gap: 10px;
}

.app-hero .hero-card {
  background: rgba(255, 250, 241, 0.08);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: none;
  backdrop-filter: blur(12px);
}

.app-hero .hero-card h2,
.app-hero .hero-card .field-label,
.app-hero .hero-card label,
.app-hero .hero-card .subtle,
.app-hero .hero-card code {
  color: #fff8ef;
}

.session-summary {
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--fw-surface-muted);
  color: var(--fw-text-muted);
  font-weight: 600;
  white-space: nowrap;
}

.global-language-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: var(--fw-surface-muted);
  border: 1px solid var(--fw-border);
}

.global-language-button {
  min-height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--accent-deep);
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.global-language-button.is-active {
  background: var(--accent);
  color: #fff8ef;
  box-shadow: var(--shadow-control);
}

.web-language-toggle {
  flex: 0 0 auto;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow-control);
}

body.pda-runtime-mode .web-language-toggle {
  display: none !important;
}

.workspace-session-strip .web-language-toggle {
  margin-left: 2px;
}

.global-language-button.is-disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.pda-settings-card {
  display: grid;
  gap: 10px;
}

.pda-language-setting-row {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: var(--fw-surface);
}

.pda-language-setting-row > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pda-language-setting-row strong {
  color: var(--fw-text);
}

.pda-language-setting-row span {
  color: var(--fw-text-muted);
  font-size: 12px;
  font-weight: 700;
}

.pda-language-toggle {
  justify-content: center;
}

.pda-language-toggle .global-language-button {
  flex: 1;
}

.workspace-top-panel .global-language-toggle {
  background: var(--fw-surface-muted);
  border-color: var(--fw-border);
}

.workspace-top-panel .global-language-button {
  color: var(--fw-text-muted);
}

.workspace-top-panel .global-language-button.is-active {
  background: var(--fw-primary);
  color: #ffffff;
}

.small {
  font-size: 12px;
  line-height: 1.4;
}

.workspace-shell {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.layout {
  padding: 0;
  display: grid;
  gap: 12px;
}

.workspace-top-panel {
  min-height: 56px;
  margin-bottom: 12px;
  padding: 8px 14px;
  border-radius: var(--radius-panel);
  background: var(--fw-surface);
  color: var(--fw-text);
  border: 1px solid var(--fw-border);
  box-shadow: var(--shadow-soft);
  display: grid;
  gap: 6px;
}

.workspace-top-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

.workspace-top-brand {
  display: grid;
  gap: 2px;
  min-width: 180px;
}

.workspace-top-brand strong {
  color: var(--fw-text);
  font-size: 16px;
  line-height: 1.2;
}

.workspace-top-panel .eyebrow,
.workspace-top-panel h2,
.workspace-top-panel h3 {
  color: var(--fw-text);
}

.workspace-top-panel .subtle,
.workspace-top-hint,
#workspaceHint {
  color: var(--fw-text-muted);
}

.workspace-top-hint {
  font-size: 12px;
  line-height: 1.4;
  padding-left: 2px;
}

.workspace-side-panel {
  position: sticky;
  top: 12px;
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 12px;
  border-radius: var(--radius-panel);
  background: var(--fw-sidebar-bg);
  color: var(--fw-sidebar-text);
  border: 1px solid rgba(226, 232, 240, 0.12);
  box-shadow: none;
}

.cashier-terminal-shell {
  display: none;
}

.cashier-landing-page {
  display: grid;
  gap: 16px;
  max-width: 960px;
  margin: 18px auto 0;
  padding: 24px;
  border-radius: 18px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

.cashier-landing-status {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
}

.cashier-landing-status span {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #f8fafc;
  color: #0f172a;
}

.cashier-landing-status em {
  font-style: normal;
  color: #334155;
}

.cashier-landing-status #cashierLandingLogoutButton {
  justify-self: end;
  align-self: center;
}

.cashier-landing-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.cashier-landing-actions button {
  min-height: 56px;
  font-size: 18px;
}

.cashier-compat-shell {
  display: grid;
  gap: 16px;
}

body.cashier-landing-mode .workspace-top-panel,
body.cashier-landing-mode .workspace-side-panel,
body.cashier-pos-mode .workspace-top-panel,
body.cashier-pos-mode .workspace-side-panel {
  display: none !important;
}

body.cashier-landing-mode .workspace-shell,
body.cashier-pos-mode .workspace-shell {
  display: block;
}

body.cashier-landing-mode .cashier-sale-panel,
body.cashier-pos-mode .cashier-sale-panel {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.cashier-landing-mode .cashier-sale-panel .panel-head,
body.cashier-pos-mode .cashier-sale-panel .panel-head,
body.cashier-landing-mode .cashier-compat-shell,
body.cashier-pos-mode .cashier-compat-shell {
  display: none;
}

body.cashier-landing-mode .cashier-landing-page {
  display: grid;
}

body.cashier-landing-mode .cashier-terminal-shell,
body.cashier-pos-mode .cashier-landing-page {
  display: none !important;
}

body.cashier-pos-mode .cashier-terminal-shell {
  display: grid;
  gap: 16px;
}

body.cashier-terminal-mode .workspace-shell {
  grid-template-columns: 1fr;
}

body.cashier-terminal-mode .workspace-side-panel {
  display: none;
}

body.cashier-terminal-mode .workspace-top-panel {
  padding: 10px 14px;
  border-radius: 18px;
}

body.cashier-terminal-mode .workspace-tabs,
body.cashier-terminal-mode .workspace-top-hint {
  display: none;
}

body.cashier-terminal-mode .workspace-top-row {
  justify-content: space-between;
}

body.cashier-terminal-mode .cashier-sale-panel {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.cashier-terminal-mode .cashier-sale-panel .panel-head {
  display: none;
}

body.cashier-terminal-mode .cashier-terminal-shell {
  display: grid;
  gap: 16px;
}

body.cashier-terminal-mode .cashier-compat-shell {
  display: none;
}

body.pda-runtime-mode {
  min-height: 100svh;
  background: #f8fafc;
}

body.pda-runtime-mode .app-shell {
  width: 100%;
  min-height: 100svh;
  padding: 0;
  margin: 0;
}

body.pda-runtime-mode .workspace-top-panel {
  display: none !important;
}

body.pda-runtime-mode .workspace-side-panel {
  display: none !important;
}

body.pda-runtime-mode .workspace-tabs {
  display: none !important;
}

body.pda-runtime-mode .workspace-page-bar {
  display: none !important;
}

body.pda-runtime-mode .workspace-page-nav {
  display: none !important;
}

body.pda-runtime-mode .workspace-shell {
  display: block;
  width: 100%;
  min-height: 100svh;
}

body.pda-runtime-mode #workspacePanels {
  display: block;
  width: 100%;
  min-height: 100svh;
  padding: 0;
}

body.pda-runtime-mode #workspacePanels > .panel:not(.workspace-hidden):not(.panel-hidden) {
  min-height: 100svh;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #f8fafc;
  box-shadow: none;
}

body.pda-runtime-mode #workspacePanels > .panel:not(.workspace-hidden):not(.panel-hidden) > .panel-head {
  display: none !important;
}

body.pda-runtime-mode .pda-runtime-error-shell {
  display: grid;
  min-height: 100svh;
  place-items: center;
  padding: 18px;
}

body.pda-runtime-mode .pda-runtime-error {
  width: min(100%, 360px);
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fff7ed;
  color: #991b1b;
  padding: 18px;
  text-align: center;
  box-shadow: 0 12px 28px rgba(153, 27, 27, 0.12);
}

body.small-b-lookup-mode {
  min-height: 100svh;
  background: #eef4f8;
}

body.small-b-lookup-mode .app-shell {
  width: 100%;
  min-height: 100svh;
  padding: 0;
}

body.small-b-lookup-mode .workspace-top-panel,
body.small-b-lookup-mode .workspace-side-panel,
body.small-b-lookup-mode .workspace-page-bar {
  display: none !important;
}

body.small-b-lookup-mode .workspace-shell {
  display: block;
  min-height: 100svh;
}

body.small-b-lookup-mode #workspacePanels {
  display: grid;
  min-height: 100svh;
  place-items: center;
  padding: 24px 14px;
}

body.small-b-lookup-mode #contentSmallBLookupPanel {
  width: min(100%, 520px);
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.small-b-lookup-mode #contentSmallBLookupPanel > .panel-head {
  display: none !important;
}

.cashier-terminal-status {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 10px;
}

.cashier-terminal-status-chip {
  border: 1px solid rgba(24, 72, 79, 0.14);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 252, 247, 0.96) 0%, rgba(246, 239, 227, 0.94) 100%);
  padding: 12px 14px;
  display: grid;
  gap: 4px;
  color: #173136;
}

.cashier-terminal-status-chip span {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(72, 78, 88, 0.68);
}

.cashier-terminal-status-chip strong {
  font-size: 16px;
  line-height: 1.2;
  color: #102b30;
}

.cashier-terminal-locale-toggle {
  text-align: left;
  cursor: pointer;
}

.cashier-terminal-body {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(460px, 1.1fr);
  gap: 16px;
  align-items: start;
}

.cashier-terminal-main,
.cashier-terminal-side {
  display: grid;
  gap: 16px;
}

.cashier-terminal-side {
  position: sticky;
  top: 14px;
}

.cashier-terminal-card {
  border-radius: 24px;
  padding: 18px;
  background:
    radial-gradient(circle at top right, rgba(26, 96, 102, 0.08), transparent 24%),
    linear-gradient(180deg, rgba(255, 254, 250, 0.98) 0%, rgba(245, 239, 229, 0.98) 100%);
  border: 1px solid rgba(198, 184, 156, 0.54);
  box-shadow: 0 18px 42px rgba(19, 24, 28, 0.08);
}

.cashier-terminal-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.cashier-terminal-card-head h3 {
  margin: 2px 0 0;
  font-size: 24px;
  line-height: 1.2;
}

.cashier-terminal-card-meta {
  color: rgba(71, 77, 86, 0.72);
  font-size: 13px;
  line-height: 1.5;
  max-width: 240px;
  text-align: right;
}

.cashier-terminal-note-field {
  min-width: 240px;
  display: grid;
  gap: 6px;
}

.cashier-terminal-note-field span {
  font-size: 12px;
  color: rgba(72, 78, 88, 0.72);
}

.cashier-terminal-note-field input {
  min-height: 44px;
}

.cashier-terminal-scan-form {
  display: grid;
  grid-template-columns: minmax(240px, 1.2fr) minmax(220px, 1fr) auto;
  gap: 12px;
  align-items: end;
}

.cashier-terminal-scan-form .button-row {
  height: 100%;
  align-items: stretch;
}

.cashier-terminal-scan-form button {
  min-width: 116px;
}

.cashier-terminal-lookup {
  margin-top: 14px;
  border-radius: 18px;
  border: 1px solid rgba(203, 189, 160, 0.58);
  background: rgba(255, 255, 255, 0.72);
  padding: 16px;
}

.cashier-terminal-lookup-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.cashier-terminal-lookup-grid,
 .cashier-terminal-total-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cashier-terminal-lookup-grid article,
.cashier-terminal-total-grid article {
  border-radius: 16px;
  background: rgba(16, 43, 48, 0.04);
  padding: 12px;
  display: grid;
  gap: 6px;
}

.cashier-terminal-lookup-grid span,
.cashier-terminal-total-grid span {
  font-size: 12px;
  color: rgba(72, 78, 88, 0.76);
}

.cashier-terminal-lookup-grid strong,
.cashier-terminal-total-grid strong {
  font-size: 19px;
  color: #102b30;
}

.cashier-terminal-cart {
  display: block;
  max-height: 56vh;
  overflow: auto;
  padding-right: 2px;
  min-height: 0;
}

.cashier-cart-header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: 280px 130px 170px 110px 90px 90px 120px 56px;
  gap: 10px;
  min-width: 1066px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid rgba(203, 213, 225, 0.85);
  font-size: 12px;
  font-weight: 700;
}

.cashier-cart-row {
  display: grid;
  grid-template-columns: 250px 128px 120px 160px 100px 80px 84px 110px 56px;
  gap: 10px;
  align-items: center;
  min-width: 1066px;
  min-height: 60px;
  padding: 8px 12px;
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

.cashier-cart-row .remove-btn {
  justify-self: center;
}

.cart-code {
  display: grid;
  gap: 2px;
}

.cart-cell-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cart-cell-num {
  text-align: right;
  white-space: nowrap;
}

.cashier-terminal-cart-row {
  border-radius: 20px;
  border: 1px solid rgba(203, 189, 160, 0.54);
  background: rgba(255, 255, 255, 0.76);
  padding: 14px;
  display: grid;
  gap: 12px;
}

.cashier-terminal-cart-row.is-override-pending {
  border-color: rgba(188, 65, 57, 0.42);
  box-shadow: inset 0 0 0 1px rgba(188, 65, 57, 0.12);
}

.cashier-terminal-cart-row-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.cashier-terminal-cart-grid,
.cashier-terminal-drawer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.cashier-terminal-cart-grid label,
.cashier-terminal-drawer-grid label,
.cashier-terminal-payment-editor label {
  display: grid;
  gap: 6px;
}

.cashier-terminal-cart-grid span,
.cashier-terminal-drawer-grid span,
.cashier-terminal-payment-editor span {
  font-size: 12px;
  color: rgba(72, 78, 88, 0.76);
}

.cashier-terminal-cart-wide {
  grid-column: 1 / -1;
}

.cashier-terminal-cart-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cashier-terminal-flag {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(16, 43, 48, 0.08);
  font-size: 12px;
  color: #173136;
}

.cashier-terminal-flag.danger {
  background: rgba(188, 65, 57, 0.14);
  color: #8e2118;
}

.cashier-terminal-payment-mode-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.cashier-terminal-payment-mode-group button.active {
  background: #173136;
  color: #fff8ef;
}

.cashier-terminal-payment-editor {
  margin-top: 16px;
  display: grid;
  gap: 10px;
}

.cashier-terminal-payment-lines {
  align-items: start;
}

.cashier-terminal-payment-line {
  display: grid;
  grid-template-columns: 120px 1fr 1.1fr auto;
  gap: 8px;
  align-items: center;
}

.cashier-terminal-payment-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 16px;
}

.cashier-terminal-drawer {
  min-height: 260px;
}

.cashier-terminal-drawer-empty {
  display: grid;
  gap: 10px;
  align-content: start;
}

.cashier-terminal-quick-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.cashier-terminal-quick-actions button {
  min-height: 52px;
}

body.cashier-terminal-mode .cashier-terminal-shell button {
  border-radius: 16px;
}

body.cashier-terminal-mode .cashier-terminal-shell input,
body.cashier-terminal-mode .cashier-terminal-shell select,
body.cashier-terminal-mode .cashier-terminal-shell textarea {
  min-height: 46px;
  border-radius: 14px;
}

.workspace-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1 1 540px;
}

.workspace-session-strip {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
  margin-left: auto;
}

.session-meta-inline {
  color: rgba(248, 241, 229, 0.72);
  font-size: 14px;
  line-height: 1.4;
  white-space: nowrap;
}

.simple-list {
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--ink);
}

.simple-list li + li {
  margin-top: 6px;
}

.workspace-page-bar {
  display: grid;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 0;
}

.workspace-page-bar .eyebrow {
  margin-bottom: 4px;
  color: rgba(226, 232, 240, 0.66);
  font-size: 10px;
  letter-spacing: 0.12em;
}

#workspacePageTitle {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #ffffff;
}

.workspace-page-search {
  position: relative;
  display: flex;
  align-items: center;
}

.workspace-page-search-icon {
  position: absolute;
  left: 12px;
  width: 14px;
  height: 14px;
  border: 1.8px solid rgba(226, 232, 240, 0.48);
  border-radius: 999px;
}

.workspace-page-search-icon::after {
  content: "";
  position: absolute;
  right: -4px;
  bottom: -3px;
  width: 6px;
  height: 1.8px;
  border-radius: 999px;
  background: rgba(226, 232, 240, 0.48);
  transform: rotate(45deg);
  transform-origin: center;
}

.workspace-page-search input {
  width: 100%;
  height: 34px;
  border-radius: var(--radius-control);
  border: 1px solid rgba(226, 232, 240, 0.16);
  background: rgba(255, 255, 255, 0.04);
  padding: 0 14px 0 36px;
  font-size: 13px;
  color: #ffffff;
  box-shadow: none;
}

.workspace-page-search input::placeholder {
  color: rgba(226, 232, 240, 0.5);
}

.workspace-page-nav {
  display: grid;
  gap: 10px;
}

.workspace-page-section-group {
  display: grid;
  gap: 8px;
}

.workspace-page-section-group + .workspace-page-section-group {
  margin-top: 2px;
  padding-top: 12px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}

.workspace-page-section-group-title {
  padding: 0 2px 2px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0;
  color: rgba(226, 232, 240, 0.48);
}

@media (max-width: 1180px) {
  .cashier-terminal-status {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .cashier-terminal-body {
    grid-template-columns: 1fr;
  }

  .cashier-terminal-side {
    position: static;
  }

  .cashier-terminal-quick-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .cashier-terminal-status,
  .cashier-terminal-scan-form,
  .cashier-terminal-cart-grid,
  .cashier-terminal-drawer-grid,
  .cashier-manual-drawer-grid,
  .cashier-terminal-total-grid,
  .cashier-terminal-lookup-grid {
    grid-template-columns: 1fr;
  }

  .cashier-terminal-payment-line,
  .cashier-terminal-payment-actions,
  .cashier-terminal-quick-actions {
    grid-template-columns: 1fr;
  }
}

.workspace-page-section {
  display: grid;
  gap: 6px;
}

.workspace-page-section-head {
  padding: 0 2px;
}

.workspace-page-section-toggle {
  width: 100%;
  appearance: none;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
  color: inherit;
  font: inherit;
  text-align: left;
}

.workspace-page-section-title,
.workspace-page-section-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
}

.workspace-page-section-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.workspace-page-section-head strong {
  font-size: 12px;
  font-weight: 700;
  color: rgba(226, 232, 240, 0.72);
}

.workspace-page-section-icon svg {
  width: 16px;
  height: 16px;
  display: block;
}

.workspace-page-section-links {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  margin-left: 7px;
  padding-left: 12px;
  border-left: 0;
}

.workspace-page-section-links.collapsed {
  display: none;
}

.workspace-page-section[data-section="inbound"] .workspace-page-section-icon {
  color: rgba(226, 232, 240, 0.72);
}

.workspace-page-section[data-section="workorder"] .workspace-page-section-icon {
  color: rgba(226, 232, 240, 0.72);
}

.workspace-page-section[data-section="general"] .workspace-page-section-icon {
  color: rgba(226, 232, 240, 0.72);
}

.workspace-page-section-chevron {
  margin-left: auto;
  width: 8px;
  height: 8px;
  border-right: 1.6px solid rgba(226, 232, 240, 0.5);
  border-bottom: 1.6px solid rgba(226, 232, 240, 0.5);
  transform: rotate(45deg);
  transition: transform 160ms ease;
}

.workspace-page-section-toggle.collapsed .workspace-page-section-chevron {
  transform: rotate(-45deg);
}

.workspace-page-section-toggle:hover {
  background: transparent;
  box-shadow: none;
  filter: none;
  transform: none;
}

.workspace-page-link {
  width: 100%;
  appearance: none;
  position: relative;
  display: block;
  min-height: 34px;
  border-radius: var(--radius-control);
  padding: 7px 10px 7px 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
  color: rgba(226, 232, 240, 0.78);
  font-weight: 600;
  font-size: 13px;
  text-align: left;
  transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.workspace-page-link-title {
  display: block;
  min-width: 0;
  font-size: 13px;
  line-height: 1.35;
  word-break: break-word;
}

.workspace-page-link.active {
  background: var(--fw-sidebar-active);
  border-color: transparent;
  box-shadow: none;
  color: #ffffff;
}

.workspace-page-link.active::before {
  display: none;
}

.workspace-page-link:hover {
  background: rgba(226, 232, 240, 0.08);
  box-shadow: none;
  filter: none;
  transform: none;
}

.workspace-page-link[data-section="inbound"].active {
  color: #ffffff;
}

.workspace-page-link[data-section="workorder"].active {
  color: #ffffff;
}

.workspace-page-link[data-section="general"].active {
  color: #ffffff;
}

.workspace-side-panel[data-workspace="chinaProcurement"] .workspace-page-section-head strong {
  font-size: 12px;
  font-weight: 700;
  color: #94a3b8;
}

.workspace-side-panel[data-workspace="chinaProcurement"] .workspace-page-link {
  min-height: 36px;
  padding: 7px 11px;
  border-radius: 8px;
  color: #cbd5e1;
}

.workspace-side-panel[data-workspace="chinaProcurement"] .workspace-page-link.active {
  background: #1e40af;
  color: #ffffff;
}

.workspace-side-panel[data-workspace="warehouse"] .workspace-page-bar .button-row {
  display: none;
}

.workspace-side-panel[data-workspace="warehouse"] .workspace-page-bar {
  gap: 8px;
}

.workspace-tab:hover {
  transform: translateY(-1px);
}

@media (max-width: 1240px) {
  .workspace-page-section-links {
    grid-template-columns: 1fr;
  }

  .dev-board-grid {
    grid-template-columns: 1fr;
  }

  .dev-task-card-head {
    flex-direction: column;
  }

  .dev-task-card-head .button-row {
    width: 100%;
    justify-content: flex-start;
  }

  .sorting-task-flow,
  .sorting-task-layout,
  .sorting-task-toolbar {
    grid-template-columns: 1fr;
  }

  .sorting-task-item {
    grid-template-columns: 1fr;
  }

  .sorting-task-item-head {
    flex-direction: column;
  }

  .task-manager-time-grid {
    grid-template-columns: 1fr;
  }
}

.workspace-tab {
  width: auto;
  min-height: 34px;
  border-radius: var(--radius-control);
  padding: 7px 12px;
  background: var(--fw-surface);
  border: 1px solid var(--fw-border);
  color: var(--fw-text-muted);
  font-weight: 700;
  transition: transform 160ms ease, background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.workspace-tab.active {
  background: var(--fw-primary);
  color: #ffffff;
  border-color: var(--fw-primary);
  box-shadow: none;
}

[data-workspace-panel].workspace-hidden {
  display: none;
}

[data-workspace-panel].panel-hidden {
  display: none;
}

.panel {
  padding: 16px;
  border-radius: var(--radius-panel);
  background: var(--fw-surface);
  border-color: var(--fw-border);
  animation: panel-enter 240ms ease;
}

h1 {
  font-size: 30px;
}

h2 {
  font-size: 24px;
}

h3 {
  font-size: 18px;
}

.guide-panel {
  border: 2px solid #f0c36a;
  background: linear-gradient(180deg, #fff9ec 0%, #fffdf8 100%);
}

.guide-list {
  margin: 0;
  padding-left: 22px;
  display: grid;
  gap: 8px;
  line-height: 1.75;
  font-size: 19px;
}

.ops-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: 16px;
}

.panel[data-workspace-panel="operations"] {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at top right, rgba(17, 93, 100, 0.05), transparent 22%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.97) 0%, rgba(244, 237, 225, 0.9) 100%);
}

.panel[data-workspace-panel="operations"]::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, rgba(17, 93, 100, 0.84) 0%, rgba(239, 187, 94, 0.52) 100%);
  opacity: 0.76;
}

.ops-overview-card {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(205, 191, 165, 0.56);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(241, 247, 247, 0.88) 100%);
  box-shadow: 0 12px 26px rgba(13, 53, 57, 0.05);
}

.ops-overview-head {
  display: grid;
  gap: 4px;
}

.ops-overview-head strong {
  font-size: 22px;
  line-height: 1.15;
  color: var(--ink);
}

.ops-step-list,
.ops-role-list {
  gap: 10px;
}

.ops-step-item,
.ops-role-item {
  align-items: flex-start;
  padding: 11px 12px;
}

.ops-step-item span:first-child,
.ops-role-item span:first-child {
  color: var(--ink);
  font-weight: 700;
}

.ops-step-item span:last-child,
.ops-role-item span:last-child {
  font-size: 13px;
  color: rgba(90, 79, 61, 0.78);
}

.dev-board-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 16px;
}

.dev-board-card {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(207, 192, 170, 0.72);
  background: linear-gradient(180deg, #fffdf8 0%, #f8f1e6 100%);
  box-shadow: 0 10px 24px rgba(13, 53, 57, 0.06);
}

.dev-board-head {
  display: grid;
  gap: 4px;
}

.transfer-flow-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 4px;
}

.store-delivery-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin: 10px 0 12px;
}

.store-delivery-tab {
  width: auto;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border: 1px solid var(--fw-primary);
  border-radius: 8px;
  background: var(--fw-primary);
  color: #fff;
  padding: 0 16px;
  font-weight: 700;
  cursor: pointer;
}

.store-delivery-tab.active {
  border-color: var(--fw-primary-hover);
  background: var(--fw-primary-hover);
  color: #fff;
}

.store-delivery-page-intro {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
  padding: 12px 0 2px;
}

.store-delivery-page-intro h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.25;
}

.store-delivery-page-intro p {
  margin: 4px 0 0;
  color: var(--fw-muted);
  font-size: 13px;
}

.store-delivery-create-form,
.store-delivery-section,
.store-delivery-sdo-list {
  display: grid;
  gap: 12px;
}

.store-delivery-section {
  padding: 14px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: var(--fw-surface);
}

.store-delivery-transport-card {
  gap: 10px;
}

.store-delivery-transport-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 12px;
  align-items: start;
}

.store-delivery-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.store-delivery-field span {
  color: var(--fw-muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.store-delivery-field input,
.store-delivery-field textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: #fff;
  color: var(--fw-ink);
  font: inherit;
  box-shadow: none;
}

.store-delivery-field input {
  min-height: 40px;
  padding: 9px 11px;
}

.store-delivery-field textarea {
  min-height: 64px;
  padding: 10px 11px;
  resize: vertical;
}

.store-delivery-field--wide {
  grid-column: 1 / -1;
}

.store-delivery-sdo-row {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.store-delivery-history-search {
  margin-bottom: 12px;
  max-width: 520px;
}

.store-delivery-task-card,
.store-delivery-sdo-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: var(--fw-surface);
  box-shadow: var(--shadow-soft);
}

.store-delivery-card-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.store-delivery-card-main strong {
  display: block;
  font-size: 18px;
  line-height: 1.25;
}

.store-delivery-package-count {
  font-size: 18px;
  font-weight: 800;
  color: var(--fw-primary);
  white-space: nowrap;
}

.store-delivery-card-meta,
.store-delivery-driver-grid,
.store-delivery-timeline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.store-delivery-card-meta span,
.store-delivery-driver-grid span,
.store-delivery-timeline span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid var(--fw-border);
  border-radius: 6px;
  background: var(--fw-subtle);
  color: var(--fw-ink);
  font-size: 12px;
  font-weight: 700;
}

.store-delivery-driver-grid b,
.store-delivery-timeline b {
  color: var(--fw-muted);
  font-weight: 700;
}

.store-delivery-sdp-list {
  display: grid;
  gap: 8px;
  margin-top: 2px;
  padding-top: 10px;
  border-top: 1px solid var(--fw-border);
}

.store-delivery-sdp-row {
  display: grid;
  grid-template-columns: minmax(140px, 1.2fr) minmax(112px, 0.9fr) minmax(78px, 0.7fr) minmax(120px, 1fr) minmax(64px, 0.5fr);
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: var(--fw-subtle);
  color: var(--fw-muted);
  font-size: 12px;
  font-weight: 700;
}

.store-delivery-sdp-row strong {
  color: var(--fw-ink);
}

.store-delivery-history-list {
  display: grid;
  gap: 12px;
}

.store-delivery-breakdown-row strong {
  display: inline-flex;
  justify-content: flex-end;
}

@media (max-width: 720px) {
  .store-delivery-card-main {
    flex-direction: column;
    align-items: stretch;
  }

  .store-delivery-sdo-row {
    grid-template-columns: 1fr;
  }

  .store-delivery-transport-grid {
    grid-template-columns: 1fr;
  }

  .store-delivery-sdp-row {
    grid-template-columns: 1fr;
  }
}

.transfer-ops-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: 16px;
  align-items: start;
}

.transfer-ops-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: var(--radius-panel);
  border: 1px solid var(--fw-border);
  background: var(--fw-surface);
  box-shadow: var(--shadow-soft);
  align-content: start;
}

.transfer-ops-card .candidate-summary {
  margin: 0;
}

.transfer-prep-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.96fr);
  gap: 12px;
  align-items: start;
}

.transfer-prep-stack {
  display: grid;
  gap: 14px;
}

.manual-replenishment-context {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
  box-shadow: none;
}

.manual-replenishment-context h3 {
  margin: 0;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.25;
}

.manual-replenishment-context p {
  margin: 3px 0 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.manual-replenishment-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  align-items: center;
}

.manual-replenishment-meta span {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  padding: 4px 9px;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  font-weight: 600;
}

.manual-context-controls {
  gap: 8px;
}

.manual-context-control {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #e2e8f0;
  border-radius: 7px;
  background: #f8fafc;
  padding: 3px 7px;
}

.manual-context-control span {
  display: inline-flex;
  min-height: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}

.manual-context-control input {
  min-height: 24px;
  width: 112px;
  border: 0;
  background: transparent;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
  padding: 0;
  box-shadow: none;
}

.manual-context-control input[type="date"] {
  width: 132px;
}

.manual-context-control select {
  min-height: 30px;
  min-width: 160px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background-color: #ffffff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
  padding: 4px 32px 4px 10px;
  cursor: pointer;
  appearance: auto;
  background-image: linear-gradient(45deg, transparent 50%, #334155 50%), linear-gradient(135deg, #334155 50%, transparent 50%);
  background-position: calc(100% - 16px) calc(50% + 1px), calc(100% - 10px) calc(50% + 1px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}


.manual-context-control select:focus {
  outline: 2px solid rgba(37, 99, 235, 0.35);
  outline-offset: 1px;
}
.manual-context-control:focus-within {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
  background: #ffffff;
}

.manual-replenishment-layout {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(320px, 2fr);
  gap: 12px;
  align-items: start;
}

.manual-replenishment-entry-card,
.manual-replenishment-status-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow: none;
  padding: 12px;
}

.manual-replenishment-form {
  display: grid;
  gap: 12px;
}

.manual-replenishment-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.manual-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.manual-panel-head h3 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
  line-height: 1.3;
}

.manual-summary-section {
  display: grid;
  gap: 8px;
  padding: 10px 0;
  border-top: 1px solid #e2e8f0;
}

.manual-summary-section:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.manual-summary-title {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.manual-summary-title strong {
  color: #0f172a;
  font-size: 14px;
}

.manual-summary-title span,
.manual-summary-note,
.manual-summary-empty {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
}

.manual-summary-empty {
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
  border-radius: 6px;
  padding: 10px;
}

.manual-summary-compact {
  display: grid;
  gap: 8px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 9px;
}

.manual-summary-main {
  color: #0f172a;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
}

.manual-summary-pair,
.manual-suggestion-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
}

.manual-summary-pair strong,
.manual-suggestion-row strong {
  color: #0f172a;
  font-weight: 700;
  text-align: right;
}

.manual-suggestion-list {
  display: grid;
  gap: 6px;
}

.manual-suggestion-row {
  border-top: 1px solid #e2e8f0;
  padding-top: 6px;
}

.manual-replenishment-result {
  margin-top: 12px;
}

.transfer-items-compact-table {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  padding: 10px;
}

.transfer-items-table-head {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(120px, 1fr) minmax(82px, 0.6fr) 72px;
  gap: 8px;
  align-items: center;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 7px 7px 0 0;
  padding: 7px 8px;
}

.transfer-items-table-body {
  gap: 0;
  border: 1px solid #e2e8f0;
  border-top: 0;
  border-radius: 0 0 7px 7px;
  overflow: hidden;
}

.transfer-items-table-row {
  grid-template-columns: minmax(0, 1fr) 72px;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  padding: 5px 8px;
  background: #ffffff;
  border: 0;
  border-top: 1px solid #e2e8f0;
  border-radius: 0;
}

.transfer-items-table-row .line-builder-grid {
  grid-template-columns: minmax(120px, 1fr) minmax(120px, 1fr) minmax(82px, 0.6fr);
  gap: 8px;
  align-items: center;
}

.transfer-items-table-row [data-builder-row-meta] {
  display: none;
}

.transfer-items-table-cell label {
  display: none;
}

.transfer-items-table-cell {
  gap: 0;
}

.transfer-items-table-cell input,
.transfer-items-table-cell select {
  min-height: 34px;
  border-color: #e2e8f0;
  background: #ffffff;
  font-size: 13px;
  padding: 5px 8px;
}

.transfer-items-table-row .line-builder-remove {
  justify-self: stretch;
  align-self: center;
  min-height: 30px;
  padding: 4px 8px;
  font-size: 12px;
}

.manual-next-action-panel {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px;
}

.manual-next-action-panel button {
  min-height: 40px;
  width: 100%;
}

.replenishment-workorder-shell {
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
}

.warehouse-prep-shell {
  display: grid;
  gap: 18px;
}

.warehouse-prep-card {
  align-content: start;
}

.transfer-workbench-head {
  display: grid;
  gap: 4px;
}

.transfer-workbench-head.is-compact {
  gap: 4px;
}

.transfer-workbench-head h3 {
  margin: 0;
  color: var(--ink);
}

.transfer-workbench-head p {
  margin: 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.transfer-prep-form-card,
.transfer-prep-summary-card,
.warehouse-prep-overview,
.warehouse-prep-print-card {
  background: var(--fw-surface);
}

.warehouse-prep-toolbar {
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 220px) auto;
  align-items: center;
}

.field-control {
  display: grid;
  gap: 5px;
}

.field-control span {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
}

.field-control select {
  width: 100%;
}

.loose-pick-sheet-card {
  align-items: stretch;
  gap: 18px;
}

.loose-pick-sheet-main {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.loose-pick-barcode {
  display: grid;
  gap: 8px;
  max-width: 420px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(13, 92, 99, 0.25);
  background: #fff;
  box-shadow: 0 12px 30px rgba(22, 32, 33, 0.08);
}

.barcode-stripes {
  display: block;
  height: 56px;
  border-radius: 8px;
  background:
    repeating-linear-gradient(
      90deg,
      #101010 0 3px,
      transparent 3px 6px,
      #101010 6px 8px,
      transparent 8px 13px,
      #101010 13px 18px,
      transparent 18px 23px
    );
}

.loose-pick-barcode strong {
  letter-spacing: 0.12em;
  overflow-wrap: anywhere;
  color: var(--ink);
}

.loose-pick-line-list {
  display: grid;
  gap: 6px;
  max-width: 760px;
  margin-top: 4px;
}

.loose-pick-label-actions {
  min-width: 230px;
  align-items: stretch;
}

.loose-pick-print-label.is-preview {
  width: 220px;
  min-height: 148px;
  display: grid;
  gap: 7px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(13, 92, 99, 0.22);
  background: #fff;
  box-shadow: 0 10px 24px rgba(22, 32, 33, 0.08);
}

.loose-pick-print-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
  color: var(--ink);
}

.loose-pick-print-top strong,
.loose-pick-print-top span {
  font-weight: 800;
  white-space: nowrap;
}

.loose-pick-print-top strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.loose-pick-template-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  border-radius: 13px;
  background: rgba(13, 92, 99, 0.08);
}

.loose-pick-print-code {
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  overflow-wrap: anywhere;
}

.loose-pick-print-details {
  display: grid;
  gap: 4px;
}

.loose-pick-print-details span {
  display: block;
  padding: 4px 6px;
  border-radius: 9px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--teal);
  font-size: 9px;
  font-weight: 800;
  line-height: 1.25;
}

.loose-pick-print-foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
}

.warehouse-prep-main {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: 16px;
  align-items: start;
}

.warehouse-prep-lanes {
  display: grid;
  gap: 16px;
}

.replenishment-flow-report {
  display: grid;
  gap: 16px;
}

.replenishment-flow-step-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
}

.flow-step-card {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(200, 186, 158, 0.55);
  background: rgba(255, 255, 255, 0.72);
}

.flow-step-card strong {
  color: var(--ink);
}

.flow-step-card span {
  color: rgba(90, 79, 61, 0.86);
  font-size: 13px;
  line-height: 1.55;
}

.flow-step-card.is-completed {
  border-color: rgba(24, 108, 89, 0.26);
  background: linear-gradient(180deg, rgba(236, 250, 244, 0.92) 0%, rgba(226, 245, 238, 0.78) 100%);
}

.flow-step-card.is-active {
  border-color: rgba(13, 92, 99, 0.32);
  background: linear-gradient(180deg, rgba(234, 247, 248, 0.92) 0%, rgba(223, 241, 243, 0.8) 100%);
  box-shadow: inset 0 0 0 1px rgba(13, 92, 99, 0.05);
}

.flow-step-card.is-pending {
  background: rgba(249, 244, 236, 0.78);
}

.warehouse-prep-print-card {
  position: sticky;
  top: 18px;
}

.warehouse-prep-main .transfer-draft-list {
  margin-top: 0;
}

.warehouse-prep-main .candidate-row {
  min-height: 124px;
}

.warehouse-prep-card .candidate-summary,
.warehouse-prep-card .report-summary {
  margin: 0;
}

.warehouse-prep-card .transfer-draft-list {
  display: grid;
  gap: 12px;
}

.warehouse-prep-card .transfer-draft-row {
  padding: 16px;
  border-radius: 18px;
}

.warehouse-prep-card .transfer-draft-row .candidate-side-actions {
  gap: 10px;
  min-width: 132px;
}

.warehouse-prep-card .warehouse-prep-toolbar {
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.15fr) auto;
}

.replenishment-workorder-shell .warehouse-prep-toolbar {
  grid-template-columns: minmax(220px, 1fr) auto;
}

.transfer-error-summary {
  gap: 12px;
}

.transfer-error-summary .alert-banner {
  margin-bottom: 0;
}

.transfer-error-summary .candidate-summary-grid {
  margin-top: 0;
}

.transfer-error-summary .subtle.small {
  display: block;
  margin-top: 0;
  line-height: 1.6;
}

.dev-board-head strong {
  font-size: 22px;
  line-height: 1.15;
  color: var(--ink);
}

.dev-roadmap-list {
  margin: 0;
  padding-left: 22px;
  display: grid;
  gap: 14px;
}

.dev-roadmap-list li {
  display: grid;
  gap: 8px;
  color: var(--ink);
}

.dev-roadmap-list li > div {
  display: grid;
  gap: 5px;
}

.dev-roadmap-list strong {
  font-size: 18px;
  line-height: 1.2;
}

.dev-roadmap-list p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
}

.dev-roadmap-list li.is-current {
  padding: 12px 14px;
  margin-left: -14px;
  border-radius: 16px;
  background: linear-gradient(180deg, #f4fbfa 0%, #eaf5f3 100%);
  border: 1px solid rgba(13, 92, 99, 0.18);
}

.dev-task-stack {
  display: grid;
  gap: 12px;
}

.dev-task-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(207, 192, 170, 0.62);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(250, 244, 235, 0.98) 100%);
  box-shadow: 0 8px 18px rgba(13, 53, 57, 0.04);
}

.dev-task-card.is-current {
  border-color: rgba(13, 92, 99, 0.22);
  background: linear-gradient(180deg, #f3fbfa 0%, #ebf6f4 100%);
}

.dev-task-card.is-done {
  opacity: 0.8;
  background: linear-gradient(180deg, rgba(248, 244, 236, 0.95) 0%, rgba(243, 239, 232, 0.98) 100%);
}

.dev-task-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
}

.dev-task-card-head strong {
  display: block;
  font-size: 19px;
  line-height: 1.28;
  color: var(--ink);
}

.dev-task-card-head .chip-row {
  margin-top: 10px;
}

.dev-task-card-head .button-row {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.dev-task-card-head .button-row button[disabled] {
  opacity: 0.4;
  pointer-events: none;
}

.dev-task-delete {
  border-color: var(--danger-line);
  background: var(--danger-soft);
  color: var(--danger-ink);
}

.dev-task-card-detail {
  margin: 0;
  color: rgba(58, 51, 38, 0.84);
  font-size: 15px;
  line-height: 1.65;
}

.dev-task-next {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(13, 92, 99, 0.06);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.55;
}

#devTaskForm textarea {
  min-height: 112px;
}

#devTrackerSummary .flow-summary-note {
  margin-bottom: 12px;
}

.dev-todo-group {
  display: grid;
  gap: 8px;
}

.dev-todo-group h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  color: var(--ink);
}

.dev-todo-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
  color: var(--ink);
}

.dev-todo-list li {
  line-height: 1.6;
  color: rgba(58, 51, 38, 0.92);
}

.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e2e8f0;
}

.panel-head h2 {
  font-size: 27px;
  letter-spacing: 0;
}

.panel-head > button {
  width: auto;
  flex: 0 0 auto;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.card {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
  background: linear-gradient(180deg, #fffdf8 0%, #faf6ef 100%);
}

.card-label {
  color: var(--muted);
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.card-value {
  font-size: 34px;
  font-weight: 700;
  margin-top: 10px;
}

.store-summary-grid {
  display: grid;
  gap: 14px;
}

.store-summary-item {
  border-top: 1px solid #e2e8f0;
  padding-top: 18px;
  display: grid;
  gap: 12px;
}

.store-summary-item:first-child {
  border-top: none;
  padding-top: 0;
}

.store-summary-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.store-summary-title {
  display: grid;
  gap: 4px;
}

.store-summary-title strong {
  font-size: 24px;
}

.store-status-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  background: var(--accent-soft);
  color: var(--accent);
}

.store-status-chip.closed {
  background: #f0e9dc;
  color: var(--muted);
}

.store-status-chip.warning {
  background: var(--danger-soft);
  color: var(--danger-ink);
}

.store-summary-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}

.store-metric {
  padding: 10px 12px;
  border-radius: var(--radius-panel);
  border: 1px solid var(--fw-border);
  background: var(--fw-surface);
  box-shadow: none;
}

.store-metric strong {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 4px;
}

.store-metric span {
  font-size: 22px;
  font-weight: 700;
}

.store-metric small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.store-metric.problem-card {
  border-color: rgba(217, 119, 6, 0.35);
  background: #fff7ed;
}

.store-inventory-overview-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 280px) minmax(140px, 220px);
  gap: 10px;
  align-items: end;
  margin: 4px 0 8px;
}

.store-inventory-overview-toolbar label {
  display: grid;
  gap: 5px;
  margin: 0;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.store-inventory-overview-toolbar select,
.store-inventory-overview-toolbar button {
  min-height: 38px;
}

.store-inventory-overview-toolbar button {
  width: auto;
}

.store-inventory-overview-compact {
  margin-top: 8px;
  padding: 6px;
}

.store-inventory-compact-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 6px;
}

.store-inventory-status-pill {
  display: grid;
  gap: 2px;
  min-height: 48px;
  padding: 6px 8px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-inventory-status-pill strong {
  overflow: hidden;
  color: #475569;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-inventory-status-pill span {
  overflow: hidden;
  color: #0f172a;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-inventory-status-pill small {
  overflow: hidden;
  color: #64748b;
  font-size: 9px;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-inventory-status-pill.is-total,
.store-inventory-status-pill.is-front {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.store-inventory-status-pill.is-warning {
  border-color: #fed7aa;
  background: #fff7ed;
}

.store-inventory-status-pill.is-money span {
  font-size: 14px;
}

.store-inventory-status-pill button {
  width: fit-content;
  min-height: 24px;
  padding: 3px 8px;
  font-size: 11px;
}

.store-inventory-detail-demo {
  margin-top: 12px;
}

.store-inventory-detail-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.store-inventory-detail-header strong {
  display: block;
  font-size: 15px;
}

.store-inventory-detail-header span:not(.meta-pill) {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.store-inventory-detail-demo-row td {
  background: rgba(37, 99, 235, 0.03);
}

.inventory-location-special td {
  background: rgba(37, 99, 235, 0.05);
}

.inventory-location-warning td {
  background: rgba(217, 119, 6, 0.06);
}

.store-summary-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.matrix-table-shell {
  overflow-x: auto;
  border: 1px solid var(--fw-border);
  border-radius: var(--radius-panel);
  background: var(--fw-surface);
}

.matrix-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 780px;
}

.matrix-table th,
.matrix-table td {
  padding: 7px 9px;
  border-bottom: 1px solid var(--fw-border);
  text-align: left;
  vertical-align: top;
  font-size: 13px;
  line-height: 1.45;
}

.matrix-table thead th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  background: var(--fw-surface-muted);
}

.matrix-table tbody tr:last-child td {
  border-bottom: none;
}

th {
  background: var(--fw-surface-muted);
}

td,
th {
  padding: 7px 9px;
}

.store-summary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.store-summary-actions button {
  width: auto;
}

.store-flag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--fw-surface-muted);
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.store-flag.danger {
  background: var(--danger-soft);
  color: var(--danger-ink);
}

.closing-checklist {
  display: grid;
  gap: 12px;
}

.closing-checklist-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.closing-checklist-panel {
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(207, 192, 170, 0.8);
  background: linear-gradient(180deg, #fffdf8 0%, #f8f1e5 100%);
}

.closing-checklist-panel strong {
  display: block;
  margin-bottom: 6px;
}

.area-supervisor-panel {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  box-shadow: none;
}

body.area-supervisor-workspace-mode .workspace-page-bar .button-row,
body.area-supervisor-workspace-mode .workspace-page-search {
  display: none;
}

body.area-supervisor-workspace-mode .workspace-page-bar {
  gap: 0;
  padding-bottom: 0;
}

.area-supervisor-page {
  display: grid;
  gap: 18px;
  color: #111827;
}

.area-supervisor-topbar,
.area-supervisor-page-head,
.area-supervisor-toolbar,
.area-supervisor-detail-head,
.area-supervisor-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.area-supervisor-topbar {
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
}

.area-supervisor-topbar h2,
.area-supervisor-page-head h3,
.area-supervisor-detail-card h3 {
  margin: 0;
  color: #111827;
  letter-spacing: 0;
}

.area-supervisor-topbar p,
.area-supervisor-page-head p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
}

.area-supervisor-online {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
  font-size: 12px;
  font-weight: 700;
}

.area-supervisor-page-head {
  align-items: flex-start;
}

.area-supervisor-page-head button,
.area-supervisor-work-card button,
.area-supervisor-drawer-actions button:not(.ghost-button):not(.danger-button),
.area-supervisor-detail-actions button:first-child {
  width: auto;
  border-radius: 8px;
  background: #2563eb;
  color: #ffffff;
  border: 1px solid #2563eb;
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.18);
}

.area-supervisor-notice,
.area-supervisor-empty-card {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #475569;
}

.area-supervisor-notice.is-success {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1e40af;
}

.area-supervisor-notice.is-error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

.area-supervisor-workbench-grid,
.area-supervisor-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.area-supervisor-work-card,
.area-supervisor-stat-card,
.area-supervisor-store-card,
.area-supervisor-detail-card {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
}

.area-supervisor-work-card {
  display: grid;
  gap: 10px;
  padding: 18px;
}

.area-supervisor-work-card strong {
  font-size: 18px;
}

.area-supervisor-work-card span {
  color: #64748b;
  line-height: 1.5;
}

.area-supervisor-stat-card {
  padding: 14px;
}

.area-supervisor-stat-card span {
  display: block;
  color: #64748b;
  font-size: 13px;
  margin-bottom: 6px;
}

.area-supervisor-stat-card strong {
  font-size: 26px;
  line-height: 1;
}

.area-supervisor-toolbar {
  padding: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

.area-supervisor-toolbar input,
.area-supervisor-toolbar select,
.area-supervisor-form input,
.area-supervisor-form select,
.area-supervisor-form textarea {
  width: 100%;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #111827;
}

.area-supervisor-toolbar input {
  min-width: 240px;
  flex: 1;
}

.area-supervisor-toolbar select {
  max-width: 180px;
}

.area-supervisor-toolbar-wide {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(130px, 170px));
}

.area-supervisor-toolbar-wide select {
  max-width: none;
}

.area-supervisor-store-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 14px;
  align-items: start;
}

.area-supervisor-store-list {
  display: grid;
  gap: 12px;
}

.area-supervisor-store-card {
  padding: 14px;
}

.area-supervisor-store-card.is-selected {
  border-color: #2563eb;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.12);
}

.area-supervisor-card-head strong {
  display: block;
  color: #111827;
  font-size: 16px;
}

.area-supervisor-card-head span {
  color: #64748b;
  font-size: 12px;
}

.area-supervisor-card-lines,
.area-supervisor-detail-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  color: #475569;
  font-size: 13px;
}

.area-supervisor-card-actions,
.area-supervisor-detail-actions,
.area-supervisor-table-actions,
.area-supervisor-drawer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.area-supervisor-card-actions .secondary-inline,
.area-supervisor-detail-actions .secondary-inline,
.area-supervisor-table-actions .secondary-inline {
  width: auto;
  min-height: 32px;
  border: 1px solid #bfdbfe;
  background: #ffffff;
  color: #1d4ed8;
  box-shadow: none;
}

.area-supervisor-card-actions .secondary-inline:hover,
.area-supervisor-detail-actions .secondary-inline:hover,
.area-supervisor-table-actions .secondary-inline:hover {
  background: #eff6ff;
  color: #1e40af;
}

.area-supervisor-detail-card {
  position: sticky;
  top: 12px;
  padding: 16px;
}

.area-supervisor-detail-head {
  align-items: flex-start;
  padding-bottom: 12px;
  border-bottom: 1px solid #e5e7eb;
}

.area-supervisor-detail-head strong {
  display: block;
  margin-top: 6px;
}

.area-supervisor-detail-list {
  margin: 14px 0 0;
}

.area-supervisor-detail-list div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
}

.area-supervisor-detail-list dt {
  color: #64748b;
}

.area-supervisor-detail-list dd {
  margin: 0;
  color: #111827;
  word-break: break-word;
}

.area-supervisor-floor-plan-binding {
  display: grid;
  gap: 8px;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
}

.area-supervisor-floor-plan-binding strong {
  color: #1e3a8a;
}

.area-supervisor-floor-plan-binding label {
  display: grid;
  gap: 5px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.area-supervisor-floor-plan-binding select {
  width: 100%;
  min-height: 34px;
  border: 1px solid #93c5fd;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
}

.area-supervisor-floor-plan-binding p {
  margin: 0;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.45;
}

.area-supervisor-floor-plan-binding .area-supervisor-binding-warning {
  padding: 8px 10px;
  border: 1px solid #fde68a;
  border-radius: 8px;
  background: #fffbeb;
  color: #92400e;
}

.area-supervisor-staff-table {
  overflow-x: auto;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
}

.area-supervisor-staff-table table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}

.area-supervisor-staff-table th,
.area-supervisor-staff-table td {
  padding: 12px;
  border-bottom: 1px solid #e5e7eb;
  text-align: left;
  vertical-align: middle;
  font-size: 13px;
}

.area-supervisor-staff-table th {
  color: #64748b;
  background: #f8fafc;
  font-weight: 700;
}

.area-supervisor-staff-table tr:last-child td {
  border-bottom: none;
}

.area-supervisor-staff-table tr.is-inactive {
  color: #64748b;
  background: #f8fafc;
}

.area-supervisor-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: flex;
  justify-content: flex-end;
  background: rgba(15, 23, 42, 0.34);
}

.area-supervisor-drawer-backdrop[hidden] {
  display: none;
}

.area-supervisor-drawer {
  width: min(520px, 100%);
  height: 100%;
  overflow-y: auto;
  background: #ffffff;
  border-left: 1px solid #e5e7eb;
  box-shadow: -18px 0 36px rgba(15, 23, 42, 0.14);
  padding: 18px;
  display: grid;
  align-content: start;
  gap: 16px;
}

.area-supervisor-drawer-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e5e7eb;
}

.area-supervisor-drawer-head h3 {
  margin: 0;
}

.area-supervisor-drawer-head p,
.area-supervisor-help {
  margin: 4px 0 0;
  color: #64748b;
  line-height: 1.45;
}

.area-supervisor-form[hidden],
.area-supervisor-confirm[hidden] {
  display: none;
}

.area-supervisor-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.area-supervisor-form label {
  display: grid;
  gap: 6px;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
}

.area-supervisor-form-wide,
.area-supervisor-drawer-actions,
.area-supervisor-help {
  grid-column: 1 / -1;
}

.area-supervisor-confirm {
  display: grid;
  gap: 10px;
}

.area-supervisor-confirm h4 {
  margin: 0;
  font-size: 18px;
}

.area-supervisor-confirm p {
  margin: 0;
  color: #475569;
}

.danger-button {
  width: auto;
  border-radius: 8px;
  background: #dc2626;
  color: #ffffff;
  border: 1px solid #dc2626;
}

@media (max-width: 860px) {
  .area-supervisor-store-layout,
  .area-supervisor-toolbar-wide,
  .area-supervisor-form {
    grid-template-columns: 1fr;
  }

  .area-supervisor-toolbar,
  .area-supervisor-topbar,
  .area-supervisor-page-head {
    align-items: stretch;
    flex-direction: column;
  }

  .area-supervisor-toolbar select {
    max-width: none;
  }

  .area-supervisor-detail-card {
    position: static;
  }
}

.closing-checklist-list {
  display: grid;
  gap: 8px;
}

.closing-checklist-item {
  padding: 10px 12px;
  border-radius: 12px;
  background: #f7f2ea;
  border: 1px solid var(--line);
}

.closing-checklist-item.danger {
  background: var(--danger-soft);
  border-color: var(--danger-line);
}

.report-summary {
  display: grid;
  gap: 12px;
}

.report-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.store-floor-plan-layout {
  display: grid;
  gap: 16px;
}

.store-floor-plan-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.store-floor-plan-load-control {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}

.store-floor-plan-load-control select {
  min-height: 36px;
  max-width: 260px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
}

.store-floor-plan-load-control button {
  white-space: nowrap;
}

.store-floor-plan-toolbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: minmax(260px, 1.12fr) minmax(160px, 0.58fr) minmax(190px, 0.68fr) minmax(230px, 0.72fr) minmax(210px, 0.68fr);
  gap: 6px;
  align-items: stretch;
  padding: 6px;
  border: 1px solid #dbe3f0;
  background: rgba(248, 250, 252, 0.96);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(8px);
}

.store-floor-plan-form {
  display: grid;
  gap: 5px;
}

.store-floor-plan-form label {
  display: grid;
  gap: 2px;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
}

.store-floor-plan-form input,
.store-floor-plan-form select {
  width: 100%;
  min-height: 28px;
  padding: 4px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #ffffff;
  color: #0f172a;
  font-size: 12px;
}

.store-floor-plan-identity-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(104px, 1fr));
  gap: 4px;
}

.store-floor-plan-dimensions {
  display: grid;
  grid-template-columns: repeat(4, minmax(58px, 1fr));
  gap: 4px;
}

.store-floor-plan-selected-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(58px, 1fr));
  gap: 4px;
}

.store-floor-plan-tool-block {
  display: grid;
  gap: 4px;
  align-self: stretch;
  align-content: start;
  padding-left: 6px;
  border-left: 1px solid #e2e8f0;
}

.store-floor-plan-tool-block > span {
  color: #475569;
  font-size: 11px;
  font-weight: 800;
}

.store-floor-plan-tools,
.store-floor-plan-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(54px, 1fr));
  gap: 4px;
}

.store-floor-plan-tools button,
.store-floor-plan-actions button,
.store-floor-plan-wall-row,
.store-floor-plan-object-row {
  min-height: 28px;
  padding: 4px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #ffffff;
  color: #1e293b;
  font-size: 12px;
  font-weight: 800;
  box-shadow: none;
}

.store-floor-plan-tools button.is-active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.store-floor-plan-tools button[data-store-floor-plan-tool="delete"].is-active {
  border-color: #fca5a5;
  background: #fef2f2;
  color: #b91c1c;
}

.store-floor-plan-object-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.store-floor-plan-object-row {
  display: grid;
  justify-items: start;
  padding: 10px;
  text-align: left;
}

.store-floor-plan-object-row strong {
  color: #0f172a;
}

.store-floor-plan-object-row span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.store-floor-plan-object-row.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
}

.store-floor-plan-measure-card {
  grid-column: 1 / -1;
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  background: #eff6ff;
  color: #1e3a8a;
}

.store-floor-plan-measure-card strong {
  color: #1e3a8a;
  font-size: 13px;
}

.store-floor-plan-measure-card small {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.store-floor-plan-measure-card div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-size: 12px;
  font-weight: 800;
}

.store-floor-plan-workbench {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.store-floor-plan-canvas {
  position: relative;
  display: grid;
  min-height: clamp(620px, 68vh, 860px);
  padding: 24px;
  border: 1px solid #dbe3f0;
  background: #f8fafc;
  overflow: auto;
}

.store-floor-plan-svg {
  width: 100%;
  min-width: 860px;
  min-height: clamp(560px, 62vh, 800px);
  background: #ffffff;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}

.store-floor-plan-grid {
  fill: url("#storeFloorPlanGridPattern");
}

.store-floor-plan-grid-path {
  fill: none;
  stroke: #e2e8f0;
  stroke-width: 0.025;
}

.store-floor-plan-polygon {
  fill: rgba(239, 246, 255, 0.62);
  stroke: none;
}

.store-floor-plan-wall-line {
  stroke: #0f172a;
  stroke-width: 0.12;
  stroke-linecap: square;
  cursor: pointer;
}

.store-floor-plan-wall-line.is-selected {
  stroke: #2563eb;
  stroke-width: 0.18;
}

.store-floor-plan-draft-line {
  stroke: #2563eb;
  stroke-width: 0.08;
  stroke-dasharray: 0.18 0.16;
  stroke-linecap: square;
}

.store-floor-plan-measure-line {
  fill: none;
  stroke: #2563eb;
  stroke-width: 0.045;
  stroke-dasharray: 0.12 0.1;
  stroke-linecap: square;
  pointer-events: none;
}

.store-floor-plan-measure-line.is-secondary {
  stroke: #64748b;
}

.store-floor-plan-measure-label {
  fill: #1d4ed8;
  paint-order: stroke;
  stroke: #ffffff;
  stroke-width: 0.08;
  font-size: 0.24px;
  font-weight: 800;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}

.store-floor-plan-measure-label.is-secondary {
  fill: #475569;
}

.store-floor-plan-measure-point {
  fill: #2563eb;
  stroke: #ffffff;
  stroke-width: 0.03;
  pointer-events: none;
}

.store-floor-plan-measure-point.is-secondary {
  fill: #64748b;
}

.store-floor-plan-wall-node {
  fill: #0f172a;
  cursor: pointer;
}

.store-floor-plan-wall-node.is-selected {
  fill: #2563eb;
}

.store-floor-plan-wall-label {
  fill: #475569;
  paint-order: stroke;
  stroke: #ffffff;
  stroke-width: 0.08;
  font-size: 0.34px;
  font-weight: 800;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: auto;
  cursor: pointer;
}

.store-floor-plan-marker {
  cursor: pointer;
  outline: none;
}

.store-floor-plan-marker.is-door rect {
  fill: #dbeafe;
  stroke: #1d4ed8;
  stroke-width: 0.06;
}

.store-floor-plan-marker.is-door line {
  stroke: #1d4ed8;
  stroke-width: 0.04;
}

.store-floor-plan-marker.is-column rect {
  fill: #000000;
  stroke: #000000;
  stroke-width: 0.08;
}

.store-floor-plan-marker.is-selected rect {
  stroke: #2563eb;
  stroke-width: 0.12;
}

.store-floor-plan-wall-row {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  text-align: left;
}

.store-floor-plan-wall-row strong {
  color: #0f172a;
  font-size: 13px;
}

.store-floor-plan-wall-row span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.store-floor-plan-wall-row.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
}

.store-floor-plan-summary {
  border-color: #cbd5e1;
}

.store-floor-plan-summary.is-error {
  border-color: #fecaca;
  background: #fef2f2;
}

@media (max-width: 1280px) {
  .store-floor-plan-toolbar {
    grid-template-columns: minmax(260px, 1.2fr) minmax(180px, 0.8fr) minmax(220px, 1fr);
  }
}

@media (max-width: 980px) {
  .store-floor-plan-toolbar {
    grid-template-columns: 1fr;
  }

  .store-floor-plan-canvas {
    min-height: 520px;
    padding: 16px;
  }

  .store-floor-plan-svg {
    min-width: 680px;
    min-height: 500px;
  }
}

.shelf-design-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.shelf-design-library-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.shelf-design-library-toolbar select {
  min-height: 36px;
  max-width: 280px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
}

.shelf-design-library-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.shelf-design-partition-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.shelf-design-partition-tab {
  min-height: 38px;
  padding: 7px 9px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
  box-shadow: none;
}

.shelf-design-partition-tab.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.shelf-design-card-list {
  display: grid;
  gap: 8px;
}

.shelf-design-partition-section {
  display: grid;
  gap: 8px;
}

.shelf-design-partition-section + .shelf-design-partition-section {
  margin-top: 12px;
}

.shelf-design-partition-section h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  color: #0f172a;
  font-size: 13px;
  line-height: 1.3;
}

.shelf-design-partition-section h3 span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  min-height: 22px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #047857;
  font-size: 12px;
  font-weight: 900;
}

.shelf-design-card {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 86px;
  padding: 9px 10px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  text-align: left;
  box-shadow: none;
}

.shelf-design-card-thumb {
  display: block;
  width: 72px;
  height: 68px;
  overflow: hidden;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #f8fafc;
}

.shelf-design-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.shelf-design-card-thumb.is-empty {
  background: repeating-linear-gradient(
    135deg,
    #f8fafc 0,
    #f8fafc 8px,
    #e2e8f0 8px,
    #e2e8f0 16px
  );
}

.shelf-design-card-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.shelf-design-card-copy strong,
.shelf-design-card-copy span,
.shelf-design-card-copy small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.shelf-design-card-copy strong {
  font-size: 14px;
  line-height: 1.35;
}

.shelf-design-card-copy span,
.shelf-design-card-copy small {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

.shelf-design-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.shelf-design-card-meta b,
.shelf-design-card-meta em {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  padding: 2px 6px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.shelf-design-card-meta em {
  background: #fff7ed;
  color: #9a3412;
}

.shelf-design-card.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
}

.shelf-design-preview-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.shelf-design-vector-preview {
  min-height: 420px;
  padding: 18px;
  border: 1px solid #dbe3f0;
  background: #f8fafc;
  overflow: auto;
}

.shelf-design-vector-svg {
  width: 100%;
  min-width: 620px;
  min-height: 360px;
  background: #ffffff;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}

.shelf-design-vector-grid {
  fill: url("#shelfDesignVectorGrid");
}

.shelf-design-vector-grid-path {
  fill: none;
  stroke: #e2e8f0;
  stroke-width: 0.01;
}

.shelf-design-finished-footprint {
  fill: rgba(219, 234, 254, 0.36);
  stroke: #2563eb;
  stroke-width: 0.045;
  stroke-dasharray: 0.12 0.08;
}

.shelf-design-body {
  fill: #e2e8f0;
  stroke: #0f172a;
  stroke-width: 0.05;
}

.shelf-design-body.is-white {
  fill: #f8fafc;
  stroke: #64748b;
}

.shelf-design-body.is-silver {
  fill: #cbd5e1;
  stroke: #475569;
}

.shelf-design-body.is-black {
  fill: #111827;
  stroke: #020617;
}

.shelf-design-wall-strip {
  fill: #94a3b8;
  stroke: #475569;
  stroke-width: 0.03;
}

.shelf-design-rail-line {
  stroke: #0f172a;
  stroke-width: 0.035;
}

.shelf-design-body-bar {
  stroke: #0f172a;
  stroke-linecap: square;
}

.shelf-design-body-bar.is-inverted {
  stroke: #f8fafc;
}

.shelf-design-i-beam-flange,
.shelf-design-i-beam-web {
  fill: #cbd5e1;
  stroke: #475569;
  stroke-width: 0.045;
}

.shelf-design-i-beam-side-flange,
.shelf-design-i-beam-cross-web {
  fill: #cbd5e1;
  stroke: #475569;
  stroke-width: 0.045;
}

.shelf-design-i-beam-flange.is-white,
.shelf-design-i-beam-web.is-white {
  fill: #f8fafc;
  stroke: #64748b;
}

.shelf-design-i-beam-flange.is-black,
.shelf-design-i-beam-web.is-black {
  fill: #111827;
  stroke: #020617;
}

.shelf-design-hatched-panel {
  fill: #f8fafc;
  stroke: #0f172a;
  stroke-linejoin: round;
  stroke-width: 0.055;
}

.shelf-design-hatched-divider {
  stroke: #0f172a;
  stroke-linecap: round;
  stroke-width: 0.045;
}

.shelf-design-hatched-fill {
  fill: #0f172a;
  stroke: none;
}

.shelf-design-pipeline-frame,
.shelf-design-round-ring {
  fill: none;
  stroke: #475569;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 0.08;
}

.shelf-design-pipeline-frame.is-silver,
.shelf-design-round-ring.is-silver {
  stroke: #64748b;
}

.shelf-design-pipeline-rail,
.shelf-design-round-spoke {
  stroke: #64748b;
  stroke-linecap: round;
}

.shelf-design-round-spoke {
  stroke-width: 0.045;
}

.shelf-design-round-hub {
  fill: #64748b;
  stroke: #ffffff;
  stroke-width: 0.018;
}

.shelf-design-wood-shoe-rack {
  fill: #8b5e3c;
  stroke: #5b3924;
  stroke-linejoin: round;
  stroke-width: 0.055;
}

.shelf-design-wood-shoe-rack-shelf,
.shelf-design-wood-shoe-rack-divider {
  stroke: #d6b58c;
  stroke-linecap: square;
  stroke-width: 0.026;
}

.shelf-design-tier-line,
.shelf-design-island-tier {
  fill: none;
  stroke: #64748b;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 0.03;
}

.shelf-design-umbrella-basket {
  stroke: #64748b;
  stroke-width: 0.035;
  stroke-dasharray: 0.035 0.025;
}

.shelf-design-umbrella-hook {
  fill: #e2e8f0;
  stroke: #475569;
  stroke-width: 0.018;
}

.shelf-design-wall-rail {
  fill: none;
  stroke: #111827;
  stroke-width: 0.075;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.shelf-design-wall-anchor {
  fill: #94a3b8;
  stroke: #334155;
  stroke-width: 0.018;
}

.shelf-design-wood-base {
  fill: #b7793d;
  stroke: #704321;
  stroke-width: 0.035;
}

.shelf-design-wood-base-inner {
  fill: #e8c38e;
  stroke: #8b5a2b;
  stroke-width: 0.028;
}

.shelf-design-wood-base-slat {
  stroke: #9a6532;
  stroke-width: 0.022;
}

.shelf-design-garment-outer-line {
  fill: none;
  stroke: #2563eb;
  stroke-dasharray: 0.11 0.07;
  stroke-linecap: square;
  stroke-width: 0.035;
}

.shelf-design-garment-outer-circle {
  fill: none;
  stroke: #2563eb;
  stroke-dasharray: 0.11 0.07;
  stroke-width: 0.035;
}

.shelf-design-center-spine {
  stroke: #475569;
  stroke-dasharray: 0.06 0.05;
  stroke-width: 0.028;
}

.shelf-design-foot-marker {
  fill: #0f172a;
  stroke: #ffffff;
  stroke-width: 0.018;
}

.shelf-design-finished-dimension-line {
  stroke: #2563eb;
  stroke-width: 0.035;
  stroke-dasharray: 0.12 0.08;
}

.shelf-design-vector-label,
.shelf-design-dimension-label,
.shelf-design-body-label {
  fill: #0f172a;
  paint-order: stroke;
  stroke: #ffffff;
  stroke-width: 0.06;
  font-size: 0.16px;
  font-weight: 900;
  text-anchor: middle;
  dominant-baseline: middle;
}

.shelf-design-dimension-label {
  fill: #1d4ed8;
  font-size: 0.14px;
}

.shelf-design-dimension-label.is-vertical {
  text-anchor: start;
}

.shelf-design-body-label {
  fill: #334155;
  font-size: 0.13px;
}

.shelf-design-body-label.is-inverted {
  fill: #ffffff;
  stroke: #0f172a;
}

.shelf-design-spec-list {
  display: grid;
  gap: 10px;
}

.shelf-design-spec-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
  margin: 0;
}

.shelf-design-spec-grid div {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

.shelf-design-spec-grid dt {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.shelf-design-spec-grid dd {
  margin: 0;
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.shelf-design-note {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1e3a8a;
  font-size: 13px;
  font-weight: 800;
}

.shelf-design-summary {
  border-color: #cbd5e1;
}

@media (max-width: 980px) {
  .shelf-design-layout {
    grid-template-columns: 1fr;
  }

  .shelf-design-vector-preview {
    min-height: 340px;
    padding: 12px;
  }

  .shelf-design-vector-svg {
    min-width: 520px;
    min-height: 300px;
  }
}

.store-shelf-layout-panel {
  border-top: 4px solid #2563eb;
}

.store-shelf-layout-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.store-shelf-layout-header-actions select {
  min-height: 36px;
  max-width: 300px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
}

.store-shelf-layout-workspace {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.store-shelf-layout-library {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.store-shelf-layout-library h3 {
  margin: 0;
  color: #0f172a;
  font-size: 15px;
}

.store-shelf-layout-module-list,
.store-shelf-layout-object-list {
  display: grid;
  gap: 8px;
}

.store-shelf-layout-module-section {
  display: grid;
  gap: 8px;
}

.store-shelf-layout-module-section + .store-shelf-layout-module-section {
  margin-top: 10px;
}

.store-shelf-layout-module-section h4 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  color: #0f172a;
  font-size: 13px;
  line-height: 1.3;
}

.store-shelf-layout-module-section h4 span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  min-height: 22px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  font-size: 12px;
  font-weight: 900;
}

.store-shelf-layout-module-list button,
.store-shelf-layout-object-row {
  display: grid;
  gap: 4px;
  width: 100%;
  min-height: 62px;
  padding: 10px 12px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  text-align: left;
  box-shadow: none;
}

.store-shelf-layout-module-list button strong,
.store-shelf-layout-object-row strong {
  color: #0f172a;
  font-size: 13px;
  line-height: 1.35;
}

.store-shelf-layout-module-list button span,
.store-shelf-layout-object-row span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.store-shelf-layout-module-list button em {
  justify-self: start;
  padding: 2px 7px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.35;
}

.gm-store-receiving-location-controls {
  display: grid;
  grid-template-columns: minmax(132px, 1fr) minmax(104px, 0.9fr) 72px;
  gap: 6px;
  min-width: 320px;
}

.gm-store-receiving-location-controls select,
.gm-store-receiving-location-controls input {
  width: 100%;
  min-width: 0;
  font-size: 12px;
}

.gm-store-receiving-location-controls input {
  grid-column: 1 / -1;
  color: #475569;
  background: #f8fafc;
}

.store-shelf-layout-object-row.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
}

.store-shelf-layout-object-card {
  display: grid;
  gap: 8px;
}

.store-shelf-layout-level-controls {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border: 1px dashed #bfdbfe;
  border-radius: 8px;
  background: #f8fbff;
}

.store-shelf-layout-level-controls label,
.store-shelf-layout-layer-name-list label {
  display: grid;
  gap: 5px;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.store-shelf-layout-layer-name-list {
  display: grid;
  gap: 8px;
}

.store-shelf-layout-workbench {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.store-shelf-layout-canvas {
  min-height: clamp(560px, 64vh, 780px);
  padding: 20px;
  border: 1px solid #dbe3f0;
  background: #f8fafc;
  overflow: auto;
}

.store-shelf-layout-svg {
  width: 100%;
  min-width: 780px;
  min-height: clamp(500px, 58vh, 720px);
  background: #ffffff;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}

.store-shelf-layout-grid {
  fill: url("#storeShelfLayoutGridPattern");
}

.store-shelf-layout-grid-path {
  fill: none;
  stroke: #e2e8f0;
  stroke-width: 0.025;
}

.store-shelf-layout-floor-plan {
  opacity: 0.78;
}

.store-shelf-layout-item {
  cursor: pointer;
  outline: none;
}

.store-shelf-layout-item.is-selected .store-shelf-layout-rack-body,
.store-shelf-layout-item.is-selected .store-shelf-layout-i-beam-flange,
.store-shelf-layout-item.is-selected .store-shelf-layout-i-beam-web,
.store-shelf-layout-item.is-selected .store-shelf-layout-pipeline-frame,
.store-shelf-layout-item.is-selected .store-shelf-layout-round-ring,
.store-shelf-layout-item.is-selected .store-shelf-layout-wood-shoe-rack,
.store-shelf-layout-item.is-selected .store-shelf-layout-cashier-counter,
.store-shelf-layout-item.is-selected .store-shelf-layout-fitting-room-box {
  stroke: #2563eb;
  stroke-width: 0.08;
}

.store-shelf-layout-rack-body {
  fill: #e2e8f0;
  stroke: #475569;
  stroke-width: 0.045;
}

.store-shelf-layout-rack-body.is-white {
  fill: #f8fafc;
  stroke: #64748b;
}

.store-shelf-layout-rack-body.is-silver {
  fill: #cbd5e1;
  stroke: #475569;
}

.store-shelf-layout-rack-body.is-black {
  fill: #111827;
  stroke: #020617;
}

.store-shelf-layout-rack-bar {
  stroke: #0f172a;
  stroke-linecap: square;
}

.store-shelf-layout-rack-bar.is-inverted {
  stroke: #f8fafc;
}

.store-shelf-layout-i-beam-flange,
.store-shelf-layout-i-beam-web {
  fill: #cbd5e1;
  stroke: #475569;
  stroke-width: 0.045;
}

.store-shelf-layout-black-center {
  fill: #020617;
  stroke: none;
}

.store-shelf-layout-pipeline-frame,
.store-shelf-layout-round-ring {
  fill: none;
  stroke: #475569;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 0.08;
}

.store-shelf-layout-pipeline-rail,
.store-shelf-layout-round-spoke {
  stroke: #64748b;
  stroke-linecap: round;
}

.store-shelf-layout-round-spoke {
  stroke-width: 0.045;
}

.store-shelf-layout-round-hub {
  fill: #64748b;
  stroke: #ffffff;
  stroke-width: 0.018;
}

.store-shelf-layout-wood-shoe-rack {
  fill: #8b5e3c;
  stroke: #5b3924;
  stroke-linejoin: round;
  stroke-width: 0.045;
}

.store-shelf-layout-wood-shoe-rack-shelf,
.store-shelf-layout-wood-shoe-rack-divider {
  stroke: #d6b58c;
  stroke-linecap: square;
  stroke-width: 0.024;
}

.store-shelf-layout-tier-line,
.store-shelf-layout-island-tier {
  fill: none;
  stroke: #64748b;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 0.03;
}

.store-shelf-layout-garment-outer-line {
  fill: none;
  stroke: #2563eb;
  stroke-dasharray: 0.11 0.07;
  stroke-linecap: square;
  stroke-width: 0.035;
}

.store-shelf-layout-garment-outer-circle {
  fill: none;
  stroke: #2563eb;
  stroke-dasharray: 0.11 0.07;
  stroke-width: 0.035;
}

.store-shelf-layout-cashier-counter {
  fill: #fef3c7;
  stroke: #92400e;
  stroke-width: 0.05;
}

.store-shelf-layout-cashier-seat {
  fill: #1e293b;
  stroke: #ffffff;
  stroke-width: 0.025;
}

.store-shelf-layout-fitting-room-box {
  fill: #ecfeff;
  stroke: #0e7490;
  stroke-width: 0.055;
}

.store-shelf-layout-fitting-room-curtain {
  fill: none;
  stroke: #0e7490;
  stroke-linecap: round;
  stroke-width: 0.04;
}

.store-shelf-layout-item-label {
  fill: #0f172a;
  paint-order: stroke;
  stroke: #ffffff;
  stroke-width: 0.06;
  font-size: 0.18px;
  font-weight: 900;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}

.store-shelf-layout-summary {
  border-color: #cbd5e1;
}

.store-shelf-layout-summary.is-error {
  border-color: #fecaca;
  background: #fef2f2;
}

.store-shelf-category-plan-panel {
  border-top: 4px solid #2563eb;
}

.store-shelf-category-plan-selector-grid {
  display: grid;
  grid-template-columns: minmax(170px, 0.65fr) minmax(330px, 1.2fr) minmax(330px, 1.2fr);
  gap: 10px;
  margin-bottom: 10px;
}

.store-shelf-category-plan-selector-field {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fbff;
}

.store-shelf-category-plan-selector-field strong {
  color: #1e3a8a;
  font-size: 13px;
}

.store-shelf-category-plan-selector-field small {
  color: #64748b;
}

.store-shelf-category-plan-selector-field select {
  width: 100%;
  min-width: 0;
}

.store-shelf-category-plan-selector-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
}

.store-shelf-category-plan-unrestricted-note {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  padding: 9px 11px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #334155;
  font-size: 13px;
}

.store-shelf-category-plan-unrestricted-note strong {
  flex: 0 0 auto;
  color: #1d4ed8;
}

.store-shelf-category-plan-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  margin-bottom: 10px;
}

.store-shelf-category-plan-workspace {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(620px, 1fr) minmax(300px, 360px);
  gap: 12px;
  align-items: start;
}

.store-shelf-category-plan-sidebar,
.store-shelf-category-plan-main,
.store-shelf-category-plan-inspector,
.store-manager-shelf-map {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.store-shelf-category-plan-sidebar {
  max-height: clamp(420px, 62vh, 680px);
  overflow: auto;
  padding-right: 2px;
}

.store-shelf-category-plan-step,
.store-shelf-category-plan-inspector,
.store-manager-shelf-map {
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #ffffff;
}

.store-shelf-category-plan-inspector {
  max-height: clamp(520px, 72vh, 820px);
  overflow: auto;
}

.store-shelf-category-plan-step strong,
.store-shelf-category-plan-step span,
.store-shelf-category-plan-rack-row strong,
.store-shelf-category-plan-rack-row span {
  display: block;
}

.store-shelf-category-plan-step strong {
  color: #0f172a;
  font-size: 14px;
}

.store-shelf-category-plan-step span,
.store-shelf-category-plan-rack-row span,
.store-shelf-category-plan-readout,
.store-manager-shelf-map-head span,
.store-manager-shelf-map-detail {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

.store-shelf-category-plan-rack-list {
  display: grid;
  grid-auto-rows: minmax(48px, auto);
  gap: 6px;
}

.store-shelf-category-plan-rack-row {
  width: 100%;
  min-height: 48px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 7px 8px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  text-align: left;
  color: #334155;
}

.store-shelf-category-plan-rack-row.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: inset 3px 0 0 #2563eb;
}

.store-shelf-category-plan-rack-row strong {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 2px 6px;
  border-radius: 5px;
  color: #0f172a;
  font-size: 12px;
  line-height: 1.2;
  background: #f1f5f9;
}

.store-shelf-category-plan-rack-row.is-selected strong {
  color: #ffffff;
  background: #2563eb;
}

.store-shelf-category-plan-rack-row .store-shelf-category-plan-rack-type,
.store-shelf-category-plan-rack-row .store-shelf-category-plan-rack-meta,
.store-shelf-category-plan-rack-row .store-shelf-category-plan-rack-assignment {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  line-height: 1.25;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-shelf-category-plan-rack-row.is-selected .store-shelf-category-plan-rack-type,
.store-shelf-category-plan-rack-row.is-selected .store-shelf-category-plan-rack-meta,
.store-shelf-category-plan-rack-row.is-selected .store-shelf-category-plan-rack-assignment {
  color: #1e40af;
}

.store-shelf-category-plan-canvas,
.store-manager-shelf-map-canvas {
  min-height: clamp(520px, 62vh, 740px);
  padding: 12px;
  border: 1px solid #dbe3f0;
  background: #f8fafc;
  overflow: auto;
}

.store-inventory-shelf-map {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  grid-template-areas:
    "map-head map-head"
    "map-canvas rack-detail";
  gap: 8px;
  margin-top: 8px;
}

.store-inventory-shelf-map-head {
  grid-area: map-head;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.store-inventory-shelf-map-head strong,
.store-inventory-shelf-map-detail strong,
.store-inventory-shelf-map-detail span,
.store-inventory-shelf-map-detail small {
  display: block;
}

.store-inventory-shelf-map-head span,
.store-inventory-shelf-map-detail {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

.store-inventory-shelf-map-canvas {
  grid-area: map-canvas;
  display: grid;
  grid-template-columns: minmax(78px, 96px) minmax(520px, 1fr);
  grid-template-areas: "rack-list map-stage";
  gap: 8px;
  min-height: 260px;
  min-width: 0;
}

.store-inventory-shelf-map-stage {
  grid-area: map-stage;
  min-width: 0;
  min-height: 260px;
  max-height: 440px;
  padding: 8px;
  border: 1px solid #dbe3f0;
  background: #f8fafc;
  overflow: auto;
}

.store-inventory-shelf-map-stage .store-shelf-category-plan-svg {
  min-width: 620px;
  min-height: 260px;
  box-shadow: none;
}

.store-inventory-shelf-map-rack-list,
.store-inventory-shelf-map-chips {
  grid-area: rack-list;
  display: grid;
  align-content: start;
  gap: 5px;
  max-height: 440px;
  padding-right: 2px;
  overflow: auto;
}

.store-inventory-shelf-map-card,
.store-inventory-shelf-map-chip {
  width: 100%;
  display: grid;
  place-items: center;
  min-height: 34px;
  padding: 5px 6px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  text-align: center;
}

.store-inventory-shelf-map-card strong,
.store-inventory-shelf-map-chip strong {
  width: fit-content;
  max-width: 100%;
  padding: 2px 5px;
  border-radius: 5px;
  background: #f1f5f9;
  color: #0f172a;
  font-size: 12px;
  line-height: 1.2;
}

.store-inventory-shelf-map-card span,
.store-inventory-shelf-map-card small,
.store-inventory-shelf-map-chip span,
.store-inventory-shelf-map-chip small {
  overflow: hidden;
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-inventory-shelf-map-card.is-selected,
.store-inventory-shelf-map-chip.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: inset 3px 0 0 #2563eb;
}

.store-inventory-shelf-map-card.is-selected strong,
.store-inventory-shelf-map-chip.is-selected strong {
  color: #ffffff;
  background: #2563eb;
}

.store-inventory-shelf-map-detail {
  grid-area: rack-detail;
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 260px;
  max-height: 440px;
  padding: 10px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #f8fafc;
  overflow: auto;
}

.store-inventory-shelf-map-detail-head {
  display: grid;
  gap: 3px;
}

.store-inventory-shelf-map-detail-head strong {
  width: fit-content;
  padding: 3px 8px;
  border-radius: 6px;
  background: #2563eb;
  color: #ffffff;
  font-size: 14px;
}

.store-inventory-shelf-map-detail-head span {
  color: #0f172a;
  font-size: 12px;
}

.store-inventory-shelf-map-detail-stock {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.store-inventory-shelf-map-detail-stock article {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-inventory-shelf-map-detail-stock article strong {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
}

.store-inventory-shelf-map-detail-stock article span {
  overflow: hidden;
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-inventory-shelf-map-layer-picker {
  display: grid;
  gap: 6px;
}

.store-inventory-shelf-map-layer-list {
  display: grid;
  gap: 5px;
}

.store-inventory-shelf-map-layer {
  width: 100%;
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  text-align: left;
}

.store-inventory-shelf-map-layer strong,
.store-inventory-shelf-map-layer span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-inventory-shelf-map-layer strong {
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
}

.store-inventory-shelf-map-layer span {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.store-inventory-shelf-map-layer.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
}

.store-inventory-shelf-map-layer-detail {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-shelf-category-plan-svg {
  width: 100%;
  min-width: 760px;
  min-height: clamp(500px, 58vh, 700px);
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07);
}

.store-shelf-category-plan-grid {
  fill: url("#storeShelfCategoryPlanGridPattern");
}

.store-shelf-category-plan-zone rect {
  fill: var(--zone-color, #bfdbfe);
  opacity: 0.22;
  stroke: var(--zone-color, #bfdbfe);
  stroke-width: 0.06;
}

.store-shelf-category-plan-zone text {
  fill: #0f172a;
  font-size: 0.25px;
  font-weight: 900;
  paint-order: stroke;
  stroke: #ffffff;
  stroke-width: 0.05;
}

.store-shelf-category-plan-traffic {
  fill: none;
  stroke: #dc2626;
  stroke-dasharray: 0.18 0.1;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 0.08;
}

.store-shelf-category-plan-arrow,
.store-shelf-category-plan-traffic-dot {
  fill: #dc2626;
}

.store-shelf-category-plan-item {
  cursor: pointer;
  outline: none;
}

.store-shelf-category-plan-item.is-selected .store-shelf-layout-rack-body,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-i-beam-flange,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-i-beam-web,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-pipeline-frame,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-round-ring,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-wood-shoe-rack,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-cashier-counter,
.store-shelf-category-plan-item.is-selected .store-shelf-layout-fitting-room-box {
  stroke: #dc2626;
  stroke-width: 0.08;
}

.store-shelf-category-plan-rack-code,
.store-shelf-category-plan-rack-category {
  fill: #0f172a;
  font-size: 0.2px;
  font-weight: 900;
  text-anchor: middle;
  paint-order: stroke;
  stroke: #ffffff;
  stroke-width: 0.05;
  pointer-events: none;
}

.store-shelf-category-plan-rack-category {
  fill: #1e40af;
  font-size: 0.16px;
}

.store-shelf-category-plan-inspector label {
  display: grid;
  gap: 4px;
  color: #475569;
  font-size: 11px;
  font-weight: 900;
}

.store-shelf-category-plan-inspector select,
.store-shelf-category-plan-inspector input {
  min-height: 34px;
}

.store-shelf-category-plan-inspector-head {
  display: grid;
  gap: 4px;
}

.store-shelf-category-plan-inspector-head strong {
  color: #0f172a;
  font-size: 18px;
}

.store-shelf-category-plan-rack-overview {
  max-height: 44px;
  overflow: hidden;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-shelf-category-plan-rack-overview[open] {
  max-height: none;
  overflow: visible;
}

.store-shelf-category-plan-rack-overview summary {
  display: grid;
  grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 42px;
  padding: 7px 10px;
  cursor: pointer;
  list-style: none;
}

.store-shelf-category-plan-rack-overview summary::-webkit-details-marker {
  display: none;
}

.store-shelf-category-plan-rack-overview-title {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  min-width: 0;
}

.store-shelf-category-plan-rack-overview-title strong {
  color: #0f172a;
  font-size: 17px;
  line-height: 1.1;
}

.store-shelf-category-plan-rack-overview-title em,
.store-shelf-category-plan-rack-overview-meta {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-shelf-category-plan-rack-overview-meta {
  min-width: 0;
  text-align: right;
}

.store-shelf-category-plan-readout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  margin: 0 8px 8px;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.store-shelf-category-plan-readout span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.store-shelf-category-plan-layer-list {
  display: grid;
  gap: 8px;
}

.store-shelf-category-plan-layer-card {
  display: grid;
  gap: 8px;
  padding: 9px 10px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-shelf-category-plan-layer-card summary {
  display: grid;
  gap: 3px;
  cursor: pointer;
}

.store-shelf-category-plan-layer-card summary strong {
  color: #0f172a;
  font-size: 14px;
}

.store-shelf-category-plan-layer-card summary span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.store-shelf-category-plan-layer-card[open] {
  border-color: #93c5fd;
  background: #f8fbff;
}

.store-shelf-category-plan-guidance {
  padding: 10px 12px;
  border: 1px dashed #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.45;
}

#storeShelfCategoryPlanTopSummary.store-shelf-category-plan-top-summary {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  min-height: 0;
  margin: 8px 0 12px;
  padding: 6px 8px;
  border-color: #dbeafe;
  background: #f8fbff;
  overflow-x: auto;
}

#storeShelfCategoryPlanTopSummary .store-shelf-category-plan-quick-summary {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

#storeShelfCategoryPlanTopSummary .store-shelf-category-plan-quick-summary span {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
}

#storeShelfCategoryPlanTopSummary .store-shelf-category-plan-quick-summary b {
  color: #0f172a;
  font-size: 13px;
}

#storeShelfCategoryPlanTopSummary .store-shelf-category-plan-quick-summary small {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.store-shelf-category-plan-capacity-summary {
  display: flex;
  flex: 1 1 auto;
  min-width: 280px;
  align-items: center;
  gap: 8px;
  padding-left: 8px;
  border-left: 1px solid #dbe3f0;
  overflow: hidden;
}

.store-shelf-category-plan-capacity-summary > strong {
  color: #0f172a;
  font-size: 12px;
  white-space: nowrap;
}

.store-shelf-category-plan-capacity-summary > span {
  color: #2563eb;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}

.store-shelf-category-plan-capacity-summary.empty-state {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-width: auto;
  padding: 4px 7px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  color: #64748b;
  background: #ffffff;
  font-size: 12px;
  font-weight: 800;
}

.store-shelf-category-plan-capacity-chips {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
}

.store-shelf-category-plan-capacity-summary article {
  display: inline-grid;
  grid-template-columns: minmax(160px, 1fr) auto;
  gap: 1px 8px;
  align-items: center;
  min-width: 250px;
  padding: 5px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-shelf-category-plan-capacity-summary article span,
.store-shelf-category-plan-capacity-summary article b {
  color: #0f172a;
  font-size: 12px;
}

.store-shelf-category-plan-capacity-summary article small {
  grid-column: 1 / -1;
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
}

.store-manager-shelf-map {
  margin: 12px 0 14px;
}

.store-manager-shelf-map-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.store-manager-shelf-map-head strong,
.store-manager-shelf-map-detail strong,
.store-manager-shelf-map-detail span,
.store-manager-shelf-map-detail small {
  display: block;
}

.store-manager-shelf-map-canvas {
  min-height: 360px;
  padding: 12px;
}

.store-manager-shelf-map-canvas .store-shelf-category-plan-svg {
  min-width: 680px;
  min-height: 340px;
}

.store-manager-shelf-map-detail {
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

@media (max-width: 980px) {
  .store-shelf-layout-workspace {
    grid-template-columns: 1fr;
  }

  .store-shelf-layout-canvas {
    min-height: 500px;
    padding: 14px;
  }

  .store-shelf-layout-svg {
    min-width: 640px;
    min-height: 480px;
  }

  .store-shelf-category-plan-workspace {
    grid-template-columns: 1fr;
  }

  .store-shelf-category-plan-selector-grid {
    grid-template-columns: 1fr;
  }

  .store-shelf-category-plan-canvas {
    min-height: 500px;
    padding: 14px;
  }

  .store-shelf-category-plan-svg {
    min-width: 640px;
    min-height: 480px;
  }

  .store-inventory-overview-toolbar {
    grid-template-columns: 1fr;
  }

  .store-inventory-shelf-map {
    grid-template-columns: 1fr;
    grid-template-areas:
      "map-head"
      "map-canvas"
      "rack-detail";
  }

  .store-inventory-shelf-map-canvas {
    grid-template-columns: 1fr;
    grid-template-areas:
      "rack-list"
      "map-stage";
  }

  .store-inventory-shelf-map-stage {
    max-height: none;
  }

  .store-inventory-shelf-map-rack-list {
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    max-height: none;
  }

  .store-inventory-shelf-map-detail {
    max-height: none;
  }
}

.mobile-stock-in-entry-card,
.mobile-stock-in-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--fw-border);
  border-radius: var(--radius-panel);
  background: var(--fw-surface);
}

.mobile-stock-in-panel,
.mobile-stock-in-list,
.mobile-stock-in-batch-card,
.mobile-stock-in-row,
.mobile-field {
  display: grid;
  gap: 10px;
}

.mobile-stock-in-batch-card,
.mobile-stock-in-row {
  padding: 12px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: #ffffff;
}

.mobile-stock-in-batch-card {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.mobile-field {
  color: #334155;
  font-size: 13px;
  font-weight: 900;
}

.mobile-field select {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  font: inherit;
}

.mobile-stock-in-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.mobile-stock-in-actions span {
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.mobile-stock-in-entry-card {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.mobile-stock-in-entry-card strong,
.mobile-stock-in-card strong,
.mobile-stock-in-entry-card span,
.mobile-stock-in-card span {
  display: block;
}

.mobile-stock-in-entry-card span,
.mobile-stock-in-card span {
  color: var(--muted);
  font-size: 12px;
}

.user-management-head {
  align-items: flex-start;
}

.user-management-command-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 14px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.user-management-command-bar button {
  width: auto;
}

.user-form-disclosure {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.user-form-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  cursor: pointer;
  color: var(--ink);
  font-weight: 900;
}

.user-form-summary::-webkit-details-marker,
.user-organization-section-head::-webkit-details-marker,
.user-organization-group-head::-webkit-details-marker {
  display: none;
}

.user-form-summary small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.user-form-summary::after,
.user-organization-section-head::after,
.user-organization-group-head::after {
  content: "展开";
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 8px;
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
  font-size: 12px;
  font-weight: 900;
}

.user-form-disclosure[open] > .user-form-summary::after,
.user-organization-section[open] > .user-organization-section-head::after,
.user-organization-group[open] > .user-organization-group-head::after {
  content: "收起";
}

.user-form-disclosure .user-management-form {
  margin: 0;
  padding: 14px;
  border-top: 1px solid var(--line);
}

.user-management-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 14px;
}

.user-management-list.empty-state {
  display: block;
  padding: 16px;
  border-radius: 18px;
  background: rgba(255, 253, 248, 0.86);
  border: 1px solid var(--line);
  color: var(--muted);
}

.user-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.96), rgba(248, 240, 228, 0.82));
  border: 1px solid rgba(205, 191, 165, 0.68);
  box-shadow: 0 12px 26px rgba(17, 53, 58, 0.06);
  min-width: 0;
  word-break: break-word;
}

.user-card.is-inactive {
  opacity: 0.68;
}

.user-card-head,
.user-card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.user-card-action-label,
.user-card-no-permission {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.user-card-action-buttons {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.user-card-head strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
  line-height: 1.15;
}

.user-card-label,
.user-card-grid span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.user-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}

.user-card-grid > div {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.54);
  border: 1px solid rgba(205, 191, 165, 0.46);
}

.user-card-grid strong,
.user-card-grid small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.user-card-wide {
  grid-column: 1 / -1;
}

.user-binding-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.user-device-status {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.user-device-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.user-device-row strong {
  flex: 1 1 180px;
}

.user-binding-tags span,
.user-status-pill,
.user-device-pill {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(10, 91, 96, 0.09);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
}

.user-device-pill.is-bound {
  background: rgba(20, 122, 76, 0.12);
  color: #11613e;
}

.user-device-pill.is-pending {
  background: rgba(166, 105, 14, 0.13);
  color: #8a580d;
}

.user-device-pill.is-unbound {
  background: rgba(83, 100, 116, 0.11);
  color: #425466;
}

.user-status-pill.is-inactive {
  background: rgba(140, 90, 63, 0.12);
  color: #7b4a31;
}

.user-card-action-buttons button {
  width: auto;
  min-width: 88px;
}

.user-card-action-buttons .danger {
  border-color: rgba(156, 72, 52, 0.34);
  color: #8f402e;
}

.user-management-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.user-organization-section {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--line);
}

.user-organization-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  cursor: pointer;
  list-style: none;
}

.user-organization-section-head h3 {
  margin: 0;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.2;
}

.user-organization-stack {
  display: grid;
  gap: 12px;
  margin-top: 12px;
}

.user-organization-group {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid rgba(37, 99, 235, 0.12);
  border-radius: 8px;
  background: rgba(248, 250, 252, 0.78);
}

.user-organization-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(37, 99, 235, 0.08);
  color: var(--primary);
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.user-organization-group-head span {
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}

.user-organization-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 12px;
  padding: 0 12px 12px;
}

.warehouse-stage-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.warehouse-stage-card {
  display: grid;
  gap: 14px;
  min-height: 176px;
  padding: 16px;
  border-radius: 8px;
  border: 1px solid #dbe3ee;
  border-top: 4px solid #2563eb;
  background: #ffffff;
  box-shadow: none;
}

.warehouse-stage-title-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.warehouse-stage-title-row strong {
  font-size: 17px;
  line-height: 1.3;
}

.warehouse-stage-title-row span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.warehouse-stage-primary {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.warehouse-stage-primary-value {
  font-size: clamp(36px, 4vw, 52px);
  line-height: 0.95;
  font-weight: 850;
}

.warehouse-stage-primary-unit {
  font-size: 17px;
  font-weight: 850;
  color: #2563eb;
  transform: translateY(-5px);
}

.warehouse-stage-metrics {
  display: grid;
  gap: 7px;
  padding-top: 10px;
  border-top: 1px solid #e2e8f0;
}

.warehouse-stage-metric {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  color: var(--muted);
  font-size: 14px;
}

.warehouse-stage-metric strong {
  color: var(--ink);
  font-size: 15px;
}

.warehouse-stage-card--unsorted {
  border-top-color: #2563eb;
}

.warehouse-stage-card--sorted_garments {
  border-top-color: #16a34a;
}

.warehouse-stage-card--packed_dispatch {
  border-top-color: #0f766e;
}

.warehouse-stage-card--packed_sale {
  border-top-color: #475569;
}

.warehouse-secondary-summary {
  margin-top: 4px;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.warehouse-inventory-console {
  display: grid;
  gap: 12px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.raw-bale-stock-filter {
  grid-template-columns: minmax(260px, 1fr) minmax(180px, 260px);
  gap: 10px;
  align-items: end;
  margin: 12px 0 14px;
}

.raw-bale-stock-filter .field-label,
.raw-bale-stock-filter .field-help {
  display: none;
}

.raw-bale-stock-filter .field-group {
  gap: 0;
}

.raw-bale-stock-filter input {
  min-height: 46px;
  background: #ffffff;
  border-color: #dbe3ee;
  box-shadow: none;
}

.raw-bale-stock-filter button {
  min-height: 46px;
}

.warehouse-current-inventory-summary {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.raw-bale-inventory-group-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  align-content: start;
}

.raw-bale-type-dashboard {
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 1px solid #d8e1ee;
  border-radius: 8px;
  background: #ffffff;
}

.sorted-inventory-console {
  margin-bottom: 14px;
}

.sorted-inventory-type-dashboard {
  border-top: 3px solid #2563eb;
}

.raw-bale-type-dashboard-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
}

.raw-bale-type-dashboard-head strong {
  display: block;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.25;
}

.raw-bale-type-dashboard-head span,
.raw-bale-type-total span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.raw-bale-type-total {
  display: grid;
  justify-items: end;
  gap: 2px;
  min-width: 110px;
  text-align: right;
}

.raw-bale-type-total strong {
  font-size: 28px;
  line-height: 1;
}

.raw-bale-type-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.85fr);
  gap: 18px;
  align-items: center;
}

.sorted-inventory-type-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}

.sorted-inventory-type-column {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border: 1px solid #d8e1ee;
  border-radius: 8px;
  background: #ffffff;
}

.sorted-inventory-type-column-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}

.sorted-inventory-type-column-head strong {
  display: block;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
}

.sorted-inventory-type-column-head span {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.sorted-inventory-type-column-head em {
  color: var(--ink);
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.sorted-inventory-type-column .raw-bale-type-bar-row {
  grid-template-columns: minmax(120px, 0.8fr) minmax(110px, 0.48fr) minmax(120px, 1fr);
  gap: 10px;
}

.raw-bale-type-bars {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.raw-bale-type-bar-row {
  display: grid;
  grid-template-columns: minmax(170px, 0.8fr) minmax(130px, 0.48fr) minmax(220px, 1.25fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
}

.raw-bale-type-main-row {
  cursor: pointer;
}

.raw-bale-type-main-row:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 3px;
  border-radius: 8px;
}

.raw-bale-type-group {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.raw-bale-type-subrows {
  display: grid;
  gap: 8px;
  padding-left: 24px;
}

.raw-bale-type-subrow .raw-bale-type-bar-track span {
  opacity: 0.72;
}

.raw-bale-type-toggle-icon {
  display: inline-block;
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: center;
  width: 16px;
  color: var(--muted);
  font-weight: 900;
}

.raw-bale-type-percent {
  display: grid;
  gap: 2px;
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 800;
}

.raw-bale-type-percent strong {
  color: var(--accent);
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.raw-bale-type-percent span {
  color: var(--muted);
  white-space: nowrap;
}

.raw-bale-type-bar-label {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.raw-bale-type-main-row .raw-bale-type-bar-label {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 3px 6px;
}

.raw-bale-type-main-row .raw-bale-type-bar-label strong,
.raw-bale-type-main-row .raw-bale-type-bar-label > span:not(.raw-bale-type-toggle-icon) {
  grid-column: 2;
}

.raw-bale-type-bar-label strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
  word-break: break-word;
}

.raw-bale-type-bar-label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.raw-bale-type-bar-track {
  position: relative;
  height: 30px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.raw-bale-type-bar-track span {
  display: block;
  width: var(--bar-width, 0%);
  height: 100%;
  border-radius: 7px;
  background: var(--chart-color, #0f766e);
}

.raw-bale-type-pie-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-width: 0;
}

.raw-bale-type-pie {
  position: relative;
  width: 150px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--raw-bale-type-pie, #e2e8f0);
  color: var(--ink);
  overflow: hidden;
}

.raw-bale-type-pie::after {
  content: "";
  position: absolute;
  inset: 34px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: inset 0 0 0 1px #e2e8f0;
}

.raw-bale-type-pie span,
.raw-bale-type-pie small {
  position: relative;
  z-index: 1;
}

.raw-bale-type-pie span {
  align-self: end;
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}

.raw-bale-type-pie small {
  align-self: start;
  color: var(--muted);
  font-weight: 800;
}

.raw-bale-type-legend {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.raw-bale-type-legend-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 8px;
  align-items: center;
  min-width: 0;
}

.raw-bale-type-swatch {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: var(--chart-color, #0f766e);
}

.raw-bale-type-legend-row strong {
  color: var(--ink);
  font-size: 12px;
  line-height: 1.2;
  word-break: break-word;
}

.raw-bale-type-legend-row em {
  grid-column: 2;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

@media (max-width: 1180px) {
  .sorted-inventory-type-split {
    grid-template-columns: 1fr;
  }
}

.raw-bale-inventory-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #d8e1ee;
  border-left: 4px solid #0f766e;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: var(--shadow-soft);
  min-width: 0;
}

.raw-bale-inventory-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
}

.raw-bale-inventory-card-head strong {
  display: block;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.2;
  word-break: break-word;
}

.raw-bale-inventory-card-total {
  min-width: 116px;
  display: grid;
  justify-items: end;
  gap: 2px;
  text-align: right;
}

.raw-bale-inventory-card-total strong {
  color: var(--ink);
  font-size: 34px;
  line-height: 0.95;
  font-weight: 900;
}

.raw-bale-inventory-card-total span {
  color: #2563eb;
  font-weight: 850;
}

.raw-bale-inventory-card-total small {
  color: var(--muted);
  font-weight: 800;
}

.raw-bale-inventory-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.raw-bale-inventory-meta-grid span {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  word-break: break-word;
}

.raw-bale-inventory-meta-grid b {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.raw-bale-inventory-meta-value {
  color: var(--ink);
  font-style: normal;
  font-weight: 800;
  word-break: break-word;
}

.raw-bale-inventory-codes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.raw-bale-inventory-codes span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 8px;
  border: 1px solid #cfe1ff;
  border-radius: 999px;
  background: #eef6ff;
  color: #1e40af;
  font-size: 12px;
  font-weight: 850;
  word-break: break-word;
}

@media (max-width: 1180px) {
  .warehouse-stage-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .warehouse-stage-board,
  .raw-bale-stock-filter {
    grid-template-columns: 1fr;
  }

  .raw-bale-inventory-card-head {
    flex-direction: column;
  }

  .raw-bale-inventory-card-total {
    justify-items: start;
    text-align: left;
  }

  .raw-bale-inventory-meta-grid {
    grid-template-columns: 1fr;
  }

  .raw-bale-type-dashboard-head {
    flex-direction: column;
  }

  .raw-bale-type-pie-panel {
    grid-template-columns: 1fr;
    justify-items: start;
    text-align: left;
  }

  .raw-bale-type-total {
    justify-items: start;
    text-align: left;
  }

  .raw-bale-type-dashboard-grid,
  .raw-bale-type-bar-row {
    grid-template-columns: 1fr;
  }

  .sorted-inventory-type-column-head {
    flex-direction: column;
  }

  .sorted-inventory-type-column .raw-bale-type-bar-row {
    grid-template-columns: 1fr;
  }

  .raw-bale-type-pie {
    width: 132px;
  }
}

.store-metric.money-metric span {
  display: grid;
  gap: 2px;
  align-content: start;
  font-size: clamp(34px, 4vw, 60px);
  line-height: 0.92;
  word-break: break-word;
}

.store-metric.money-metric span small {
  font-size: 18px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: var(--accent);
}

.store-metric.money-metric .subtle.small {
  margin-top: 2px;
  font-size: 15px;
  font-weight: 700;
  color: rgba(77, 62, 44, 0.78);
}

.data-preview-grid {
  display: grid;
  gap: 10px;
}

.data-preview-card {
  border-radius: 18px;
  border: 1px solid rgba(207, 192, 170, 0.78);
  background: linear-gradient(180deg, #fffdf8 0%, #f8f1e5 100%);
  padding: 14px;
  display: grid;
  gap: 8px;
}

.data-preview-card strong {
  font-size: 18px;
}

.data-preview-card .meta {
  color: var(--muted);
  font-size: 14px;
}

.summary-breakdown-block {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.summary-breakdown-block strong {
  font-size: 15px;
}

.summary-breakdown-list {
  display: grid;
  gap: 6px;
}

.summary-breakdown-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 12px;
  background: #f7f2ea;
  border: 1px solid rgba(207, 192, 170, 0.7);
  font-size: 14px;
}

.summary-breakdown-row span:last-child {
  color: var(--muted);
  white-space: nowrap;
}

.bale-workbench {
  display: grid;
  gap: 12px;
}

.bale-lock-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 10px 14px;
  border-radius: 16px;
  border: 1px solid rgba(207, 192, 170, 0.74);
  background: linear-gradient(180deg, #fffdf8 0%, #f7f2e8 100%);
}

.bale-lock-bar-main {
  display: grid;
  gap: 4px;
}

.bale-lock-bar-main strong {
  font-size: 20px;
  line-height: 1.12;
  color: var(--ink);
}

.bale-lock-bar-chips {
  justify-content: flex-end;
}

.bale-workbench-summary-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bale-summary-pill {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(207, 192, 170, 0.74);
  background: linear-gradient(180deg, #fffdf9 0%, #f8f2e8 100%);
}

.bale-summary-pill strong {
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
  color: var(--ink);
}

.bale-summary-pill span {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
}

.bale-workbench-meta-row {
  margin-top: -2px;
}

.bale-workbench-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.9fr) minmax(280px, 0.8fr);
  gap: 12px;
  align-items: start;
}

.bale-workbench-main,
.bale-workbench-side {
  display: grid;
  gap: 12px;
}

.bale-workbench-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 2px 2px 0;
}

.bale-batch-list {
  display: grid;
  gap: 10px;
}

.bale-batch-card {
  display: grid;
  gap: 9px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(207, 192, 170, 0.74);
  background: linear-gradient(180deg, #fffdf8 0%, #f8f2e8 100%);
}

.bale-batch-card.is-active {
  border-color: rgba(17, 93, 100, 0.28);
  box-shadow: 0 0 0 2px rgba(17, 93, 100, 0.08);
}

.bale-batch-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.bale-batch-head-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}

.bale-batch-title {
  display: grid;
  gap: 4px;
}

.bale-batch-title strong {
  font-size: 17px;
  line-height: 1.15;
  color: var(--ink);
}

.bale-batch-title span {
  color: var(--muted);
  font-size: 14px;
}

.bale-batch-progress {
  white-space: nowrap;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
}

.bale-batch-items {
  display: grid;
  gap: 8px;
}

.bale-workbench-list-actions,
.bale-batch-card-actions {
  justify-content: flex-start;
}

.bale-batch-card-actions button[disabled] {
  opacity: 0.58;
  cursor: not-allowed;
}

.bale-batch-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  border-radius: 14px;
  border: 1px solid rgba(207, 192, 170, 0.62);
  background: rgba(255, 255, 255, 0.72);
}

.bale-batch-item-code {
  display: grid;
  gap: 3px;
}

.bale-batch-item-code strong {
  font-size: 16px;
  line-height: 1.15;
  color: var(--ink);
}

.bale-batch-item-code span {
  color: var(--muted);
  font-size: 13px;
}

.bale-status-pill {
  flex: 0 0 auto;
  white-space: nowrap;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.bale-status-pill.is-done {
  border-color: var(--status-success-border);
  background: var(--status-success-bg);
  color: var(--status-success-text);
}

.bale-status-pill.is-pending {
  border-color: var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.warning-pill {
  border: 1px solid var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.bale-preview-card,
.printer-status-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
}

.bale-completed-title {
  font-size: 17px;
  line-height: 1.2;
  color: var(--ink);
}

.bale-completed-panel .candidate-summary.empty-state {
  min-height: auto;
  padding: 14px;
}

.bale-preview-supplier {
  font-size: 22px;
  line-height: 1.1;
  color: var(--ink);
}

.bale-preview-category {
  font-size: 15px;
  color: rgba(76, 67, 52, 0.86);
}

.bale-preview-barcode {
  padding: 12px 14px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid rgba(207, 192, 170, 0.6);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #111;
  word-break: break-word;
}

.bale-preview-position {
  color: var(--accent);
  font-size: 15px;
  font-weight: 800;
}

.bale-preview-note {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.printer-status-name {
  font-size: 18px;
  font-weight: 800;
  color: var(--ink);
}

.printer-status-flag {
  display: inline-flex;
  width: fit-content;
  padding: 8px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}

.printer-status-flag.is-ready {
  background: rgba(13, 92, 99, 0.1);
  color: var(--accent);
}

.printer-status-flag.is-waiting {
  background: rgba(219, 170, 68, 0.16);
  color: #7d5a11;
}

.printer-status-meta {
  display: grid;
  gap: 8px;
}

.printer-status-meta div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px dashed rgba(207, 192, 170, 0.72);
}

.printer-status-meta div:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.printer-status-meta strong {
  color: var(--ink);
  font-size: 14px;
}

.printer-status-meta span {
  color: var(--muted);
  font-size: 14px;
  text-align: right;
}

@media (max-width: 1180px) {
  .bale-lock-bar {
    display: grid;
  }

  .bale-workbench-grid {
    grid-template-columns: 1fr;
  }

  .bale-lock-bar-chips {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .bale-workbench-toolbar,
  .bale-lock-bar,
  .bale-batch-head,
  .bale-batch-item,
  .printer-status-meta div {
    flex-direction: column;
    align-items: flex-start;
  }

  .bale-batch-progress,
  .bale-status-pill,
  .bale-summary-pill {
    white-space: normal;
  }

  .printer-status-meta span {
    text-align: left;
  }
}

.split-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}

.bale-sales-outbound-flow {
  display: grid;
  gap: 16px;
}

.bale-sales-outbound-picker,
.bale-sales-outbound-settlement {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.bale-sales-outbound-picker {
  width: 100%;
}

.bale-sales-outbound-settlement {
  align-items: start;
}

#baleSalesOutboundScanForm {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(180px, 280px);
  gap: 10px;
  align-items: end;
  margin-bottom: 0;
}

#baleSalesOutboundAvailableList,
#baleSalesOutboundSelectedList {
  margin-top: 0;
}

#baleSalesOutboundSelectedList {
  order: 1;
}

#baleSalesOutboundForm {
  order: 2;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

#baleSalesSelectedCustomerSummary,
#baleSalesPaymentProofPreview,
#baleSalesOutboundForm textarea,
#baleSalesOutboundForm button[type="submit"] {
  grid-column: 1 / -1;
}

#baleSalesOutboundAvailableList .sorting-stock-row,
#baleSalesOutboundSelectedList .sorting-stock-row {
  border-radius: 8px;
  background: #ffffff;
}

@media (max-width: 760px) {
  #baleSalesOutboundScanForm,
  #baleSalesOutboundForm {
    grid-template-columns: 1fr;
  }
}

.bale-sales-buyer-card.is-active {
  border-color: #2563eb;
  background: #eff6ff;
}

.bale-sales-selected-row {
  border-color: #bfdbfe;
  background: #f8fbff;
}

.bale-sales-price-editor label {
  display: grid;
  gap: 5px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.bale-sales-price-editor input {
  min-height: 40px;
}

.bale-sales-payment-proof-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.form-grid {
  display: grid;
  gap: 10px;
}

.store-shelf-list-panel {
  background: #f8fafc;
}

.store-shelf-list-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 10px;
  padding: 14px;
  border: 1px solid #dbeafe;
  border-radius: 18px;
  background: #ffffff;
}

.store-shelf-list-toolbar label,
.store-shelf-detail-form label {
  display: grid;
  gap: 5px;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.store-shelf-list-toolbar input,
.store-shelf-detail-form input,
.store-shelf-detail-form select {
  min-height: 38px;
}

.store-shelf-list-editor {
  display: grid;
  grid-template-columns: minmax(520px, 1fr) minmax(260px, 340px);
  gap: 14px;
  align-items: start;
  margin-top: 14px;
}

.store-shelf-location-list,
.store-shelf-detail-panel {
  border: 1px solid #dbeafe;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.store-shelf-location-list {
  overflow: hidden;
}

.store-shelf-list-head,
.store-shelf-list-row {
  display: grid;
  grid-template-columns: minmax(140px, 1.1fr) minmax(180px, 1.3fr) 90px 88px 98px;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #e2e8f0;
}

.store-shelf-list-head {
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.store-shelf-list-row:last-child {
  border-bottom: 0;
}

.store-shelf-list-row strong,
.store-shelf-list-row span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-shelf-list-code {
  display: grid;
  gap: 3px;
}

.store-shelf-list-code small {
  color: #64748b;
  font-size: 11px;
}

.store-shelf-list-empty {
  padding: 28px 16px;
  color: #64748b;
  text-align: center;
}

.store-shelf-list-row.is-backroom {
  background: #fffbeb;
}

.store-shelf-list-row.is-inactive {
  color: #64748b;
  background: #f8fafc;
}

.store-shelf-row-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.store-shelf-row-actions button {
  min-height: 34px;
  padding: 6px 10px;
}

.store-shelf-detail-panel {
  padding: 14px;
}

.detail-panel-empty {
  display: grid;
  gap: 6px;
  color: #64748b;
}

.detail-panel-empty strong {
  color: #0f172a;
  font-size: 18px;
}

.store-shelf-detail-form {
  display: grid;
  gap: 10px;
}

.store-shelf-readonly-count {
  padding: 10px;
  border-radius: 12px;
  background: #f8fafc;
  color: #475569;
}

.file-button {
  position: relative;
}

@media (max-width: 960px) {
  .store-shelf-list-editor {
    grid-template-columns: 1fr;
  }

  .store-shelf-list-head {
    display: none;
  }

  .store-shelf-list-row {
    grid-template-columns: 1fr;
    align-items: start;
  }
}

.field-group {
  display: grid;
  gap: 8px;
}

.field-stack {
  display: grid;
  gap: 5px;
}

.field-stack label {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
}

.field-stack span {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
}

.field-with-hint {
  display: grid;
  gap: 6px;
}

.field-with-hint > span {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
}

.field-with-hint > small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
}

.field-label {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
}

.form-clean-placeholders .field-group {
  gap: 6px;
}

.form-clean-placeholders .field-label,
.form-clean-placeholders .field-stack label {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
}

.form-clean-placeholders input,
.form-clean-placeholders textarea,
.form-clean-placeholders select {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: none;
}

.form-clean-placeholders input::placeholder,
.form-clean-placeholders textarea::placeholder {
  color: #94a3b8;
}

.form-clean-placeholders input:focus-visible,
.form-clean-placeholders textarea:focus-visible,
.form-clean-placeholders select:focus-visible {
  outline: 0;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
}

.form-clean-placeholders .field-stack {
  gap: 5px;
}

.form-clean-placeholders input[type="file"] {
  padding: 7px 10px;
  background: #ffffff;
}

.default-sale-price-layout {
  display: grid;
  gap: 12px;
}

.default-sale-price-workbench {
  grid-template-columns: minmax(300px, 390px) minmax(360px, 1fr);
  align-items: stretch;
}

.default-sale-price-card,
.default-sale-price-list-card {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--fw-border);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.default-sale-price-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e2e8f0;
}

.default-sale-price-card-head strong {
  color: #0f172a;
  font-size: 15px;
}

.default-sale-price-card-head span {
  padding: 4px 8px;
  border: 1px solid var(--status-info-border);
  border-radius: 999px;
  background: var(--status-info-bg);
  color: var(--status-info-text);
  font-size: 12px;
  font-weight: 700;
}

.default-sale-price-form {
  gap: 9px;
}

.default-sale-price-capacity-card {
  margin-top: 12px;
}

.default-sale-price-native-selects {
  display: none;
}

.default-sale-price-picker {
  display: grid;
  gap: 6px;
}

.default-sale-price-category-create {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
}

.default-sale-price-category-create > summary {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #0f172a;
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}

.default-sale-price-category-create > summary::before {
  content: "+";
  display: inline-grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border-radius: 999px;
  background: #2563eb;
  color: #fff;
  font-size: 13px;
  line-height: 1;
}

.default-sale-price-category-create > summary::-webkit-details-marker {
  display: none;
}

.default-sale-price-category-create[open] > summary {
  margin-bottom: 4px;
}

.default-sale-price-dropdown {
  position: relative;
}

.default-sale-price-dropdown > summary {
  display: flex;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  cursor: pointer;
  list-style: none;
}

.default-sale-price-dropdown > summary::-webkit-details-marker,
.default-sale-price-category-group > summary::-webkit-details-marker {
  display: none;
}

.default-sale-price-dropdown > summary strong {
  color: #2563eb;
  font-size: 12px;
  white-space: nowrap;
}

.default-sale-price-category-list {
  display: grid;
  gap: 8px;
  max-height: 360px;
  margin-top: 8px;
  padding: 10px;
  overflow: auto;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fbff;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}

.default-sale-price-category-group {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
}

.default-sale-price-category-group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px;
  cursor: pointer;
  list-style: none;
}

.default-sale-price-category-group > summary span {
  color: #0f172a;
  font-weight: 800;
}

.default-sale-price-category-group > summary small {
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}

.default-sale-price-sub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 8px;
  padding: 0 10px 10px;
}

.default-sale-price-sub-grid button {
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  text-align: left;
}

.default-sale-price-sub-grid button.default-sale-price-standard-pair {
  border-color: #bae6fd;
  background: #ecfeff;
  color: #0f4f65;
}

.default-sale-price-sub-grid button.is-active {
  border-color: #2563eb;
  background: #dbeafe;
  color: #1d4ed8;
}

.default-sale-price-form button {
  width: fit-content;
}

#apparelDefaultSalePriceSummary,
#apparelDefaultSalePriceList,
#apparelDisplayCapacitySummary,
#apparelDisplayCapacityList {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

#apparelDefaultSalePriceSummary.report-summary .report-summary-grid,
#apparelDisplayCapacitySummary.report-summary .report-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#apparelDefaultSalePriceSummary .store-metric,
#apparelDisplayCapacitySummary .store-metric {
  min-height: 96px;
  border-radius: 8px;
  background: #f8fafc;
}

#apparelDefaultSalePriceSummary .store-metric span,
#apparelDisplayCapacitySummary .store-metric span {
  font-size: 20px;
  line-height: 1.18;
  word-break: break-word;
}

#apparelDefaultSalePriceList,
#apparelDisplayCapacityList {
  gap: 8px;
}

#apparelDefaultSalePriceList .default-sale-price-row,
#apparelDisplayCapacityList .default-sale-price-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(120px, auto) auto;
  align-items: center;
  padding: 12px;
  border-radius: 8px;
  border-color: #e2e8f0;
  background: #ffffff;
}

#apparelDefaultSalePriceList .default-sale-price-row.default-sale-price-row-standard {
  border-color: #bae6fd;
  background: #ecfeff;
}

.default-sale-price-row-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.default-sale-price-row-main strong,
.default-sale-price-row-main .subtle {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.default-sale-price-grade {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: #0f172a;
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
}

.default-sale-price-amount {
  color: #0f172a;
  font-size: 18px;
  text-align: right;
  white-space: nowrap;
}

.default-sale-price-capacity-amount {
  color: #1d4ed8;
}

@media (max-width: 960px) {
  .default-sale-price-workbench,
  #apparelDefaultSalePriceList .default-sale-price-row,
  #apparelDisplayCapacityList .default-sale-price-row {
    grid-template-columns: 1fr;
  }

  .default-sale-price-amount {
    text-align: left;
  }
}

@media (max-width: 720px) {
  #apparelDefaultSalePriceSummary.report-summary .report-summary-grid,
  #apparelDisplayCapacitySummary.report-summary .report-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.field-help {
  color: #64748b;
  font-size: 12px;
  line-height: 1.4;
  margin-top: -2px;
}

.template-field-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.template-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}

.template-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(207, 192, 170, 0.74);
  background: linear-gradient(180deg, #fffdf8 0%, #f8f1e6 100%);
}

.template-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.template-card-badges {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.template-card-head strong {
  display: block;
  font-size: 18px;
  line-height: 1.15;
  color: var(--ink);
  margin-bottom: 4px;
}

.template-library-group {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.template-library-group-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.template-readonly-list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
  color: rgba(35, 35, 35, 0.82);
  font-size: 13px;
  line-height: 1.45;
}

.template-demo-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.template-calibration-note {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(18, 110, 120, 0.22);
  background: rgba(231, 245, 247, 0.86);
  color: rgba(18, 58, 62, 0.92);
}

.template-calibration-note strong {
  font-size: 13px;
  line-height: 1.3;
}

.template-calibration-note span {
  font-size: 12px;
  line-height: 1.45;
}

.meta-pill.is-calibrated {
  background: rgba(220, 245, 226, 0.92);
  color: #157347;
}

.template-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.template-card-actions button {
  min-width: 132px;
}

.template-demo-status {
  min-height: 22px;
  font-size: 13px;
  line-height: 1.45;
  color: rgba(35, 35, 35, 0.78);
}

.template-demo-status.tone-success {
  color: #157347;
}

.template-demo-status.tone-error {
  color: #b42318;
}

.template-preview-shell {
  position: relative;
  width: 100%;
  aspect-ratio: calc(1 / var(--template-preview-ratio, 0.6667));
  min-height: 160px;
  border-radius: 18px;
  border: 1px solid rgba(201, 189, 169, 0.72);
  background: linear-gradient(180deg, #fcf9f2 0%, #f4eddf 100%);
  overflow: hidden;
}

.template-preview-canvas {
  position: absolute;
  inset: 12px;
  border-radius: 14px;
  border: 1px solid rgba(43, 43, 43, 0.22);
  background: #fffdfa;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.62),
    0 4px 14px rgba(48, 42, 33, 0.05);
}

.template-preview-shell.mode-thermal-product,
.template-preview-shell.mode-thermal-warehouse,
.template-preview-shell.mode-thermal-warehouseout {
  background: linear-gradient(180deg, #fbf7ef 0%, #f2eadb 100%);
}

.template-preview-canvas.mode-thermal-product,
.template-preview-canvas.mode-thermal-warehouse,
.template-preview-canvas.mode-thermal-warehouseout {
  background: #fff;
  border-color: rgba(35, 35, 35, 0.18);
}

.template-preview-empty {
  height: 100%;
  display: grid;
  place-items: center;
  padding: 18px;
  text-align: center;
  color: rgba(46, 46, 46, 0.72);
  font-size: 13px;
  line-height: 1.5;
}

.template-preview-block {
  position: absolute;
  box-sizing: border-box;
  overflow: hidden;
}

.template-preview-block.is-text {
  padding: 1px 2px;
  line-height: 1.02;
  color: #141414;
  white-space: pre-line;
  font-family: "SFMono-Regular", Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing: 0.03em;
  text-transform: none;
  text-rendering: geometricPrecision;
}

.template-preview-block.is-text.mode-thermal-warehouseout,
.template-preview-block.is-text.mode-thermal-warehouse,
.template-preview-block.is-text.mode-thermal-product {
  letter-spacing: 0.04em;
}

.template-preview-block.is-barcode {
  display: block;
  background: #fff;
}

.template-preview-barcode-bars {
  width: 100%;
  height: 100%;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(17, 17, 17, 0.98) 0,
      rgba(17, 17, 17, 0.98) 2.2%,
      rgba(255, 255, 255, 0) 2.2%,
      rgba(255, 255, 255, 0) 4.1%,
      rgba(17, 17, 17, 0.98) 4.1%,
      rgba(17, 17, 17, 0.98) 5.3%,
      rgba(255, 255, 255, 0) 5.3%,
      rgba(255, 255, 255, 0) 7.2%
    );
  box-shadow: inset 0 0 0 1px rgba(16, 16, 16, 0.02);
}

.template-preview-block.is-line {
  background: rgba(18, 18, 18, 0.9);
}

.template-preview-block.align-left {
  text-align: left;
}

.template-preview-block.align-center {
  text-align: center;
}

.template-preview-block.align-right {
  text-align: right;
}

.bale-template-manager {
  display: grid;
  gap: 16px;
}

.bale-template-toolbar {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr)) auto;
  gap: 12px;
  align-items: center;
}

.bale-template-editor-shell {
  display: grid;
  grid-template-columns: minmax(220px, 250px) minmax(0, 1fr) minmax(260px, 300px);
  gap: 16px;
  align-items: start;
}

.bale-template-sidebar {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: 20px;
  border: 1px solid rgba(207, 192, 170, 0.72);
  background: linear-gradient(180deg, rgba(255, 252, 247, 0.96) 0%, rgba(247, 240, 230, 0.96) 100%);
}

.bale-template-component-list,
.bale-template-inspector {
  display: grid;
  gap: 10px;
}

.bale-template-component-card {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(191, 176, 152, 0.78);
  background: rgba(255, 255, 255, 0.82);
  text-align: left;
}

.bale-template-component-card.is-active {
  border-color: rgba(18, 110, 120, 0.58);
  box-shadow: 0 0 0 2px rgba(18, 110, 120, 0.16);
}

.bale-template-component-card strong {
  font-size: 15px;
  color: var(--ink);
}

.bale-template-component-card .subtle {
  font-size: 12px;
}

.bale-template-stage {
  display: grid;
  gap: 14px;
}

.bale-template-quick-controls {
  display: grid;
  gap: 10px;
}

.bale-template-quick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.bale-template-quick-card {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(191, 176, 152, 0.78);
  background: rgba(255, 255, 255, 0.86);
}

.bale-template-quick-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.bale-template-quick-head strong {
  font-size: 14px;
  color: var(--ink);
}

.bale-template-quick-size {
  font-size: 12px;
  color: rgba(38, 38, 38, 0.72);
}

.bale-template-quick-actions {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 36px;
  gap: 8px;
  align-items: center;
}

.bale-template-quick-actions button {
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(18, 110, 120, 0.28);
  background: rgba(233, 247, 249, 0.92);
  color: var(--brand-strong);
  font-size: 18px;
  font-weight: 700;
}

.bale-template-quick-actions input {
  text-align: center;
}

.bale-template-canvas-wrap {
  min-height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  border-radius: 24px;
  border: 1px solid rgba(204, 187, 160, 0.72);
  background:
    radial-gradient(circle at top right, rgba(255, 244, 218, 0.95), transparent 42%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.96) 0%, rgba(246, 239, 229, 0.96) 100%);
}

.bale-template-canvas {
  position: relative;
  border-radius: 18px;
  border: 1px solid rgba(30, 30, 30, 0.72);
  background:
    linear-gradient(rgba(17, 17, 17, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 17, 17, 0.05) 1px, transparent 1px),
    linear-gradient(180deg, #fffefb 0%, #f8f3e8 100%);
  background-size: 24px 24px, 24px 24px, auto;
  box-shadow: 0 18px 28px rgba(79, 64, 49, 0.14);
}

.bale-template-canvas-block {
  position: absolute;
  box-sizing: border-box;
  border-radius: 12px;
  border: 1px dashed rgba(88, 77, 61, 0.52);
  background: rgba(255, 255, 255, 0.72);
  overflow: hidden;
  cursor: grab;
  user-select: none;
}

.bale-template-canvas-text {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.bale-template-canvas-block.is-selected {
  border-color: rgba(18, 110, 120, 0.92);
  box-shadow: 0 0 0 2px rgba(18, 110, 120, 0.18);
}

.bale-template-canvas-block.is-disabled {
  opacity: 0.38;
}

.bale-template-canvas-block.is-text {
  padding: 6px;
  line-height: 1.15;
  white-space: pre-line;
  color: #111;
}

.bale-template-canvas-block.is-barcode {
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(17, 17, 17, 0.98) 0,
      rgba(17, 17, 17, 0.98) 4px,
      rgba(255, 255, 255, 0) 4px,
      rgba(255, 255, 255, 0) 7px
    ),
    rgba(255, 255, 255, 0.88);
}

.bale-template-canvas-block.is-barcode span {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.92);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.bale-template-resize-handle {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 12px;
  height: 12px;
  border-radius: 4px;
  border: 1px solid rgba(18, 110, 120, 0.55);
  background:
    linear-gradient(135deg, transparent 0 40%, rgba(18, 110, 120, 0.2) 40% 100%),
    rgba(255, 255, 255, 0.92);
  cursor: nwse-resize;
}

.bale-template-canvas-block.align-left {
  text-align: left;
}

.bale-template-canvas-block.align-center {
  text-align: center;
}

.bale-template-canvas-block.align-right {
  text-align: right;
}

.bale-template-inspector-grid {
  display: grid;
  gap: 10px;
}

.bale-template-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bale-template-meta-pill {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(234, 240, 240, 0.9);
  color: #165f69;
  font-size: 12px;
  font-weight: 700;
}

@media (max-width: 1100px) {
  .bale-template-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bale-template-editor-shell {
    grid-template-columns: 1fr;
  }
}

.json-raw-field {
  display: none;
}

.line-builder {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 12px;
  display: grid;
  gap: 10px;
  box-shadow: none;
}

.line-builder-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
  padding-bottom: 8px;
  border-bottom: 1px solid #e2e8f0;
}

.line-builder-head p {
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: #64748b;
}

.line-builder-body {
  display: grid;
  gap: 8px;
}

.line-builder-row {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 10px;
  display: grid;
  gap: 8px;
  box-shadow: none;
}

.line-builder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
}

.line-builder-field {
  display: grid;
  gap: 5px;
}

.line-builder-field label {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
}

.line-builder [data-builder-add],
.line-builder-remove,
.mini-button {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  color: #2563eb;
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 13px;
  box-shadow: none;
  width: auto;
}

.line-builder-remove {
  border-color: #fecaca;
  color: #dc2626;
  justify-self: end;
}

.inline-creator {
  border: 1px dashed #d6c8b2;
  border-radius: 16px;
  background: linear-gradient(180deg, #fffaf0 0%, #f7efe1 100%);
  padding: 14px;
  display: grid;
  gap: 12px;
}

.inline-creator-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.inline-creator-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.multi-select-box {
  width: 100%;
  min-height: 220px;
  border: 1px solid rgba(24, 61, 64, 0.16);
  border-radius: 16px;
  padding: 10px 12px;
  background: #fffdf8;
  font-size: 15px;
  line-height: 1.5;
  color: #143d40;
}

.multi-select-box option {
  padding: 10px 12px;
}

.sorting-task-form {
  display: grid;
  gap: 14px;
}

.sorting-task-flow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.sorting-task-flow-step {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: start;
  padding: 15px 16px;
  border-radius: 18px;
  border: 1px solid rgba(205, 191, 165, 0.62);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(245, 236, 222, 0.84) 100%);
  box-shadow: 0 10px 20px rgba(23, 20, 17, 0.03);
}

.sorting-task-flow-step strong {
  display: block;
  font-size: 22px;
  line-height: 1.15;
  color: var(--ink);
}

.sorting-task-flow-step p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
}

.sorting-task-flow-step.is-active {
  border-color: rgba(13, 92, 99, 0.24);
  background: linear-gradient(180deg, #f4fbfb 0%, #e8f3f4 100%);
}

.sorting-task-flow-step.is-done {
  border-color: rgba(209, 163, 74, 0.28);
  background: linear-gradient(180deg, #fff9eb 0%, #f4ebd5 100%);
}

.sorting-task-flow-step.is-pending {
  opacity: 0.82;
}

.warehouse-hub-nav {
  display: block;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.warehouse-hub-nav-head {
  display: grid;
  gap: 4px;
}

.warehouse-hub-jump-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.warehouse-hub-jump-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid #dbe3ee;
  background: #ffffff;
  color: var(--ink);
  text-align: center;
  box-shadow: none;
}

.warehouse-hub-jump-card strong {
  font-size: 15px;
  line-height: 1.25;
}

.warehouse-hub-jump-card span {
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}

.warehouse-hub-jump-card.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.sorting-task-flow-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: rgba(18, 84, 89, 0.07);
  color: var(--accent);
  font-size: 20px;
  font-weight: 800;
}

.sorting-task-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr);
  gap: 10px;
  padding: 12px;
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid #dbe3ee;
}

.sorting-task-scan-shell {
  display: grid;
  gap: 10px;
}

.sorting-task-scan-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.sorting-task-scan-box {
  display: grid;
  gap: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.sorting-task-toolbar-compact {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 0;
  border: 0;
  background: transparent;
}

.sorting-task-searchbar {
  display: grid;
}

.sorting-task-searchbar input,
.sorting-task-toolbar-compact input {
  min-height: 46px;
  background: #ffffff;
  border-color: #dbe3ee;
  box-shadow: none;
}

.sorting-scanner-summary {
  gap: 8px;
  padding: 12px 14px;
}

.sorting-scanner-pill-row {
  gap: 6px;
}

.sorting-scanner-actions {
  gap: 6px;
}

.sorting-scanner-actions .ghost-button.mini-button {
  padding-inline: 10px;
}

.sorting-task-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 14px;
  align-items: start;
}

@media (max-width: 960px) {
  .warehouse-hub-jump-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.sorting-result-workbench {
  display: grid;
  gap: 14px;
}

.sorting-result-shell {
  display: grid;
  gap: 12px;
}

.sorting-result-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.sorting-result-grade-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.sorting-result-shell .task-manager-card {
  border-radius: 8px;
  border-color: #dbe3ee;
  background: #ffffff;
  box-shadow: none;
  opacity: 1;
}

.sorting-result-shell .task-manager-card.is-open,
.sorting-result-shell .task-manager-card.is-done {
  border-color: #dbe3ee;
  background: #ffffff;
}

.sorting-result-shell .task-manager-time-item,
.sorting-result-shell .task-manager-detail-item {
  border-radius: 8px;
  border-color: #e2e8f0;
  background: #f8fafc;
}

.sorting-result-shell .task-manager-time-item strong {
  letter-spacing: 0;
  text-transform: none;
}

.sorting-grade-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--accent);
  font-size: 13px;
  font-weight: 700;
}

.sorting-task-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid #dbe3ee;
  background: #ffffff;
  align-content: start;
  box-shadow: none;
}

.sorting-task-panel-selected {
  background: #ffffff;
  border-color: #dbe3ee;
}

.sorting-task-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.sorting-task-bulk-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.sorting-task-bulk-actions .mini-button {
  white-space: nowrap;
}

.sorting-task-panel-head strong {
  display: block;
  font-size: 21px;
  line-height: 1.2;
  color: var(--ink);
}

.sorting-task-panel-head p {
  display: none;
}

.sorting-task-list {
  display: grid;
  gap: 10px;
}

.sorting-task-group {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #dbe3ee;
  background: #ffffff;
}

.sorting-task-group.is-expanded {
  border-color: #2563eb;
  background: #f8fbff;
}

.sorting-task-group-toggle {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.sorting-task-group-toggle strong {
  display: block;
  font-size: 18px;
  line-height: 1.18;
  color: var(--ink);
}

.sorting-task-group-meta {
  color: var(--accent);
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.sorting-task-group-list {
  display: grid;
  gap: 8px;
}

.sorting-task-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid #dbe3ee;
  background: #ffffff;
}

.sorting-task-item-compact {
  align-items: center;
  gap: 10px;
  min-height: 0;
  padding: 9px 10px;
  border-radius: 12px;
}

.sorting-task-item-main {
  min-width: 0;
}

.sorting-task-item.is-selected {
  border-color: #2563eb;
  background: #f8fbff;
}

.sorting-task-item-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 6px;
}

.sorting-task-item-head strong {
  font-size: 18px;
  line-height: 1.22;
  color: var(--ink);
}

.sorting-task-item-compact .sorting-task-item-head {
  align-items: center;
  margin-bottom: 3px;
}

.sorting-task-item-compact .sorting-task-item-head strong {
  min-width: 0;
  font-size: 15px;
  line-height: 1.18;
  word-break: break-all;
}

.sorting-task-item-kicker {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.sorting-task-item-line {
  min-width: 0;
  color: #7b735f;
  font-size: 12px;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sorting-task-selected-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sorting-task-selected-list {
  display: grid;
  gap: 12px;
}

.sorting-task-item-meta {
  margin-top: 8px;
}

.sorting-task-item-compact .sorting-task-item-meta {
  margin-top: 5px;
}

.sorting-weight-badge {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(13, 92, 99, 0.08);
  color: #0d5c63;
  font-size: 13px;
  font-weight: 700;
}

.sorting-weight-badge strong {
  font-size: 16px;
  line-height: 1;
}

.sorting-weight-badge em {
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.08em;
}

.sorting-task-item-compact .sorting-weight-badge {
  padding: 2px 7px;
  font-size: 11px;
}

.sorting-task-item-compact .sorting-weight-badge strong {
  font-size: 13px;
}

.sorting-weight-badge.is-missing {
  background: rgba(120, 108, 87, 0.1);
  color: rgba(80, 67, 48, 0.82);
}

.sorting-task-manager-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

.sorting-task-manager-toolbar input[type="date"] {
  width: auto;
  min-width: 190px;
}

.task-manager-grid {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.task-manager-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(207, 192, 170, 0.76);
  background: linear-gradient(180deg, #fffef9 0%, #f8f1e5 100%);
}

.task-manager-card.is-open {
  border-color: rgba(13, 92, 99, 0.18);
  background: linear-gradient(180deg, #f5fbfa 0%, #edf6f3 100%);
}

.task-manager-card.is-done {
  opacity: 0.88;
}

.task-manager-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.task-manager-head strong {
  display: block;
  font-size: 20px;
  line-height: 1.18;
  color: var(--ink);
  margin-bottom: 4px;
}

.task-manager-time-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.task-manager-time-grid--wide {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.task-manager-time-item {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(207, 192, 170, 0.58);
}

.task-manager-time-item strong {
  font-size: 12px;
  color: var(--muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.task-manager-time-item span {
  color: var(--ink);
  font-size: 15px;
  font-weight: 700;
}

.task-manager-detail-list {
  display: grid;
  gap: 10px;
}

.task-manager-detail-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(207, 192, 170, 0.58);
}

.task-manager-detail-item strong {
  display: block;
  font-size: 17px;
  line-height: 1.2;
  color: var(--ink);
  margin-bottom: 4px;
}

.task-manager-detail-side {
  display: grid;
  justify-items: end;
  gap: 6px;
  text-align: right;
}

#sortingResultForm .line-builder-head p strong {
  color: var(--accent);
}

.line-builder-meta {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(20, 98, 107, 0.07);
  border: 1px solid rgba(20, 98, 107, 0.14);
  color: rgba(32, 48, 52, 0.8);
  font-size: 13px;
  line-height: 1.5;
}

.modal-shell {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.52);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow-y: auto;
  padding: 16px;
  z-index: 50;
}

.modal-card {
  width: min(720px, 100%);
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
  padding: 16px;
  display: grid;
  gap: 12px;
}

.modal-card-wide {
  width: min(1180px, calc(100vw - 20px));
  max-height: calc(100vh - 20px);
  margin: 0 auto;
  overflow: auto;
  padding-bottom: 16px;
}

.modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e2e8f0;
}

.gm-store-shelving-batch-bar,
.gm-store-shelving-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.gm-store-shelving-batch-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.gm-store-inventory-detail-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex: 1 1 520px;
  flex-wrap: wrap;
}

.gm-store-inventory-search-field {
  flex: 1 1 360px;
  max-width: 560px;
}

.gm-store-inventory-search-field input {
  width: 100%;
  min-width: 260px;
  margin: 0;
}

.gm-store-inventory-image-cell {
  width: 64px;
  min-width: 64px;
  padding: 6px 8px !important;
}

.gm-store-inventory-image,
.gm-store-inventory-image-placeholder {
  display: grid;
  width: 48px;
  height: 48px;
  border-radius: 8px;
}

.gm-store-inventory-image {
  object-fit: cover;
  background: #f1f5f9;
}

.gm-store-inventory-image-placeholder {
  place-items: center;
  border: 1px dashed #cbd5e1;
  background: #f8fafc;
  color: #64748b;
  font-size: 11px;
}

.gm-store-shelving-modal {
  z-index: 90;
  align-items: center;
}

.gm-store-shelving-modal-card {
  width: min(980px, 100%);
  max-height: min(90vh, 860px);
  overflow: auto;
}

.gm-store-shelving-common-fields {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(150px, 0.55fr);
  gap: 12px;
}

.gm-store-shelving-common-fields label,
.gm-store-shelving-selected-row label {
  display: grid;
  gap: 6px;
}

.gm-store-shelving-note {
  grid-column: 1 / -1;
}

.gm-store-shelving-selected-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.gm-store-shelving-selected-head,
.gm-store-shelving-selected-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 110px 110px minmax(160px, auto);
  gap: 12px;
  align-items: center;
}

.gm-store-shelving-selected-head {
  grid-template-columns: 1fr auto;
  padding: 0 2px 4px;
}

.gm-store-shelving-selected-row {
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.gm-store-shelving-selected-row > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.gm-store-shelving-selected-row > div:first-child span {
  color: #64748b;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.gm-store-shelving-selected-row input {
  width: 100%;
}

.gm-store-shelving-modal-actions {
  position: sticky;
  bottom: -16px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 14px -16px -16px;
  padding: 12px 16px;
  border-top: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.97);
}

[data-gm-store-shelving-inventory-row].is-selected td {
  background: rgba(20, 98, 107, 0.08);
}

@media (max-width: 720px) {
  .gm-store-inventory-detail-actions,
  .gm-store-inventory-search-field {
    flex-basis: 100%;
    max-width: none;
  }

  .gm-store-inventory-search-field input {
    min-width: 0;
  }

  .gm-store-shelving-common-fields,
  .gm-store-shelving-selected-row {
    grid-template-columns: 1fr;
  }

  .gm-store-shelving-note {
    grid-column: auto;
  }

  .gm-store-shelving-selected-row .status-badge {
    width: fit-content;
  }

  .gm-store-shelving-modal-actions > button {
    flex: 1;
  }
}

.bale-print-modal-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.62fr);
  gap: 14px;
  align-items: start;
  min-height: 0;
}

.bale-print-modal-preview {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  min-height: clamp(260px, 50vh, 560px);
  height: clamp(260px, 50vh, 560px);
}

.bale-print-modal-preview iframe {
  width: 100%;
  min-height: clamp(260px, 50vh, 560px);
  height: clamp(260px, 50vh, 560px);
  border: none;
  background: #fff;
}

.bale-print-modal-side {
  display: grid;
  gap: 12px;
  min-height: 0;
  align-content: start;
  max-height: calc(100vh - 220px);
  overflow: auto;
  padding-right: 4px;
}

.bale-print-primary-actions {
  display: grid;
  gap: 8px;
}

.bale-print-primary-button {
  width: 100%;
  min-height: 38px;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
}

.bale-print-advanced {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
  padding: 10px 12px;
}

.bale-print-advanced summary {
  cursor: pointer;
  font-weight: 600;
  color: #475569;
  min-height: 32px;
  display: flex;
  align-items: center;
}

.bale-print-advanced[open] {
  display: grid;
  gap: 10px;
}

.bale-print-advanced .button-row {
  gap: 8px;
}

.bale-print-modal-side .flow-summary-note.warning {
  border-color: var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
  font-weight: 600;
}

.bale-modal-status-row .warning-pill {
  border: 1px solid var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.bale-shipment-lock-form {
  grid-template-columns: minmax(0, 1fr) 220px;
  align-items: end;
  margin-bottom: 14px;
}

.completed-bale-list {
  display: grid;
  gap: 12px;
}

.completed-bale-card {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  padding: 12px;
  display: grid;
  gap: 6px;
}

.completed-bale-card strong {
  font-size: 16px;
  color: var(--ink);
}

.completed-bale-card span {
  color: rgba(32, 48, 52, 0.78);
}

.bale-modal-toolbar {
  display: grid;
  gap: 12px;
}

.bale-modal-toolbar-clean {
  padding: 12px 14px;
}

.bale-modal-title-block {
  display: grid;
  gap: 4px;
}

.bale-modal-title-block strong {
  font-size: 22px;
  line-height: 1.18;
  color: var(--ink);
  word-break: break-word;
}

.bale-modal-toolbar .button-row {
  flex-wrap: wrap;
}

.bale-modal-inline-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.bale-print-modal-side .candidate-list,
.bale-print-modal-side .candidate-summary {
  max-height: 24vh;
  overflow: auto;
}

.bale-print-modal-side .candidate-row {
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  gap: 8px;
}

.bale-print-modal-side .selected-bale-row strong {
  font-size: 14px;
  line-height: 1.25;
}

@media (max-width: 1180px) {
  .manual-replenishment-context,
  .manual-replenishment-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .manual-replenishment-context {
    display: grid;
    align-items: start;
  }

  .manual-replenishment-meta {
    justify-content: flex-start;
  }

  .modal-card-wide {
    width: min(1000px, calc(100vw - 16px));
  }

  .bale-print-modal-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .bale-print-modal-side {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  .bale-print-primary-actions {
    position: sticky;
    bottom: 0;
    z-index: 2;
    padding: 10px 0 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 26%);
  }

  .bale-print-primary-button {
    min-height: 42px;
    font-size: 14px;
  }
}

@media (max-width: 720px) {
  .manual-replenishment-fields,
  .transfer-items-table-row,
  .transfer-items-table-row .line-builder-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .transfer-items-table-head {
    display: none;
  }

  .transfer-items-table-cell label {
    display: block;
  }

  .transfer-items-table-row .line-builder-remove {
    justify-self: start;
    width: auto;
  }
}

.bale-modal-status-row {
  align-items: flex-start;
}

.bale-print-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.55fr);
  gap: 18px;
  align-items: start;
}

.bale-print-shell-clean {
  align-items: start;
}

.bale-print-primary,
.bale-print-finished {
  display: grid;
  gap: 14px;
}

.bale-print-panel-head,
.bale-print-workbench-head {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  padding: 12px 14px;
  display: grid;
  gap: 10px;
}

.bale-print-panel-head strong {
  display: block;
  font-size: 22px;
  line-height: 1.15;
  color: var(--ink);
}

.bale-print-workbench-head h3 {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
}

.bale-print-workbench-head .subtle {
  max-width: 62ch;
}

.bale-compact-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bale-print-inline-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.bale-compact-stat {
  min-width: 104px;
  padding: 9px 10px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  display: grid;
  gap: 2px;
}

.bale-compact-stat strong {
  font-size: 24px;
  line-height: 1;
  color: var(--ink);
}

.bale-compact-stat span {
  font-size: 12px;
  color: rgba(32, 48, 52, 0.72);
}

.bale-completed-panel {
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  padding: 12px;
}

.bale-completed-panel .candidate-summary.empty-state {
  min-height: 92px;
  padding: 12px 14px;
}

.bale-batch-card {
  gap: 8px;
  padding: 12px 14px;
}

.bale-batch-head {
  gap: 12px;
}

.bale-batch-title strong {
  font-size: 16px;
}

.bale-batch-title span {
  font-size: 13px;
}

.bale-batch-progress {
  padding: 6px 9px;
  font-size: 12px;
}

.bale-batch-item {
  padding: 8px 10px;
}

.bale-batch-item-code strong {
  font-size: 15px;
}

.bale-batch-item-code span {
  font-size: 12px;
}

[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-meta,
[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-current,
[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-note,
[data-page-scope="raw-bale-print-confirmation"] #baleBarcodeLockSummary,
[data-page-scope="raw-bale-print-confirmation"] .raw-bale-print-scope-note {
  display: none !important;
}

[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-context {
  border-radius: 8px;
  border-color: #dbe3ef;
  background: #ffffff;
  box-shadow: none;
}

[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-step {
  border-radius: 8px;
  border-color: #dbeafe;
  background: #f8fafc;
}

[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-step.current,
[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-step.active,
[data-page-scope="raw-bale-print-confirmation"] .inbound-flow-step.completed {
  background: #eff6ff;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-print-shell-clean {
  grid-template-columns: minmax(0, 1fr);
}

[data-page-scope="raw-bale-print-confirmation"] .bale-print-panel-head {
  border-color: #dbe3ef;
  background: #ffffff;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-print-panel-head .subtle.small,
[data-page-scope="raw-bale-print-confirmation"] .bale-workbench-list-actions [data-bale-batch-toggle-all="true"] {
  display: none;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-workbench-list-actions {
  justify-content: flex-end;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-card {
  border-radius: 8px;
  border: 1px solid #dbe3ef;
  background: #ffffff;
  box-shadow: none;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-card[class*="status-card--"] {
  border-left-width: 1px !important;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-card.is-active {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.08);
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-head {
  align-items: center;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-title {
  gap: 6px;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-title strong {
  font-size: 18px;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-title span {
  color: #334155;
  font-size: 15px;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-meta {
  padding-top: 2px;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-items {
  border-top: 1px solid #e2e8f0;
  padding-top: 10px;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-item {
  border-radius: 8px;
  border-color: #e2e8f0;
  background: #f8fafc;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-batch-card-actions {
  justify-content: flex-end;
}

[data-page-scope="raw-bale-print-confirmation"] .bale-print-finished[hidden] {
  display: none !important;
}

@media (max-width: 980px) {
  #balePrintModal .bale-print-primary-row {
    grid-template-columns: 1fr;
  }

  .modal-card-wide {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
    padding: 16px;
  }

  .bale-print-modal-layout,
  .bale-print-shell,
  .bale-modal-inline-grid {
    grid-template-columns: 1fr;
  }

  .bale-print-workbench-head h3 {
    font-size: 22px;
  }

  .bale-print-panel-head strong,
  .bale-modal-title-block strong {
    font-size: 18px;
  }

  .transfer-prep-shell,
  .warehouse-prep-main,
  .warehouse-prep-toolbar {
    grid-template-columns: 1fr;
  }

  .replenishment-workorder-shell {
    grid-template-columns: 1fr;
  }

  .warehouse-prep-print-card {
    position: static;
  }
}

.form-grid.compact {
  margin-bottom: 12px;
}

button,
input,
select,
textarea {
  width: 100%;
  min-height: 34px;
  border-radius: var(--radius-control);
  border: 1px solid var(--line-strong);
  padding: 7px 10px;
  font: inherit;
}

input,
select,
textarea {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  color: #0f172a;
  border-radius: 6px;
  min-height: 36px;
  padding: 7px 10px;
  box-shadow: none;
}

textarea {
  resize: vertical;
}

button {
  background: var(--fw-primary);
  color: white;
  border: none;
  cursor: pointer;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0;
  box-shadow: none;
  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease, background 160ms ease;
}

button:hover {
  background: var(--fw-primary-hover);
  filter: none;
  transform: none;
  box-shadow: none;
}

button[type="submit"] {
  background: var(--fw-primary);
}

input:focus,
select:focus,
textarea:focus {
  outline: 0;
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.12);
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.workspace-tab:focus-visible,
.workspace-page-link:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.24);
  outline-offset: 2px;
}

.ghost-button {
  width: auto;
  background: var(--fw-surface);
  color: var(--accent);
  border: 1px solid var(--fw-border);
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 13px;
  box-shadow: none;
}

.workspace-top-panel .ghost-button,
.workspace-top-panel .button-row button {
  background: var(--fw-surface);
  color: var(--fw-primary);
  border: 1px solid var(--fw-border);
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.button-row button {
  width: auto;
  background: var(--fw-surface);
  color: var(--accent);
  border: 1px solid var(--fw-border);
  box-shadow: none;
}

.summary-actions-row {
  margin-top: 14px;
}

.summary-actions-row button {
  font-weight: 700;
}

.flow-primary-action-form {
  margin-top: 12px;
}

.flow-primary-action-form button,
.flow-primary-action {
  margin-top: 12px;
}

.flow-summary-note {
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.flow-summary-note.success {
  border-color: rgba(20, 93, 100, 0.26);
  background: linear-gradient(180deg, #f3fbfa 0%, #e6f4f2 100%);
  color: #0f4d55;
}

.hidden-output {
  display: none;
}

.empty-state {
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  padding: 12px;
  color: #64748b;
  background: #f8fafc;
  font-size: 13px;
  line-height: 1.4;
}

.alert-summary {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}

.alert-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}

.alert-stat {
  border-radius: 16px;
  padding: 14px;
  background: linear-gradient(180deg, #fff8f8 0%, #fff0f0 100%);
  border: 1px solid var(--danger-line);
}

.alert-stat strong {
  display: block;
  font-size: 15px;
  color: var(--danger-ink);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.alert-stat span {
  display: block;
  margin-top: 8px;
  font-size: 30px;
  font-weight: 800;
  color: var(--danger);
}

.alert-banner {
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--status-info-border);
  background: var(--status-info-bg);
  color: var(--status-info-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.alert-banner.success-banner {
  border-color: var(--status-success-border);
  background: var(--status-success-bg);
  color: var(--status-success-text);
}

.alert-banner.info-banner {
  border-color: var(--status-info-border);
  background: var(--status-info-bg);
  color: var(--status-info-text);
}

.alert-banner.warning-banner {
  border-color: var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.alert-banner.danger-banner,
.alert-banner.error-banner,
.status-error-banner {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-text);
}

.alert-banner.neutral-banner {
  border-color: var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-text);
}

.inline-feedback {
  padding: 12px 16px;
  border-radius: 16px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  transition: opacity 0.26s ease, transform 0.26s ease;
  opacity: 1;
  transform: translateY(0);
}

.inline-feedback.is-success {
  background: linear-gradient(135deg, rgba(13, 92, 99, 0.12) 0%, rgba(11, 63, 68, 0.08) 100%);
  border: 1px solid rgba(13, 92, 99, 0.16);
  color: #0d4f55;
}

.inline-feedback.is-error {
  background: linear-gradient(135deg, rgba(143, 45, 45, 0.11) 0%, rgba(122, 18, 18, 0.08) 100%);
  border: 1px solid rgba(143, 45, 45, 0.16);
  color: #7a1212;
}

.inline-feedback.is-fading {
  opacity: 0;
  transform: translateY(-4px);
}

.transient-summary {
  transition: opacity 0.26s ease, transform 0.26s ease;
  opacity: 1;
  transform: translateY(0);
}

.transient-summary.is-fading {
  opacity: 0;
  transform: translateY(-4px);
}

.alert-list {
  display: grid;
  gap: 12px;
}

.sorting-stock-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  align-content: start;
}

.sorting-stock-search-shell {
  margin-top: 12px;
  border: 1px solid rgba(143, 125, 97, 0.22);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.76);
  overflow: hidden;
}

.sorting-stock-search-shell summary {
  list-style: none;
  cursor: pointer;
  padding: 16px 18px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  font-weight: 800;
}

.sorting-stock-search-shell summary::-webkit-details-marker {
  display: none;
}

.sorting-stock-search-shell[open] summary {
  border-bottom: 1px dashed rgba(143, 125, 97, 0.28);
}

.sorting-stock-search-shell form {
  padding: 16px 18px 18px;
}

.sorting-stock-split-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.92fr);
  gap: 18px;
  align-items: start;
}

.sorting-stock-split-section {
  display: grid;
  gap: 12px;
  align-content: start;
}

.sorting-stock-row {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.76);
  padding: 14px;
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 0;
  overflow: hidden;
}

.sorting-stock-row-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.sorting-stock-row-head strong {
  font-size: 18px;
  word-break: break-all;
}

.sorting-stock-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 6px;
  min-width: 0;
}

.sorting-stock-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 4px 7px;
  border-radius: 8px;
  background: rgba(18, 84, 89, 0.08);
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .sorting-stock-split-grid {
    grid-template-columns: 1fr;
  }
}

.sorting-stock-group-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.76);
  padding: 18px;
  display: grid;
  gap: 14px;
}

.sorting-stock-group-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.sorting-stock-group-head-copy {
  display: grid;
  gap: 10px;
}

.sorting-stock-group-title {
  font-size: 24px;
  line-height: 1.1;
}

.sorting-stock-kpi-row,
.sorting-stock-metric-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.sorting-stock-kpi-pill,
.sorting-stock-summary-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
}

.sorting-stock-group-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.95fr);
  gap: 18px;
}

.sorting-stock-group-column {
  display: grid;
  gap: 12px;
  align-content: start;
}

.sorting-stock-group-column-head {
  display: grid;
  gap: 4px;
  padding-bottom: 10px;
  border-bottom: 1px dashed rgba(143, 125, 97, 0.28);
}

.sorting-stock-inline-card {
  border: 1px solid rgba(143, 125, 97, 0.22);
  border-radius: 16px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.84);
  display: grid;
  gap: 10px;
}

.sorting-stock-grade-card {
  background: linear-gradient(180deg, #ffffff 0%, #fbfdfd 100%);
}

.sorting-stock-packed-summary-card {
  background: linear-gradient(180deg, #fcfffe 0%, #f4fbf9 100%);
}

.sorting-stock-secondary-list {
  display: grid;
  gap: 10px;
  padding-top: 4px;
  border-top: 1px dashed rgba(143, 125, 97, 0.28);
}

.sorting-stock-secondary-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.sorting-stock-secondary-title {
  font-size: 16px;
}

.sorting-stock-inline-creator {
  border: 1px solid rgba(13, 92, 99, 0.16);
  border-radius: 16px;
  background: linear-gradient(180deg, #fbfefd 0%, #f3fbf9 100%);
  padding: 14px;
  display: grid;
  gap: 12px;
}

.sorting-stock-inline-creator .inline-feedback {
  margin: 0;
}

@media (max-width: 1100px) {
  .sorting-stock-group-columns {
    grid-template-columns: 1fr;
  }

  .sorting-stock-secondary-row {
    flex-direction: column;
  }
}

.alert-item {
  border-radius: 18px;
  padding: 18px;
  border: 1px solid var(--danger-line);
  background: linear-gradient(180deg, #fffaf9 0%, #fff0ee 100%);
}

.neutral-stat {
  background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
  border-color: rgba(13, 92, 99, 0.16);
}

.neutral-stat strong,
.neutral-title {
  color: var(--accent);
}

.neutral-stat span {
  color: var(--accent);
}

.neutral-item {
  border-color: rgba(13, 92, 99, 0.16);
  background: linear-gradient(180deg, #fbfefd 0%, #f3fbf9 100%);
}

.neutral-chip {
  background: rgba(13, 92, 99, 0.1);
  color: var(--accent);
}

.alert-item-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 10px;
}

.alert-item-title {
  font-size: 22px;
  font-weight: 800;
  color: var(--danger-ink);
}

.alert-item-time {
  color: var(--muted);
  font-size: 15px;
  white-space: nowrap;
}

.alert-item-summary {
  margin: 0 0 10px;
  color: var(--ink);
}

.meta-row,
.chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.meta-pill,
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--accent);
  font-size: 14px;
  font-weight: 700;
}

.chip {
  background: rgba(143, 45, 45, 0.1);
  color: var(--danger-ink);
}

.status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 6px;
  border: 1px solid var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-text);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.status-badge--success {
  border-color: var(--status-success-border);
  background: var(--status-success-bg);
  color: var(--status-success-text);
}

.status-badge--warning {
  border-color: var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.status-badge--danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-text);
}

.status-badge--info {
  border-color: var(--status-info-border);
  background: var(--status-info-bg);
  color: var(--status-info-text);
}

.status-badge--neutral {
  border-color: var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-text);
}

.status-block {
  display: grid;
  gap: 4px;
  padding: 9px 11px;
  border-radius: 8px;
  border: 1px solid var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.status-block--success {
  border-color: var(--status-success-border);
  background: var(--status-success-bg);
  color: var(--status-success-text);
}

.status-block--warning {
  border-color: var(--status-warning-border);
  background: var(--status-warning-bg);
  color: var(--status-warning-text);
}

.status-block--danger {
  border-color: var(--status-danger-border);
  background: var(--status-danger-bg);
  color: var(--status-danger-text);
}

.status-block--info {
  border-color: var(--status-info-border);
  background: var(--status-info-bg);
  color: var(--status-info-text);
}

.status-block--neutral {
  border-color: var(--status-neutral-border);
  background: var(--status-neutral-bg);
  color: var(--status-neutral-text);
}

.status-card--success,
.status-card--warning,
.status-card--danger,
.status-card--info,
.status-card--neutral {
  border-left-width: 4px !important;
}

.status-card--success {
  border-left-color: var(--status-success-text) !important;
}

.status-card--warning {
  border-left-color: var(--status-warning-text) !important;
}

.status-card--danger {
  border-left-color: var(--status-danger-text) !important;
}

.status-card--info {
  border-left-color: var(--status-info-text) !important;
}

.status-card--neutral {
  border-left-color: var(--status-neutral-text) !important;
}

.return-flow {
  display: grid;
  gap: 12px;
  margin-bottom: 18px;
}

.choice-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.choice-pill {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fffaf2;
  color: var(--ink);
  font-weight: 700;
}

.choice-pill input {
  width: auto;
  margin: 0;
}

.candidate-summary {
  display: grid;
  gap: 6px;
  padding: 12px;
  border-radius: var(--radius-panel);
  background: var(--fw-surface);
  border: 1px solid var(--fw-border);
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.gm-product-create-lead {
  margin: 6px 0 0;
  max-width: 980px;
  color: #475569;
}

.gm-product-create-section-head h4,
.gm-product-create-result-head strong {
  color: #0f172a;
}

.gm-product-create-section-copy {
  display: block;
  margin-top: 4px;
  color: #64748b;
  line-height: 1.45;
}

.gm-product-create-section-head,
.gm-product-create-result-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.gm-product-create-image-grid {
  margin-top: 12px;
}

.gm-product-create-image-tile {
  border-style: solid;
  background: #fff;
}

.gm-product-create-image-tile .button-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
}

.gm-product-create-image-tile .ghost-button {
  min-height: 34px;
}

.gm-product-spu-main-image-card {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, 260px) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #f8fafc;
}

.gm-product-spu-main-image-card strong,
.gm-product-spu-main-image-card span,
.gm-product-spu-main-image-card code {
  display: block;
  overflow-wrap: anywhere;
}

.gm-product-spu-main-preview {
  min-height: 58px;
  display: grid;
  place-items: center;
  border: 1px dashed #94a3b8;
  border-radius: 8px;
  background: #ffffff;
  color: #475569;
  font-weight: 800;
}

.gm-product-spu-main-preview.is-uploaded {
  border-color: #60a5fa;
  background: #eff6ff;
  color: #1d4ed8;
}

.gm-product-attribute-picker {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
  padding: 10px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #f8fafc;
}

.gm-product-attribute-picker legend {
  padding: 0 4px;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.gm-product-attribute-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.gm-product-attribute-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: flex-start;
  min-height: 54px;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
  cursor: pointer;
}

.gm-product-attribute-option:has(input:checked) {
  border-color: #2563eb;
  background: #eff6ff;
}

.gm-product-attribute-option input {
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.gm-product-attribute-option strong,
.gm-product-attribute-option small {
  display: block;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.gm-product-attribute-option strong {
  color: #0f172a;
  font-size: 13px;
}

.gm-product-attribute-option small {
  margin-top: 2px;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.gm-product-added-card span {
  font-weight: 800;
  color: #0f172a;
}

.gm-product-added-card small {
  color: #64748b;
}

.gm-product-added-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.gm-product-added-card {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #fff;
}

.gm-product-added-card strong {
  color: #64748b;
  font-size: 12px;
}

.gm-product-added-card span {
  font-size: 17px;
  overflow-wrap: anywhere;
}

.gm-product-create-system-record {
  margin: 10px 0 0;
  padding-top: 8px;
  border-top: 1px solid #e2e8f0;
  color: #64748b;
  font-size: 12px;
}

.gm-product-list-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.gm-product-list-summary span {
  display: grid;
  gap: 4px;
  min-height: 56px;
  padding: 10px 12px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
}

.gm-product-list-summary b {
  color: #64748b;
  font-size: 12px;
}

.gm-product-spu-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.gm-product-spu-card {
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.gm-product-spu-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
}

.gm-product-spu-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.gm-product-spu-title strong {
  color: #0f172a;
  font-size: 17px;
  overflow-wrap: anywhere;
}

.gm-product-spu-title span,
.gm-product-spu-title small {
  color: #64748b;
  overflow-wrap: anywhere;
}

.gm-product-spu-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.gm-product-sku-list {
  display: grid;
  gap: 0;
  border-top: 1px solid #e2e8f0;
  background: #f8fafc;
}

.gm-product-sku-row + .gm-product-sku-row {
  border-top: 1px solid #e2e8f0;
}

.gm-product-sku-toggle {
  width: 100%;
  display: grid;
  grid-template-columns: 52px minmax(220px, 1fr) 110px 110px auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #334155;
  text-align: left;
  cursor: pointer;
}

.gm-product-sku-toggle:hover,
.gm-product-sku-toggle:focus-visible {
  background: #eef4ff;
}

.gm-product-sku-toggle strong {
  display: block;
  color: #0f172a;
}

.gm-product-sku-toggle small {
  display: block;
  margin-top: 2px;
  color: #64748b;
}

.gm-product-sku-detail {
  padding: 12px;
  border-top: 1px solid #dbe3ef;
  background: #fff;
}

.gm-product-sku-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.gm-product-sku-detail-grid span {
  display: grid;
  gap: 3px;
  min-height: 54px;
  padding: 9px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  overflow-wrap: anywhere;
}

.gm-product-sku-detail-grid b {
  color: #64748b;
  font-size: 12px;
}

.gm-product-sku-image-block {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.gm-product-sku-image-block > strong {
  color: #0f172a;
}

.gm-product-list-image-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px;
}

.gm-product-list-image-tile {
  display: grid;
  gap: 4px;
  min-height: 132px;
  padding: 9px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
}

.gm-product-list-image-tile.is-uploaded {
  border-style: solid;
  border-color: #86efac;
  background: #f0fdf4;
}

.gm-product-list-image-thumb {
  display: grid;
  place-items: center;
  min-height: 46px;
  border-radius: 6px;
  background: #fff;
  color: #64748b;
  font-weight: 800;
}

.gm-product-list-image-tile.is-uploaded .gm-product-list-image-thumb {
  background: #dcfce7;
  color: #166534;
}

.gm-product-list-image-tile strong,
.gm-product-list-image-tile span,
.gm-product-list-image-tile small {
  overflow-wrap: anywhere;
}

.gm-product-list-image-tile small {
  color: #64748b;
}

@media (max-width: 900px) {
  .gm-product-added-grid,
  .gm-product-list-summary,
  .gm-product-spu-main-image-card,
  .gm-product-spu-head,
  .gm-product-sku-toggle,
  .gm-product-sku-detail-grid {
    grid-template-columns: 1fr;
  }
}

.gm-category-column {
  min-width: 0;
}

.gm-category-column h3 {
  margin: 0 0 4px;
  color: #334155;
}

.gm-category-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  max-height: 460px;
  overflow: auto;
  padding-right: 4px;
}

.gm-category-card {
  width: 100%;
  appearance: none;
  display: grid;
  gap: 5px;
  min-height: 92px;
  padding: 10px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  text-align: left;
  cursor: pointer;
}

.gm-category-card:hover {
  border-color: #94a3b8;
  background: #f8fafc;
}

.gm-category-card.selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: inset 3px 0 0 #2563eb;
}

.gm-category-card-cn {
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.gm-category-card-en {
  color: #475569;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.gm-category-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.gm-category-pill {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 22px;
  padding: 3px 7px;
  border-radius: 6px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.gm-category-card-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  overflow-wrap: anywhere;
}

.gm-supplier-root {
  color: #334155;
}

.gm-supplier-page {
  display: grid;
  gap: 14px;
}

.gm-supplier-hero,
.gm-supplier-form-panel,
.gm-supplier-list-panel,
.gm-supplier-scope-note {
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #ffffff;
}

.gm-supplier-hero {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.gm-supplier-hero h3 {
  margin: 0;
  color: #0f172a;
}

.gm-supplier-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.gm-supplier-form-panel,
.gm-supplier-list-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.gm-supplier-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.gm-supplier-section-head strong {
  color: #334155;
}

.gm-supplier-section-head button {
  flex: 0 0 auto;
}

.gm-supplier-form-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 14px;
  align-items: start;
}

.gm-supplier-card-grid {
  display: grid;
  gap: 12px;
}

.gm-supplier-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #fbfdff;
}

.gm-supplier-card.is-disabled {
  background: #f8fafc;
  opacity: 0.74;
}

.gm-supplier-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.gm-supplier-card-head h4 {
  margin: 4px 0 2px;
  color: #0f172a;
  font-size: 16px;
  line-height: 1.35;
}

.gm-supplier-card-head p {
  margin: 0;
  color: #64748b;
}

.gm-supplier-code {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 6px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.gm-supplier-card-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.gm-supplier-field {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.gm-supplier-field input {
  min-width: 0;
  width: 100%;
  height: 38px;
  padding: 8px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
}

.gm-supplier-category-picker {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 10px;
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #ffffff;
}

.gm-supplier-category-picker legend {
  padding: 0 4px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.gm-supplier-category-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
  max-height: 220px;
  overflow: auto;
  padding-right: 4px;
}

.gm-supplier-category-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: flex-start;
  min-height: 54px;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  cursor: pointer;
}

.gm-supplier-category-option:has(input:checked) {
  border-color: #2563eb;
  background: #eff6ff;
}

.gm-supplier-category-option input {
  width: 16px;
  height: 16px;
  margin-top: 2px;
}

.gm-supplier-category-option strong,
.gm-supplier-category-option small {
  display: block;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.gm-supplier-category-option strong {
  color: #0f172a;
  font-size: 13px;
}

.gm-supplier-category-option small {
  margin-top: 2px;
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.gm-supplier-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.gm-supplier-empty,
.gm-supplier-scope-note {
  padding: 12px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 980px) {
  .gm-supplier-form-layout {
    grid-template-columns: 1fr;
  }
}

.operations-distributor-entry-root {
  color: #334155;
}

.operations-distributor-page {
  display: grid;
  gap: 14px;
}

.operations-distributor-hero,
.operations-distributor-form-panel,
.operations-distributor-list-panel,
.operations-distributor-scope-note {
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #ffffff;
}

.operations-distributor-hero,
.operations-distributor-form-panel,
.operations-distributor-list-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.operations-distributor-hero h3 {
  margin: 0;
  color: #0f172a;
}

.operations-distributor-toolbar,
.operations-distributor-section-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: flex-start;
  justify-content: space-between;
}

.operations-distributor-search {
  max-width: 420px;
}

.operations-distributor-form-layout {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  align-items: end;
}

.operations-distributor-field {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.operations-distributor-field input {
  min-width: 0;
  width: 100%;
  height: 38px;
  padding: 8px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
}

.operations-distributor-card-grid {
  display: grid;
  gap: 10px;
}

.operations-distributor-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dbe3ee;
  border-radius: 8px;
  background: #fbfdff;
}

.operations-distributor-card.is-disabled {
  background: #f8fafc;
  opacity: 0.74;
}

.operations-distributor-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.operations-distributor-card-head h4 {
  margin: 4px 0 2px;
  color: #0f172a;
  font-size: 16px;
  line-height: 1.35;
}

.operations-distributor-card-head p {
  margin: 0;
  color: #64748b;
}

.operations-distributor-code {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 6px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.operations-distributor-empty,
.operations-distributor-scope-note,
.operations-distributor-notice {
  padding: 12px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.5;
}

.content-small-b-lookup-page {
  width: 100%;
}

.content-small-b-card {
  display: grid;
  gap: 16px;
  width: min(100%, 520px);
  padding: 22px;
  border: 1px solid #d7e3ef;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(15, 23, 42, 0.1);
}

.content-small-b-lookup-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.content-small-b-lookup-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
}

.content-small-b-lookup-form input {
  width: 100%;
  min-width: 0;
  height: 48px;
  padding: 10px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0;
}

.content-small-b-lookup-form input:focus {
  outline: 3px solid rgba(37, 99, 235, 0.18);
  border-color: #2563eb;
}

.content-small-b-lookup-form button {
  height: 48px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  background: #2563eb;
  color: #ffffff;
  font-size: 15px;
  font-weight: 900;
  cursor: pointer;
}

.content-small-b-lookup-form button:disabled {
  cursor: wait;
  background: #94a3b8;
}

.content-small-b-message,
.content-small-b-status-card {
  border-radius: 8px;
  padding: 14px;
  font-size: 14px;
  line-height: 1.5;
}

.content-small-b-message {
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 800;
}

.content-small-b-message.is-error {
  border-color: #fecaca;
  background: #fff1f2;
  color: #b91c1c;
}

.content-small-b-status-card {
  display: grid;
  gap: 5px;
  border: 1px solid #dbe3ef;
  background: #f8fafc;
}

.content-small-b-status-card.is-available {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.content-small-b-status-card.is-sold {
  border-color: #fed7aa;
  background: #fff7ed;
}

.content-small-b-status-label {
  width: max-content;
  padding: 4px 8px;
  border-radius: 6px;
  background: #0f172a;
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
}

.content-small-b-status-card.is-available .content-small-b-status-label {
  background: #16a34a;
}

.content-small-b-status-card.is-sold .content-small-b-status-label {
  background: #ea580c;
}

.content-small-b-status-card strong {
  color: #0f172a;
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: 0;
}

.content-small-b-status-card p,
.content-small-b-status-card small {
  margin: 0;
  color: #475569;
}

@media (max-width: 560px) {
  .content-small-b-card {
    padding: 18px;
  }

  .content-small-b-lookup-form {
    grid-template-columns: 1fr;
  }

  .content-small-b-lookup-form button {
    width: 100%;
  }
}

.gm-card { display:grid; gap:12px; margin:14px 0 0; padding:16px; border:1px solid #d8e1ec; border-radius:14px; background:#fff; box-shadow:0 4px 14px rgba(15, 23, 42, 0.04); }
.gm-upload-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap:12px; }
.gm-upload-tile { border:1px dashed #94a3b8; border-radius:12px; padding:14px 10px; font-size:12px; color:#334155; background:linear-gradient(180deg,#f8fbff 0%,#f1f5f9 100%); line-height:1.6; text-align:center; font-weight:600; }
.gm-upload-tile span { color:#64748b; font-size:11px; font-weight:500; }
.gm-summary-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:12px; }
.gm-metric { display:grid; gap:6px; padding:12px; border-radius:12px; border:1px solid #cfe0ff; background:#f8fbff; font-weight:700; color:#334155; }
.gm-metric-highlight { border-color:#60a5fa; background:#dbeafe; box-shadow: inset 0 0 0 1px #93c5fd; }
.gm-table-scroll { overflow-x:auto; border:1px solid #e2e8f0; border-radius:12px; }
.gm-table-scroll .table { min-width:1080px; }
.gm-rule-grid { display:grid; gap:10px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.gm-rule-switch { display:grid; gap:6px; padding:10px 12px; border:1px solid #dbeafe; border-radius:12px; background:#f8fbff; }
.gm-label-preview { border:1px solid #94a3b8; border-radius:12px; background:#fff; padding:12px; box-shadow: inset 0 0 0 2px #e2e8f0; display:grid; gap:8px; }
.gm-label-head { font-size:20px; font-weight:800; letter-spacing:1px; border-bottom:1px dashed #94a3b8; padding-bottom:6px; }
.gm-label-body { display:grid; gap:4px; font-size:13px; }
.gm-label-code-placeholder { border:1px dashed #475569; border-radius:8px; min-height:64px; display:flex; align-items:center; justify-content:center; background:#f8fafc; color:#475569; font-weight:700; }
.gm-label-warning { margin:0; padding:8px; border-radius:8px; background:#fff1f2; border:1px solid #fecaca; color:#9f1239; font-weight:800; text-align:center; }
.gm-warning { border-color:#fecaca; background:#fff1f2; color:#9f1239; font-weight:700; }
.gm-payable-summary { border-color:#60a5fa; background:#dbeafe; color:#1e3a8a; font-weight:800; }
@media (max-width: 900px) { .gm-summary-grid { grid-template-columns: 1fr; } }


.warehouse-prep-task-summary {
  padding: 12px;
  background: var(--fw-surface);
  border: 1px solid var(--fw-border);
  margin-top: 12px;
}

.transfer-advanced-options {
  padding: 10px 12px;
  border: 1px solid var(--fw-border);
  border-radius: var(--radius-panel);
  background: var(--fw-surface-muted);
}

.transfer-advanced-options summary {
  cursor: pointer;
  color: var(--fw-text);
  font-size: 13px;
  font-weight: 700;
}

.transfer-advanced-options[open] {
  display: grid;
  gap: 8px;
}

.manual-replenishment-entry-card .transfer-advanced-options,
.warehouse-prep-task-summary .transfer-advanced-options {
  padding: 7px 0 0;
  border: 0;
  border-top: 1px solid var(--fw-border);
  border-radius: 0;
  background: transparent;
}

.manual-replenishment-entry-card .transfer-advanced-options summary,
.warehouse-prep-task-summary .transfer-advanced-options summary {
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}

.warehouse-prep-stage-hint {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

#pickingWaveSubmitButton:disabled {
  background: #f1f5f9;
  border-color: #e2e8f0;
  color: #94a3b8;
  box-shadow: none;
  cursor: not-allowed;
}

.inbound-flow-context {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 8px;
  border: 1px solid #dbe3ef;
  background: #ffffff;
  box-shadow: none;
  margin-bottom: 14px;
}

.inbound-flow-context.empty-state {
  display: grid;
}

.inbound-flow-empty {
  display: grid;
  gap: 8px;
  color: var(--muted);
}

.inbound-flow-empty strong {
  color: var(--ink);
  font-size: 15px;
}

.inbound-flow-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.inbound-flow-title-block {
  display: grid;
  gap: 2px;
}

.inbound-flow-eyebrow {
  color: #64748b;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: uppercase;
}

.inbound-flow-title-block strong {
  font-size: 18px;
  line-height: 1.15;
  color: var(--ink);
}

.inbound-flow-subtitle {
  color: #64748b;
  font-size: 12px;
}

.inbound-flow-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.inbound-flow-meta .store-flag {
  min-height: 0;
  padding: 6px 10px;
  border: 1px solid #dbe3ef;
  background: #f8fafc;
  color: #334155;
  font-size: 12px;
  line-height: 1.2;
}

.inbound-flow-current {
  display: none;
  gap: 2px;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, #145d64 0%, #0f4f56 100%);
  color: #fff7eb;
  box-shadow: 0 18px 30px rgba(13, 79, 86, 0.14);
}

.inbound-flow-current-label {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 247, 235, 0.66);
}

.inbound-flow-current strong {
  font-size: 24px;
  line-height: 1.05;
  color: #ffffff;
}

.inbound-flow-current span:last-child {
  font-size: 13px;
  color: rgba(255, 247, 235, 0.82);
}

.inbound-flow-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.inbound-flow-step {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 56px;
  padding: 9px 10px;
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid #dbe3ef;
  position: relative;
}

.inbound-flow-step::after {
  content: "";
  position: absolute;
  right: -8px;
  top: 50%;
  width: 8px;
  height: 1px;
  background: #dbe3ef;
  transform: translateY(-50%);
}

.inbound-flow-step:last-child::after {
  display: none;
}

.inbound-flow-step-index {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
}

.inbound-flow-step div {
  display: grid;
  gap: 1px;
}

.inbound-flow-step strong {
  color: #0f172a;
  font-size: 16px;
  line-height: 1.1;
}

.inbound-flow-step span:last-child {
  color: #64748b;
  font-size: 11px;
  line-height: 1.35;
}

.inbound-flow-step.completed {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.inbound-flow-step.completed .inbound-flow-step-index {
  background: #2563eb;
  color: #fff;
}

.inbound-flow-step.active {
  border-color: #bfdbfe;
  background: #eff6ff;
  box-shadow: none;
}

.inbound-flow-step.current {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.08);
}

.inbound-flow-step.current .inbound-flow-step-index {
  background: #2563eb;
  color: #fff;
}

.inbound-flow-step.current strong {
  color: #1d4ed8;
}

.inbound-flow-step.active .inbound-flow-step-index {
  background: #2563eb;
  color: #fff;
}

.inbound-flow-step.active strong {
  color: #1d4ed8;
}

.inbound-flow-step.pending {
  opacity: 0.62;
}

.inbound-flow-note {
  display: none;
  color: #64748b;
  font-size: 11px;
  line-height: 1.35;
  padding-left: 2px;
}

@media (max-width: 1100px) {
  .ops-overview-grid {
    grid-template-columns: 1fr;
  }

  .sorting-task-scan-row,
  .transfer-ops-grid {
    grid-template-columns: 1fr;
  }

  .inbound-flow-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inbound-flow-step:nth-child(2)::after,
  .inbound-flow-step:nth-child(4)::after {
    display: none;
  }
}

@media (max-width: 720px) {
  .inbound-flow-steps {
    grid-template-columns: 1fr;
  }

  .inbound-flow-step::after {
    display: none;
  }

  .inbound-flow-current strong {
    font-size: 20px;
  }

  .inbound-flow-step strong {
    font-size: 15px;
  }
}

.inbound-flow-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.inbound-flow-actions .ghost-button[disabled] {
  opacity: 0.42;
  cursor: not-allowed;
  pointer-events: none;
}

.candidate-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.candidate-summary-grid.compact-metrics {
  gap: 10px;
}

.candidate-summary-grid.compact-metrics .store-metric {
  padding: 12px 14px;
  border-radius: 16px;
}

.candidate-summary-grid.compact-metrics .store-metric span {
  font-size: 24px;
}

.shipment-reconcile-shell {
  display: grid;
  gap: 16px;
}

.shipment-reconcile-top {
  display: grid;
  grid-template-columns: 1.15fr 1.15fr 0.9fr;
  gap: 16px;
}

.shipment-reconcile-panel {
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(205, 191, 165, 0.58);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(248, 241, 229, 0.86) 100%);
  display: grid;
  gap: 14px;
  box-shadow: 0 10px 24px rgba(23, 20, 17, 0.035);
}

.shipment-reconcile-panel--focus {
  background: linear-gradient(180deg, rgba(13, 92, 99, 0.06) 0%, rgba(13, 92, 99, 0.02) 100%);
  border-color: rgba(13, 92, 99, 0.18);
}

.shipment-reconcile-panel-head {
  display: grid;
  gap: 4px;
}

.shipment-reconcile-panel-head strong {
  font-size: 24px;
  line-height: 1.15;
  color: var(--ink);
}

.shipment-reconcile-source-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.shipment-reconcile-docs {
  display: grid;
  gap: 10px;
}

.shipment-reconcile-docs .meta {
  font-size: 14px;
  line-height: 1.6;
}

.shipment-reconcile-listing {
  display: grid;
  gap: 10px;
}

.shipment-reconcile-focus-note {
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(13, 92, 99, 0.08);
  color: rgba(23, 20, 17, 0.86);
  font-size: 14px;
  line-height: 1.6;
}

.shipment-reconcile-list {
  display: grid;
  gap: 10px;
}

.shipment-reconcile-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(207, 192, 170, 0.72);
  background: rgba(255, 255, 255, 0.6);
}

.shipment-reconcile-row-main {
  display: grid;
  gap: 8px;
}

.shipment-reconcile-row-title {
  display: grid;
  gap: 4px;
}

.shipment-reconcile-row-title strong {
  font-size: 21px;
  line-height: 1.15;
}

.shipment-reconcile-row-title span {
  color: var(--muted);
  font-size: 14px;
}

.shipment-reconcile-row-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  color: rgba(58, 51, 38, 0.88);
  font-size: 14px;
}

.shipment-reconcile-row-side {
  display: grid;
  gap: 6px;
  justify-items: end;
  text-align: right;
}

.shipment-reconcile-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  background: #edf6ef;
  color: #1b6a36;
}

.shipment-reconcile-status.mismatch,
.shipment-reconcile-status.expected-only,
.shipment-reconcile-status.actual-only {
  background: var(--danger-soft);
  color: var(--danger-ink);
}

#shipmentIntakeSummary.candidate-summary {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#shipmentIntakeSummary > .flow-summary-note {
  margin-bottom: 10px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  font-size: 13px;
}

#shipmentIntakeSummary > .candidate-summary-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 10px;
}

#shipmentIntakeSummary > .candidate-summary-grid .store-metric {
  min-height: 0;
  padding: 10px 12px;
  border-radius: 8px;
  border-color: #dbe3ef;
  background: #ffffff;
}

#shipmentIntakeSummary > .candidate-summary-grid .store-metric span {
  font-size: 16px;
  line-height: 1.25;
}

.shipment-confirm-console {
  display: grid;
  gap: 10px;
}

.shipment-confirm-hero {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #ffffff;
}

.shipment-confirm-hero > div:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.shipment-confirm-hero strong {
  color: #0f172a;
  font-size: 20px;
  line-height: 1.2;
}

.shipment-confirm-hero span:last-child {
  color: #475569;
  font-size: 13px;
  line-height: 1.45;
}

.shipment-confirm-status-pill {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 800;
}

.shipment-confirm-status-pill.pending {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.shipment-confirm-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.shipment-confirm-metric {
  display: grid;
  gap: 4px;
  min-height: 86px;
  padding: 11px 12px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #ffffff;
}

.shipment-confirm-metric span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.shipment-confirm-metric strong {
  color: #0f172a;
  font-size: 20px;
  line-height: 1.15;
}

.shipment-confirm-metric small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.25;
}

.shipment-confirm-metric.warning {
  border-color: #fed7aa;
  background: #fff7ed;
}

.shipment-confirm-metric.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.shipment-confirm-details,
.shipment-confirm-rows {
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #ffffff;
}

.shipment-confirm-details summary {
  cursor: pointer;
  padding: 12px 14px;
  color: #334155;
  font-size: 14px;
  font-weight: 800;
}

.shipment-confirm-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.75fr);
  gap: 10px;
  padding: 0 14px 14px;
}

.shipment-confirm-detail-grid .meta,
.shipment-confirm-detail-grid .empty-state {
  margin-top: 8px;
  min-height: 0;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.shipment-confirm-detail-grid .summary-breakdown-block {
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.shipment-confirm-detail-grid .summary-breakdown-row {
  padding: 7px 0;
  border-bottom-color: #e2e8f0;
  background: transparent;
  font-size: 12px;
}

.shipment-confirm-rows {
  display: grid;
  gap: 0;
}

.shipment-confirm-rows-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid #e2e8f0;
}

.shipment-confirm-rows-head strong {
  color: #0f172a;
  font-size: 17px;
}

.shipment-confirm-rows-head span {
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
}

.shipment-confirm-rows .shipment-reconcile-list {
  padding: 12px;
}

.shipment-reconcile-shell {
  gap: 10px;
}

.shipment-reconcile-top {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(260px, 0.72fr);
  gap: 10px;
}

.shipment-reconcile-panel,
.shipment-reconcile-panel--focus {
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #dbe3ef;
  background: #ffffff;
  box-shadow: none;
  gap: 10px;
}

.shipment-reconcile-panel--focus {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.shipment-reconcile-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e2e8f0;
}

.shipment-reconcile-panel-head .eyebrow {
  display: none;
}

.shipment-reconcile-panel-head strong {
  font-size: 18px;
  line-height: 1.2;
}

.shipment-reconcile-source-meta {
  gap: 6px;
}

.shipment-reconcile-shell .candidate-summary-grid.compact-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.shipment-reconcile-panel--focus .candidate-summary-grid.compact-metrics {
  grid-template-columns: 1fr;
}

.shipment-reconcile-shell .candidate-summary-grid.compact-metrics .store-metric {
  min-height: 0;
  padding: 9px 10px;
  border-radius: 8px;
  border-color: #dbe3ef;
  background: #f8fafc;
  box-shadow: none;
}

.shipment-reconcile-shell .candidate-summary-grid.compact-metrics .store-metric strong {
  margin-bottom: 3px;
  color: #64748b;
  font-size: 12px;
}

.shipment-reconcile-shell .candidate-summary-grid.compact-metrics .store-metric span {
  color: #0f172a;
  font-size: 18px;
  line-height: 1.25;
}

.shipment-reconcile-docs {
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.shipment-reconcile-docs > strong,
.summary-breakdown-block > strong {
  color: #334155;
  font-size: 13px;
}

.shipment-reconcile-docs .meta {
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.shipment-reconcile-docs .empty-state {
  min-height: 0;
  padding: 10px;
  border-radius: 8px;
  background: #ffffff;
  font-size: 12px;
}

.shipment-reconcile-listing {
  gap: 8px;
}

.shipment-reconcile-listing .summary-breakdown-block {
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.shipment-reconcile-listing .summary-breakdown-row {
  padding: 7px 0;
  border-bottom-color: #e2e8f0;
  background: transparent;
  font-size: 12px;
}

.shipment-reconcile-focus-note {
  padding: 10px 12px;
  border-radius: 8px;
  background: #e0f2fe;
  color: #075985;
  font-size: 13px;
  line-height: 1.45;
}

.shipment-reconcile-panel--full {
  margin-top: 0;
}

.shipment-reconcile-row {
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 12px;
  padding: 12px;
  border-radius: 8px;
  border-color: #dbe3ef;
  background: #ffffff;
}

.shipment-reconcile-row-main {
  gap: 6px;
}

.shipment-reconcile-row-title {
  gap: 2px;
}

.shipment-reconcile-row-title strong {
  font-size: 17px;
}

.shipment-reconcile-row-meta {
  gap: 6px 12px;
  color: #475569;
  font-size: 13px;
}

.shipment-reconcile-status {
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 12px;
}

.manager-console-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.manager-console-panel {
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(205, 191, 165, 0.56);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.96) 0%, rgba(242, 247, 247, 0.88) 100%);
  display: grid;
  gap: 12px;
  box-shadow: 0 12px 24px rgba(23, 20, 17, 0.035);
}

.manager-console-head {
  display: grid;
  gap: 4px;
}

.manager-console-head strong {
  font-size: 22px;
  line-height: 1.12;
  color: var(--ink);
}

.manager-console-list {
  display: grid;
  gap: 10px;
}

.manager-console-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(205, 191, 165, 0.54);
  background: rgba(255, 255, 255, 0.82);
}

.manager-console-row-main {
  display: grid;
  gap: 4px;
}

.manager-console-row-main strong {
  font-size: 18px;
  line-height: 1.14;
  color: var(--ink);
}

.manager-console-row-side {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.manager-console-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.manager-console-actions .summary-actions-row {
  margin-top: 0;
}

.bulk-scan-input {
  min-height: 180px;
  resize: vertical;
  line-height: 1.5;
  font-family: inherit;
}

.receipt-diff-list {
  display: grid;
  gap: 8px;
}

.receipt-diff-list .store-flag {
  justify-content: flex-start;
}

.clerk-home-shell {
  display: grid;
  gap: 16px;
}

.clerk-home-header {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: 16px;
  align-items: stretch;
}

.clerk-home-title {
  display: grid;
  gap: 6px;
  padding: 18px 20px;
  border-radius: 20px;
  background:
    radial-gradient(circle at top right, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(180deg, rgba(17, 93, 100, 0.98) 0%, rgba(10, 64, 70, 0.98) 100%);
  color: #fffdf7;
  box-shadow: 0 18px 32px rgba(13, 53, 57, 0.14);
}

.clerk-home-title strong {
  font-size: 34px;
  line-height: 1.08;
}

.clerk-home-title p {
  margin: 0;
  color: rgba(255, 253, 247, 0.82);
  font-size: 14px;
  line-height: 1.6;
}

.clerk-home-title .eyebrow {
  color: rgba(255, 253, 247, 0.7);
}

.clerk-home-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.clerk-home-metrics .store-metric {
  min-height: 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(247, 240, 227, 0.94) 100%);
  box-shadow: 0 10px 22px rgba(23, 20, 17, 0.03);
}

.clerk-home-metrics .store-metric span {
  font-size: 32px;
}

.clerk-home-current {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 18px 20px;
  border-radius: 20px;
  border: 1px solid rgba(205, 191, 165, 0.62);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.98) 0%, rgba(244, 248, 248, 0.9) 100%);
  box-shadow: 0 16px 30px rgba(13, 53, 57, 0.08);
}

.clerk-home-current-copy {
  display: grid;
  gap: 8px;
}

.clerk-home-current-copy strong {
  font-size: 30px;
  line-height: 1.04;
  color: var(--ink);
}

.clerk-home-current-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.clerk-home-current-meta span {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(13, 93, 100, 0.07);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.clerk-home-current-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.compact-button {
  min-height: 58px;
  padding: 0 24px;
  font-size: 19px;
  white-space: nowrap;
}

.clerk-home-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.95fr);
  gap: 16px;
}

.clerk-home-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(205, 191, 165, 0.56);
  background: linear-gradient(180deg, rgba(255, 253, 248, 0.96) 0%, rgba(248, 241, 230, 0.88) 100%);
  box-shadow: 0 12px 24px rgba(13, 53, 57, 0.05);
}

.clerk-home-panel-head {
  display: grid;
  gap: 4px;
}

.clerk-home-list {
  display: grid;
  gap: 10px;
}

.clerk-home-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(205, 191, 165, 0.54);
  background: rgba(255, 255, 255, 0.82);
}

.clerk-home-row-copy {
  display: grid;
  gap: 4px;
}

.clerk-home-row-copy strong {
  font-size: 18px;
  line-height: 1.15;
  color: var(--ink);
}

.clerk-home-row-side {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.compact-empty {
  min-height: 0;
  padding: 18px 16px;
}

@media (max-width: 1280px) {
  .shipment-reconcile-top {
    grid-template-columns: 1fr;
  }

  .manager-console-grid,
  .clerk-home-header,
  .clerk-home-grid {
    grid-template-columns: 1fr;
  }

  .clerk-home-current {
    grid-template-columns: 1fr;
  }

  .clerk-home-current-actions {
    justify-content: stretch;
  }

  .clerk-home-current-actions .compact-button {
    width: 100%;
  }
}

@media (max-width: 800px) {
  .shipment-reconcile-row {
    grid-template-columns: 1fr;
  }

  .shipment-reconcile-row-side {
    justify-items: start;
    text-align: left;
  }

  .clerk-home-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .clerk-home-title strong {
    font-size: 28px;
  }

  .clerk-home-current-copy strong {
    font-size: 24px;
  }

  .clerk-home-metrics .store-metric span {
    font-size: 26px;
  }

  .clerk-home-row {
    grid-template-columns: 1fr;
  }

  .clerk-home-row-side {
    justify-items: stretch;
  }

  .clerk-home-row-side .compact-button {
    width: 100%;
  }
}

.parcel-directory-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 14px;
  margin-top: 12px;
}

.parcel-shipment-folder {
  border-radius: 20px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #fffdf8 0%, #f5eee3 100%);
  box-shadow: 0 10px 24px rgba(13, 53, 57, 0.08);
  overflow: hidden;
}

.parcel-shipment-summary {
  list-style: none;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  cursor: pointer;
}

.parcel-shipment-summary::-webkit-details-marker {
  display: none;
}

.parcel-shipment-summary h3 {
  margin: 2px 0 0;
  font-size: 22px;
  line-height: 1.2;
  color: var(--ink);
}

.parcel-shipment-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.shipment-total-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: 10px 14px;
  border-radius: 999px;
  background: var(--brand-700);
  color: #fff7eb;
  font-size: 18px;
  font-weight: 800;
}

.parcel-shipment-body {
  display: grid;
  gap: 14px;
  padding: 0 18px 18px;
}

.shipment-doc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  margin-top: 10px;
}

.shipment-doc-card {
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.72);
  color: var(--ink);
  text-decoration: none;
}

.shipment-doc-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid rgba(13, 53, 57, 0.08);
}

.shipment-doc-card span {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.parcel-batch-list {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.parcel-batch-line {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.72);
}

.parcel-batch-line-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.parcel-folder-badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(13, 105, 112, 0.1);
  color: var(--brand-700);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.candidate-stat {
  padding: 14px;
  border-radius: 16px;
  background: linear-gradient(180deg, #faf7f0 0%, #f2ece3 100%);
  border: 1px solid var(--line);
}

.candidate-stat strong {
  display: block;
  font-size: 14px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.candidate-stat span {
  display: block;
  margin-top: 8px;
  font-size: 28px;
  font-weight: 800;
}

.candidate-list {
  display: grid;
  gap: 10px;
}

.candidate-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #fffef9 0%, #f8f1e5 100%);
}

.china-source-cost-panel {
  display: grid;
  gap: 12px;
  background: #f8fafc;
}

.china-source-cost-panel .panel-head h2 {
  font-size: 24px;
}

.china-source-cost-top {
  grid-template-columns: minmax(320px, 0.78fr) minmax(640px, 1.22fr);
  gap: 14px;
  align-items: start;
}

#chinaSourceCostRecordList.candidate-summary,
#chinaSourceCostSummary.report-summary {
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #dbe3ef;
  background: #ffffff;
  box-shadow: none;
  align-content: start;
}

#chinaSourceCostRecordList {
  gap: 10px;
  max-height: 420px;
  overflow: auto;
}

#chinaSourceCostRecordList .candidate-row {
  padding: 12px;
  border-radius: 8px;
  background: #ffffff;
  gap: 12px;
}

#chinaSourceCostRecordList .candidate-row strong {
  font-size: 16px;
  line-height: 1.3;
  color: var(--ink);
}

#chinaSourceCostRecordList .subtle.small {
  font-size: 13px;
  line-height: 1.45;
}

#chinaSourceCostRecordList .button-row {
  gap: 8px;
  align-self: center;
}

#chinaSourceCostRecordList .candidate-row .button-row + .subtle.small {
  display: none;
}

#chinaSourceCostRecordList .ghost-button.mini-button {
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
}

#chinaSourceCostSummary {
  gap: 8px;
}

#chinaSourceCostSummary .report-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

#chinaSourceCostSummary .report-summary-grid:nth-of-type(2) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#chinaSourceCostSummary .store-metric {
  padding: 10px;
  border-radius: 8px;
  border-color: #dbe3ef;
  box-shadow: none;
  background: #f8fafc;
}

#chinaSourceCostSummary .store-metric strong {
  font-size: 12px;
  margin-bottom: 3px;
  color: #64748b;
}

#chinaSourceCostSummary .store-metric span {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.32;
  color: #0f172a;
}

#chinaSourceCostSummary .store-metric .subtle.small {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#chinaSourceCostSummary .meta {
  padding: 8px 10px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  line-height: 1.45;
  margin-top: 0;
}

#chinaSourceCostSummary .meta:first-of-type {
  display: none;
}

.china-source-cost-form {
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  padding: 14px;
  border: 1px solid #dbe3ef;
  border-radius: 8px;
  background: #ffffff;
}

.china-source-cost-selector {
  grid-column: 1 / 3;
  display: grid;
  gap: 6px;
}

.china-source-cost-selector span {
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.china-source-cost-form > button[type="submit"] {
  grid-column: 3;
}

.china-source-cost-form .field-help {
  display: none;
}

.china-source-cost-panel input,
.china-source-cost-panel select,
.china-source-cost-panel textarea,
.china-source-cost-panel button {
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
}

.china-source-cost-panel input,
.china-source-cost-panel select,
.china-source-cost-panel textarea {
  background: #ffffff;
  box-shadow: none;
}

.china-source-cost-panel button {
  font-size: 15px;
  box-shadow: none;
}

.china-source-cost-form > button[type="submit"] {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  justify-self: stretch;
}

.china-cost-stage {
  padding: 12px;
  gap: 10px;
  border-radius: 8px;
  border-color: #dbe3ef;
  background: #f8fafc;
}

.china-cost-stage .line-builder-head {
  gap: 8px;
}

.china-cost-stage .line-builder-head strong {
  font-size: 15px;
  line-height: 1.25;
  color: var(--ink);
}

.china-cost-stage .line-builder-head p {
  display: none;
}

.china-cost-stage .line-builder-grid {
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.china-cost-stage .line-builder-grid > input[name$="_reference"],
.china-cost-stage .line-builder-grid > .field-stack {
  grid-column: 1 / -1;
}

.china-cost-stage .field-stack {
  gap: 6px;
}

.china-cost-stage .field-stack label {
  font-size: 13px;
  color: var(--muted);
}

.china-source-cost-panel .inline-feedback {
  padding: 10px 12px;
  font-size: 14px;
}

@media (max-width: 1080px) {
  .china-source-cost-top {
    grid-template-columns: 1fr;
  }

  #chinaSourceCostSummary .report-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #chinaSourceCostSummary .report-summary-grid:nth-of-type(2) {
    grid-template-columns: 1fr;
  }

  .china-source-cost-form {
    grid-template-columns: 1fr;
  }

  .china-source-cost-selector,
  .china-source-cost-form > button[type="submit"] {
    grid-column: 1;
  }
}

.selected-bale-row {
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
}

.selected-bale-body {
  display: grid;
  gap: 6px;
  min-width: 0;
  flex: 1 1 auto;
}

.selected-bale-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: nowrap;
  align-self: flex-start;
}

.china-source-bale-list,
.china-source-history-list {
  margin-top: 14px;
}

.china-source-bale-row strong,
.china-source-history-row strong {
  color: #0d5c63;
  font-size: 17px;
  line-height: 1.2;
}

.selected-bale-actions .ghost-button.mini-button {
  min-width: 56px;
  min-height: 48px;
  padding: 10px 12px;
}

.selected-bale-actions .store-flag {
  white-space: nowrap;
}

.bale-browser-layout {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 14px;
  margin-top: 14px;
  align-items: start;
}

.bale-browser-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.78);
  align-content: start;
  align-self: start;
}

.bale-browser-panel-right {
  max-height: fit-content;
}

.bale-browser-panel-right .candidate-list {
  align-content: start;
}

.bale-filter-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.candidate-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(207, 192, 170, 0.82);
  background: linear-gradient(180deg, #fffef9 0%, #f8f1e5 100%);
}

.candidate-item-action {
  grid-template-columns: 1fr auto;
  align-items: start;
}

.candidate-item-action.is-selected {
  border-color: rgba(13, 92, 99, 0.24);
  background: linear-gradient(180deg, #f3fbfa 0%, #eaf6f4 100%);
}

.candidate-item input[type="checkbox"] {
  width: 22px;
  height: 22px;
  margin-top: 6px;
}

.candidate-side-actions {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.store-pda-workbench {
  display: grid;
  grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
  gap: 18px;
  margin-top: 18px;
}

.store-pda-groups,
.store-pda-panel {
  border: 1px solid rgba(205, 191, 165, 0.6);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255, 254, 249, 0.98) 0%, rgba(248, 241, 229, 0.9) 100%);
  padding: 18px;
  box-shadow: 0 12px 24px rgba(23, 20, 17, 0.035);
}

.store-pda-groups-head,
.store-pda-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.store-pda-panel-head h3 {
  margin: 6px 0 0;
  font-size: 24px;
  line-height: 1.15;
}

.store-printer-status {
  margin-top: 14px;
}

.store-printer-status .printer-status-meta {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.store-pda-head-metrics {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.store-pda-group-list {
  display: grid;
  gap: 10px;
}

.store-pda-group-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(205, 191, 165, 0.58);
  background: rgba(255, 255, 255, 0.86);
  cursor: pointer;
}

.store-pda-group-card.is-active {
  border-color: rgba(13, 92, 99, 0.28);
  background: linear-gradient(180deg, #f4fbfb 0%, #e6f3f2 100%);
  box-shadow: 0 12px 22px rgba(13, 92, 99, 0.08);
}

.store-pda-group-card input[type="radio"] {
  margin-top: 4px;
}

.store-pda-group-text {
  display: grid;
  gap: 4px;
}

.store-pda-group-text strong {
  font-size: 17px;
  line-height: 1.2;
  color: var(--ink);
}

.store-pda-group-text span {
  color: rgba(76, 66, 53, 0.76);
  font-size: 14px;
}

.store-pda-main {
  display: grid;
  gap: 18px;
}

.store-pda-locked-grid,
.store-pda-edit-grid {
  display: grid;
  gap: 12px;
}

.store-pda-locked-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 14px;
}

.store-pda-edit-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 10px;
}

.store-pda-locked-grid label,
.store-pda-edit-grid label {
  display: grid;
  gap: 6px;
}

.store-pda-locked-grid span,
.store-pda-edit-grid span {
  font-size: 13px;
  color: rgba(76, 66, 53, 0.72);
  font-weight: 700;
}

.store-pda-action-row {
  margin-top: 14px;
  justify-content: flex-start;
  gap: 10px;
}

.store-pda-token-list {
  max-height: 320px;
  overflow: auto;
}

.store-pda-token-row {
  padding: 12px 14px;
}

.store-pda-page .panel-head {
  margin-bottom: 10px;
}

.store-pda-entry-form {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.store-pda-mobile-empty {
  min-height: 170px;
  align-content: center;
  justify-items: center;
  text-align: center;
  background: #ffffff;
}

.store-pda-mobile-shell {
  width: min(480px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 12px;
  padding: 0 0 76px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.store-pda-mobile-status,
.store-pda-mobile-scan-zone,
.store-pda-current-item-card,
.store-pda-putaway-panel,
.store-pda-task-list,
.store-pda-mobile-advanced {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.store-pda-mobile-status {
  position: sticky;
  top: 10px;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
}

.store-pda-mobile-status div {
  display: grid;
  gap: 2px;
}

.store-pda-mobile-status strong {
  color: #0f172a;
  font-size: 14px;
  line-height: 1.2;
}

.store-pda-mobile-status span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.25;
}

.store-pda-mobile-scan-zone {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.store-pda-scan-copy {
  display: grid;
  gap: 3px;
}

.store-pda-scan-copy span,
.store-pda-scan-input-wrap span,
.store-pda-current-head span,
.store-pda-task-list-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}

.store-pda-scan-copy strong {
  color: #0f172a;
  font-size: 24px;
  line-height: 1.1;
}

.store-pda-scan-copy small,
.store-pda-current-head small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}

.store-pda-scan-input-wrap {
  display: grid;
  gap: 5px;
}

.store-pda-scan-input-wrap input,
.store-pda-touch-fields input,
.store-pda-mobile-advanced input,
.store-pda-mobile-advanced select {
  min-height: 48px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #0f172a;
  font-size: 16px;
  padding: 10px 12px;
}

.store-pda-scan-input-wrap input:focus,
.store-pda-touch-fields input:focus,
.store-pda-mobile-advanced input:focus,
.store-pda-mobile-advanced select:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.14);
}

.store-pda-scan-button,
.store-pda-bottom-actions .primary-button {
  min-height: 54px;
  width: 100%;
  border: 1px solid #2563eb;
  border-radius: 10px;
  background: #2563eb;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  box-shadow: none;
}

.store-pda-scan-message {
  min-height: 32px;
  display: flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}

.store-pda-scan-message.is-success {
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.store-pda-scan-message.is-warning {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  color: #9a3412;
}

.store-pda-current-item-card,
.store-pda-putaway-panel,
.store-pda-task-list,
.store-pda-mobile-advanced {
  padding: 14px;
}

.store-pda-current-head,
.store-pda-task-list-head,
.store-pda-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 10px;
}

.store-pda-current-head div,
.store-pda-task-list-head div {
  display: grid;
  gap: 4px;
}

.store-pda-current-head strong,
.store-pda-task-list-head h3,
.store-pda-panel-head h3 {
  margin: 0;
  color: #0f172a;
  font-size: 20px;
  line-height: 1.15;
}

.store-pda-status-badge {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 800;
}

.store-pda-item-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.store-pda-item-facts span {
  min-height: 52px;
  display: grid;
  gap: 3px;
  padding: 9px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #0f172a;
  font-size: 13px;
}

.store-pda-item-facts b {
  color: #64748b;
  font-size: 11px;
}

.store-pda-touch-fields {
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.store-pda-touch-fields label,
.store-pda-mobile-advanced label {
  display: grid;
  gap: 5px;
}

.store-pda-touch-fields span,
.store-pda-mobile-advanced label span {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}

.store-pda-touch-actions {
  margin-top: 10px;
}

.store-pda-touch-actions .ghost-button,
.store-pda-mobile-advanced .ghost-button,
.store-pda-bottom-actions .ghost-button {
  min-height: 44px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #2563eb;
  font-size: 14px;
  font-weight: 700;
}

.store-pda-mobile-list {
  display: grid;
  gap: 8px;
  max-height: 330px;
  overflow: auto;
}

.store-pda-mobile-row {
  min-height: 58px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.store-pda-mobile-row.is-current {
  border-color: #93c5fd;
  background: #eff6ff;
}

.store-pda-mobile-row div {
  display: grid;
  gap: 3px;
}

.store-pda-mobile-row div:last-child {
  text-align: right;
}

.store-pda-mobile-row strong,
.store-pda-mobile-row b {
  color: #0f172a;
  font-size: 14px;
  line-height: 1.2;
}

.store-pda-mobile-row span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.25;
}

.store-pda-mobile-advanced {
  display: grid;
  gap: 10px;
}

.store-pda-mobile-advanced summary {
  min-height: 36px;
  cursor: pointer;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.store-pda-category-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.store-pda-category-strip .ghost-button {
  flex: 0 0 auto;
}

.store-pda-category-strip .ghost-button.is-active {
  border-color: #93c5fd;
  background: #eff6ff;
}

.store-pda-bottom-actions {
  position: sticky;
  bottom: 10px;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14);
}

.store-pda-bottom-actions .primary-button:disabled {
  border-color: #cbd5e1;
  background: #cbd5e1;
  color: #ffffff;
  cursor: not-allowed;
}

.store-pda-bottom-actions .danger-light {
  border-color: #fecaca;
  color: #dc2626;
}

.store-mobile-preview-shell {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.store-mobile-preview-panel[data-store-pda-live-workbench="clerk"] .store-mobile-runtime-shell {
  width: min(430px, 100%);
  min-height: 720px;
  margin: 0 auto;
  border: 10px solid #171717;
  border-radius: 28px;
  background: #f8fafc;
  box-shadow: 0 22px 48px rgba(23, 23, 23, 0.18);
  overflow: hidden;
}

.store-mobile-preview-panel[data-store-pda-live-workbench="clerk"] .store-mobile-runtime-screen {
  min-height: 720px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #f8fafc;
}

.store-mobile-preview-panel[data-store-pda-live-workbench="clerk"] .mobile-pricing-screen {
  min-height: 0;
  overflow: auto;
}

body.pda-runtime-mode .store-mobile-runtime-shell {
  min-height: 100vh;
  min-height: 100svh;
  border: 0;
  background: #ffffff;
  box-shadow: none;
}

body.pda-runtime-mode .store-mobile-runtime-screen {
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: #ffffff;
}

body.pda-runtime-mode .store-mobile-preview-panel[data-store-pda-live-workbench="clerk"] .store-mobile-runtime-shell {
  width: auto;
  min-height: 100vh;
  min-height: 100svh;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.pda-runtime-mode .store-mobile-preview-panel[data-store-pda-live-workbench="clerk"] .store-mobile-runtime-screen {
  min-height: 100vh;
  min-height: 100svh;
}

body.pda-runtime-mode .store-mobile-runtime-screen .mobile-pricing-topbar {
  position: sticky;
  top: 0;
  z-index: 8;
  min-height: 52px;
}

body.pda-runtime-mode .store-mobile-runtime-screen .mobile-pricing-screen {
  min-height: 0;
  max-height: none;
  padding: 12px 18px calc(16px + env(safe-area-inset-bottom));
  overflow: auto;
}

body.pda-runtime-mode .store-mobile-runtime-screen .mobile-pricing-tabbar {
  position: sticky;
  bottom: 0;
  z-index: 24;
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}

.store-mobile-preview-layout {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(360px, 1fr);
  gap: 22px;
  align-items: start;
}

.store-mobile-preview-controls {
  position: sticky;
  top: 96px;
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
}

.store-mobile-preview-controls h3 {
  margin: 4px 0;
  font-size: 22px;
  line-height: 1.15;
}

.mobile-preview-control-block {
  display: grid;
  gap: 10px;
}

.mobile-preview-control-block > strong {
  color: #0f172a;
  font-size: 14px;
}

.mobile-preview-page-list {
  display: grid;
  gap: 8px;
}

.mobile-preview-page-list button,
.mobile-segment-row button,
.mobile-price-chip-grid button,
.mobile-category-grid button {
  min-height: 40px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  font-weight: 800;
  cursor: pointer;
}

.mobile-preview-page-list button {
  text-align: left;
  padding: 9px 11px;
}

.mobile-preview-page-list button.is-active,
.mobile-segment-row button.is-active,
.mobile-price-chip-grid button.is-active,
.mobile-category-grid button.is-active {
  border-color: #93c5fd;
  background: #eff6ff;
  color: #1d4ed8;
}

.mobile-preview-sdp-mini {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #eff6ff;
}

.mobile-preview-sdp-mini b {
  color: #0f172a;
  font-size: 18px;
}

.mobile-preview-sdp-mini span {
  color: #475569;
  font-size: 13px;
}

.mobile-preview-sdp-mini small {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

.store-mobile-preview-device {
  display: flex;
  justify-content: center;
}

.android-pda-frame {
  position: relative;
  width: min(430px, 100%);
  min-height: 760px;
  padding: 36px 18px 28px;
  border: 8px solid #111827;
  border-radius: 36px;
  background: linear-gradient(180deg, #1f2937 0%, #0f172a 100%);
  box-shadow: 0 22px 48px rgba(15, 23, 42, 0.26);
}

.android-pda-frame::before,
.android-pda-frame::after {
  content: "";
  position: absolute;
  top: 230px;
  width: 8px;
  height: 86px;
  border-radius: 10px;
  background: #2563eb;
}

.android-pda-frame::before {
  left: -14px;
}

.android-pda-frame::after {
  right: -14px;
}

.android-pda-speaker {
  position: absolute;
  top: 14px;
  left: 50%;
  width: 92px;
  height: 9px;
  border-radius: 999px;
  transform: translateX(-50%);
  background: #374151;
}

.android-pda-screen {
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 700px;
  max-height: 780px;
  overflow: hidden;
  border-radius: 18px;
  background: #f8fafc;
}

.mobile-pricing-topbar {
  display: grid;
  gap: 0;
  min-height: 54px;
  padding: 11px 18px 9px;
  border-bottom: 1px solid #e5e7eb;
  background: #ffffff;
  color: #343a40;
}

.mobile-pricing-statusbar,
.mobile-pricing-titlebar {
  display: grid;
  grid-template-columns: 72px 1fr;
  align-items: center;
}

.mobile-pricing-statusbar {
  min-height: 18px;
}

.mobile-pricing-titlebar {
  min-height: 34px;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
}

.mobile-pricing-titlebar strong {
  text-align: left;
  color: #343a40;
  font-size: 18px;
  line-height: 1.12;
}

.mobile-pricing-statusbar span,
.mobile-pricing-titlebar span {
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.mobile-pricing-statusbar span:last-child,
.mobile-pricing-titlebar span:last-child {
  text-align: right;
}

.pda-runtime-refresh-indicator {
  display: inline-block;
  color: inherit;
  font-size: 11px;
  line-height: 1.2;
  opacity: 0.78;
}

.clerk-printer-header-status {
  position: relative;
  min-width: 64px;
  min-height: 28px;
  display: inline-grid;
  grid-template-columns: 16px 1fr;
  gap: 4px;
  align-items: center;
  justify-content: center;
  padding: 3px 7px;
  border: 1px solid #d1d5db;
  border-radius: 999px;
  background: #ffffff;
  color: #4b5563;
  cursor: pointer;
}

.clerk-printer-header-icon,
.clerk-printer-header-icon svg {
  width: 16px;
  height: 16px;
}

.clerk-printer-header-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.clerk-printer-header-dot {
  position: absolute;
  left: 18px;
  bottom: 5px;
  width: 7px;
  height: 7px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: #9ca3af;
}

.clerk-printer-header-label {
  color: currentColor;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.clerk-printer-header-status.is-connected {
  border-color: #86efac;
  background: #f0fdf4;
  color: #15803d;
}

.clerk-printer-header-status.is-connected .clerk-printer-header-dot {
  background: #22c55e;
}

.clerk-printer-header-status.is-checking {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.clerk-printer-header-status.is-checking .clerk-printer-header-dot {
  background: #f97316;
}

.clerk-printer-header-status.is-disconnected .clerk-printer-header-dot {
  background: #9ca3af;
}

.mobile-pricing-screen {
  min-height: 0;
  overflow: auto;
  padding: 12px 18px;
  background: #ffffff;
}

.mobile-pricing-screen h3 {
  margin: 0 0 8px;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.15;
}

.mobile-sdp-card,
.mobile-price-group-card,
.mobile-price-editor,
.mobile-generated-result,
.mobile-print-panel,
.mobile-stock-in-page,
.mobile-print-queue {
  display: grid;
  gap: 9px;
  margin-bottom: 9px;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.mobile-sdp-card.compact {
  gap: 6px;
  margin-bottom: 5px;
  padding: 8px 9px;
}

.mobile-pricing-job-card {
  gap: 10px;
  padding: 12px;
  border-radius: 7px;
  border-color: #e5e7eb;
  box-shadow: none;
}

.mobile-pricing-job-head,
.mobile-pricing-job-progress div,
.mobile-source-line-head,
.mobile-source-line-progress,
.mobile-created-group-main,
.mobile-create-pricing-head,
.mobile-created-groups-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.mobile-pricing-job-title {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.mobile-pricing-job-title span,
.mobile-source-line-head span,
.mobile-create-pricing-head span,
.mobile-created-group-main span {
  color: #6b7280;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.15;
  text-transform: uppercase;
}

.mobile-pricing-job-title strong {
  color: #0f172a;
  font-size: 24px;
  line-height: 1;
}

.mobile-pricing-job-title small,
.mobile-source-line-head small,
.mobile-created-group-main small {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-pricing-job-progress {
  display: grid;
  gap: 7px;
}

.mobile-pricing-job-progress div span {
  color: #334155;
  font-size: 13px;
  font-weight: 900;
}

.mobile-pricing-job-progress div strong {
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
}

.mobile-pricing-job-progress i,
.mobile-source-line-progress i {
  position: relative;
  display: block;
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #eef2f7;
}

.mobile-pricing-job-progress i::before,
.mobile-source-line-progress i::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--progress, 0%);
  border-radius: inherit;
  background: #2563eb;
}

.mobile-pricing-job-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.mobile-pricing-job-meta span {
  display: grid;
  gap: 2px;
  min-height: 42px;
  padding: 7px 8px;
  border-radius: 7px;
  background: #f8fafc;
}

.mobile-pricing-job-meta b {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
}

.mobile-pricing-job-meta strong {
  color: #0f172a;
  font-size: 16px;
  line-height: 1;
}

.mobile-sdp-head,
.mobile-section-head,
.mobile-price-group-title,
.mobile-price-group-actions,
.mobile-print-queue-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.mobile-sdp-head div,
.mobile-price-group-main,
.mobile-print-queue-row div {
  display: grid;
  gap: 4px;
}

.mobile-sdp-head span,
.mobile-section-head span,
.mobile-price-group-facts span,
.mobile-price-group-range,
.mobile-result-grid span,
.mobile-print-summary span {
  color: #64748b;
  font-size: 12px;
  line-height: 1.3;
}

.mobile-sdp-head strong,
.mobile-price-group-title strong,
.mobile-result-hero strong,
.mobile-print-queue-row strong {
  color: #0f172a;
  font-size: 19px;
  line-height: 1.15;
}

.mobile-sdp-grid,
.mobile-sdp-meta-line,
.mobile-sdp-stat-strip,
.mobile-result-grid,
.mobile-print-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.mobile-sdp-meta-line {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}

.mobile-sdp-stat-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
}

.mobile-sdp-grid span,
.mobile-sdp-meta-line span,
.mobile-sdp-stat-strip span,
.mobile-result-grid span,
.mobile-print-summary span {
  display: grid;
  gap: 2px;
  min-height: 48px;
  padding: 8px;
  border-radius: 8px;
  background: #f8fafc;
}

.mobile-sdp-card.compact .mobile-sdp-meta-line span,
.mobile-sdp-card.compact .mobile-sdp-stat-strip span {
  min-height: 0;
  padding: 5px 4px;
}

.mobile-sdp-grid b,
.mobile-sdp-meta-line b,
.mobile-sdp-stat-strip b,
.mobile-result-grid b,
.mobile-print-summary b {
  color: #475569;
  font-size: 11px;
}

.mobile-sdp-stat-strip strong {
  color: #0f172a;
  font-size: 18px;
  line-height: 1.05;
}

.mobile-sdp-primary-line {
  color: #334155;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.15;
}

.mobile-sdp-head small,
.mobile-sdp-grid small,
.mobile-sdp-meta-line small,
.mobile-code-secondary {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.mobile-code-secondary {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.mobile-pricing-badge {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.mobile-pricing-badge.success {
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  color: #15803d;
}

.mobile-pricing-badge.warning {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}

.mobile-pricing-badge.danger {
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}

.mobile-pricing-badge.info,
.mobile-pricing-badge.neutral {
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.mobile-price-group-list,
.mobile-task-list,
.mobile-pricing-workbench,
.mobile-bottom-button-stack,
.mobile-print-queue-list {
  display: grid;
  gap: 8px;
}

.mobile-pricing-workbench {
  gap: 8px;
}

.mobile-clerk-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.mobile-clerk-action {
  min-height: 86px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 6px;
  padding: 10px 5px;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: #ffffff;
  color: #343a40;
  text-align: center;
}

.mobile-clerk-action span,
.mobile-clerk-task-icon,
.mobile-pricing-tabbar button span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.mobile-clerk-action svg,
.mobile-clerk-task-icon svg,
.mobile-pricing-tabbar button svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.mobile-clerk-action strong {
  color: #343a40;
  font-size: 13px;
  line-height: 1.15;
}

.mobile-clerk-action small {
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.mobile-clerk-task-board {
  display: grid;
  gap: 0;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: #ffffff;
  overflow: hidden;
}

.mobile-clerk-task-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 12px 14px 10px;
}

.mobile-clerk-task-head strong {
  color: #343a40;
  font-size: 18px;
  line-height: 1.2;
}

.mobile-clerk-task-head span {
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
}

.mobile-clerk-task-group-label {
  padding: 8px 14px;
  background: #68716f;
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
}

.mobile-clerk-task-list {
  display: grid;
}

.mobile-clerk-task-row {
  min-height: 68px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto 28px;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid #eeeeee;
  background: #ffffff;
  color: #343a40;
  text-align: left;
}

.mobile-clerk-task-icon {
  width: 34px;
  height: 34px;
  color: #68716f;
}

.mobile-clerk-task-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.mobile-clerk-task-main strong {
  overflow: hidden;
  color: #343a40;
  font-size: 15px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-clerk-task-main small {
  overflow: hidden;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-clerk-task-progress {
  color: #343a40;
  font-size: 13px;
  font-weight: 900;
}

.mobile-clerk-task-check {
  width: 22px;
  height: 22px;
  display: inline-block;
  border: 2px solid #343a40;
  border-radius: 3px;
}

.mobile-clerk-list-row {
  min-height: 52px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 0 4px;
  border: 0;
  border-bottom: 1px solid #eeeeee;
  background: #ffffff;
  color: #343a40;
  text-align: left;
}

.mobile-clerk-list-row span {
  color: #343a40;
  font-size: 15px;
  font-weight: 900;
}

.mobile-clerk-list-row strong {
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.mobile-price-group-card.is-active {
  border-color: #93c5fd;
  background: #f8fbff;
}

.mobile-price-group-card.is-complete {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.mobile-source-line-card {
  gap: 12px;
  padding: 14px;
  border-radius: 7px;
  border-color: #e5e7eb;
  box-shadow: none;
}

.mobile-source-line-head > div,
.mobile-created-group-main > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.mobile-source-line-head strong {
  overflow: hidden;
  color: #0f172a;
  font-size: 18px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-source-line-head b {
  flex: 0 0 auto;
  color: #0f172a;
  font-size: 24px;
  line-height: 1;
}

.mobile-source-line-progress {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.mobile-create-pricing-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 7px;
  background: #f8fafc;
}

.mobile-create-pricing-head strong,
.mobile-created-groups-head strong {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.2;
}

.mobile-create-pricing-inputs {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.mobile-price-action-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.mobile-price-action-grid button {
  min-height: 56px;
  display: grid;
  justify-items: center;
  gap: 3px;
  padding: 8px 6px;
  border-radius: 7px;
  font-size: 12px;
}

.mobile-price-action-grid button span {
  font-size: 12px;
  font-weight: 900;
}

.mobile-price-action-grid button strong {
  font-size: 13px;
  line-height: 1.15;
}

.mobile-created-pricing-groups {
  display: grid;
  gap: 8px;
}

.mobile-created-groups-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.mobile-empty-price-groups {
  padding: 10px 12px;
  border-radius: 7px;
  background: #f8fafc;
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
}

.mobile-created-group-row {
  gap: 8px;
  margin-bottom: 0;
  padding: 10px;
  border-radius: 7px;
  box-shadow: none;
}

.mobile-created-group-main {
  align-items: start;
}

.mobile-created-group-main strong {
  color: #0f172a;
  font-size: 17px;
  line-height: 1.15;
}

.mobile-created-group-status {
  flex: 0 0 auto;
  display: grid;
  justify-items: end;
  gap: 4px;
}

.mobile-demo-price-row {
  gap: 8px;
  padding: 12px;
  border-radius: 7px;
  box-shadow: none;
}

.mobile-demo-price-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.mobile-demo-price-main > div:first-child {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.mobile-demo-price-main span:first-child {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.mobile-demo-price-main strong {
  color: #0f172a;
  font-size: 22px;
  line-height: 1;
}

.mobile-demo-price-main small {
  overflow: hidden;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-demo-price-number {
  display: grid;
  justify-items: end;
  gap: 3px;
}

.mobile-demo-price-number strong {
  color: #0f172a;
  font-size: 22px;
  line-height: 1;
}

.mobile-demo-price-number span {
  color: #334155;
  font-size: 15px;
  font-weight: 900;
}

.mobile-demo-price-status {
  display: flex;
  justify-content: flex-start;
}

.mobile-field-group-card {
  gap: 7px;
  padding: 10px;
  border-radius: 9px;
}

.mobile-field-group-top,
.mobile-field-group-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(104px, 0.78fr);
  gap: 8px;
  align-items: center;
}

.mobile-field-group-left,
.mobile-field-group-right {
  display: grid;
  gap: 2px;
}

.mobile-field-group-left strong {
  color: #0f172a;
  font-size: 20px;
  line-height: 1.05;
}

.mobile-field-group-right {
  justify-items: end;
}

.mobile-field-group-right strong {
  color: #0f172a;
  font-size: 22px;
  line-height: 1.05;
}

.mobile-group-qty {
  color: #0f172a;
  font-size: 28px;
  line-height: 1;
}

.mobile-field-group-meta,
.mobile-field-next-action {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.mobile-field-next-action {
  min-height: 24px;
  display: flex;
  align-items: center;
  padding: 5px 8px;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
}

.mobile-field-group-actions .primary-button,
.mobile-field-group-actions .ghost-button {
  min-height: 44px;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 900;
}

.mobile-group-complete-mark {
  min-height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid #bbf7d0;
  border-radius: 9px;
  background: #f0fdf4;
  color: #15803d;
  font-size: 14px;
  font-weight: 900;
}

.mobile-group-complete-mark.is-wide {
  min-height: 52px;
  width: 100%;
}

.mobile-field-group-actions button:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.mobile-price-group-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mobile-price-group-facts span,
.mobile-price-group-range {
  padding: 5px 8px;
  border-radius: 999px;
  background: #f1f5f9;
}

.mobile-price-group-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
}

.mobile-wide-action,
.mobile-bottom-button-stack .primary-button,
.mobile-bottom-button-stack .ghost-button {
  min-height: 52px;
  width: 100%;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 900;
}

.mobile-choice-block,
.mobile-rack-input {
  display: grid;
  gap: 8px;
}

.mobile-choice-block > span,
.mobile-rack-input span,
.mobile-quantity-stepper > span {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.mobile-segment-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.mobile-price-chip-grid,
.mobile-category-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.mobile-quantity-stepper {
  display: grid;
  grid-template-columns: 1fr 68px repeat(4, 48px);
  gap: 7px;
  align-items: center;
}

.mobile-quantity-stepper strong {
  min-height: 44px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 22px;
}

.mobile-quantity-stepper button {
  min-height: 44px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #ffffff;
  color: #1d4ed8;
  font-weight: 900;
}

.mobile-rack-input input {
  min-height: 46px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 10px 12px;
  color: #0f172a;
  font-weight: 800;
}

.mobile-result-hero,
.mobile-print-job-card {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid #fed7aa;
  border-radius: 10px;
  background: #fff7ed;
}

.mobile-result-hero span,
.mobile-print-job-card span,
.mobile-print-job-card small {
  color: #9a3412;
  font-size: 12px;
  font-weight: 700;
}

.mobile-print-job-card strong {
  color: #0f172a;
  font-size: 18px;
}

.mobile-print-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mobile-print-summary span strong {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.1;
}

.mobile-print-queue-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.mobile-print-queue-summary span {
  display: grid;
  gap: 3px;
  min-height: 52px;
  padding: 8px;
  border-radius: 9px;
  background: #eff6ff;
}

.mobile-print-queue-summary b {
  color: #475569;
  font-size: 11px;
}

.mobile-print-queue-summary strong {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.1;
}

.mobile-print-queue-row {
  min-height: 58px;
  padding: 9px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.store-mobile-generated-items {
  display: grid;
  gap: 8px;
}

.store-mobile-generated-item-list {
  display: grid;
  gap: 6px;
}

.store-mobile-generated-item-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: 6px 8px;
  padding: 8px;
  border: 1px solid #dbe3ea;
  border-radius: 8px;
  background: #f8fafc;
}

.store-mobile-generated-item-row strong,
.store-mobile-generated-item-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
  color: #0f172a;
  font-size: 12px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.store-mobile-generated-item-row b,
.store-mobile-generated-item-row strong span {
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  text-transform: none;
}

.store-item-label-preview-panel {
  display: grid;
  gap: 8px;
}

.store-item-label-preview {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
  width: min(100%, 260px);
  margin: 0 auto;
  padding: 8px;
  border: 1px solid #111827;
  border-radius: 6px;
  background: #ffffff;
  color: #111827;
  font-family: Arial, Helvetica, sans-serif;
}

.store-item-label-preview.size-60x40 {
  aspect-ratio: 3 / 2;
  min-height: 174px;
}

.store-item-label-preview.size-40x30 {
  aspect-ratio: 4 / 3;
  max-width: 220px;
  min-height: 160px;
}

.store-item-label-header {
  order: 1;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: flex-start;
  color: #111827;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

.store-item-label-header span {
  flex: 0 0 auto;
}

.store-item-label-price {
  order: 2;
  color: #111827;
  font-size: 31px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
}

.store-item-code128-barcode {
  order: 3;
  width: 100%;
  height: 42px;
  border: 0;
  background:
    repeating-linear-gradient(
      90deg,
      #111827 0,
      #111827 2px,
      transparent 2px,
      transparent 4px,
      #111827 4px,
      #111827 5px,
      transparent 5px,
      transparent 8px
    );
}

.store-item-label-machine-code {
  order: 4;
  color: #111827;
  font-family: "Courier New", monospace;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  text-align: center;
  letter-spacing: 0;
}

.store-item-label-payload-preview {
  border: 1px solid #dbe3ea;
  border-radius: 8px;
  padding: 8px;
  background: #f8fafc;
}

.store-item-label-payload-preview pre {
  max-height: 190px;
  margin: 8px 0 0;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

.mobile-next-group-hint {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #ecfdf5;
  border: 1px solid #bbf7d0;
}

.mobile-next-group-hint span {
  color: #047857;
  font-size: 11px;
  font-weight: 900;
}

.mobile-next-group-hint strong {
  color: #0f172a;
  font-size: 16px;
}

.mobile-next-group-hint.is-complete {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.mobile-progress-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.mobile-progress-row span {
  min-height: 38px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 900;
}

.mobile-task-card,
.mobile-scan-step,
.mobile-task-completion,
.mobile-my-tab {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.mobile-scan-step {
  gap: 12px;
  padding: 14px;
  border-color: #e5e7eb;
  border-radius: 7px;
  box-shadow: none;
}

.mobile-scan-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.mobile-scan-head > div {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.mobile-scan-head strong {
  color: #0f172a;
  font-size: 20px;
  line-height: 1.1;
}

.mobile-scan-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
}

.mobile-task-card.is-complete {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.mobile-daily-workbench {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

.mobile-daily-hero {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, #155e75 0%, #2563eb 100%);
  color: #ffffff;
}

.mobile-daily-hero h3,
.mobile-daily-hero p {
  margin: 0;
}

.mobile-daily-hero h3 {
  font-size: 28px;
  line-height: 1.05;
}

.mobile-daily-hero p,
.mobile-daily-hero .eyebrow {
  color: rgba(255, 255, 255, 0.78);
}

.mobile-daily-metrics,
.mobile-quick-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.mobile-daily-metrics span {
  display: grid;
  gap: 4px;
  min-height: 62px;
  padding: 10px;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

.mobile-daily-metrics b {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.mobile-daily-metrics strong {
  color: #0f172a;
  font-size: 28px;
  line-height: 1;
}

.mobile-urgent-list,
.mobile-task-list-inner,
.mobile-quick-actions {
  display: grid;
  gap: 10px;
}

.mobile-task-card-warning {
  border-color: #fed7aa;
  background: #fff7ed;
}

.mobile-task-card-muted,
.mobile-task-card-placeholder {
  background: #f8fafc;
}

.mobile-task-card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
}

.mobile-task-card-head div {
  display: grid;
  gap: 4px;
}

.mobile-task-card-head span,
.mobile-task-card-head small,
.mobile-task-facts b,
.mobile-my-list b,
.mobile-completion-grid b,
.mobile-scan-input span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

.mobile-task-card-head strong {
  color: #0f172a;
  font-size: 24px;
  line-height: 1.05;
}

.mobile-task-facts,
.mobile-my-list,
.mobile-completion-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.mobile-task-facts span,
.mobile-my-list span,
.mobile-completion-grid span {
  display: grid;
  gap: 3px;
  min-height: 50px;
  padding: 8px;
  border-radius: 9px;
  background: #f8fafc;
}

.mobile-my-list strong,
.mobile-completion-grid span,
.mobile-task-facts span {
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
}

.clerk-bluetooth-printer-test {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #f8fafc;
}

.clerk-bluetooth-printer-refresh-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.clerk-bluetooth-printer-refresh-row .ghost-button {
  min-height: 36px;
  padding: 8px 10px;
  font-size: 12px;
}

.clerk-bluetooth-printer-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.clerk-bluetooth-printer-status-grid span,
.clerk-bluetooth-printer-paired-list article {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
}

.clerk-bluetooth-printer-status-grid b {
  color: #64748b;
  font-size: 11px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.clerk-bluetooth-printer-status-grid strong,
.clerk-bluetooth-printer-paired-list strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.clerk-bluetooth-printer-paired-list {
  display: grid;
  gap: 6px;
}

.clerk-bluetooth-printer-paired-list span {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.clerk-bluetooth-printer-error {
  margin: 0;
}

.clerk-printer-status-badge {
  min-height: 34px;
  max-width: 190px;
  padding: 6px 10px;
  background: rgba(15, 23, 42, 0.18);
  border-color: rgba(255, 255, 255, 0.56);
  color: #ffffff;
  font-size: 12px;
  line-height: 1.25;
  overflow: visible;
  overflow-wrap: anywhere;
  text-align: left;
  white-space: normal;
}

.clerk-printer-entry-card,
.clerk-printer-connection-page {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #f8fafc;
}

.clerk-printer-entry-card {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.clerk-printer-entry-card > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.clerk-printer-entry-card strong {
  color: #0f172a;
  font-size: 15px;
  font-weight: 900;
}

.clerk-printer-connection-page .printer-status-card {
  margin: 0;
}

.clerk-bluetooth-printer-paired-list small {
  color: #2563eb;
  font-size: 11px;
  font-weight: 900;
}

.clerk-bluetooth-printer-paired-list article.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
}

.clerk-printer-diagnostics {
  display: grid;
  gap: 8px;
  padding: 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #ffffff;
}

.clerk-printer-diagnostics summary {
  cursor: pointer;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.clerk-printer-diagnostics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 8px;
}

.clerk-printer-diagnostics-grid div {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 6px;
  border-radius: 7px;
  background: #f8fafc;
}

.clerk-printer-diagnostics-grid strong,
.clerk-printer-diagnostics-json strong {
  color: #64748b;
  font-size: 10px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.clerk-printer-diagnostics-grid span {
  color: #0f172a;
  font-size: 11px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.clerk-printer-diagnostics-actions {
  margin-top: 8px;
}

.clerk-printer-diagnostics-json {
  display: grid;
  gap: 4px;
  margin-top: 8px;
}

.clerk-printer-diagnostics-json pre {
  max-height: 180px;
  margin: 0;
  padding: 8px;
  overflow: auto;
  border-radius: 7px;
  background: #0f172a;
  color: #e2e8f0;
  font-size: 10px;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.mobile-task-complete-note,
.mobile-scan-success {
  padding: 10px 12px;
  border: 1px solid #bbf7d0;
  border-radius: 10px;
  background: #f0fdf4;
  color: #15803d;
  font-weight: 900;
}

.mobile-scan-input {
  display: grid;
  gap: 7px;
}

.mobile-scan-input input {
  min-height: 50px;
  width: 100%;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  padding: 9px 11px;
  color: #0f172a;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
}

.mobile-pricing-tabbar {
  min-height: 70px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 7px 18px 9px;
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
}

.mobile-pricing-tabbar button {
  min-height: 54px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 3px;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #9ca3af;
  font-size: 12px;
  font-weight: 900;
}

.mobile-pricing-tabbar button span {
  width: 24px;
  height: 24px;
  color: inherit;
  line-height: 1;
}

.mobile-pricing-tabbar button.is-active {
  background: transparent;
  color: #343a40;
}

.store-manager-pda-page {
  background: #eef3ff;
}

.store-manager-pda-preview {
  display: grid;
  justify-items: center;
}

.store-manager-pda-shell {
  width: min(390px, 100%);
  height: clamp(560px, calc(100svh - 112px), 760px);
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  border: 10px solid #171717;
  border-radius: 28px;
  background: #171717;
  box-shadow: 0 22px 48px rgba(23, 23, 23, 0.18);
  overflow: hidden;
}

.store-manager-pda-runtime-shell {
  grid-template-rows: minmax(0, 1fr) auto;
}

body.pda-runtime-mode .store-manager-pda-preview {
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  display: block;
}

body.pda-runtime-mode .store-manager-pda-shell {
  width: 100%;
  height: 100vh;
  height: 100svh;
  border: 0;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
  grid-template-rows: minmax(0, 1fr) auto;
}

body.pda-runtime-mode .store-manager-pda-device-bar {
  display: none !important;
}

body.pda-runtime-mode .store-manager-pda-screen {
  min-height: 0;
  overflow: auto;
  padding-bottom: calc(14px + env(safe-area-inset-bottom));
}

body.pda-runtime-mode .store-manager-pda-bottom-tabs {
  position: sticky;
  bottom: 0;
  z-index: 24;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}

.store-manager-pda-device-bar {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 14px 6px;
  color: #f8fafc;
  font-size: 12px;
  line-height: 1.2;
}

.store-manager-pda-device-bar strong {
  font-size: 12px;
  font-weight: 800;
}

.store-manager-pda-screen {
  min-height: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  background: #ffffff;
  overflow: hidden;
}

.store-manager-pda-runtime-shell .store-manager-pda-screen {
  min-height: 0;
}

.store-manager-pda-title {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  align-items: center;
  min-height: 42px;
  padding: 5px 9px;
  border-bottom: 1px solid #e5e7eb;
  background: #ffffff;
}

.store-manager-pda-title div {
  display: grid;
  gap: 2px;
}

.store-manager-pda-title-identity {
  min-width: 0;
  flex: 1 1 auto;
}

.store-manager-pda-title-identity strong {
  min-width: 0;
  color: #172017;
  font-size: 13px;
  line-height: 1.08;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-title span,
.store-manager-pda-title small,
.store-manager-pda-card-head span,
.store-manager-pda-metric span,
.store-manager-pda-status span,
.store-manager-pda-action span {
  color: #6b7280;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.18;
}

.store-manager-pda-title h3 {
  margin: 0;
  color: #343a40;
  font-size: 18px;
  line-height: 1.12;
}

.store-manager-pda-title-actions {
  display: inline-flex;
  align-items: center;
  gap: 0;
  flex-shrink: 0;
  max-width: 132px;
  overflow: hidden;
  white-space: nowrap;
}

.store-manager-pda-title-actions .clerk-printer-status-badge {
  max-width: 126px;
  min-height: 28px;
  padding: 5px 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-runtime-shell .store-manager-pda-title-actions .clerk-printer-header-status {
  max-width: 126px;
  min-height: 26px;
  padding: 3px 7px;
  overflow: hidden;
}

.store-manager-pda-runtime-shell .store-manager-pda-title-actions .clerk-printer-header-label {
  overflow: hidden;
  text-overflow: ellipsis;
}

.store-manager-pda-title-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #343a40;
}

.store-manager-pda-title-icon svg,
.store-manager-pda-action-icon svg,
.store-manager-pda-tab-icon svg,
.store-manager-pda-task-type-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.store-manager-pda-refresh-state {
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.store-manager-pda-body {
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 6px 10px 12px;
  max-width: 100%;
  overflow: auto;
  overflow-x: hidden;
}

.store-manager-pda-metrics,
.store-manager-pda-status-grid,
.store-manager-pda-action-grid,
.store-manager-pda-operation-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.store-manager-pda-metric,
.store-manager-pda-status,
.store-manager-pda-action,
.store-manager-pda-operation,
.store-manager-pda-setting,
.store-manager-pda-rule-note,
.store-manager-pda-return-sheet,
.store-manager-pda-card,
.store-manager-pda-sdp-card,
.store-manager-pda-debug {
  border: 1px solid #dde5da;
  border-radius: 8px;
  background: #ffffff;
}

.store-manager-pda-metric,
.store-manager-pda-status {
  min-height: 76px;
  display: grid;
  align-content: space-between;
  gap: 8px;
  padding: 11px;
}

.store-manager-pda-metric strong,
.store-manager-pda-status strong {
  color: #172017;
  font-size: 21px;
  line-height: 1.1;
}

.store-manager-pda-card {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 12px;
}

.store-manager-pda-workbench-hero {
  min-height: 74px;
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  padding: 2px 0 6px;
  border: 0;
  border-radius: 0;
  background: #ffffff;
}

.store-manager-pda-workbench-hero div {
  display: grid;
  gap: 6px;
}

.store-manager-pda-workbench-hero span,
.store-manager-pda-workbench-hero p,
.store-manager-pda-icon-action small {
  margin: 0;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.store-manager-pda-workbench-hero h3 {
  margin: 0;
  color: #343a40;
  font-size: 28px;
  line-height: 1.1;
}

.store-manager-pda-workbench-groups {
  display: grid;
  gap: 10px;
}

.store-manager-pda-workbench-group {
  min-width: 0;
  display: grid;
  gap: 7px;
}

.store-manager-pda-workbench-group-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  padding: 0 2px;
}

.store-manager-pda-workbench-group-head strong {
  color: #172017;
  font-size: 14px;
  line-height: 1.18;
}

.store-manager-pda-workbench-group-head span {
  color: #6b7280;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.18;
}

.store-manager-pda-workbench-icons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.store-manager-pda-icon-action {
  min-height: 60px;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 9px 8px;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: #ffffff;
  color: #343a40;
  text-align: left;
}

.store-manager-pda-icon-action:active {
  border-color: #3d63ff;
  color: #3d63ff;
}

.store-manager-pda-icon-action--operations {
  background: #fbfcfa;
}

.store-manager-pda-icon-action--apparel {
  background: #f8fafc;
}

.store-manager-pda-icon-action--gm {
  border-color: #dbeafe;
  background: #eff6ff;
}

.store-manager-pda-action-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #343a40;
  line-height: 1;
}

.store-manager-pda-action-text {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.store-manager-pda-icon-action strong {
  color: #343a40;
  font-size: 13px;
  line-height: 1.12;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-icon-action small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-barcode-lookup-card {
  gap: 12px;
}

.store-manager-pda-barcode-lookup-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.store-manager-pda-barcode-lookup-form input {
  min-width: 0;
  min-height: 42px;
  border: 1px solid #cbd5e1;
  border-radius: 7px;
  padding: 0 10px;
  font-size: 15px;
  font-weight: 800;
}

.store-manager-pda-product-result {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.store-manager-pda-product-image {
  min-height: 86px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: #fff;
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.store-manager-pda-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.store-manager-pda-product-summary {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 4px;
}

.store-manager-pda-product-summary strong,
.store-manager-pda-product-summary span,
.store-manager-pda-product-summary small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-product-price {
  color: #111827;
  font-size: 22px;
  font-weight: 900;
  line-height: 1.1;
}

.store-manager-pda-gm-receiving-entry,
.store-manager-pda-gm-task-page {
  display: grid;
  gap: 10px;
}

.store-manager-pda-gm-receiving-entry {
  padding: 12px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
}

.store-manager-pda-gm-receiving-entry strong {
  color: #172554;
  font-size: 15px;
}

.store-manager-pda-gm-receiving-entry span {
  color: #475569;
  font-size: 12px;
  line-height: 1.45;
}

.store-manager-pda-gm-task-list {
  display: grid;
  gap: 10px;
}

.store-manager-pda-gm-task-card {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #ffffff;
}

.store-manager-pda-gm-task-top {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: start;
}

.store-manager-pda-gm-thumb {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  background: #eff6ff;
  color: #2563eb;
  overflow: hidden;
}

.store-manager-pda-gm-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.store-manager-pda-gm-task-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.store-manager-pda-gm-task-main strong {
  min-width: 0;
  color: #172017;
  font-size: 13px;
  line-height: 1.25;
}

.store-manager-pda-gm-task-main small,
.store-manager-pda-gm-route span {
  color: #526173;
  font-size: 11px;
  line-height: 1.32;
}

.store-manager-pda-gm-route {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  padding: 8px;
  border-radius: 8px;
  background: #f8fafc;
}

.store-manager-pda-gm-route span {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  gap: 6px;
}

.store-manager-pda-gm-route b {
  color: #334155;
}

.store-manager-pda-gm-actions {
  display: grid;
  gap: 8px;
}

.store-manager-pda-task-board {
  display: grid;
  gap: 0;
  margin-top: 2px;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: #ffffff;
  overflow: hidden;
}

.store-manager-pda-task-board-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 12px 14px 10px;
}

.store-manager-pda-task-board-head strong {
  color: #343a40;
  font-size: 18px;
  line-height: 1.2;
}

.store-manager-pda-task-board-head span {
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
}

.store-manager-pda-task-group-label {
  padding: 8px 14px;
  background: #68716f;
  color: #ffffff;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
}

.store-manager-pda-workbench-task-list {
  display: grid;
}

.store-manager-pda-workbench-task {
  min-height: 68px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto 28px;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid #eeeeee;
  background: #ffffff;
  color: #343a40;
  text-align: left;
}

.store-manager-pda-task-type-icon {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #68716f;
}

.store-manager-pda-task-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.store-manager-pda-task-main strong {
  overflow: hidden;
  color: #343a40;
  font-size: 15px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-task-main small {
  overflow: hidden;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-task-progress {
  color: #343a40;
  font-size: 15px;
  font-weight: 900;
}

.store-manager-pda-task-check {
  width: 22px;
  height: 22px;
  display: inline-block;
  border: 2px solid #343a40;
  border-radius: 3px;
}

.store-manager-pda-workbench-primary {
  min-height: 54px;
  margin: 14px;
  border: 1px solid #3d63ff;
  border-radius: 7px;
  background: #3d63ff;
  color: #ffffff;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0;
}

.store-manager-pda-list-row {
  min-height: 52px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 0 4px;
  border: 0;
  border-bottom: 1px solid #eeeeee;
  background: #ffffff;
  color: #343a40;
  text-align: left;
}

.store-manager-pda-list-row span {
  color: #343a40;
  font-size: 15px;
  font-weight: 900;
}

.store-manager-pda-list-row strong {
  color: #6b7280;
  font-size: 12px;
  font-weight: 800;
}

.store-manager-pda-language-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.store-manager-pda-language-toggle button {
  min-width: 48px;
  min-height: 34px;
  border: 1px solid #d1d5db;
  border-radius: 999px;
  background: #ffffff;
  color: #343a40;
  font-size: 13px;
  font-weight: 900;
}

.store-manager-pda-language-toggle button.is-active {
  border-color: #3d63ff;
  background: #3d63ff;
  color: #ffffff;
}

.store-manager-pda-task-list,
.store-manager-pda-scan-step,
.store-manager-pda-sdo-detail,
.store-manager-pda-task-complete,
.store-manager-pda-my-tab {
  min-width: 0;
  display: grid;
  gap: 10px;
}

.store-manager-pda-compact-panel {
  gap: 9px;
}

.store-manager-pda-compact-panel .form-grid.compact {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(104px, auto);
  gap: 8px;
  align-items: center;
}

.store-manager-pda-compact-panel input {
  min-width: 0;
  height: 44px;
  padding: 0 12px;
  border-radius: 7px;
  font-size: 14px;
}

.store-manager-pda-locate-card .store-manager-pda-primary-action {
  min-height: 44px;
  padding-inline: 12px;
  white-space: nowrap;
}

@media (max-width: 360px) {
  .store-manager-pda-compact-panel .form-grid.compact {
    grid-template-columns: 1fr;
  }
}

.store-manager-pda-task-card.is-complete {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.store-manager-pda-rule-note {
  display: grid;
  gap: 6px;
  padding: 12px;
  background: #f8fafc;
}

.store-manager-pda-rule-note strong {
  color: #172017;
  font-size: 16px;
  line-height: 1.2;
}

.store-manager-pda-rule-note span {
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.store-manager-pda-card-head,
.store-manager-pda-sdp-top {
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}

.store-manager-pda-card-head > div,
.store-manager-pda-sdp-top > div {
  min-width: 0;
}

.store-manager-pda-card-head strong,
.store-manager-pda-sdp-top strong,
.store-manager-pda-row strong,
.store-manager-pda-log strong,
.store-manager-pda-action strong,
.store-manager-pda-operation strong,
.store-manager-pda-setting strong {
  color: #172017;
  font-size: 16px;
  line-height: 1.2;
}

.store-manager-pda-card-head small,
.store-manager-pda-sdp-top small {
  display: block;
  overflow: hidden;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-list,
.store-manager-pda-sdp-list,
.store-manager-pda-timeline,
.store-manager-pda-reminders {
  display: grid;
  gap: 8px;
}

.store-manager-pda-row,
.store-manager-pda-log {
  min-width: 0;
  min-height: 58px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 10px;
  border: 1px solid #dde5da;
  border-radius: 8px;
  background: #fbfcfa;
}

.store-manager-pda-row div,
.store-manager-pda-log div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.store-manager-pda-row strong,
.store-manager-pda-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-row span,
.store-manager-pda-row b,
.store-manager-pda-log span,
.store-manager-pda-log time,
.store-manager-pda-sdp-top small {
  color: #657164;
  font-size: 12px;
  line-height: 1.3;
}

.store-manager-pda-reminder,
.store-manager-pda-action,
.store-manager-pda-setting {
  min-height: 58px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 12px;
  text-align: left;
  cursor: pointer;
}

.store-manager-pda-reminder strong {
  color: #14532d;
  font-size: 14px;
}

.store-manager-pda-sdp-card {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 12px;
}

.store-manager-pda-sdp-top div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.store-manager-pda-sdp-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.store-manager-pda-sdp-facts span {
  min-width: 0;
  min-height: 48px;
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #e5ebe2;
  border-radius: 8px;
  background: #fbfcfa;
  color: #172017;
  font-size: 13px;
}

.store-manager-pda-sdp-facts b {
  color: #657164;
  font-size: 11px;
}

.store-manager-pda-sdp-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.store-manager-pda-assignment-block {
  display: grid;
  gap: 8px;
}

.store-manager-pda-assignment-block strong {
  color: #172017;
  font-size: 14px;
  line-height: 1.2;
}

.store-manager-pda-clerk-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.store-manager-pda-assignee-action {
  min-height: 56px;
  justify-items: start;
  text-align: left;
}

.store-manager-pda-assignee-action strong,
.store-manager-pda-assignee-action small {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.store-manager-pda-assignee-action small {
  color: #657164;
  font-size: 11px;
  font-weight: 800;
}

.store-manager-pda-assignee-action.is-loading {
  opacity: 0.72;
}

.store-manager-pda-assigned-task-card {
  gap: 8px;
  padding: 10px;
  overflow: hidden;
}

.store-manager-pda-assigned-task-card .store-manager-pda-card-head {
  align-items: center;
}

.store-manager-pda-remaining-hero {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid #b8d7be;
  border-radius: 8px;
  background: #eef8f0;
}

.store-manager-pda-remaining-hero span {
  color: #42614a;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
}

.store-manager-pda-remaining-hero strong {
  color: #142018;
  font-size: 26px;
  font-weight: 950;
  line-height: 1.05;
}

.store-manager-pda-assignment-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.store-manager-pda-assignment-summary {
  display: grid;
  gap: 7px;
  padding: 8px 9px;
  border: 1px solid #d6e2d2;
  border-radius: 8px;
  background: #f8faf7;
}

.store-manager-pda-assignment-summary-main {
  min-width: 0;
}

.store-manager-pda-assignment-summary-main strong {
  display: block;
  overflow-wrap: anywhere;
  color: #142018;
  font-size: 14px;
  line-height: 1.2;
}

.store-manager-pda-assignment-summary-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}

.store-manager-pda-assignment-summary-facts span {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 6px;
  border-radius: 7px;
  background: #ffffff;
  color: #172017;
  font-size: 15px;
  font-weight: 900;
  text-align: center;
}

.store-manager-pda-assignment-summary-facts b {
  color: #657164;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.1;
}

.store-manager-pda-label-flow {
  min-width: 0;
  gap: 7px;
}

.store-manager-pda-assignment-fields {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.store-manager-pda-assignment-fields label {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.store-manager-pda-assignment-fields label:last-child {
  grid-column: 1 / -1;
}

.store-manager-pda-assignment-fields span,
.store-manager-pda-label-status-grid b {
  color: #657164;
  font-size: 11px;
  font-weight: 800;
}

.store-manager-pda-assignment-fields small {
  color: #475569;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
}

.store-manager-pda-assignment-fields input,
.store-manager-pda-assignment-fields select,
.store-manager-pda-assignment-fields textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid #cfd8ca;
  border-radius: 8px;
  background: #ffffff;
  color: #172017;
  font-size: 14px;
  font-weight: 800;
}

.store-manager-pda-assignment-fields textarea {
  min-height: 54px;
  resize: vertical;
}

.store-manager-pda-label-status-line {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 7px 9px;
  border: 1px solid #e5ebe2;
  border-radius: 8px;
  background: #fbfcfa;
  color: #172017;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.25;
}

.store-manager-pda-assignment-action-row {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  align-items: center;
}

.store-manager-pda-inline-hint {
  min-width: 0;
  grid-column: 1 / -1;
  color: #657164;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.store-manager-pda-label-status-grid span {
  min-height: 46px;
  padding: 8px 9px;
  border: 1px solid #e5ebe2;
  border-radius: 8px;
  background: #fbfcfa;
  color: #172017;
  font-size: 14px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.store-manager-pda-push-note,
.store-manager-pda-complete-note {
  padding: 10px 12px;
  border: 1px solid #bbf7d0;
  border-radius: 8px;
  background: #f0fdf4;
  color: #166534;
  font-size: 13px;
  font-weight: 900;
}

.store-manager-pda-assignment-feedback {
  padding: 9px 10px;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
  background: #eef2ff;
  color: #1e3a8a;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.store-manager-pda-assignment-feedback.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.store-manager-pda-assignment-feedback.warning {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}

.store-manager-pda-assignment-feedback.error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

.store-manager-pda-primary-action {
  min-height: 44px;
  border: 1px solid #2563eb;
  border-radius: 8px;
  background: #2563eb;
  color: #ffffff;
  font-size: 15px;
  font-weight: 800;
}

.store-manager-pda-secondary-action {
  min-height: 42px;
  border: 1px solid #cfd8ca;
  border-radius: 8px;
  background: #ffffff;
  color: #172017;
  font-size: 14px;
  font-weight: 800;
}

.store-manager-pda-loading-state {
  padding: 6px 0;
  color: #475569;
  font-size: 13px;
  font-weight: 900;
}

.store-manager-pda-backroom-card {
  display: grid;
  gap: 10px;
}

.store-manager-pda-backroom-scan-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(86px, auto);
  gap: 6px;
}

.store-manager-pda-backroom-field {
  display: grid;
  gap: 5px;
}

.store-manager-pda-backroom-target-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.store-manager-pda-backroom-field span {
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.store-manager-pda-backroom-list,
.store-manager-pda-backroom-results {
  display: grid;
  gap: 6px;
}

.store-manager-pda-backroom-item,
.store-manager-pda-backroom-result {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid #e5ebe2;
  border-radius: 8px;
  background: #fbfcfa;
}

.store-manager-pda-backroom-item span,
.store-manager-pda-backroom-result span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.store-manager-pda-backroom-item strong,
.store-manager-pda-backroom-result strong {
  color: #172017;
  font-size: 13px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.store-manager-pda-backroom-item small,
.store-manager-pda-backroom-result span {
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.store-manager-pda-backroom-result.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.store-manager-pda-backroom-result.warning {
  border-color: #fde68a;
  background: #fffbeb;
}

.store-manager-pda-backroom-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 6px;
}

@media (max-width: 360px) {
  .store-manager-pda-assignment-fields,
  .store-manager-pda-assignment-action-row,
  .store-manager-pda-backroom-scan-row,
  .store-manager-pda-backroom-actions {
    grid-template-columns: 1fr;
  }
}

.store-manager-pda-log {
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: start;
}

.store-manager-pda-log time {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #eef3ec;
  color: #172017;
  font-weight: 800;
}

.store-manager-pda-action-grid {
  grid-template-columns: 1fr;
}

.store-manager-pda-action {
  min-height: 66px;
}

.store-manager-pda-operation-grid,
.store-manager-pda-setting-list {
  display: grid;
  gap: 8px;
}

.store-manager-pda-operation {
  min-height: 78px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  align-items: center;
  padding: 12px;
  text-align: left;
}

.store-manager-pda-operation span {
  grid-column: 1 / -1;
  color: #657164;
  font-size: 12px;
  font-weight: 700;
}

.store-manager-pda-operation b {
  color: #14532d;
  font-size: 14px;
}

.store-manager-pda-setting-list {
  grid-template-columns: 1fr;
}

.store-manager-pda-setting {
  min-height: 64px;
}

.store-manager-pda-return-sheet {
  display: grid;
  gap: 10px;
  padding: 12px;
  background: #fffdf7;
}

.store-manager-pda-return-summary {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.store-manager-pda-return-summary span {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #eee4c9;
  border-radius: 8px;
  background: #ffffff;
  color: #172017;
  font-size: 13px;
}

.store-manager-pda-return-summary b {
  color: #657164;
  font-size: 11px;
}

.store-manager-pda-return-reasons {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.store-manager-pda-return-reasons label {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid #eee4c9;
  border-radius: 8px;
  background: #ffffff;
  color: #172017;
  font-size: 14px;
  font-weight: 700;
}

.store-manager-pda-return-note {
  margin: 0;
  padding: 9px 10px;
  border-radius: 8px;
  background: #ecfdf5;
  color: #166534;
  font-size: 13px;
  font-weight: 800;
}

.store-manager-pda-debug {
  padding: 10px 12px;
}

.store-manager-pda-debug summary {
  min-height: 34px;
  color: #475569;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.store-manager-pda-debug p {
  margin: 8px 0 2px;
  color: #657164;
  font-size: 13px;
  line-height: 1.45;
}

.store-manager-pda-bottom-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 7px 18px 9px;
  background: #ffffff;
  border-top: 1px solid #e5e7eb;
}

.store-manager-pda-sdo-task-card {
  gap: 11px;
}

.store-manager-pda-sdo-summary,
.store-manager-pda-package-content,
.store-manager-pda-package-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.store-manager-pda-sdo-summary span,
.store-manager-pda-package-content span,
.store-manager-pda-package-meta span,
.store-manager-pda-sdo-source-line {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 8px 9px;
  border: 1px solid #e5ebe2;
  border-radius: 8px;
  background: #fbfcfa;
  color: #172017;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.15;
}

.store-manager-pda-sdo-summary b,
.store-manager-pda-package-content b,
.store-manager-pda-package-meta b,
.store-manager-pda-sdo-source-line span {
  overflow: hidden;
  color: #657164;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-package-content {
  grid-template-columns: 1fr;
}

.store-manager-pda-package-content strong,
.store-manager-pda-package-meta span {
  overflow-wrap: anywhere;
}

.store-manager-pda-sdo-source-line {
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: center;
}

.store-manager-pda-sdo-source-line strong {
  overflow: hidden;
  color: #172017;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.store-manager-pda-sdo-package-preview {
  max-height: 210px;
  overflow: auto;
}

.store-manager-pda-package-card .store-manager-pda-sdp-actions {
  grid-template-columns: 1fr;
}

.store-manager-pda-bottom-tabs button {
  min-height: 54px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 3px;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #9ca3af;
  font-size: 12px;
  font-weight: 900;
}

.store-manager-pda-tab-icon {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  line-height: 1;
}

.store-manager-pda-bottom-tabs button.is-active {
  background: transparent;
  color: #343a40;
}

.transfer-draft-list {
  margin-top: 10px;
}

.transfer-draft-row {
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(205, 191, 165, 0.54);
  background: rgba(255, 255, 255, 0.84);
}

.transfer-draft-row strong {
  font-size: 16px;
  line-height: 1.25;
  color: var(--ink);
}

.candidate-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  align-items: flex-start;
}

.candidate-title {
  font-size: 21px;
  font-weight: 800;
}

.candidate-qty {
  font-size: 15px;
  color: var(--accent);
  font-weight: 800;
  white-space: nowrap;
}

.ops-exception-shell,
.ops-data-shell,
.oa-shell {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 18px;
  align-items: start;
}

.ops-exception-form-shell,
.ops-exception-list-shell,
.ops-data-form-shell,
.ops-data-list-shell,
.oa-card-shell {
  background: rgba(255, 252, 247, 0.8);
  border: 1px solid rgba(205, 191, 165, 0.58);
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 10px 22px rgba(23, 20, 17, 0.03);
}

.ops-exception-list,
.ops-data-topic-list,
.oa-record-list {
  display: grid;
  gap: 12px;
}

.oa-record-item .template-card-head {
  align-items: start;
}

.oa-record-item .button-row {
  justify-content: flex-end;
}

.ops-filter-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.ops-filter-row label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  color: var(--muted-strong);
  font-weight: 700;
}

.ops-filter-row select {
  min-height: 46px;
}

.output {
  background: #161310;
  color: #d7f9ff;
  border-radius: 14px;
  padding: 14px;
  min-height: 72px;
  font-size: 17px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

.output.large {
  min-height: 220px;
}

.layout.locked {
  opacity: 0.45;
  pointer-events: none;
}

@keyframes panel-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 880px) {
  .auth-page {
    min-height: 100dvh;
    padding: 12px;
    justify-content: flex-start;
  }

  .test-home-entry {
    display: none !important;
  }

  .auth-shell {
    grid-template-columns: 1fr;
  }

  .auth-brand {
    display: none;
  }

  .auth-brand,
  .auth-card {
    padding: 22px;
  }

  .hero {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .app-shell {
    padding: 12px 12px 24px;
  }

  .workspace-shell,
  .layout {
    grid-template-columns: 1fr;
  }

  .workspace-side-panel {
    position: static;
  }

  .ops-exception-shell,
  .ops-data-shell {
    grid-template-columns: 1fr;
  }

  .ops-filter-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1240px) {
  .workspace-shell {
    grid-template-columns: 1fr;
  }

  .workspace-side-panel {
    position: static;
  }

  .store-pda-workbench {
    grid-template-columns: 1fr;
  }

  .store-pda-locked-grid,
  .store-pda-edit-grid {
    grid-template-columns: 1fr;
  }
}

body.cashier-terminal-mode {
  background: #f8fafc;
  overflow: hidden;
}

body.cashier-terminal-mode .app-shell {
  width: min(1580px, 100%);
  padding: 20px 22px 28px;
}

body.cashier-terminal-mode .workspace-top-panel,
body.cashier-terminal-mode .workspace-side-panel {
  display: none;
}

body.cashier-terminal-mode .workspace-shell {
  display: block;
}

body.cashier-terminal-mode .cashier-sale-panel {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.cashier-terminal-mode .cashier-sale-panel .panel-head {
  display: none;
}

body.cashier-terminal-mode .cashier-terminal-shell {
  display: grid;
  gap: 18px;
  position: relative;
  padding-bottom: 116px;
}

body.cashier-terminal-mode .topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 14px 16px;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

body.cashier-terminal-mode .brand-group {
  display: flex;
  align-items: center;
  gap: 18px;
}

body.cashier-terminal-mode .cashier-terminal-title {
  margin: 0;
  font-size: clamp(22px, 1.9vw, 30px);
  line-height: 1.1;
}

body.cashier-terminal-mode .cashier-terminal-subcopy {
  margin: 6px 0 0;
  color: #64748b;
  max-width: 560px;
  font-size: 13px;
}

body.cashier-terminal-mode .topbar-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

body.cashier-terminal-mode .cashier-terminal-session-strip {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 430px;
}

body.cashier-terminal-mode .cashier-terminal-session-strip span {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  padding: 6px 9px;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: 13px;
  font-weight: 700;
  overflow-wrap: anywhere;
}

body.cashier-terminal-mode .lang-toggle {
  display: inline-flex;
  padding: 4px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}

body.cashier-terminal-mode .lang-btn,
body.cashier-terminal-mode .secondary-ghost,
body.cashier-terminal-mode .secondary-inline,
body.cashier-terminal-mode .primary-inline,
body.cashier-terminal-mode .secondary-action,
body.cashier-terminal-mode .method-btn,
body.cashier-terminal-mode .primary-action,
body.cashier-terminal-mode .quick-action-button,
body.cashier-terminal-mode .drawer-close {
  transition: background 180ms ease, color 180ms ease, transform 180ms ease, border-color 180ms ease;
}

body.cashier-terminal-mode .lang-btn {
  padding: 7px 12px;
  color: #475569;
  background: transparent;
  border-radius: 6px;
  font-weight: 700;
}

body.cashier-terminal-mode .lang-btn.is-active {
  color: #2563eb;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

body.cashier-terminal-mode .secondary-ghost {
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #2563eb;
  border-radius: 6px;
  font-weight: 700;
}

body.cashier-terminal-mode .status-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .status-card {
  padding: 10px 12px;
  border-radius: 8px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.cashier-terminal-mode .status-card strong {
  display: block;
  margin-top: 6px;
  font-size: 15px;
  line-height: 1.2;
  color: #0f172a;
}

body.cashier-terminal-mode .status-label,
body.cashier-terminal-mode .metric-label,
body.cashier-terminal-mode .panel-kicker,
body.cashier-terminal-mode .preview-tag {
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 12px;
  font-weight: 700;
}

body.cashier-terminal-mode .status-label,
body.cashier-terminal-mode .metric-label {
  color: var(--muted);
}

body.cashier-terminal-mode .ok-dot {
  display: flex;
  align-items: center;
  gap: 10px;
}

body.cashier-terminal-mode .ok-dot span:first-child {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #16a34a;
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.12);
}

body.cashier-terminal-mode .time-card strong {
  font-size: 14px;
}

body.cashier-terminal-mode .workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.36fr) minmax(380px, 0.78fr);
  gap: 14px;
  align-items: start;
}

body.cashier-terminal-mode .cashier-distribution-card {
  display: grid;
  gap: 10px;
  padding: 12px;
}

body.cashier-terminal-mode .cashier-distribution-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

body.cashier-terminal-mode .cashier-distribution-head h3 {
  margin: 0;
  color: #0f172a;
  font-size: 16px;
  line-height: 1.2;
}

body.cashier-terminal-mode .cashier-distribution-head small,
body.cashier-terminal-mode .cashier-distribution-field span,
body.cashier-terminal-mode .cashier-distribution-empty,
body.cashier-terminal-mode .cashier-distribution-code-row small,
body.cashier-terminal-mode .cashier-distribution-selected small,
body.cashier-terminal-mode .cashier-distribution-result span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

body.cashier-terminal-mode .cashier-distribution-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
}

body.cashier-terminal-mode .cashier-sale-distributor-selector {
  align-self: start;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  margin: 6px 0 2px;
  padding: 6px 8px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fbff;
}

body.cashier-terminal-mode .cashier-sale-distributor-trigger {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
}

body.cashier-terminal-mode .cashier-sale-distributor-trigger .secondary-inline {
  min-height: 32px;
  padding: 0 10px;
  border-radius: 7px;
  font-size: 12px;
  line-height: 1;
}

body.cashier-terminal-mode .cashier-sale-distributor-trigger span {
  min-width: 0;
  color: #475569;
  font-size: 11px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cashier-terminal-mode .cashier-sale-distributor-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
}

body.cashier-terminal-mode .cashier-sale-distributor-head strong {
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

body.cashier-terminal-mode .cashier-sale-distributor-head small {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

body.cashier-terminal-mode .cashier-sale-distributor-popover {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  margin-top: 4px;
  padding: 10px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
}

body.cashier-terminal-mode .cashier-sale-distributor-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.cashier-terminal-mode .cashier-sale-distributor-popover-head strong {
  color: #0f172a;
  font-size: 13px;
  font-weight: 900;
}

body.cashier-terminal-mode .cashier-distribution-section,
body.cashier-terminal-mode .cashier-distribution-field,
body.cashier-terminal-mode .cashier-distribution-code-list,
body.cashier-terminal-mode .cashier-distribution-results {
  display: grid;
  gap: 7px;
  min-width: 0;
}

body.cashier-terminal-mode .cashier-distribution-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
}

body.cashier-terminal-mode .cashier-distribution-input-row input {
  min-width: 0;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #ffffff;
  color: #0f172a;
  font-size: 14px;
  font-weight: 700;
}

body.cashier-terminal-mode .cashier-distribution-feedback {
  min-height: 30px;
  display: flex;
  align-items: center;
  padding: 7px 9px;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

body.cashier-terminal-mode .cashier-distribution-feedback.is-success {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

body.cashier-terminal-mode .cashier-distribution-feedback.is-error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

body.cashier-terminal-mode .cashier-distribution-code-row,
body.cashier-terminal-mode .cashier-distribution-selected {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #ffffff;
}

body.cashier-terminal-mode .cashier-distribution-selected {
  grid-template-columns: minmax(0, 1fr) auto;
}

body.cashier-terminal-mode .cashier-distribution-code-row span,
body.cashier-terminal-mode .cashier-distribution-selected span {
  min-width: 0;
  display: grid;
  gap: 2px;
  overflow-wrap: anywhere;
}

body.cashier-terminal-mode .cashier-distribution-code-row strong,
body.cashier-terminal-mode .cashier-distribution-selected strong {
  color: #0f172a;
  font-size: 13px;
  line-height: 1.2;
}

body.cashier-terminal-mode .cashier-distribution-code-row em {
  min-width: 76px;
  padding: 4px 7px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  text-align: center;
}

body.cashier-terminal-mode .cashier-distribution-code-row.status-available em {
  background: #dcfce7;
  color: #166534;
}

body.cashier-terminal-mode .cashier-distribution-code-row.status-sold em,
body.cashier-terminal-mode .cashier-distribution-code-row.status-error em {
  background: #fee2e2;
  color: #991b1b;
}

body.cashier-terminal-mode .cashier-distribution-code-row.status-verifying em {
  background: #fef3c7;
  color: #92400e;
}

body.cashier-terminal-mode .cashier-distribution-empty {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 6px;
  background: #f8fafc;
}

body.cashier-terminal-mode .cashier-distribution-result {
  display: grid;
  gap: 2px;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid #dbe3ee;
  border-radius: 6px;
  background: #ffffff;
  color: #0f172a;
  text-align: left;
  cursor: pointer;
}

body.cashier-terminal-mode .cashier-distribution-result:hover {
  border-color: #2563eb;
  background: #eff6ff;
}

@media (max-width: 900px) {
  body.cashier-terminal-mode .cashier-distribution-grid,
  body.cashier-terminal-mode .cashier-distribution-input-row,
  body.cashier-terminal-mode .cashier-distribution-code-row,
  body.cashier-terminal-mode .cashier-sale-distributor-trigger {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .cashier-distribution-code-row em,
  body.cashier-terminal-mode .cashier-distribution-code-row button,
  body.cashier-terminal-mode .cashier-sale-distributor-trigger button {
    justify-self: start;
  }
}

body.cashier-terminal-mode .flow-column,
body.cashier-terminal-mode .payment-column {
  display: grid;
  gap: 14px;
}

body.cashier-terminal-mode .payment-column {
  position: sticky;
  top: 10px;
}

body.cashier-terminal-mode .cashier-terminal-shell .panel {
  padding: 16px;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

body.cashier-terminal-mode .cashier-terminal-card-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 12px;
}

body.cashier-terminal-mode .cashier-terminal-card-head h3,
body.cashier-terminal-mode .drawer-head h3 {
  margin: 2px 0 0;
  font-size: clamp(18px, 1.4vw, 22px);
}

body.cashier-terminal-mode .shortcut-pills,
body.cashier-terminal-mode .shortcut-stack,
body.cashier-terminal-mode .basket-tools,
body.cashier-terminal-mode .secondary-actions,
body.cashier-terminal-mode .payment-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

body.cashier-terminal-mode .pill,
body.cashier-terminal-mode .shortcut-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
}

body.cashier-terminal-mode .shortcut-chip.is-active {
  background: #dbeafe;
}

body.cashier-terminal-mode kbd {
  font-family: inherit;
  font-size: 12px;
  padding: 3px 6px;
  border-radius: 6px;
  background: #ffffff;
  border: 1px solid #bfdbfe;
}

body.cashier-terminal-mode .scan-grid {
  display: grid;
  grid-template-columns: 1.35fr 0.8fr;
  gap: 10px;
}

body.cashier-terminal-mode .field {
  display: grid;
  gap: 6px;
}

body.cashier-terminal-mode .field span {
  font-size: 13px;
  color: #475569;
  font-weight: 700;
}

body.cashier-terminal-mode .field-row {
  display: flex;
  gap: 10px;
}

body.cashier-terminal-mode .field-row input {
  min-width: 0;
}

body.cashier-terminal-mode .main-field input {
  min-height: 52px;
  font-size: 19px;
  padding-block: 12px;
  border-color: #bfdbfe;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.08);
}

body.cashier-terminal-mode .primary-inline,
body.cashier-terminal-mode .secondary-inline,
body.cashier-terminal-mode .secondary-action,
body.cashier-terminal-mode .method-btn,
body.cashier-terminal-mode .primary-action,
body.cashier-terminal-mode .quick-action-button {
  font-weight: 800;
}

body.cashier-terminal-mode .primary-inline,
body.cashier-terminal-mode .secondary-inline {
  min-height: 44px;
  padding: 0 14px;
  border-radius: 8px;
  white-space: nowrap;
}

body.cashier-terminal-mode .primary-inline,
body.cashier-terminal-mode .primary-action {
  background: #2563eb;
  color: #fff;
}

body.cashier-terminal-mode .secondary-inline,
body.cashier-terminal-mode .secondary-action {
  background: #ffffff;
  color: #2563eb;
  border: 1px solid #cbd5e1;
}

body.cashier-terminal-mode .lookup-preview {
  margin-top: 12px;
  padding: 12px;
  border-radius: 8px;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) auto;
  gap: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

body.cashier-terminal-mode .cashier-terminal-empty-copy {
  color: #64748b;
  line-height: 1.45;
}

body.cashier-terminal-mode .preview-copy h3 {
  margin: 6px 0 8px;
  font-size: 20px;
}

body.cashier-terminal-mode .preview-tag {
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 6px;
  background: #eff6ff;
  color: #2563eb;
}

body.cashier-terminal-mode .identity-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
}

body.cashier-terminal-mode .identity-strip span {
  padding: 5px 8px;
  border-radius: 6px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
}

body.cashier-terminal-mode .preview-metrics {
  display: grid;
  gap: 8px;
  align-content: center;
  min-width: 180px;
}

body.cashier-terminal-mode .cashier-manual-item-actions {
  margin-top: 10px;
  display: flex;
  justify-content: flex-start;
}

body.cashier-terminal-mode .cashier-manual-item-button {
  display: inline-grid;
  gap: 2px;
  align-content: center;
  justify-items: start;
  min-width: 150px;
}

body.cashier-terminal-mode .cashier-manual-item-button small {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}

body.cashier-terminal-mode .preview-metrics strong {
  display: block;
  margin-top: 4px;
  font-size: 22px;
}

body.cashier-terminal-mode .basket-tools {
  align-items: end;
  justify-content: flex-end;
}

body.cashier-terminal-mode .compact-field {
  min-width: 230px;
}

body.cashier-terminal-mode .basket-list {
  display: grid;
  gap: 10px;
}

body.cashier-terminal-mode .cashier-terminal-empty-card {
  padding: 14px;
  color: var(--muted);
}

body.cashier-terminal-mode .basket-row {
  min-height: 56px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  display: grid;
  gap: 10px;
}

body.cashier-terminal-mode .basket-row.is-override-pending {
  border-color: rgba(185, 75, 69, 0.42);
  box-shadow: inset 0 0 0 1px rgba(185, 75, 69, 0.12);
}

body.cashier-terminal-mode .cashier-cart-row.is-manual-item {
  border-color: #f59e0b;
  background: #fffbeb;
}

body.cashier-terminal-mode .cashier-terminal-row-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

body.cashier-terminal-mode .item-title {
  margin: 0;
  font-size: 17px;
}

body.cashier-terminal-mode .item-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}

body.cashier-terminal-mode .meta-chip {
  padding: 5px 8px;
  border-radius: 6px;
  background: #f1f5f9;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

body.cashier-terminal-mode .meta-chip.danger {
  background: #fef2f2;
  color: #991b1b;
}

body.cashier-terminal-mode .manual-audit-badge {
  display: inline-flex;
  width: fit-content;
  margin-top: 5px;
  padding: 4px 7px;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  font-size: 11px;
  font-weight: 800;
}

body.cashier-terminal-mode .remove-btn {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid #fecaca;
  background: #ffffff;
  color: #dc2626;
  font-size: 20px;
}

body.cashier-terminal-mode .cashier-terminal-edit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-edit-wide {
  grid-column: 1 / -1;
}

body.cashier-terminal-mode .basket-footer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .footer-stat,
body.cashier-terminal-mode .summary-box,
body.cashier-terminal-mode .drawer-card {
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

body.cashier-terminal-mode .footer-stat span,
body.cashier-terminal-mode .summary-box span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

body.cashier-terminal-mode .footer-stat strong,
body.cashier-terminal-mode .summary-box strong {
  display: block;
  margin-top: 6px;
  font-size: 20px;
}

body.cashier-terminal-mode .footer-stat-highlight,
body.cashier-terminal-mode .summary-box-strong {
  border-color: #bfdbfe;
  background: #eff6ff;
}

body.cashier-terminal-mode .payment-methods {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .method-btn {
  min-height: 48px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #0f172a;
  display: grid;
  gap: 2px;
  justify-items: start;
  padding: 10px 12px;
}

body.cashier-terminal-mode .method-btn.is-active {
  background: #eff6ff;
  border-color: #2563eb;
  color: #1d4ed8;
}

body.cashier-terminal-mode .summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

body.cashier-terminal-mode .payment-body {
  margin-top: 12px;
}

body.cashier-terminal-mode .payment-mode-panel {
  display: grid;
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-payment-line {
  display: grid;
  grid-template-columns: 150px 1fr 1fr auto;
  gap: 8px;
  align-items: center;
}

body.cashier-terminal-mode .cashier-terminal-add-payment-line {
  justify-self: start;
}

body.cashier-terminal-mode .payment-actions {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-payment-actions {
  grid-template-columns: 1fr;
}

body.cashier-terminal-mode .primary-action {
  min-height: 54px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  font-size: 18px;
}

body.cashier-terminal-mode .payment-meta strong {
  display: block;
  margin-top: 6px;
  font-size: 18px;
}

body.cashier-terminal-mode .cashier-terminal-grand-total {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
  padding: 14px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #eff6ff;
}

body.cashier-terminal-mode .cashier-terminal-grand-total span,
body.cashier-terminal-mode .cashier-terminal-grand-total small {
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

body.cashier-terminal-mode .cashier-terminal-grand-total strong {
  color: #0f172a;
  font-size: clamp(32px, 3.2vw, 40px);
  line-height: 1;
}

body.cashier-terminal-mode .quick-action-button {
  min-height: 42px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 3px;
  padding: 8px 10px;
  color: #334155;
}

body.cashier-terminal-mode .quick-action-button strong {
  font-size: 14px;
}

body.cashier-terminal-mode .cashier-terminal-quick-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

body.cashier-terminal-mode .cashier-terminal-status-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: 13px;
  overflow-wrap: anywhere;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics strong {
  color: #64748b;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.cashier-terminal-mode .cashier-terminal-footer-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(6, 24, 26, 0.32);
  backdrop-filter: blur(4px);
  z-index: 1100;
}

body.cashier-terminal-mode .side-drawer {
  position: fixed;
  top: 18px;
  right: 18px;
  bottom: 18px;
  width: min(480px, calc(100vw - 36px));
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 24px 54px rgba(15, 23, 42, 0.18);
  z-index: 1101;
  display: grid;
  grid-template-rows: auto 1fr auto;
  overflow: hidden;
}

body.cashier-terminal-mode .drawer-backdrop[hidden],
body.cashier-terminal-mode .side-drawer[hidden] {
  display: none !important;
}

body.cashier-terminal-mode .drawer-head,
body.cashier-terminal-mode .drawer-foot {
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body.cashier-terminal-mode .drawer-body {
  padding: 0 16px 16px;
  overflow: auto;
  display: grid;
  gap: 14px;
}

body.cashier-terminal-mode .cashier-manual-audit-card {
  display: grid;
  gap: 5px;
  border-color: #fbbf24;
  background: #fffbeb;
  color: #78350f;
}

body.cashier-terminal-mode .cashier-manual-audit-card strong {
  font-size: 15px;
}

body.cashier-terminal-mode .cashier-manual-audit-card span {
  color: #92400e;
  line-height: 1.4;
}

body.cashier-terminal-mode .cashier-manual-drawer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

body.cashier-terminal-mode .cashier-manual-reason-field {
  grid-column: 1 / -1;
}

body.cashier-terminal-mode .cashier-manual-drawer-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.cashier-terminal-mode .drawer-close {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  font-size: 24px;
}

body.cashier-terminal-mode .split-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
}

body.cashier-terminal-mode .drawer-hint {
  padding: 0 16px 16px;
  color: var(--muted);
  line-height: 1.45;
}

body.cashier-terminal-mode .metric-card strong {
  display: block;
  margin-top: 8px;
  font-size: 28px;
}

body.cashier-terminal-mode .receipt-preview {
  background: #fff;
  color: #1f2424;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  padding: 14px;
  font-family: "SF Mono", "Menlo", monospace;
}

body.cashier-terminal-mode .receipt-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0;
}

body.cashier-terminal-mode .receipt-center {
  justify-content: center;
}

body.cashier-terminal-mode .receipt-divider {
  border-top: 1px dashed rgba(31, 36, 36, 0.24);
  margin: 10px 0;
}

body.cashier-terminal-mode .receipt-badge {
  margin-top: 14px;
  display: inline-flex;
  padding: 6px 10px;
  border-radius: 6px;
  background: #eff6ff;
  color: #2563eb;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 1280px) {
  body.cashier-terminal-mode .status-grid,
  body.cashier-terminal-mode .cashier-terminal-status-metrics,
  body.cashier-terminal-mode .cashier-terminal-footer-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.cashier-terminal-mode .workspace-grid {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .payment-column {
    position: static;
  }

  body.cashier-terminal-mode .cashier-terminal-quick-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  body.cashier-terminal-mode .app-shell {
    padding: 14px;
  }

  body.cashier-terminal-mode .cashier-terminal-shell {
    padding-bottom: 14px;
  }

  body.cashier-terminal-mode .cashier-terminal-quick-actions {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .topbar {
    padding: 20px;
    flex-direction: column;
    align-items: stretch;
  }

  body.cashier-terminal-mode .status-grid,
  body.cashier-terminal-mode .summary-grid,
  body.cashier-terminal-mode .basket-footer,
  body.cashier-terminal-mode .cashier-terminal-status-metrics,
  body.cashier-terminal-mode .cashier-terminal-footer-actions,
  body.cashier-terminal-mode .payment-methods,
  body.cashier-terminal-mode .cashier-terminal-quick-actions,
  body.cashier-terminal-mode .cashier-terminal-edit-grid,
  body.cashier-terminal-mode .split-actions,
  body.cashier-terminal-mode .scan-grid {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .field-row {
    flex-direction: column;
  }

  body.cashier-terminal-mode .lookup-preview {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .cashier-terminal-payment-line {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .side-drawer {
    inset: auto 10px 10px 10px;
    top: 10px;
    width: auto;
  }
}

/* Final POS preview overrides must stay after the legacy cashier shell rules. */
body.cashier-terminal-mode .app-shell {
  width: 100%;
  max-width: none;
  padding: 0;
}

body.cashier-terminal-mode .workspace-top-panel,
body.cashier-terminal-mode .workspace-side-panel,
body.cashier-terminal-mode .workspace-tabs,
body.cashier-terminal-mode .workspace-top-hint,
body.cashier-terminal-mode .workspace-top-row,
body.cashier-terminal-mode #workspacePageSearch,
body.cashier-terminal-mode #workspacePrevButton,
body.cashier-terminal-mode #workspaceNextButton {
  display: none !important;
}
body.cashier-landing-mode .workspace-top-panel,
body.cashier-landing-mode .workspace-side-panel,
body.cashier-landing-mode .workspace-tabs,
body.cashier-landing-mode .workspace-top-hint,
body.cashier-landing-mode .workspace-top-row,
body.cashier-landing-mode #workspacePageSearch,
body.cashier-landing-mode #workspacePrevButton,
body.cashier-landing-mode #workspaceNextButton,
body.cashier-pos-mode .workspace-top-panel,
body.cashier-pos-mode .workspace-side-panel,
body.cashier-pos-mode .workspace-tabs,
body.cashier-pos-mode .workspace-top-hint,
body.cashier-pos-mode .workspace-top-row,
body.cashier-pos-mode #workspacePageSearch,
body.cashier-pos-mode #workspacePrevButton,
body.cashier-pos-mode #workspaceNextButton {
  display: none !important;
}


body.cashier-terminal-mode .cashier-terminal-shell {
  min-height: 100vh;
  padding: 12px 14px 18px;
  gap: 14px;
}

body.cashier-terminal-mode .topbar {
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #ffffff;
  color: #111827;
  box-shadow: 0 8px 24px rgba(17, 24, 39, 0.08);
  padding: 10px 12px;
  align-items: stretch;
}

body.cashier-terminal-mode .cashier-terminal-title {
  color: #111827;
  font-size: 22px;
}

body.cashier-terminal-mode .brand-group .eyebrow {
  color: #6d28d9;
  letter-spacing: 0;
  font-size: 11px;
  margin-bottom: 4px;
}

body.cashier-terminal-mode .cashier-terminal-subtitle {
  margin: 2px 0 0;
  color: #475569;
  font-size: 13px;
  font-weight: 900;
}

body.cashier-terminal-mode .topbar-actions {
  flex: 1;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

body.cashier-terminal-mode .cashier-terminal-session-strip {
  flex: 1;
  max-width: none;
  justify-content: flex-end;
}

body.cashier-terminal-mode .cashier-terminal-session-strip span,
body.cashier-terminal-mode .topbar-chip-button,
body.cashier-terminal-mode .network-pill {
  min-height: 38px;
  display: inline-grid;
  grid-template-columns: auto;
  gap: 2px;
  align-items: center;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  background: #f8fafc;
  color: #111827;
  padding: 6px 9px;
  font-size: 12px;
  font-weight: 800;
}

body.cashier-terminal-mode .cashier-terminal-session-strip b,
body.cashier-terminal-mode .network-pill b {
  color: #64748b;
  font-size: 10px;
  line-height: 1;
  text-transform: uppercase;
}

body.cashier-terminal-mode .topbar-chip-button,
body.cashier-terminal-mode .network-pill {
  cursor: pointer;
}

body.cashier-terminal-mode .network-online,
body.cashier-terminal-mode .network-synced {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

body.cashier-terminal-mode .network-weak,
body.cashier-terminal-mode .network-syncing {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}

body.cashier-terminal-mode .network-offline,
body.cashier-terminal-mode .network-failed {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

body.cashier-terminal-mode .cashier-terminal-body {
  grid-template-columns: minmax(280px, 27fr) minmax(420px, 42fr) minmax(320px, 31fr);
  align-items: stretch;
}

body.cashier-terminal-mode .cashier-terminal-shell .panel {
  border-radius: 14px;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(17, 24, 39, 0.08);
}

body.cashier-terminal-mode .main-field input {
  min-height: 66px;
  border: 2px solid #c4b5fd;
  border-radius: 12px;
  background: #fbfbff;
  font-size: 24px;
  font-weight: 900;
  letter-spacing: 0;
  box-shadow: 0 0 0 4px rgba(109, 40, 217, 0.08);
}

body.cashier-terminal-mode .primary-inline,
body.cashier-terminal-mode .primary-action {
  border: 0;
  background: #6d28d9;
  color: #ffffff;
  box-shadow: 0 10px 20px rgba(109, 40, 217, 0.24);
}

body.cashier-terminal-mode .cashier-cart-header,
body.cashier-terminal-mode .cashier-cart-row {
  display: grid;
  grid-template-columns: minmax(120px, 1.8fr) minmax(86px, 1fr) minmax(50px, 0.7fr) minmax(54px, 0.8fr) minmax(60px, 0.8fr) minmax(42px, 0.56fr) minmax(50px, 0.72fr) minmax(64px, 0.9fr) 32px;
  gap: 4px;
  align-items: center;
  width: 100%;
  min-width: 0;
}

body.cashier-terminal-mode .cashier-cart-row {
  min-height: 58px;
  padding: 6px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 12px rgba(17, 24, 39, 0.04);
}


body.cashier-terminal-mode .cashier-cart-header > span,
body.cashier-terminal-mode .cashier-cart-row > div,
body.cashier-terminal-mode .cashier-cart-row > button {
  min-width: 0;
}

body.cashier-terminal-mode .cart-cell-ellipsis,
body.cashier-terminal-mode .cart-code strong,
body.cashier-terminal-mode .cart-code small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cashier-terminal-mode .cart-cell-num {
  text-align: right;
  white-space: nowrap;
}

body.cashier-terminal-mode .cashier-cart-row > div:nth-child(5) {
  text-align: right;
  white-space: nowrap;
}

body.cashier-terminal-mode .cashier-cart-header > span:nth-child(n + 4):nth-child(-n + 7) {
  text-align: right;
}

body.cashier-terminal-mode .cashier-cart-header > span:last-child {
  text-align: center;
}

body.cashier-terminal-mode .cart-action-remove {
  width: 32px;
  min-width: 32px;
  height: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
  white-space: nowrap;
}
body.cashier-terminal-mode .cashier-terminal-grand-total {
  border-color: #ddd6fe;
  border-radius: 14px;
  background: linear-gradient(180deg, #f5f3ff 0%, #ffffff 100%);
}

body.cashier-terminal-mode .cashier-no-shift-card,
body.cashier-terminal-mode .cashier-scan-error,
body.cashier-terminal-mode .cashier-payment-guidance,
body.cashier-terminal-mode .cashier-payment-warning,
body.cashier-terminal-mode .cashier-reprint-confirm-card,
body.cashier-terminal-mode .cashier-shift-variance-warning {
  display: grid;
  gap: 6px;
  margin: 10px 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #991b1b;
  font-weight: 800;
}

body.cashier-terminal-mode .cashier-no-shift-card {
  border-color: #fbbf24;
  background: #fffbeb;
  color: #92400e;
}

body.cashier-terminal-mode .cashier-no-shift-card strong {
  color: #7c2d12;
  font-size: 18px;
}

body.cashier-terminal-mode .cashier-no-shift-card .primary-inline {
  width: fit-content;
  margin-top: 4px;
}

body.cashier-terminal-mode .cashier-payment-warning {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}

body.cashier-terminal-mode .cashier-reprint-confirm-card {
  border-color: #ddd6fe;
  background: #f5f3ff;
  color: #4c1d95;
}

body.cashier-terminal-mode .cashier-reprint-error {
  margin-top: 10px;
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

body.cashier-terminal-mode .recent-sales-body {
  align-content: start;
  grid-auto-rows: max-content;
}

body.cashier-terminal-mode .recent-sales-table {
  display: grid;
  align-content: start;
  grid-auto-rows: max-content;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
}

body.cashier-terminal-mode .recent-sales-table-head,
body.cashier-terminal-mode .recent-sales-row {
  display: grid;
  grid-template-columns: minmax(82px, 0.55fr) minmax(150px, 1.2fr) minmax(150px, 1fr) minmax(110px, 0.75fr) minmax(100px, 0.75fr);
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
}

body.cashier-terminal-mode .recent-sales-table-head {
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  font-weight: 800;
}

body.cashier-terminal-mode .recent-sales-row {
  border-bottom: 1px solid #eef2f7;
  min-height: 64px;
}

body.cashier-terminal-mode .recent-sales-row:last-child {
  border-bottom: 0;
}

body.cashier-terminal-mode .recent-sales-row.is-selected {
  background: #eff6ff;
}

body.cashier-terminal-mode .recent-sales-row .sale-no {
  color: #6d28d9;
  font-weight: 800;
  overflow-wrap: anywhere;
}

body.cashier-terminal-mode .receipt-select-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
}

body.cashier-terminal-mode .receipt-select-cell input {
  width: 20px;
  height: 20px;
  accent-color: #2563eb;
}

body.cashier-terminal-mode .side-drawer.cashier-terminal-drawer.drawer-recent-sales {
  width: min(640px, calc(100vw - 24px));
  border-radius: 14px;
}

body.cashier-terminal-mode .receipt-drawer-head {
  align-items: flex-start;
  padding: 20px 24px 14px;
  border-bottom: 1px solid #e5e7eb;
}

body.cashier-terminal-mode .receipt-drawer-head h3 {
  margin: 4px 0 0;
}

body.cashier-terminal-mode .receipt-drawer-subtitle {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
}

body.cashier-terminal-mode .receipt-drawer-close {
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: #475569;
  line-height: 1;
}

body.cashier-terminal-mode .receipt-drawer-body {
  padding: 16px 24px;
  gap: 12px;
}

body.cashier-terminal-mode .receipt-print-summary,
body.cashier-terminal-mode .receipt-print-feedback {
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1e3a8a;
}

body.cashier-terminal-mode .receipt-print-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
}

body.cashier-terminal-mode .receipt-print-summary div {
  display: grid;
  gap: 3px;
}

body.cashier-terminal-mode .receipt-print-summary strong {
  font-size: 15px;
}

body.cashier-terminal-mode .receipt-print-summary span,
body.cashier-terminal-mode .receipt-print-feedback {
  font-size: 13px;
  line-height: 1.45;
}

body.cashier-terminal-mode .receipt-print-summary b {
  flex: 0 0 auto;
  min-width: 48px;
  text-align: center;
  padding: 6px 9px;
  border-radius: 999px;
  background: #ffffff;
}

body.cashier-terminal-mode .receipt-print-feedback {
  padding: 10px 12px;
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #475569;
}

body.cashier-terminal-mode .recent-sales-list {
  display: grid;
  gap: 10px;
}

body.cashier-terminal-mode .recent-sales-list .receipt-sale-card {
  position: relative;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: 100%;
  min-height: 74px;
  padding: 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #ffffff;
  color: inherit;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

body.cashier-terminal-mode .recent-sales-list .receipt-sale-card:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}

body.cashier-terminal-mode .recent-sales-list .receipt-sale-card.is-selected {
  border-color: #2563eb;
  background: #eff6ff;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.14);
}

body.cashier-terminal-mode .receipt-sale-card input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

body.cashier-terminal-mode .receipt-sale-check {
  width: 22px;
  height: 22px;
  border: 2px solid #cbd5e1;
  border-radius: 6px;
  background: #ffffff;
}

body.cashier-terminal-mode .receipt-sale-card.is-selected .receipt-sale-check {
  position: relative;
  border-color: #2563eb;
  background: #2563eb;
}

body.cashier-terminal-mode .receipt-sale-card.is-selected .receipt-sale-check::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 6px;
  height: 11px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

body.cashier-terminal-mode .receipt-sale-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

body.cashier-terminal-mode .receipt-sale-main .sale-no {
  color: #1d4ed8;
  font-size: 15px;
  line-height: 1.25;
}

body.cashier-terminal-mode .receipt-sale-main small {
  color: #64748b;
  font-weight: 800;
}

body.cashier-terminal-mode .receipt-sale-amount {
  color: #0f172a;
  font-size: 17px;
  white-space: nowrap;
}

body.cashier-terminal-mode .receipt-preview-section {
  display: grid;
  gap: 10px;
  margin-top: 2px;
}

body.cashier-terminal-mode .receipt-preview-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

body.cashier-terminal-mode .receipt-preview-head strong {
  color: #0f172a;
  font-size: 15px;
}

body.cashier-terminal-mode .receipt-preview-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

body.cashier-terminal-mode .receipt-preview-empty,
body.cashier-terminal-mode .receipt-preview-paper-57mm {
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
}

body.cashier-terminal-mode .receipt-preview-empty {
  min-height: 120px;
  display: grid;
  place-items: center;
  color: #64748b;
  font-weight: 800;
}

body.cashier-terminal-mode .receipt-preview-paper-57mm {
  max-height: 282px;
  overflow: auto;
  padding: 14px;
}

body.cashier-terminal-mode .receipt-preview-paper-57mm .cashier-thermal-paper-57mm {
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.14);
}

body.cashier-terminal-mode .receipt-print-foot {
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  padding: 14px 24px 20px;
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
}

body.cashier-terminal-mode .receipt-print-foot .primary-inline:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

@media (max-width: 720px) {
  body.cashier-terminal-mode .side-drawer.cashier-terminal-drawer.drawer-recent-sales {
    inset: auto 8px 8px 8px;
    top: 8px;
    width: auto;
  }

  body.cashier-terminal-mode .receipt-drawer-head,
  body.cashier-terminal-mode .receipt-drawer-body,
  body.cashier-terminal-mode .receipt-print-foot {
    padding-left: 16px;
    padding-right: 16px;
  }

  body.cashier-terminal-mode .receipt-print-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  body.cashier-terminal-mode .recent-sales-list .receipt-sale-card {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  body.cashier-terminal-mode .receipt-sale-amount {
    grid-column: 2;
    justify-self: start;
  }

  body.cashier-terminal-mode .receipt-print-foot {
    grid-template-columns: 1fr;
  }
}

body.cashier-terminal-mode .cashier-shift-variance {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 10px 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  font-weight: 900;
}

body.cashier-terminal-mode .cashier-shift-variance.danger {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

body.cashier-terminal-mode .cashier-shift-variance.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

body.cashier-terminal-mode .cashier-shift-variance-warning.is-hidden {
  display: none;
}

body.cashier-terminal-mode .cashier-terminal-grand-total strong {
  color: #111827;
  font-size: 46px;
}

body.cashier-terminal-mode .method-btn.is-active {
  border-color: #6d28d9;
  background: #f5f3ff;
  color: #5b21b6;
}

body.cashier-terminal-mode .method-btn[data-terminal-payment-mode="cash"].is-active {
  border-color: #16a34a;
  background: #f0fdf4;
  color: #166534;
}

body.cashier-terminal-mode .method-btn[data-terminal-payment-mode="mpesa"].is-active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

body.cashier-terminal-mode .receipt-preview-paper {
  padding: 18px 16px;
  border-radius: 4px;
  background: #fffdf7;
  border: 1px solid #ece2c6;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

body.cashier-terminal-mode .receipt-preview-paper.receipt-preview-paper-57mm {
  max-height: 282px;
  overflow: auto;
  padding: 14px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
}

.cashier-terminal-print-root {
  display: none;
}

.cashier-thermal-paper-57mm {
  box-sizing: border-box;
  width: 65mm;
  max-width: 65mm;
  margin: 0 auto;
  padding: 1.8mm 7mm 1.8mm 2.5mm;
  background: #ffffff;
  color: #000000;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 10px;
  line-height: 1.25;
}

.cashier-thermal-paper-57mm .thermal-center {
  display: grid;
  justify-items: center;
  gap: 1mm;
  text-align: center;
}

.cashier-thermal-paper-57mm .thermal-title {
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.cashier-thermal-paper-57mm .thermal-muted {
  color: #111111;
  font-size: 9px;
}

.cashier-thermal-paper-57mm .thermal-divider {
  margin: 1.6mm 0;
  border-top: 1px dashed #000000;
}

.cashier-thermal-paper-57mm .thermal-line {
  display: flex;
  justify-content: space-between;
  gap: 1mm;
  margin: 0.8mm 0;
}

.cashier-thermal-paper-57mm .thermal-line span:first-child,
.cashier-thermal-paper-57mm .thermal-line strong:first-child {
  flex: 0 0 auto;
  padding-right: 1mm;
}

.cashier-thermal-paper-57mm .thermal-line span:last-child,
.cashier-thermal-paper-57mm .thermal-line strong:last-child {
  flex: 1 1 auto;
  min-width: 0;
  text-align: right;
  overflow-wrap: anywhere;
}

.cashier-thermal-paper-57mm .thermal-total {
  font-size: 12px;
  font-weight: 900;
}

.cashier-thermal-paper-57mm .thermal-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 15px 42px;
  column-gap: 1mm;
  row-gap: 0.4mm;
  align-items: start;
  margin: 1mm 0;
}

.cashier-thermal-paper-57mm .thermal-item-meta {
  grid-column: 1 / -1;
  text-align: left !important;
}

.cashier-thermal-paper-57mm .thermal-item span,
.cashier-thermal-paper-57mm .thermal-item strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.cashier-thermal-paper-57mm .thermal-item span:not(:first-child),
.cashier-thermal-paper-57mm .thermal-item strong:not(:first-child) {
  text-align: right;
}

.cashier-thermal-paper-57mm .thermal-section-title {
  margin: 1.4mm 0 0.8mm;
  font-weight: 900;
  text-transform: uppercase;
}

@media print {
  html,
  body {
    width: 65mm;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
  }

  body.cashier-terminal-printing > :not(.cashier-terminal-print-root) {
    display: none !important;
  }

  body.cashier-terminal-printing .cashier-terminal-print-root {
    box-sizing: border-box !important;
    display: block !important;
    position: static !important;
    width: 65mm !important;
    min-width: 65mm !important;
    max-width: 65mm !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    color: #000000 !important;
    box-shadow: none !important;
  }

  body.cashier-terminal-printing .cashier-thermal-paper-57mm {
    box-sizing: border-box !important;
    width: 65mm !important;
    max-width: 65mm !important;
    margin: 0 !important;
    padding: 1.8mm 7mm 1.8mm 2.5mm !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .cashier-print-actions,
  .receipt-actions,
  .drawer-foot,
  .drawer-head button,
  .topbar,
  .cashier-terminal-status,
  .cashier-terminal-quick-actions {
    display: none !important;
  }
}

body.cashier-terminal-mode .cashier-terminal-quick-actions {
  display: block;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  box-shadow: 0 4px 16px rgba(17, 24, 39, 0.06);
}

body.cashier-terminal-mode .cashier-terminal-transaction-strip {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
}

body.cashier-terminal-mode .transaction-strip-title {
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics > span,
body.cashier-terminal-mode .cashier-terminal-status-metrics > button {
  min-height: 54px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  color: #111827;
  font-weight: 900;
  text-align: left;
}

body.cashier-terminal-mode .side-drawer {
  right: 10px;
  width: min(760px, calc(100vw - 20px));
  border-radius: 16px;
}

@media (max-width: 1260px) {
  body.cashier-terminal-mode .cashier-terminal-body {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.55fr);
  }

  body.cashier-terminal-mode .receipt-column {
    grid-column: 1 / -1;
    position: static;
  }
}

@media (max-width: 900px) {
  body.cashier-terminal-mode .cashier-terminal-body,
  body.cashier-terminal-mode .field-row,
  body.cashier-terminal-mode .summary-grid,
  body.cashier-terminal-mode .payment-methods,
  body.cashier-terminal-mode .cashier-terminal-status-metrics,
  body.cashier-terminal-mode .shift-info-grid,
  body.cashier-terminal-mode .shift-stats-grid,
  body.cashier-terminal-mode .split-actions {
    grid-template-columns: 1fr;
  }

  body.cashier-terminal-mode .payment-column,
  body.cashier-terminal-mode .receipt-column {
    position: static;
  }

  body.cashier-terminal-mode .cashier-cart-header {
    display: none;
  }

  body.cashier-terminal-mode .cashier-cart-row {
    grid-template-columns: 1fr 1fr;
  }
}

/* POS-UI-2-HOTFIX: keep the cashier terminal compact and prevent header/receipt takeover. */
body.cashier-terminal-mode,
body.cashier-terminal-mode .app-shell,
body.cashier-terminal-mode .workspace-shell,
body.cashier-terminal-mode #workspacePanels,
body.cashier-terminal-mode .cashier-sale-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

body.cashier-terminal-mode .cashier-terminal-shell {
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  box-sizing: border-box;
  padding: 0 0 12px;
  gap: 10px;
  background: #f8fafc;
  overflow-x: hidden;
}

body.cashier-terminal-mode .topbar {
  display: grid;
  grid-template-columns: minmax(180px, 220px) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 80px;
  max-height: 110px;
  overflow: hidden;
  border: 0;
  border-radius: 0 0 8px 8px;
  background: linear-gradient(135deg, #0f172a 0%, #111827 62%, #111827 100%);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
  padding: 12px 16px;
}

body.cashier-terminal-mode .brand-group {
  min-width: 0;
  gap: 10px;
}

body.cashier-terminal-mode .brand-group .eyebrow {
  display: none;
}

body.cashier-terminal-mode .cashier-terminal-title {
  color: #ffffff;
  font-size: 22px;
  line-height: 1.05;
  font-weight: 950;
}

body.cashier-terminal-mode .cashier-terminal-subtitle {
  color: #cbd5e1;
  margin-top: 4px;
}

body.cashier-terminal-mode .topbar-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

body.cashier-terminal-mode .cashier-terminal-session-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 6px;
  width: 100%;
  max-width: 100%;
  max-height: 74px;
  overflow: hidden;
  align-items: stretch;
}

body.cashier-terminal-mode .cashier-terminal-session-strip span,
body.cashier-terminal-mode .topbar-chip-button,
body.cashier-terminal-mode .network-pill {
  min-width: 0;
  min-height: 34px;
  display: grid;
  align-content: center;
  gap: 2px;
  box-sizing: border-box;
  border-radius: 9px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.58);
  color: #f8fafc;
  padding: 5px 8px;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.15;
  overflow: hidden;
}

body.cashier-terminal-mode .cashier-terminal-session-strip b,
body.cashier-terminal-mode .network-pill b {
  color: #cbd5e1;
  font-size: 9px;
  line-height: 1;
  text-transform: none;
  white-space: nowrap;
}

body.cashier-terminal-mode .topbar-chip-button {
  white-space: nowrap;
}

body.cashier-terminal-mode .topbar .cashier-terminal-exit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  white-space: nowrap;
  border-color: rgba(196, 181, 253, 0.54);
  background: rgba(124, 58, 237, 0.18);
  color: #ede9fe;
}

body.cashier-terminal-mode .cashier-terminal-session-strip .web-language-toggle {
  min-width: 104px;
  min-height: 34px;
  align-self: stretch;
  justify-content: center;
  border-color: rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.58);
  box-shadow: none;
}

body.cashier-terminal-mode .cashier-terminal-session-strip .global-language-button {
  min-height: 26px;
  padding: 0 8px;
  color: #cbd5e1;
  font-size: 11px;
}

body.cashier-terminal-mode .cashier-terminal-session-strip .global-language-button.is-active {
  background: #2563eb;
  color: #ffffff;
  box-shadow: none;
}

body.cashier-terminal-mode .network-online,
body.cashier-terminal-mode .network-synced {
  border-color: rgba(34, 197, 94, 0.34);
  background: rgba(20, 83, 45, 0.3);
  color: #22c55e;
}

body.cashier-terminal-mode .network-weak,
body.cashier-terminal-mode .network-syncing {
  border-color: rgba(245, 158, 11, 0.38);
  background: rgba(120, 53, 15, 0.3);
  color: #fbbf24;
}

body.cashier-terminal-mode .network-offline,
body.cashier-terminal-mode .network-failed {
  border-color: rgba(248, 113, 113, 0.42);
  background: rgba(127, 29, 29, 0.34);
  color: #fca5a5;
}

body.cashier-terminal-mode .cashier-terminal-status {
  margin: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 0;
  background: transparent;
  color: #334155;
  font-size: 13px;
  font-weight: 850;
}

body.cashier-terminal-mode .cashier-terminal-status > span {
  flex: 1 1 auto;
  min-width: 0;
  color: #4338ca;
}

body.cashier-terminal-mode .cashier-terminal-strip-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

body.cashier-terminal-mode .cashier-terminal-strip-actions .secondary-inline {
  width: auto;
  min-width: 112px;
  flex: 0 0 auto;
}

body.cashier-terminal-mode .cashier-terminal-body {
  display: grid;
  grid-template-columns: minmax(280px, 0.28fr) minmax(460px, 0.42fr) minmax(360px, 0.3fr);
  gap: 12px;
  min-height: calc(100vh - 180px);
  margin: 0 16px;
  align-items: stretch;
}

body.cashier-terminal-mode .cashier-terminal-body > * {
  min-width: 0;
}

body.cashier-terminal-mode .cashier-terminal-scan-card,
body.cashier-terminal-mode .cashier-terminal-cart-card,
body.cashier-terminal-mode .cashier-terminal-payment-panel {
  height: 100%;
}

body.cashier-terminal-mode .lookup-preview,
body.cashier-terminal-mode .cashier-terminal-scan-hint {
  grid-template-columns: 1fr !important;
  line-height: 1.55;
}

body.cashier-terminal-mode .lookup-preview span,
body.cashier-terminal-mode .cashier-terminal-scan-hint span,
body.cashier-terminal-mode .cashier-recent-scans span {
  word-break: normal;
  overflow-wrap: anywhere;
}

body.cashier-terminal-mode .cashier-terminal-quick-actions {
  position: static;
  margin: 0 16px;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  box-shadow: 0 4px 14px rgba(17, 24, 39, 0.05);
}

body.cashier-terminal-mode .cashier-terminal-transaction-strip {
  max-height: 96px;
  overflow: hidden;
  padding: 10px 12px;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics > span,
body.cashier-terminal-mode .cashier-terminal-status-metrics > button {
  min-height: 44px;
  padding: 6px 8px;
}

body.cashier-terminal-mode .cashier-terminal-receipt-panel.is-empty {
  display: none;
}

body.cashier-terminal-mode .cashier-terminal-receipt-panel {
  margin: 0 16px;
}

@media (max-width: 1320px) {
  body.cashier-terminal-mode .topbar {
    max-height: none;
  }

  body.cashier-terminal-mode .cashier-terminal-session-strip {
    max-height: none;
  }

  body.cashier-terminal-mode .cashier-terminal-body {
    grid-template-columns: minmax(280px, 0.34fr) minmax(420px, 0.66fr);
  }

  body.cashier-terminal-mode .payment-column {
    grid-column: 1 / -1;
    position: static;
  }
}

@media (max-width: 900px) {
  body.cashier-terminal-mode .topbar,
  body.cashier-terminal-mode .topbar-actions {
    grid-template-columns: 1fr;
    max-height: none;
  }

  body.cashier-terminal-mode .cashier-terminal-session-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.cashier-terminal-mode .cashier-terminal-status {
    flex-direction: column;
    align-items: stretch;
  }

  body.cashier-terminal-mode .cashier-terminal-strip-actions {
    justify-content: stretch;
  }

  body.cashier-terminal-mode .cashier-terminal-body,
  body.cashier-terminal-mode .cashier-terminal-status-metrics {
    grid-template-columns: 1fr;
    min-height: auto;
  }
}

/* Issue #309: keep staging POS synced to the active cashier account and usable on 1366x768 cashier terminals. */
body.cashier-terminal-mode .cashier-terminal-shell {
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  gap: 6px;
  overflow: hidden;
}

body.cashier-terminal-mode .cashier-terminal-shell:fullscreen {
  width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  background: #f8fafc;
  overflow: hidden;
}

body.cashier-terminal-mode .topbar {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(0, 1fr) auto;
  align-items: center;
  min-height: 64px;
  max-height: 78px;
  padding: 8px 12px;
  overflow: hidden;
}

body.cashier-terminal-mode .topbar-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

body.cashier-terminal-mode .brand-group {
  min-width: 0;
}

body.cashier-terminal-mode .cashier-terminal-title {
  font-size: 20px;
  line-height: 1.05;
}

body.cashier-terminal-mode .cashier-terminal-session-strip {
  grid-template-columns: repeat(auto-fit, minmax(88px, 1fr));
  gap: 6px;
  max-height: 58px;
  overflow: hidden;
  align-items: center;
}

body.cashier-terminal-mode .cashier-terminal-session-strip > span,
body.cashier-terminal-mode .cashier-terminal-session-strip > button,
body.cashier-terminal-mode .cashier-terminal-session-strip .web-language-toggle {
  min-height: 30px;
  padding: 5px 7px;
  align-self: center;
}

body.cashier-terminal-mode .cashier-terminal-session-strip b {
  font-size: 8px;
  line-height: 1;
}

body.cashier-terminal-mode .cashier-terminal-session-strip span,
body.cashier-terminal-mode .cashier-terminal-session-strip button {
  font-size: 11px;
  line-height: 1.1;
}

body.cashier-terminal-mode .cashier-terminal-session-strip em {
  font-style: normal;
}

body.cashier-terminal-mode .cashier-terminal-session-strip .web-language-toggle {
  min-width: 88px;
}

body.cashier-terminal-mode .cashier-terminal-session-strip .global-language-button {
  min-height: 22px;
  padding: 0 7px;
}

body.cashier-terminal-mode .cashier-terminal-web-language-toggle {
  justify-self: end;
  min-height: 42px;
  min-width: 88px;
  padding: 3px;
  gap: 3px;
  white-space: nowrap;
  box-shadow: none;
}

body.cashier-terminal-mode .cashier-terminal-web-language-toggle .global-language-button {
  min-height: 34px;
  min-width: 34px;
  padding: 0 7px;
  font-size: 12px;
  line-height: 1;
}

body.cashier-terminal-mode .cashier-terminal-language-divider {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

body.cashier-terminal-mode [data-action="exit-pos"] {
  min-height: 42px;
  min-width: 116px;
  padding: 0 12px;
}

body.cashier-terminal-mode .cashier-terminal-fullscreen-button {
  min-height: 42px;
  min-width: 172px;
  padding: 0 12px;
  white-space: nowrap;
}

body.cashier-terminal-mode .cashier-terminal-fullscreen-button.is-active {
  background: #e0f2fe;
  color: #075985;
  border-color: rgba(14, 165, 233, 0.45);
}

body.cashier-terminal-mode .cashier-terminal-fullscreen-hint {
  border-color: rgba(245, 158, 11, 0.35);
  background: #fffbeb;
  color: #92400e;
}

body.cashier-terminal-mode .cashier-terminal-status {
  min-height: 34px;
  margin: 4px 12px;
  gap: 8px;
  font-size: 12px;
}

body.cashier-terminal-mode .cashier-terminal-status-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(96px, 1fr));
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  align-items: stretch;
}

body.cashier-terminal-mode .cashier-terminal-status-summary > span {
  display: grid;
  gap: 1px;
  min-width: 0;
  min-height: 30px;
  padding: 4px 7px;
  border: 1px solid #dbeafe;
  border-radius: 8px;
  background: #f8fafc;
  color: #1e3a8a;
  line-height: 1.05;
  overflow: hidden;
}

body.cashier-terminal-mode .cashier-terminal-status-summary b {
  color: #475569;
  font-size: 8px;
  line-height: 1;
}

body.cashier-terminal-mode .cashier-terminal-strip-actions {
  gap: 6px;
}

body.cashier-terminal-mode .cashier-terminal-strip-actions .secondary-inline {
  min-height: 34px;
  min-width: 0;
  padding: 0 10px;
}

body.cashier-terminal-mode .cashier-terminal-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(520px, 34vw, 580px);
  gap: 10px;
  height: calc(100vh - 132px);
  min-height: 0;
  margin: 0 12px;
  align-items: stretch;
  overflow: hidden;
}

body.cashier-terminal-mode .cashier-terminal-body > *,
body.cashier-terminal-mode .cashier-terminal-main,
body.cashier-terminal-mode .cashier-terminal-side,
body.cashier-terminal-mode .payment-column {
  min-height: 0;
  min-width: 0;
}

body.cashier-terminal-mode .payment-column {
  width: clamp(520px, 34vw, 580px);
  min-width: 520px;
  max-width: 580px;
}

body.cashier-terminal-mode .cashier-terminal-card,
body.cashier-terminal-mode .cashier-terminal-scan-card,
body.cashier-terminal-mode .cashier-terminal-cart-card,
body.cashier-terminal-mode .cashier-terminal-payment-panel {
  height: 100%;
  min-height: 0;
  padding: 12px;
  border-radius: 12px;
  overflow: auto;
}

body.cashier-terminal-mode .cashier-terminal-card-head {
  margin-bottom: 8px;
}

body.cashier-terminal-mode .cashier-terminal-main-column {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  min-height: 0;
}

body.cashier-terminal-mode .cashier-terminal-main-column .cashier-terminal-scan-card {
  height: auto;
  overflow: visible;
}

body.cashier-terminal-mode .cashier-terminal-main-column .cashier-terminal-cart-card {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

body.cashier-terminal-mode .cashier-terminal-main-column .cashier-terminal-cart {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}


body.cashier-terminal-mode .cashier-terminal-card-head h3 {
  font-size: 18px;
}

body.cashier-terminal-mode .cashier-terminal-scan-form {
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

body.cashier-terminal-mode .cashier-terminal-scan-form label:nth-of-type(2),
body.cashier-terminal-mode .cashier-terminal-note-field {
  display: none;
}

  body.cashier-terminal-mode .cashier-terminal-shell input,
  body.cashier-terminal-mode .cashier-terminal-shell select,
  body.cashier-terminal-mode .cashier-terminal-shell textarea {
    min-height: 34px;
  }

body.cashier-terminal-mode .cashier-terminal-scan-form .field-row input {
  flex: 1 1 auto;
}

body.cashier-terminal-mode .cashier-terminal-scan-form .cashier-manual-icon-button {
  flex: 0 0 42px;
  width: 42px;
  min-width: 42px;
  min-height: 42px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 18px;
}

body.cashier-terminal-mode .cashier-terminal-scan-form .scan-submit-button {
  flex: 0 0 120px;
  min-width: 120px;
}

body.cashier-terminal-mode #cashierTerminalBarcodeInput {
  min-height: 48px;
  font-size: 18px;
}

body.cashier-terminal-mode .cashier-terminal-lookup {
  margin-top: 8px;
  padding: 10px;
}

body.cashier-terminal-mode .cashier-terminal-cart {
  max-height: none;
  min-height: 0;
}

body.cashier-terminal-mode .basket-list {
  gap: 8px;
}

body.cashier-terminal-mode .basket-row {
  padding: 10px;
  gap: 8px;
}

body.cashier-terminal-mode .item-title {
  font-size: 15px;
}

body.cashier-terminal-mode .item-meta {
  margin-top: 5px;
  gap: 5px;
}

body.cashier-terminal-mode .meta-chip {
  padding: 4px 6px;
  font-size: 11px;
}

body.cashier-terminal-mode .cashier-terminal-edit-grid,
body.cashier-terminal-mode .basket-footer,
body.cashier-terminal-mode .summary-grid {
  gap: 6px;
}

body.cashier-terminal-mode .footer-stat,
body.cashier-terminal-mode .summary-box,
body.cashier-terminal-mode .drawer-card {
  padding: 9px;
}

body.cashier-terminal-mode .footer-stat strong,
body.cashier-terminal-mode .summary-box strong {
  font-size: 17px;
}

body.cashier-terminal-mode .cashier-terminal-grand-total {
  margin-bottom: 8px;
  padding: 10px;
}

body.cashier-terminal-mode .cashier-terminal-grand-total strong {
  font-size: clamp(30px, 3vw, 36px);
}

body.cashier-terminal-mode .payment-methods {
  gap: 6px;
}

body.cashier-terminal-mode .method-btn {
  min-height: 44px;
  padding: 8px 9px;
}

body.cashier-terminal-mode .payment-body {
  margin-top: 8px;
}

body.cashier-terminal-mode .payment-actions {
  margin-top: 8px;
  gap: 6px;
}

body.cashier-terminal-mode .primary-action {
  min-height: 48px;
  font-size: 16px;
}

body.cashier-terminal-mode .cashier-terminal-no-shift {
  padding: 10px;
}

body.cashier-terminal-mode .cashier-terminal-quick-actions,
body.cashier-terminal-mode .cashier-terminal-receipt-panel {
  display: none !important;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

body.cashier-terminal-mode .cashier-terminal-status-metrics > span,
body.cashier-terminal-mode .cashier-terminal-status-metrics > button,
body.cashier-terminal-mode .cashier-terminal-status-metrics span {
  min-height: 34px;
  padding: 5px 7px;
  font-size: 12px;
}

body.cashier-terminal-mode .cashier-terminal-receipt-panel {
  max-height: 36vh;
  margin: 0 12px;
  overflow: auto;
}

@media (min-width: 1121px) and (max-width: 1320px) {
  body.cashier-terminal-mode .topbar {
    max-height: 78px;
  }

  body.cashier-terminal-mode .cashier-terminal-session-strip {
    max-height: 58px;
  }

  body.cashier-terminal-mode .cashier-terminal-body {
    grid-template-columns: minmax(0, 1fr) 500px;
  }

  body.cashier-terminal-mode .payment-column {
    grid-column: auto;
    position: static;
  }
}

@media (max-height: 780px) {
  body.cashier-terminal-mode .cashier-terminal-shell {
    gap: 4px;
  }

  body.cashier-terminal-mode .topbar {
    min-height: 58px;
    max-height: 70px;
    padding: 6px 10px;
  }

  body.cashier-terminal-mode .cashier-terminal-status {
    min-height: 28px;
    margin: 3px 10px;
  }

  body.cashier-terminal-mode .cashier-terminal-body {
    height: calc(100vh - 154px);
    height: calc(100dvh - 144px);
    gap: 8px;
    margin: 0 10px;
  }

  body.cashier-terminal-mode .cashier-terminal-card,
  body.cashier-terminal-mode .cashier-terminal-scan-card,
  body.cashier-terminal-mode .cashier-terminal-cart-card,
  body.cashier-terminal-mode .cashier-terminal-payment-panel {
    padding: 10px;
    overflow: auto;
  }

  body.cashier-terminal-mode .cashier-terminal-card-head {
    margin-bottom: 6px;
  }

  body.cashier-terminal-mode .cashier-terminal-scan-form {
    gap: 6px;
  }

  body.cashier-terminal-mode #cashierTerminalBarcodeInput {
    min-height: 44px;
    font-size: 17px;
  }

  body.cashier-terminal-mode .lookup-preview,
  body.cashier-terminal-mode .cashier-terminal-scan-hint {
    line-height: 1.35;
  }

  body.cashier-terminal-mode .cashier-recent-scans {
    display: none;
  }

  body.cashier-terminal-mode .basket-row {
    padding: 8px;
  }

  body.cashier-terminal-mode .cashier-no-shift-card {
    gap: 3px;
    margin: 4px 0 6px;
    padding: 8px 10px;
  }

  body.cashier-terminal-mode .cashier-no-shift-card strong {
    font-size: 15px;
  }

  body.cashier-terminal-mode .cashier-no-shift-card .primary-inline {
    min-height: 34px;
    margin-top: 2px;
  }

  body.cashier-terminal-mode .cashier-terminal-grand-total {
    margin-bottom: 5px;
    padding: 7px 9px;
  }

  body.cashier-terminal-mode .cashier-terminal-grand-total strong {
    font-size: 28px;
  }

  body.cashier-terminal-mode .summary-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-top: 6px;
  }

  body.cashier-terminal-mode .summary-box {
    padding: 6px;
  }

  body.cashier-terminal-mode .summary-box span {
    font-size: 11px;
  }

  body.cashier-terminal-mode .summary-box strong {
    font-size: 15px;
  }

  body.cashier-terminal-mode .method-btn {
    min-height: 36px;
    padding: 6px 8px;
  }

  body.cashier-terminal-mode .payment-body,
  body.cashier-terminal-mode .payment-actions {
    margin-top: 5px;
  }

  body.cashier-terminal-mode .primary-action {
    min-height: 38px;
  }

  body.cashier-terminal-mode .cashier-terminal-transaction-strip {
    max-height: none;
    min-height: 44px;
    padding: 5px 8px;
  }

  body.cashier-terminal-mode .cashier-terminal-quick-actions {
    display: none;
  }
}


body.cashier-terminal-mode .cashier-terminal-receipt-panel[hidden] {
  display: none !important;
}

body.cashier-terminal-mode #cashierTerminalShell[hidden],
body.cashier-terminal-mode #cashierLandingPage[hidden],
body.cashier-terminal-mode #cashierOpenShiftPage[hidden] {
  display: none !important;
}

.cashier-open-shift-page {
  margin: 12px 0;
}

.cashier-open-shift-card {
  border: 1px solid #dbe3f1;
  border-radius: 12px;
  background: #fff;
  padding: 16px;
  display: grid;
  gap: 12px;
}

.cashier-open-shift-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 8px 12px;
}

body.cashier-terminal-mode .cashier-terminal-transaction-strip {
  min-height: 52px;
  overflow: visible;
}

body.cashier-terminal-mode .cashier-cart-header {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8fafc;
  padding: 8px 6px;
  border-radius: 10px;
}
body.cashier-terminal-mode .cashier-cart-row > div,
body.cashier-terminal-mode .cashier-cart-header > span {
  font-size: 11px;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) {
  display: block;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  max-height: 320px;
  padding: 0;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-header,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row {
  display: grid;
  grid-template-columns: minmax(132px, 2fr) minmax(104px, 1.08fr) minmax(64px, 0.75fr) minmax(82px, 0.92fr) minmax(58px, 0.72fr) minmax(40px, 0.5fr) minmax(54px, 0.62fr) minmax(66px, 0.75fr) 34px;
  gap: 4px;
  align-items: center;
  margin: 0;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-header {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 32px;
  padding: 0 6px;
  border-radius: 0;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .basket-row,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-terminal-cart-row,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .basket-item,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-terminal-cart-card {
  min-height: 60px;
  height: 60px;
  max-height: 64px;
  padding: 0 6px;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: none;
  flex: 0 0 auto;
  align-self: auto;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row > *,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-header > * {
  min-width: 0;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row .cart-code {
  display: grid;
  gap: 1px;
  align-content: center;
}

body.cashier-terminal-mode .cashier-cart-distribution-cell {
  display: grid;
  gap: 2px;
  align-content: center;
  min-width: 0;
}

body.cashier-terminal-mode .cashier-cart-distribution-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  color: #0f172a;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.1;
}

body.cashier-terminal-mode .cashier-cart-distribution-toggle input {
  width: 14px;
  height: 14px;
  margin: 0;
  accent-color: #16a34a;
}

body.cashier-terminal-mode .cashier-cart-distribution-chip {
  display: grid;
  gap: 1px;
  min-width: 0;
  padding: 2px 4px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f8fafc;
  color: #475569;
  text-align: left;
  line-height: 1.1;
}

body.cashier-terminal-mode .cashier-cart-distribution-chip:disabled {
  cursor: default;
  opacity: 0.72;
}

body.cashier-terminal-mode .cashier-cart-distribution-chip strong,
body.cashier-terminal-mode .cashier-cart-distribution-chip small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cashier-terminal-mode .cashier-cart-distribution-chip strong {
  font-size: 10px;
}

body.cashier-terminal-mode .cashier-cart-distribution-chip small {
  font-size: 9px;
  font-weight: 700;
}

body.cashier-terminal-mode .cashier-cart-distribution-cell.status-available .cashier-cart-distribution-chip {
  border-color: #86efac;
  background: #f0fdf4;
  color: #166534;
}

body.cashier-terminal-mode .cashier-cart-distribution-cell.status-sold .cashier-cart-distribution-chip,
body.cashier-terminal-mode .cashier-cart-distribution-cell.status-error .cashier-cart-distribution-chip {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
}

body.cashier-terminal-mode .cashier-cart-distribution-cell.status-verifying .cashier-cart-distribution-chip {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}

body.cashier-terminal-mode .cashier-cart-distribution-drawer .field input {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0;
}

body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row .cart-code strong,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row .cart-code small,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row .cart-code span,
body.cashier-terminal-mode .cashier-terminal-cart:not(.empty-state) .cashier-cart-row .cart-cell-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Bale print modal UI follow-up */
.bale-print-modal-card{width:min(1360px,92vw);max-height:90vh;border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 8px 22px rgba(15,23,42,.08);padding:0 24px 20px;background:#fff}
.bale-print-modal-head{padding:20px 0 14px}.bale-print-modal-head h3{font-size:28px;font-weight:700;color:#0f172a}
#closeBalePrintModalButton.bale-print-close-button{width:36px;height:36px;color:#334155}.bale-print-top-settings{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:12px;align-items:end}
.bale-print-top-settings .field-stack span{font-size:13px;font-weight:600;color:#334155}.bale-print-top-settings select{height:44px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;font-size:15px;color:#0f172a}
.bale-print-top-actions{display:grid;grid-template-columns:180px 220px;gap:12px;justify-content:end}
.bale-print-check-button,.bale-print-download-button{height:44px;border-radius:8px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center}
.bale-print-check-button{border:1px solid #bfdbfe;background:#eff6ff;color:#2563eb}.bale-print-download-button{background:#2563eb;color:#fff;border:1px solid #2563eb}
.bale-print-status-bar{margin-top:12px;border:1px solid #e2e8f0;border-radius:10px;padding:16px 20px;background:#f8fafc}
.bale-print-modal-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.92fr);gap:16px}
.bale-print-modal-preview-card,.bale-print-batch-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:16px}
.bale-print-modal-preview{height:400px;max-height:420px;background:#f8fafc;display:flex;align-items:center;justify-content:center}
.bale-print-modal-preview iframe{width:100%;height:100%;transform:scale(.92);transform-origin:center}
.bale-print-primary-actions{gap:12px}.bale-print-primary-button{min-height:52px;font-size:17px}.bale-print-reprint-button{min-height:48px;background:#fff7ed;border:1px solid #fdba74;color:#c2410c}.bale-print-complete-button{min-height:50px;background:#f0fdf4;border:1px solid #86efac;color:#15803d}.bale-print-back-button{min-height:48px}
.bale-print-diagnostics-pre{font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#fff;border:1px solid #e2e8f0;border-radius:6px;padding:12px}
.bale-print-advanced{margin-top:16px;background:#f8fafc}.bale-print-advanced summary{padding:12px 14px;font-size:14px;color:#475569}
@media (max-width:900px){.bale-print-top-settings{grid-template-columns:1fr}.bale-print-top-actions{grid-template-columns:1fr 1fr}.bale-print-modal-layout{grid-template-columns:1fr}}

/* RAW_BALE print modal queue + status compaction follow-up */
.bale-print-status-bar{padding:10px 12px}
.bale-print-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.bale-print-status-item{display:grid;gap:2px;padding:8px 10px;border:1px solid #e2e8f0;border-radius:8px;background:#fff}
.bale-print-status-item strong{font-size:12px;color:#334155}
.bale-print-status-item .subtle.small{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#balePrintModalQueueList{padding:10px;max-height:250px;overflow:auto}
#balePrintModalQueueList .candidate-row{padding:8px 10px;min-height:auto}
#balePrintModalQueueList strong{font-size:13px;line-height:1.2}
#balePrintModalQueueList .subtle.small{font-size:12px;line-height:1.25}
@media (max-width:900px){.bale-print-status-grid{grid-template-columns:1fr}}

/* Bale print modal UI consolidation follow-up */
#balePrintModal .bale-print-modal-card {
  width: min(1500px, calc(100vw - 32px));
  max-height: 92vh;
  overflow: auto;
  border-radius: 16px;
  padding: 24px 28px 22px;
  background: #ffffff;
}

#balePrintModal .bale-print-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 18px;
}

#balePrintModal .bale-print-modal-head h3 {
  margin: 0;
  font-size: clamp(28px, 2.1vw, 32px);
  line-height: 1.12;
  font-weight: 700;
  color: #0f172a;
}

#closeBalePrintModalButton.bale-print-close-button {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 999px;
}

.bale-print-top-workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 18px;
}

#balePrintModal .bale-print-status-bar {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

#balePrintModal .bale-print-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 14px;
  height: 100%;
}

#balePrintModal .bale-print-status-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  padding: 14px 16px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #ffffff;
}

.bale-print-status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #eff6ff;
  color: #2563eb;
  font-size: 19px;
  font-weight: 700;
}

.bale-print-status-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

#balePrintModal .bale-print-status-item strong {
  font-size: 15px;
  color: #0f172a;
}

#balePrintModal .bale-print-status-item .subtle.small {
  font-size: 14px;
  line-height: 1.25;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#balePrintModal .status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 56px;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #475569;
}

#balePrintModal .status-badge.success { border-color: #86efac; background: #dcfce7; color: #15803d; }
#balePrintModal .status-badge.warning { border-color: #fed7aa; background: #fffbeb; color: #b45309; }
#balePrintModal .status-badge.danger { border-color: #fecaca; background: #fef2f2; color: #b91c1c; }
#balePrintModal .status-badge.neutral { border-color: #e2e8f0; background: #f8fafc; color: #64748b; }

#balePrintModal .bale-print-top-actions {
  display: grid;
  grid-template-columns: 132px 168px;
  gap: 12px;
  align-content: center;
  justify-content: end;
}

#balePrintModal .bale-print-check-button,
#balePrintModal .bale-print-download-button {
  height: 46px;
  min-height: 46px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #ffffff;
  color: #2563eb;
  font-weight: 700;
  white-space: nowrap;
}

#balePrintModal .bale-print-download-button {
  background: #eff6ff;
}

#balePrintModal .bale-print-modal-layout {
  display: grid;
  grid-template-columns: minmax(0, 45fr) minmax(420px, 55fr);
  gap: 18px;
  align-items: start;
  min-height: 0;
}

#balePrintModal .bale-print-modal-preview-card,
#balePrintModal .bale-print-settings-card,
#balePrintModal .bale-print-batch-card {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #ffffff;
  padding: 16px;
}

#balePrintModal .bale-print-modal-preview-card {
  display: grid;
  grid-template-rows: auto minmax(360px, 1fr) auto;
  gap: 12px;
  max-height: 640px;
}

#balePrintModal .bale-print-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 0;
  padding: 0;
}

#balePrintModal .bale-print-preview-head strong,
.bale-print-queue-title {
  font-size: 17px;
  font-weight: 700;
  color: #0f172a;
}

#balePrintModal .bale-print-modal-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(360px, 46vh, 540px);
  min-height: 360px;
  max-height: 540px;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
  overflow: hidden;
}

#balePrintModal .bale-print-modal-preview iframe {
  width: 78%;
  height: 78%;
  min-height: 0;
  border: 0;
  border-radius: 8px;
  background: #ffffff;
  transform: none;
}

.bale-print-preview-pager {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #334155;
  font-weight: 700;
}

.bale-print-preview-pager .mini-button {
  width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border-radius: 999px;
}

#balePrintModal .bale-print-modal-side {
  display: grid;
  gap: 14px;
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

#balePrintModal .bale-print-setting-grid,
#balePrintModal .bale-modal-inline-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

#balePrintModal .field-stack.compact-select select,
#balePrintModal .field-stack.compact-select .meta-pill {
  min-height: 46px;
}

#balePrintModalQueueList {
  padding: 14px;
  max-height: none;
  overflow: hidden;
}

.bale-print-queue-scroll {
  display: grid;
  gap: 8px;
  height: 284px;
  margin-top: 12px;
  overflow-y: auto;
  padding-right: 4px;
}

#balePrintModalQueueList .bale-print-queue-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #ffffff;
  color: #334155;
  text-align: left;
  cursor: pointer;
}

#balePrintModalQueueList .bale-print-queue-row strong,
#balePrintModalQueueList .bale-print-queue-row span {
  font-size: 14px;
  line-height: 1.2;
}

#balePrintModalQueueList .bale-print-queue-row.selected-bale-row {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #2563eb;
}

#balePrintModal .bale-print-primary-actions {
  display: grid;
  gap: 12px;
  padding: 0;
  position: static;
  background: transparent;
}

#balePrintModal .bale-print-primary-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

#balePrintModal .bale-print-primary-button,
#balePrintModal .bale-print-reprint-button,
#balePrintModal .bale-print-complete-button,
#balePrintModal .bale-print-back-button {
  width: 100%;
  justify-content: center;
  border-radius: 12px;
}

#balePrintModal .bale-print-primary-button {
  min-height: 56px;
  font-size: 18px;
  font-weight: 700;
  border-radius: 12px;
}

#balePrintModal .bale-print-reprint-button {
  min-height: 54px;
  border: 1px solid #fdba74;
  background: #fff7ed;
  color: #c2410c;
  font-size: 17px;
  font-weight: 700;
}

#balePrintModal .bale-print-complete-button {
  min-height: 54px;
  border: 1px solid #86efac;
  background: #f0fdf4;
  color: #15803d;
  font-size: 17px;
  font-weight: 700;
}

#balePrintModal .bale-print-back-button {
  justify-self: end;
  width: auto;
  min-width: 96px;
  min-height: 38px;
  padding: 0 18px;
}

.bale-print-inline-alert {
  grid-column: 1 / -1;
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #f8fafc;
  color: #334155;
  font-size: 13px;
  font-weight: 600;
}

.bale-print-inline-alert.error { background: #fef2f2; color: #b91c1c; }
.bale-print-inline-alert.success { background: #f0fdf4; color: #15803d; }
.bale-print-inline-alert.warning { background: #fffbeb; color: #b45309; }

@media (max-width: 980px) {
  #balePrintModal .bale-print-primary-row {
    grid-template-columns: 1fr;
  }

  #balePrintModal .bale-print-modal-card {
    width: min(1000px, calc(100vw - 16px));
    padding: 20px;
  }

  .bale-print-top-workbench,
  #balePrintModal .bale-print-modal-layout,
  #balePrintModal .bale-print-setting-grid,
  #balePrintModal .bale-modal-inline-grid {
    grid-template-columns: 1fr;
  }

  #balePrintModal .bale-print-status-grid,
  #balePrintModal .bale-print-top-actions {
    grid-template-columns: 1fr;
  }

  #balePrintModal .bale-print-check-button,
  #balePrintModal .bale-print-download-button {
    width: 100%;
  }

  #balePrintModal .bale-print-modal-preview-card {
    max-height: none;
  }

  #balePrintModal .bale-print-modal-preview iframe {
    width: 86%;
    height: 76%;
  }
}

.operations-sales-panel-head h3 { margin: 0; font-size: 20px; }
.operations-sales-panel-head p { margin: 6px 0 12px; color: #51607a; }
.operations-sales-query-panel { border: 1px solid #dbe3f1; border-radius: 14px; background: #f8fbff; padding: 12px; }
.operations-sales-query-title { display:flex; flex-direction:column; gap:4px; margin-bottom:10px; }
.operations-sales-query-title span { font-size: 12px; color:#657590; }
.operations-sales-query-grid { display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)); gap:8px; }
.operations-sales-query-actions { display:flex; gap:8px; margin-top:10px; }
.operations-kpi-grid { margin-top: 10px; }
.operations-kpi-card { background:#fff; border:1px solid #dce5f3; border-radius:14px; padding:12px; box-shadow:0 4px 14px rgba(23,42,79,.05); }
.operations-kpi-card small { color:#6a7993; }
.store-real-inventory-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}
.store-real-inventory-scroll-root {
  max-height: calc(100vh - 132px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.store-real-inventory-head > div {
  min-width: 0;
}
.store-real-inventory-view-switch {
  display: inline-flex;
  width: fit-content;
  flex: 0 0 auto;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid #cbd7ea;
  border-radius: 999px;
  background: #f7faff;
  box-shadow: 0 2px 6px rgba(16, 32, 57, .06);
}
.store-real-inventory-view-switch button {
  min-height: 30px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #1f4c8f;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  padding: 7px 14px;
  white-space: nowrap;
}
.store-real-inventory-view-switch button.is-active,
.store-real-inventory-view-switch button.active {
  background: #2563eb;
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(37, 99, 235, .24);
}
.store-real-inventory-bi-toolbar {
  margin-bottom: 12px;
}
.store-real-inventory-dev-mock {
  margin-top: 8px;
  border: 1px dashed #93c5fd;
  border-radius: 8px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 10px;
}
.store-real-inventory-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
  gap: 10px;
  margin: 10px 0 12px;
}
.store-real-inventory-summary-card {
  display: flex;
  min-height: 86px;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px;
  border: 1px solid #dce5f3;
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
  box-shadow: 0 3px 10px rgba(23, 42, 79, .05);
}
.store-real-inventory-summary-card strong {
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}
.store-real-inventory-summary-card span {
  color: #0f172a;
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
}
.store-real-inventory-summary-card small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.25;
}
.store-real-inventory-history-notice {
  margin: 10px 0;
}
.store-real-inventory-history-row {
  background: #fff8eb;
}
.store-real-inventory-row-note {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin-top: 6px;
  padding: 3px 8px;
  border: 1px solid #fed7aa;
  border-radius: 999px;
  background: #fffbeb;
  color: #92400e;
  font-size: 12px;
  font-weight: 800;
}
.store-real-inventory-visual-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 0 0 12px;
}
.store-real-inventory-visual-card {
  display: flex;
  min-height: 188px;
  flex-direction: column;
  gap: 12px;
  border: 1px solid #dce5f3;
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
  box-shadow: 0 3px 12px rgba(23, 42, 79, .05);
}
.store-real-inventory-visual-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
.store-real-inventory-visual-head h3 {
  margin: 0;
  color: #102039;
  font-size: 15px;
  line-height: 1.2;
}
.store-real-inventory-visual-head span {
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}
.store-real-inventory-star-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}
.store-real-inventory-star-order {
  display: inline-flex;
  gap: 2px;
  border: 1px solid #d6e2f0;
  border-radius: 999px;
  background: #f8fafc;
  padding: 2px;
}
.store-real-inventory-star-order button {
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #2563eb;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 9px;
}
.store-real-inventory-star-order button.is-active {
  background: #2563eb;
  color: #ffffff;
}
.store-real-inventory-star-empty-note {
  border: 1px dashed #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1e40af;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 10px;
}
.store-real-inventory-star-dual-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.store-real-inventory-star-panel {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.store-real-inventory-star-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.store-real-inventory-star-panel-head strong {
  color: #0f172a;
  font-size: 14px;
}
.store-real-inventory-star-panel-head span {
  color: #64748b;
  font-size: 11px;
  font-weight: 700;
}
.store-real-inventory-star-list {
  display: grid;
  gap: 8px;
}
.store-real-inventory-star-rack {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  color: #334155;
  cursor: pointer;
  padding: 9px;
  text-align: left;
}
.store-real-inventory-star-rack:hover {
  border-color: #93c5fd;
  box-shadow: 0 5px 14px rgba(37, 99, 235, .12);
  transform: translateY(-1px);
}
.store-real-inventory-star-rack.is-warning {
  border-color: #fed7aa;
}
.store-real-inventory-star-rack.is-success {
  border-color: #bbf7d0;
}
.store-real-inventory-star-rack.is-danger {
  border-color: #fecaca;
}
.store-real-inventory-star-rack.is-muted {
  border-color: #e2e8f0;
}
.store-real-inventory-star-rack.is-caution {
  border-color: #fde68a;
}
.store-real-inventory-star-rank {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 800;
}
.store-real-inventory-star-main {
  display: grid;
  min-width: 0;
  gap: 2px;
}
.store-real-inventory-star-main strong {
  color: #0f172a;
  font-size: 13px;
}
.store-real-inventory-star-main small,
.store-real-inventory-star-metric small {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.store-real-inventory-star-metric {
  display: grid;
  justify-items: end;
  gap: 2px;
}
.store-real-inventory-star-metric strong {
  color: #0f172a;
  font-size: 13px;
}
.store-real-inventory-category-health-table {
  min-width: 1120px;
}
.store-real-inventory-category-row td {
  border-bottom: 0;
}
.store-real-inventory-category-detail-row td {
  border-top: 0;
  padding-top: 0;
}
.store-real-inventory-category-health-table td:first-child strong,
.store-real-inventory-category-health-table td:first-child small {
  display: block;
}
.store-real-inventory-category-health-table td:first-child strong {
  color: #0f172a;
  font-size: 13px;
}
.store-real-inventory-category-health-table td:first-child small {
  margin-top: 3px;
  color: #64748b;
  font-size: 12px;
}
.store-real-inventory-category-detail {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fbfdff;
  padding: 0;
}
.store-real-inventory-category-detail summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #1d4ed8;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  list-style: none;
  padding: 9px 11px;
}
.store-real-inventory-category-detail summary::-webkit-details-marker {
  display: none;
}
.store-real-inventory-category-detail summary::before {
  content: "+";
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  font-weight: 900;
}
.store-real-inventory-category-detail[open] summary::before {
  content: "-";
}
.store-real-inventory-category-detail summary span {
  min-width: 0;
  flex: 1;
}
.store-real-inventory-category-detail summary em {
  color: #64748b;
  font-style: normal;
  font-weight: 600;
}
.store-real-inventory-main-category-row td {
  background: #ffffff;
}
.store-real-inventory-main-category-row td:first-child strong {
  font-size: 14px;
}
.store-real-inventory-subcategory-wrap {
  overflow-x: auto;
  border-top: 1px solid #e2e8f0;
  padding: 10px 11px 11px;
}
.store-real-inventory-subcategory-table {
  min-width: 960px;
  margin: 0;
}
.store-real-inventory-subcategory-table thead th {
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
}
.store-real-inventory-subcategory-table td {
  background: #ffffff;
  vertical-align: middle;
}
.store-real-inventory-subcategory-table td:first-child strong {
  display: block;
  color: #0f172a;
  font-size: 13px;
}
.store-real-inventory-category-detail-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(100px, 1fr));
  gap: 8px;
  border-top: 1px solid #e2e8f0;
  padding: 10px 11px 0;
}
.store-real-inventory-category-detail-grid span {
  display: grid;
  gap: 2px;
  border: 1px solid #edf2f7;
  border-radius: 8px;
  background: #ffffff;
  padding: 8px;
}
.store-real-inventory-category-detail-grid strong {
  color: #0f172a;
  font-size: 18px;
  line-height: 1;
}
.store-real-inventory-category-detail-grid small {
  color: #64748b;
  font-size: 11px;
}
.store-real-inventory-category-action-note {
  margin: 10px 11px;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  background: #eff6ff;
  color: #1e3a8a;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 10px;
}
.store-real-inventory-category-rack-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
  padding: 0 11px 11px;
}
.store-real-inventory-category-rack {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 8px;
  align-items: center;
  border: 1px solid #dbe4ee;
  border-radius: 8px;
  background: #ffffff;
  color: #334155;
  cursor: pointer;
  padding: 8px;
  text-align: left;
}
.store-real-inventory-category-rack:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}
.store-real-inventory-category-rack strong {
  color: #0f172a;
  font-size: 13px;
}
.store-real-inventory-category-rack small {
  color: #64748b;
  font-size: 11px;
}
.store-real-inventory-category-rack span {
  grid-row: span 2;
  color: #0f172a;
  font-size: 15px;
  font-weight: 800;
}
.store-real-inventory-category-rack .store-real-inventory-status-badge {
  grid-column: 1 / -1;
  width: fit-content;
}
.store-real-inventory-mini-bar {
  position: relative;
  min-width: 170px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  height: 24px;
}
.store-real-inventory-mini-bar + .store-real-inventory-mini-bar {
  margin-top: 5px;
}
.store-real-inventory-mini-bar span {
  display: block;
  min-width: 4px;
  height: 100%;
  border-radius: inherit;
}
.store-real-inventory-mini-bar.is-front span {
  background: #86efac;
}
.store-real-inventory-mini-bar.is-backroom span {
  background: #fcd34d;
}
.store-real-inventory-mini-bar.is-suggested span {
  background: #93c5fd;
}
.store-real-inventory-mini-bar em {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #0f172a;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  padding: 0 9px;
}
.store-real-inventory-suggested-number {
  display: inline-flex;
  min-width: 54px;
  align-items: center;
  justify-content: center;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  padding: 7px 10px;
}
.store-real-inventory-turnover-cell {
  display: grid;
  min-width: 190px;
  gap: 5px;
}
.store-real-inventory-turnover-meter {
  position: relative;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
  height: 28px;
}
.store-real-inventory-turnover-meter span {
  display: block;
  min-width: 4px;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #93c5fd 0%, #2563eb 100%);
}
.store-real-inventory-turnover-meter strong {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0f172a;
  font-size: 12px;
  font-weight: 800;
}
.store-real-inventory-turnover-cell small,
.store-real-inventory-history-turnover small {
  color: #64748b;
  font-size: 11px;
  line-height: 1.2;
}
.store-real-inventory-history-turnover {
  display: inline-grid;
  min-width: 88px;
  gap: 2px;
  justify-items: start;
}
.store-real-inventory-history-turnover strong {
  color: #0f172a;
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
}
.store-real-inventory-history-turnover.is-empty strong {
  color: #94a3b8;
}
.store-real-inventory-warning {
  display: grid;
  gap: 6px;
  margin: 10px 0 12px;
  border: 1px solid #fde68a;
  border-radius: 8px;
  background: #fffbeb;
  color: #92400e;
  padding: 10px 12px;
}
.store-real-inventory-warning strong {
  font-size: 13px;
}
.store-real-inventory-warning details {
  font-size: 12px;
}
.store-real-inventory-warning summary {
  cursor: pointer;
  font-weight: 700;
}
.store-real-inventory-warning details div {
  display: grid;
  gap: 3px;
  margin-top: 6px;
  color: #78350f;
}
.store-real-inventory-section {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border: 1px solid #dce5f3;
  border-radius: 8px;
  background: #ffffff;
  padding: 12px;
  box-shadow: 0 3px 12px rgba(23, 42, 79, .04);
}
.store-real-inventory-section-compact {
  max-width: 560px;
}
.store-real-inventory-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.store-real-inventory-section-head h3 {
  margin: 0;
  color: #102039;
  font-size: 17px;
}
.store-real-inventory-section-head p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 12px;
  line-height: 1.35;
}
.store-real-inventory-section-head span {
  color: #64748b;
  font-size: 12px;
  white-space: nowrap;
}
.store-real-inventory-table-wrap {
  overflow-x: auto;
}
.store-real-inventory-table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
}
.store-real-inventory-table-wide {
  min-width: 1280px;
}
.store-real-inventory-table th {
  background: #f1f5f9;
  color: #334155;
  font-size: 12px;
  letter-spacing: 0;
  white-space: nowrap;
}
.store-real-inventory-table td {
  color: #334155;
  font-size: 13px;
  vertical-align: middle;
}
.store-real-inventory-table tbody tr:hover {
  background: #f8fbff;
}
.store-real-inventory-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border: 1px solid #dbe4ee;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 9px;
  white-space: nowrap;
}
.store-real-inventory-status-badge.is-warning {
  border-color: #fed7aa;
  background: #fff7ed;
  color: #c2410c;
}
.store-real-inventory-status-badge.is-success {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #15803d;
}
.store-real-inventory-status-badge.is-danger {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}
.store-real-inventory-status-badge.is-muted {
  border-color: #e2e8f0;
  background: #f8fafc;
  color: #64748b;
}
.store-real-inventory-status-badge.is-caution {
  border-color: #fde68a;
  background: #fffbeb;
  color: #a16207;
}
@media (max-width: 760px) {
  .store-real-inventory-head {
    align-items: stretch;
    flex-direction: column;
  }

  .store-real-inventory-view-switch {
    align-self: flex-start;
  }

  .store-real-inventory-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .store-real-inventory-visual-grid {
    grid-template-columns: 1fr;
  }

  .store-real-inventory-visual-card {
    min-height: 0;
  }

  .store-real-inventory-star-card {
    grid-column: auto;
  }

  .store-real-inventory-star-dual-grid {
    grid-template-columns: 1fr;
  }

  .store-real-inventory-mini-bar,
  .store-real-inventory-turnover-cell {
    min-width: 140px;
  }

  .store-real-inventory-section {
    padding: 10px;
  }
}
.operations-store-summary { margin-top: 12px; }
.operations-store-summary-head h3 { margin: 0 0 4px; }
.operations-store-summary-table thead th { white-space: nowrap; }
.operations-sales-segmented { display:inline-flex; background:#eef3fb; border:1px solid #d4deee; border-radius:999px; padding:3px; gap:3px; margin:10px 0; }
.operations-segmented-tab { border:0; background:transparent; border-radius:999px; padding:6px 12px; font-weight:600; color:#5a6b87; cursor:pointer; }
.operations-segmented-tab.is-active { background:#1f3f77; color:#fff; box-shadow:0 2px 8px rgba(31,63,119,.3); }
.store-customer-analysis { display:block; }
.store-customer-hero h3 { font-size:24px; }
.store-customer-data-note { margin:8px 0 12px; }
.store-customer-mode-grid { display:grid; grid-template-columns:repeat(3,minmax(220px,1fr)); gap:10px; margin:12px 0; padding:12px; border:1px solid #dce5f3; border-radius:10px; background:#f8fbff; }
.store-customer-mode-card { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:5px; min-height:64px; border:1px solid #d7e1f0; border-radius:8px; background:#fff; padding:12px 38px 12px 14px; color:#31425e; cursor:pointer; text-align:left; box-shadow:none; }
.store-customer-mode-card::after { content:""; position:absolute; right:16px; top:50%; width:7px; height:7px; border-radius:999px; border:1px solid #102039; transform:translateY(-50%); background:#fff; }
.store-customer-mode-card span { font-size:13px; font-weight:800; color:#0f172a; }
.store-customer-mode-card strong { font-size:18px; color:#0f172a; line-height:1.1; }
.store-customer-mode-card small { font-size:12px; color:#5b6b86; }
.store-customer-mode-card.is-active { border-color:#2563eb; background:#2563eb; color:#fff; box-shadow:none; }
.store-customer-mode-card.is-active::after { border-color:#fff; background:#fff; }
.store-customer-mode-card.is-active span,
.store-customer-mode-card.is-active small { color:#fff; }
.store-customer-filter-panel { margin-top:12px; }
.store-customer-filter-grid { display:grid; grid-template-columns:repeat(7,minmax(120px,1fr)); gap:8px; align-items:end; }
.store-customer-filter-grid-compact { grid-template-columns:repeat(3,minmax(180px,1fr)); }
.store-customer-filter-grid label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:#5b6b86; }
.store-customer-filter-grid input,
.store-customer-filter-grid select { min-height:36px; border:1px solid #d4deee; border-radius:8px; padding:7px 9px; background:#fff; color:#102039; }
.store-customer-kpi-grid { display:grid; grid-template-columns:repeat(7,minmax(130px,1fr)); gap:10px; margin:12px 0; }
.store-customer-kpi-card { display:flex; flex-direction:column; gap:5px; border:1px solid #dce5f3; border-radius:8px; background:#fff; padding:12px; box-shadow:0 4px 14px rgba(23,42,79,.05); }
.store-customer-kpi-card strong { color:#31425e; font-size:12px; }
.store-customer-kpi-card span { color:#0f172a; font-size:23px; font-weight:800; line-height:1.1; }
.store-customer-kpi-card small { color:#667895; font-size:12px; }
.store-customer-main-grid { display:grid; grid-template-columns:1fr; gap:12px; }
.store-customer-chart-opinion-grid { display:grid; grid-template-columns:minmax(0,2.15fr) minmax(280px,.85fr); gap:12px; align-items:stretch; }
.store-customer-chart-card,
.store-customer-mix-card,
.store-customer-table-card,
.store-customer-opinion-box { border:1px solid #dce5f3; border-radius:8px; background:#fff; padding:14px; box-shadow:0 4px 14px rgba(23,42,79,.04); }
.store-customer-section-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:12px; }
.store-customer-section-head h3,
.store-customer-mix-card h3 { margin:0; color:#111827; font-size:18px; }
.store-customer-section-head p { margin:4px 0 0; color:#51607a; font-size:13px; }
.store-customer-section-head > strong { font-size:18px; color:#102039; white-space:nowrap; }
.store-customer-chart-legend { display:flex; flex-wrap:wrap; gap:12px; color:#465873; font-size:12px; margin-bottom:8px; }
.store-customer-chart-legend span { display:inline-flex; align-items:center; gap:6px; }
.store-customer-chart-legend i { width:11px; height:11px; border-radius:3px; display:inline-block; }
.legend-footfall { background:#cbd5e1; }
.legend-orders { background:#2563eb; }
.legend-conversion { background:#0f766e; }
.store-customer-traffic-svg { width:100%; height:auto; min-height:240px; display:block; }
.store-customer-axis { stroke:#cbd5e1; stroke-width:1; }
.store-customer-axis-label { fill:#465873; font-size:12px; }
.store-customer-footfall-bar { fill:#dbe4ee; }
.store-customer-order-bar { fill:#2563eb; }
.store-customer-conversion-line { stroke:#0f766e; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.store-customer-conversion-dot { fill:#0f766e; stroke:#fff; stroke-width:2; }
.store-customer-hour-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:6px; margin-top:10px; }
.store-customer-hour-list span { border:1px solid #e0e7f1; border-radius:7px; padding:7px 8px; color:#3f506c; background:#f8fbff; font-size:12px; }
.store-customer-mix-grid { display:grid; grid-template-columns:repeat(4,minmax(210px,1fr)); gap:12px; }
.store-customer-mix-card { display:flex; flex-direction:column; gap:10px; }
.store-customer-mix-row { display:grid; grid-template-columns:minmax(120px,1fr) minmax(90px,42%); gap:10px; align-items:center; }
.store-customer-mix-row strong { color:#263650; font-size:13px; }
.store-customer-mix-row small { display:block; color:#667895; font-size:11px; margin-top:2px; }
.store-customer-bar-track { height:10px; border-radius:999px; background:#eef3fb; overflow:hidden; }
.store-customer-bar-track span { display:block; height:100%; border-radius:999px; background:var(--bar-color,#2563eb); }
.store-customer-table-wrap { overflow:auto; }
.store-customer-table { width:100%; border-collapse:collapse; min-width:920px; }
.store-customer-table th { white-space:nowrap; color:#31425e; }
.store-customer-feedback-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; }
.store-customer-feedback-list article { border:1px solid #dce5f3; border-radius:8px; padding:10px; background:#f8fbff; }
.store-customer-feedback-list article div { display:flex; justify-content:space-between; gap:10px; color:#31425e; }
.store-customer-feedback-list article span,
.store-customer-feedback-list article small { color:#667895; font-size:12px; }
.store-customer-feedback-list article p { margin:8px 0; color:#102039; }
.store-customer-opinion-box { min-height:100%; display:flex; flex-direction:column; }
.store-customer-opinion-list { display:flex; flex-direction:column; gap:8px; max-height:520px; overflow:auto; padding-right:2px; }
.store-customer-opinion-item { border:1px solid #e0e7f1; border-radius:8px; padding:9px 10px; background:#f8fbff; }
.store-customer-opinion-item p { margin:0 0 6px; color:#102039; font-size:13px; line-height:1.35; }
.store-customer-opinion-item small { color:#667895; font-size:11px; line-height:1.35; }
@media (max-width: 1280px) {
  .store-customer-chart-opinion-grid { grid-template-columns:1fr; }
  .store-customer-filter-grid { grid-template-columns:repeat(4,minmax(130px,1fr)); }
  .store-customer-filter-grid-compact { grid-template-columns:repeat(3,minmax(160px,1fr)); }
  .store-customer-kpi-grid { grid-template-columns:repeat(4,minmax(150px,1fr)); }
  .store-customer-mix-grid { grid-template-columns:repeat(2,minmax(220px,1fr)); }
}
@media (max-width: 760px) {
  .store-customer-mode-grid,
  .store-customer-filter-grid,
  .store-customer-kpi-grid,
  .store-customer-mix-grid { grid-template-columns:1fr; }
  .store-customer-section-head { flex-direction:column; }
}

.gm-standard-sku-shell{display:grid;gap:14px}
.gm-standard-sku-header,.gm-standard-sku-step-body{display:grid;gap:8px}
.gm-standard-sku-title-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.gm-standard-sku-badge{padding:4px 10px;border-radius:999px;background:#eef3ff;color:#2f56d9;font-size:12px}
.gm-standard-sku-progress-track{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:0;list-style:none}
.gm-standard-sku-progress-item{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid #d7deef;border-radius:10px;background:#f6f8fc;font-size:12px}
.gm-standard-sku-progress-dot{width:20px;height:20px;display:grid;place-items:center;border-radius:999px;background:#d7deef;font-weight:700}
.gm-standard-sku-progress-item.is-active,.gm-standard-sku-progress-item.is-done{border-color:#4a67ff;background:#eef3ff}
.gm-standard-sku-progress-item.is-active .gm-standard-sku-progress-dot,.gm-standard-sku-progress-item.is-done .gm-standard-sku-progress-dot{background:#4a67ff;color:#fff}
.gm-standard-sku-notice{background:#eef5ff;border:1px solid #c5d7ff;border-radius:10px;padding:10px}
.gm-standard-sku-kpi-row{display:grid;grid-template-columns:minmax(260px,1fr) repeat(3,auto);gap:8px;align-items:center}
.gm-standard-sku-split{display:grid;grid-template-columns:1.2fr 2fr;gap:12px}
.gm-standard-sku-left-card,.gm-standard-sku-main-card,.gm-standard-sku-side-card{border:1px solid #dde3f0;border-radius:10px;padding:12px;background:#fff;display:grid;gap:8px}
.gm-standard-sku-side-card{background:#fff5f6;border-color:#f4c6cd}
.gm-standard-sku-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.gm-standard-sku-sku-card,.gm-standard-sku-carton-row{display:grid;grid-template-columns:72px 1fr auto;gap:10px;align-items:center;border:1px solid #dfe6f4;border-radius:10px;padding:10px;background:#fafcff}
.gm-standard-sku-image-card{width:72px;height:72px;border:1px dashed #b7c4de;border-radius:8px;display:grid;place-items:center;color:#6480b8;background:#f7faff}
.gm-standard-sku-select.is-selected{border-color:#4a67ff;background:#eef3ff;color:#2f56d9}
.gm-standard-sku-summary{background:#effaf2;border:1px solid #bee7c8;padding:8px;border-radius:8px}
.gm-standard-sku-amount{font-size:24px;font-weight:700;color:#ca2f2f}
.gm-standard-sku-label-preview{max-width:420px}
.gm-standard-sku-label-layout{background:#fff}
.gm-standard-sku-footer-actions{justify-content:flex-end}
.gm-standard-sku-history{display:grid;gap:12px}

.china-gm-bi-shell{display:grid;gap:14px}
.china-gm-bi-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:14px;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.china-gm-bi-title-row h3{margin:0;font-size:20px;line-height:1.25}
.china-gm-bi-title-row span,.china-gm-bi-status{display:inline-flex;align-items:center;min-height:26px;padding:4px 8px;border:1px solid #bfdbfe;border-radius:6px;background:#eff6ff;color:#1d4ed8;font-size:12px;font-weight:800}
.china-gm-bi-header p{margin:6px 0 0;color:#475569}
.china-gm-bi-toolbar{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.china-gm-bi-toolbar button,.china-gm-bi-tab-row button{min-height:34px;padding:6px 12px;border:1px solid var(--fw-border-strong);border-radius:6px;background:#fff;color:#334155;font-weight:800}
.china-gm-bi-toolbar button.is-active,.china-gm-bi-tab-row button.is-active{border-color:#2563eb;background:#2563eb;color:#fff}
.china-gm-bi-filter-row{display:grid;grid-template-columns:minmax(220px,1fr) minmax(190px,240px) minmax(150px,200px);gap:10px}
.china-gm-bi-filter-row input,.china-gm-bi-filter-row select{min-height:38px;border:1px solid var(--fw-border-strong);border-radius:6px;background:#fff;padding:7px 10px;color:#0f172a}
.china-gm-bi-command-center{display:grid;gap:12px;padding:12px;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-command-grid{display:grid;grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:12px;align-items:stretch}
.china-gm-bi-action-lanes{display:grid;gap:8px}
.china-gm-bi-action-lane{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:11px;border:1px solid var(--fw-border);border-left-width:5px;border-radius:8px;background:#f8fafc}
.china-gm-bi-action-lane.is-success{border-left-color:#16a34a;background:#f0fdf4}
.china-gm-bi-action-lane.is-info{border-left-color:#0284c7;background:#f0f9ff}
.china-gm-bi-action-lane.is-warning{border-left-color:#d97706;background:#fffbeb}
.china-gm-bi-action-lane.is-danger{border-left-color:#dc2626;background:#fef2f2}
.china-gm-bi-action-lane span{display:block;color:#64748b;font-size:11px;font-weight:900;text-transform:uppercase}
.china-gm-bi-action-lane strong{display:block;margin-top:2px;color:#0f172a;font-size:17px;line-height:1.2}
.china-gm-bi-action-lane p{margin:4px 0 0;color:#475569;font-size:12px;line-height:1.35}
.china-gm-bi-action-lane-metrics{text-align:right}
.china-gm-bi-action-lane-metrics b{display:block;color:#0f172a;font-size:20px;line-height:1.1}
.china-gm-bi-action-lane-metrics small{display:block;margin-top:5px;color:#475569;font-size:11px;line-height:1.3}
.china-gm-bi-action-lane-items{grid-column:1/-1;display:grid;gap:6px}
.china-gm-bi-action-lane-items button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:7px 8px;border:1px solid rgba(148,163,184,.45);border-radius:6px;background:#fff;color:#0f172a;text-align:left}
.china-gm-bi-action-lane-items span{color:#0f172a;font-size:12px;font-weight:800;text-transform:none}
.china-gm-bi-action-lane-items em{font-style:normal;color:#1d4ed8;font-size:12px;font-weight:900;white-space:nowrap}
.china-gm-bi-action-lane-items small{color:#64748b;font-size:12px}
.china-gm-bi-matrix-card{display:grid;gap:10px;min-width:0;padding:12px;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-matrix-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.china-gm-bi-matrix-head h4{margin:0;color:#0f172a;font-size:16px;line-height:1.25}
.china-gm-bi-matrix-head p{margin:3px 0 0;color:#475569;font-size:12px}
.china-gm-bi-matrix-head span{color:#64748b;font-size:12px;font-weight:800;text-align:right}
.china-gm-bi-matrix{position:relative;min-height:330px;border:1px solid #d8e1ec;border-radius:8px;background:linear-gradient(90deg,rgba(148,163,184,.26) 1px,transparent 1px),linear-gradient(180deg,rgba(148,163,184,.26) 1px,transparent 1px),#f8fafc;background-size:50% 100%,100% 50%,auto;overflow:hidden}
.china-gm-bi-matrix-quadrants{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;pointer-events:none}
.china-gm-bi-matrix-quadrants div{padding:12px;color:#334155}
.china-gm-bi-matrix-quadrants strong{display:block;font-size:13px}
.china-gm-bi-matrix-quadrants small{display:block;margin-top:3px;color:#64748b;font-size:11px}
.china-gm-bi-map-dot{position:absolute;z-index:2;display:grid;gap:2px;max-width:132px;padding:7px 9px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#0f172a;text-align:left;box-shadow:0 8px 18px rgba(15,23,42,.12);transform:translate(-50%,-50%)}
.china-gm-bi-map-dot span{font-size:12px;font-weight:900;line-height:1.15;white-space:nowrap}
.china-gm-bi-map-dot small{color:#475569;font-size:10px;font-weight:800;white-space:nowrap}
.china-gm-bi-map-dot.is-success{border-color:#86efac;background:#dcfce7}
.china-gm-bi-map-dot.is-info{border-color:#7dd3fc;background:#e0f2fe}
.china-gm-bi-map-dot.is-warning{border-color:#facc15;background:#fef3c7}
.china-gm-bi-map-dot.is-danger{border-color:#fca5a5;background:#fee2e2}
.china-gm-bi-map-dot.is-neutral{border-color:#cbd5e1;background:#fff}
.china-gm-bi-axis{position:absolute;z-index:1;color:#64748b;font-size:11px;font-weight:900;pointer-events:none}
.china-gm-bi-axis-y{left:8px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:left center}
.china-gm-bi-axis-x{right:12px;bottom:8px}
.china-gm-bi-funnel-panel{display:grid;gap:14px;padding:14px;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-funnel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.china-gm-bi-funnel-head h3{margin:0;color:#0f172a;font-size:18px;line-height:1.25}
.china-gm-bi-funnel-head p{margin:5px 0 0;color:#475569;font-size:13px}
.china-gm-bi-funnel-summary{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.china-gm-bi-funnel-summary span{display:inline-flex;align-items:center;min-height:28px;padding:4px 9px;border:1px solid #d8e1ec;border-radius:6px;background:#f8fafc;color:#334155;font-size:12px;font-weight:900}
.china-gm-bi-funnel-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);gap:14px;align-items:stretch}
.china-gm-bi-funnel-visual{display:grid;gap:8px;align-content:start}
.china-gm-bi-funnel-stage{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:center}
.china-gm-bi-funnel-stage-index{display:grid;place-items:center;width:28px;height:28px;border:1px solid #cbd5e1;border-radius:999px;background:#fff;color:#334155;font-size:12px;font-weight:900}
.china-gm-bi-funnel-stage-main{display:grid;gap:6px}
.china-gm-bi-funnel-stage-head,.china-gm-bi-funnel-stage-foot{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.china-gm-bi-funnel-stage-head span{color:#0f172a;font-size:13px;font-weight:900}
.china-gm-bi-funnel-stage-head strong{color:#0f172a;font-size:18px;line-height:1.1;text-align:right;white-space:nowrap}
.china-gm-bi-funnel-track{height:26px;border-radius:6px;background:#edf2f7;overflow:hidden}
.china-gm-bi-funnel-track div{height:100%;width:var(--funnel-width);border-radius:6px;background:#2563eb}
.china-gm-bi-funnel-stage.is-traffic .china-gm-bi-funnel-track div{background:#334155}
.china-gm-bi-funnel-stage.is-order .china-gm-bi-funnel-track div{background:#2563eb}
.china-gm-bi-funnel-stage.is-basket .china-gm-bi-funnel-track div{background:#16a34a}
.china-gm-bi-funnel-stage.is-aov .china-gm-bi-funnel-track div{background:#7c3aed}
.china-gm-bi-funnel-stage.is-channel .china-gm-bi-funnel-track div{background:#0f766e}
.china-gm-bi-funnel-stage.is-stock .china-gm-bi-funnel-track div{background:#334155}
.china-gm-bi-funnel-stage.is-store .china-gm-bi-funnel-track div{background:#0284c7}
.china-gm-bi-funnel-stage.is-sales .china-gm-bi-funnel-track div{background:#16a34a}
.china-gm-bi-funnel-stage.is-revenue .china-gm-bi-funnel-track div{background:#7c3aed}
.china-gm-bi-funnel-stage.is-profit .china-gm-bi-funnel-track div{background:#f59e0b}
.china-gm-bi-funnel-split{display:flex!important;padding:0!important;background:transparent!important;overflow:hidden}
.china-gm-bi-funnel-split span{display:grid;place-items:center;height:100%;min-width:42px;color:#fff;font-size:11px;font-weight:900}
.china-gm-bi-funnel-split span:first-child{background:#0f766e}
.china-gm-bi-funnel-split span:last-child{background:#f59e0b}
.china-gm-bi-funnel-split-labels{display:flex;gap:10px;flex-wrap:wrap;color:#64748b;font-size:11px;font-weight:800}
.china-gm-bi-funnel-stage-foot b{color:#1d4ed8;font-size:12px;font-weight:900;white-space:nowrap}
.china-gm-bi-funnel-stage-foot small{color:#64748b;font-size:12px;line-height:1.25;text-align:right}
.china-gm-bi-funnel-insight{display:grid;gap:9px;align-content:start;padding:12px;border:1px solid #d8e1ec;border-radius:8px;background:#f8fafc}
.china-gm-bi-funnel-insight h4{margin:0;color:#0f172a;font-size:15px}
.china-gm-bi-funnel-insight p{margin:0;color:#475569;font-size:12px;line-height:1.45}
.china-gm-bi-funnel-insight strong{color:#0f172a}
.china-gm-bi-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.china-gm-bi-kpi-card{display:grid;gap:4px;min-height:92px;padding:12px;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-kpi-card p,.china-gm-bi-kpi-card span{margin:0;color:#64748b;font-size:12px;font-weight:800}
.china-gm-bi-kpi-card strong{font-size:22px;line-height:1.2;color:#0f172a;word-break:break-word}
.china-gm-bi-kpi-card.is-success{border-color:#bbf7d0;background:#f0fdf4}
.china-gm-bi-kpi-card.is-info{border-color:#bae6fd;background:#f0f9ff}
.china-gm-bi-kpi-card.is-warning{border-color:#fde68a;background:#fffbeb}
.china-gm-bi-kpi-card.is-danger{border-color:#fecaca;background:#fef2f2}
.china-gm-bi-tab-row{display:flex;gap:8px;flex-wrap:wrap}
.china-gm-bi-main-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,400px);gap:12px;align-items:start}
.china-gm-bi-main-panel{min-width:0}
.china-gm-bi-overview-grid,.china-gm-bi-inventory-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.china-gm-bi-overview-grid .china-gm-bi-section:first-child,.china-gm-bi-inventory-grid .china-gm-bi-section:first-child{grid-column:1/-1}
.china-gm-bi-section,.china-gm-bi-detail-panel{display:grid;gap:12px;padding:12px;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-section-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.china-gm-bi-section-head h3{margin:0;font-size:16px;line-height:1.25}
.china-gm-bi-section-head span{color:#64748b;font-size:12px;font-weight:800}
.china-gm-bi-category-bars{display:grid;gap:10px}
.china-gm-bi-category-row{display:grid;grid-template-columns:minmax(120px,180px) minmax(120px,1fr) minmax(130px,auto);gap:10px;align-items:center}
.china-gm-bi-category-row span,.china-gm-bi-category-row strong{font-size:13px;color:#334155}
.china-gm-bi-category-row small{display:block;color:#64748b;font-size:11px;font-weight:800}
.china-gm-bi-category-row div{height:10px;border-radius:999px;background:#e2e8f0;overflow:hidden}
.china-gm-bi-category-row i{display:block;height:100%;border-radius:999px;background:#2563eb}
.china-gm-bi-ranking-list,.china-gm-bi-trend-list,.china-gm-bi-suggestion-list{display:grid;gap:8px}
.china-gm-bi-ranking-list button,.china-gm-bi-trend-list button,.china-gm-bi-suggestion-list button{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;padding:8px;border:1px solid var(--fw-border);border-radius:8px;background:#fff;text-align:left;color:#0f172a}
.china-gm-bi-trend-list button{grid-template-columns:minmax(120px,180px) minmax(120px,1fr)}
.china-gm-bi-ranking-list strong,.china-gm-bi-suggestion-list strong{display:block;color:#0f172a}
.china-gm-bi-ranking-list small,.china-gm-bi-suggestion-list small,.china-gm-bi-product-cell small{display:block;color:#64748b;font-size:12px;line-height:1.25}
.china-gm-bi-ranking-list em,.china-gm-bi-suggestion-list em{font-style:normal;color:#1d4ed8;font-weight:900;white-space:nowrap}
.china-gm-bi-ranking-list em small,.china-gm-bi-suggestion-list em small{display:block;color:#64748b;font-size:11px;font-weight:800;text-align:right}
.china-gm-bi-mini-bars{height:46px;display:flex;align-items:end;gap:5px}
.china-gm-bi-mini-bars span{width:100%;min-width:12px;border-radius:4px 4px 0 0;background:#0f766e}
.china-gm-bi-table-scroll{overflow-x:auto;border:1px solid var(--fw-border);border-radius:8px;background:#fff}
.china-gm-bi-table{width:100%;min-width:1320px;border-collapse:collapse}
.china-gm-bi-table th,.china-gm-bi-table td{padding:10px;border-bottom:1px solid var(--fw-border);text-align:left;vertical-align:middle;color:#334155;font-size:13px}
.china-gm-bi-table th{background:#f1f5f9;color:#475569;font-size:12px;font-weight:900;white-space:nowrap}
.china-gm-bi-table tbody tr{cursor:pointer}
.china-gm-bi-table tbody tr:hover,.china-gm-bi-table tbody tr.is-selected{background:#eff6ff}
.china-gm-bi-product-cell{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;width:100%;padding:0;border:0;background:transparent;text-align:left;color:#0f172a}
.china-gm-bi-product-cell strong{display:block;color:#0f172a;word-break:break-word}
.china-gm-bi-product-thumb{display:grid;place-items:center;flex:none;border:1px solid var(--fw-border-strong);border-radius:8px;color:#fff;font-weight:900;text-align:center;overflow:hidden}
.china-gm-bi-product-thumb-small{width:48px;height:48px;font-size:11px}
.china-gm-bi-product-thumb-large{width:86px;height:86px;font-size:14px}
.china-gm-bi-product-thumb span{display:block;max-width:100%;padding:4px;line-height:1.1;word-break:break-word}
.china-gm-bi-product-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.china-gm-bi-product-thumb-real{background:#fff;color:var(--fw-text)}
.china-gm-bi-product-thumb-blue{background:linear-gradient(135deg,#1d4ed8,#38bdf8)}
.china-gm-bi-product-thumb-green{background:linear-gradient(135deg,#15803d,#86efac)}
.china-gm-bi-product-thumb-amber{background:linear-gradient(135deg,#b45309,#fde68a);color:#78350f}
.china-gm-bi-product-thumb-slate{background:linear-gradient(135deg,#334155,#cbd5e1)}
.china-gm-bi-product-thumb-red{background:linear-gradient(135deg,#b91c1c,#fecaca)}
.china-gm-bi-product-thumb-violet{background:linear-gradient(135deg,#6d28d9,#c4b5fd)}
.china-gm-bi-detail-panel{position:sticky;top:12px}
.china-gm-bi-detail-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center}
.china-gm-bi-detail-head h3{margin:0;font-size:18px;line-height:1.25}
.china-gm-bi-detail-head p{margin:4px 0 0;color:#475569}
.china-gm-bi-label{margin:0!important;color:#64748b!important;font-size:12px;font-weight:900}
.china-gm-bi-decision-card{display:grid;gap:4px;padding:12px;border:1px solid var(--fw-border);border-radius:8px;background:#f8fafc}
.china-gm-bi-decision-card.is-success{border-color:#86efac;background:#f0fdf4}
.china-gm-bi-decision-card.is-info{border-color:#bae6fd;background:#f0f9ff}
.china-gm-bi-decision-card.is-warning{border-color:#fde68a;background:#fffbeb}
.china-gm-bi-decision-card.is-danger{border-color:#fecaca;background:#fef2f2}
.china-gm-bi-decision-card.is-neutral{border-color:#cbd5e1;background:#f8fafc}
.china-gm-bi-decision-card span{color:#64748b;font-size:12px;font-weight:900}
.china-gm-bi-decision-card strong{color:#0f172a;font-size:24px;line-height:1.2}
.china-gm-bi-decision-card small{color:#475569;font-size:12px;line-height:1.35}
.china-gm-bi-detail-grid,.china-gm-bi-detail-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.china-gm-bi-detail-grid div,.china-gm-bi-detail-metrics div,.china-gm-bi-stock-split div{display:grid;gap:3px;min-height:62px;padding:9px;border:1px solid var(--fw-border);border-radius:8px;background:#f8fafc}
.china-gm-bi-detail-grid span,.china-gm-bi-detail-metrics span,.china-gm-bi-stock-split span{color:#64748b;font-size:12px;font-weight:900}
.china-gm-bi-detail-grid strong,.china-gm-bi-detail-metrics strong,.china-gm-bi-stock-split strong{color:#0f172a;line-height:1.25;word-break:break-word}
.china-gm-bi-detail-grid small,.china-gm-bi-detail-metrics small{color:#64748b}
.china-gm-bi-stock-split{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.china-gm-bi-detail-note{padding:10px;border:1px solid #bfdbfe;border-radius:8px;background:#eff6ff;color:#1e3a8a;font-weight:700;line-height:1.5}
.china-gm-bi-margin-badge,.china-gm-bi-action-badge{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border:1px solid #cbd5e1;border-radius:6px;background:#f8fafc;color:#334155;font-size:12px;font-weight:900;white-space:nowrap}
.china-gm-bi-margin-badge.is-success,.china-gm-bi-action-badge.is-success{border-color:#86efac;background:#dcfce7;color:#166534}
.china-gm-bi-margin-badge.is-info,.china-gm-bi-action-badge.is-info{border-color:#bae6fd;background:#e0f2fe;color:#075985}
.china-gm-bi-margin-badge.is-warning,.china-gm-bi-action-badge.is-warning{border-color:#fde68a;background:#fef3c7;color:#92400e}
.china-gm-bi-margin-badge.is-danger,.china-gm-bi-action-badge.is-danger{border-color:#fecaca;background:#fee2e2;color:#991b1b}
.china-gm-bi-margin-badge.is-neutral,.china-gm-bi-action-badge.is-neutral{border-color:#cbd5e1;background:#f8fafc;color:#334155}
.china-gm-bi-table td small{display:block;margin-top:4px;color:#64748b;font-size:11px;line-height:1.25}
.kenya-company-bi-filter-row{grid-template-columns:minmax(260px,1fr) minmax(190px,240px) minmax(190px,240px)}
.kenya-company-bi-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,380px);gap:12px;align-items:start}
.kenya-company-bi-main{display:grid;gap:12px;min-width:0}
.kenya-company-bi-wide{min-width:0}
.kenya-company-bi-store-bars{display:grid;gap:8px}
.kenya-company-bi-store-bars button{display:grid;grid-template-columns:minmax(140px,200px) minmax(180px,1fr) minmax(190px,auto);gap:12px;align-items:center;width:100%;padding:10px;border:1px solid var(--fw-border);border-radius:8px;background:#fff;color:#0f172a;text-align:left}
.kenya-company-bi-store-bars button:hover,.kenya-company-bi-store-bars button.is-selected{border-color:#93c5fd;background:#eff6ff}
.kenya-company-bi-store-bars span strong{display:block;font-size:14px;line-height:1.2}
.kenya-company-bi-store-bars span small{display:block;margin-top:3px;color:#64748b;font-size:11px;font-weight:800}
.kenya-company-bi-store-bars div{height:12px;border-radius:999px;background:#e2e8f0;overflow:hidden}
.kenya-company-bi-store-bars i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2563eb,#16a34a)}
.kenya-company-bi-store-bars em{display:grid;gap:3px;justify-items:end;color:#0f172a;font-style:normal;font-weight:900;text-align:right}
.kenya-company-bi-store-bars em small{display:flex;gap:5px;align-items:center;justify-content:flex-end;flex-wrap:wrap;color:#64748b;font-size:11px;font-weight:800}
.kenya-company-bi-table{min-width:1540px}
.kenya-company-bi-detail{align-content:start}
.kenya-company-bi-trend-card{display:grid;gap:8px;padding:10px;border:1px solid var(--fw-border);border-radius:8px;background:#f8fafc}
.kenya-company-bi-trend-card>span{color:#64748b;font-size:12px;font-weight:900}
.kenya-company-bi-sparkline{display:flex;align-items:end;gap:5px;height:72px;padding:10px;border-radius:8px;background:#fff;border:1px solid #e2e8f0}
.kenya-company-bi-sparkline span{flex:1;min-width:8px;border-radius:4px 4px 0 0;background:#2563eb}
@media (max-width: 1280px){
  .china-gm-bi-kpi-grid{grid-template-columns:repeat(3,minmax(150px,1fr))}
  .china-gm-bi-command-grid{grid-template-columns:1fr}
  .china-gm-bi-funnel-body{grid-template-columns:1fr}
  .china-gm-bi-main-layout{grid-template-columns:1fr}
  .kenya-company-bi-layout{grid-template-columns:1fr}
  .china-gm-bi-detail-panel{position:static}
}
@media (max-width: 820px){
  .china-gm-bi-header,.china-gm-bi-section-head,.china-gm-bi-matrix-head,.china-gm-bi-funnel-head{flex-direction:column}
  .china-gm-bi-filter-row,.china-gm-bi-command-grid,.china-gm-bi-overview-grid,.china-gm-bi-inventory-grid,.china-gm-bi-detail-grid,.china-gm-bi-detail-metrics,.kenya-company-bi-filter-row{grid-template-columns:1fr}
  .china-gm-bi-kpi-grid{grid-template-columns:1fr}
  .china-gm-bi-category-row,.china-gm-bi-ranking-list button,.china-gm-bi-suggestion-list button,.china-gm-bi-trend-list button{grid-template-columns:1fr}
  .kenya-company-bi-store-bars button{grid-template-columns:1fr}
  .kenya-company-bi-store-bars em{justify-items:start;text-align:left}
  .kenya-company-bi-store-bars em small{justify-content:flex-start}
  .china-gm-bi-stock-split{grid-template-columns:repeat(2,minmax(0,1fr))}
  .china-gm-bi-action-lane{grid-template-columns:1fr}
  .china-gm-bi-action-lane-metrics{text-align:left}
  .china-gm-bi-matrix{min-height:420px}
  .china-gm-bi-map-dot{max-width:110px;padding:6px}
  .china-gm-bi-map-dot span,.china-gm-bi-map-dot small{white-space:normal}
  .china-gm-bi-funnel-summary{justify-content:flex-start}
  .china-gm-bi-funnel-stage-head,.china-gm-bi-funnel-stage-foot{flex-direction:column;gap:4px}
  .china-gm-bi-funnel-stage-head strong,.china-gm-bi-funnel-stage-foot small{text-align:left;white-space:normal}
}

.shift-report-steps { display: grid; gap: 12px; margin-top: 12px; }
.close-shift-panel {
  display: grid;
  gap: 14px;
}
.close-shift-head {
  align-items: flex-start;
}
.close-shift-head .helper-text {
  margin: 6px 0 0;
}
.close-shift-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.close-shift-status-pill.is-ready,
.close-shift-status-pill.is-done {
  border-color: #86efac;
  background: #f0fdf4;
  color: #166534;
}
.close-shift-status-pill.is-waiting {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}
.close-shift-status-pill.is-danger {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}
.close-shift-current {
  border-radius: 8px;
  background: #ffffff;
}
.close-shift-current-main {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(360px, 1fr);
  gap: 16px;
  align-items: center;
}
.close-shift-eyebrow,
.close-shift-card-title span,
.close-shift-report-grid span,
.close-shift-report-hero span,
.close-shift-current-kpis span,
.close-shift-variance-grid span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}
.close-shift-current-main > div > strong {
  display: block;
  margin-top: 4px;
  color: #0f172a;
  font-size: 22px;
}
.close-shift-current-main p {
  margin: 6px 0 0;
  color: #475569;
}
.close-shift-current-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.close-shift-current-kpis article {
  display: grid;
  gap: 4px;
  padding-left: 10px;
  border-left: 1px solid #e2e8f0;
}
.close-shift-current-kpis strong {
  color: #0f172a;
  font-size: 14px;
}
.close-shift-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.close-shift-progress li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 8px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #ffffff;
  color: #475569;
}
.close-shift-progress li span {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  font-size: 12px;
  font-weight: 900;
}
.close-shift-progress li strong {
  min-width: 0;
  color: #0f172a;
  font-size: 13px;
}
.close-shift-progress li small {
  color: #64748b;
  font-size: 12px;
}
.close-shift-progress li.is-active {
  border-color: #2563eb;
  background: #eff6ff;
}
.close-shift-progress li.is-active span,
.close-shift-progress li.is-done span {
  background: #2563eb;
  color: #ffffff;
}
.close-shift-progress li.is-done {
  border-color: #86efac;
  background: #f0fdf4;
}
.close-shift-progress li.is-locked {
  opacity: .58;
}
.close-shift-workbench {
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  align-items: start;
}
.close-shift-report-card,
.close-shift-cash-card {
  border-radius: 8px;
  border-color: #dbe3f0;
  background: #ffffff;
  box-shadow: none;
}
.close-shift-card-title {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}
.close-shift-card-title strong {
  color: #0f172a;
  font-size: 20px;
}
.close-shift-report,
.close-shift-variance,
.close-shift-result {
  border-radius: 8px;
}
.close-shift-empty-message {
  display: grid;
  gap: 4px;
  color: #475569;
}
.close-shift-empty-message strong {
  color: #0f172a;
}
.close-shift-report-hero {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e2e8f0;
}
.close-shift-report-hero article,
.close-shift-report-grid article,
.close-shift-variance-grid article {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.close-shift-report-hero strong {
  color: #0f172a;
  font-size: 28px;
}
.close-shift-report-hero small {
  color: #64748b;
}
.close-shift-report-grid,
.close-shift-variance-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin-top: 12px;
}
.close-shift-report-grid article {
  padding-bottom: 8px;
  border-bottom: 1px solid #edf2f7;
}
.close-shift-report-grid strong,
.close-shift-variance-grid strong {
  color: #0f172a;
  font-size: 16px;
}
.close-shift-report-preview-shell {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #e2e8f0;
}
.close-shift-report-preview-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}
.close-shift-report-preview-head strong {
  color: #0f172a;
  font-size: 16px;
}
.close-shift-report-preview-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}
.close-shift-report-preview-paper {
  display: grid;
  justify-content: center;
  max-height: 420px;
  overflow: auto;
  padding: 12px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  background: #f8fafc;
}
.close-shift-report-preview-paper .cashier-thermal-paper-57mm {
  width: 65mm;
  min-height: auto;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
}
.close-shift-form {
  grid-template-columns: 1fr;
}
.close-shift-form :disabled {
  background: #f8fafc;
  color: #94a3b8;
  cursor: not-allowed;
}
.close-shift-variance-head,
.close-shift-result-head {
  display: grid;
  gap: 4px;
}
.close-shift-variance-head strong,
.close-shift-result-head strong {
  color: #0f172a;
  font-size: 16px;
}
.close-shift-variance-head span,
.close-shift-result-head span {
  color: #475569;
}
.close-shift-variance--success {
  border-color: #86efac;
  background: #f0fdf4;
}
.close-shift-variance--danger,
.close-shift-result--danger {
  border-color: #fecaca;
  background: #fef2f2;
}
.close-shift-result--success {
  border-color: #bfdbfe;
  background: #eff6ff;
}
.close-shift-backend-detail summary {
  cursor: pointer;
  color: #1d4ed8;
  font-weight: 800;
}
.close-shift-backend-detail pre {
  margin: 8px 0 0;
  max-height: 220px;
  overflow: auto;
  white-space: pre-wrap;
}
.close-shift-action-row {
  margin-top: 4px;
}
.close-shift-action-row button:first-child:not(:disabled) {
  background: #2563eb;
  color: #ffffff;
  border-color: #2563eb;
}
.close-shift-action-row button.danger-action:not(:disabled) {
  background: #b91c1c;
  color: #ffffff;
  border-color: #b91c1c;
}
@media (max-width: 980px) {
  .close-shift-current-main,
  .close-shift-workbench {
    grid-template-columns: 1fr;
  }
  .close-shift-progress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 620px) {
  .close-shift-head {
    display: grid;
  }
  .close-shift-current-kpis,
  .close-shift-progress,
  .close-shift-report-hero,
  .close-shift-report-grid,
  .close-shift-variance-grid {
    grid-template-columns: 1fr;
  }
}
.shift-handover-details { margin-top: 12px; }
.shift-handover-details summary { cursor: pointer; font-weight: 600; margin-bottom: 8px; }

body.cashier-terminal-mode .cashier-opening-no-barcode-button {
  min-height: 52px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: #dc2626;
  color: #fff;
  font-weight: 900;
  white-space: nowrap;
  box-shadow: 0 10px 20px rgba(220, 38, 38, 0.18);
}

body.cashier-terminal-mode .cashier-opening-no-barcode-button:hover,
body.cashier-terminal-mode .cashier-opening-add-button {
  background: #b91c1c;
  color: #fff;
}

body.cashier-terminal-mode .cashier-opening-no-barcode-alert {
  border-color: #fecaca;
  background: #fef2f2;
  color: #991b1b;
  font-weight: 800;
}

body.cashier-terminal-mode .cashier-opening-no-barcode-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.cashier-terminal-mode .cashier-opening-no-barcode-summary article {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  padding: 10px;
  display: grid;
  gap: 4px;
}

body.cashier-terminal-mode .cashier-opening-no-barcode-summary span {
  color: #64748b;
  font-size: 12px;
  font-weight: 800;
}

body.cashier-terminal-mode .cashier-opening-no-barcode-tier-grid,
body.cashier-terminal-mode .cashier-opening-no-barcode-qty-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.cashier-terminal-mode .cashier-opening-no-barcode-qty-row {
  grid-template-columns: auto minmax(80px, 1fr) auto auto;
  align-items: center;
}

body.cashier-terminal-mode .cashier-opening-tier {
  min-height: 68px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fff;
  color: #991b1b;
  display: grid;
  gap: 4px;
  place-items: center;
  font-weight: 900;
}

body.cashier-terminal-mode .cashier-opening-tier.is-active {
  background: #dc2626;
  color: #fff;
  border-color: #dc2626;
}

body.cashier-terminal-mode .cashier-cart-row.is-opening-no-barcode {
  border-color: #dc2626;
  background: #fef2f2;
}


/* SDO / LPK workbench cleanup */
.sdo-boundary-note {
  display: grid;
  gap: 8px;
}

.sdo-boundary-note .subtle.small {
  display: none;
}

.sdo-boundary-note::after {
  content: "整包配送，店长扫描 SDO 确认收货。";
  display: block;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.sdo-execution-shell {
  display: grid;
  gap: 14px;
}

.sdo-control-bar {
  display: grid;
  grid-template-columns: minmax(300px, 0.9fr) minmax(420px, 1.4fr);
  gap: 14px;
  align-items: stretch;
}

.sdo-control-bar .transfer-workbench-head {
  display: none;
}

.sdo-control-form {
  grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px);
  align-items: end;
  align-self: center;
}

.sdo-control-summary {
  display: grid;
  gap: 8px;
  align-self: stretch;
  padding: 12px 14px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #f8fafc;
}

.sdo-control-title {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: baseline;
}

.sdo-control-title strong {
  color: var(--ink);
  font-size: 18px;
}

.sdo-control-title span {
  color: #475569;
  font-size: 13px;
  font-weight: 700;
}

.sdo-control-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: #475569;
  font-size: 12px;
}

.sdo-control-metrics > span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  min-height: 28px;
  padding: 4px 8px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #ffffff;
}

.sdo-step-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 14px;
  align-items: start;
}

.sdo-step-lanes {
  display: contents;
}

.sdo-step-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  align-content: start;
}

.sdo-step-card .eyebrow,
.sdo-step-card .transfer-workbench-head p {
  display: none;
}

.sdo-step-card .transfer-workbench-head h3 {
  font-size: 18px;
  line-height: 1.25;
}

.sdo-inline-form {
  grid-template-columns: minmax(150px, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.sdo-inline-form select[name="transfer_no"] {
  display: none;
}

.sdo-inline-form button,
.sdo-control-form button {
  min-height: 40px;
  white-space: normal;
}

.sdo-step-status,
.sdo-step-body {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.sdo-step-status.empty-state,
.sdo-step-body.empty-state {
  padding: 10px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  color: #64748b;
  background: #f8fafc;
}

.sdo-step-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.sdo-step-metric {
  min-width: 0;
  padding: 9px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #ffffff;
}

.sdo-step-metric span {
  display: block;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.sdo-step-metric strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: 18px;
  overflow-wrap: anywhere;
}

.sdo-compact-list {
  display: grid;
  gap: 8px;
}

.sdo-compact-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 48px;
  padding: 9px 10px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #ffffff;
}

.sdo-compact-row strong,
.sdo-compact-row span {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.sdo-compact-row strong {
  color: var(--ink);
}

.sdo-compact-row span,
.sdo-compact-more,
.sdo-compact-empty {
  color: #64748b;
  font-size: 12px;
}

.sdo-compact-empty,
.sdo-compact-more {
  padding: 8px 10px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #f8fafc;
}

.sdo-package-table-summary {
  overflow-x: auto;
}

.sdo-package-table-wrap {
  overflow-x: auto;
}

.sdo-package-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  font-size: 13px;
}

.sdo-package-table th,
.sdo-package-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e2e8f0;
  text-align: left;
  vertical-align: middle;
}

.sdo-package-table th {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
  background: #f8fafc;
}

.sdo-package-table td {
  color: var(--ink);
}

.sdo-package-table.empty-state {
  min-width: 0;
  padding: 10px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  color: #64748b;
  background: #f8fafc;
}

.field-control {
  display: grid;
  gap: 5px;
}

.field-control span {
  color: #475569;
  font-size: 12px;
  font-weight: 600;
}

.field-control select {
  width: 100%;
}

.loose-pick-sheet-card {
  align-items: stretch;
  gap: 18px;
}

.loose-pick-sheet-main {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.loose-pick-barcode {
  display: grid;
  gap: 8px;
  max-width: 420px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(13, 92, 99, 0.25);
  background: #fff;
  box-shadow: 0 12px 30px rgba(22, 32, 33, 0.08);
}

.barcode-stripes {
  display: block;
  height: 56px;
  border-radius: 8px;
  background:
    repeating-linear-gradient(
      90deg,
      #101010 0 3px,
      transparent 3px 6px,
      #101010 6px 8px,
      transparent 8px 13px,
      #101010 13px 18px,
      transparent 18px 23px
    );
}

.loose-pick-barcode strong {
  letter-spacing: 0.12em;
  overflow-wrap: anywhere;
  color: var(--ink);
}

.loose-pick-line-list {
  display: grid;
  gap: 6px;
  max-width: 760px;
  margin-top: 4px;
}

.loose-pick-label-actions {
  min-width: 230px;
  align-items: stretch;
}

.loose-pick-print-label.is-preview {
  width: 220px;
  min-height: 148px;
  display: grid;
  gap: 7px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(13, 92, 99, 0.22);
  background: #fff;
  box-shadow: 0 10px 24px rgba(22, 32, 33, 0.08);
}

.loose-pick-print-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
  color: var(--ink);
}

.loose-pick-print-top strong,
.loose-pick-print-top span {
  font-weight: 800;
  white-space: nowrap;
}

.loose-pick-print-top strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.loose-pick-template-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  border-radius: 13px;
  background: rgba(13, 92, 99, 0.08);
}

.loose-pick-print-code {
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-align: center;
  overflow-wrap: anywhere;
}

.loose-pick-print-details {
  display: grid;
  gap: 4px;
}

.loose-pick-print-details span {
  display: block;
  padding: 4px 6px;
  border-radius: 9px;
  background: rgba(13, 92, 99, 0.08);
  color: var(--teal);
  font-size: 9px;
  font-weight: 800;
  line-height: 1.25;
}

.loose-pick-print-foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--muted);
  font-size: 10px;
}

.lpk-flow-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
  justify-content: space-between;
}

.lpk-flow-strip strong {
  color: #475569;
  font-size: 13px;
}

.lpk-workbench-shell {
  grid-template-columns: minmax(360px, 0.72fr) minmax(520px, 1.28fr);
  gap: 14px;
  align-items: start;
}

.lpk-control-panel,
.lpk-current-panel {
  display: grid;
  gap: 12px;
}

.lpk-control-panel .transfer-workbench-head h3,
.lpk-current-panel .transfer-workbench-head h3 {
  font-size: 20px;
}

.lpk-control-panel .warehouse-prep-toolbar {
  grid-template-columns: minmax(210px, 1fr) minmax(140px, 180px);
  gap: 10px;
}

.lpk-control-panel .warehouse-prep-toolbar .field-help,
.lpk-control-panel .warehouse-prep-toolbar .field-description,
.lpk-control-panel .warehouse-prep-toolbar .helper-text,
.lpk-control-panel .warehouse-prep-toolbar small {
  display: none;
}

.lpk-control-panel .warehouse-prep-toolbar button {
  grid-column: 1 / -1;
  min-height: 42px;
}

.lpk-control-panel #loosePackingWaveSummary {
  display: none;
}

.lpk-summary-strip {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #f8fafc;
}

.lpk-boundary-note {
  color: #334155;
  font-size: 13px;
  font-weight: 800;
}

.lpk-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.lpk-summary-tile {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #fff;
}

.lpk-summary-tile span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.lpk-summary-tile strong {
  min-width: 0;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.lpk-task-board {
  display: grid;
  gap: 12px;
}

.lpk-task-board.empty-state {
  padding: 18px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #475569;
}

.lpk-task-board.empty-state strong,
.lpk-task-board.empty-state span {
  display: block;
}

.lpk-task-card {
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 1px solid #dbe5f0;
  border-left: 4px solid #0f766e;
  border-radius: 8px;
  background: #fff;
}

.lpk-task-header {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
  justify-content: space-between;
}

.lpk-task-header h3 {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: 24px;
  line-height: 1.15;
}

.lpk-task-header p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 13px;
}

.lpk-task-status {
  display: flex;
  align-items: center;
  min-height: 32px;
}

.lpk-task-main {
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(360px, 1.28fr);
  gap: 14px;
  align-items: start;
}

.lpk-label-panel,
.lpk-pick-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.lpk-barcode-slab {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
}

.lpk-barcode-slab .barcode-stripes {
  height: 42px;
  border-radius: 4px;
}

.lpk-barcode-slab strong {
  color: var(--ink);
  font-size: 20px;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.lpk-barcode-slab small {
  color: #64748b;
  font-weight: 700;
}

.lpk-mini-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.lpk-mini-metrics span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px;
  border: 1px solid #dbe5f0;
  border-radius: 8px;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.lpk-mini-metrics b {
  color: var(--ink);
  font-size: 20px;
  line-height: 1.1;
}

.lpk-chip-row,
.lpk-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.lpk-action-row button {
  min-height: 36px;
}

.lpk-section-head {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
}

.lpk-section-head h4 {
  margin: 0;
  color: var(--ink);
  font-size: 17px;
}

.lpk-section-head span {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.lpk-pick-table {
  min-width: 620px;
}

@media (max-width: 1180px) {
  .lpk-workbench-shell,
  .lpk-task-main {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .lpk-control-panel .warehouse-prep-toolbar,
  .lpk-summary-grid,
  .lpk-mini-metrics {
    grid-template-columns: minmax(0, 1fr);
  }

  .lpk-task-header,
  .lpk-section-head {
    align-items: flex-start;
  }
}

.cashier-customer-notes-card {
  border: 1px solid #dbe7f5;
  border-radius: 14px;
  padding: 12px;
  background: #f8fbff;
  margin-top: 12px;
}

.cashier-customer-notes-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 10px;
}

.cashier-customer-notes-head span {
  color: #64748b;
  font-size: 12px;
}

.cashier-customer-notes-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.cashier-customer-notes-grid label {
  display: grid;
  gap: 4px;
  color: #334155;
  font-size: 12px;
  font-weight: 700;
}

.cashier-customer-notes-grid select,
.cashier-customer-notes-grid textarea {
  width: 100%;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  padding: 8px 10px;
  background: #fff;
  color: #0f172a;
}

.cashier-customer-note-wide {
  grid-column: 1 / -1;
}
.gm-stocktake-page,.gm-stocktake-report-page{display:grid;gap:14px}.gm-stocktake-banner,.gm-stocktake-session-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px;border:1px solid #d8e2ee;border-radius:12px;background:#f7fbff}.gm-stocktake-banner>div,.gm-stocktake-session-head>div{display:grid;gap:4px}.gm-stocktake-mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.gm-stocktake-mode-card{display:grid;gap:6px;text-align:left;padding:16px;border:1px solid #d8e2ee;border-radius:12px;background:#fff;color:#24364b}.gm-stocktake-mode-card.is-active{border-color:#2467e8;box-shadow:0 0 0 2px rgba(36,103,232,.15);background:#f5f9ff}.gm-stocktake-mode-card span{font-size:13px;color:#60738b}.gm-stocktake-rack-picker{display:grid;gap:10px;padding:14px;border:1px solid #d8e2ee;border-radius:12px}.gm-stocktake-rack-picker>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.gm-stocktake-sample-field{display:grid;gap:6px;max-width:280px}.gm-stocktake-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}.gm-stocktake-table-wrap{overflow:auto}.gm-stocktake-table{min-width:1180px}.gm-stocktake-table input,.gm-stocktake-table select{min-width:110px}.gm-stocktake-table tr.is-recount{background:#fff7df}.gm-stocktake-report-filters{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.gm-stocktake-report-filters label{display:grid;gap:5px}.gm-stocktake-report-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:14px;align-items:start}.gm-stocktake-report-layout>div{overflow:auto}.gm-stocktake-report-detail,.gm-stocktake-report-lines{padding:14px;border:1px solid #d8e2ee;border-radius:12px;background:#f8fbff}.gm-stocktake-report-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.gm-stocktake-report-metrics article{display:grid;gap:4px;padding:10px;border:1px solid #d8e2ee;border-radius:9px;background:#fff}.gm-stocktake-report-metrics span{font-size:12px;color:#60738b}.gm-stocktake-report-largest{display:grid;gap:6px;margin-top:12px}.gm-stocktake-report-largest ol{display:grid;gap:4px;margin:0;padding-left:20px}.gm-stocktake-report-lines{display:grid;gap:10px;background:#fff}@media(max-width:900px){.gm-stocktake-mode-grid,.gm-stocktake-report-layout{grid-template-columns:1fr}.gm-stocktake-rack-picker>div{grid-template-columns:repeat(2,minmax(0,1fr))}}

.gm-stocktake-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.gm-stocktake-active,
[data-gm-stocktake-results] {
  display: grid;
  gap: 12px;
}

.gm-stocktake-status-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 220px));
  gap: 8px;
  padding-top: 2px;
}

.gm-stocktake-status-tab {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid #cbd8e8;
  border-radius: 10px;
  background: #fff;
  color: #334a66;
  font-weight: 700;
}

.gm-stocktake-status-tab strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 24px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eaf1fb;
}

.gm-stocktake-status-tab.is-active {
  border-color: #2467e8;
  background: #2467e8;
  color: #fff;
  box-shadow: 0 4px 12px rgba(36, 103, 232, 0.18);
}

.gm-stocktake-status-tab.is-active strong {
  background: rgba(255, 255, 255, 0.2);
}

.gm-stocktake-toolbar label {
  flex: 1 1 420px;
  max-width: 680px;
}

.gm-stocktake-toolbar input {
  width: 100%;
  min-width: 280px;
}

.gm-stocktake-target-location {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(120px, .8fr) auto;
  gap: 6px;
}

.gm-stocktake-target-location input,
.gm-stocktake-target-location select {
  width: 100%;
}

.gm-stocktake-target-location button {
  align-self: stretch;
  white-space: nowrap;
}

.gm-stocktake-product {
  display: grid;
  grid-template-columns: 48px minmax(130px, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 210px;
}

.gm-stocktake-product strong {
  line-height: 1.35;
}

.gm-stocktake-table tr.is-saving {
  opacity: 0.65;
}

.gm-stocktake-line-list {
  display: grid;
  gap: 10px;
}

.gm-stocktake-line-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #d8e2ee;
  border-radius: 12px;
  background: #fff;
  content-visibility: auto;
  contain-intrinsic-size: 190px;
}

.gm-stocktake-line-card.is-recount {
  border-color: #f0bd49;
  background: #fffaf0;
}

.gm-stocktake-line-card.is-saving {
  opacity: 0.65;
}

.gm-stocktake-line-summary {
  display: grid;
  grid-template-columns: minmax(150px, .7fr) minmax(250px, 1.5fr) minmax(140px, .7fr) auto;
  align-items: center;
  gap: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e8eef5;
}

.gm-stocktake-line-location,
.gm-stocktake-line-barcode,
.gm-stocktake-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.gm-stocktake-line-location > span,
.gm-stocktake-line-barcode > span,
.gm-stocktake-field > span {
  color: #60738b;
  font-size: 12px;
  font-weight: 700;
}

.gm-stocktake-line-fields {
  display: grid;
  grid-template-columns: minmax(280px, 1.5fr) minmax(90px, .45fr) minmax(120px, .6fr) minmax(140px, .7fr) minmax(180px, 1fr);
  align-items: end;
  gap: 10px;
}

.gm-stocktake-field input,
.gm-stocktake-field select {
  width: 100%;
}

.gm-stocktake-line-confirm {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding-top: 2px;
}

.gm-stocktake-line-confirm > span {
  color: #60738b;
  font-size: 12px;
}

.gm-stocktake-line-confirm > button {
  min-width: 132px;
}

.gm-stocktake-book-qty {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid #d8e2ee;
  border-radius: 8px;
  background: #f7fbff;
}

.gm-stocktake-load-more {
  display: flex;
  justify-content: center;
  padding: 4px 0;
}

@media (max-width: 1180px) {
  .gm-stocktake-line-summary {
    grid-template-columns: minmax(150px, .7fr) minmax(240px, 1.4fr) minmax(140px, .7fr);
  }

  .gm-stocktake-line-summary > .status-badge {
    justify-self: start;
  }

  .gm-stocktake-line-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gm-stocktake-field-location,
  .gm-stocktake-field-note {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  .gm-stocktake-status-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gm-stocktake-line-summary,
  .gm-stocktake-line-fields,
  .gm-stocktake-target-location {
    grid-template-columns: 1fr;
  }

  .gm-stocktake-product {
    min-width: 0;
  }

  .gm-stocktake-line-confirm {
    align-items: stretch;
    flex-direction: column;
  }

  .gm-stocktake-line-confirm > button {
    width: 100%;
  }
}

.gm-stocktake-report-layout tbody tr.is-selected {
  background: #eaf2ff;
}

.gm-stocktake-report-layout tbody tr.is-selected td:first-child {
  box-shadow: inset 3px 0 #2467e8;
}

.gm-stocktake-report-brief {
  display: grid;
  gap: 6px;
  margin: 10px 0 12px;
  padding: 12px;
  border: 1px solid #bfd4f4;
  border-left: 4px solid #2467e8;
  border-radius: 10px;
  background: #eef5ff;
  color: #24364b;
}

.gm-stocktake-report-brief p {
  margin: 0;
  line-height: 1.55;
}

.gm-stocktake-report-brief span {
  color: #60738b;
  font-size: 12px;
}
/* Issue #1261: browser-based mobile workspace for internal market sales. */
.workspace-tab-with-icon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.workspace-tab-icon,
.sales-field-mobile-title-icon,
.sales-icon-box,
.sales-quick-actions button > span,
.sales-hero-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.workspace-tab-icon svg {
  width: 17px;
  height: 17px;
}

.sales-field-panel {
  background: #eef3ff;
}

.sales-field-page-head {
  align-items: center;
}

.sales-field-page-head .eyebrow {
  margin-bottom: 4px;
}

.sales-field-root {
  max-width: none;
  margin: 0 auto;
  display: block;
  color: #172033;
}

/* Issue #1270: desktop Market Sales management hub. */
.sales-management-panel {
  background: #ffffff;
}

.sales-management-page-head {
  align-items: flex-start;
}

.sales-management-page-head h2,
.sales-management-page-head p {
  margin: 0;
}

.sales-management-page-head p {
  margin-top: 5px;
}

.sales-management-root {
  display: grid;
  gap: 12px;
  color: #172033;
}

.sales-management-toolbar,
.sales-management-toolbar form,
.sales-management-toolbar label,
.sales-management-toolbar button,
.sales-management-section-head,
.sales-management-exception-title,
.sales-management-exception-list > div {
  display: flex;
  align-items: center;
}

.sales-management-toolbar {
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e3e8f0;
}

.sales-management-toolbar form {
  gap: 8px;
}

.sales-management-toolbar label {
  gap: 7px;
  color: #475467;
  font-size: 13px;
  font-weight: 700;
}

.sales-management-toolbar input,
.sales-customer-dashboard-filters input,
.sales-customer-dashboard-filters select {
  min-height: 40px;
  border: 1px solid #cfd8e6;
  border-radius: 8px;
  background: #fff;
  color: #172033;
  font: inherit;
}

.sales-management-toolbar input {
  width: 150px;
}

.sales-management-toolbar button {
  justify-content: center;
  gap: 7px;
  min-height: 40px;
}

.sales-management-toolbar button svg {
  width: 18px;
  height: 18px;
}

.sales-management-definition {
  margin: 0;
  color: #667085;
  font-size: 12px;
}

.sales-management-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.sales-management-kpi {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  min-height: 82px;
  padding: 13px 14px;
  border: 1px solid #dce4ef;
  border-radius: 10px;
  background: #fff;
}

.sales-management-kpi-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 9px;
  background: #edf3ff;
  color: #2767d8;
}

.sales-management-kpi-icon svg {
  width: 21px;
  height: 21px;
}

.sales-management-kpi div {
  min-width: 0;
}

.sales-management-kpi small,
.sales-management-kpi strong {
  display: block;
}

.sales-management-kpi small {
  overflow: hidden;
  color: #667085;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-management-kpi strong {
  margin-top: 4px;
  font-size: 23px;
  line-height: 1;
}

.sales-management-kpi.is-good .sales-management-kpi-icon { background: #e8f7f0; color: #16845b; }
.sales-management-kpi.is-danger .sales-management-kpi-icon { background: #fff0ef; color: #c63c36; }
.sales-management-kpi.is-warning .sales-management-kpi-icon { background: #fff5dc; color: #bd6518; }
.sales-management-kpi.is-accent .sales-management-kpi-icon { background: #e8f0ff; color: #2458b8; }

.sales-management-section {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #dce4ef;
  border-radius: 10px;
  background: #fff;
}

.sales-management-section-head {
  justify-content: space-between;
  gap: 12px;
  padding: 13px 15px;
  border-bottom: 1px solid #e3e8f0;
}

.sales-management-section-head h3,
.sales-management-section-head p {
  margin: 0;
}

.sales-management-section-head h3 {
  font-size: 16px;
}

.sales-management-section-head p {
  margin-top: 3px;
  color: #667085;
  font-size: 12px;
}

.sales-management-table-wrap {
  max-width: 100%;
  overflow: auto;
}

.sales-management-table {
  width: 100%;
  min-width: 960px;
  border-collapse: collapse;
  font-size: 12px;
}

.sales-management-table th,
.sales-management-table td {
  padding: 10px 11px;
  border-right: 1px solid #e5eaf1;
  border-bottom: 1px solid #e5eaf1;
  text-align: left;
  vertical-align: middle;
}

.sales-management-table th:last-child,
.sales-management-table td:last-child {
  border-right: 0;
}

.sales-management-table th {
  background: #f5f7fb;
  color: #475467;
  font-weight: 700;
  white-space: nowrap;
}

.sales-management-table tbody tr:hover {
  background: #f8fbff;
}

.sales-management-table td > strong,
.sales-management-table td > small {
  display: block;
}

.sales-management-table td > small,
.sales-management-table td .sales-management-status + small,
.sales-management-table td a {
  margin-top: 3px;
  color: #667085;
  font-size: 11px;
}

.sales-management-table td a {
  color: #2767d8;
  text-decoration: none;
}

.sales-management-table .is-number {
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.sales-photo-link {
  display: inline-flex;
  align-items: center;
  width: auto;
  min-height: 34px;
  gap: 6px;
  padding: 6px 9px;
  white-space: nowrap;
}

.sales-photo-link svg {
  width: 16px;
  height: 16px;
}

.sales-photo-missing {
  color: #8a94a5;
  font-size: 12px;
}

.sales-management-visit-photos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
  padding: 14px;
}

.sales-management-visit-photo-card {
  display: grid;
  min-width: 0;
  gap: 10px;
  padding: 13px;
  border: 1px solid #dde5f0;
  border-radius: 10px;
  background: #fbfcff;
}

.sales-management-visit-photo-card > div:first-child {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
}

.sales-management-visit-photo-card > div:first-child > div {
  min-width: 0;
}

.sales-management-visit-photo-card strong,
.sales-management-visit-photo-card small {
  display: block;
}

.sales-management-visit-photo-card strong {
  overflow: hidden;
  color: #172033;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-management-visit-photo-card small,
.sales-management-visit-photo-card p {
  color: #667085;
  font-size: 12px;
}

.sales-management-visit-photo-card p {
  margin: 0;
}

.sales-management-visit-photo-card > div:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.sales-management-visit-photo-card > div:last-child button {
  display: inline-flex;
  align-items: center;
  width: auto;
  min-height: 34px;
  gap: 5px;
  padding: 6px 9px;
}

.sales-management-visit-photo-card > div:last-child svg {
  width: 16px;
  height: 16px;
}

.sales-management-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 3px 7px;
  border-radius: 6px;
  background: #edf1f6;
  color: #5d6879;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.sales-management-status.is-good { background: #e5f7ee; color: #12704b; }
.sales-management-status.is-warning { background: #fff3d6; color: #9b5b07; }
.sales-management-status.is-danger { background: #ffebea; color: #b5332e; }
.sales-management-status.is-accent { background: #e8f0ff; color: #2458b8; }

.sales-management-exceptions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.sales-management-exception {
  min-width: 0;
  padding: 12px;
  border: 1px solid #e1e7ef;
  border-radius: 9px;
  background: #fbfcfe;
}

.sales-management-exception-title {
  gap: 7px;
}

.sales-management-exception-title > span {
  display: inline-flex;
  color: #bd6518;
}

.sales-management-exception.is-danger .sales-management-exception-title > span {
  color: #c63c36;
}

.sales-management-exception-title svg {
  width: 18px;
  height: 18px;
}

.sales-management-exception-title strong {
  flex: 1 1 auto;
  font-size: 13px;
}

.sales-management-exception-title em {
  color: #667085;
  font-size: 12px;
  font-style: normal;
}

.sales-management-exception-list {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.sales-management-exception-list > div {
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  font-size: 12px;
}

.sales-management-exception-list span {
  overflow: hidden;
  color: #667085;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-management-exception-list .is-empty {
  color: #7a8495;
}

.sales-management-loading,
.sales-management-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 120px;
  padding: 18px;
  color: #667085;
  text-align: center;
}

.sales-management-loading > span {
  width: 17px;
  height: 17px;
  border: 2px solid #b6c7e5;
  border-top-color: #2767d8;
  border-radius: 50%;
  animation: sales-field-spin .8s linear infinite;
}

.sales-management-empty.is-error {
  border: 1px solid #f2c5c2;
  border-radius: 9px;
  background: #fff0ef;
  color: #a83a35;
}

.sales-customer-dashboard-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  padding: 12px;
  border: 1px solid #dce4ef;
  border-radius: 10px;
  background: #f8fafc;
}

.sales-customer-dashboard-filters label {
  display: grid;
  gap: 5px;
  color: #475467;
  font-size: 12px;
  font-weight: 700;
}

.sales-customer-dashboard-filters > div {
  display: flex;
  align-items: end;
  gap: 7px;
}

.sales-customer-dashboard-filters button {
  min-height: 40px;
  flex: 1 1 auto;
}

.sales-customer-stage-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 12px;
}

.sales-customer-stage-grid article {
  min-width: 0;
  padding: 8px 13px;
  border-right: 1px solid #e3e8f0;
}

.sales-customer-stage-grid article:last-child {
  border-right: 0;
}

.sales-customer-stage-grid span,
.sales-customer-stage-grid strong,
.sales-customer-stage-grid small {
  display: block;
}

.sales-customer-stage-grid span {
  overflow: hidden;
  color: #667085;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-customer-stage-grid strong {
  margin-top: 5px;
  font-size: 20px;
}

.sales-customer-stage-grid small {
  margin-top: 2px;
  color: #2767d8;
  font-size: 11px;
}

.sales-customer-table {
  min-width: 1100px;
}

.sales-field-phone-shell {
  width: min(390px, 100%);
  height: clamp(560px, calc(100svh - 112px), 760px);
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  margin: 0 auto;
  overflow: hidden;
  border: 10px solid #171717;
  border-radius: 28px;
  background: #171717;
  box-shadow: 0 22px 48px rgba(23, 23, 23, 0.18);
}

.sales-field-phone-screen {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  background: #f6f8fc;
}

.sales-field-phone-body {
  min-width: 0;
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 12px;
  overflow: auto;
  overflow-x: hidden;
  padding: 12px 11px 14px;
  scroll-padding-bottom: 24px;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.sales-field-mobile-title {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 52px;
  padding: 7px 9px;
  border-bottom: 1px solid #e0e6ef;
  background: #ffffff;
}

.sales-field-mobile-title > div {
  min-width: 0;
  flex: 1 1 auto;
}

.sales-field-mobile-title-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 10px;
  background: #e7effe;
  color: #2767d8;
}

.sales-field-mobile-title-icon svg {
  width: 20px;
  height: 20px;
}

.sales-field-mobile-title strong,
.sales-field-mobile-title small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-field-mobile-title strong {
  font-size: 14px;
}

.sales-field-mobile-title small {
  margin-top: 2px;
  color: #707b8e;
  font-size: 11px;
}

.sales-field-phone-mode {
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef3fb;
  color: #55647a;
  font-size: 11px;
  font-weight: 700;
}

.sales-field-mobile-nav {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding: 7px 8px;
  border-top: 1px solid #d8e0ec;
  background: #ffffff;
  box-shadow: 0 -7px 22px rgba(27, 42, 65, 0.09);
}

.sales-field-mobile-nav button {
  display: grid;
  justify-items: center;
  gap: 2px;
  min-height: 48px;
  padding: 4px;
  border: 0;
  background: transparent;
  color: #788397;
}

.sales-field-mobile-nav button.is-active { color: #2767d8; }
.sales-field-mobile-nav span { width: 23px; height: 23px; }
.sales-field-mobile-nav svg { width: 22px; height: 22px; }
.sales-field-mobile-nav small { font-size: 11px; font-weight: 700; }

.sales-field-phone-shell .sales-field-hero {
  padding: 16px;
  border-radius: 14px;
}

.sales-field-phone-shell .sales-field-hero h3 {
  font-size: 19px;
}

.sales-field-phone-shell .sales-hero-icon {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
}

.sales-field-phone-shell .sales-field-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.sales-field-phone-shell .sales-field-metric {
  gap: 4px;
  padding: 10px 8px;
  border-radius: 10px;
}

.sales-field-phone-shell .sales-field-metric strong {
  font-size: 20px;
}

.sales-field-phone-shell .sales-field-card,
.sales-field-phone-shell .sales-create-customer {
  padding: 13px;
  border-radius: 13px;
}

.sales-field-phone-shell .sales-quick-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.sales-field-phone-shell .sales-quick-actions button {
  min-height: 54px;
  flex-direction: column;
  padding: 7px 4px;
  font-size: 12px;
}

.sales-field-live-badge,
.sales-report-status,
.sales-stage-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 4px 9px;
  background: #e8f0ff;
  color: #2458b8;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.sales-field-hero {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 22px;
  border-radius: 18px;
  background: linear-gradient(135deg, #173b78, #2767d8);
  color: #fff;
  box-shadow: 0 12px 32px rgba(27, 73, 150, 0.18);
}

.sales-field-hero h3 {
  margin: 5px 0 4px;
  color: inherit;
  font-size: 24px;
}

.sales-field-hero p,
.sales-field-hero span {
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
}

.sales-hero-icon {
  align-self: center;
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.14);
}

.sales-hero-icon svg {
  width: 30px;
  height: 30px;
}

.sales-field-card,
.sales-create-customer {
  border: 1px solid #dce4f0;
  border-radius: 16px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(26, 47, 78, 0.06);
}

.sales-field-card.is-active-visit {
  border-color: #8ab1f7;
  box-shadow: 0 7px 24px rgba(39, 103, 216, 0.12);
}

.sales-field-card > p {
  margin: 7px 0;
}

.sales-field-metrics {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}

.sales-field-metric {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 14px;
  border: 1px solid #e1e7f0;
  border-radius: 13px;
  background: #fff;
}

.sales-field-metric span {
  color: #667085;
  font-size: 12px;
}

.sales-field-metric strong {
  color: #172033;
  font-size: 24px;
}

.sales-field-metric.is-good strong { color: #16845b; }
.sales-field-metric.is-accent strong { color: #285fca; }
.sales-field-metric.is-warning strong { color: #bd6518; }

.sales-section-title,
.sales-card-heading,
.sales-location-capture,
.sales-active-customer,
.sales-visit-history article,
.sales-report-list article > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.sales-section-title {
  margin-bottom: 14px;
}

.sales-section-title > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.sales-section-title h3 {
  margin: 0;
  font-size: 17px;
}

.sales-icon-box {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 10px;
  background: #edf3ff;
  color: #2767d8;
}

.sales-icon-box svg,
.sales-quick-actions svg,
.sales-location-capture button svg {
  width: 19px;
  height: 19px;
}

.sales-field-metrics + .sales-field-card,
.sales-field-hero + .sales-field-metrics {
  margin-top: 0;
}

.sales-quick-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.sales-quick-actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
}

.sales-customer-list,
.sales-visit-history,
.sales-report-list,
.sales-site-visit-list {
  display: grid;
  gap: 10px;
}

.sales-customer-card,
.sales-visit-history article,
.sales-report-list article,
.sales-site-visit-item {
  padding: 14px;
  border: 1px solid #e3e8f0;
  border-radius: 13px;
  background: #fbfcfe;
}

.sales-card-heading strong,
.sales-active-customer strong,
.sales-report-list strong,
.sales-site-visit-item strong {
  display: block;
  font-size: 16px;
}

.sales-card-heading small,
.sales-active-customer span,
.sales-active-customer small,
.sales-visit-history small,
.sales-report-list small,
.sales-site-visit-item small {
  display: block;
  margin-top: 3px;
  color: #667085;
  font-size: 12px;
}

.sales-customer-card dl,
.sales-site-visit-item dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
}

.sales-customer-card dl div,
.sales-site-visit-item dl div {
  min-width: 0;
}

.sales-customer-card dt,
.sales-site-visit-item dt {
  color: #7a8495;
  font-size: 11px;
}

.sales-customer-card dd,
.sales-site-visit-item dd {
  overflow: hidden;
  margin: 3px 0 0;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

.sales-card-note {
  padding: 9px 11px;
  border-radius: 9px;
  background: #f2f5f9;
  color: #475467;
  font-size: 13px;
}

.sales-inline-actions,
.sales-report-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.sales-inline-actions a,
.sales-inline-actions button {
  min-height: 36px;
  padding: 7px 12px;
  text-decoration: none;
}

.sales-inline-actions a,
.sales-inline-actions button,
.sales-visit-mode-switch button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.sales-inline-actions svg,
.sales-visit-mode-switch svg {
  width: 17px;
  height: 17px;
}

.sales-visit-mode-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 5px;
  border: 1px solid #d8e1ef;
  border-radius: 13px;
  background: #eaf0f8;
}

.sales-visit-mode-switch button {
  min-height: 44px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #5d6879;
  font-weight: 700;
}

.sales-visit-mode-switch button.is-active {
  background: #fff;
  color: #245fc8;
  box-shadow: 0 3px 10px rgba(36, 72, 120, 0.11);
}

.sales-create-customer summary {
  display: flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  list-style: none;
}

.sales-create-customer[open] summary {
  margin-bottom: 16px;
}

.sales-mobile-form {
  display: grid;
  gap: 12px;
}

.sales-mobile-form label {
  display: grid;
  gap: 6px;
  color: #3a4658;
  font-size: 13px;
  font-weight: 600;
}

.sales-mobile-form input,
.sales-mobile-form select,
.sales-mobile-form textarea,
.sales-search-row input {
  width: 100%;
  min-width: 0;
  border: 1px solid #cfd8e6;
  border-radius: 10px;
  background: #fff;
  color: #172033;
}

.sales-mobile-form input,
.sales-mobile-form select,
.sales-search-row input {
  min-height: 44px;
}

.sales-mobile-form textarea {
  min-height: 74px;
  resize: vertical;
}

.sales-photo-picker {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 54px;
  overflow: hidden;
  border: 1px dashed #7ba0df;
  border-radius: 12px;
  background: #f2f7ff;
  color: #245fc8;
}

.sales-photo-picker svg {
  width: 22px;
  height: 22px;
}

.sales-photo-picker input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
}

.sales-photo-previews {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  min-height: 70px;
  padding: 8px;
  border-radius: 11px;
  background: #f2f4f7;
  color: #707b8e;
  font-size: 12px;
}

.sales-customer-photo-preview {
  grid-template-columns: minmax(0, 150px);
}

.sales-photo-previews > span {
  grid-column: 1 / -1;
  align-self: center;
  text-align: center;
}

.sales-photo-previews figure {
  min-width: 0;
  margin: 0;
}

.sales-photo-previews img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 9px;
  object-fit: cover;
}

.sales-photo-previews figcaption {
  overflow: hidden;
  margin-top: 3px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-photo-viewer {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(6, 14, 27, 0.82);
}

.sales-photo-viewer > div {
  position: relative;
  max-width: min(920px, 100%);
  max-height: 94vh;
}

.sales-photo-viewer img {
  display: block;
  max-width: 100%;
  max-height: 90vh;
  border-radius: 14px;
  object-fit: contain;
}

.sales-photo-viewer button {
  position: absolute;
  z-index: 1;
  top: 8px;
  right: 8px;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: #172033;
  font-size: 26px;
  line-height: 1;
}

.sales-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.sales-form-help {
  margin: 0;
  color: #6b7280;
  font-size: 12px;
  line-height: 1.55;
}

.sales-location-capture {
  padding: 12px;
  border: 1px dashed #9bb8eb;
  border-radius: 12px;
  background: #f4f8ff;
}

.sales-location-capture strong,
.sales-location-capture small {
  display: block;
}

.sales-location-capture small {
  margin-top: 3px;
  color: #667085;
}

.sales-location-capture small.is-ready { color: #16845b; }

.sales-location-capture button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.sales-primary-action {
  min-height: 46px;
  background: #2767d8;
  color: #fff;
}

.sales-search-row {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}

.sales-empty,
.sales-readonly-banner,
.sales-field-feedback,
.sales-field-loading {
  padding: 14px;
  border-radius: 12px;
  background: #edf3fb;
  color: #536177;
  text-align: center;
}

.sales-readonly-banner {
  background: #fff5dc;
  color: #85500a;
  text-align: left;
}

.sales-field-feedback.is-success { background: #e8f7f0; color: #126342; }
.sales-field-feedback.is-error { background: #fff0ef; color: #a83a35; }

.sales-field-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 120px;
}

.sales-field-loading > span {
  width: 17px;
  height: 17px;
  border: 2px solid #b6c7e5;
  border-top-color: #2767d8;
  border-radius: 50%;
  animation: sales-field-spin .8s linear infinite;
}

.sales-report-status.is-submitted { background: #e5f7ee; color: #12704b; }
.sales-report-list article p { margin: 10px 0 0; color: #536177; font-size: 13px; }
.sales-report-actions > * { flex: 1 1 160px; }
.sales-active-customer { align-items: flex-start; flex-direction: column; margin-bottom: 14px; }
.sales-visit-history article > div:last-child { display: grid; justify-items: end; }

/* Issue #1273: icon-first English field workspace and auditable Google Maps panel. */
.sales-field-phone-shell .sales-field-hero {
  border: 1px solid #d7e5ff;
  background: #1768f2;
  box-shadow: 0 10px 24px rgba(23, 104, 242, 0.16);
}

.sales-home-actions,
.sales-customer-hub,
.sales-report-prompts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.sales-home-actions button,
.sales-customer-hub button,
.sales-report-prompts button {
  display: grid;
  justify-items: start;
  gap: 5px;
  min-width: 0;
  min-height: 112px;
  padding: 15px;
  border: 1px solid #d8e2f0;
  border-radius: 15px;
  background: #fff;
  color: #172033;
  text-align: left;
  box-shadow: 0 5px 14px rgba(27, 48, 78, 0.05);
}

.sales-home-actions button > span,
.sales-customer-hub button > span,
.sales-report-prompts button > span,
.sales-compact-actions button > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #eaf2ff;
  color: #1768f2;
}

.sales-home-actions svg,
.sales-customer-hub svg,
.sales-report-prompts svg,
.sales-compact-actions svg {
  width: 21px;
  height: 21px;
}

.sales-home-actions strong,
.sales-customer-hub strong,
.sales-report-prompts strong {
  font-size: 15px;
}

.sales-home-actions small,
.sales-customer-hub small,
.sales-report-prompts small {
  color: #6a7688;
  font-size: 11px;
  line-height: 1.4;
}

.sales-home-actions button:first-child,
.sales-customer-hub button.is-active {
  border-color: #9fc0fa;
  background: #f7faff;
}

.sales-compact-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.sales-compact-actions button {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 52px;
  padding: 8px 11px;
  border: 1px solid #d8e2f0;
  border-radius: 13px;
  background: #fff;
  color: #26364c;
  font-weight: 700;
}

.sales-compact-actions button > span {
  width: 30px;
  height: 30px;
}

.sales-today-summary .sales-field-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sales-customer-drawer {
  overflow: hidden;
  border: 1px solid #9fc0fa;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(27, 69, 132, 0.12);
}

.sales-customer-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px;
  border-bottom: 1px solid #e3eaf4;
}

.sales-customer-drawer-head > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.sales-customer-drawer-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: #eef3fb;
  color: #5d6b7f;
}

.sales-customer-drawer-close svg {
  width: 19px;
  height: 19px;
  transform: rotate(45deg);
}

.sales-section-title-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.sales-customer-drawer-head strong,
.sales-customer-drawer-head small {
  display: block;
}

.sales-customer-drawer-head small {
  margin-top: 2px;
  color: #6a7688;
  font-size: 11px;
}

.sales-customer-drawer-head > button {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: #eef3fb;
  color: #4b5a70;
  font-size: 23px;
}

.sales-customer-drawer .sales-mobile-form {
  padding: 14px;
}

/* Issue #1287: keep the selected customer form inside the phone scroller. */
.sales-customer-form-screen {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin-bottom: 12px;
  overflow: visible;
}

.sales-customer-form-screen .sales-mobile-form,
.sales-customer-form-screen .sales-form-more,
.sales-customer-form-screen .sales-form-more-body {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.sales-customer-form-screen .sales-mobile-form {
  padding-bottom: 24px;
}

.sales-customer-form-screen .sales-primary-action {
  width: 100%;
  min-height: 50px;
  scroll-margin-bottom: 24px;
}

.sales-form-more {
  overflow: hidden;
  border: 1px solid #dbe3ee;
  border-radius: 12px;
  background: #f8fafc;
}

.sales-form-more summary {
  padding: 12px;
  color: #31527d;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
}

.sales-form-more-body {
  display: grid;
  gap: 11px;
  padding: 0 12px 12px;
}

.sales-visit-mode-switch {
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
}

.sales-visit-mode-switch button {
  display: grid;
  justify-items: start;
  gap: 4px;
  min-height: 100px;
  padding: 14px;
  border: 1px solid #d8e2f0;
  border-radius: 14px;
  background: #fff;
  text-align: left;
}

.sales-visit-mode-switch button > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #eaf2ff;
  color: #1768f2;
}

.sales-visit-mode-switch button strong {
  font-size: 14px;
}

.sales-visit-mode-switch button small {
  color: #6a7688;
  font-size: 11px;
}

.sales-visit-mode-switch button.is-active {
  border-color: #8db5fb;
  background: #f5f9ff;
  box-shadow: 0 5px 16px rgba(23, 104, 242, 0.1);
}

.sales-photo-picker {
  min-height: 74px;
  flex-wrap: wrap;
  align-content: center;
  padding: 10px;
}

.sales-photo-picker small {
  width: 100%;
  color: #6d7b8f;
  text-align: center;
  font-size: 10px;
}

.sales-report-prompts {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sales-report-prompts button {
  min-height: 118px;
  padding: 12px;
}

.sales-report-open {
  width: 100%;
}

.sales-report-editor .sales-section-title > button {
  min-height: 34px;
}

/* Issue #1279: structured tomorrow visit points with mobile map pinning. */
.sales-report-points {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid #d8e4f5;
  border-radius: 14px;
  background: #f8fbff;
}

.sales-report-points-head,
.sales-report-points-head > div,
.sales-report-map-toolbar,
.sales-report-point-editor-head,
.sales-report-point-editor-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.sales-report-points-head {
  min-width: 0;
  flex-wrap: wrap;
}

.sales-report-points-head > div {
  min-width: 0;
  flex: 1 1 190px;
  justify-content: flex-start;
}

.sales-report-points-head > div > div {
  min-width: 0;
}

.sales-report-points-head strong,
.sales-report-points-head small,
.sales-report-point-editor-head strong,
.sales-report-point-editor-head small,
.sales-report-map-toolbar strong,
.sales-report-map-toolbar small {
  display: block;
}

.sales-report-points-head small,
.sales-report-point-editor-head small,
.sales-report-map-toolbar small {
  margin-top: 3px;
  color: #66758a;
  font-size: 11px;
  font-weight: 500;
  overflow-wrap: anywhere;
}

.sales-report-points-head > button,
.sales-report-map-toolbar > button,
.sales-report-point-actions a,
.sales-report-point-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid #c9daf7;
  border-radius: 10px;
  background: #fff;
  color: #245fc8;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.sales-report-points-head > button {
  max-width: 100%;
  flex: 0 0 auto;
}

.sales-report-points-head > button svg,
.sales-report-map-toolbar > button svg,
.sales-report-point-actions svg {
  width: 16px;
  height: 16px;
}

.sales-report-points-empty {
  padding: 13px;
  border: 1px dashed #b7c9e4;
  border-radius: 11px;
  background: #fff;
  color: #6a7688;
  text-align: center;
  font-size: 12px;
}

.sales-report-point-list {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.sales-report-point-card {
  min-width: 0;
  max-width: 100%;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: start;
  gap: 9px;
  padding: 11px;
  border: 1px solid #dce5f1;
  border-radius: 12px;
  background: #fff;
}

.sales-report-point-card > div {
  min-width: 0;
}

.sales-report-point-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #e8f1ff;
  color: #1768f2;
  font-weight: 800;
}

.sales-report-point-card strong,
.sales-report-point-card small {
  display: block;
  overflow-wrap: anywhere;
}

.sales-report-point-card small {
  margin-top: 3px;
  color: #66758a;
  font-size: 11px;
}

.sales-report-point-card p {
  margin: 6px 0 0;
  color: #475467;
  font-size: 12px;
}

.sales-report-point-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px;
}

.sales-field-phone-shell .sales-report-point-card {
  grid-template-columns: 28px minmax(0, 1fr);
}

.sales-field-phone-shell .sales-report-point-actions {
  grid-column: 2;
  justify-content: flex-start;
}

.sales-report-point-actions button.is-danger {
  border-color: #f1c7c3;
  color: #b23c34;
}

.sales-report-point-editor {
  display: grid;
  gap: 11px;
  padding: 13px;
  border: 1px solid #8eb5f5;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(31, 85, 165, 0.1);
}

.sales-report-point-editor > label,
.sales-report-point-grid label {
  display: grid;
  gap: 6px;
  color: #3a4658;
  font-size: 13px;
  font-weight: 600;
}

.sales-report-point-editor input,
.sales-report-point-editor select,
.sales-report-point-editor textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #cfd8e6;
  border-radius: 10px;
  background: #fff;
  color: #172033;
}

.sales-report-point-editor input,
.sales-report-point-editor select {
  min-height: 44px;
}

.sales-report-point-editor-head > button {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  background: #eef3fb;
  color: #506079;
  font-size: 22px;
}

.sales-report-point-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(110px, 0.6fr);
  gap: 9px;
}

.sales-report-map-toolbar {
  align-items: flex-end;
}

.sales-report-map-toolbar > button {
  flex: 0 0 auto;
}

.sales-report-map {
  position: relative;
  z-index: 0;
  min-height: 230px;
  overflow: hidden;
  border: 1px solid #cbd8ea;
  border-radius: 12px;
  background: #eef3f8;
}

.sales-report-map-loading,
.sales-report-map-error {
  display: grid;
  min-height: 230px;
  place-items: center;
  padding: 20px;
  color: #637188;
  text-align: center;
  font-size: 12px;
}

.sales-report-point-editor-actions > * {
  flex: 1 1 0;
}

.sales-report-actions .ghost-button {
  border: 1px solid #9dbcf0;
  background: #fff;
  color: #245fc8;
}

.sales-report-actions .sales-primary-action {
  background: #2767d8;
  color: #fff;
}

/* Issue #1283: keep report actions in view and show save/submit results where the tap happened. */
.sales-report-editor,
.sales-report-editor .sales-mobile-form,
.sales-report-actions {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.sales-report-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sales-report-actions > * {
  min-width: 0;
}

.sales-report-submit-feedback {
  padding: 11px 12px;
  border: 1px solid #c7d9f5;
  border-radius: 10px;
  background: #eef4ff;
  color: #2458b8;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  overflow-wrap: anywhere;
}

.sales-report-submit-feedback[hidden] {
  display: none;
}

.sales-report-submit-feedback.is-success {
  border-color: #b8e4ce;
  background: #e8f7f0;
  color: #126342;
}

.sales-report-submit-feedback.is-error {
  border-color: #f1c7c3;
  background: #fff0ef;
  color: #a83a35;
}

.sales-report-actions button:disabled {
  cursor: wait;
  opacity: 0.68;
}

.sales-report-admin-points {
  margin-top: 10px;
  border-top: 1px solid #e3e8f0;
}

.sales-report-admin-points summary {
  padding: 10px 0 2px;
  color: #31527d;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.sales-report-admin-points .sales-report-point-list,
.sales-report-admin-points .sales-report-points-empty {
  margin-top: 8px;
}

.sales-management-map-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(260px, 0.8fr);
  min-height: 420px;
}

.sales-management-map-canvas {
  position: relative;
  min-width: 0;
  min-height: 420px;
  background: #edf2f7;
}

.sales-management-map-canvas iframe {
  width: 100%;
  height: 420px;
  border: 0;
}

.sales-management-map-empty {
  display: grid;
  place-items: center;
  min-height: 420px;
  padding: 24px;
  color: #667085;
  text-align: center;
}

.sales-management-map-detail {
  position: absolute;
  right: 14px;
  bottom: 14px;
  left: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(205, 218, 235, 0.95);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 10px 26px rgba(23, 40, 66, 0.15);
}

.sales-management-map-detail span,
.sales-management-map-detail strong,
.sales-management-map-detail small {
  display: block;
}

.sales-management-map-detail span {
  color: #1768f2;
  font-size: 11px;
  font-weight: 800;
}

.sales-management-map-detail strong {
  margin-top: 2px;
  font-size: 15px;
}

.sales-management-map-detail small {
  margin-top: 3px;
  color: #667085;
  font-size: 11px;
}

.sales-management-map-detail a {
  min-height: 38px;
  text-decoration: none;
  white-space: nowrap;
}

.sales-management-map-activity {
  max-height: 420px;
  overflow: auto;
  border-left: 1px solid #e3e8f0;
  background: #fff;
}

.sales-management-map-activity > button {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  padding: 12px;
  border: 0;
  border-bottom: 1px solid #e8edf4;
  background: #fff;
  color: #172033;
  text-align: left;
}

.sales-management-map-activity > button:hover,
.sales-management-map-activity > button.is-active {
  background: #f1f6ff;
}

.sales-management-map-activity > button > span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border-radius: 50%;
  background: #1768f2;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}

.sales-management-map-activity strong,
.sales-management-map-activity small,
.sales-management-map-activity em {
  display: block;
}

.sales-management-map-activity small {
  margin-top: 2px;
  color: #4b5a70;
  font-size: 11px;
}

.sales-management-map-activity em {
  margin-top: 3px;
  color: #7a8495;
  font-size: 10px;
  font-style: normal;
}

/* Issue #1281: auditable B2B travel claims and owner review. */
.sales-expense-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) auto auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid #dce4ef;
  border-radius: 10px;
  background: #f8fafc;
}

.sales-expense-filters label,
.sales-travel-date label {
  display: grid;
  gap: 5px;
  color: #475467;
  font-size: 12px;
  font-weight: 700;
}

.sales-expense-filters input,
.sales-expense-filters select,
.sales-travel-date input {
  min-height: 40px;
}

.sales-expense-admin-list,
.sales-transport-list {
  display: grid;
  gap: 10px;
}

.sales-expense-admin-card,
.sales-transport-card {
  display: grid;
  gap: 11px;
  padding: 14px;
  border: 1px solid #dce4ef;
  border-radius: 13px;
  background: #fff;
}

.sales-expense-admin-card.is-risk,
.sales-transport-card.is-risk {
  border-color: #f0b37d;
  background: #fffbf5;
}

.sales-expense-admin-head,
.sales-expense-route,
.sales-expense-admin-actions,
.sales-travel-date {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.sales-expense-admin-head > div:last-child {
  display: grid;
  justify-items: end;
  gap: 5px;
}

.sales-expense-admin-head strong,
.sales-expense-admin-head small,
.sales-expense-route strong,
.sales-expense-route small {
  display: block;
}

.sales-expense-admin-head small,
.sales-expense-route small {
  margin-top: 3px;
  color: #667085;
  font-size: 11px;
}

.sales-expense-route {
  justify-content: flex-start;
}

.sales-expense-route > span {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border-radius: 10px;
  background: #eaf2ff;
  color: #1768f2;
}

.sales-expense-route svg,
.sales-transport-evidence svg {
  width: 19px;
  height: 19px;
}

.sales-transport-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.sales-transport-evidence > span {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 1px 7px;
  min-width: min(220px, 100%);
  padding: 8px 10px;
  border-radius: 10px;
  background: #f1f5fb;
  color: #31527d;
}

.sales-transport-evidence > span > svg {
  grid-row: 1 / 3;
}

.sales-transport-evidence strong,
.sales-transport-evidence small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-transport-evidence small {
  color: #708096;
  font-size: 10px;
}

.sales-transport-status {
  display: inline-flex;
  width: fit-content;
  padding: 4px 9px;
  border-radius: 999px;
  background: #eef3fb;
  color: #55647a;
  font-size: 11px;
  font-weight: 800;
}

.sales-transport-status.is-approved,
.sales-transport-status.is-paid { background: #e7f7ef; color: #14704c; }
.sales-transport-status.is-rejected { background: #fff0ef; color: #a83a35; }
.sales-transport-status.is-submitted { background: #fff4df; color: #965711; }

.sales-expense-risk,
.sales-expense-review-note {
  padding: 9px 10px;
  border-radius: 9px;
  background: #fff0df;
  color: #92551b;
  font-size: 12px;
}

.sales-expense-review-note {
  background: #f1f5fb;
  color: #516075;
}

.sales-expense-admin-actions {
  justify-content: flex-end;
}

.sales-expense-admin-actions button {
  min-height: 38px;
}

.sales-expense-admin-actions .is-danger {
  border-color: #efc0bd;
  color: #b33d36;
}

.sales-travel-date {
  padding: 11px 12px;
  border: 1px solid #dce4ef;
  border-radius: 12px;
  background: #fff;
}

.sales-travel-date label {
  flex: 1 1 auto;
}

.sales-travel-date .ghost-button {
  border-color: #9dbcf0;
  background: #fff;
  color: #245fc8;
}

.sales-travel-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.sales-travel-summary > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px;
  border: 1px solid #e0e6ef;
  border-radius: 10px;
}

.sales-travel-summary span { color: #667085; font-size: 10px; }
.sales-travel-summary strong { overflow-wrap: anywhere; font-size: 15px; }

.sales-transport-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.sales-transport-activities {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 11px;
  border: 1px solid #d8e2f0;
  border-radius: 12px;
}

.sales-transport-activities legend {
  padding: 0 5px;
  color: #3a4658;
  font-size: 13px;
  font-weight: 700;
}

.sales-transport-activities > p {
  margin: 0 0 3px;
  color: #6a7688;
  font-size: 11px;
}

.sales-transport-activities > label {
  display: grid;
  grid-template-columns: auto 28px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 9px;
  border: 1px solid #e1e7f0;
  border-radius: 10px;
  background: #f8fafc;
}

.sales-transport-activities input {
  width: 18px;
  height: 18px;
}

.sales-transport-activities svg { width: 20px; height: 20px; color: #1768f2; }
.sales-transport-activities strong,
.sales-transport-activities small { display: block; }
.sales-transport-activities small { margin-top: 2px; color: #6a7688; font-size: 10px; }

.sales-transport-card .sales-card-heading > div strong {
  font-size: 19px;
}

.sales-travel-no-evidence strong,
.sales-travel-no-evidence p { display: block; margin: 0 0 7px; }

@keyframes sales-field-spin { to { transform: rotate(360deg); } }

@media (max-width: 900px) {
  .sales-expense-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sales-management-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sales-management-exceptions { grid-template-columns: 1fr; }
  .sales-management-map-layout { grid-template-columns: 1fr; }
  .sales-management-map-activity { max-height: 260px; border-top: 1px solid #e3e8f0; border-left: 0; }
  .sales-customer-stage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .sales-customer-stage-grid article { border: 1px solid #e3e8f0; border-radius: 8px; }
  .sales-field-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  body[data-session-role="sales_representative"] .forced-password-change-overlay.is-sales-mobile {
    align-items: stretch;
    padding: 0;
    background: #f6f8fc;
    backdrop-filter: none;
  }

  body[data-session-role="sales_representative"] .forced-password-change-card.is-sales-mobile {
    width: 100%;
    max-width: none;
    min-height: 100vh;
    min-height: 100svh;
    max-height: none;
    padding: calc(30px + env(safe-area-inset-top)) 24px calc(28px + env(safe-area-inset-bottom));
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .sales-management-toolbar { align-items: stretch; flex-direction: column; }
  .sales-management-toolbar form { align-items: stretch; flex-wrap: wrap; }
  .sales-management-toolbar label { align-items: flex-start; flex-direction: column; }
  .sales-management-toolbar input { width: 100%; }

  body[data-session-role="sales_representative"] {
    background: #f6f8fc;
  }

  body[data-session-role="sales_representative"] .app-shell {
    width: 100%;
    margin: 0;
    padding: 0;
  }

  body[data-session-role="sales_representative"] .workspace-top-panel,
  body[data-session-role="sales_representative"] .workspace-side-panel {
    display: none !important;
  }

  body[data-session-role="sales_representative"] .workspace-shell {
    display: block;
    width: 100%;
  }

  body[data-session-role="sales_representative"] #workspacePanels {
    display: block;
    width: 100%;
    padding: 0;
  }

  body[data-session-role="sales_representative"] .sales-field-panel {
    height: 100vh;
    height: 100svh;
    min-height: 100vh;
    min-height: 100svh;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
  }

  body[data-session-role="sales_representative"] .sales-field-page-head {
    display: none;
  }

  body[data-session-role="sales_representative"] .sales-field-phone-shell {
    width: 100%;
    height: 100vh;
    height: 100svh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  body[data-session-role="sales_representative"] .sales-field-phone-body {
    padding-bottom: calc(22px + env(safe-area-inset-bottom));
    overscroll-behavior-y: auto;
    touch-action: pan-y;
  }

  .sales-field-mobile-nav {
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(12px);
  }

  .sales-field-mobile-nav button {
    display: grid;
    justify-items: center;
    gap: 2px;
    min-height: 48px;
    padding: 4px;
    border: 0;
    background: transparent;
    color: #788397;
  }

  .sales-field-mobile-nav button.is-active { color: #2767d8; }
  .sales-field-mobile-nav span { width: 23px; height: 23px; }
  .sales-field-mobile-nav svg { width: 22px; height: 22px; }
  .sales-field-mobile-nav small { font-size: 11px; font-weight: 700; }

  .sales-field-hero { padding: 18px; border-radius: 16px; }
  .sales-field-hero h3 { font-size: 20px; }
  .sales-hero-icon { width: 46px; height: 46px; flex-basis: 46px; }
  .sales-hero-icon svg { width: 25px; height: 25px; }
  .sales-field-card, .sales-create-customer { padding: 14px; border-radius: 14px; }
  .sales-field-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .sales-field-metric { padding: 11px 9px; gap: 4px; border-radius: 11px; }
  .sales-field-metric strong { font-size: 21px; }
  .sales-quick-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
  .sales-quick-actions button { min-height: 58px; flex-direction: column; padding: 8px 4px; font-size: 12px; }
  .sales-form-row { grid-template-columns: 1fr; }
  .sales-customer-card dl, .sales-site-visit-item dl { grid-template-columns: 1fr 1fr; }
  .sales-location-capture { align-items: flex-start; }
  .sales-location-capture button { min-height: 42px; }
  .sales-report-prompts { grid-template-columns: 1fr; }
  .sales-report-prompts button { min-height: 78px; grid-template-columns: auto 1fr; column-gap: 10px; }
  .sales-report-prompts button > span { grid-row: 1 / 3; }
  .sales-report-points { padding: 11px; }
  .sales-report-points-head { align-items: flex-start; }
  .sales-report-points-head > button { flex: 0 0 auto; }
  .sales-report-point-card { grid-template-columns: 28px minmax(0, 1fr); }
  .sales-report-point-actions { grid-column: 2; justify-content: flex-start; }
  .sales-report-point-grid { grid-template-columns: 1fr; }
  .sales-report-map-toolbar { align-items: stretch; flex-direction: column; }
  .sales-report-map-toolbar > button { width: 100%; }
  .sales-report-map { min-height: 250px; }
  .sales-management-map-detail { position: static; border: 0; border-radius: 0; box-shadow: none; }

  .auth-card {
    width: min(100%, 420px);
  }

  #loginForm input,
  #loginSubmitButton {
    min-height: 48px;
  }
}

@media (max-width: 390px) {
  .sales-management-kpis,
  .sales-customer-stage-grid { grid-template-columns: 1fr; }
  .sales-field-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sales-quick-actions { grid-template-columns: 1fr; }
  .sales-quick-actions button { min-height: 46px; flex-direction: row; }
  .sales-home-actions,
  .sales-customer-hub { gap: 7px; }
  .sales-home-actions button,
  .sales-customer-hub button { min-height: 104px; padding: 12px; }
  .sales-transport-grid { grid-template-columns: 1fr; }
  .sales-field-mobile-nav { padding-right: 3px; padding-left: 3px; }
  .sales-field-mobile-nav button { padding-right: 1px; padding-left: 1px; }
  .sales-field-mobile-nav small { font-size: 9px; }
}