/* NextGen Inventory — front-end module. Mirrors the JS embed look so a
   WordPress module and a raw-code embed are visually identical. Theme it by
   overriding the --ngs-* custom properties. */
.ngs-inv {
  --ngs-fg: #111827;
  --ngs-muted: #6b7280;
  --ngs-border: #e5e7eb;
  --ngs-card-bg: #fbfbfc;
  --ngs-bar: #111827;
  --ngs-accent: #0d6efd;
  --ngs-ok-bg: #dcfce7;
  --ngs-ok-fg: #15803d;
  --ngs-low-bg: #fef3c7;
  --ngs-low-fg: #b45309;
  font-family: inherit;
  color: var(--ngs-fg);
  max-width: 460px;
  font-size: 14px;
  line-height: 1.45;
}
.ngs-inv__title {
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -.01em;
  margin: 0;
  color: var(--ngs-fg);
}
.ngs-inv__title::after {
  content: "";
  display: block;
  width: 64px;
  height: 5px;
  border-radius: 3px;
  background: var(--ngs-bar);
  margin-top: 10px;
}
.ngs-inv__card {
  border: 1px solid var(--ngs-border);
  border-radius: 12px;
  background: var(--ngs-card-bg);
  overflow: hidden;
  margin-top: 16px;
}
.ngs-inv__row { padding: 14px 18px; }
.ngs-inv__row + .ngs-inv__row { border-top: 1px solid var(--ngs-border); }
.ngs-inv__label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ngs-muted);
}
.ngs-inv__value {
  font-size: 20px;
  font-weight: 700;
  color: var(--ngs-fg);
  margin-top: 3px;
}
.ngs-inv__sublabel {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ngs-muted);
  margin-top: 2px;
}
.ngs-inv__pill {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
}
.ngs-inv__pill--in, .ngs-inv__pill--high { background: var(--ngs-ok-bg); color: var(--ngs-ok-fg); }
.ngs-inv__pill--low { background: var(--ngs-low-bg); color: var(--ngs-low-fg); }
.ngs-inv__pill--out { background: #f3f4f6; color: #6b7280; }
.ngs-inv__ship {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 3px;
}
.ngs-inv__ship + .ngs-inv__ship { margin-top: 8px; }
.ngs-inv__ship-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 16px;
  font-weight: 600;
  color: var(--ngs-fg);
}
.ngs-inv__ico { flex: none; color: var(--ngs-muted); }
.ngs-inv__dash { color: var(--ngs-muted); }
.ngs-inv__note { color: var(--ngs-muted); font-size: 14px; margin-top: 3px; }
.ngs-inv__foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
  color: var(--ngs-muted);
  font-size: 12px;
}
.ngs-inv__refresh {
  background: none;
  border: 0;
  color: var(--ngs-accent);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  padding: 2px 4px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ngs-inv__refresh:hover { text-decoration: underline; }
.ngs-inv__refresh[disabled] { opacity: .5; cursor: default; }
.ngs-inv--loading { opacity: .6; }
.ngs-inv__err { color: #b91c1c; font-size: 14px; }
