:root {
  --bg: #f5f7f8;
  --panel: #ffffff;
  --line: #d9e0e3;
  --text: #172026;
  --muted: #61717a;
  --accent: #0f766e;
  --accent-strong: #0b5f59;
  --warning: #b45309;
  --danger: #b91c1c;
  --ok: #166534;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 14px;
  letter-spacing: 0;
}

html.cloud-locked,
body.cloud-locked {
  overflow: hidden;
}

.cloud-gate {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 8px 12px;
  background:
    radial-gradient(circle at 22% 16%, rgba(15, 118, 110, 0.10), transparent 28%),
    linear-gradient(135deg, rgba(239, 247, 247, 0.96), rgba(248, 251, 251, 0.94));
  backdrop-filter: blur(4px);
}

.cloud-login-shell {
  width: min(1180px, calc(100vw - 48px));
  height: min(604px, calc(100vh - 16px));
  max-height: calc(100vh - 16px);
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(390px, 0.88fr);
  overflow: hidden;
  border: 1px solid #cbdde1;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.16);
}

.cloud-login-pitch {
  display: grid;
  grid-template-rows: 1fr auto auto;
  align-content: stretch;
  align-items: center;
  gap: 22px;
  min-height: 0;
  padding: 42px 56px;
  background:
    linear-gradient(112deg, rgba(255, 255, 255, 0.90) 0 22%, transparent 22% 100%),
    linear-gradient(108deg, transparent 0 42%, rgba(255, 255, 255, 0.26) 42% 52%, transparent 52% 100%),
    linear-gradient(116deg, transparent 0 58%, rgba(94, 234, 212, 0.28) 58% 64%, transparent 64% 100%),
    linear-gradient(135deg, #fbfffc 0%, #e8f8ef 20%, #cfefff 52%, #bad7ff 100%);
  color: #123940;
}

.cloud-login-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  width: max-content;
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.cloud-login-brand strong,
.cloud-login-brand span {
  display: block;
}

.cloud-login-brand strong {
  color: #0f2f3a;
  font-size: 17px;
  font-weight: 850;
  line-height: 1.1;
}

.cloud-login-brand span {
  margin-top: 3px;
  color: #4f6c74;
  font-size: 11px;
  font-weight: 650;
}

.cloud-login-logo {
  width: 52px;
  height: 52px;
  padding: 6px;
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(15, 64, 70, 0.12);
}

.cloud-mark.cloud-login-logo {
  width: 52px;
  height: 52px;
}

.accountbook-logo-frame {
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 10px;
  background: #fff;
}

.accountbook-logo-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cloud-hero-copy {
  display: grid;
  gap: 12px;
  max-width: 590px;
}

.cloud-login-pitch h1 {
  max-width: 520px;
  margin: 0;
  color: #143d44;
  font-size: 32px;
  line-height: 1.07;
  font-weight: 850;
}

.cloud-login-pitch p {
  max-width: 520px;
  margin: 0;
  color: #315d66;
  font-size: 15px;
  line-height: 1.55;
}

.cloud-keyword-list {
  display: flex;
  flex-wrap: wrap;
  align-self: start;
  gap: 18px;
  margin-top: 4px;
}

.cloud-keyword-list span {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #155f5a;
  font-size: 13px;
  font-weight: 750;
}

.cloud-pitch-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 2px;
}

.cloud-pitch-points span {
  display: grid;
  gap: 4px;
  min-height: 74px;
  padding: 12px;
  border: 1px solid rgba(216, 239, 236, 0.26);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.10);
}

.cloud-pitch-points strong {
  color: #ffffff;
  font-size: 14px;
  line-height: 1.18;
}

.cloud-pitch-points em {
  color: #cce9e5;
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}

.cloud-card {
  width: 100%;
  display: grid;
  gap: 8px;
  padding: 22px 64px;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  overflow: hidden;
}

.cloud-login-card {
  align-content: center;
  min-width: 0;
}

.cloud-login-card-head {
  display: grid;
  gap: 5px;
}

.cloud-login-card-mark {
  display: flex;
  justify-content: center;
}

.cloud-login-card-mark .cloud-mark {
  width: 104px;
  height: 104px;
  padding: 8px;
  background: #f7fbfb;
  border: 1px solid #d8e6ea;
  border-radius: 12px;
}

.cloud-login-card-mark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cloud-login-actions {
  display: grid;
  gap: 5px;
}

.cloud-login-actions button,
.cloud-login-card .cloud-setup-form button {
  width: 100%;
}

.cloud-login-note {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.cloud-build-credit {
  margin: 0;
  padding-top: 7px;
  border-top: 1px solid #edf2f3;
  color: #7a8b93;
  font-size: 11px;
  line-height: 1.3;
}

.cloud-build-credit strong {
  color: #33464d;
  font-weight: 800;
}

.cloud-pitch-credit {
  align-self: end;
  width: max-content;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid rgba(15, 118, 110, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.42);
  color: #315d66;
  box-shadow: 0 10px 24px rgba(15, 64, 70, 0.08);
}

.cloud-pitch-credit strong {
  color: #0f4d4a;
}

.cloud-login-actions .small {
  border-color: transparent;
  background: transparent;
  color: #0f766e;
  font-weight: 750;
  box-shadow: none;
}

.cloud-login-actions .small:hover {
  border-color: #d6e7e8;
  background: #f3faf8;
}

.google-auth-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}

.google-auth-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

button.google-auth-button:disabled .google-auth-icon {
  filter: grayscale(1);
  opacity: 0.55;
}

.cloud-mark {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--accent);
  color: #fff;
  font-weight: 850;
}

.accountbook-logo-mark {
  position: relative;
  overflow: hidden;
  background: #0f766e;
  box-shadow: 0 10px 24px rgba(15, 118, 110, 0.24);
}

.accountbook-logo-mark::after {
  content: "";
  position: absolute;
  inset: -40% -65%;
  background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, 0.26) 48%, transparent 60%);
  transform: translateX(-60%) rotate(8deg);
  animation: accountbookLogoSheen 3.8s ease-in-out infinite;
}

.accountbook-logo {
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  overflow: visible;
}

.accountbook-logo-base {
  fill: #0f766e;
}

.accountbook-logo-shadow {
  fill: none;
  stroke: rgba(2, 48, 44, 0.28);
  stroke-width: 3;
  stroke-linecap: round;
}

.accountbook-logo-book {
  fill: #e8fffa;
}

.accountbook-logo-book-right {
  fill: #c8f4ec;
}

.accountbook-logo-page {
  fill: #ffffff;
  transform-box: fill-box;
  transform-origin: 100% 50%;
  animation: accountbookPageTurn 3.2s ease-in-out infinite;
}

.accountbook-logo-line,
.accountbook-logo-check {
  fill: none;
  stroke: #0f766e;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.accountbook-logo-line {
  stroke-width: 2;
  stroke-dasharray: 14;
  animation: accountbookLineWrite 3.2s ease-in-out infinite;
}

.accountbook-logo-check {
  stroke: #0b5f59;
  stroke-width: 3;
  stroke-dasharray: 18;
  animation: accountbookCheckPop 3.2s ease-in-out infinite;
}

.accountbook-logo-line.line-two { animation-delay: 0.12s; }
.accountbook-logo-line.line-three { animation-delay: 0.24s; }

@keyframes accountbookLogoSheen {
  0%, 42% { transform: translateX(-65%) rotate(8deg); opacity: 0; }
  52% { opacity: 1; }
  78%, 100% { transform: translateX(65%) rotate(8deg); opacity: 0; }
}

@keyframes accountbookPageTurn {
  0%, 100% { transform: perspective(80px) rotateY(0deg); }
  44% { transform: perspective(80px) rotateY(-13deg); }
  58% { transform: perspective(80px) rotateY(0deg); }
}

@keyframes accountbookLineWrite {
  0%, 25% { stroke-dashoffset: 14; opacity: 0.45; }
  45%, 100% { stroke-dashoffset: 0; opacity: 1; }
}

@keyframes accountbookCheckPop {
  0%, 45% { stroke-dashoffset: 18; opacity: 0; transform: scale(0.92); }
  62% { stroke-dashoffset: 0; opacity: 1; transform: scale(1.04); }
  78%, 100% { stroke-dashoffset: 0; opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .accountbook-logo-mark::after,
  .accountbook-logo-page,
  .accountbook-logo-line,
  .accountbook-logo-check {
    animation: none;
  }
}

.cloud-card h2 {
  margin: 0;
  font-size: 24px;
  line-height: 1.16;
}

.cloud-card p {
  margin: 0;
  color: var(--muted);
}

.cloud-error {
  padding: 10px 12px;
  border: 1px solid #fecaca;
  border-radius: 8px;
  background: #fff1f2;
  color: #b91c1c;
  font-size: 13px;
}

.cloud-status {
  min-width: 238px;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  padding: 6px 8px;
  border: 1px solid #d5e4e7;
  border-radius: 9px;
  background: #fbfdfd;
  box-shadow: none;
}

.cloud-status .cloud-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #94a3b8;
}

.cloud-status.online .cloud-dot { background: var(--ok); }
.cloud-status.saving .cloud-dot { background: #f59e0b; }
.cloud-status.error .cloud-dot { background: var(--danger); }

.cloud-status-google {
  width: 18px;
  height: 18px;
  margin-left: -2px;
}

.cloud-status > div {
  min-width: 0;
  display: grid;
  gap: 1px;
  margin-right: auto;
}

.cloud-status strong {
  color: #38525a;
  font-size: 10.5px;
  line-height: 1.1;
  font-weight: 700;
  text-transform: uppercase;
}

.cloud-status em {
  max-width: 132px;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-workspace-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 150px;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid #cddfe3;
  border-radius: 7px;
  background: #fff;
  color: #244650;
  font-size: 11.5px;
  font-weight: 750;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.staff-workspace-mode .topbar {
  align-items: flex-start;
  padding-top: 16px;
  padding-bottom: 16px;
}

body.staff-workspace-mode .topbar-actions {
  align-items: flex-start;
  gap: 8px;
}

body.staff-workspace-mode .cloud-status {
  order: 1;
  min-width: 300px;
  min-height: 46px;
  padding: 7px 10px 7px 12px;
  border-color: #b9ddd6;
  background: linear-gradient(180deg, #ffffff 0%, #f1fbf8 100%);
  box-shadow: 0 7px 18px rgba(15, 23, 42, 0.05);
}

body.staff-workspace-mode .cloud-status > div {
  gap: 2px;
}

body.staff-workspace-mode .cloud-status strong {
  color: #0f766e;
  font-size: 10px;
}

body.staff-workspace-mode .cloud-status em {
  max-width: 250px;
  color: #163b43;
  font-size: 12px;
  font-weight: 700;
}

body.staff-workspace-mode .cloud-workspace-chip {
  max-width: 170px;
  border-color: #b9ddd6;
  background: #effaf8;
  color: #0f766e;
}

body.staff-workspace-mode .cloud-preview-role {
  order: 2;
  width: 102px;
  min-width: 102px;
  border-color: #cbdde1;
  background: #fff;
  color: #334155;
}

body.staff-workspace-mode #cloudLogoutBtn {
  order: 3;
  min-height: 32px;
  background: #fff;
}

body.staff-workspace-mode .topbar-date-control {
  display: none;
}

.mini-select {
  width: 130px;
  min-width: 100px;
  min-height: 28px;
  padding: 0 24px 0 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 650;
}

.cloud-preview-role {
  width: 104px;
  min-width: 104px;
  border-color: #c7e5df;
  background: #f0fbf8;
  color: #075d56;
}

.mini-button {
  min-height: 26px;
  padding: 0 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 650;
}

.mini-button.danger {
  color: var(--danger);
}

button, input, select, textarea { font: inherit; }

button {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--text);
  min-height: 36px;
  padding: 0 14px;
  border-radius: 6px;
  cursor: pointer;
}

button:hover { border-color: #9fb0b7; }
button.primary { background: var(--accent); color: #fff; border-color: var(--accent); }
button.primary:hover { background: var(--accent-strong); }
button.danger { background: #fff; color: var(--danger); border-color: #f0b4b4; }
button.danger:hover { background: #fff5f5; border-color: #d96b6b; }
button.small.danger { color: var(--danger); border-color: #f0b4b4; }
button.warning-action { background: #fff7ed; color: var(--warning); border-color: #e4c8a1; }
button.warning-action:hover { background: #ffedd5; border-color: #d6a96b; }
button.small { min-height: 28px; padding: 0 9px; font-size: 12px; border-radius: 5px; }
button.modal-close-x,
button.small.modal-close-x {
  display: inline-grid;
  place-items: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  border-color: #fecaca;
  border-radius: 9px;
  background: #fff;
  color: #dc2626;
  box-shadow: 0 1px 2px rgba(185, 28, 28, 0.08);
  line-height: 1;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.12s ease, box-shadow 0.15s ease;
}

button.modal-close-x:hover,
button.small.modal-close-x:hover {
  border-color: #f87171;
  background: #fef2f2;
  color: #b91c1c;
  box-shadow: 0 6px 14px rgba(185, 28, 28, 0.14);
}

button.modal-close-x:active,
button.small.modal-close-x:active {
  transform: translateY(1px);
  box-shadow: 0 2px 6px rgba(185, 28, 28, 0.12);
}

button.modal-close-x:focus-visible,
button.small.modal-close-x:focus-visible {
  outline: 3px solid #fee2e2;
  outline-offset: 2px;
}

button.modal-close-x svg,
button.small.modal-close-x svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

button:disabled,
button.primary:disabled,
button.danger:disabled,
button.warning-action:disabled {
  background: #eef2f4;
  border-color: #d6dde1;
  color: #8a9aa3;
  cursor: not-allowed;
  box-shadow: none;
}

button:disabled:hover,
button.primary:disabled:hover,
button.danger:disabled:hover,
button.warning-action:disabled:hover {
  background: #eef2f4;
  border-color: #d6dde1;
  color: #8a9aa3;
}

input, select, textarea {
  border: 1px solid var(--line);
  border-radius: 6px;
  min-height: 36px;
  padding: 6px 9px;
  background: #fff;
  color: var(--text);
}

input[data-dsc-picker] {
  padding-left: 30px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%230f766e' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 8px center;
  background-size: 15px 15px;
}

textarea {
  min-height: 78px;
  resize: vertical;
}

.inline-field-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.inline-field-action input {
  width: 100%;
  min-width: 0;
}

.inline-field-action select {
  width: 100%;
  min-width: 0;
}

.inline-field-action button.small {
  min-height: 34px;
  padding: 0 9px;
  white-space: nowrap;
}

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 260px;
  display: flex;
  flex-direction: column;
  background: #263238;
  color: #fff;
  padding: 18px 14px;
}

.brand {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 16px;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background: #ffffff;
  font-weight: 700;
}

.sidebar-accountbook-logo {
  flex: 0 0 auto;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(10, 46, 51, 0.32);
}

.sidebar-accountbook-logo img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  transform: none;
}

.brand-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.brand h1 {
  margin: 0;
  color: #f8fffe;
  font-size: 20px;
  font-weight: 850;
  line-height: 1.05;
  white-space: nowrap;
}

.brand h1 b {
  color: #5eead4;
  font-weight: 850;
}

.sidebar-switcher {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
  padding: 12px;
  border: 1px solid rgba(203, 213, 225, 0.84);
  border-radius: 8px;
  background: #eef2f4;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 6px 14px rgba(15, 23, 42, 0.12);
}

body.staff-workspace-mode .sidebar-switcher {
  display: none;
}

.context-card {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.context-card span {
  color: #64748b;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.context-card strong {
  overflow: hidden;
  color: #172026;
  font-size: 15px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.context-card em {
  width: max-content;
  max-width: 100%;
  color: #334155;
  padding: 3px 8px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 999px;
  background: #f8fafc;
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.context-change-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto;
  min-height: 30px;
  padding: 0 10px;
  border-color: rgba(148, 163, 184, 0.58);
  background: #dbe2e7;
  color: #263238;
  font-size: 11px;
  font-weight: 800;
}

.context-change-button:hover {
  border-color: rgba(100, 116, 139, 0.62);
  background: #cbd5dc;
}

.context-change-button .nav-icon {
  width: 15px;
  height: 15px;
  color: currentColor;
}

.tabs { display: grid; gap: 6px; }

.sidebar-credit {
  display: grid;
  gap: 2px;
  margin-top: auto;
  padding: 14px 4px 2px;
  border-top: 1px solid rgba(203, 213, 225, 0.12);
  color: #99aab0;
  font-size: 10.5px;
  line-height: 1.25;
}

.sidebar-credit strong {
  color: #d7e3e5;
  font-size: 11.5px;
  font-weight: 750;
}

.tab {
  justify-content: flex-start;
  text-align: left;
  background: transparent;
  color: #e7eef0;
  border-color: transparent;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.tab.active, .tab:hover { background: #34454c; border-color: #42565f; }

body.staff-workspace-mode .tabs .tab:not([data-tab="import"]) {
  display: none;
}

body.staff-workspace-mode .tabs .tab[data-tab="import"] {
  width: 100%;
}

.nav-icon {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  color: #b8c8ce;
  flex: 0 0 auto;
}

.nav-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.tab.active .nav-icon,
.tab:hover .nav-icon {
  color: #fff;
}

.shell { margin-left: 260px; min-height: 100vh; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 18px 22px;
  background: #f5f7f8;
  border-bottom: 1px solid var(--line);
}

.topbar h2 { margin: 0; font-size: 22px; }
.topbar p { margin: 4px 0 0; color: var(--muted); }

.topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.date-control { display: flex; align-items: center; gap: 8px; }
.date-control span, label span { color: var(--muted); font-size: 12px; }
.company-control select { width: 150px; }

.topbar-context {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 10px;
  row-gap: 1px;
  min-width: 260px;
  max-width: 340px;
  min-height: 48px;
  padding: 7px 10px 7px 12px;
  text-align: left;
  border-color: #c4d8dd;
  background: #fff;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.95), 0 5px 14px rgba(15, 23, 42, 0.04);
}

body.cloud-ready .topbar-context {
  display: none;
}

.topbar-context:hover,
.topbar-context:focus-visible {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.10);
}

.topbar-context .context-label,
.topbar-context .workspace-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-context .context-label {
  grid-column: 1;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.workspace-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 2px #e4f5f2;
  flex: 0 0 auto;
}

.topbar-context .workspace-name {
  grid-column: 1;
  display: flex;
  align-items: center;
  gap: 5px;
  width: 100%;
  min-width: 0;
  color: var(--text);
  font-size: 13.5px;
  line-height: 1.2;
}

.topbar-context .workspace-name span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#topbarCompanyName {
  flex: 0 1 auto;
  max-width: 44%;
}

#topbarBranchName {
  flex: 1 1 auto;
}

.workspace-divider {
  color: #91a1a8;
  flex: 0 0 auto;
}

.workspace-switch-icon {
  grid-column: 2;
  grid-row: 1 / 3;
  align-self: center;
  justify-self: end;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid #d7e4e7;
  border-radius: 6px;
  color: var(--accent-strong);
  background: #f2faf9;
}

.workspace-switch-icon svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.topbar-date-control {
  display: none;
  grid-template-columns: minmax(120px, 1fr);
  gap: 2px;
  height: 48px;
  min-height: 48px;
  min-width: 170px;
  padding: 5px 10px 5px 12px;
  border: 1px solid #cddbe0;
  border-radius: 6px;
  background: #fff;
}

.topbar-date-control span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.topbar-date-control input {
  min-height: 20px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text);
  font-size: 13px;
}

.topbar-date-control:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.10);
}

.panel { display: none; padding: 22px; }
.panel.active { display: block; }

.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.metric-grid.slim { grid-template-columns: repeat(4, minmax(150px, 1fr)); }

.metric {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.metric span { display: block; color: var(--muted); margin-bottom: 8px; }
.metric strong { font-size: 25px; }
.metric.warning strong { color: var(--warning); }
.metric .status-text.ok { color: var(--ok); }
.metric .status-text.warning { color: var(--warning); }
.metric .status-text.muted-status { color: var(--muted); }

.dashboard-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
  padding: 16px 18px;
  border: 1px solid #cfe1e5;
  border-radius: 8px;
  background: #ffffff;
}

.dashboard-hero span {
  display: block;
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.dashboard-hero strong {
  display: block;
  margin-top: 2px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.15;
}

.dashboard-hero em {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.dashboard-hero-actions,
.dashboard-action-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.dashboard-hero-actions { flex-wrap: wrap; justify-content: flex-end; }

.dashboard-hero-actions button,
.dashboard-action-row button,
.dashboard-quick-grid button {
  min-height: 34px;
  border: 1px solid #cfe1e5;
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
}

.dashboard-hero-actions button {
  min-width: 132px;
  padding: 0 14px;
  font-size: 13px;
}

.dashboard-hero-actions button.primary,
.dashboard-action-row button,
.dashboard-quick-grid button:hover {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
}

.dashboard-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
  padding: 11px 14px;
  border: 1px solid #ffb6c2;
  border-radius: 8px;
  background: #fff5f7;
}

.dashboard-alert[hidden] { display: none; }

.dashboard-alert strong,
.dashboard-alert span {
  display: block;
}

.dashboard-alert strong {
  color: #a20f2d;
  font-size: 13px;
  font-weight: 700;
}

.dashboard-alert span {
  margin-top: 2px;
  color: #7d2637;
  font-size: 12px;
}

.dashboard-alert button {
  min-height: 34px;
  min-width: 132px;
  padding: 0 12px;
  border: 1px solid #ff8fa3;
  border-radius: 7px;
  background: #fff;
  color: #c01234;
  font-weight: 800;
  cursor: pointer;
}

.dashboard-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.dash-status-card {
  display: grid;
  gap: 5px;
  min-height: 88px;
  padding: 13px 14px;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 43, 50, 0.04);
}

.dash-status-card.ok { border-color: #bde8db; background: #f7fffc; }
.dash-status-card.warn { border-color: #ffd0a1; background: #fffaf1; }
.dash-status-card.danger { border-color: #ffc0cb; background: #fff5f7; }

.dash-status-card span,
.dashboard-card-head span,
.dashboard-mini-list span,
.dashboard-quick-grid span {
  color: var(--muted);
  font-size: 12px;
}

.dash-status-card strong {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.15;
}

.dash-status-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.dashboard-flow-card {
  margin-bottom: 12px;
  overflow: hidden;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fff;
}

.dashboard-flow-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid #e5eff1;
  background: #f8fbfb;
}

.dashboard-flow-head strong,
.dashboard-flow-head span,
.dashboard-flow-head em {
  display: block;
}

.dashboard-flow-head strong {
  font-size: 14px;
  font-weight: 700;
}
.dashboard-flow-head span {
  color: var(--muted);
  font-size: 12px;
}

.dashboard-flow-head em {
  padding: 4px 9px;
  border-radius: 999px;
  background: #eef8f6;
  color: #075d56;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.dashboard-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  background: #e4eef0;
}

.dashboard-flow-step {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 1px 9px;
  align-items: center;
  min-height: 64px;
  padding: 10px 12px;
  background: #fff;
}

.dashboard-flow-step span {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid #cfe1e5;
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.dashboard-flow-step strong {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.15;
}

.dashboard-flow-step em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.dashboard-flow-step.done span {
  border-color: #77d4b2;
  background: #eafff7;
  color: #087a5a;
}

.dashboard-flow-step.attention {
  background: #fff8f1;
}

.dashboard-flow-step.attention span {
  border-color: #ffb46b;
  background: #fff1de;
  color: #b45100;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
  gap: 12px;
  margin-bottom: 12px;
}

.dashboard-grid.three-col { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.dashboard-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fff;
}

.dashboard-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 50px;
  padding: 10px 14px;
  border-bottom: 1px solid #e4eef0;
  background: #fbfdfd;
}

.dashboard-card-head strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
}

.dashboard-card-head em {
  flex: 0 0 auto;
  padding: 4px 9px;
  border-radius: 999px;
  background: #eaf8f5;
  color: #075d56;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.dashboard-action-list { display: grid; }

.dashboard-action-row {
  justify-content: space-between;
  min-height: 55px;
  padding: 10px 14px;
  border-bottom: 1px solid #edf3f4;
}

.dashboard-action-row:last-child { border-bottom: 0; }

.dashboard-action-row strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
}

.dashboard-action-row span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-action-row button {
  flex: 0 0 auto;
  width: 92px;
  min-height: 30px;
  padding: 0 10px;
  text-align: center;
}

.dashboard-action-row.warn { background: #fffaf1; }
.dashboard-action-row.danger { background: #fff5f7; }
.dashboard-action-row.ok { background: #f7fffb; }

.dashboard-quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}

.dashboard-quick-grid button {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  justify-items: start;
  gap: 2px 10px;
  min-height: 66px;
  padding: 10px 12px;
  text-align: left;
}

.dashboard-quick-grid strong {
  align-self: end;
  font-size: 13px;
  font-weight: 700;
}

.dashboard-quick-icon {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #eaf8f5;
  color: var(--accent);
}

.dashboard-quick-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.dashboard-quick-grid button:hover .dashboard-quick-icon {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

.dashboard-quick-grid span { font-weight: 500; }

.dashboard-mini-list {
  display: grid;
  padding: 8px 12px;
}

.dashboard-mini-list > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 10px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #edf3f4;
}

.dashboard-mini-list > div:last-child { border-bottom: 0; }

.dashboard-mini-list strong {
  font-size: 13px;
  font-weight: 700;
  text-align: right;
}

.dashboard-mini-list em {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.split { display: grid; grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr); gap: 16px; }

.block, .result-box {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.block-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
}

.block-head h3 { margin: 0; font-size: 15px; }

.compact-list { display: grid; gap: 1px; padding: 10px; max-height: 360px; overflow: auto; }

.compact-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 9px 8px;
  border-radius: 6px;
  background: #f8fafb;
}

.map-row { padding: 7px 8px; }
.row-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.row-actions { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }

.muted { color: var(--muted); }

.error-text {
  color: #b91c1c;
  font-weight: 750;
}
.bad { color: var(--danger); font-weight: 650; }
.ok { color: var(--ok); font-weight: 650; }

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 12px;
  align-items: end;
  margin-bottom: 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.form-grid label { display: grid; gap: 5px; }
.file-field { grid-column: span 2; }

.work-command-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: end;
  margin-bottom: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.work-command-panel .form-grid {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.work-command-panel .form-grid[hidden] {
  display: none;
}

.work-command-panel[hidden],
.work-command-panel [hidden] {
  display: none;
}

.task-intro {
  display: grid;
  gap: 0;
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  overflow: hidden;
}

.task-tile-band {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 0 18px;
  background: #eaf6ff;
  color: #1f65a7;
  font-size: 13px;
  font-weight: 650;
}

.task-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(136px, 1fr));
  gap: 10px;
  padding: 12px;
}

.task-tile {
  position: relative;
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 5px;
  min-height: 118px;
  padding: 11px;
  border: 1px solid #dce8eb;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-align: left;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
}

.task-tile:hover,
.task-tile.active {
  border-color: var(--accent);
  background: #f0fbf8;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.task-tile-icon {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: var(--accent);
}

.task-tile-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.task-tile > em {
  margin-top: 3px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef8f6;
  color: #075d56;
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
}

.task-tile strong {
  font-size: 12.5px;
  line-height: 1.2;
}

.task-tile > span:not(.task-tile-icon) {
  min-height: 28px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.receiving-panel {
  display: grid;
  gap: 12px;
}

.stock-adjustment-panel {
  display: grid;
  gap: 12px;
  margin: 14px 0 16px;
  background: transparent;
}

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

.stock-adjustment-head div {
  display: grid;
  gap: 3px;
}

.stock-adjustment-head strong {
  font-size: 15px;
}

.stock-adjustment-head span {
  color: var(--muted);
  font-size: 12px;
}

.stock-adjustment-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
}

.stock-adjustment-summary span {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid #d7e6ea;
  border-radius: 8px;
  background: #fff;
}

.stock-adjustment-summary strong {
  font-size: 17px;
}

.stock-adjustment-summary em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.stock-adjustment-summary .open {
  border-color: #b7e4cf;
  background: #effcf6;
  color: #047857;
}

.stock-adjustment-summary .locked {
  border-color: #fecaca;
  background: #fff1f2;
  color: #be123c;
}

.stock-adjustment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.stock-adjustment-history {
  display: grid;
  gap: 12px;
}

.stock-adjustment-section-divider {
  display: grid;
  grid-template-columns: minmax(24px, 1fr) auto minmax(0, auto);
  align-items: center;
  gap: 10px;
  color: var(--muted);
}

.stock-adjustment-section-divider span {
  display: block;
  height: 1px;
  background: #dce9ec;
}

.stock-adjustment-section-divider strong {
  color: #153b43;
  font-size: 13px;
  letter-spacing: 0;
}

.stock-adjustment-section-divider em {
  overflow: hidden;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stock-adjustment-history-card {
  overflow: hidden;
  border: 1px solid #cfdde1;
  border-top: 3px solid var(--accent);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(23, 32, 38, 0.06);
}

.stock-adjustment-history-card.recent {
  border-color: #e8dcc3;
  background: #fffcf5;
}

.stock-adjustment-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #dce9ec;
  background: #eef7f6;
}

.stock-adjustment-history-card.recent .stock-adjustment-history-head {
  border-bottom-color: #f0dfb9;
  background: #fff3d6;
}

.stock-adjustment-history-head div {
  display: grid;
  gap: 2px;
}

.stock-adjustment-history-head strong {
  font-size: 13px;
}

.stock-adjustment-history-head span,
.stock-adjustment-history-head em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.stock-adjustment-register-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.stock-adjustment-col-date { width: 23%; }
.stock-adjustment-col-records { width: 12%; }
.stock-adjustment-col-impact { width: 14%; }
.stock-adjustment-col-changed { width: 18%; }
.stock-adjustment-col-status { width: 13%; }
.stock-adjustment-col-action { width: 20%; }

.stock-adjustment-register-table th,
.stock-adjustment-register-table td {
  height: 58px;
  padding: 9px 10px;
  border-bottom: 1px solid #e1ebee;
  vertical-align: middle;
}

.stock-adjustment-register-table th {
  background: #f3f8f8;
  color: #244554;
  font-size: 11px;
  font-weight: 750;
  text-align: left;
  text-transform: uppercase;
}

.stock-adjustment-register-table tr:last-child td {
  border-bottom: 0;
}

.stock-adjustment-register-table tr.selected td {
  background: #eefbf7;
}

.stock-adjustment-register-table tr.selected td:first-child {
  box-shadow: inset 3px 0 0 #0f8a7d;
}

.stock-adjustment-register-table tbody tr {
  cursor: pointer;
  height: 58px;
}

.stock-adjustment-register-table tbody tr:focus-visible td,
.stock-adjustment-register-table tbody tr:hover td {
  background: #f3fbf9;
}

.stock-adjustment-register-table tbody tr.selected:hover td,
.stock-adjustment-register-table tbody tr.selected:focus-visible td {
  background: #eefbf7;
}

.stock-adjustment-register-table th:nth-child(5),
.stock-adjustment-register-table td:nth-child(5) {
  text-align: center;
  white-space: nowrap;
}

.stock-adjustment-register-table th:nth-child(6),
.stock-adjustment-register-table td:nth-child(6) {
  padding-right: 12px;
  text-align: right;
  white-space: nowrap;
  overflow: visible;
}

.stock-adjustment-date-cell,
.stock-adjustment-register-table td {
  min-width: 0;
}

.stock-adjustment-date-cell {
  display: grid;
  gap: 2px;
}

.stock-adjustment-date-cell strong {
  color: #0f2f3a;
  font-size: 13px;
}

.stock-adjustment-date-cell span,
.stock-adjustment-register-table .muted {
  color: var(--muted);
  font-size: 11px;
}

.stock-adjustment-last-changed {
  display: grid;
  gap: 2px;
}

.stock-adjustment-last-changed strong {
  color: #0f2f3a;
  font-size: 12px;
  font-weight: 750;
}

.stock-adjustment-last-changed em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.stock-adjustment-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 750;
}

.stock-adjustment-status-pill.open {
  border: 1px solid #b7e4cf;
  background: #effcf6;
  color: #047857;
}

.stock-adjustment-status-pill.closed {
  border: 1px solid #fecaca;
  background: #fff1f2;
  color: #be123c;
}

.stock-adjustment-recent-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px 0;
}

.stock-adjustment-recent-list button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 185px;
  padding: 8px 10px;
  border: 1px solid #d8e6ea;
  border-radius: 8px;
  background: #fff;
  color: #0f2f3a;
  text-align: left;
  cursor: pointer;
}

.stock-adjustment-recent-list button:hover {
  border-color: #0f8a7d;
  background: #f2fbf9;
}

.stock-adjustment-recent-list span {
  display: grid;
  gap: 1px;
}

.stock-adjustment-recent-list strong {
  font-size: 12px;
}

.stock-adjustment-recent-list em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.stock-adjustment-recent-list b {
  color: #087568;
  font-size: 11px;
}

.stock-adjustment-mini-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.stock-adjustment-mini-table th,
.stock-adjustment-mini-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #e1ebee;
  vertical-align: top;
}

.stock-adjustment-mini-table th {
  background: #f2f8f8;
  color: #244554;
  font-size: 11px;
  font-weight: 700;
  text-align: left;
  text-transform: uppercase;
}

.stock-adjustment-mini-table tr:last-child td {
  border-bottom: 0;
}

.stock-adjustment-mini-table th:nth-child(1),
.stock-adjustment-mini-table td:nth-child(1) { width: 110px; }

.stock-adjustment-mini-table th:nth-child(2),
.stock-adjustment-mini-table td:nth-child(2) { width: 210px; }

.stock-adjustment-mini-table th:nth-child(3),
.stock-adjustment-mini-table td:nth-child(3) { width: 72px; }

.stock-adjustment-mini-table th:nth-child(4),
.stock-adjustment-mini-table td:nth-child(4) { width: 230px; }

.stock-adjustment-mini-table.with-date th:nth-child(1),
.stock-adjustment-mini-table.with-date td:nth-child(1) { width: 96px; }

.stock-adjustment-mini-table.with-date th:nth-child(2),
.stock-adjustment-mini-table.with-date td:nth-child(2) { width: 105px; }

.stock-adjustment-mini-table.with-date th:nth-child(3),
.stock-adjustment-mini-table.with-date td:nth-child(3) { width: 210px; }

.stock-adjustment-mini-table.with-date th:nth-child(4),
.stock-adjustment-mini-table.with-date td:nth-child(4) { width: 70px; }

.stock-adjustment-mini-table.with-date th:nth-child(5),
.stock-adjustment-mini-table.with-date td:nth-child(5) { width: 220px; }

.stock-adjustment-mini-table.with-actions th:last-child,
.stock-adjustment-mini-table.with-actions td:last-child {
  width: 78px;
  text-align: right;
}

.stock-adjustment-mini-table.compact th,
.stock-adjustment-mini-table.compact td {
  padding: 7px 9px;
}

.stock-adjustment-mini-table td strong,
.stock-adjustment-mini-table td span {
  display: block;
}

.stock-adjustment-mini-table td span {
  color: var(--muted);
  font-size: 11px;
}

.stock-adjustment-mini-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.stock-adjustment-row-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 30px;
  min-width: 0;
  width: 108px;
  max-width: 100%;
  padding: 0 12px;
  border: 1px solid #b8d7d5;
  border-radius: 7px;
  background: #f5fbfa;
  color: #006b61;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}

.stock-adjustment-row-action:hover {
  border-color: #0f8a7d;
  background: #e9fbf7;
}

.stock-adjustment-row-action:disabled {
  border-color: #d7e2e5;
  background: #f3f6f7;
  color: #8da0a8;
  cursor: not-allowed;
}

.stock-adjustment-impact-lines {
  display: grid;
  gap: 5px;
}

.stock-adjustment-impact-lines span {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 10px;
}

.stock-adjustment-impact-lines b {
  overflow: hidden;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stock-adjustment-impact-lines em {
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.stock-adjustment-impact-lines em.negative {
  color: #dc2626;
}

.stock-adjustment-impact-lines em.positive {
  color: #047857;
}

.stock-adjustment-empty {
  display: grid;
  gap: 3px;
  padding: 14px 12px;
  color: #536b77;
  font-size: 12px;
}

.stock-adjustment-empty strong {
  color: #17323d;
  font-size: 13px;
}

.receiving-toolbar {
  display: grid;
  grid-template-columns: minmax(145px, 170px) minmax(260px, 1fr) auto;
  align-items: end;
  gap: 14px;
  padding: 12px;
  border: 1px solid #dbe8eb;
  border-radius: 8px;
  background: #f8fbfb;
}

.receiving-toolbar label {
  display: grid;
  gap: 5px;
}

.receiving-date-field input {
  min-height: 36px;
  font-weight: 650;
}

.receiving-status-card {
  display: grid;
  gap: 2px;
  min-height: 56px;
  padding: 8px 12px;
  border: 1px solid #d5e6e9;
  border-radius: 8px;
  background: #fff;
  box-shadow: inset 3px 0 0 #cbd5da;
}

.receiving-status-card.has-receiving {
  border-color: #b8ddd6;
  background: #f1fbf7;
  box-shadow: inset 3px 0 0 var(--accent);
}

.receiving-status-card span,
.receiving-status-card em {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.receiving-status-card strong {
  overflow: hidden;
  color: #102a32;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.receiving-mode-switch {
  display: inline-flex;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
}

.receiving-mode-switch button {
  min-height: 38px;
  min-width: 124px;
  border: 1px solid #cfe0e4;
  border-radius: 7px;
  background: #fff;
  color: #173b45;
  font-weight: 650;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.receiving-mode-switch button.active {
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
  box-shadow: 0 4px 10px rgba(0, 116, 95, 0.14);
}

.receiving-import-form,
.receiving-manual-form {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.receiving-import-form {
  grid-template-columns: minmax(360px, 1fr) minmax(170px, 210px);
  align-items: end;
}

.receiving-import-form .file-field {
  display: grid;
  grid-column: auto;
  gap: 5px;
  min-width: 0;
}

.receiving-import-form input[type="file"] {
  width: 100%;
  max-width: 100%;
  min-height: 36px;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.receiving-import-form button {
  width: 100%;
  min-height: 36px;
}

.receiving-result {
  margin: 0;
  padding: 12px 14px 16px;
}

.receiving-rows {
  display: grid;
  gap: 8px;
}

.receiving-row {
  display: grid;
  grid-template-columns: 98px minmax(240px, 1fr) 92px 102px 76px minmax(160px, 0.7fr) 34px;
  align-items: end;
  gap: 8px;
  padding: 10px;
  border: 1px solid #e4edf0;
  border-radius: 8px;
  background: #fbfcfc;
}

.purchase-toolbar {
  display: grid;
  grid-template-columns: minmax(150px, 180px) minmax(300px, 1fr) minmax(180px, 240px);
}

.purchase-supplier-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
  position: relative;
}

.purchase-supplier-wrap label {
  display: grid;
  gap: 5px;
}

.purchase-supplier-wrap button {
  min-height: 36px;
  white-space: nowrap;
}

.supplier-picker-results {
  position: absolute;
  z-index: 40;
  top: calc(100% + 5px);
  left: 0;
  right: 0;
  max-height: 220px;
  overflow: auto;
  padding: 6px;
  border: 1px solid #cfe0e4;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
}

.supplier-picker-results button {
  display: grid;
  width: 100%;
  min-height: 38px;
  padding: 7px 9px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #102a32;
  text-align: left;
  box-shadow: none;
}

.supplier-picker-results button:hover,
.supplier-picker-results button:focus,
.supplier-picker-results button.active {
  background: #eef8f6;
}

.supplier-picker-results button.active {
  box-shadow: inset 3px 0 0 var(--accent);
}

.supplier-picker-results strong {
  font-size: 13px;
}

.supplier-picker-results span,
.supplier-picker-empty {
  color: var(--muted);
  font-size: 11px;
}

.supplier-picker-empty {
  padding: 9px;
}

.purchase-panel:not(.supplier-selected) .purchase-form {
  opacity: 0.62;
}

.purchase-panel:not(.supplier-selected) .purchase-form input,
.purchase-panel:not(.supplier-selected) #otherPurchaseBillNo {
  background: #f4f7f8;
}

.purchase-rows {
  display: grid;
  gap: 8px;
}

.purchase-row {
  display: grid;
  grid-template-columns: 98px minmax(260px, 1fr) 88px 82px 94px 95px minmax(160px, 0.75fr) 34px;
  align-items: end;
  gap: 8px;
  padding: 10px;
  border: 1px solid #e4edf0;
  border-radius: 8px;
  background: #fbfcfc;
}

.purchase-row label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.purchase-row input {
  width: 100%;
}

.purchase-row .num-input {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.purchase-history-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.purchase-history-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  background: #f8fafb;
}

.purchase-history-head span {
  color: var(--muted);
  font-size: 12px;
}

.purchase-history-list {
  display: grid;
  max-height: 220px;
  overflow: auto;
}

.purchase-history-item {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(160px, 1.2fr) 86px 90px 76px;
  gap: 8px;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid #eef2f4;
  font-size: 12px;
  cursor: pointer;
}

.purchase-history-record:last-child .purchase-history-item,
.purchase-history-item:last-child {
  border-bottom: 0;
}

.purchase-history-item strong,
.purchase-history-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.purchase-history-item .amount {
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.purchase-history-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}

.purchase-history-actions .action-icon {
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
}

.purchase-history-detail {
  padding: 8px 12px 12px;
  border-bottom: 1px solid #eef2f4;
  background: #fbfefe;
}

.purchase-history-detail table {
  width: 100%;
  min-width: 740px;
  border-collapse: collapse;
  font-size: 12px;
}

.purchase-history-detail th,
.purchase-history-detail td {
  padding: 6px 8px;
  border: 1px solid #dce8eb;
}

.purchase-history-detail th {
  background: #eaf3f4;
  text-align: left;
}

.purchase-history-detail .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.receiving-row label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.receiving-row label span,
.purchase-row label span,
.receiving-toolbar label span,
.receiving-import-form label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.receiving-row input {
  width: 100%;
}

.receiving-row .receiving-qty,
.receiving-preview-table .num-input {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.receiving-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
  padding-bottom: 4px;
}

.receiving-result > .receiving-actions {
  padding-right: 2px;
}

.receiving-preview-table {
  width: 100%;
  min-width: 680px;
  margin-top: 10px;
}

.receiving-preview-table th,
.receiving-preview-table td {
  padding: 7px 8px;
}

.receiving-preview-table input {
  width: 100%;
  min-height: 30px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  font-size: 12px;
}

.nazeer-unmatched-panel {
  margin-top: 10px;
  border: 1px solid #f0c7c7;
  border-radius: 8px;
  background: #fff7f7;
  overflow: hidden;
}

.nazeer-duplicate-panel {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid #f0b5b5;
  border-radius: 8px;
  background: #fff5f5;
}

.nazeer-duplicate-panel strong {
  color: #b91c1c;
  font-size: 13px;
}

.nazeer-duplicate-panel span {
  color: #7f1d1d;
  font-size: 12px;
}

.nazeer-unmatched-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid #f0c7c7;
}

.nazeer-unmatched-head .mini-action {
  flex: 0 0 auto;
}

.nazeer-unmatched-head strong {
  display: block;
  color: #9f1239;
  font-size: 13px;
}

.nazeer-unmatched-head span {
  display: block;
  margin-top: 2px;
  color: #7f1d1d;
  font-size: 12px;
}

.nazeer-unmatched-wrap {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.nazeer-unmatched-table {
  width: 100%;
  min-width: 620px;
}

.nazeer-unmatched-table th,
.nazeer-unmatched-table td {
  padding: 7px 9px;
}

.nazeer-unmatched-table .mini-action {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  white-space: nowrap;
}

.nazeer-review-panel {
  margin-top: 10px;
  border: 1px solid #cfe4e7;
  border-top: 3px solid var(--accent);
  border-radius: 8px;
  background: #fbfefe;
  overflow: hidden;
}

.nazeer-review-head {
  padding: 9px 12px;
  border-bottom: 1px solid #d9e8ea;
  background: #f4fbfb;
}

.nazeer-review-head strong {
  display: block;
  color: #10333a;
  font-size: 13px;
}

.nazeer-review-head span {
  display: block;
  margin-top: 2px;
  color: #516875;
  font-size: 12px;
}

.nazeer-review-sections {
  display: grid;
  gap: 10px;
  padding: 10px;
}

.nazeer-review-sections .nazeer-unmatched-panel,
.nazeer-review-sections .nazeer-uom-warning-panel {
  margin-top: 0;
}

.nazeer-uom-warning-panel {
  margin-top: 10px;
  border: 1px solid #f3c98b;
  border-radius: 8px;
  background: #fff7ed;
  overflow: hidden;
}

.nazeer-uom-warning-head {
  padding: 9px 12px;
  border-bottom: 1px solid #f3c98b;
}

.nazeer-uom-warning-head strong {
  display: block;
  color: #92400e;
  font-size: 13px;
}

.nazeer-uom-warning-head span {
  display: block;
  margin-top: 2px;
  color: #8a4b05;
  font-size: 12px;
}

.nazeer-uom-warning-wrap {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.nazeer-uom-warning-table {
  width: 100%;
  min-width: 700px;
}

.nazeer-uom-warning-table th,
.nazeer-uom-warning-table td {
  padding: 7px 9px;
}

.nazeer-uom-warning-table th {
  background: #fef3c7;
}

.nazeer-uom-warning-table td {
  background: #fffaf0;
}

.receiving-preview-table .uom-warning-input {
  border-color: #f59e0b;
  background: #fffaf0;
  color: #92400e;
  font-weight: 650;
}

.nazeer-image-context {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid #b7e5dc;
  border-radius: 8px;
  background: #eefbf7;
  color: #0f3f3b;
}

.nazeer-image-context span {
  font-size: 12px;
  color: #31535b;
}

.nazeer-image-context strong {
  display: inline-block;
  margin-left: 4px;
  color: #006c58;
  font-size: 14px;
}

.nazeer-image-context em {
  padding: 2px 8px;
  border-radius: 999px;
  background: #dff7ef;
  color: #047857;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.nazeer-image-context small {
  color: #8a4b00;
  font-size: 12px;
}

.nazeer-image-assist {
  margin-top: 10px;
  max-height: 420px;
  overflow: auto;
  border: 1px solid #cfe0e4;
  border-radius: 8px;
  background: #f8fbfc;
}

.nazeer-image-assist img {
  display: block;
  width: 100%;
  min-width: 720px;
  filter: contrast(1.18) saturate(1.05);
}

.nazeer-text-extract {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #cfe0e4;
  border-radius: 8px;
  background: #fbfefe;
}

.nazeer-text-extract label {
  display: grid;
  gap: 5px;
}

.nazeer-text-extract label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.nazeer-text-extract textarea {
  width: 100%;
  min-height: 82px;
  resize: vertical;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.35;
}

.nazeer-line-status {
  padding: 7px 9px;
  border-radius: 7px;
  background: #f1f7f8;
  color: #3e5960;
  font-size: 12px;
}

@media (max-width: 980px) {
  .receiving-toolbar,
  .receiving-import-form {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .receiving-toolbar {
    display: grid;
  }

  .receiving-mode-switch,
  .receiving-actions {
    width: 100%;
  }

  .receiving-mode-switch button,
  .receiving-actions button {
    flex: 1 1 auto;
  }

  .nazeer-history-empty {
    grid-template-columns: 1fr;
  }

  .receiving-row {
    grid-template-columns: 1fr;
  }

  .purchase-toolbar,
  .purchase-row,
  .purchase-history-item {
    grid-template-columns: 1fr;
  }

  .purchase-supplier-wrap {
    grid-template-columns: 1fr;
  }
}

.task-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eef2f4;
}

.task-header h3 {
  margin: 0;
  font-size: 17px;
}

.task-header p {
  margin: 4px 0 0;
  color: var(--muted);
}

.task-steps {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.task-step {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafb;
  color: #405058;
  font-size: 12px;
  font-weight: 650;
}

.task-step::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #b6c2c8;
}

.task-step.done {
  border-color: #b7dccf;
  background: #eefaf5;
  color: var(--ok);
}

.task-step.done::before { background: var(--ok); }

.task-step.active {
  border-color: #f3c98b;
  background: #fff7ed;
  color: #8a4b05;
}

.task-step.active::before { background: var(--warning); }

.work-range-form {
  grid-template-columns: minmax(170px, 220px) minmax(170px, 220px) 112px;
  gap: 10px;
  align-items: end;
}

.work-range-form.single-mode {
  grid-template-columns: minmax(170px, 220px) 112px;
}

.work-range-form button.primary {
  width: 112px;
  min-height: 36px;
  padding: 0 12px;
}

.selected-period-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid #b7dccf;
  border-radius: 8px;
  background: #eefaf5;
}

.selected-period-bar span {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 12px;
}

.selected-period-bar strong {
  font-size: 18px;
  color: var(--ok);
}

.selected-period-bar button {
  min-height: 32px;
  padding: 0 10px;
}

.command-label {
  display: flex;
  align-items: center;
  min-height: 36px;
  color: #405058;
  font-size: 12px;
  font-weight: 700;
}

.command-label span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  background: #eef3f4;
  white-space: nowrap;
}

.import-form {
  grid-template-columns: minmax(135px, 170px) minmax(135px, 170px) minmax(175px, 230px) minmax(300px, 1fr) minmax(150px, 190px);
  gap: 10px;
}

.import-form .file-field { grid-column: auto; }
.import-form button { width: 100%; }

.import-status-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid #d7e5e7;
  border-radius: 8px;
  background: #f8fbfc;
  color: #344b55;
  font-size: 12px;
  flex-wrap: wrap;
}

.import-status-line strong {
  color: #102a32;
}

.import-status-line span,
.import-status-line em {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef3f4;
  color: #405058;
  font-style: normal;
}

.import-status-line.is-imported {
  border-color: #b7dccf;
  background: #f2fbf7;
}

.import-status-line.is-imported span {
  background: #e5f6ef;
  color: #0b5f59;
}

.import-status-line.is-imported em {
  margin-left: auto;
  background: #fff7ed;
  color: #8a4b05;
}

.import-status-line.is-empty {
  border-color: #d9e0e3;
  background: #f8fafb;
}

.dsc-status-line.is-empty {
  border-color: #fecdd3;
  background: #fff1f2;
  color: #9f1239;
}

.dsc-status-line.is-empty strong {
  color: #9f1239;
}

.dsc-status-line.is-empty span,
.dsc-status-line.is-empty em {
  background: #ffe4e6;
  color: #be123c;
}

.sales-history-card {
  margin: 14px 0 16px;
  border: 1px solid #cfdde1;
  border-top: 3px solid var(--accent);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(23, 32, 38, 0.06);
}

.sales-history-card[hidden] {
  display: none;
}

.sales-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border-bottom: 1px solid #d6e2e5;
  background: #f5fbfa;
}

.sales-history-head strong {
  display: block;
  font-size: 13px;
}

.sales-history-head span {
  color: var(--muted);
  font-size: 11px;
}

.sales-history-list {
  overflow-x: auto;
  background: #fff;
}

.sales-history-list.stock-count-history-list {
  overflow-x: hidden;
}

.sales-history-table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.sales-history-table th,
.sales-history-table td {
  border: 1px solid #dce6e9;
  padding: 7px 8px;
  vertical-align: middle;
}

.sales-history-table th {
  background: #eaf3f4;
  color: #193640;
  font-weight: 700;
  text-align: left;
}

.sales-history-table td {
  background: #fff;
}

.sales-history-table tbody tr:hover td {
  background: #f8fcfb;
}

.sales-history-table tbody tr.selected td {
  background: #f1fbf7;
  border-top-color: #b7dccf;
  border-bottom-color: #b7dccf;
}

.sales-history-table tbody tr.selected td:first-child {
  box-shadow: inset 3px 0 0 var(--accent);
}

.sales-history-table tbody tr.duplicate td {
  background: #fff7f7;
  border-top-color: #f0b5b5;
  border-bottom-color: #f0b5b5;
}

.sales-history-table tbody tr.duplicate td:first-child {
  box-shadow: inset 3px 0 0 var(--danger);
}

.sales-history-table th:nth-child(1) { width: 145px; }
.sales-history-table th:nth-child(2) { width: 260px; }
.sales-history-table th:nth-child(3) { width: auto; }
.sales-history-table th:nth-child(4) { width: 132px; }
.sales-history-table th:nth-child(5) { width: 132px; }

.dsc-history-table th:nth-child(1) { width: 150px; }
.dsc-history-table th:nth-child(2) { width: 105px; }
.dsc-history-table th:nth-child(3) {
  width: auto;
  text-align: center;
}
.dsc-history-table th:nth-child(4) { width: 132px; }
.dsc-history-table th:nth-child(5),
.dsc-history-table td:nth-child(5) {
  width: 92px;
  text-align: center;
}

.dsc-history-table th:last-child,
.sales-history-action-cell {
  text-align: center;
}

.sales-history-action-cell {
  padding-right: 6px;
  padding-left: 6px;
}

.sales-history-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.sales-history-date strong,
.sales-history-date span,
.sales-history-file {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-history-date {
  display: grid;
  gap: 2px;
}

.sales-history-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(68px, 1fr));
  gap: 6px;
}

.dsc-history-stats {
  grid-template-columns: repeat(4, minmax(68px, 1fr));
}

.sales-history-stats span {
  display: grid;
  gap: 1px;
  min-height: 38px;
  padding: 5px 7px;
  border: 1px solid #d8e7e9;
  border-radius: 6px;
  background: #f8fbfc;
}

.sales-history-stats strong {
  color: #102a32;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

.sales-history-stats em {
  overflow: hidden;
  color: var(--muted);
  font-style: normal;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dsc-history-stats .variance-stat {
  border-color: #efc2ca;
  background: #fff1f3;
}

.dsc-history-stats .variance-stat strong {
  color: #b4233d;
}

.dsc-history-stats .variance-stat em {
  color: #9f3043;
}

.sales-history-file-card {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.excel-file-icon {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 32px;
  border: 1px solid #b7d8cf;
  border-radius: 7px;
  background: #ecfdf5;
  color: #047857;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.sales-history-file-card strong,
.sales-history-file-card em,
.sales-history-imported strong,
.sales-history-imported span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sales-history-file-card strong {
  color: #24444d;
  font-weight: 600;
}

.sales-history-file-card em,
.sales-history-date span,
.sales-history-file {
  color: var(--muted);
}

.sales-history-file-card em {
  font-style: normal;
  font-size: 10px;
}

.sales-history-imported {
  display: grid;
  gap: 2px;
}

.sales-history-imported strong {
  color: #102a32;
  font-weight: 650;
}

.sales-history-imported span {
  color: var(--muted);
}

.dsc-history-status {
  display: grid;
  gap: 2px;
  justify-items: start;
  align-content: center;
  text-align: left;
}

.dsc-history-status strong {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 23px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
}

.dsc-history-status strong.open {
  background: #ecfdf5;
  color: var(--ok);
}

.dsc-history-status strong.closed {
  background: #fff7ed;
  color: var(--warning);
}

.dsc-history-status strong.pending {
  background: #fff1f2;
  color: var(--danger);
}

.dsc-history-status strong.ok {
  background: #ecfdf5;
  color: var(--ok);
}

.dsc-history-status strong.warning {
  background: #fff7ed;
  color: var(--warning);
}

.dsc-history-status span {
  color: var(--muted);
  font-size: 10px;
}

.dsc-status-line.is-imported strong {
  color: #0b5f59;
}

.sales-history-empty {
  display: grid;
  gap: 3px;
  padding: 18px 14px;
  color: var(--muted);
  font-size: 12px;
}

.nazeer-history-empty {
  grid-template-columns: 1fr;
  align-items: center;
  gap: 14px;
}

.sales-history-empty strong {
  color: var(--text);
  font-size: 13px;
}

.sales-history-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  flex-wrap: nowrap;
  width: 100%;
}

.sales-history-actions button {
  min-height: 28px;
  padding: 0 9px;
  font-size: 11px;
}

.sales-history-actions .action-icon {
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
  line-height: 1;
}

.sales-history-actions .action-icon svg {
  display: block;
  width: 14px;
  height: 14px;
}

.sales-history-actions .action-icon:disabled {
  border-color: #d8e2e5;
  background: #f3f7f8;
  color: #9aa9ae;
  cursor: not-allowed;
}

.sales-history-actions .danger {
  color: var(--danger);
}

.nazeer-history-card {
  margin-top: 12px;
}

.nazeer-history-table {
  min-width: 860px;
}

.nazeer-history-table th:nth-child(1) { width: 130px; }
.nazeer-history-table th:nth-child(2) { width: 300px; }
.nazeer-history-table th:nth-child(3) { width: 270px; }
.nazeer-history-table th:nth-child(4) { width: 120px; }
.nazeer-history-table th:nth-child(5) { width: 92px; }

.status-text.ok {
  color: var(--ok);
  font-weight: 700;
}

.status-text.warning {
  color: var(--warning);
  font-weight: 700;
}

.status-text.danger-status {
  color: var(--danger);
  font-weight: 700;
}

.sales-history-edit {
  display: grid;
  grid-template-columns: minmax(140px, 180px) minmax(140px, 180px) 1fr;
  gap: 8px;
  align-items: end;
  padding: 8px;
  border: 1px solid #cfe0e4;
  border-radius: 6px;
  background: #f6fbfb;
}

.sales-history-edit label {
  display: grid;
  gap: 4px;
}

.sales-history-edit label span {
  color: var(--muted);
  font-size: 11px;
}

.period-caption {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafb;
}

.period-caption span {
  color: var(--muted);
  font-size: 12px;
}

.period-caption strong {
  font-size: 13px;
}

.result-box { min-height: 80px; padding: 14px; color: var(--muted); }

.result-box.error,
.template-result-error {
  border-color: #fecaca;
  background: #fff1f2;
  color: #991b1b;
}

.template-result-error {
  padding: 10px 12px;
  border: 1px solid #fecaca;
  border-radius: 8px;
}

.stock-template-result-summary {
  display: grid;
  gap: 4px;
  margin-bottom: 10px;
}

.stock-template-result-summary strong {
  color: var(--text);
}

.stock-template-result-summary span {
  color: var(--muted);
}

.template-result-error .stock-template-result-summary strong {
  color: #991b1b;
}

.stock-template-preview {
  margin-top: 10px;
  overflow: hidden;
  border: 1px solid #d8e6e8;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
}

.stock-template-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
  border-bottom: 1px solid #d8e6e8;
  background: #eef8f7;
}

.stock-template-preview-head strong {
  color: #063f3c;
  font-size: 12px;
}

.stock-template-preview-head span {
  color: #526b75;
  font-size: 11px;
  font-weight: 800;
}

.stock-template-preview-table-wrap {
  max-height: 220px;
  overflow: auto;
}

.stock-template-preview table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.stock-template-preview th,
.stock-template-preview td {
  padding: 7px 9px;
  border-top: 1px solid #edf2f3;
  text-align: left;
  vertical-align: top;
}

.stock-template-preview thead th {
  border-top: 0;
  background: #f8fbfb;
  color: #31505a;
  font-size: 10px;
  text-transform: uppercase;
}

.stock-template-preview th:nth-child(3),
.stock-template-preview td:nth-child(3) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.stock-template-preview td:nth-child(5) span {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e7fbf5;
  color: #00695f;
  font-size: 11px;
  font-weight: 800;
}

.stock-template-preview-warning td:nth-child(5) span {
  background: #fff7ed;
  color: #9a3412;
}

.stock-template-preview-empty {
  margin-top: 8px;
  color: var(--muted);
}

#importResult:empty { display: none; }

.empty-action-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-height: 72px;
}

.empty-action-card strong {
  display: block;
  margin-bottom: 5px;
  color: var(--text);
  font-size: 16px;
}

.empty-action-card span {
  display: block;
  color: var(--muted);
}

.import-ready-card {
  min-height: 50px;
}

.inline-import-drawer {
  border-top: 1px solid var(--line);
  margin-top: 14px;
  padding-top: 14px;
}

.inline-import-form {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(130px, 160px) minmax(130px, 160px) minmax(190px, 240px) minmax(280px, 1fr) minmax(145px, 180px);
}

.inline-import-form label {
  display: grid;
  gap: 5px;
}

.inline-import-form button {
  height: 38px;
  width: 100%;
}

.inline-import-result {
  color: var(--text);
  margin-top: 12px;
}

.inline-import-result:empty {
  display: none;
}

.preview { color: var(--text); display: grid; gap: 12px; }
.preview-head { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.preview-head span { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.notice {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 9px 10px;
}

.warning-note {
  border-color: #f3c98b;
  background: #fff7ed;
  color: #8a4b05;
}

.preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(130px, 1fr));
  gap: 10px;
}

.preview-grid div {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  background: #f8fafb;
}

.preview-grid .preview-workspace {
  grid-column: 1 / -1;
  border-color: #b8d8d4;
  background: #effaf8;
}

.preview-grid span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 5px; }
.preview-grid strong { font-size: 18px; }

.preview-grid .preview-workspace strong {
  font-size: 16px;
}

.preview-actions { display: flex; justify-content: flex-end; gap: 10px; }

.toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.toolbar input { width: min(420px, 100%); }

.table-item-search {
  display: grid;
  grid-template-columns: 18px minmax(180px, 1fr) auto auto;
  align-items: center;
  gap: 7px;
  min-width: min(480px, 100%);
  max-width: 560px;
  padding: 5px 7px;
  border: 1px solid #d7e4e7;
  border-radius: 8px;
  background: #fff;
}

.table-item-search svg {
  width: 16px;
  height: 16px;
  color: var(--accent);
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.table-item-search input {
  width: 100%;
  min-width: 0;
  min-height: 30px;
  padding: 4px 6px;
  border: 0;
  background: transparent;
  outline: 0;
}

.table-item-search button.small {
  min-height: 28px;
}

.table-item-search span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}

.daily-item-search {
  flex: 1 1 360px;
  margin-left: auto;
}

.subtabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  margin-bottom: 12px;
  background: #e8eef1;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.subtab {
  min-height: 32px;
  border-radius: 6px;
  border-color: transparent;
  background: transparent;
  color: #405058;
}

.subtab.active {
  background: var(--panel);
  border-color: var(--line);
  color: var(--text);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.master-mode-switch {
  margin-bottom: 14px;
}

.master-mode-switch.subtabs {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, 136px);
  justify-content: start;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.work-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(300px, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}

.work-summary.single-summary {
  grid-template-columns: 1fr;
}

.summary-tile {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  overflow: hidden;
}

.summary-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  background: #f8fafb;
}

.summary-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.summary-head strong {
  font-size: 17px;
  text-align: right;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
}

.work-summary.single-summary .summary-grid {
  grid-template-columns: repeat(4, minmax(130px, 1fr));
}

.dsc-summary-tile .summary-grid {
  grid-template-columns: repeat(3, minmax(140px, 1fr));
}

.work-summary.single-summary .dsc-summary-tile .summary-grid {
  grid-template-columns: repeat(6, minmax(96px, 1fr));
}

.summary-grid div {
  padding: 7px 12px;
  border-top: 1px solid #eef2f4;
}

.summary-grid div:nth-child(1),
.summary-grid div:nth-child(2),
.dsc-summary-tile .summary-grid div:nth-child(3) {
  border-top: 0;
}

.summary-grid div:nth-child(odd) {
  border-right: 1px solid #eef2f4;
}

.dsc-summary-tile .summary-grid div:nth-child(odd) {
  border-right: 0;
}

.dsc-summary-tile .summary-grid div:not(:nth-child(3n)) {
  border-right: 1px solid #eef2f4;
}

.work-summary.single-summary #salesSummaryTile .summary-grid div:nth-child(3),
.work-summary.single-summary #salesSummaryTile .summary-grid div:nth-child(4) {
  border-top: 0;
}

.work-summary.single-summary #salesSummaryTile .summary-grid div:nth-child(odd) {
  border-right: 0;
}

.work-summary.single-summary #salesSummaryTile .summary-grid div:not(:nth-child(4n)) {
  border-right: 1px solid #eef2f4;
}

.work-summary.single-summary .dsc-summary-tile .summary-grid div,
.work-summary.single-summary .dsc-summary-tile .summary-grid div:nth-child(3) {
  border-top: 0;
}

.work-summary.single-summary .dsc-summary-tile .summary-grid div:not(:nth-child(6n)) {
  border-right: 1px solid #eef2f4;
}

.summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-bottom: 2px;
}

.summary-grid strong {
  display: block;
  overflow: hidden;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.summary-tile .status-text.ok { color: var(--ok); }
.summary-tile .status-text.warning { color: var(--warning); }
.summary-tile .status-text.danger-status,
.summary-tile .danger-status { color: var(--danger); }
.summary-tile .status-text.muted-status,
.summary-tile .muted-status { color: var(--muted); }

.next-action {
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f8fafb;
  color: #405058;
  font-weight: 600;
}
.next-action.warning-action-note {
  border-color: #f3c98b;
  background: #fff7ed;
  color: #8a4b05;
}
.next-action.pending-action-note {
  border-color: #fecdd3;
  background: #fff1f2;
  color: var(--danger);
}
.next-action.ready-action-note {
  border-color: #b7dccf;
  background: #eefaf5;
  color: var(--ok);
}
.next-action.closed-action-note {
  border-color: #d8c3a7;
  background: #fbf7f1;
  color: var(--warning);
}
.workflow-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 6px;
  margin: 0 0 10px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.workflow-step {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  min-width: 0;
  padding: 6px 9px;
  border-radius: 6px;
  color: #4c5e66;
  background: #f8fafb;
}

.workflow-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #aab7bd;
  flex: 0 0 auto;
}

.workflow-step div { min-width: 0; }

.workflow-step strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workflow-step span:last-child {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workflow-step.done {
  background: #eefaf5;
}

.workflow-step.done .workflow-dot { background: var(--ok); }

.workflow-step.pending {
  background: #fff1f2;
}

.workflow-step.pending .workflow-dot { background: var(--danger); }

.workflow-step.blocked {
  background: #f4f6f7;
  opacity: 0.82;
}

@media (max-width: 900px) {
  .work-summary,
  .work-summary.single-summary .summary-grid,
  .work-summary.single-summary .dsc-summary-tile .summary-grid,
  .dsc-summary-tile .summary-grid { grid-template-columns: 1fr; }
  .summary-grid div,
  .summary-grid div:nth-child(1),
  .summary-grid div:nth-child(2),
  .dsc-summary-tile .summary-grid div:nth-child(3),
  .work-summary.single-summary .dsc-summary-tile .summary-grid div { border-top: 1px solid #eef2f4; }
  .summary-grid div:first-child { border-top: 0; }
  .summary-grid div:nth-child(odd),
  .dsc-summary-tile .summary-grid div:not(:nth-child(3n)),
  .work-summary.single-summary .dsc-summary-tile .summary-grid div:not(:nth-child(6n)),
  .work-summary.single-summary #salesSummaryTile .summary-grid div:not(:nth-child(4n)) { border-right: 0; }
  .workflow-bar { grid-template-columns: 1fr; }
  .empty-action-card {
    align-items: stretch;
    flex-direction: column;
  }
  .inline-import-form {
    grid-template-columns: 1fr;
  }
  .sales-history-table { min-width: 760px; }
  .sales-history-edit { grid-template-columns: 1fr; }
  .sales-history-actions {
    justify-content: flex-start;
  }
}

.table-wrap {
  overflow: auto;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.result-box[hidden] { display: none; }

.report-section { margin-top: 16px; }
.report-filter-card {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(140px, 160px) minmax(140px, 160px) auto auto;
  align-items: end;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

.report-filter-title {
  display: grid;
  gap: 3px;
  align-self: center;
}

.report-filter-title strong {
  font-size: 16px;
  line-height: 1.15;
}

.report-filter-title span,
.report-filter-card label span {
  color: var(--muted);
  font-size: 12px;
}

.report-filter-card label {
  display: grid;
  gap: 5px;
}

.report-filter-card input {
  min-height: 36px;
}

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

.report-summary-strip div {
  display: grid;
  gap: 3px;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid #d7e4e7;
  border-radius: 8px;
  background: #fbfdfd;
}

.report-summary-strip span {
  color: var(--muted);
  font-size: 11px;
}

.report-summary-strip strong {
  overflow: hidden;
  font-size: 13px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-tile-groups {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.report-tile-group {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.report-group-title {
  min-height: 36px;
  display: flex;
  align-items: center;
  padding: 0 14px;
  border-bottom: 1px solid #dce8eb;
  background: #eaf6ff;
  color: #1f65a7;
  font-size: 12px;
  font-weight: 750;
}

.report-tile-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(136px, 1fr));
  gap: 10px;
  padding: 12px;
}

.report-tile {
  min-height: 118px;
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 5px;
  padding: 11px;
  border: 1px solid #dce8eb;
  border-radius: 8px;
  background: #fff;
  text-align: left;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
}

.report-tile:hover,
.report-tile.active {
  border-color: var(--accent);
  background: #f0fbf8;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.report-tile-icon {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: var(--accent);
}

.report-tile-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.report-tile strong {
  font-size: 12.5px;
  line-height: 1.2;
}

.report-tile span:not(.report-tile-icon) {
  min-height: 28px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.report-tile em {
  margin-top: 3px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef8f6;
  color: #075d56;
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
}

.report-output-card {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
}

.report-viewer-modal {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: 16px;
}

.report-viewer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.38);
}

.report-viewer-panel {
  position: relative;
  width: min(1180px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  display: flex;
  flex-direction: column;
  border: 1px solid #cbdce0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
  overflow: hidden;
}

.report-viewer-panel.fullscreen {
  width: calc(100vw - 18px);
  height: calc(100vh - 18px);
  max-height: calc(100vh - 18px);
}

.report-viewer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  background: #fbfdfd;
}

.report-viewer-title {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.report-viewer-title > span {
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0;
}

.report-viewer-title h3 {
  margin: 0;
  font-size: 17px;
  line-height: 1.15;
}

.report-viewer-title p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.report-viewer-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.report-viewer-actions .small {
  min-height: 32px;
}

.report-viewer-period-row {
  display: flex;
  align-items: end;
  gap: 10px;
  padding: 0 14px 12px;
  border-bottom: 1px solid var(--line);
  background: #fbfdfd;
}

.report-viewer-period-row.compact {
  justify-content: flex-end;
}

.report-viewer-period-title {
  min-width: 190px;
  display: grid;
  gap: 2px;
  padding: 7px 10px;
  border: 1px solid #d9e7e9;
  border-radius: 7px;
  background: #fff;
}

.report-viewer-period-title span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  text-transform: uppercase;
}

.report-viewer-period-title strong {
  font-size: 13px;
  line-height: 1.15;
}

.report-viewer-date {
  display: grid;
  gap: 3px;
  min-width: 142px;
}

.report-viewer-date span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.report-viewer-date input {
  width: 100%;
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.report-viewer-table {
  flex: 1 1 auto;
  min-height: 260px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.report-viewer-table .report-table-wrap {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  max-height: none;
}

.report-viewer-tools {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  background: #f7fbfb;
}

.report-viewer-tools > strong {
  margin-left: auto;
  color: #4d626b;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.report-search-field {
  flex: 1 1 340px;
  max-width: 520px;
  min-width: 240px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #cfe0e4;
  border-radius: 7px;
  background: #fff;
}

.report-search-field span {
  width: 16px;
  height: 16px;
  color: var(--accent);
  display: grid;
  place-items: center;
}

.report-search-field svg {
  width: 16px;
  height: 16px;
}

.report-search-field input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 30px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 13px;
}

.report-filter-toggle {
  background: #f1f7f8;
}

.report-viewer-mode-toggle {
  margin-right: 2px;
}

.report-output-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: #fbfdfd;
}

.report-output-head h3 {
  margin: 0;
  font-size: 15px;
}

.report-output-head p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.report-output-head > span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
}

.report-mode-toggle {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 4px;
  padding: 4px;
  border: 1px solid #d4e4e7;
  border-radius: 8px;
  background: #eef7f7;
}

.report-mode-toggle button {
  min-height: 30px;
  padding: 0 11px;
  border-color: transparent;
  border-radius: 6px;
  background: transparent;
  color: #405058;
  font-size: 12px;
  font-weight: 650;
}

.report-mode-toggle button.active {
  border-color: #b7d6d2;
  background: #fff;
  color: var(--accent);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.report-output-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.report-output-metrics div {
  display: grid;
  gap: 2px;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid #dfe9ec;
  border-radius: 8px;
  background: #f8fbfb;
}

.report-output-metrics span {
  color: var(--muted);
  font-size: 11px;
}

.report-output-metrics strong {
  font-size: 14px;
}

.report-output-metrics .danger strong { color: var(--danger); }
.report-output-metrics .ok strong { color: var(--ok); }

.report-table-wrap {
  border: 0;
  border-radius: 0;
  max-height: 520px;
}

.report-table-wrap th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.report-mapping-table {
  min-width: 980px;
}

.report-mapping-table td:first-child {
  min-width: 220px;
  font-weight: 650;
}

.report-mapping-table td:nth-child(2) {
  min-width: 460px;
  max-width: 620px;
  white-space: pre-line;
  line-height: 1.45;
}

.report-trace-table {
  min-width: 1180px;
}

.report-trace-table td:first-child,
.report-trace-table td:nth-child(2) {
  min-width: 240px;
  white-space: normal;
  line-height: 1.35;
}

.report-trace-table .formula-cell {
  min-width: 220px;
  color: #18343d;
  font-weight: 650;
  white-space: normal;
  line-height: 1.35;
}

.report-adjustment-table td {
  vertical-align: top;
}

.report-adjustment-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

.report-adjustment-table th,
.report-adjustment-table td {
  padding: 8px 7px;
  overflow: visible;
}

.report-adjustment-table td:nth-child(4),
.report-adjustment-table td:nth-child(7),
.report-adjustment-table td:nth-child(8),
.report-adjustment-table td:nth-child(9),
.report-adjustment-table td:nth-child(10) {
  white-space: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.report-adjustment-table td:nth-child(4) {
  font-weight: 600;
}

.report-adjustment-table td.reason-cell {
  color: #243942;
}

.report-adjustment-table td.impact-breakdown-cell {
  white-space: normal;
  line-height: 1.45;
}

.report-adjustment-table td.impact-head-cell {
  color: #1e333c;
}

.report-adjustment-table td.impact-qty-cell {
  text-align: center;
}

.report-adjustment-table td.recipe-qty-cell {
  text-align: center;
}

.report-adjustment-table .num {
  text-align: right;
}

.report-adjustment-summary-table .source-item-cell {
  font-weight: 600;
}

.report-adjustment-summary-table .reason-cell {
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: pre-line;
}

.report-adjustment-summary-table .invoice-cell {
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: pre-line;
}

.report-adjustment-summary-table .impact-head-cell,
.report-adjustment-summary-table .recipe-qty-cell,
.report-adjustment-summary-table .impact-qty-cell {
  border-left: 1px solid #edf4f5;
}

.report-adjustment-summary-table td[rowspan] {
  vertical-align: middle;
}

.report-adjustment-summary-table .source-qty-cell {
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.report-adjustment-summary-table .impact-head-cell {
  padding-left: 9px;
  font-size: 12.5px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.report-adjustment-summary-table .recipe-qty-cell {
  color: #4f6470;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  text-align: center;
  white-space: nowrap;
}

.report-adjustment-summary-table .impact-qty-cell {
  padding-right: 7px;
  text-align: center;
}

.report-adjustment-summary-table .impact-qty-cell strong {
  display: block;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.report-adjustment-summary-table th.num,
.report-adjustment-summary-table th.recipe-qty-cell,
.report-adjustment-summary-table th.impact-qty-cell {
  text-align: center;
}

.report-adjustment-summary-table .impact-qty-cell strong.negative {
  color: var(--danger);
}

.report-adjustment-summary-table .impact-qty-cell strong.positive {
  color: var(--ok);
}

.report-adjustment-summary-table .adjustment-impact-subrow td {
  border-top: 1px dashed #dbe6e8;
}

.report-adjustment-summary-table .adjustment-impact-mainrow + .adjustment-impact-mainrow td,
.report-adjustment-summary-table .adjustment-impact-subrow + .adjustment-impact-mainrow td {
  border-top: 1px solid var(--line);
}

.adjustment-report-impact {
  display: grid;
  gap: 3px;
  width: 100%;
}

.adjustment-report-impact-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(88px, auto);
  align-items: start;
  gap: 14px;
  padding: 2px 0;
}

.adjustment-report-impact-row + .adjustment-report-impact-row {
  border-top: 1px dashed #dbe6e8;
  padding-top: 5px;
}

.adjustment-report-impact-row span {
  min-width: 0;
  white-space: normal;
}

.adjustment-report-impact-row strong {
  justify-self: end;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.adjustment-report-impact-row strong.negative {
  color: var(--danger);
}

.adjustment-report-impact-row strong.positive {
  color: var(--ok);
}

.adjustment-report-heads,
.adjustment-report-qtys {
  display: grid;
  gap: 0;
  width: 100%;
}

.adjustment-report-heads div,
.adjustment-report-qtys strong {
  min-height: 25px;
  padding: 2px 0;
  border-bottom: 1px dashed #dbe6e8;
}

.adjustment-report-heads div:last-child,
.adjustment-report-qtys strong:last-child {
  border-bottom: 0;
}

.adjustment-report-heads div {
  overflow-wrap: anywhere;
}

.adjustment-report-qtys strong {
  display: block;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.adjustment-report-qtys strong.negative {
  color: var(--danger);
}

.adjustment-report-qtys strong.positive {
  color: var(--ok);
}

.report-limit-note {
  padding: 9px 12px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
}
.work-panel {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}
.work-panel[hidden] { display: none; }

body.work-fullscreen { overflow: hidden; }

.work-panel.fullscreen {
  position: fixed;
  inset: 10px;
  z-index: 30;
  margin: 0;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.24);
}
.report-view { display: none; }
.report-view.active { display: block; }
.report-head {
  background: var(--panel);
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}

.report-head + .table-wrap { border-radius: 0 0 8px 8px; }

.inline-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.work-head {
  position: sticky;
  top: 78px;
  z-index: 5;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 9px 54px 9px 12px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  background: #f8fbfb;
}

.work-head-left {
  min-width: 0;
  padding-right: 4px;
}

.stock-history-back {
  display: inline-flex;
  width: fit-content;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 0;
  padding: 0 10px;
  border-color: #cfd9de;
  background: #f6f8f9;
  color: #33434c;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.stock-history-back svg {
  width: 16px;
  height: 16px;
  stroke-width: 2.75;
}

.stock-history-back:focus {
  outline: none;
}

.stock-history-back[hidden] {
  display: none !important;
}

.stock-history-back:hover,
.stock-history-back:focus-visible {
  border-color: #aebdc4;
  background: #eef2f4;
  color: #1f2f37;
  box-shadow: 0 0 0 3px rgba(51, 67, 76, 0.08);
}

#backToStockHistoryTop.stock-history-back {
  position: absolute;
  top: 8px;
  right: 10px;
  width: auto;
  min-width: 66px;
  height: 36px;
  min-height: 36px;
  gap: 4px;
  padding: 0 10px;
  border-color: #9aa9b2;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #edf1f3 100%);
  color: #15262f;
  box-shadow: 0 2px 7px rgba(15, 23, 42, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  z-index: 2;
}

#backToStockHistoryTop.stock-history-back svg {
  width: 16px;
  height: 16px;
  stroke-width: 2.5;
}

#backToStockHistoryTop.stock-history-back:hover,
#backToStockHistoryTop.stock-history-back:focus-visible {
  border-color: #6f808a;
  background: linear-gradient(180deg, #ffffff 0%, #e3e9ec 100%);
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.18), 0 0 0 3px rgba(51, 67, 76, 0.08);
}

.work-item-search {
  flex: 1 1 320px;
  width: auto;
  min-width: min(320px, 100%);
  max-width: 500px;
  margin-top: 0;
}

.work-title-line {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.work-title-line h3 {
  margin: 0;
  font-size: 15px;
  line-height: 1.2;
}

.work-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin-left: 0;
  flex-wrap: wrap;
}

.work-filter-actions,
.work-commit-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}

.work-filter-actions {
  padding: 3px;
  border: 1px solid #d7e5e7;
  border-radius: 8px;
  background: #eef6f6;
}

.work-filter-actions button {
  min-height: 30px;
  padding: 0 10px;
  border-color: transparent;
  background: transparent;
  color: #344b55;
  font-size: 12px;
}

.work-filter-actions button:hover {
  border-color: #b8ced3;
  background: #f9fcfc;
}

.work-filter-actions button.active {
  border-color: var(--accent);
  background: #fff;
  color: var(--accent-strong);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.stock-template-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px;
  border: 1px solid #d7e5e7;
  border-radius: 8px;
  background: #f6faf9;
  flex: 0 0 auto;
}

.stock-template-actions[hidden] {
  display: none;
}

.stock-template-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 30px;
  padding: 0 9px;
  border-color: #c7dcdf;
  background: #fff;
  color: #244851;
  font-size: 12px;
  font-weight: 750;
}

.stock-template-actions button:hover {
  border-color: var(--accent);
  color: var(--accent-strong);
}

.stock-template-actions button:disabled {
  color: #8ea1a8;
  background: #f1f5f6;
  border-color: #d7e0e3;
}

.stock-template-actions .excel-file-icon {
  min-width: 26px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #9fd0c7;
  border-radius: 5px;
  background: #e9fbf6;
  color: #067064;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

.stock-template-action-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.stock-template-actions button:disabled .excel-file-icon {
  border-color: #cfdbdf;
  background: #eef3f4;
  color: #91a2a8;
}

#toggleStaffAllRows.active,
#toggleStaffPendingRows.active,
#toggleStaffCountedRows.active {
  border-color: rgba(15, 118, 110, 0.36);
  background: #e7fbf5;
  color: #00695f;
  box-shadow: inset 0 -1px 0 rgba(15, 118, 110, 0.14), 0 1px 3px rgba(15, 23, 42, 0.07);
}

.work-commit-actions {
  margin-left: auto;
  padding-left: 10px;
  border-left: 1px solid #dbe5e8;
}

.work-commit-actions button {
  min-height: 36px;
  font-size: 12px;
}

.work-commit-actions .stock-history-back {
  min-width: 112px;
  height: 34px;
  flex: 0 0 auto;
}

#saveImportStock,
#closeImportDay,
#reopenImportDay {
  min-width: 94px;
}

#removeSales {
  min-width: 100px;
}

@media (max-width: 1240px) {
  .work-commit-actions {
    margin-left: auto;
  }
}

@media (max-width: 760px) {
  .work-actions,
  .work-filter-actions,
  .stock-template-actions,
  .work-item-search,
  .work-commit-actions {
    width: 100%;
  }

  .work-commit-actions {
    padding-left: 0;
    border-left: 0;
  }

  .work-filter-actions button,
  .stock-template-actions button,
  .work-commit-actions button {
    flex: 1 1 auto;
  }
}

.icon-button {
  display: inline-grid;
  place-items: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border-radius: 8px;
  background: #fff;
  color: #405058;
}

.icon-button svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.adjust-input-wrap {
  position: relative;
  display: block;
  width: 100%;
}

.adjust-input-wrap input {
  width: 100%;
  padding-right: 34px !important;
}

.adjust-tool {
  position: absolute;
  top: 50%;
  right: 3px;
  transform: translateY(-50%);
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
  border-radius: 6px;
  border-color: #cfe0e4;
  background: #f8fbfb;
  color: var(--accent-strong);
}

.adjust-tool:hover {
  border-color: var(--accent);
  background: #e9f8f5;
}

.adjust-tool svg {
  width: 15px;
  height: 15px;
}

.work-fullpage-toggle {
  position: absolute;
  top: 8px;
  right: 10px;
  border-color: #cbd8dd;
}

.work-fullpage-toggle:hover,
.work-fullpage-toggle.active {
  border-color: var(--accent);
  background: #e9f8f5;
  color: var(--accent-strong);
}

.staff-stock-panel .work-fullpage-toggle {
  display: none;
}

.work-panel.fullscreen .work-fullpage-toggle {
  display: none;
}

.work-panel.fullscreen .work-head {
  position: static;
  flex: 0 0 auto;
}

.work-meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 5px;
}

.staff-stock-panel .work-meta {
  display: block;
}

.staff-count-overview {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid #d4e6e6;
  border-radius: 10px;
  background: #fff;
}

.staff-count-title {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.staff-count-title span {
  overflow: hidden;
  color: #075e54;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-count-title strong {
  color: #0f172a;
  font-size: 18px;
  line-height: 1.1;
}

.staff-count-title em {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-count-status-grid {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.staff-count-status-grid span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 86px;
  min-height: 32px;
  padding: 4px 9px;
  border: 1px solid #d7e5e7;
  border-radius: 999px;
  background: #f8fbfb;
  color: #334155;
  font-size: 11px;
  font-weight: 650;
}

.staff-count-status-grid small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.staff-count-status-grid strong {
  color: #0f172a;
  font-size: 12px;
  line-height: 1;
}

.staff-count-status-grid .ok {
  border-color: #b7dccf;
  background: #eefaf5;
  color: #047857;
}

.staff-count-status-grid .warning {
  border-color: #fecaca;
  background: #fff1f1;
  color: var(--danger);
}

.stock-unsaved-badge {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #b45309 !important;
}

.stock-unsaved-badge[hidden] {
  display: none !important;
}

@media (max-width: 940px) {
  .staff-count-overview {
    grid-template-columns: 1fr;
  }

  .staff-count-status-grid {
    justify-content: flex-start;
  }
}

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 1px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8fafb;
  color: #405058;
  font-size: 11px;
}

.status-open { border-color: #b7dccf; background: #eefaf5; color: var(--ok); }
.status-closed { border-color: #e4c8a1; background: #fff7ed; color: var(--warning); }
.status-pill.danger-pill { border-color: #fecaca; background: #fff1f1; color: var(--danger); }
.adjustment-pill { border-color: #b9ced6; background: #f3f8fa; color: #344b55; }
.variance-pill { border-color: #f0c2c2; background: #fff1f1; color: var(--danger); }
.workspace-pill {
  border-color: #b8d8d4;
  background: #eaf8f5;
  color: #075e54;
  font-weight: 700;
}

#toggleAdjustments.active,
#toggleAdjustmentRows.active,
#toggleVarianceRows.active {
  border-color: var(--accent);
  background: #fff;
  color: var(--accent-strong);
  font-weight: 650;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.stock-table-wrap {
  height: clamp(320px, 48vh, 560px);
  border: 0;
  border-radius: 0 0 8px 8px;
  scrollbar-gutter: stable;
}

.staff-stock-panel .work-head,
.staff-stock-panel .work-filter-row,
.staff-stock-panel .top-scroll,
.staff-stock-panel .stock-table-wrap {
  width: min(100% - 44px, 1180px);
  margin-left: auto;
  margin-right: auto;
}

.work-panel.fullscreen .stock-table-wrap {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
}

.top-scroll {
  position: sticky;
  top: 136px;
  z-index: 4;
  overflow-x: auto;
  overflow-y: hidden;
  height: 20px;
  border-bottom: 1px solid var(--line);
  background: #f3f7f8;
  flex: 0 0 auto;
}

.work-panel.fullscreen .top-scroll {
  position: static;
}

.top-scroll div { height: 1px; }
.top-scroll::-webkit-scrollbar { height: 14px; }

.stock-table {
  min-width: 2070px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

#importStockTable:not(.show-adjustments) {
  min-width: 1310px;
}

#importStockTable:not(.show-adjustments) .adjust-col {
  display: none;
}

#importStockTable.show-adjustment-rows:not(.show-variance-rows) tbody tr.no-adjustment-row,
#importStockTable.show-variance-rows:not(.show-adjustment-rows) tbody tr.no-variance-row,
#importStockTable.show-adjustment-rows.show-variance-rows tbody tr.no-adjustment-row.no-variance-row {
  display: none;
}

#importStockTable tbody tr.search-hidden,
#dscTable tbody tr.search-hidden {
  display: none;
}

#importStockTable th {
  top: 0;
  z-index: 4;
  background: #e9f1f2;
  border-bottom: 1px solid #cdd9dd;
}

#importStockTable th:nth-child(1),
#importStockTable td:nth-child(1) {
  position: sticky;
  left: 0;
  width: 58px;
  min-width: 58px;
  max-width: 58px;
  z-index: 3;
  background: var(--panel);
}

#importStockTable th:nth-child(2),
#importStockTable td:nth-child(2) {
  position: sticky;
  left: 58px;
  width: 300px;
  min-width: 300px;
  max-width: 300px;
  z-index: 3;
  background: var(--panel);
  box-shadow: 8px 0 12px -12px rgba(15, 23, 42, 0.45);
}

#importStockTable th:nth-child(1),
#importStockTable th:nth-child(2) {
  z-index: 6;
  background: #e9f1f2;
}

#importStockTable th:nth-child(3), #importStockTable td:nth-child(3) { width: 86px; min-width: 86px; max-width: 86px; }
#importStockTable th:nth-child(4), #importStockTable td:nth-child(4) { width: 106px; min-width: 106px; max-width: 106px; }
#importStockTable th:nth-child(5), #importStockTable td:nth-child(5) { width: 94px; min-width: 94px; max-width: 94px; }
#importStockTable th:nth-child(6), #importStockTable td:nth-child(6) { width: 96px; min-width: 96px; max-width: 96px; }
#importStockTable th:nth-child(7), #importStockTable td:nth-child(7) { width: 106px; min-width: 106px; max-width: 106px; }
#importStockTable th:nth-child(8), #importStockTable td:nth-child(8) { width: 106px; min-width: 106px; max-width: 106px; }
#importStockTable th:nth-child(9), #importStockTable td:nth-child(9) { width: 120px; min-width: 120px; max-width: 120px; }
#importStockTable th:nth-child(10), #importStockTable td:nth-child(10) { width: 120px; min-width: 120px; max-width: 120px; }
#importStockTable th:nth-child(11), #importStockTable td:nth-child(11) { width: 106px; min-width: 106px; max-width: 106px; }
#importStockTable th:nth-child(12), #importStockTable td:nth-child(12) { width: 118px; min-width: 118px; max-width: 118px; }
#importStockTable th:nth-child(13), #importStockTable td:nth-child(13) { width: 108px; min-width: 108px; max-width: 108px; }
#importStockTable th:nth-child(14), #importStockTable td:nth-child(14) { width: 116px; min-width: 116px; max-width: 116px; }
#importStockTable th:nth-child(15), #importStockTable td:nth-child(15) { width: 108px; min-width: 108px; max-width: 108px; }
#importStockTable th:nth-child(16), #importStockTable td:nth-child(16) { width: 54px; min-width: 54px; max-width: 54px; }
#importStockTable th:nth-child(17), #importStockTable td:nth-child(17) { width: 170px; min-width: 170px; max-width: 170px; }

#importStockTable th:nth-child(n+3):nth-child(-n+15) {
  text-align: right;
  padding-right: 14px;
}

#dscTable th:nth-child(n+3):nth-child(-n+14) {
  text-align: right;
  padding-right: 19px;
}

#importStockTable tbody tr:hover td { background: #f7fbfb; }
#importStockTable tbody tr:focus-within td { background: #eefaf8; }
#importStockTable td { overflow: hidden; }
#importStockTable th,
#importStockTable td {
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.25;
}

#importStockTable td:nth-child(2) {
  color: #26343a;
  font-weight: 500;
}

#importStockTable tbody tr:nth-child(even) td {
  background: #fcfefe;
}

#importStockTable input {
  width: 100%;
  max-width: 100%;
  min-height: 28px;
  box-sizing: border-box;
  padding: 3px 8px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  appearance: textfield;
}

#importStockTable input::-webkit-outer-spin-button,
#importStockTable input::-webkit-inner-spin-button {
  margin: 0;
  appearance: none;
}
#importStockTable input[data-field="purchase"] { background: #f7fbff; }
#importStockTable input[data-field="physicalClosing"] {
  border-color: #a8cfc8;
  background: #fbfffd;
  font-weight: 650;
}
#importStockTable input.remarks,
#dscTable input.remarks {
  display: none;
  text-align: left;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  font-variant-numeric: normal;
  letter-spacing: 0;
}
#importStockTable input:focus {
  outline: 2px solid rgba(15, 118, 110, 0.18);
  border-color: var(--accent);
}

#importStockTable.staff-closing-table {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

#importStockTable.staff-closing-table:not(.show-adjustments) {
  min-width: 0;
}

.staff-stock-panel .work-head {
  background: #fbfefe;
  gap: 8px;
  padding: 8px 10px 10px;
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.staff-stock-panel .work-head,
.staff-stock-panel .stock-table-wrap {
  width: min(100% - 56px, 1120px);
  margin-left: auto;
  margin-right: auto;
}

.staff-stock-panel .work-actions {
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
}

.staff-stock-panel .work-item-search {
  flex: 1 1 300px;
  max-width: 360px;
  min-width: 240px;
}

.staff-stock-panel .work-filter-actions {
  display: none;
  padding: 2px;
  gap: 2px;
  background: #e7f3f2;
  border-color: #bfd6d9;
  border-radius: 10px;
  flex: 0 0 auto;
}

.staff-stock-panel .work-filter-actions button {
  min-height: 28px;
  padding: 0 11px;
  border-radius: 8px;
  font-size: 11px;
}

.staff-stock-panel .stock-template-actions {
  min-height: 36px;
  background: #f7fbfb;
  border-color: #c9dde0;
}

.staff-stock-panel .stock-template-actions button {
  min-height: 28px;
  border-radius: 8px;
  font-size: 11px;
}

.staff-stock-panel .work-commit-actions {
  display: flex;
  align-items: center;
  align-self: stretch;
  gap: 8px;
  padding-left: 10px;
  flex: 0 0 auto;
}

.staff-stock-panel .work-commit-actions button {
  width: 136px;
  min-width: 136px;
  height: 36px;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1;
}

.staff-stock-panel #saveImportStock {
  min-height: 36px;
  box-shadow: 0 2px 0 rgba(0, 85, 76, 0.22);
}

#saveImportStock.save-return-action {
  min-width: 150px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  white-space: nowrap;
}

#saveImportStock.save-return-action svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: 0 0 auto;
}

#saveImportStock.save-return-action span {
  line-height: 1;
}

.staff-stock-panel.staff-quick-entry-mode .work-item-search {
  display: none;
}

.staff-stock-panel.staff-quick-entry-mode {
  padding-bottom: 56px;
}

.staff-quick-count-panel {
  width: min(100% - 56px, 1120px);
  margin: 0 auto 18px;
  border: 1px solid #cfe0e2;
  border-radius: 8px;
  background: #ffffff;
  overflow: visible;
  position: relative;
  z-index: 8;
}

.staff-quick-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 8px 10px;
  border-bottom: 1px solid #dbe7e9;
  background: #fbfefe;
}

.staff-quick-head strong {
  display: block;
  color: #15242b;
  font-size: 13px;
  font-weight: 750;
}

.staff-quick-head span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-top: 2px;
}

.staff-entry-mode-tabs {
  display: inline-flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid #b8d1d3;
  border-radius: 10px;
  background: #dfeeed;
  flex: 0 0 auto;
}

.staff-entry-mode-tabs button {
  min-height: 28px;
  padding: 0 11px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #284650;
  font-size: 11px;
  font-weight: 750;
}

.staff-entry-mode-tabs button.active {
  border: 1px solid rgba(15, 118, 110, 0.48);
  background: #ffffff;
  color: var(--accent);
  box-shadow: 0 2px 0 rgba(15, 118, 110, 0.16), 0 1px 4px rgba(15, 23, 42, 0.1);
}

.stock-entry-mode-tabs {
  align-self: center;
  min-height: 36px;
}

.staff-stock-panel .stock-entry-mode-tabs {
  background: #e2f1f0;
  border-color: #b8d1d3;
}

.staff-stock-panel .stock-entry-mode-tabs button {
  min-width: 76px;
}

@media (max-width: 1160px) {
  .staff-stock-panel .work-actions {
    flex-wrap: wrap;
  }

  .staff-stock-panel .work-item-search {
    flex: 1 1 100%;
    max-width: none;
  }

  .staff-stock-panel .work-commit-actions {
    margin-left: auto;
  }
}

.staff-quick-body {
  padding: 10px 12px 18px;
  overflow: visible;
}

.staff-quick-split {
  display: grid;
  grid-template-columns: minmax(320px, 370px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  overflow: visible;
}

.staff-quick-entry-card {
  position: relative;
  z-index: 3;
  padding: 10px;
  border: 1px solid #cfe3e5;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fcfc 100%);
  box-shadow: 0 8px 18px rgba(15, 43, 50, 0.04);
  overflow: visible;
}

.staff-quick-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 9px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e1ecee;
}

.staff-quick-card-head strong,
.staff-quick-card-head span {
  display: block;
}

.staff-quick-card-head strong {
  color: #132b32;
  font-size: 13px;
  font-weight: 750;
}

.staff-quick-card-head span {
  margin-top: 2px;
  color: #60777f;
  font-size: 11px;
}

.staff-quick-entry-grid {
  display: grid;
  grid-template-columns: minmax(118px, 0.7fr) minmax(0, 1fr);
  column-gap: 10px;
  row-gap: 10px;
  align-items: end;
}

.staff-quick-entry-grid .staff-quick-item-field,
.staff-quick-entry-grid .staff-quick-qty-field,
.staff-quick-entry-grid .staff-quick-submit {
  grid-column: 1 / -1;
}

.staff-quick-entry-grid label {
  display: grid;
  gap: 5px;
  margin: 0;
  min-width: 0;
}

.staff-quick-search-field {
  position: relative;
  min-width: 0;
}

.staff-quick-entry-grid label span {
  color: #506c76;
  font-size: 11px;
  font-weight: 700;
}

.staff-quick-entry-grid input,
.staff-quick-entry-grid select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid #c8dde0;
  border-radius: 8px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfefe 100%);
  color: #14272e;
  font-size: 13px;
  font-weight: 500;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.staff-quick-entry-grid input:focus,
.staff-quick-entry-grid select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.staff-quick-entry-grid input::placeholder {
  color: #7e9299;
  font-weight: 500;
}

.staff-quick-suggest-menu {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  right: 0;
  z-index: 30;
  min-width: min(430px, calc(100vw - 48px));
  max-height: 320px;
  overflow: auto;
  padding: 6px;
  border: 1px solid #b9d5d8;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.18);
  scrollbar-gutter: stable;
}

.staff-quick-item-field .staff-quick-suggest-menu {
  min-width: 100%;
}

.staff-quick-suggest-option {
  display: grid;
  width: 100%;
  min-height: 40px;
  grid-template-columns: 86px minmax(0, 1fr) 48px;
  gap: 10px;
  align-items: center;
  padding: 7px 9px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #15242b;
  text-align: left;
  cursor: pointer;
}

.staff-quick-suggest-option:hover,
.staff-quick-suggest-option:focus {
  outline: none;
  background: #ecf8f5;
}

.staff-quick-suggest-code {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  justify-content: center;
  padding: 0 7px;
  border: 1px solid #bfe0dc;
  border-radius: 999px;
  background: #f4fffc;
  color: #006b61;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.staff-quick-suggest-name {
  overflow: hidden;
  color: #132b32;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-quick-suggest-uom {
  justify-self: end;
  color: #587078;
  font-size: 11px;
  font-weight: 750;
}

.staff-quick-suggest-empty {
  padding: 10px 9px;
  color: #60777f;
  font-size: 12px;
}

.staff-quick-entry-grid button {
  width: 100%;
  height: 35px;
  min-height: 35px;
  border-radius: 8px;
  font-size: 13px;
}

.staff-quick-selected {
  min-height: 24px;
  margin-top: 9px;
  padding: 6px 8px;
  border: 1px solid #d9e7e9;
  border-radius: 7px;
  background: #f8fbfb;
  color: #5a727b;
  font-size: 11px;
  line-height: 1.35;
  overflow: visible;
  white-space: normal;
}

.staff-quick-selected.has-selection {
  min-height: 28px;
  padding: 8px 9px;
  border-color: #a9d8d1;
  background: #effbf8;
  color: #173d42;
}

.staff-quick-selected span {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  margin-left: 8px;
  padding: 0 8px;
  border: 1px solid #cfe6e1;
  border-radius: 999px;
  background: #fff;
  color: var(--accent);
  font-weight: 750;
}

.staff-quick-selected.needs-choice {
  border-color: #f5c58f;
  background: #fff8eb;
  padding: 8px 10px 10px;
}

.staff-quick-duplicate {
  display: grid;
  gap: 6px;
}

.staff-quick-duplicate strong {
  display: block;
  color: #8a4c00;
  font-size: 12px;
}

.staff-quick-duplicate span {
  display: block;
  min-height: 0;
  margin: 2px 0 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #173d42;
  font-weight: 750;
}

.staff-quick-duplicate em {
  display: block;
  margin-top: 2px;
  color: #6a7c82;
  font-size: 11px;
  font-style: normal;
}

.staff-quick-duplicate-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.staff-quick-duplicate-actions button {
  min-height: 28px;
  border: 1px solid #d7b16d;
  border-radius: 8px;
  background: #fffdf7;
  color: #6f4400;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.staff-quick-duplicate-actions button:hover,
.staff-quick-duplicate-actions button:focus {
  outline: none;
  border-color: #b77812;
  background: #fff4d8;
}

.staff-quick-sheet {
  min-width: 0;
  border: 1px solid #d6e4e6;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 43, 50, 0.035);
}

.staff-quick-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 8px;
  border-bottom: 1px solid #dbe7e9;
  background: #fbfefe;
}

.staff-quick-sheet-head strong {
  display: block;
  color: #15242b;
  font-size: 12px;
  font-weight: 750;
}

.staff-quick-sheet-head span {
  color: #5b737b;
  font-size: 11px;
}

.staff-quick-sheet-wrap {
  max-height: 322px;
  overflow-x: hidden;
  overflow-y: auto;
}

.staff-quick-sheet table {
  width: 100%;
  min-width: 0 !important;
  border-collapse: collapse;
  table-layout: fixed;
}

.staff-quick-sheet th,
.staff-quick-sheet td {
  padding: 4px 6px;
  border-bottom: 1px solid #e1ebed;
  color: #15242b;
  font-size: 11px;
  vertical-align: middle;
}

.staff-quick-sheet th {
  background: #eaf3f4;
  color: #26444e;
  font-size: 11px;
  font-weight: 750;
  text-transform: none;
}

.staff-quick-sheet th:nth-child(1),
.staff-quick-sheet td:nth-child(1) {
  width: 40%;
}

.staff-quick-sheet th:nth-child(2),
.staff-quick-sheet td:nth-child(2) {
  width: 22%;
}

.staff-summary-item-top {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.staff-summary-item-top strong {
  flex: 0 1 auto;
}

.staff-summary-uom-mobile {
  display: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 18px;
  padding: 0 7px;
  border: 1px solid #d3e8ea;
  border-radius: 999px;
  color: #20515a;
  background: #f5fbfb;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.staff-summary-item-cell strong,
.staff-summary-item-cell span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-summary-item-cell strong {
  color: #0f3f46;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.staff-summary-item-cell span {
  margin-top: 1px;
  color: var(--muted);
  font-size: 10.5px;
}

.staff-quick-sheet th:nth-child(2) {
  text-align: center;
}

.staff-quick-sheet td:nth-child(2) {
  padding-left: 10px;
}

.staff-quick-sheet th:nth-child(3),
.staff-quick-sheet td:nth-child(3) {
  width: 52px;
  text-align: center;
}

.staff-quick-sheet th:nth-child(4),
.staff-quick-sheet td:nth-child(4) {
  width: 82px;
}

.staff-quick-sheet th:nth-child(5),
.staff-quick-sheet td:nth-child(5) {
  width: 46px;
  text-align: center;
}

.staff-quick-sheet input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  height: 26px;
  min-height: 26px;
  padding: 3px 6px;
  border-radius: 7px;
  font-size: 11px;
  text-align: right;
}

.staff-summary-add-control {
  display: block;
}

.staff-summary-add-button {
  display: none;
}

.staff-quick-sheet .staff-uom-chip {
  min-width: 34px;
  padding: 0 6px;
}

.staff-quick-sheet .empty-cell {
  height: 44px;
  color: #697f87;
  text-align: center;
}

.staff-summary-action-cell {
  padding-left: 3px !important;
  padding-right: 3px !important;
}

.staff-summary-delete {
  width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  color: #dc2626;
  border-color: #fecaca;
  background: #fff7f7;
}

.staff-summary-delete:hover,
.staff-summary-delete:focus {
  color: #b91c1c;
  border-color: #fca5a5;
  background: #fee2e2;
}

.staff-summary-delete svg {
  width: 15px;
  height: 15px;
}

.staff-quick-count-panel.list-mode {
  margin: 10px auto 0;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: #fbfefe;
}

@media (max-width: 1100px) {
  .staff-quick-split {
    grid-template-columns: 1fr;
  }

  .staff-quick-sheet-wrap {
    max-height: 220px;
  }
}

.staff-quick-count-panel.list-mode .staff-quick-head {
  padding: 10px 12px;
  border-bottom: 1px solid #dbe7e9;
}

.staff-quick-count-panel.list-mode .staff-quick-head span {
  max-width: 520px;
}

.staff-quick-count-panel.list-mode + .stock-table-wrap {
  margin-top: 0;
  border-top: 0;
  border-radius: 0 0 10px 10px;
  box-shadow: inset 0 1px 0 #d7e5e7;
}

.staff-stock-panel .stock-table-wrap {
  border: 1px solid #d7e5e7;
  border-top: 0;
  border-radius: 0 0 10px 10px;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: auto;
  box-sizing: border-box;
  clip-path: none;
}

#importStockTable.staff-closing-table th,
#importStockTable.staff-closing-table td {
  box-sizing: border-box;
  padding: 6px 8px;
  font-size: 12px;
}

#importStockTable.staff-closing-table thead th {
  position: sticky;
  top: 0;
  z-index: 7;
  height: 30px;
  background: #e9f1f2;
  color: #21414a;
  font-size: 11px;
  font-weight: 750;
}

#importStockTable.staff-closing-table.show-staff-pending .staff-counted-row,
#importStockTable.staff-closing-table.show-staff-counted .staff-pending-row {
  display: none;
}

#importStockTable.staff-closing-table.show-staff-pending .staff-counted-row.staff-active-edit-row,
#importStockTable.staff-closing-table.show-staff-counted .staff-pending-row.staff-active-edit-row {
  display: table-row;
}

#importStockTable.staff-closing-table .staff-counted-row td {
  background: #fff;
}

#importStockTable.staff-closing-table .staff-pending-row td {
  background: #fffcf5;
}

#importStockTable.staff-closing-table .staff-counted-row td:first-child {
  border-left: 3px solid transparent;
}

#importStockTable.staff-closing-table .staff-pending-row td:first-child {
  border-left: 3px solid #f59e0b;
}

#importStockTable.staff-closing-table tbody tr:hover td,
#importStockTable.staff-closing-table tbody tr:focus-within td {
  background: #f7fbfb;
}

.stock-count-history-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

.sales-history-list.stock-count-history-list .stock-count-history-table {
  min-width: 0;
}

.stock-count-history-table > thead > tr > th,
.stock-count-history-table > tbody > tr > td {
  box-sizing: border-box;
  padding: 7px 8px;
  vertical-align: middle;
}

.stock-count-history-table > thead > tr > th:nth-child(1),
.stock-count-history-table > tbody > tr > td:nth-child(1) {
  width: 16%;
}

.stock-count-history-table > thead > tr > th:nth-child(2),
.stock-count-history-table > tbody > tr > td:nth-child(2) {
  width: 13%;
}

.stock-count-history-table > thead > tr > th:nth-child(3),
.stock-count-history-table > tbody > tr > td:nth-child(3) {
  width: 13%;
}

.stock-count-history-table > thead > tr > th:nth-child(4),
.stock-count-history-table > tbody > tr > td:nth-child(4) {
  width: 23%;
}

.stock-count-history-table > thead > tr > th:nth-child(5),
.stock-count-history-table > tbody > tr > td:nth-child(5) {
  width: 19%;
}

.stock-count-history-table > thead > tr > th:nth-child(6),
.stock-count-history-table > tbody > tr > td:nth-child(6) {
  width: 72px;
  padding-left: 4px;
  padding-right: 4px;
  text-align: center;
}

.stock-count-diff-status {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  min-width: 0;
  width: 100%;
  min-height: 32px;
  line-height: 1;
  white-space: nowrap;
}

.stock-count-diff-status strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 108px;
  min-height: 23px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
}

.stock-count-diff-status.muted strong {
  border: 1px solid #dbe6e9;
  background: #f7fafb;
  color: #60747d;
}

.stock-count-diff-status.ok strong {
  border: 1px solid #b7dccf;
  background: #eefaf5;
  color: var(--ok);
}

.stock-count-diff-status.warning strong {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  color: #b45309;
}

.stock-count-diff-toggle {
  flex: 0 0 auto;
  min-height: 23px;
  height: 23px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
}

.stock-count-diff-toggle.has-diff {
  border-color: #f3c27b;
  background: #fffaf0;
  color: #9a5a00;
}

.stock-count-diff-row > td {
  width: auto !important;
  padding: 0 !important;
  background: #fbfefe !important;
}

.stock-count-history-table > tbody > tr.stock-count-diff-row > td {
  width: auto !important;
}

.stock-count-diff-detail {
  display: grid;
  gap: 10px;
  padding: 12px 14px 14px;
  border-left: 3px solid #0f766e;
  background: #f7fbfb;
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
  overflow: hidden;
}

.stock-count-diff-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.stock-count-diff-head strong {
  color: #0f2e35;
  font-size: 13px;
}

.stock-count-diff-head span {
  color: var(--muted);
  font-size: 11px;
}

.stock-count-diff-detail table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background: #fff;
  font-size: 12px;
}

.stock-count-diff-detail th,
.stock-count-diff-detail td {
  padding: 6px 8px;
  border: 1px solid #dce9eb;
}

.stock-count-diff-detail th {
  background: #eaf3f4;
  color: #193640;
  text-align: left;
}

.stock-count-diff-detail th:nth-child(1),
.stock-count-diff-detail td:nth-child(1) {
  width: 14%;
}

.stock-count-diff-detail th:nth-child(2),
.stock-count-diff-detail td:nth-child(2) {
  width: 40%;
}

.stock-count-diff-detail th:nth-child(3),
.stock-count-diff-detail td:nth-child(3),
.stock-count-diff-detail th:nth-child(4),
.stock-count-diff-detail td:nth-child(4),
.stock-count-diff-detail th:nth-child(5),
.stock-count-diff-detail td:nth-child(5) {
  width: 13%;
}

.stock-count-diff-detail th:nth-child(6),
.stock-count-diff-detail td:nth-child(6) {
  width: 7%;
  text-align: center;
}

.stock-count-diff-detail th:nth-child(3),
.stock-count-diff-detail th:nth-child(4),
.stock-count-diff-detail th:nth-child(5) {
  text-align: right;
}

.stock-count-diff-detail td:nth-child(5) {
  text-align: right;
  padding-right: 16px;
}

.stock-count-diff-detail .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.stock-count-diff-detail .positive {
  color: #047857;
  font-weight: 800;
}

.stock-count-diff-detail .negative {
  color: var(--danger);
  font-weight: 800;
}

.stock-count-no-diff {
  color: var(--muted);
  text-align: center;
}

.stock-count-change-history {
  display: grid;
  gap: 8px;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.stock-count-step-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed;
  font-size: 11.5px !important;
}

.stock-count-step-table th,
.stock-count-step-table td {
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stock-count-step-table th:nth-child(1),
.stock-count-step-table td:nth-child(1) {
  width: 13%;
  text-align: left;
}

.stock-count-step-table th:nth-child(2),
.stock-count-step-table td:nth-child(2) {
  width: 7%;
  text-align: center;
}

.stock-count-step-table th:nth-child(3),
.stock-count-step-table td:nth-child(3) {
  width: 14%;
  text-align: left;
}

.stock-count-step-table th:nth-child(4),
.stock-count-step-table td:nth-child(4) {
  width: 9%;
  text-align: left;
}

.stock-count-step-table th:nth-child(5),
.stock-count-step-table td:nth-child(5) {
  width: 29%;
  text-align: left;
}

.stock-count-step-table th:nth-child(6),
.stock-count-step-table td:nth-child(6),
.stock-count-step-table th:nth-child(7),
.stock-count-step-table td:nth-child(7),
.stock-count-step-table th:nth-child(8),
.stock-count-step-table td:nth-child(8) {
  width: 8%;
  text-align: right;
  padding-right: 10px;
}

.stock-count-step-table th:nth-child(9),
.stock-count-step-table td:nth-child(9) {
  width: 4%;
  text-align: center;
}

.stock-count-step-table th:nth-child(6),
.stock-count-step-table th:nth-child(7),
.stock-count-step-table th:nth-child(8) {
  text-align: right;
}

.stock-count-change-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 28px;
  color: #0f3f46;
}

.stock-count-change-button {
  min-height: 22px;
  padding: 0 8px;
  border: 1px solid #b7dccf;
  border-radius: 999px;
  background: #eefaf5;
  color: #0f766e;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
}

.stock-count-change-button[aria-expanded="true"] {
  border-color: #0f766e;
  background: #dff7ef;
}

.stock-count-change-no span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #fff7ed;
  color: #b45309;
  font-size: 12px;
  line-height: 1;
}

.stock-count-step-table td:first-child {
  color: #23434b;
}

.stock-count-step-table td:first-child span {
  display: block;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.25;
}

.stock-count-item-history-row > td {
  padding: 0 8px 8px !important;
  background: #f7fbfb !important;
}

.stock-count-item-history {
  display: grid;
  gap: 6px;
  padding: 8px;
  border-left: 2px solid #0f766e;
  background: #fff;
}

.stock-count-item-history > strong {
  color: #0f3f46;
  font-size: 11px;
}

.stock-count-mini-history {
  width: 100% !important;
  table-layout: fixed;
  font-size: 11px !important;
}

.stock-count-mini-history th,
.stock-count-mini-history td {
  padding: 5px 6px !important;
  white-space: nowrap;
}

.stock-count-mini-history th:nth-child(1),
.stock-count-mini-history td:nth-child(1) {
  width: 24%;
}

.stock-count-mini-history th:nth-child(2),
.stock-count-mini-history td:nth-child(2) {
  width: 8%;
  text-align: center;
}

.stock-count-mini-history th:nth-child(3),
.stock-count-mini-history td:nth-child(3) {
  width: 24%;
}

.stock-count-mini-history th:nth-child(4),
.stock-count-mini-history td:nth-child(4),
.stock-count-mini-history th:nth-child(5),
.stock-count-mini-history td:nth-child(5),
.stock-count-mini-history th:nth-child(6),
.stock-count-mini-history td:nth-child(6) {
  width: 14%;
  text-align: right;
}

.stock-count-saved-meta em {
  display: block;
  overflow: hidden;
  color: #0f766e;
  font-size: 10px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stock-count-history-table .compact-stats {
  justify-content: flex-start;
}

.stock-count-history-table .sales-history-actions {
  justify-content: center;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  width: auto;
  margin: 0 auto;
  white-space: nowrap;
}

.stock-count-history-table .sales-history-actions button {
  min-width: 30px;
}

.stock-count-history-table .sales-history-actions .action-icon {
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
}

.stock-count-history-table .sales-history-actions .action-icon svg {
  width: 15px;
  height: 15px;
}

.stock-count-history-table .sales-history-actions .date-action {
  border-color: #f3c27b;
  background: #fff7ed;
  color: #b45309;
}

.stock-count-history-table .sales-history-actions .date-action svg {
  width: 18px;
  height: 18px;
}

.stock-count-history-table .sales-history-actions .date-action:hover,
.stock-count-history-table .sales-history-actions .date-action:focus-visible {
  border-color: #b45309;
  background: #ffedd5;
}

.stock-count-history-table .dsc-history-status strong {
  min-height: auto;
  padding-left: 0;
  padding-right: 0;
  background: transparent;
}

#importStockTable.staff-closing-table td:nth-child(1) {
  position: static;
  left: auto;
  width: 52%;
  min-width: 0;
  max-width: none;
  padding-left: 12px;
  padding-right: 10px;
  box-shadow: none;
}

#importStockTable.staff-closing-table th:nth-child(1) {
  position: sticky;
  top: 0;
  left: auto;
  width: 52%;
  min-width: 0;
  max-width: none;
  z-index: 8;
  background: #e9f1f2;
  padding-left: 12px;
  padding-right: 10px;
  box-shadow: none;
}

#importStockTable.staff-closing-table td:nth-child(2) {
  position: static;
  left: auto;
  width: 28%;
  min-width: 0;
  max-width: none;
  text-align: right;
  box-shadow: none;
  padding-left: 8px;
  padding-right: 8px;
}

#importStockTable.staff-closing-table th:nth-child(2) {
  position: sticky;
  top: 0;
  left: auto;
  width: 28%;
  min-width: 0;
  max-width: none;
  z-index: 8;
  background: #e9f1f2;
  text-align: center;
  box-shadow: none;
  padding-left: 8px;
  padding-right: 8px;
}

#importStockTable.staff-closing-table td:nth-child(3) {
  position: static;
  left: auto;
  width: 20%;
  min-width: 0;
  max-width: none;
  text-align: center;
  padding-left: 6px;
  padding-right: 12px;
  box-shadow: none;
}

#importStockTable.staff-closing-table th:nth-child(3) {
  position: sticky;
  top: 0;
  left: auto;
  width: 20%;
  min-width: 0;
  max-width: none;
  text-align: center;
  z-index: 7;
  background: #e9f1f2;
  padding-left: 6px;
  padding-right: 12px;
  box-shadow: none;
}

.staff-closing-stock-head {
  vertical-align: middle;
}

.staff-stock-item-cell strong,
.staff-stock-item-cell span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.staff-stock-item-cell strong {
  color: #0f3f46;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.staff-stock-item-cell span {
  margin-top: 2px;
  color: #1f333a;
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.25;
  white-space: normal;
}

.staff-stock-item-cell .staff-uom-chip {
  width: auto;
  min-height: 20px;
  margin-top: 4px;
  padding: 0 7px;
  font-size: 10px;
}

.staff-closing-header {
  color: #12343b;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  text-transform: none;
}

.staff-closing-header span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-closing-header span:nth-child(1) {
  text-align: center;
}

.staff-closing-header span:nth-child(2),
.staff-closing-header span:nth-child(3) {
  text-align: center;
}

.staff-closing-current {
  min-width: 0;
  width: min(100%, 200px);
  margin-left: auto;
}

.staff-closing-stock-cell .smart-edit-value {
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid #bfe3dd;
  border-radius: 999px;
  background: #f3fffb;
  font-weight: 700;
}

.staff-uom-chip {
  display: inline-flex;
  width: 52px;
  min-height: 26px;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  border: 1px solid #d7e5e7;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 11px;
  font-weight: 700;
}

.staff-add-stock {
  display: block;
  align-items: center;
  width: min(100%, 118px);
  margin-left: auto;
  margin-right: auto;
  opacity: 0.66;
  transition: opacity 0.16s ease, transform 0.16s ease;
}

#importStockTable.staff-closing-table tr:hover .staff-add-stock,
#importStockTable.staff-closing-table tr:focus-within .staff-add-stock {
  opacity: 1;
}

#importStockTable .staff-add-closing-qty {
  min-height: 28px;
  padding: 4px 7px;
  text-align: center;
  background: #fff;
  border-color: #d5e2e5;
  font-weight: 600;
  font-size: 11.5px;
  width: 100%;
}

#importStockTable .staff-add-closing-qty:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.smart-edit {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 28px;
  cursor: text;
}

.smart-edit.has-tool {
  padding-right: 28px;
}

.smart-edit-value {
  display: block;
  overflow: hidden;
  min-width: 0;
  padding: 3px 4px;
  border: 1px solid transparent;
  border-radius: 6px;
  text-align: right;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.editable-cell:hover .smart-edit-value {
  border-color: #d9e8ea;
  background: #f7fbfb;
}

#importStockTable .has-adjustment-detail .smart-edit-value,
#importStockTable .adjustment-total.has-adjustment-detail,
#importStockTable .remarks-edit-cell.has-adjustment-detail .smart-edit-value {
  text-decoration: underline dotted #0f766e 1px;
  text-underline-offset: 3px;
  cursor: help;
}

.smart-edit input {
  position: absolute;
  inset: 0;
  width: auto;
  max-width: none;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
}

.smart-edit.has-tool input {
  right: 28px;
}

.editable-cell.editing .smart-edit-value,
.smart-edit:focus-within .smart-edit-value {
  opacity: 0;
}

.editable-cell.editing input,
.smart-edit:focus-within input {
  opacity: 1;
  pointer-events: auto;
}

.smart-edit-actions {
  position: absolute;
  top: 50%;
  right: 0;
  z-index: 2;
  display: inline-flex;
  gap: 3px;
  transform: translateY(-50%);
}

#importStockTable .adjust-tool {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  border-radius: 6px;
  border-color: #d7e5e8;
  background: #f8fbfb;
  color: #60747d;
}

#importStockTable .adjust-tool:hover {
  border-color: var(--accent);
  background: #e9f8f5;
  color: var(--accent-strong);
}

#importStockTable .adjust-tool svg {
  width: 13px;
  height: 13px;
}

#importStockTable .adjust-tool {
  position: static;
  transform: none;
}

.receiving-readonly {
  color: #075985;
  font-variant-numeric: tabular-nums;
}

.physical-edit-cell .smart-edit-value {
  min-height: 24px;
  line-height: 16px;
  box-sizing: border-box;
  border: 1px solid #c5e4de;
  border-radius: 999px;
  background: #f2fbf8;
  color: #102027;
  font-weight: 750;
}

.remarks-edit-cell .smart-edit-value,
.remarks-edit-cell input {
  text-align: left;
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  font-variant-numeric: normal;
  letter-spacing: 0;
}

.remarks-edit-cell {
  padding: 4px 6px !important;
}

.remarks-summary-button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 2px 6px;
  width: 100%;
  min-height: 32px;
  padding: 4px 6px;
  border-color: #d7e5e8;
  background: #fff;
  color: #26343a;
  text-align: left;
}

.remarks-summary-button:hover {
  border-color: var(--accent);
  background: #f3faf8;
}

.remarks-summary-button.empty {
  color: #62737b;
}

.remarks-summary-button:disabled {
  color: #6b7b83;
}

.remarks-count {
  display: inline-grid;
  place-items: center;
  width: 22px;
  min-width: 22px;
  height: 20px;
  border-radius: 999px;
  background: #e8f4f3;
  color: var(--accent-strong);
  font-size: 11px;
  font-weight: 800;
}

.remarks-summary-button.empty .remarks-count {
  background: #eef2f4;
  color: #71828a;
}

.remarks-summary-button strong {
  overflow: hidden;
  font-size: 11px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.remarks-summary-button em {
  grid-column: 1 / -1;
  overflow: hidden;
  color: #53656e;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#importStockTable .remarks-edit-cell.has-adjustment-detail .remarks-summary-button,
#dscTable .remarks-edit-cell.has-adjustment-detail .remarks-summary-button {
  border-color: #cde7e3;
  background: #f6fcfb;
}

.variance-badge {
  display: inline-flex;
  justify-content: flex-end;
  min-width: 58px;
  max-width: 100%;
  box-sizing: border-box;
  padding: 3px 7px;
  border-radius: 999px;
}

.variance-badge:empty { display: none; }
.variance-badge.variance-negative { background: #fff1f1; color: var(--danger); }
.variance-badge.variance-positive { background: #fff7ed; color: var(--warning); }

table { border-collapse: collapse; width: 100%; min-width: 980px; }

#masterTable { min-width: 900px; }

th, td {
  border-bottom: 1px solid var(--line);
  padding: 8px 9px;
  vertical-align: middle;
  white-space: nowrap;
}

th {
  position: sticky;
  top: 0;
  background: #eef3f4;
  color: #405058;
  text-align: left;
  font-size: 12px;
  z-index: 1;
}

.table-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.action-icon {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  border-radius: 7px;
}

.action-icon svg {
  width: 16px;
  height: 16px;
}

.danger-icon {
  border-color: #f0b4b4;
  color: var(--danger);
}

.danger-icon:hover {
  border-color: #d96b6b;
  background: #fff5f5;
}

.master-pos-cell {
  width: 300px;
  max-width: 300px;
  white-space: normal;
  vertical-align: top;
}

.master-pos-line {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.master-head-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 2px 7px;
  border: 1px solid #d9e5e8;
  border-radius: 999px;
  background: #f3f8fa;
  color: #6b7c85;
  font-size: 11px;
  white-space: nowrap;
}

.master-pos-line strong {
  display: inline;
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
}

.master-group-actions {
  margin: 0;
}

.master-group-actions .action-icon {
  width: 20px;
  min-width: 20px;
  height: 20px;
  min-height: 20px;
  border-radius: 5px;
}

.master-group-actions .action-icon svg {
  width: 12px;
  height: 12px;
}

.master-history-button {
  min-height: 22px;
  padding: 0 8px;
  border-color: #cfe0e4;
  color: #405058;
  font-size: 11px;
}

.master-history-button.active {
  border-color: var(--accent);
  background: #e9f8f5;
  color: var(--accent-strong);
}

.master-group-form {
  grid-template-columns: minmax(360px, 1.2fr) minmax(280px, 0.8fr);
  align-items: stretch;
  gap: 12px;
  padding: 16px;
}

.master-pos-input-row {
  grid-column: auto;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 10px;
  border: 1px solid #e4ecef;
  border-radius: 8px;
  background: #fbfcfc;
}

.master-pos-input-row label {
  min-width: 0;
}

.master-pos-input-row button {
  align-self: end;
  min-height: 36px;
}

.master-form-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
}

.master-editor-head {
  display: flex;
  grid-column: auto;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  align-self: stretch;
  min-height: 62px;
  padding: 10px 12px;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  background: #f3f8f8;
}

.master-editor-head strong {
  color: var(--text);
  font-size: 14px;
  line-height: 1.25;
}

.master-editor-head button {
  flex: 0 0 auto;
  min-height: 36px;
  border-color: #b9d1d4;
  color: var(--accent-strong);
}

.master-mapping-editor {
  display: grid;
  grid-column: 1 / -1;
  gap: 10px;
  padding: 10px;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  background: #f6fafb;
}

.master-editor-row {
  display: grid;
  grid-template-columns: 100px minmax(260px, 1fr) 96px 110px 30px;
  gap: 9px;
  align-items: end;
  padding: 10px;
  border: 1px solid #e4ecef;
  border-radius: 7px;
  background: #fff;
}

.master-editor-row label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.master-editor-row input {
  width: 100%;
}

.master-row-uom[readonly] {
  background: #f3f8fa;
  color: #405058;
  cursor: not-allowed;
}

.master-mapping-list {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.master-search-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
}

.master-search-toolbar input {
  flex: 1 1 280px;
}

.master-dsc-scope-tools {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-top: 1px solid #d8e5e8;
  border-bottom: 1px solid #d8e5e8;
  background: #f8fbfb;
}

.dsc-scope-filters {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 1px;
}

.dsc-scope-filters button {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border-color: #cadadd;
  background: #fff;
  color: #344b55;
  font-size: 12px;
  white-space: nowrap;
}

.dsc-scope-filters button:hover,
.dsc-scope-filters button.active {
  border-color: var(--accent);
  background: #edf9f6;
  color: var(--accent-strong);
}

.dsc-scope-filters button span {
  display: inline-grid;
  min-width: 22px;
  height: 20px;
  place-items: center;
  padding: 0 5px;
  border-radius: 999px;
  background: #e8eff1;
  color: #33454e;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.dsc-scope-filters button.active span {
  background: #cfeee7;
  color: #075d56;
}

.dsc-scope-bulk-controls {
  display: grid;
  grid-template-columns: 155px minmax(240px, 1fr) 190px auto;
  align-items: end;
  gap: 10px;
}

.dsc-scope-bulk-controls label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.dsc-scope-bulk-controls label > span {
  color: #53656e;
  font-size: 11px;
  font-weight: 700;
}

.dsc-scope-bulk-controls input,
.dsc-scope-bulk-controls select,
.dsc-scope-bulk-controls button {
  width: 100%;
  min-height: 36px;
}

.dsc-scope-bulk-controls button {
  min-width: 160px;
}

.dsc-scope-result {
  min-height: 18px;
  color: #53656e;
  font-size: 12px;
}

.dsc-scope-result.success {
  color: var(--ok);
  font-weight: 700;
}

.dsc-scope-result.error {
  color: var(--danger);
  font-weight: 700;
}

.dsc-scope-select-cell {
  width: 42px;
  text-align: center;
}

.dsc-scope-select-cell input {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
}

.dsc-scope-head-cell {
  min-width: 230px;
  white-space: normal;
}

.dsc-scope-head-cell strong,
.dsc-scope-cell-sub {
  display: block;
}

.dsc-scope-head-cell span,
.dsc-scope-cell-sub {
  margin-top: 2px;
  color: #667983;
  font-size: 11px;
  line-height: 1.25;
}

.dsc-scope-status {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  justify-content: center;
  padding: 3px 9px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.dsc-scope-status.status-maintained {
  border-color: #b9e2d3;
  background: #ebf8f2;
  color: #08623f;
}

.dsc-scope-status.status-not-maintained {
  border-color: #e8b6be;
  background: #fff1f3;
  color: #a61b35;
}

.dsc-scope-status.status-review {
  border-color: #f1cd86;
  background: #fff8e7;
  color: #8c5500;
}

.dsc-scope-status.status-paused {
  border-color: #b8d4e8;
  background: #eef7fc;
  color: #145a82;
}

.dsc-scope-table {
  min-width: 920px !important;
}

.dsc-scope-audit-cell {
  min-width: 180px;
  max-width: 220px;
  white-space: normal;
}

.dsc-scope-audit-cell strong {
  display: block;
}

.dsc-scope-table th:last-child,
.dsc-scope-table td:last-child {
  width: 208px;
}

.dsc-scope-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.dsc-scope-row-actions select {
  width: 132px;
  min-height: 32px;
  padding: 4px 26px 4px 8px;
  font-size: 12px;
}

.dsc-scope-history-button {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 30px;
  padding: 0;
  font-size: 11px;
}

.dsc-scope-history-button.active {
  border-color: var(--accent);
  background: #edf9f6;
  color: var(--accent-strong);
}

.dsc-scope-history-row td {
  padding: 0;
  background: #f8fbfb;
  white-space: normal;
}

.dsc-scope-history-list {
  display: grid;
  padding: 8px 14px 10px 52px;
}

.dsc-scope-history-line {
  display: grid;
  grid-template-columns: 120px minmax(250px, 1fr) minmax(180px, 0.8fr) minmax(220px, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 34px;
  border-bottom: 1px dashed #d7e3e6;
  color: #52646d;
  font-size: 12px;
}

.dsc-scope-history-line:last-child {
  border-bottom: 0;
}

.dsc-scope-history-line strong {
  color: #253841;
}

.dsc-scope-history-line.initial {
  color: #70828b;
}

.master-head-tools {
  display: grid;
  grid-template-columns: 170px minmax(320px, 420px) 220px;
  align-items: center;
  justify-content: start;
  column-gap: 10px;
  row-gap: 10px;
  padding: 12px;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  background: #f8fbfb;
}

.master-head-tools input {
  max-width: 100%;
}

.master-tool-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.master-tool-actions button {
  min-height: 36px;
  min-width: 132px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1;
}

.master-uom-tools {
  display: grid !important;
  grid-template-columns: minmax(170px, 220px) minmax(170px, 190px) minmax(110px, 130px);
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid #d8e5e8;
  border-radius: 8px;
  background: #f8fbfb;
  font-size: 14px;
}

.master-head-tools[hidden],
.master-uom-tools[hidden] {
  display: none !important;
}

.master-uom-tools input,
.master-uom-tools button {
  width: 100%;
  min-height: 36px;
  font-size: 14px;
  line-height: 1;
}

.master-uom-tools .master-tool-actions button {
  width: auto;
}

.master-uom-tools .master-tool-actions {
  grid-column: auto;
  justify-content: flex-start;
}

.master-uom-tools .master-tool-actions .primary {
  min-width: 180px;
}

.master-uom-tools .master-tool-actions button:not(.primary) {
  min-width: 120px;
}

.master-mode-switch .subtab {
  width: 136px;
  min-height: 132px;
  aspect-ratio: 1 / 1;
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 5px;
  padding: 11px;
  border: 1px solid #dce8eb;
  border-radius: 8px;
  background: #fff;
  color: #17323d;
  text-align: left;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
}

.master-mode-switch .subtab:hover,
.master-mode-switch .subtab.active {
  border-color: var(--accent);
  background: #f0fbf8;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.master-mode-icon {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  color: var(--accent);
}

.master-mode-icon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.master-mode-switch .subtab strong {
  color: #172026;
  font-size: 13px;
  line-height: 1.2;
}

.master-mode-switch .subtab em {
  margin-top: 2px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef8f6;
  color: #075d56;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
}

.master-uom-row td {
  height: 38px;
}

.master-uom-row td:last-child {
  width: 86px;
}

.master-head-row td {
  height: 38px;
}

.master-head-row td:first-child {
  width: 150px;
}

.master-head-row td:nth-child(3) {
  width: 90px;
}

.master-head-row td:last-child {
  width: 86px;
}

.master-head-actions {
  justify-content: flex-start;
}

.master-head-actions .action-icon {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  border-radius: 6px;
}

.master-head-actions .action-icon svg {
  width: 13px;
  height: 13px;
}

.master-mapping-line {
  display: grid;
  grid-template-columns: 82px minmax(240px, 1fr) 110px;
  align-items: center;
  gap: 10px;
  min-height: 32px;
  padding: 4px 7px;
  border: 1px solid #eef2f4;
  border-radius: 6px;
  background: #fbfcfc;
}

.master-mapping-line.with-history {
  grid-template-columns: 72px 82px minmax(220px, 1fr) 110px;
}

.master-mapping-line.history-version {
  background: #f8fafb;
  color: #65757d;
}

.master-mapping-line.history-version .master-dsc-head,
.master-mapping-line.history-version .master-recipe {
  color: #65757d;
}

.master-version-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 60px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
}

.master-version-badge.current {
  background: #e9f8f5;
  color: var(--accent-strong);
}

.master-version-badge.ended {
  background: #eef2f4;
  color: #65757d;
}

.master-sap-code {
  display: inline-flex;
  justify-content: center;
  min-width: 0;
  padding: 2px 6px;
  border: 1px solid #d9e5e8;
  border-radius: 999px;
  background: #f3f8fa;
  color: #405058;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}

.master-dsc-head {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.master-recipe {
  color: #405058;
  font-variant-numeric: tabular-nums;
  text-align: right;
  font-size: 12px;
}

.master-period,
.master-timestamp {
  grid-column: 3 / -1;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.master-timestamp {
  color: #7a8b93;
}

td input {
  width: 96px;
  max-width: 100%;
  min-height: 30px;
  box-sizing: border-box;
  padding: 4px 8px;
}
td input[data-field] {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
td input.remarks {
  width: 170px;
  text-align: left;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  font-variant-numeric: normal;
  letter-spacing: 0;
}

.num {
  text-align: right;
  overflow: hidden;
  padding-left: 8px;
  padding-right: 19px;
  text-overflow: clip;
  font-variant-numeric: tabular-nums;
}
.variance-negative { color: var(--danger); font-weight: 650; }
.variance-positive { color: var(--warning); font-weight: 650; }

.backup-box { max-width: 720px; }
.backup-actions { display: flex; gap: 12px; align-items: center; padding: 14px; flex-wrap: wrap; }
.backup-import { display: grid; gap: 5px; }

.company-box {
  align-self: start;
}

.company-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(160px, 1fr);
  gap: 12px;
  padding: 14px;
}

.company-form label {
  display: grid;
  gap: 5px;
}

.company-form button,
.company-form .check-line {
  align-self: end;
}

.check-line {
  display: inline-flex !important;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 8px;
  min-height: 36px;
}

.check-line input {
  min-height: auto;
}

.company-list-box {
  margin-top: 16px;
}

.company-list {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.company-row {
  display: grid;
  grid-template-columns: minmax(180px, 240px) 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.company-row.active {
  border-color: #b7dccf;
  background: #f5fbf8;
}

.company-row strong,
.company-row span {
  display: block;
}

.company-title-cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.company-row span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.company-actions,
.branch-chip-wrap {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.company-actions .action-icon,
.branch-chip-wrap .action-icon {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  border-radius: 6px;
}

.company-actions .action-icon svg,
.branch-chip-wrap .action-icon svg {
  width: 13px;
  height: 13px;
}

.branch-chips {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.branch-chip-wrap {
  padding: 2px;
  border: 1px solid #e4ecef;
  border-radius: 8px;
  background: #fbfcfc;
}

.branch-chip {
  min-height: 30px;
  padding: 0 10px;
  font-size: 12px;
}

.branch-chip.active {
  border-color: var(--accent);
  background: #e9f8f5;
  color: var(--accent-strong);
}

.cloud-admin-box {
  margin-top: 16px;
  border-top: 3px solid var(--accent);
  overflow: hidden;
}

.cloud-admin-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  padding: 12px;
}

.cloud-admin-summary div {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfb;
  padding: 10px 12px;
}

.cloud-admin-summary span,
.cloud-user-table td span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-bottom: 4px;
}

.cloud-admin-summary strong {
  display: block;
  font-size: 14px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-admin-summary .danger strong {
  color: var(--danger);
}

.cloud-admin-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(150px, 190px) minmax(150px, 190px) minmax(160px, auto);
  gap: 12px;
  align-items: end;
  margin: 12px;
  padding: 12px;
  border-top: 1px solid var(--line);
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fbfdfd;
}

.cloud-admin-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.cloud-admin-form span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.cloud-admin-form input,
.cloud-admin-form select {
  width: 100%;
  min-width: 0;
}

.cloud-admin-form input[readonly] {
  border-color: #d8e2e5;
  background: #eef3f4;
  color: #4d626a;
  font-weight: 700;
  cursor: default;
}

.cloud-admin-form button {
  width: 100%;
  white-space: nowrap;
}

.cloud-user-form {
  grid-template-columns: minmax(160px, 1fr) minmax(120px, 0.75fr) minmax(220px, 1.35fr) minmax(115px, 130px) minmax(130px, 150px) minmax(165px, auto);
  margin-top: 0;
}

.cloud-branch-form,
.cloud-company-form {
  grid-template-columns: minmax(240px, 1.25fr) minmax(110px, 130px) minmax(245px, 1fr) minmax(160px, auto);
}

.cloud-company-form {
  grid-template-columns: minmax(220px, 1fr) minmax(190px, 0.85fr) minmax(90px, 115px) minmax(245px, 1fr) minmax(150px, auto);
}

.cloud-copy-source {
  grid-column: 1 / -1;
  max-width: 520px;
}

.cloud-copy-source select {
  background-color: #fff;
}

.cloud-admin-form select[multiple] {
  min-height: 38px;
  height: 38px;
  overflow: auto;
}

.cloud-admin-message {
  margin: 0 12px 12px;
  padding: 9px 11px;
  border: 1px solid #b7dccf;
  border-radius: 8px;
  background: #effaf6;
  color: #075f4e;
  font-weight: 650;
}

.cloud-admin-message.error {
  border-color: #f2b8b8;
  background: #fff1f1;
  color: var(--danger);
}

.cloud-toast {
  position: fixed;
  left: 50%;
  top: 86px;
  z-index: 1200;
  display: inline-flex;
  align-items: center;
  gap: 13px;
  max-width: min(560px, calc(100vw - 46px));
  min-height: 66px;
  padding: 15px 36px 15px 18px;
  border: 1px solid rgba(7, 146, 118, 0.28);
  border-right: 0;
  border-radius: 18px 10px 10px 18px;
  background: linear-gradient(135deg, #ffffff 0%, #e9fbf5 62%, #d7f5ea 100%);
  box-shadow: 0 20px 50px rgba(18, 42, 48, 0.24), 0 5px 0 rgba(7, 146, 118, 0.16);
  color: #074f44;
  opacity: 0;
  overflow: visible;
  pointer-events: none;
  transform: translate(-50%, -18px) scale(0.95);
  transition: opacity 180ms ease;
}

.cloud-toast::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -22px;
  width: 44px;
  height: 44px;
  border-top: 1px solid rgba(7, 146, 118, 0.28);
  border-right: 1px solid rgba(7, 146, 118, 0.28);
  border-radius: 8px;
  background: linear-gradient(135deg, #e9fbf5 0%, #d7f5ea 100%);
  box-shadow: 12px 16px 28px rgba(18, 42, 48, 0.14);
  transform: translateY(-50%) rotate(45deg);
}

.cloud-toast.danger {
  border-color: rgba(220, 38, 38, 0.3);
  background: linear-gradient(135deg, #ffffff 0%, #fff1f4 62%, #ffdbe4 100%);
  box-shadow: 0 20px 50px rgba(105, 20, 38, 0.22), 0 5px 0 rgba(220, 38, 38, 0.16);
  color: #971b35;
}

.cloud-toast.danger::after {
  border-top-color: rgba(220, 38, 38, 0.3);
  border-right-color: rgba(220, 38, 38, 0.3);
  background: linear-gradient(135deg, #fff1f4 0%, #ffdbe4 100%);
  box-shadow: 12px 16px 28px rgba(105, 20, 38, 0.12);
}

.cloud-toast > * {
  position: relative;
  z-index: 1;
}

.cloud-toast.show {
  opacity: 1;
  animation: cloudToastBounce 820ms cubic-bezier(0.2, 0.9, 0.25, 1.15) both;
}

.cloud-toast-hole {
  width: 11px;
  height: 11px;
  border: 2px solid rgba(8, 125, 104, 0.35);
  border-radius: 999px;
  background: #fff;
  box-shadow: inset 0 1px 3px rgba(18, 42, 48, 0.18), 0 0 0 4px rgba(8, 125, 104, 0.06);
  flex: 0 0 auto;
}

.cloud-toast.danger .cloud-toast-hole {
  border-color: rgba(220, 38, 38, 0.35);
  box-shadow: inset 0 1px 3px rgba(105, 20, 38, 0.18), 0 0 0 4px rgba(220, 38, 38, 0.07);
}

.cloud-toast-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: linear-gradient(180deg, #18b99a 0%, #0a7d68 100%);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 4px 10px rgba(8, 116, 95, 0.22);
  transform: scale(0.72);
  animation: toastCheckPop 520ms ease 80ms both;
}

.cloud-toast.danger .cloud-toast-icon {
  background: linear-gradient(180deg, #ff6b81 0%, #d21f45 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36), 0 4px 10px rgba(190, 18, 60, 0.22);
}

.cloud-toast-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cloud-toast-icon circle,
.cloud-toast-icon path {
  stroke-dasharray: 64;
  stroke-dashoffset: 64;
}

.cloud-toast.show .cloud-toast-icon circle {
  animation: toastCheckDraw 520ms ease 130ms forwards;
}

.cloud-toast.show .cloud-toast-icon path {
  animation: toastCheckDraw 430ms ease 360ms forwards;
}

.cloud-toast strong {
  min-width: 0;
  overflow: hidden;
  font-size: 15px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@keyframes toastCheckPop {
  0% { transform: scale(0.72); }
  65% { transform: scale(1.12); }
  100% { transform: scale(1); }
}

@keyframes toastCheckDraw {
  to { stroke-dashoffset: 0; }
}

@keyframes cloudToastBounce {
  0% { transform: translate(-50%, -18px) scale(0.92) rotate(-2deg); }
  34% { transform: translate(-50%, 8px) scale(1.045) rotate(2deg); }
  56% { transform: translate(-50%, -4px) scale(0.99) rotate(-1.4deg); }
  76% { transform: translate(-50%, 2px) scale(1.01) rotate(0.8deg); }
  100% { transform: translate(-50%, 0) scale(1) rotate(0deg); }
}

.cloud-user-list {
  padding: 0 12px 12px;
}

.cloud-branch-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 9px;
  padding: 0 12px 12px;
}

.cloud-branch-card {
  display: grid;
  gap: 7px;
  padding: 11px;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fbfdfd;
}

.cloud-branch-card.active {
  border-color: var(--accent);
  background: #edf9f6;
}

.cloud-branch-card strong {
  display: block;
}

.cloud-branch-card span {
  color: var(--muted);
  font-size: 12px;
}

.cloud-branch-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.cloud-user-table {
  min-width: 760px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.cloud-user-table th,
.cloud-user-table td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}

.cloud-user-table th {
  background: #f4f0e7;
  color: var(--text);
  font-size: 12px;
}

.cloud-user-table td {
  background: #fffdf8;
}

.cloud-user-status {
  display: inline-flex !important;
  min-width: 70px;
  justify-content: center;
  border: 1px solid #cfe6dc;
  border-radius: 999px;
  background: #ecfbf5;
  color: #08745f !important;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 750;
}

.cloud-user-status.inactive,
.cloud-user-status.blocked {
  border-color: #f2b8b8;
  background: #fff1f1;
  color: var(--danger) !important;
}

.hide-on-business {
  display: none !important;
}

.cloud-business-mode .local-company-admin {
  display: none !important;
}

.cloud-admin-box {
  margin-top: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.cloud-business-head {
  display: none;
}

.cloud-business-head h3 {
  font-size: 18px;
  letter-spacing: 0;
}

.cloud-business-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}

.cloud-business-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.cloud-business-actions button {
  min-width: 112px;
  font-weight: 750;
}

.cloud-business-actions button.active {
  border-color: var(--accent);
  background: #e9f8f5;
  color: var(--accent-strong);
}

.section-action-button {
  min-height: 32px;
  min-width: 110px;
  padding: 0 15px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 650;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.section-action-button.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.section-action-button.active {
  border-color: var(--accent);
  background: #e9f8f5;
  color: var(--accent-strong);
}

.section-action-button:hover {
  transform: translateY(-1px);
}

.cloud-business-section {
  margin: 0 0 10px;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.cloud-business-section + .cloud-business-section {
  margin-top: 10px;
}

.cloud-profile-section {
  border: 0;
  background: transparent;
}

.cloud-profile-section .section-title {
  display: none;
}

.section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding: 8px 12px;
  border-bottom: 1px solid #e3ecef;
  background: #fbfdfd;
}

.cloud-company-section .section-title {
  border-bottom-color: #cdebe4;
  background: #f1fbf8;
}

.cloud-branch-section .section-title {
  border-bottom-color: #ead8a8;
  background: #fff8e8;
}

.cloud-team-section .section-title {
  border-bottom-color: #d3d9df;
  background: linear-gradient(180deg, #f7f9fb 0%, #edf1f5 100%);
}

.cloud-company-section {
  border-color: #d7e5e8;
  background: #fff;
}

.cloud-company-section .section-action-button {
  border-color: #8ccfc0;
  background: linear-gradient(180deg, #ffffff 0%, #eaf8f4 100%);
  box-shadow: inset 0 1px 0 #fff, 0 2px 0 #b9dcd4;
  color: #075e54;
}

.cloud-branch-section {
  border-color: #d7e5e8;
  background: #fff;
}

.cloud-branch-section .section-action-button {
  border-color: #d9a748;
  background: linear-gradient(180deg, #fffdf7 0%, #ffe7ad 100%);
  box-shadow: inset 0 1px 0 #fff, 0 2px 0 #d9a748;
  color: #764800;
}

.cloud-team-section {
  border-color: #ccd5dd;
  background: #f8fafb;
}

.cloud-team-section .section-action-button {
  border-color: #0a7d68;
  background: linear-gradient(180deg, #18b99a 0%, #0a7d68 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34), 0 3px 0 #06614f, 0 8px 16px rgba(8, 116, 95, 0.16);
  color: #fff;
}

.section-title > div {
  display: grid;
  gap: 3px;
}

.section-title-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
}

.section-title strong {
  font-size: 14px;
}

.section-title span {
  color: var(--muted);
  font-size: 12px;
}

.selected-company-chip,
.selected-branch-chip {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  max-width: 260px;
  padding: 0 10px;
  border: 1px solid #e4c77e;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.62);
  color: #6d4600 !important;
  font-size: 11px !important;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.selected-branch-chip {
  border-color: #cbd8dd;
  background: rgba(255, 255, 255, 0.76);
  color: #264d58 !important;
}

.cloud-business-section .cloud-admin-summary {
  padding: 0;
}

.cloud-profile-section .cloud-admin-summary {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) minmax(210px, 1.45fr) minmax(120px, 0.85fr) minmax(100px, 0.7fr) minmax(120px, 0.8fr);
  gap: 0;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.cloud-profile-section .cloud-admin-summary div {
  min-height: 50px;
  padding: 8px 12px;
  border: 0;
  border-right: 1px solid #e3ecef;
  border-radius: 0;
  background: #fff;
}

.cloud-profile-section .cloud-admin-summary div:last-child {
  border-right: 0;
}

.cloud-profile-section .cloud-admin-summary span {
  margin-bottom: 3px;
}

.cloud-profile-section .cloud-admin-summary strong {
  font-size: 13px;
}

.cloud-profile-section .cloud-admin-summary .cloud-login-cell strong {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 100%;
  min-width: 0;
}

.google-login-icon {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background:
    conic-gradient(#4285f4 0 25%, #34a853 0 50%, #fbbc05 0 75%, #ea4335 0 100%);
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
  box-shadow: inset 0 0 0 2px #fff, 0 1px 3px rgba(15, 23, 42, 0.16);
}

.cloud-business-health {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 8px;
  margin-top: 8px;
}

.health-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 8px;
  align-items: center;
  min-height: 46px;
  padding: 8px 10px;
  border: 1px solid #dbe7ea;
  border-radius: 8px;
  background: #fbfdfd;
}

.health-item span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  color: #48606a;
  font-size: 11px;
  font-weight: 650;
}

.health-item span svg {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  color: var(--accent);
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.health-item strong {
  color: #102027;
  font-size: 18px;
  line-height: 1;
  font-weight: 750;
}

.health-item em {
  grid-column: 1 / -1;
  overflow: hidden;
  color: #657780;
  font-size: 11px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.health-item.ok {
  border-color: #bde8db;
  background: #f3fbf7;
}

.health-item.warn {
  border-color: #f7c9d1;
  background: #fff5f7;
}

.health-item.warn span svg,
.health-item.warn strong {
  color: #be123c;
}

.health-item.danger {
  border-color: #f8b4bf;
  background: #fff1f2;
}

.health-item.danger span svg,
.health-item.danger strong {
  color: #dc2626;
}

.cloud-business-section .cloud-admin-form {
  margin: 12px;
  border-top: 0;
}

.cloud-business-section .cloud-admin-message {
  margin: 0 12px 12px;
}

.cloud-company-list,
.cloud-branch-list {
  display: block;
  padding: 0;
}

.cloud-company-list {
  padding: 12px;
  background: #fff;
}

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

.cloud-company-card {
  position: relative;
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 132px;
  padding: 15px 43px 12px 13px;
  border: 1px solid #d7e5e8;
  border-radius: 8px;
  background: #fff;
  box-shadow: none;
  overflow: hidden;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.cloud-company-card::before {
  display: none;
}

.cloud-company-card.current {
  border-color: var(--accent);
  background: linear-gradient(180deg, #f3fbf8 0%, #eaf8f4 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 8px 20px rgba(10, 95, 86, 0.08);
}

.cloud-company-card[role="button"] {
  cursor: pointer;
}

.cloud-company-card[role="button"]:hover {
  border-color: var(--accent);
  background: #f8fffd;
  transform: translateY(-1px);
}

.cloud-company-card-tools {
  position: absolute;
  top: 9px;
  right: 9px;
  z-index: 2;
  display: inline-flex;
  gap: 5px;
}

.cloud-company-card-tools .action-icon {
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(4px);
}

.cloud-company-card-head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.cloud-company-card-head div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.cloud-company-card-head span,
.cloud-company-card-metrics em {
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

.cloud-company-card-head strong {
  overflow: hidden;
  color: var(--text);
  font-size: 15px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-company-card-metrics {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 0.55fr 1.2fr 0.7fr;
  gap: 12px;
  padding-top: 8px;
  border-top: 1px solid #e3ecef;
}

.cloud-company-card-metrics span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.cloud-company-card-metrics b {
  overflow: hidden;
  color: #17343a;
  font-size: 12px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-company-card-action {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.cloud-company-card-action .small {
  min-width: 112px;
  min-height: 31px;
  font-weight: 850;
}

.cloud-company-tile-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: #e9f8f4;
  color: var(--accent);
  margin-bottom: 2px;
}

.cloud-company-tile-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cloud-company-title {
  overflow: hidden;
  color: var(--text);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-company-subtitle {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-company-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  margin-top: 8px;
  min-width: 0;
}

.cloud-company-card-footer span,
.cloud-company-card-footer em {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  max-width: 100%;
  padding: 0 8px;
  border-radius: 999px;
  background: #edf8f5;
  color: #075e54;
  font-size: 11px;
  font-style: normal;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-company-card-footer span {
  flex: 0 1 auto;
  min-width: 0;
}

.cloud-company-card-footer em {
  flex: 0 0 auto;
  border: 1px solid #d0e4e8;
  background: linear-gradient(180deg, #fff 0%, #edf7f8 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 2px 0 #d6e6e9;
  color: #234b55;
  font-weight: 600;
}

.cloud-company-card-footer svg {
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cloud-company-branch-chip {
  max-width: calc(100% - 62px);
  border: 1px solid #cce9e2;
  background: #e7f7f3 !important;
  color: #064f47 !important;
  font-weight: 600 !important;
}

.cloud-company-card.current .cloud-company-card-footer em {
  min-height: 26px;
  padding: 0 11px;
  border: 1px solid #079276;
  background: linear-gradient(180deg, #18b99a 0%, #0a7d68 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34), 0 3px 0 #06614f, 0 7px 14px rgba(8, 116, 95, 0.18);
  color: #fff;
  font-size: 11px;
  font-weight: 750;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18);
}

.cloud-company-card.current .cloud-company-tile-icon {
  background: #dff7ef;
  color: var(--accent-strong);
}

.cloud-company-card.current .cloud-company-state.active svg {
  stroke-width: 2.3;
}

.cloud-company-card > .status-pill {
  position: absolute;
  top: 10px;
  right: 10px;
}

.current-company-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #b8d8d4;
  border-radius: 999px;
  background: #e8f8f4;
  color: var(--accent-strong);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

.cloud-company-register,
.cloud-branch-register {
  width: 100%;
  overflow: hidden;
}

.cloud-company-register-head,
.cloud-company-row,
.cloud-branch-register-head,
.cloud-branch-row {
  display: grid;
  align-items: center;
  column-gap: 18px;
}

.cloud-company-register-head,
.cloud-branch-register-head {
  min-height: 34px;
  padding: 0 12px;
  border-top: 1px solid #e3ecef;
  border-bottom: 1px solid #e3ecef;
  background: #eef6f7;
  color: #526a73;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.cloud-branch-section .cloud-branch-register-head {
  border-color: #e3ecef;
  background: #f8fbfc;
  color: #526a73;
}

.cloud-branch-section .cloud-branch-list {
  background: #fff;
}

.cloud-team-section .cloud-user-list {
  padding: 10px 12px 12px;
  background: #fffdf8;
}

.cloud-team-section .cloud-user-table {
  border-color: #e5dccd;
  background: #fff;
}

.cloud-company-register-head,
.cloud-company-row {
  grid-template-columns: minmax(230px, 1.2fr) minmax(80px, 0.4fr) minmax(180px, 0.9fr) minmax(90px, 0.45fr) minmax(120px, 0.55fr);
}

.cloud-branch-register-head,
.cloud-branch-row {
  grid-template-columns: minmax(230px, 1.15fr) minmax(96px, 0.38fr) minmax(245px, 1fr) minmax(136px, 0.55fr) minmax(188px, 0.75fr);
}

.cloud-company-row,
.cloud-branch-row {
  min-height: 52px;
  padding: 9px 12px;
  border-bottom: 1px solid #e3ecef;
  background: #fff;
}

.cloud-company-row:last-child,
.cloud-branch-row:last-child {
  border-bottom: 0;
}

.cloud-company-row.current,
.cloud-branch-row.current {
  position: relative;
  background: #fff2d4;
}

.cloud-company-row.current {
  background: #f1fbf8;
}

.cloud-branch-row.current {
  background: #f1fbf8;
}

.cloud-company-row.current::before,
.cloud-branch-row.current::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: #c88714;
}

.cloud-company-row.current::before {
  background: var(--accent);
}

.cloud-branch-row.current::before {
  background: #c88714;
}

.company-name-cell,
.branch-name-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding-left: 0;
}

.cloud-company-row.current .company-name-cell,
.cloud-branch-row.current .branch-name-cell {
  padding-left: 4px;
}

.company-name-cell strong,
.branch-name-cell strong {
  overflow: hidden;
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-company-row > div:not(.company-name-cell):not(.cloud-company-action),
.branch-plan-cell,
.branch-period-cell,
.branch-balance-cell {
  overflow: hidden;
  color: #17343a;
  font-size: 12px;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.branch-plan-cell,
.branch-period-cell,
.branch-balance-cell {
  display: flex;
  align-items: center;
  min-width: 0;
}

.branch-plan-pill,
.branch-period-pill,
.branch-balance-pill {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid #dde8eb;
  border-radius: 8px;
  background: #fbfdfd;
  color: #2f4650;
  font-size: 12px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.branch-plan-pill {
  min-width: 70px;
  justify-content: center;
  border-color: #dce7ea;
  background: #f8fbfb;
  color: #334c56;
}

.branch-period-pill {
  width: 100%;
  border-color: transparent;
  background: transparent;
  padding-left: 0;
  color: #17343a;
}

.branch-balance-pill {
  min-width: 104px;
  justify-content: center;
}

.branch-balance-pill.ok {
  border-color: #dce7ea;
  background: #f8fbfb;
  color: #24424b;
}

.branch-balance-pill.warning {
  border-color: #f3b4c0;
  background: #fff0f4;
  color: #b1123b;
  font-weight: 650;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.branch-balance-pill.expired {
  border-color: #f3b4b4;
  background: #fff0f0;
  color: #b42323;
}

.cloud-company-action,
.cloud-branch-action {
  display: grid;
  align-items: center;
  gap: 6px;
  justify-content: flex-end;
}

.cloud-branch-action {
  grid-template-columns: 34px 34px minmax(72px, 1fr);
}

.cloud-branch-action .action-icon {
  width: 30px;
  height: 30px;
  justify-self: center;
}

.cloud-company-action .small,
.cloud-branch-action .small {
  min-width: 72px;
  min-height: 30px;
  border-color: #d7e5e8;
  border-radius: 7px;
  background: linear-gradient(180deg, #ffffff 0%, #f5fafb 100%);
  box-shadow: inset 0 1px 0 #fff, 0 1px 0 #d7e5e8;
  color: #234b55;
  font-weight: 600;
  justify-self: stretch;
}

.cloud-branch-card {
  grid-template-columns: minmax(220px, 1fr) minmax(360px, 1.5fr) minmax(82px, auto);
  align-items: center;
  gap: 14px;
  min-height: 56px;
  padding: 9px 12px;
  border: 0;
  border-top: 1px solid #e3ecef;
  border-radius: 0;
  background: #fff;
}

.cloud-branch-card.active {
  border-left: 3px solid var(--accent);
  background: #f3fbf8;
  box-shadow: none;
}

.branch-card-title {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.branch-card-title strong {
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.branch-card-title .status-pill {
  width: fit-content;
  justify-self: start;
}

.branch-subscription-grid {
  display: grid;
  grid-template-columns: minmax(70px, 0.55fr) minmax(190px, 1.4fr) minmax(95px, 0.8fr);
  gap: 14px;
}

.branch-subscription-grid span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.branch-subscription-grid em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.branch-subscription-grid b {
  overflow: hidden;
  color: #18343a;
  font-size: 12px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cloud-branch-meta {
  justify-content: flex-end;
}

.cloud-branch-meta .small {
  min-height: 30px;
  min-width: 62px;
}

.current-workspace-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid #079276;
  border-radius: 999px;
  background: linear-gradient(180deg, #18b99a 0%, #0a7d68 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34), 0 3px 0 #06614f, 0 7px 14px rgba(8, 116, 95, 0.18);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.18);
  white-space: nowrap;
  justify-self: stretch;
}

.current-workspace-pill.blocked-workspace-pill {
  border-color: #fecaca;
  background: linear-gradient(180deg, #fff1f2 0%, #ffe4e6 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 2px 0 #fca5a5, 0 7px 14px rgba(220, 38, 38, 0.1);
  color: #dc2626;
  text-shadow: none;
}

.branch-access-list {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}

.branch-access-chip {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 2px 8px;
  border: 1px solid #d7e5e8;
  border-radius: 999px;
  background: #f8fbfb;
  color: #38525a;
  font-size: 11px;
  font-weight: 600;
}

.branch-access-chip.all-branches {
  border-color: #b8d8d4;
  background: #eaf8f5;
  color: #075e54;
}

.cloud-user-list {
  overflow-x: auto;
}

.cloud-user-table {
  width: 100%;
  min-width: 820px;
}

.cloud-user-table td strong {
  font-size: 13px;
}

.owner-safe-badge {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid #d7e5e8;
  border-radius: 999px;
  background: #f4f8f9;
  color: #4f6570 !important;
  font-size: 11px !important;
  font-weight: 800;
  white-space: nowrap;
}

.cloud-user-table .table-actions {
  justify-content: flex-start;
  gap: 7px;
}

.staff-status-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid #cfe6dc;
  border-radius: 999px;
  background: #ecfbf5;
  color: #08745f;
  font-size: 11px;
  font-weight: 650;
  cursor: pointer;
}

.staff-status-button.inactive {
  border-color: #f2b8b8;
  background: #fff1f1;
  color: var(--danger);
}

.staff-status-button:hover {
  filter: brightness(0.98);
}

.cloud-support-section {
  border-color: #cfdde2;
  background: #fff;
}

.cloud-support-section .section-title {
  border-bottom-color: #cfdde2;
  background: linear-gradient(180deg, #f8fafb 0%, #eef3f5 100%);
}

.support-count-chip,
.support-ticket-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 9px;
  border: 1px solid #a8d8cc;
  border-radius: 999px;
  background: #e7fbf5;
  color: #00695f;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.support-ticket-status.inProgress {
  border-color: #bfdbfe;
  background: #eff6ff;
  color: #1d4ed8;
}

.support-ticket-status.closed {
  border-color: #d7dee3;
  background: #f1f5f6;
  color: #52636b;
}

.support-inbox {
  padding: 12px;
}

.support-inbox-list {
  display: grid;
  gap: 8px;
}

.support-inbox-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid #dbe7ea;
  border-left: 4px solid #0f766e;
  border-radius: 8px;
  background: #fff;
}

.support-inbox-row.inProgress {
  border-left-color: #2563eb;
}

.support-inbox-row.closed {
  border-left-color: #94a3b8;
  opacity: 0.86;
}

.support-inbox-row strong,
.support-ticket-row strong {
  display: block;
  margin-top: 6px;
  color: var(--text);
  font-size: 13px;
}

.support-inbox-row em,
.support-ticket-row em {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-style: normal;
  font-size: 11px;
}

.support-inbox-row p,
.support-ticket-row small {
  display: block;
  margin: 6px 0 0;
  color: #31505a;
  font-size: 12px;
  line-height: 1.45;
}

.support-inbox-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.support-inbox-actions select,
.support-thread-head select {
  min-height: 32px;
  border: 1px solid #cfdde2;
  border-radius: 7px;
  background: #fff;
  color: #17343c;
  font-size: 12px;
  font-weight: 700;
}

.support-inbox-actions button {
  min-height: 32px;
  border-color: var(--accent);
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

.support-empty {
  padding: 16px;
  border: 1px dashed #cfdde2;
  border-radius: 8px;
  background: #fbfdfd;
  color: var(--muted);
  font-size: 13px;
}

.support-chat-button {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 80;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 0 16px 0 12px;
  border: 1px solid #0a7d68;
  border-radius: 999px;
  background: linear-gradient(180deg, #18a88e 0%, #0a7d68 100%);
  box-shadow: 0 10px 24px rgba(8, 67, 62, 0.22);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
}

.support-chat-button[hidden] {
  display: none;
}

.support-chat-button:hover {
  transform: translateY(-1px);
}

.support-chat-icon {
  display: inline-flex;
  width: 22px;
  height: 22px;
}

.support-chat-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.support-chat-button em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: #fff;
  color: #0a7d68;
  font-style: normal;
  font-size: 11px;
}

.support-chat-button em[hidden] {
  display: none;
}

.support-chat-card {
  width: min(980px, calc(100vw - 28px));
  max-height: min(720px, calc(100vh - 34px));
}

.support-chat-head {
  border-bottom: 1px solid #e2ecef;
}

.support-chat-body {
  min-height: 460px;
  padding: 0;
}

.support-chat-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  min-height: 460px;
}

.support-ticket-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  border-right: 1px solid #e2ecef;
  background: #f8fbfb;
  overflow: auto;
}

.support-ticket-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}

.support-ticket-list-head strong {
  font-size: 13px;
}

.support-ticket-list-head button {
  min-height: 28px;
  padding: 0 10px;
  border-color: #a8d8cc;
  background: #e7fbf5;
  color: #00695f;
  font-size: 11px;
  font-weight: 850;
}

.support-ticket-row {
  width: 100%;
  display: block;
  padding: 10px;
  border: 1px solid #dbe7ea;
  border-radius: 8px;
  background: #fff;
  text-align: left;
}

.support-ticket-row.active {
  border-color: #0f766e;
  background: #eefaf7;
  box-shadow: inset 3px 0 0 #0f766e;
}

.support-thread-panel {
  min-width: 0;
  padding: 14px;
  background: #fff;
}

.support-compose-card {
  display: grid;
  gap: 10px;
  max-width: 620px;
}

.support-compose-title {
  display: grid;
  gap: 3px;
  margin-bottom: 2px;
}

.support-compose-title strong {
  font-size: 16px;
}

.support-compose-title span {
  color: var(--muted);
  font-size: 12px;
}

.support-compose-card input,
.support-compose-card select,
.support-compose-card textarea,
.support-reply-form textarea {
  width: 100%;
  border: 1px solid #cfdde2;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.support-compose-card input,
.support-compose-card select {
  min-height: 38px;
  padding: 0 10px;
}

.support-compose-card textarea,
.support-reply-form textarea {
  padding: 10px;
  resize: vertical;
}

.support-thread {
  display: grid;
  grid-template-rows: auto minmax(240px, 1fr) auto;
  gap: 12px;
  min-height: 430px;
}

.support-thread-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e2ecef;
}

.support-thread-head > div {
  display: grid;
  gap: 5px;
}

.support-thread-head strong {
  font-size: 16px;
}

.support-thread-head em {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
}

.support-message-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: auto;
  padding-right: 4px;
}

.support-message {
  max-width: 76%;
  align-self: flex-start;
  padding: 10px 12px;
  border: 1px solid #dbe7ea;
  border-radius: 12px 12px 12px 4px;
  background: #f8fbfb;
}

.support-message.self {
  align-self: flex-end;
  border-color: #a8d8cc;
  border-radius: 12px 12px 4px 12px;
  background: #e7fbf5;
}

.support-message > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 5px;
}

.support-message strong {
  font-size: 12px;
}

.support-message span {
  color: var(--muted);
  font-size: 10px;
}

.support-message p {
  margin: 0;
  color: #17343c;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.support-seen-line {
  align-self: flex-end;
  margin-top: -4px;
  color: #6b7d82;
  font-size: 11px;
  font-weight: 750;
}

.support-seen-line.seen {
  color: #08745f;
}

.support-reply-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding-top: 10px;
  border-top: 1px solid #e2ecef;
}

.support-reply-form button,
.support-compose-card button {
  min-height: 38px;
  font-weight: 850;
}

@media (max-width: 980px) {
  .cloud-toast {
    top: auto;
    bottom: 14px;
    left: 12px;
    right: 12px;
    justify-content: center;
    transform: translateY(18px) scale(0.95);
  }

  .cloud-toast.show {
    animation: cloudToastMobileBounce 720ms cubic-bezier(0.2, 0.9, 0.25, 1.15) both;
  }

  .cloud-toast strong {
    white-space: normal;
  }

  @keyframes cloudToastMobileBounce {
    0% { transform: translateY(18px) scale(0.94); }
    45% { transform: translateY(-7px) scale(1.035); }
    70% { transform: translateY(3px) scale(0.995); }
    100% { transform: translateY(0) scale(1); }
  }

  .cloud-business-head,
  .section-title {
    align-items: flex-start;
    flex-direction: column;
  }

  .cloud-business-actions {
    width: 100%;
  }

  .cloud-business-actions button {
    flex: 1;
  }

  .section-action-button {
    width: 100%;
  }

  .section-title-actions {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .selected-company-chip,
  .selected-branch-chip {
    max-width: none;
    justify-content: center;
  }

  .cloud-branch-card,
  .cloud-profile-section .cloud-admin-summary,
  .branch-subscription-grid {
    grid-template-columns: 1fr;
  }

  .cloud-business-health {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cloud-company-register-head,
  .cloud-branch-register-head {
    display: none;
  }

  .cloud-company-row,
  .cloud-branch-row {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: flex-start;
  }

  .cloud-company-action,
  .cloud-branch-action {
    justify-content: flex-start;
  }
}

.cloud-setup-form {
  display: grid;
  gap: 8px;
  margin-top: 0;
}

.cloud-setup-form label {
  display: grid;
  gap: 0;
}

.cloud-form-help {
  margin: -5px 0 0;
  color: #7a8b93;
  font-size: 11px;
  line-height: 1.25;
}

.cloud-setup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.cloud-company-branch-fields {
  position: relative;
  display: grid;
  gap: 7px;
}

.cloud-nested-field {
  position: relative;
  margin-left: 0;
}

.cloud-nested-field::before {
  display: none;
}

.cloud-setup-form input {
  height: 36px;
  min-height: 36px;
  width: 100%;
  line-height: 36px;
}

.cloud-phone-field {
  position: relative;
}

.cloud-phone-prefix {
  position: absolute;
  left: 10px;
  top: 50%;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 20px;
  padding-right: 8px;
  border-right: 1px solid #cfdadd;
  color: #18363b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  pointer-events: none;
  transform: translateY(-50%);
}

.cloud-phone-flag {
  display: block;
  width: 24px;
  height: 16px;
  flex: 0 0 24px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 2px;
}

.cloud-phone-field input {
  padding-left: 84px;
}

.cloud-setup-form input::placeholder {
  color: #7d8a91;
  opacity: 0.72;
}

@media (max-width: 820px) {
  .cloud-gate {
    align-items: flex-start;
    padding: 14px;
    overflow-y: auto;
  }

  .cloud-login-shell {
    width: min(100%, 520px);
    height: auto;
    max-height: none;
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .cloud-login-pitch {
    gap: 14px;
    min-height: 0;
    padding: 22px;
  }

  .cloud-login-pitch h1 {
    margin-top: 10px;
    font-size: 25px;
  }

  .cloud-login-pitch p {
    font-size: 13px;
  }

  .cloud-pitch-points {
    grid-template-columns: 1fr;
  }

  .cloud-pitch-points span {
    min-height: 0;
  }

  .cloud-card {
    padding: 22px;
  }

  .cloud-setup-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .support-chat-button {
    right: 14px;
    bottom: 14px;
    min-height: 40px;
    padding: 0 13px 0 11px;
  }

  .support-chat-modal {
    padding: 10px;
  }

  .support-chat-card {
    width: 100%;
    max-height: calc(100vh - 20px);
  }

  .support-chat-body {
    min-height: 0;
  }

  .support-chat-layout {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .support-ticket-list {
    max-height: 190px;
    border-right: 0;
    border-bottom: 1px solid #e2ecef;
  }

  .support-thread-panel {
    padding: 12px;
  }

  .support-thread {
    min-height: 360px;
    grid-template-rows: auto minmax(180px, 1fr) auto;
  }

  .support-thread-head,
  .support-inbox-row,
  .support-inbox-actions,
  .support-reply-form {
    grid-template-columns: 1fr;
  }

  .support-thread-head,
  .support-inbox-actions {
    align-items: stretch;
  }

  .support-thread-head,
  .support-inbox-actions {
    flex-direction: column;
  }

  .support-message {
    max-width: 92%;
  }
}

.modal[hidden] { display: none; }

.modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 24px;
}

.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.38);
}

.modal-card {
  position: relative;
  z-index: 1;
  width: min(720px, 100%);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.22);
  padding: 0;
}

#quickMapForm.modal-card {
  width: min(940px, 100%);
}

.modal-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}

.modal-head h3 { margin: 0; font-size: 17px; }
.modal-head p { margin: 4px 0 0; color: var(--muted); max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.modal-grid {
  display: grid;
  grid-template-columns: 2fr 2fr 1fr;
  gap: 12px;
  padding: 16px;
}

.modal-grid label { display: grid; gap: 5px; }
.modal-grid label:first-child { grid-column: span 3; }

.adjustment-modal .modal-card {
  width: min(680px, 100%);
}

.adjustment-grid {
  grid-template-columns: 1.4fr 1.2fr 0.8fr;
}

.adjustment-grid label:first-child {
  grid-column: auto;
}

.adjustment-grid label:last-child {
  grid-column: 1 / -1;
}

.adjustment-preview {
  margin: 0 16px 16px;
  padding: 10px 12px;
  border: 1px solid #d8e7e9;
  border-radius: 8px;
  background: #f3faf8;
  color: #25464d;
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  white-space: normal;
}

.adjustment-impact-preview {
  display: grid;
  gap: 8px;
}

.adjustment-impact-title {
  color: #143b42;
  font-size: 13px;
  font-weight: 750;
}

.adjustment-impact-section {
  overflow: hidden;
  border: 1px solid #d4e4e7;
  border-radius: 8px;
  background: #fff;
}

.adjustment-impact-section > strong {
  display: block;
  padding: 7px 9px;
  border-bottom: 1px solid #e0eaec;
  color: #264a52;
  font-size: 12px;
}

.adjustment-impact-section.negative > strong {
  background: #fff1f2;
  color: #b91c1c;
}

.adjustment-impact-section.positive > strong {
  background: #ecfdf5;
  color: #047857;
}

.adjustment-impact-section table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.adjustment-impact-section th:nth-child(1) { width: 58%; }
.adjustment-impact-section th:nth-child(2) { width: 28%; }
.adjustment-impact-section th:nth-child(3) { width: 14%; }

.adjustment-impact-section th,
.adjustment-impact-section td {
  padding: 6px 8px;
  border-bottom: 1px solid #eef3f4;
  text-align: left;
}

.adjustment-impact-section th {
  color: #526b73;
  font-size: 10px;
  text-transform: uppercase;
}

.adjustment-impact-section .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.adjustment-impact-section .negative {
  color: #dc2626;
  font-weight: 750;
}

.adjustment-impact-section .positive {
  color: #047857;
  font-weight: 750;
}

.adjustment-impact-empty,
.adjustment-impact-note {
  padding: 8px 10px;
  border: 1px dashed #cbdde1;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.75);
  color: #526b73;
  font-size: 12px;
}

.remarks-card {
  width: min(640px, calc(100vw - 32px));
}

.remarks-body {
  display: grid;
  gap: 12px;
  padding: 14px 16px;
}

.remarks-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.remarks-list-head strong {
  font-size: 13px;
}

.remarks-list-head span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.remarks-existing-list {
  display: grid;
  gap: 6px;
  max-height: 190px;
  overflow: auto;
}

.remark-line {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid #e0eaed;
  border-radius: 7px;
  background: #fbfdfd;
}

.remark-line span {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #e8f4f3;
  color: var(--accent-strong);
  font-size: 11px;
  font-weight: 800;
}

.remark-line p {
  margin: 2px 0 0;
  color: #24323a;
  font-size: 13px;
  line-height: 1.35;
}

.remark-empty {
  padding: 10px;
  border: 1px dashed #cfdde1;
  border-radius: 7px;
  color: var(--muted);
  font-size: 13px;
}

.remarks-add-field {
  display: grid;
  gap: 6px;
}

.remarks-add-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.adjustment-window-modal {
  align-items: stretch;
  place-items: center;
}

.adjustment-window-card {
  width: min(1300px, calc(100vw - 32px));
  max-height: calc(100vh - 44px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.adjustment-window-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
  background: #f7fbfb;
}

.adjustment-window-note {
  color: var(--muted);
  font-size: 12px;
  margin-left: auto;
}

.adjustment-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  padding: 14px;
  border-bottom: 1px solid var(--line);
  background: #fbfdfd;
}

.adjustment-type-tile {
  min-height: 122px;
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 5px;
  padding: 12px;
  border: 1px solid #d7e4e7;
  border-radius: 8px;
  background: #fff;
  text-align: left;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
}

.adjustment-type-tile:hover,
.adjustment-type-tile.active {
  border-color: var(--accent);
  background: #f0fbf8;
}

.adjustment-tile-icon {
  width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  color: #0f766e;
}

.adjustment-tile-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.adjustment-type-tile strong {
  font-size: 13px;
}

.adjustment-type-tile span:not(.adjustment-tile-icon) {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.adjustment-type-tile em {
  margin-top: 4px;
  color: #21434b;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.adjustment-history-panel {
  flex: 1 1 auto;
  min-height: 280px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.adjustment-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: #f7fbfb;
}

.adjustment-history-head strong {
  display: block;
  font-size: 14px;
}

.adjustment-history-head > div span {
  color: var(--muted);
  font-size: 12px;
}

.icon-text-button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  color: inherit;
  font-weight: 650;
}

.icon-text-button span {
  color: inherit;
  font-size: 12px;
}

.adjustment-history-list {
  flex: 1 1 auto;
  overflow: auto;
  background: #fff;
  padding-right: 1px;
}

.adjustment-history-table {
  width: 100%;
  min-width: 920px;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 12px;
}

.adjustment-history-table th,
.adjustment-history-table td {
  border: 1px solid #dce6e9;
  padding: 8px 7px;
  vertical-align: middle;
  overflow: hidden;
  box-sizing: border-box;
}

.adjustment-history-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #e9f1f2;
  color: #18343b;
  text-align: left;
}

.adjustment-history-table th:nth-child(1) { width: 255px; }
.adjustment-history-table th:nth-child(2) { width: 230px; }
.adjustment-history-table th:nth-child(3) { width: 90px; }
.adjustment-history-table th:nth-child(4) { width: 70px; }
.adjustment-history-table th:nth-child(5) { width: 270px; }
.adjustment-history-table th:nth-child(6) { width: 130px; }
.adjustment-history-table th:nth-child(7) { width: 96px; }

.stock-swap-history {
  min-width: 900px;
}

.stock-swap-history th:nth-child(1),
.stock-swap-history td:nth-child(1) { width: 32%; }
.stock-swap-history th:nth-child(2),
.stock-swap-history td:nth-child(2) { width: 32%; }
.stock-swap-history th:nth-child(3),
.stock-swap-history td:nth-child(3) { width: 8%; }
.stock-swap-history th:nth-child(4),
.stock-swap-history td:nth-child(4) { width: 7%; }
.stock-swap-history th:nth-child(5),
.stock-swap-history td:nth-child(5) { width: 13%; }
.stock-swap-history th:nth-child(6),
.stock-swap-history td:nth-child(6) { width: 8%; }

.other-adjustment-history {
  min-width: 0;
}

.other-adjustment-history th:nth-child(1),
.other-adjustment-history td:nth-child(1) { width: 30%; }
.other-adjustment-history th:nth-child(2),
.other-adjustment-history td:nth-child(2) { width: 8%; }
.other-adjustment-history th:nth-child(3),
.other-adjustment-history td:nth-child(3) { width: 24%; }
.other-adjustment-history th:nth-child(4),
.other-adjustment-history td:nth-child(4) { width: 8%; }
.other-adjustment-history th:nth-child(5),
.other-adjustment-history td:nth-child(5) { width: 6%; }
.other-adjustment-history th:nth-child(6),
.other-adjustment-history td:nth-child(6) { width: 5%; }
.other-adjustment-history th:nth-child(7),
.other-adjustment-history td:nth-child(7) { width: 11%; }
.other-adjustment-history th:nth-child(8),
.other-adjustment-history td:nth-child(8) {
  width: 8%;
  min-width: 88px;
  overflow: visible;
}

.other-adjustment-history .table-actions {
  justify-content: center;
}

.other-adjustment-history .reason-cell {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.3;
}

.adjustment-history-table td:first-child span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.adjustment-impact-mini {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  padding-top: 6px;
  border-top: 1px dashed #d6e4e7;
}

.adjustment-impact-mini div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.adjustment-impact-mini b {
  min-width: 0;
  color: #173b43;
  font-size: 11px;
  font-weight: 650;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.adjustment-impact-mini em {
  color: #4d626b;
  font-size: 11px;
  font-style: normal;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.adjustment-impact-mini em.negative { color: #dc2626; }
.adjustment-impact-mini em.positive { color: #047857; }

.adjustment-history-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.adjustment-history-table td:nth-child(2),
.adjustment-note-cell {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stock-swap-history td:nth-child(1),
.stock-swap-history td:nth-child(2) {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.stock-swap-history td:nth-child(1) strong,
.stock-swap-history td:nth-child(2) strong {
  display: block;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.stock-swap-item-impact {
  margin-top: 7px;
}

.stock-swap-item-impact b {
  white-space: normal;
  overflow-wrap: anywhere;
  text-overflow: clip;
}

.stock-swap-item-impact em {
  font-weight: 750;
}

.adjustment-history-empty {
  display: grid;
  gap: 4px;
  padding: 24px 16px;
  color: var(--muted);
}

.adjustment-history-empty strong {
  color: var(--text);
}

.adjustment-entry-card {
  width: min(940px, calc(100vw - 32px));
}

.adjustment-entry-card .modal-head {
  padding: 12px 16px;
}

.adjustment-entry-grid {
  position: relative;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: end;
  gap: 10px;
  padding: 12px 16px;
}

.adjustment-entry-grid label {
  gap: 4px;
  min-width: 0;
}

.adjustment-entry-grid label span {
  font-size: 12px;
}

.adjustment-entry-grid input,
.adjustment-entry-grid select {
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: 5px 8px;
}

.adjustment-entry-grid label:first-child {
  grid-column: auto;
}

.adjustment-entry-grid label:last-child {
  grid-column: 1 / -1;
}

#adjustmentEntryItemWrap {
  position: relative;
  grid-column: span 4;
}

#adjustmentEntrySapWrap {
  grid-column: span 2;
}

#adjustmentEntryModeWrap {
  grid-column: span 2;
}

#adjustmentEntryOtherTypeWrap {
  grid-column: span 2;
}

#adjustmentEntryReasonWrap {
  grid-column: span 4;
}

#adjustmentEntryBranchWrap,
#adjustmentEntryRelatedItemWrap {
  grid-column: span 4;
}

#adjustmentEntryInvoiceWrap {
  grid-column: span 2;
  max-width: none;
}

#adjustmentEntryQtyWrap {
  grid-column: span 1;
  max-width: 96px;
}

#adjustmentEntryUomWrap {
  grid-column: span 1;
  max-width: 76px;
}

#adjustmentEntryReason {
  text-overflow: ellipsis;
}

#adjustmentEntryItemWrap span::after {
  content: "Type to filter";
  margin-left: 7px;
  color: #6a7d86;
  font-size: 10px;
  font-weight: 600;
}

#adjustmentEntryItemWrap input {
  border-color: #a9ccd1;
  background: linear-gradient(90deg, #f7fcfb 0, #fff 100%);
  padding-left: 31px;
}

#adjustmentEntryItemWrap::before {
  content: "";
  position: absolute;
  left: 10px;
  bottom: 10px;
  width: 10px;
  height: 10px;
  border: 2px solid #0f766e;
  border-radius: 50%;
  pointer-events: none;
}

#adjustmentEntryItemWrap::after {
  content: "";
  position: absolute;
  left: 21px;
  bottom: 8px;
  width: 7px;
  height: 2px;
  border-radius: 2px;
  background: #0f766e;
  transform: rotate(45deg);
  pointer-events: none;
}

.dsc-picker-results {
  position: absolute;
  left: 16px;
  top: 58px;
  z-index: 6;
  width: min(520px, calc(100% - 32px));
  max-height: 320px;
  overflow: auto;
  border: 1px solid #cbdde1;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.18);
  padding: 6px;
}

#adjustmentEntryPicker {
  min-width: min(360px, calc(100% - 32px));
}

.global-dsc-picker {
  position: fixed;
  z-index: 140;
  max-height: min(320px, calc(100vh - 24px));
}

.dsc-picker-meta {
  position: sticky;
  top: -6px;
  z-index: 1;
  margin: -6px -6px 5px;
  padding: 7px 10px;
  border-bottom: 1px solid #dfeaec;
  background: #f5faf9;
  color: #4f6570;
  font-size: 11px;
  font-weight: 700;
}

.dsc-picker-option {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) 48px;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  padding: 6px 8px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  text-align: left;
}

.dsc-picker-option:hover,
.dsc-picker-option:focus {
  background: #edf7f5;
  outline: 1px solid #9fcfca;
}

.dsc-picker-option span {
  color: #0f5660;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.dsc-picker-option strong {
  overflow: hidden;
  color: #172026;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dsc-picker-option em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  text-align: right;
}

.dsc-picker-empty {
  padding: 12px;
  color: var(--muted);
  font-size: 12px;
}

.adjustment-window-wrap {
  flex: 1 1 auto;
  min-height: 260px;
  max-height: calc(100vh - 230px);
  border: 0;
  border-radius: 0;
}

.adjustment-window-table {
  min-width: 1280px;
  table-layout: fixed;
}

.adjustment-window-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #e9f1f2;
}

.adjustment-window-table th:nth-child(1),
.adjustment-window-table td:nth-child(1) { width: 72px; min-width: 72px; max-width: 72px; }
.adjustment-window-table th:nth-child(2),
.adjustment-window-table td:nth-child(2) { width: 280px; min-width: 280px; max-width: 280px; }
.adjustment-window-table th:nth-child(3),
.adjustment-window-table td:nth-child(3) { width: 92px; min-width: 92px; max-width: 92px; }
.adjustment-window-table th:nth-child(4),
.adjustment-window-table td:nth-child(4),
.adjustment-window-table th:nth-child(5),
.adjustment-window-table td:nth-child(5) { width: 108px; min-width: 108px; max-width: 108px; }
.adjustment-window-table th:nth-child(6),
.adjustment-window-table td:nth-child(6),
.adjustment-window-table th:nth-child(7),
.adjustment-window-table td:nth-child(7) { width: 124px; min-width: 124px; max-width: 124px; }
.adjustment-window-table th:nth-child(8),
.adjustment-window-table td:nth-child(8),
.adjustment-window-table th:nth-child(9),
.adjustment-window-table td:nth-child(9) { width: 112px; min-width: 112px; max-width: 112px; }
.adjustment-window-table th:nth-child(10),
.adjustment-window-table td:nth-child(10) { width: 70px; min-width: 70px; max-width: 70px; }
.adjustment-window-table th:nth-child(11),
.adjustment-window-table td:nth-child(11) { width: 210px; min-width: 210px; max-width: 210px; }

.adjustment-window-table tbody tr.no-adjustment-row td {
  background: #fbfcfc;
}

.adjustment-window-table tbody tr.adjustment-row td {
  background: #f5fbfa;
}

.quick-map-head {
  grid-column: span 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.quick-map-head strong {
  color: var(--text);
  font-size: 13px;
}

.quick-map-rows {
  grid-column: span 3;
  display: grid;
  gap: 8px;
}

.quick-map-row {
  display: grid;
  grid-template-columns: 112px minmax(360px, 1fr) 80px 110px 32px;
  gap: 8px;
  align-items: end;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.quick-map-row label {
  display: grid;
  grid-column: auto !important;
  gap: 5px;
  min-width: 0;
}

.quick-map-row input {
  width: 100% !important;
  min-width: 0;
}

.quick-map-row .quick-map-sap {
  font-size: 13px;
}

.quick-map-row .quick-map-uom {
  background: #f3f8fa;
  color: #405058;
}

.quick-add-grid {
  display: grid;
  grid-template-columns: minmax(120px, 160px) minmax(240px, 1fr) minmax(160px, 220px);
  gap: 10px;
  padding: 16px;
}

.quick-add-grid.compact {
  grid-template-columns: minmax(140px, 220px);
}

.quick-add-grid input {
  width: 100%;
}

.quick-add-grid select {
  width: 100%;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 12px 16px 16px;
}

.warning-modal .modal-card {
  width: min(560px, 100%);
  border-color: #f3c98b;
}

.effective-date-modal .modal-card {
  width: min(430px, calc(100vw - 32px));
}

.effective-date-body {
  padding: 16px;
}

.effective-date-body label {
  display: grid;
  gap: 6px;
}

.effective-date-body input {
  width: 100%;
  min-height: 42px;
  font-size: 14px;
}

.warning-head {
  background: #fff7ed;
  border-bottom-color: #f3c98b;
}

.warning-head h3 {
  color: #8a4b05;
}

.warning-head p {
  max-width: none;
  white-space: normal;
}

.warning-modal-body {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.warning-modal-body p {
  margin: 0;
  color: #8a4b05;
  line-height: 1.45;
}

.warning-modal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 10px;
}

.warning-modal-grid div {
  border: 1px solid #f3d3a5;
  border-radius: 8px;
  background: #fffaf4;
  padding: 10px;
}

.warning-modal-grid span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-bottom: 4px;
}

.warning-modal-grid strong {
  display: block;
  color: var(--text);
  font-size: 15px;
}

.company-switch-modal .modal-card {
  width: min(520px, calc(100vw - 32px));
}

.switch-current-card,
.switch-preview,
.switch-warning {
  margin: 12px 16px 0;
  padding: 12px;
  border-radius: 8px;
}

.switch-current-card,
.switch-preview {
  display: grid;
  gap: 4px;
  border: 1px solid #d8e5e8;
  background: #f6fafb;
}

.switch-current-card span,
.switch-preview span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}

.switch-current-card strong,
.switch-preview strong {
  color: var(--text);
  font-size: 15px;
}

.switch-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 12px 16px 0;
}

.switch-grid label {
  display: grid;
  gap: 5px;
}

.switch-grid select {
  width: 100%;
}

.switch-preview {
  border-color: #b8d8d4;
  background: #effaf8;
}

.switch-warning {
  border: 1px solid #f0c7c7;
  background: #fff5f5;
  color: var(--danger);
  font-size: 13px;
  line-height: 1.35;
}

.unmapped-map-modal .modal-card {
  width: min(980px, calc(100vw - 32px));
}

.unmapped-map-layout {
  display: grid;
  grid-template-columns: minmax(390px, 1fr) 430px;
  gap: 14px;
  padding: 16px;
}

.unmapped-map-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.unmapped-map-toolbar strong {
  color: var(--text);
}

.unmapped-map-toolbar span {
  color: var(--muted);
  font-size: 12px;
}

.unmapped-map-list {
  display: grid;
  gap: 6px;
  max-height: 390px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 8px;
  scrollbar-gutter: stable;
}

.unmapped-map-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 38px;
  padding: 7px 10px;
  border-radius: 6px;
  text-align: left;
}

.unmapped-map-item span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.unmapped-map-item strong {
  color: var(--danger);
  font-size: 12px;
  text-align: right;
  white-space: nowrap;
}

.unmapped-map-item.active {
  border-color: var(--accent);
  background: #e9f8f5;
}

.unmapped-map-form {
  align-self: start;
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
  padding: 12px;
}

.unmapped-map-form label {
  display: grid;
  gap: 5px;
}

.unmapped-map-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.unmapped-mapping-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.unmapped-mapping-head strong {
  color: var(--text);
  font-size: 13px;
}

.unmapped-mapping-rows {
  display: grid;
  gap: 8px;
}

.unmapped-mapping-row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1.7fr) 86px 86px 34px;
  gap: 8px;
  align-items: end;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.unmapped-mapping-row label {
  min-width: 0;
}

.unmapped-mapping-row input {
  width: 100%;
}

.remove-map-row {
  align-self: end;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
  border-color: #f0b4b4;
  border-radius: 8px;
  background: #fff8f8;
  color: var(--danger);
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
}

.remove-map-row:hover {
  border-color: #d96b6b;
  background: #fff1f1;
}

.remove-map-row:disabled {
  visibility: hidden;
}

.unmapped-map-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.unmapped-map-done {
  display: grid;
  gap: 5px;
  border: 1px solid #b7dccf;
  border-radius: 8px;
  background: #eefaf5;
  color: var(--ok);
  padding: 14px;
}

.unmapped-map-done span {
  color: var(--muted);
}

@media (max-width: 980px) {
  .sidebar {
    position: sticky;
    top: 0;
    z-index: 30;
    width: 100%;
    padding: 8px 10px 7px;
    border-right: 0;
    border-bottom: 1px solid #1b2930;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.18);
  }
  .brand {
    gap: 8px;
    margin-bottom: 8px;
  }
  .brand-mark {
    width: 38px;
    height: 38px;
    border-radius: 7px;
    font-size: 11px;
  }
  .sidebar-accountbook-logo img {
    width: 36px;
    height: 36px;
    transform: none;
  }
  .brand h1 {
    font-size: 13px;
    line-height: 1.1;
  }
  .sidebar-switcher {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    padding: 6px 8px;
    border-radius: 7px;
  }
  body.staff-workspace-mode .sidebar-switcher {
    display: none;
  }
  .context-card {
    gap: 1px;
  }
  .context-card span {
    font-size: 9px;
  }
  .context-card strong {
    font-size: 12px;
  }
  .context-card em {
    font-size: 10px;
  }
  .context-change-button {
    width: auto;
    min-width: 82px;
    min-height: 28px;
    padding: 0 8px;
    font-size: 11px;
  }
  .sidebar-credit {
    margin-top: 8px;
    padding: 6px 0 0;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 5px;
    border-top-color: rgba(203, 213, 225, 0.10);
    font-size: 10px;
  }
  .sidebar-credit strong {
    overflow: hidden;
    font-size: 10.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .master-mode-switch.subtabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .master-mode-switch .subtab {
    width: 100%;
    min-height: 0;
    aspect-ratio: 1 / 1;
    padding: 9px;
  }
  .tabs {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 1px;
    scrollbar-width: none;
  }
  .tabs::-webkit-scrollbar {
    display: none;
  }
  .tab {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 0 10px;
    border-color: #3a4c54;
    border-radius: 8px;
    background: #2d3b42;
    font-size: 12px;
    white-space: nowrap;
  }
  .tab.active,
  .tab:hover {
    background: #42545c;
  }
  .nav-icon,
  .nav-icon svg {
    width: 15px;
    height: 15px;
  }
  .shell {
    margin-left: 0;
    min-height: auto;
  }
  .topbar {
    position: static;
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
    padding: 12px 14px;
  }
  .topbar h2 {
    font-size: 18px;
  }
  .topbar p {
    margin-top: 2px;
    font-size: 12px;
  }
  .topbar-actions { justify-content: flex-start; width: 100%; }
  .topbar-context,
  .topbar-date-control {
    width: 100%;
    max-width: none;
  }
  body.staff-workspace-mode .cloud-status,
  body.staff-workspace-mode .cloud-preview-role,
  body.staff-workspace-mode #cloudLogoutBtn {
    width: 100%;
    max-width: none;
  }
  .panel {
    padding: 12px;
  }
  .work-panel.fullscreen {
    inset: 0;
    border-radius: 0;
  }
  .work-panel.fullscreen.staff-stock-panel {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .staff-stock-panel .work-head,
  .staff-stock-panel .stock-table-wrap,
  .staff-quick-count-panel {
    width: calc(100% - 16px);
  }
  .staff-stock-panel .work-head {
    margin-top: 8px;
    padding: 8px;
  }
  .staff-count-overview {
    gap: 8px;
    padding: 8px;
  }
  .staff-count-title strong {
    font-size: 17px;
  }
  .staff-count-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 6px;
  }
  .staff-count-status-grid span {
    min-width: 0;
    width: 100%;
    padding-left: 7px;
    padding-right: 7px;
  }
  .staff-stock-panel .work-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    width: 100%;
    gap: 8px;
  }
  .staff-stock-panel .stock-entry-mode-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }
  .staff-stock-panel .work-filter-actions {
    display: none;
  }
  .staff-stock-panel .stock-entry-mode-tabs button,
  .staff-stock-panel .work-filter-actions button {
    min-width: 0;
  }
  .staff-stock-panel .work-item-search {
    min-width: 0;
    width: 100%;
    max-width: none;
  }
  .staff-stock-panel .work-commit-actions {
    width: 100%;
    padding-left: 0;
    margin-left: 0;
  }
  .staff-stock-panel .work-commit-actions button,
  #saveImportStock.save-return-action {
    width: 100%;
    min-width: 0;
  }
  .staff-stock-panel.staff-quick-entry-mode {
    padding-bottom: 8px;
  }
  .staff-quick-count-panel {
    margin-bottom: 8px;
  }
  .staff-quick-body {
    padding: 8px;
  }
  .staff-quick-split {
    gap: 10px;
  }
  .staff-quick-card-head,
  .staff-quick-sheet-head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3px;
  }
  .staff-quick-entry-grid {
    grid-template-columns: 1fr;
  }
  .staff-quick-entry-grid label,
  .staff-quick-entry-grid .staff-quick-item-field,
  .staff-quick-entry-grid .staff-quick-qty-field,
  .staff-quick-entry-grid .staff-quick-submit {
    grid-column: 1 / -1;
  }
  .staff-quick-suggest-menu {
    min-width: 100%;
    max-height: 260px;
  }
  .staff-quick-sheet-wrap {
    overflow-x: hidden;
    max-height: 260px;
  }
  .staff-quick-sheet table {
    min-width: 0 !important;
  }
  .staff-quick-sheet th,
  .staff-quick-sheet td {
    padding-left: 5px;
    padding-right: 5px;
  }
  .staff-quick-sheet th:nth-child(1),
  .staff-quick-sheet td:nth-child(1) {
    width: 38%;
  }
  .staff-quick-sheet th:nth-child(2),
  .staff-quick-sheet td:nth-child(2) {
    width: 23%;
  }
  .staff-quick-sheet th:nth-child(3),
  .staff-quick-sheet td:nth-child(3) {
    width: 44px;
  }
  .staff-quick-sheet th:nth-child(4),
  .staff-quick-sheet td:nth-child(4) {
    width: 68px;
  }
  .staff-quick-sheet th:nth-child(5),
  .staff-quick-sheet td:nth-child(5) {
    width: 38px;
  }
  .staff-quick-sheet input {
    min-height: 30px;
    padding-left: 5px;
    padding-right: 5px;
  }
  .staff-summary-delete {
    width: 28px;
    height: 28px;
    min-height: 28px;
  }
  .staff-stock-panel .stock-table-wrap {
    max-height: none;
  }
  #importStockTable.staff-closing-table th,
  #importStockTable.staff-closing-table td {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 11px;
  }
  #importStockTable.staff-closing-table th:nth-child(1),
  #importStockTable.staff-closing-table td:nth-child(1) {
    width: 50%;
    padding-left: 7px;
  }
  #importStockTable.staff-closing-table th:nth-child(2),
  #importStockTable.staff-closing-table td:nth-child(2) {
    width: 28%;
  }
  #importStockTable.staff-closing-table th:nth-child(3),
  #importStockTable.staff-closing-table td:nth-child(3) {
    width: 22%;
    padding-right: 7px;
  }
  .staff-stock-item-cell span {
    font-size: 11px;
  }
  .staff-closing-current {
    width: 100%;
  }
  .staff-closing-stock-cell .smart-edit-value {
    padding-left: 5px;
    padding-right: 5px;
  }
  .staff-uom-chip {
    width: 42px;
    padding-left: 4px;
    padding-right: 4px;
  }
  .staff-stock-item-cell .staff-uom-chip {
    width: auto;
    max-width: 100%;
  }
  .staff-add-stock {
    width: 100%;
  }
  #importStockTable .staff-add-closing-qty {
    min-height: 30px;
    padding-left: 4px;
    padding-right: 4px;
  }
  .work-command-panel { grid-template-columns: 1fr; }
  .work-range-form,
  .work-range-form.single-mode,
  .import-form { grid-template-columns: 1fr; }
  .report-filter-card,
  .report-summary-strip,
  .report-output-metrics { grid-template-columns: 1fr; }
  .report-output-head { align-items: flex-start; flex-direction: column; }
  .report-viewer-modal { padding: 8px; }
  .report-viewer-panel,
  .report-viewer-panel.fullscreen {
    width: calc(100vw - 16px);
    height: calc(100vh - 16px);
    max-height: calc(100vh - 16px);
  }
  .report-viewer-head { align-items: flex-start; flex-direction: column; }
  .report-viewer-actions { justify-content: flex-start; }
  .report-viewer-period-row { align-items: stretch; flex-direction: column; }
  .report-viewer-period-title,
  .report-viewer-date { width: 100%; min-width: 0; }
  .metric-grid, .dashboard-status-grid, .dashboard-flow, .dashboard-grid, .dashboard-grid.three-col, .dashboard-quick-grid, .split, .form-grid, .company-form, .company-row, .modal-grid, .quick-add-grid, .preview-grid, .warning-modal-grid, .switch-grid, .unmapped-map-layout, .unmapped-map-row, .unmapped-mapping-row, .quick-map-row { grid-template-columns: 1fr; }
  .dashboard-hero { align-items: flex-start; flex-direction: column; }
  .dashboard-hero-actions { justify-content: flex-start; }
  .dashboard-alert,
  .dashboard-flow-head { align-items: flex-start; flex-direction: column; }
  .file-field { grid-column: auto; }
  .modal-grid label:first-child { grid-column: auto; }
  .master-group-form,
  .master-pos-input-row,
  .master-editor-row,
  .master-head-tools,
  .master-uom-tools,
  .master-mapping-line { grid-template-columns: 1fr; align-items: start; }
  .master-editor-head,
  .master-mapping-editor { grid-column: auto; }
  .inline-field-action { grid-template-columns: 1fr; }
.master-recipe { text-align: left; }
}

.staff-summary-item-top {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.staff-summary-item-top strong {
  flex: 0 1 auto;
}

.staff-summary-uom-mobile {
  display: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 18px;
  padding: 0 7px;
  border: 1px solid #d3e8ea;
  border-radius: 999px;
  color: #20515a;
  background: #f5fbfb;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.staff-summary-item-cell strong,
.staff-summary-item-cell span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.staff-summary-item-cell strong {
  color: #0f3f46;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.staff-summary-item-cell span {
  margin-top: 1px;
  color: var(--muted);
  font-size: 10.5px;
}

.staff-summary-add-control {
  display: block;
}

.staff-summary-add-button {
  display: none;
}

.staff-quick-sheet th:nth-child(1),
.staff-quick-sheet td:nth-child(1) {
  width: 40%;
}

.staff-quick-sheet th:nth-child(2),
.staff-quick-sheet td:nth-child(2) {
  width: 22%;
}

.staff-quick-sheet th:nth-child(3),
.staff-quick-sheet td:nth-child(3) {
  width: 52px;
  text-align: center;
}

.staff-quick-sheet th:nth-child(4),
.staff-quick-sheet td:nth-child(4) {
  width: 82px;
}

.staff-quick-sheet th:nth-child(5),
.staff-quick-sheet td:nth-child(5) {
  width: 46px;
  text-align: center;
}

#importStockTable.staff-closing-table th:nth-child(1),
#importStockTable.staff-closing-table td:nth-child(1) {
  width: 52%;
}

#importStockTable.staff-closing-table th:nth-child(2),
#importStockTable.staff-closing-table td:nth-child(2) {
  width: 28%;
}

#importStockTable.staff-closing-table th:nth-child(3),
#importStockTable.staff-closing-table td:nth-child(3) {
  width: 20%;
}

@media (max-width: 640px) {
  .staff-quick-suggest-menu {
    max-height: min(46vh, 300px);
    padding: 5px;
  }

  .staff-quick-suggest-option {
    grid-template-columns: 64px minmax(0, 1fr) 32px;
    gap: 6px;
    min-height: 42px;
    padding: 6px 7px;
  }

  .staff-quick-suggest-code {
    min-height: 20px;
    padding: 0 6px;
    font-size: 10.5px;
  }

  .staff-quick-suggest-name {
    display: -webkit-box;
    overflow: hidden;
    font-size: 11.5px;
    line-height: 1.2;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .staff-quick-suggest-uom {
    font-size: 10px;
  }

  .staff-quick-sheet-wrap {
    max-height: 330px;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .staff-quick-sheet table,
  .staff-quick-sheet thead,
  .staff-quick-sheet tbody {
    display: block;
    width: 100%;
  }

  .staff-quick-sheet thead {
    display: none;
  }

  .staff-quick-sheet tbody {
    display: grid;
    gap: 7px;
    padding: 7px;
  }

  .staff-quick-sheet tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(84px, 96px) 34px;
    grid-template-areas:
      "item item action"
      "stock add add";
    gap: 8px;
    padding: 8px;
    border: 1px solid #dce9eb;
    border-radius: 8px;
    background: #fff;
  }

  .staff-quick-sheet td {
    display: block;
    width: auto !important;
    padding: 0 !important;
    border-bottom: 0;
  }

  .staff-quick-sheet td:nth-child(1) {
    grid-area: item;
  }

  .staff-quick-sheet td:nth-child(2) {
    display: grid;
    grid-area: stock;
    gap: 3px;
  }

  .staff-quick-sheet td:nth-child(3) {
    display: none;
  }

  .staff-quick-sheet td:nth-child(4) {
    display: grid;
    grid-area: add;
    gap: 3px;
  }

  .staff-quick-sheet td:nth-child(5) {
    grid-area: action;
    justify-self: end;
    align-self: start;
  }

  .staff-quick-sheet td:nth-child(2)::before,
  .staff-quick-sheet td:nth-child(4)::before {
    color: #607982;
    font-size: 9.5px;
    font-weight: 750;
    line-height: 1;
    text-transform: uppercase;
  }

  .staff-quick-sheet td:nth-child(2)::before {
    content: "Stock";
  }

  .staff-quick-sheet td:nth-child(4)::before {
    content: "Add Qty";
  }

  .staff-summary-item-cell strong {
    font-size: 11.5px;
  }

  .staff-summary-item-top {
    align-items: flex-start;
  }

  .staff-summary-uom-mobile {
    display: inline-flex;
  }

  .staff-summary-item-cell span {
    display: -webkit-box;
    overflow: hidden;
    font-size: 10.5px;
    line-height: 1.25;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .staff-summary-add-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 6px;
    align-items: center;
  }

  .staff-summary-add-button {
    display: inline-flex;
    width: 34px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    color: #087c73;
    border-color: #c8e7e4;
    background: #f4fbfa;
  }

  .staff-summary-add-button svg {
    width: 15px;
    height: 15px;
  }

  .staff-summary-stock-input,
  .staff-summary-add-input {
    min-height: 32px;
    text-align: center;
  }

  .staff-summary-delete {
    width: 30px;
    height: 30px;
    min-height: 30px;
    border-color: #ffd4d4;
    background: #fff;
  }

  .sales-history-list.stock-count-history-list {
    overflow-x: hidden;
  }

  .stock-count-history-table,
  .stock-count-history-table > thead,
  .stock-count-history-table > tbody {
    display: block;
    width: 100%;
    min-width: 0 !important;
  }

  .stock-count-history-table > thead {
    display: none;
  }

  .stock-count-history-table > tbody {
    display: grid;
    gap: 8px;
    padding: 8px;
  }

  .stock-count-history-table > tbody > tr.sales-history-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(94px, auto);
    grid-template-areas:
      "date action"
      "count status"
      "diff diff"
      "saved saved";
    gap: 8px 9px;
    padding: 9px;
    border: 1px solid #d7e7e9;
    border-left: 3px solid transparent;
    border-radius: 8px;
    background: #fff;
  }

  .stock-count-history-table > tbody > tr.sales-history-row.selected {
    border-left-color: var(--accent);
    background: #f5fffc;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td {
    display: block;
    width: auto !important;
    min-width: 0;
    padding: 0 !important;
    border: 0;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(1) { grid-area: date; }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(2) { display: grid; grid-area: count; gap: 4px; }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(3) { display: grid; grid-area: status; gap: 4px; }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(4) { grid-area: diff; }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(5) {
    display: flex;
    grid-area: saved;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(6) {
    grid-area: action;
    justify-self: end;
    align-self: start;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(2)::before,
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(3)::before,
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(5)::before {
    color: #607982;
    font-size: 9.5px;
    font-weight: 750;
    line-height: 1;
    text-transform: uppercase;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(2)::before { content: "Counted"; }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(3)::before { content: "Status"; }
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(5)::before { content: "Last saved"; }

  .stock-count-history-table .compact-stats span,
  .stock-count-history-table .dsc-history-status {
    min-height: 42px;
    padding: 6px 7px;
    border: 1px solid #dce9eb;
    border-radius: 7px;
    background: #fbfefe;
  }

  .stock-count-history-table .stock-count-diff-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 7px;
    padding: 7px 8px;
    border: 1px solid #dce9eb;
    border-radius: 7px;
    background: #f8fbfc;
    box-sizing: border-box;
    white-space: normal;
  }

  .stock-count-history-table .sales-history-actions button {
    min-width: 30px;
    min-height: 30px;
    padding: 0;
    border-radius: 7px;
  }

  .stock-count-diff-detail {
    padding: 10px;
  }

  .stock-count-diff-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .stock-count-change-history {
    overflow-x: auto;
  }

  .stock-count-step-table {
    min-width: 620px !important;
  }

  .stock-count-mini-history {
    min-width: 520px !important;
  }
}

@media (max-width: 980px) {
  .dsc-scope-bulk-controls {
    grid-template-columns: minmax(145px, 0.65fr) minmax(220px, 1.35fr);
  }

  .dsc-scope-bulk-controls button {
    min-width: 0;
  }

  .dsc-scope-history-list {
    padding-left: 14px;
  }

  .dsc-scope-history-line {
    grid-template-columns: 110px minmax(210px, 1fr) minmax(160px, 0.8fr) minmax(190px, 1fr);
  }
}

@media (max-width: 640px) {
  .master-dsc-scope-tools {
    padding: 10px;
  }

  .dsc-scope-bulk-controls {
    grid-template-columns: 1fr;
  }

  .dsc-scope-filters {
    width: 100%;
  }

  .dsc-scope-history-list {
    min-width: 680px;
  }
}

@media (max-width: 640px) {
  .staff-quick-suggest-menu {
    max-height: min(46vh, 300px);
    padding: 5px;
  }

  .staff-quick-suggest-option {
    grid-template-columns: 64px minmax(0, 1fr) 32px;
    gap: 6px;
    min-height: 42px;
    padding: 6px 7px;
  }

  .staff-quick-suggest-code {
    min-height: 20px;
    padding: 0 6px;
    font-size: 10.5px;
  }

  .staff-quick-suggest-name {
    display: -webkit-box;
    overflow: hidden;
    font-size: 11.5px;
    line-height: 1.2;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .staff-quick-suggest-uom {
    font-size: 10px;
  }

  .staff-quick-sheet-wrap {
    max-height: 330px;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .staff-quick-sheet table,
  .staff-quick-sheet thead,
  .staff-quick-sheet tbody {
    display: block;
    width: 100%;
  }

  .staff-quick-sheet thead {
    display: none;
  }

  .staff-quick-sheet tbody {
    display: grid;
    gap: 7px;
    padding: 7px;
  }

  .staff-quick-sheet tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(84px, 96px) 34px;
    grid-template-areas:
      "item item action"
      "stock add add";
    gap: 8px;
    padding: 8px;
    border: 1px solid #dce9eb;
    border-radius: 8px;
    background: #fff;
  }

  .staff-quick-sheet td {
    display: block;
    width: auto !important;
    padding: 0 !important;
    border-bottom: 0;
  }

  .staff-quick-sheet td:nth-child(1) {
    grid-area: item;
  }

  .staff-quick-sheet td:nth-child(2) {
    display: grid;
    grid-area: stock;
    gap: 3px;
  }

  .staff-quick-sheet td:nth-child(3) {
    display: none;
  }

  .staff-quick-sheet td:nth-child(4) {
    display: grid;
    grid-area: add;
    gap: 3px;
  }

  .staff-quick-sheet td:nth-child(5) {
    grid-area: action;
    justify-self: end;
    align-self: start;
  }

  .staff-quick-sheet td:nth-child(2)::before,
  .staff-quick-sheet td:nth-child(4)::before {
    color: #607982;
    font-size: 9.5px;
    font-weight: 750;
    line-height: 1;
    text-transform: uppercase;
  }

  .staff-quick-sheet td:nth-child(2)::before {
    content: "Stock";
  }

  .staff-quick-sheet td:nth-child(4)::before {
    content: "Add Qty";
  }

  .staff-quick-sheet .empty-cell {
    grid-column: 1 / -1;
    height: auto;
    padding: 12px 8px !important;
  }

  .staff-summary-item-cell strong {
    font-size: 11.5px;
  }

  .staff-summary-item-top {
    align-items: flex-start;
  }

  .staff-summary-uom-mobile {
    display: inline-flex;
  }

  .staff-summary-item-cell span {
    display: -webkit-box;
    overflow: hidden;
    font-size: 10.5px;
    line-height: 1.25;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .staff-quick-sheet input {
    min-height: 32px;
  }

  .staff-summary-add-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 6px;
    align-items: center;
  }

  .staff-summary-add-button {
    display: inline-flex;
    width: 34px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    color: #087c73;
    border-color: #c8e7e4;
    background: #f4fbfa;
  }

  .staff-summary-add-button:hover,
  .staff-summary-add-button:focus {
    color: #06655e;
    border-color: #8ed4cd;
    background: #e8f8f6;
  }

  .staff-summary-add-button svg {
    width: 15px;
    height: 15px;
  }

  .staff-summary-stock-input,
  .staff-summary-add-input {
    text-align: center;
  }

  .staff-summary-delete {
    width: 30px;
    height: 30px;
    min-height: 30px;
    border-color: #ffd4d4;
    background: #fff;
  }

  .sales-history-list.stock-count-history-list {
    overflow-x: hidden;
  }

  .stock-count-history-table,
  .stock-count-history-table > thead,
  .stock-count-history-table > tbody {
    display: block;
    width: 100%;
    min-width: 0 !important;
  }

  .stock-count-history-table > thead {
    display: none;
  }

  .stock-count-history-table > tbody {
    display: grid;
    gap: 8px;
    padding: 8px;
  }

  .stock-count-history-table > tbody > tr.sales-history-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(94px, auto);
    grid-template-areas:
      "date action"
      "count status"
      "diff diff"
      "saved saved";
    gap: 8px 9px;
    padding: 9px;
    border: 1px solid #d7e7e9;
    border-left: 3px solid transparent;
    border-radius: 8px;
    background: #fff;
  }

  .stock-count-history-table > tbody > tr.sales-history-row.selected {
    border-left-color: var(--accent);
    background: #f5fffc;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td {
    display: block;
    width: auto !important;
    min-width: 0;
    padding: 0 !important;
    border: 0;
    background: transparent !important;
    box-shadow: none !important;
    text-align: left;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(1) {
    grid-area: date;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(2) {
    display: grid;
    grid-area: count;
    gap: 4px;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(3) {
    display: grid;
    grid-area: status;
    gap: 4px;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(4) {
    grid-area: diff;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(5) {
    display: flex;
    grid-area: saved;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 1px !important;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(6) {
    grid-area: action;
    justify-self: end;
    align-self: start;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(2)::before,
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(3)::before,
  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(5)::before {
    color: #607982;
    font-size: 9.5px;
    font-weight: 750;
    line-height: 1;
    text-transform: uppercase;
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(2)::before {
    content: "Counted";
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(3)::before {
    content: "Status";
  }

  .stock-count-history-table > tbody > tr.sales-history-row > td:nth-child(5)::before {
    content: "Last saved";
  }

  .stock-count-history-table .sales-history-date strong {
    color: #0f3f46;
    font-size: 12.5px;
    white-space: nowrap;
  }

  .stock-count-history-table .sales-history-date span {
    font-size: 10.5px;
    white-space: nowrap;
  }

  .stock-count-history-table .compact-stats {
    display: block;
  }

  .stock-count-history-table .compact-stats span,
  .stock-count-history-table .dsc-history-status {
    min-height: 42px;
    padding: 6px 7px;
    border: 1px solid #dce9eb;
    border-radius: 7px;
    background: #fbfefe;
  }

  .stock-count-history-table .compact-stats strong {
    font-size: 12px;
  }

  .stock-count-history-table .compact-stats em,
  .stock-count-history-table .dsc-history-status span {
    font-size: 10px;
  }

  .stock-count-history-table .dsc-history-status strong {
    padding: 0;
    font-size: 11px;
  }

  .stock-count-history-table .stock-count-diff-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 7px;
    padding: 7px 8px;
    border: 1px solid #dce9eb;
    border-radius: 7px;
    background: #f8fbfc;
    box-sizing: border-box;
    white-space: normal;
  }

  .stock-count-history-table .stock-count-diff-status strong {
    min-height: 20px;
    padding: 0 7px;
    font-size: 10.5px;
    white-space: nowrap;
  }

  .stock-count-history-table .sales-history-imported {
    justify-items: end;
    text-align: right;
  }

  .stock-count-history-table .sales-history-imported strong,
  .stock-count-history-table .sales-history-imported span {
    font-size: 10.5px;
  }

  .stock-count-history-table .sales-history-actions {
    justify-content: flex-end;
    width: auto;
    margin-left: auto;
  }

  .stock-count-history-table .sales-history-actions button {
    min-width: 30px;
    min-height: 30px;
    padding: 0;
    border-radius: 7px;
  }

  .stock-count-history-table > tbody > tr.stock-count-diff-row {
    display: block;
    border: 1px solid #d7e7e9;
    border-radius: 8px;
    overflow: hidden;
    background: #fbfefe;
  }

  .stock-count-history-table > tbody > tr.stock-count-diff-row > td {
    display: block;
    width: auto !important;
    padding: 0 !important;
    border: 0;
  }

  .stock-count-diff-detail {
    padding: 10px;
  }

  .stock-count-diff-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .stock-count-change-history {
    overflow-x: auto;
  }

  .stock-count-step-table {
    min-width: 620px !important;
  }

  .stock-count-mini-history {
    min-width: 520px !important;
  }
}