:root {
  --ui-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Arial, "Noto Sans SC", sans-serif;
  --number-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Arial, sans-serif;
}

.ui-icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.nav-item .nav-icon {
  display: inline-grid;
  flex: 0 0 20px;
  width: 20px !important;
  height: 20px;
  place-items: center;
}

.nav-item .nav-icon svg {
  display: block;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.sidebar .nav-item {
  gap: 11px;
}

.sidebar .nav-item.active .nav-icon,
.sidebar .nav-item:hover .nav-icon {
  color: #245fd3;
}

.mobile-bottom-nav .nav-item .nav-icon {
  height: 21px;
}

.mobile-bottom-nav .nav-item .nav-icon svg {
  width: 20px;
  height: 20px;
}

body,
button,
input,
select,
textarea {
  font-family: var(--ui-font);
}

/* Data-heavy areas use the native system numerals. This removes the square,
   monospaced zero used by the previous DM Mono stack. */
.stat-card strong,
.warehouse-summary b,
.traceability-summary b,
.dashboard-alert-metrics b,
.rank-number,
.y-axis,
.days,
.location-code,
.count-session-head b,
.alert-badge,
.cell-sub,
.trend-day small,
td:first-child,
table,
input[type="number"],
input[type="date"] {
  font-family: var(--number-font) !important;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "zero" 0;
  font-variant-alternates: normal;
}

textarea {
  min-height: 72px;
  padding: 9px;
  border: 1px solid #dde3ec;
  border-radius: 6px;
  resize: vertical;
  color: #334158;
  line-height: 1.55;
}

.compact-stats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.traceability-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.traceability-summary article {
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.traceability-summary small,
.traceability-summary b {
  display: block;
}

.traceability-summary small {
  margin-bottom: 7px;
  color: var(--muted);
}

.traceability-summary b {
  color: #233a64;
  font-size: 24px;
  letter-spacing: -.3px;
}

.cell-sub {
  display: block;
  margin-top: 4px;
  color: #929cad;
  font-size: 10px;
  font-weight: 400;
}

.badge.warn {
  background: #fff5d9;
  color: #b0710b;
}

.badge.sale {
  background: #edf3ff;
  color: #3769d6;
}

.badge.neutral {
  background: #f1f3f6;
  color: #687386;
}

.modal-tracking-tip,
.field-help {
  display: block;
  color: #8993a3;
  font-size: 11px;
  line-height: 1.55;
}

.modal-tracking-tip {
  grid-column: 1 / -1;
  padding: 9px 11px;
  border-radius: 7px;
  background: #f2f6ff;
  color: #44628f;
}

.warehouse-access-fields {
  margin: 0;
  padding: 13px;
  border: 1px solid #e0e5ed;
  border-radius: 8px;
}

.warehouse-access-fields legend {
  padding: 0 5px;
  color: #536176;
  font-size: 12px;
}

.warehouse-access-all {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 7px !important;
  font-weight: 600;
}

.warehouse-access-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 11px 0;
  padding: 11px;
  border-radius: 7px;
  background: #f7f9fc;
}

.warehouse-access-options label {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 7px !important;
}

.warehouse-access-options.disabled {
  opacity: .45;
  pointer-events: none;
}

.warehouse-access-fields input[type="checkbox"],
.settings-switches input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
}

#warehouseRuleForm input:disabled {
  color: #8d96a6;
  background: #f3f5f8;
}

.document-route {
  display: grid;
  gap: 3px;
  white-space: normal;
  min-width: 140px;
}

.document-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.document-actions .text-btn {
  white-space: nowrap;
}

.nav-count {
  min-width: 19px;
  height: 19px;
  margin-left: auto;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: #ee6c4d;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
}

.trial-summary {
  min-width: 84px;
  padding: 9px 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid #dce6f7;
  border-radius: 10px;
  background: #f6f9ff;
}

.trial-summary span {
  color: #758199;
  font-size: 11px;
}

.trial-summary b {
  color: #326ff1;
  font-size: 20px;
}

.provisioning-cell {
  min-width: 180px;
}

.provisioning-state {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

.provisioning-state small {
  width: 100%;
  color: #758199;
  line-height: 1.4;
}

.provisioning-state .badge {
  white-space: nowrap;
}

.provisioning-modal {
  width: min(640px, calc(100vw - 28px));
}

.provisioning-warning {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #fff6e8;
  color: #8a581b;
  font-size: 12px;
}

.credential-card {
  display: grid;
  gap: 12px;
  margin-top: 18px;
  padding: 16px;
  border: 1px solid #dfe6f0;
  border-radius: 13px;
  background: #f7f9fc;
}

.credential-card label {
  display: grid;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
}

.credential-card input {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid #dfe6f0;
  border-radius: 9px;
  background: #fff;
  font: inherit;
}

.credentials-modal {
  width: min(520px, calc(100vw - 28px));
}

@media (max-width: 1180px) {
  .compact-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .compact-stats,
  .traceability-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .compact-stats .stat-card {
    min-height: 108px;
  }

  .warehouse-access-options {
    grid-template-columns: 1fr;
  }

  #products .subbar .secondary {
    flex: 1 1 calc(50% - 5px);
  }
}

@media (max-width: 420px) {
  .traceability-summary {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .traceability-summary article {
    padding: 14px;
  }
}

.onboarding-panel{margin-bottom:18px;background:linear-gradient(135deg,#f7faff,#fff);border-color:#dbe6fb}.onboarding-panel .eyebrow{display:block;margin-bottom:5px;color:#326ff1}.onboarding-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.onboarding-step{min-width:0;display:flex;align-items:center;gap:9px;padding:12px;border:1px solid #dfe6f1;border-radius:9px;background:#fff;text-align:left;color:#536074;cursor:pointer}.onboarding-step:hover{border-color:#8eb0f8}.onboarding-step i{display:grid;place-items:center;width:25px;height:25px;flex:0 0 auto;border-radius:50%;background:#edf3ff;color:#326ff1;font-style:normal;font-weight:700}.onboarding-step span{min-width:0;display:flex;flex-direction:column}.onboarding-step b{font-size:12px;color:#25324a}.onboarding-step small{font-size:10px;color:#8a95a7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.onboarding-step em{display:none}.onboarding-step.done{background:#f3fbf8;border-color:#d9eee7}.onboarding-step.done i{background:#dff5ed;color:#169471}@media(max-width:1100px){.onboarding-steps{grid-template-columns:1fr 1fr}}@media(max-width:600px){.onboarding-steps{grid-template-columns:1fr}.onboarding-step em{display:block;margin-left:auto;font-size:10px;font-style:normal;color:#326ff1}}