:root {
  color-scheme: light;
  font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  color: #1b2d3c;
  background: #aebdca;
  --menu-bar-height: 28px;
}

html,
body,
#root {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  min-width: 0;
}

body {
  margin: 0;
  background:
    linear-gradient(#dbe8f3 0, #b3c7d8 42px, #8ca6bb 42px, #d7e2ea 100%);
  font-size: 13px;
}

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

/* Preserve the production workspace's compact blue gradient controls. */
button {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid #7c93a8;
  border-radius: 3px;
  color: #1c3344;
  cursor: pointer;
  background: linear-gradient(#ffffff, #d9e6f0 52%, #c4d5e1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  transform: translateY(0) scale(1);
  transition: transform 110ms ease, box-shadow 110ms ease, filter 110ms ease, border-color 130ms ease, background 130ms ease;
}

button:hover {
  border-color: #3d6f9e;
  background: linear-gradient(#ffffff, #e5f3ff 48%, #bed8ec);
}

button.primary {
  border-color: var(--primary-border, #2e6898);
  color: #fff;
  background: linear-gradient(var(--primary-start, #5fa0ce), var(--primary-mid, #2f78ad) 52%, var(--primary-end, #1f5f91));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 2px 0 #174c75, 0 5px 10px rgba(23, 76, 117, 0.18);
  font-weight: 600;
}

button.primary:hover { filter: brightness(1.04); }
button.primary:active {
  transform: translateY(1px) scale(0.99);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), 0 1px 0 #174c75, 0 3px 7px rgba(23, 76, 117, 0.16);
}

button.button-click-feedback {
  animation: ledgerButtonPress 390ms cubic-bezier(.2, .9, .3, 1.08);
}

.button-click-burst {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  border: 1px solid rgba(47, 120, 173, 0.44);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.18);
  box-shadow:
    0 0 0 0 rgba(47, 120, 173, 0.22),
    0 4px 12px rgba(23, 76, 117, 0.16);
  animation: ledgerButtonBurst 390ms ease-out forwards;
}

@keyframes ledgerButtonPress {
  0% {
    transform: translateY(1px) scale(0.99);
  }
  42% {
    transform: translateY(-1px) scale(1.018);
  }
  72% {
    transform: translateY(0) scale(0.997);
  }
  100% {
    transform: translateY(0) scale(1);
  }
}

@keyframes ledgerButtonBurst {
  0% {
    opacity: 0.9;
    transform: translateY(1px) scale(0.985);
    box-shadow:
      0 0 0 0 rgba(47, 120, 173, 0.24),
      0 3px 8px rgba(23, 76, 117, 0.14);
  }
  55% {
    opacity: 0.55;
    transform: translateY(-1px) scale(1.025);
    box-shadow:
      0 0 0 5px rgba(47, 120, 173, 0.12),
      0 5px 14px rgba(23, 76, 117, 0.14);
  }
  100% {
    opacity: 0;
    transform: translateY(0) scale(1.045);
    box-shadow:
      0 0 0 12px rgba(47, 120, 173, 0),
      0 5px 14px rgba(23, 76, 117, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  button {
    transition-duration: 1ms;
  }

  button.button-click-feedback,
  .button-click-burst {
    animation-duration: 1ms;
  }
}

button:disabled,
button[disabled] {
  cursor: not-allowed;
  filter: grayscale(0.22) opacity(0.72);
  transform: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

button.subtle {
  color: #25445a;
  border-color: #9db1c1;
  background: linear-gradient(#ffffff, #eef4f8);
  box-shadow: none;
}

button.subtle.active {
  border-color: #467aa2;
  background: linear-gradient(#eff8ff, #cfe4f4);
  font-weight: 600;
}

button.small {
  min-height: 24px;
  padding: 0 8px;
  font-size: 12px;
}

a.action-link.small {
  min-height: 24px;
  padding: 0 8px;
  display: inline-flex;
  align-items: center;
  border: 1px solid #7c93a8;
  border-radius: 3px;
  color: #1c3344;
  text-decoration: none;
  background: linear-gradient(#ffffff, #d9e6f0 52%, #c4d5e1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  font-size: 12px;
}

a.action-link.small:hover {
  border-color: #3d6f9e;
  background: linear-gradient(#ffffff, #e5f3ff 48%, #bed8ec);
}

button.tiny {
  min-height: 18px;
  padding: 0 5px;
  font-size: 11px;
  line-height: 1;
}

button.danger {
  border-color: #9b6464;
  color: #6c1e1e;
  background: linear-gradient(#fff, #ead7d7);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 2px 0 #8c4f4f,
    0 5px 10px rgba(108, 30, 30, 0.12);
}

button.danger:active {
  transform: translateY(1px) scale(0.99);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.35),
    0 1px 0 #8c4f4f,
    0 3px 7px rgba(108, 30, 30, 0.12);
}

input,
select,
textarea {
  width: 100%;
  min-height: 28px;
  padding: 0 7px;
  border: 1px solid #8fa4b5;
  border-radius: 2px;
  color: #1b2d3c;
  background: linear-gradient(#ffffff, #f6fbff);
  box-shadow: inset 0 1px 2px rgba(41, 70, 92, 0.12);
}

textarea {
  min-height: 58px;
  padding: 7px;
  resize: vertical;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  font-size: 19px;
  font-weight: 600;
}

h2 {
  font-size: 18px;
  font-weight: 600;
  padding: 8px 12px;
  color: #102f46;
  border: 1px solid #8ea8bd;
  border-radius: 3px 3px 0 0;
  background: linear-gradient(#f7fbff, #cfe0ee 48%, #a9c4d9 49%, #dbe9f4);
}

h3 {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 8px;
  color: #26465d;
}

.app-frame {
  min-height: 100vh;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  padding-top: var(--menu-bar-height);
}

.classic-menu {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  height: var(--menu-bar-height);
  min-height: var(--menu-bar-height);
  display: flex;
  align-items: center;
  gap: 2px;
  overflow: visible;
  min-width: 0;
  padding: 0 8px;
  border-bottom: 1px solid #6b849a;
  background: linear-gradient(#f7fbff, #c4d8e9);
  box-shadow: inset 0 1px 0 #fff;
}

.menu-slot {
  position: relative;
  flex: 0 0 auto;
}

.classic-menu button {
  min-height: 22px;
  padding: 0 9px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.classic-menu button:hover {
  border-color: #7ca3c3;
  background: linear-gradient(#fff, #d7ebfb);
}

.classic-menu button.menu-open {
  border-color: #6f97b8;
  background: linear-gradient(#eaf6ff, #c2dcec);
}

.classic-menu .home-top-button {
  margin-right: 6px;
  border-color: #6f97b8;
  color: #123650;
  font-weight: 700;
  background: linear-gradient(#ffffff, #e3f0fa);
}

.classic-menu .home-top-button.active {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.classic-menu button.mode-toggle {
  margin-right: 5px;
  border-color: #9c8a51;
  color: #2f432d;
  font-weight: 700;
  background: linear-gradient(#fffdf7, #efe1b5);
}

.classic-menu button.mode-toggle.active {
  border-color: #43745a;
  color: #fff;
  background: linear-gradient(#5f9b78, #356d53);
}

.top-utility-slot {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 1 auto;
  min-width: 0;
}

.top-account-slot {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-left: 4px;
  flex: 0 0 auto;
  min-width: 0;
}

.classic-menu button.account-top-button {
  width: 25px;
  min-width: 25px;
  min-height: 23px;
  padding: 0;
  display: grid;
  place-items: center;
  border-color: #7ca3c3;
  border-radius: 50%;
  background: linear-gradient(#ffffff, #e5f3ff 48%, #c2d9eb);
}

.classic-menu button.account-top-button.active {
  border-color: #2e6898;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.classic-menu button.settings-top-button {
  width: 25px;
  min-width: 25px;
  min-height: 23px;
  padding: 0;
  display: grid;
  place-items: center;
  border-color: #7ca3c3;
  border-radius: 3px;
  color: #25475d;
  background: linear-gradient(#ffffff, #e5f3ff 48%, #c2d9eb);
  font-size: 15px;
  line-height: 1;
}

.classic-menu button.settings-top-button.active {
  border-color: #2e6898;
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.account-outline-icon {
  position: relative;
  width: 14px;
  height: 15px;
  display: block;
}

.account-outline-icon::before,
.account-outline-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  border: 1.5px solid #24485f;
}

.account-outline-icon::before {
  top: 1px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: transparent;
}

.account-outline-icon::after {
  bottom: 1px;
  width: 12px;
  height: 6px;
  border-radius: 8px 8px 2px 2px;
  border-bottom: 0;
}

.account-top-button.active .account-outline-icon::before,
.account-top-button.active .account-outline-icon::after {
  border-color: #fff;
}

.account-profile-icon {
  display: block;
  font-size: 14px;
  line-height: 1;
}

.menu-popover {
  position: absolute;
  top: 24px;
  left: 0;
  z-index: 1001;
  min-width: 188px;
  max-height: min(440px, calc(100vh - 50px));
  overflow-y: auto;
  padding: 3px;
  border: 1px solid #6f879b;
  background: #f8fbfe;
  box-shadow: 2px 4px 10px rgba(33, 56, 74, 0.22);
}

.menu-popover button {
  display: block;
  width: 100%;
  min-height: 25px;
  padding: 0 18px 0 8px;
  border: 0;
  border-radius: 0;
  color: #1b3448;
  text-align: left;
  background: transparent;
}

.menu-popover button:hover:not(:disabled) {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.menu-popover .menu-more-button {
  margin-top: 3px;
  border-top: 1px solid #d0dce6;
  color: #245a80;
  font-weight: 700;
}

.menu-popover button:disabled {
  color: #8ca0ae;
  cursor: default;
}

.mode-segment {
  display: inline-flex;
  align-items: center;
  gap: 0;
  min-height: 24px;
  border: 1px solid #7ca3c3;
  border-radius: 4px;
  overflow: hidden;
  background: #eef6fb;
}

.classic-menu .mode-segment button {
  min-width: 58px;
  min-height: 24px;
  margin: 0;
  border: 0;
  border-right: 1px solid #a7bfd0;
  border-radius: 0;
  background: transparent;
}

.classic-menu .mode-segment button:last-child {
  border-right: 0;
}

.classic-menu .mode-segment button.active {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
  font-weight: 700;
}

.global-search-box {
  position: relative;
  width: clamp(150px, 22vw, 260px);
  max-width: 260px;
  min-width: 150px;
  flex: 0 1 clamp(150px, 22vw, 260px);
}

.global-search-box input {
  width: 100%;
  min-height: 22px;
  padding: 0 8px;
  border-color: #8ca7bc;
  border-radius: 4px;
  background: #fff;
}

.global-search-popover,
.utility-popover {
  position: absolute;
  top: 25px;
  left: auto;
  right: 0;
  z-index: 1002;
  width: 320px;
  max-height: min(440px, calc(100vh - 50px));
  overflow-y: auto;
  padding: 4px;
  border: 1px solid #6f879b;
  background: #f8fbfe;
  box-shadow: 2px 4px 14px rgba(33, 56, 74, 0.26);
}

.global-search-popover button,
.utility-popover button {
  display: grid;
  gap: 2px;
  width: 100%;
  min-height: 38px;
  padding: 5px 8px;
  border: 0;
  border-radius: 0;
  text-align: left;
  background: transparent;
}

.global-search-popover button:hover,
.utility-popover button:hover {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.global-search-popover button span,
.utility-popover button span {
  color: #5d7282;
  font-size: 11px;
}

.global-search-popover button:hover span,
.utility-popover button:hover span {
  color: #e9f4fb;
}

.utility-menu {
  position: relative;
  flex: 0 0 auto;
}

.classic-menu button.admin-alert-button {
  position: relative;
  display: grid;
  place-items: center;
  width: 40px;
  min-width: 40px;
  min-height: 23px;
  padding: 0;
  overflow: hidden;
  border-color: #7ca3c3;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #e5f3ff);
}

.classic-menu button.inbox-button {
  grid-auto-flow: column;
  gap: 5px;
  width: auto;
  min-width: 68px;
  padding: 0 7px;
  overflow: visible;
}

.classic-menu button.inbox-button span:first-child {
  line-height: 1;
}

.inbox-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 17px;
  height: 17px;
  padding: 0 5px;
  border-radius: 999px;
  color: #fff;
  background: #b42318;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 1px 2px rgba(22, 34, 46, 0.2);
}

.classic-menu button.admin-alert-button.active {
  border-color: #b17b32;
  color: #4f2500;
  background: linear-gradient(#fff7df, #efd092);
  font-weight: 700;
}

.alert-bell {
  display: block;
  line-height: 1;
  font-size: 14px;
}

.alert-badge {
  position: absolute;
  top: 1px;
  right: 2px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border: 1px solid #fff;
  border-radius: 999px;
  color: #fff;
  background: #b42318;
  box-shadow: 0 1px 2px rgba(22, 34, 46, 0.25);
  font-size: 10px;
  line-height: 14px;
  text-align: center;
}

.popover-title {
  padding: 6px 8px;
  font-weight: 700;
  color: #24475f;
  border-bottom: 1px solid #c3d4e0;
}

.popover-empty {
  padding: 10px;
  color: #607789;
  font-size: 12px;
}

.app-shell {
  --sidebar-width: 272px;
  min-height: 0;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  display: grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  align-items: start;
}

.app-frame.pos-focus-mode,
.app-frame.pos-only-role {
  min-height: 100vh;
  background: #edf2f6;
}

.pos-session-bar {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1100;
  display: flex;
  align-items: center;
  padding: 5px;
  border: 1px solid #7798b4;
  border-radius: 4px;
  background: rgba(239, 247, 252, 0.96);
  box-shadow: 0 3px 14px rgba(28, 57, 78, 0.16);
}

.pos-session-bar button {
  min-height: 30px;
  min-width: 72px;
  font-weight: 700;
}

.app-frame.pos-focus-mode .classic-menu,
.app-frame.pos-focus-mode .sidebar,
.app-frame.pos-focus-mode .topbar,
.app-frame.pos-only-role .classic-menu,
.app-frame.pos-only-role .sidebar,
.app-frame.pos-only-role .topbar {
  display: none;
}

.app-frame.pos-focus-mode .app-shell,
.app-frame.pos-only-role .app-shell {
  min-height: 100vh;
  grid-template-columns: minmax(0, 1fr);
}

.app-frame.pos-focus-mode main,
.app-frame.pos-only-role main {
  min-height: 100vh;
  padding: 48px 8px 8px;
}

.sidebar {
  height: calc(100vh - 28px);
  position: sticky;
  top: 28px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  scrollbar-gutter: stable;
  color: #21384a;
  padding: 10px;
  border-right: 1px solid #638aa6;
  background: linear-gradient(#f9fcff, #cfe3f1 52%, #adcadd);
}

.company-pane {
  border: 1px solid #83a9c1;
  border-radius: 6px;
  padding: 12px 10px;
  margin-bottom: 10px;
  background: linear-gradient(#ffffff, #e9f4fb);
  box-shadow: 0 1px 5px rgba(37, 72, 98, 0.18), inset 0 1px 0 #fff;
  text-align: center;
}

.company-logo,
.company-logo-mark {
  display: grid;
  width: 54px;
  height: 45px;
  margin: 0 auto 5px;
  place-items: center;
}

.company-logo {
  display: block;
  width: 46px;
  height: 42px;
  object-fit: contain;
}

.company-logo.active-company-logo {
  width: min(132px, 100%);
  height: 48px;
  margin-bottom: 7px;
  object-fit: contain;
}

.company-logo-mark.active-company-logo-mark {
  width: min(132px, 100%);
  height: 48px;
  margin: 0 auto 7px;
  border-radius: 5px;
  color: #153a54;
  font-size: 18px;
  letter-spacing: 0;
}

.company-logo-mark {
  border: 1px solid #93b7d2;
  border-radius: 6px;
  color: #1d5f8f;
  background: linear-gradient(#ffffff, #d9eefb);
  box-shadow: inset 0 1px 0 #fff;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0;
}

.company-pane strong,
.company-pane span {
  display: block;
}

.company-pane span {
  margin-top: 2px;
  color: #607789;
  font-size: 12px;
}

.company-pane .active-company-logo + strong,
.company-pane .active-company-logo-mark + strong {
  color: #153a54;
  font-size: 13px;
}

nav {
  flex: 0 0 auto;
  overflow: visible;
  display: grid;
  align-content: start;
  gap: 7px;
}

.nav-group {
  overflow: hidden;
  border: 1px solid #85a9c0;
  border-radius: 6px;
  background: #ffffff;
  box-shadow: 0 1px 5px rgba(37, 72, 98, 0.16);
}

.nav-group-items {
  display: grid;
  max-height: 740px;
  overflow: hidden;
  opacity: 1;
  transform: translateY(0);
  transition: max-height 180ms ease, opacity 140ms ease, transform 160ms ease;
}

.nav-group.collapsed .nav-group-items {
  max-height: 0;
  opacity: 0;
  transform: translateY(-3px);
  pointer-events: none;
}

.nav-group.open .nav-group-items {
  border-top: 1px solid #d8e6f0;
}

.nav-heading {
  padding: 6px 9px;
  color: #24475f;
  font-size: 12px;
  font-weight: 700;
  background: linear-gradient(#ffffff, #e4f0f8);
  border-bottom: 1px solid #b7cfdf;
}

.nav-heading-button {
  justify-content: space-between;
  gap: 6px;
  min-height: 32px;
  border: 0;
  border-radius: 0;
  color: #24475f;
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease;
}

.nav-heading-button:hover {
  background: linear-gradient(#ffffff, #d7eafa);
}

.nav-chevron {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border: 1px solid #94b8d0;
  border-radius: 4px;
  color: #3e6a8a;
  background: #ffffff;
  font-size: 11px;
}

.nav-group.collapsed {
  background: #ffffff;
}

.nav-group.collapsed:hover .nav-heading-button,
.nav-group.collapsed:focus-within .nav-heading-button {
  background: linear-gradient(#ffffff, #dceefa);
}

.nav-group.collapsed .nav-heading {
  border-bottom: 0;
}

.nav-group.open .nav-heading {
  border-bottom: 0;
}

nav button {
  justify-content: flex-start;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 28px;
  padding: 5px 10px;
  border: 0;
  border-radius: 4px;
  color: #1b3448;
  background: transparent;
  box-shadow: none;
  text-align: left;
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
}

.nav-mini-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid #97bbd3;
  border-radius: 5px;
  color: #245a80;
  background: linear-gradient(#ffffff, #deeff9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  font-size: 12px;
  line-height: 1;
}

.nav-label {
  min-width: 0;
}

.nav-heading-label {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
}

.nav-group-icon {
  width: 18px;
  height: 18px;
  border-color: #c2d7e6;
  font-size: 11px;
}

.shortcut-drop .nav-group-icon {
  position: relative;
  border-color: #d5b64a;
  color: #775700;
  background: linear-gradient(#fffbe6, #f2d46b);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(119, 87, 0, 0.18);
  font-size: 0;
}

.shortcut-drop .nav-group-icon::before {
  content: "★";
  color: #7a5a00;
  font-family: "Segoe UI Symbol", Arial, sans-serif;
  font-size: 13px;
  line-height: 1;
}

.sidebar nav .nav-heading-button {
  justify-content: space-between;
  min-height: 32px;
  padding: 6px 9px;
  color: #24475f;
  font-weight: 700;
  background: linear-gradient(#ffffff, #e4f0f8);
}

.nav-group.open .nav-heading-button {
  background: linear-gradient(#ffffff, #d8eafa);
}

nav button.active {
  color: #fff;
  background: linear-gradient(#4d95cd, #2f75a7);
  box-shadow: inset 3px 0 0 #d8efff;
  font-weight: 700;
}

nav button.active .nav-mini-icon {
  border-color: rgba(255, 255, 255, 0.76);
  color: #1f6d9f;
  background: #ffffff;
  box-shadow: 0 1px 4px rgba(28, 70, 108, 0.18);
}

nav button:hover:not(.active) {
  background: #e3f1fa;
}

.shortcut-drop {
  min-height: 70px;
}

.simple-mode .shortcut-drop {
  min-height: 0;
}

.simple-primary-nav {
  display: grid;
  gap: 6px;
  margin: 2px 0 4px;
}

.simple-primary-nav button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #85a9c0;
  border-radius: 6px;
  color: #1b3448;
  background: linear-gradient(#ffffff, #e8f4fb);
  box-shadow: 0 1px 5px rgba(37, 72, 98, 0.16);
  font-weight: 700;
}

.simple-primary-nav button:hover:not(.active) {
  background: linear-gradient(#ffffff, #dceefa);
}

.simple-primary-nav button.active {
  color: #fff;
  border-color: #2f75a7;
  background: linear-gradient(#4d95cd, #2f75a7);
}

.shortcut-drop.collapsed {
  min-height: 0;
}

.shortcut-drop.open .nav-heading-button,
.shortcut-drop.open .nav-heading-button:disabled {
  color: #123650;
  opacity: 1;
  cursor: default;
  background: linear-gradient(#f8fcff, #e1edf6);
}

.shortcut-drop.empty {
  border-style: dashed;
}

@media (prefers-reduced-motion: reduce) {
  .nav-group-items {
    transition: none;
  }
}

.shortcut-empty {
  padding: 6px 8px 7px;
  color: #607789;
  font-size: 12px;
  line-height: 1.2;
  background: #fff;
}

.shortcut-context-menu {
  position: fixed;
  z-index: 60;
  width: 202px;
  padding: 4px;
  border: 1px solid #657f95;
  background: #f8fbfe;
  box-shadow: 2px 5px 14px rgba(31, 54, 72, 0.26);
}

.shortcut-context-menu .context-title {
  padding: 6px 8px;
  color: #23445e;
  font-size: 12px;
  font-weight: 700;
  border-bottom: 1px solid #c3d4e0;
  background: linear-gradient(#fff, #e1edf6);
}

.shortcut-context-menu button {
  display: block;
  width: 100%;
  min-height: 27px;
  padding: 0 8px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.shortcut-context-menu button:hover {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

main {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  padding: 12px;
  background: #eaf1f6;
}

main > *,
section,
.topbar,
.compact-panel,
.item-form,
.invoice-form,
.invoice-tax-panel,
.journal-form,
.tax-form,
.table-wrap,
.metrics,
.report-grid,
.workspace-grid,
.form-grid,
.toolbar-form {
  min-width: 0;
  max-width: 100%;
}

.topbar {
  min-height: 54px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  margin-bottom: 10px;
  border: 1px solid #7392aa;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #d8e8f4 52%, #bad2e4);
  box-shadow: 0 1px 2px rgba(32, 64, 88, 0.14), inset 0 1px 0 #fff;
}

.workspace-topbar {
  align-items: stretch;
  padding: 7px 10px;
  border-color: #6f8fa7;
  background: linear-gradient(#ffffff, #d4e6f3 48%, #b6d0e3);
}

.topbar-title-wrap {
  min-width: 0;
  display: flex;
  gap: 10px;
  align-items: center;
}

.navigation-controls {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}

.navigation-controls button {
  min-height: 28px;
  border-color: #8ea8bc;
  background: linear-gradient(#ffffff, #e4eef6);
}

.nav-history-button {
  width: 30px;
  min-width: 30px;
  padding: 0;
  font-weight: 800;
}

.return-button {
  max-width: 210px;
  padding-inline: 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-commandbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: stretch;
  gap: 4px;
  padding-left: 12px;
  border-left: 1px solid #9bb2c4;
}

.topbar-company-badge {
  flex: 0 1 210px;
  min-width: 120px;
  max-width: 240px;
  min-height: 36px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid #95acbd;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.topbar-company-badge img {
  width: 54px;
  height: 28px;
  object-fit: contain;
  object-position: left center;
}

.topbar-company-badge strong {
  overflow: hidden;
  color: #1d4058;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-company-initial {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid #93b7d2;
  border-radius: 3px;
  color: #1d5f8f;
  background: linear-gradient(#ffffff, #d9eefb);
  font-weight: 800;
}

.ribbon-group {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 2px;
  min-height: 54px;
  padding: 3px 8px 15px;
  border-right: 1px solid #9bb2c4;
  background: linear-gradient(#f9fcff, #dcebf6);
}

.ribbon-group:last-child {
  border-right: 0;
}

.ribbon-group-label {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1px;
  color: #536b7e;
  font-size: 10px;
  text-align: center;
}

.ribbon-button {
  display: grid;
  grid-template-columns: 32px minmax(44px, auto);
  gap: 6px;
  align-items: center;
  min-width: 92px;
  min-height: 42px;
  padding: 3px 7px;
  border-color: transparent;
  border-radius: 2px;
  background: transparent;
  box-shadow: none;
}

.ribbon-icon {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  color: #fff;
  border: 1px solid #2f6e9f;
  border-radius: 3px;
  background: linear-gradient(#6fa8cf, #2f78ad);
  font-size: 9px;
  font-weight: 700;
}

.ribbon-text {
  display: grid;
  line-height: 1.1;
  text-align: left;
}

.ribbon-text strong {
  font-size: 12px;
}

.ribbon-text small {
  color: #526b7f;
  font-size: 10px;
}

.workspace-local-actions {
  margin-bottom: 8px;
}

.hidden-file-input {
  display: none;
}

.link-button {
  min-height: 22px;
  padding: 1px 4px;
  border: 0;
  color: #1f5f91;
  background: transparent;
  box-shadow: none;
  font-weight: 600;
  text-decoration: underline;
}

.link-button:hover,
.link-button.selected {
  color: #fff;
  background: #2f78ad;
  text-decoration: none;
}

.eyebrow {
  display: block;
  color: #587084;
  font-size: 11px;
  margin-bottom: 2px;
}

.session-box {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #455e71;
}

.profile-dock {
  flex: 0 0 auto;
  margin-top: 8px;
  border: 1px solid #7f9ab0;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #d8e8f5);
  box-shadow: inset 0 1px 0 #fff;
}

.profile-dock button {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 8px;
  width: 100%;
  min-height: 46px;
  padding: 7px;
  border: 0;
  border-radius: 0;
  text-align: left;
  background: transparent;
  box-shadow: none;
}

.muted {
  color: #6f8292;
  font-size: 12px;
}

.inventory-worker-start {
  display: grid;
  grid-template-columns: minmax(220px, 0.62fr) minmax(0, 1.38fr);
  gap: 10px;
  align-items: stretch;
  margin-bottom: 10px;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: linear-gradient(#fbfdff, #eef6fb);
  box-shadow: inset 0 1px 0 #fff;
}

.inventory-worker-copy {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
}

.inventory-worker-copy strong {
  color: #12324a;
  font-size: 14px;
}

.inventory-worker-copy p {
  margin: 0;
  line-height: 1.32;
}

.inventory-worker-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 8px;
  min-width: 0;
}

.inventory-worker-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 8px;
  align-content: start;
  min-height: 86px;
  padding: 10px;
  border: 1px solid #a8bdcc;
  text-align: left;
  color: #12324a;
  background: linear-gradient(#ffffff, #ecf5fb);
  box-shadow: inset 0 1px 0 #fff;
  cursor: pointer;
}

.inventory-worker-action:hover,
.inventory-worker-action.active {
  border-color: #2775aa;
  background: linear-gradient(#ffffff, #d9ebf8);
}

.inventory-worker-action span {
  grid-column: 1 / -1;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
}

.inventory-worker-action small {
  color: #607486;
  font-size: 11px;
  line-height: 1.22;
}

.inventory-worker-action b {
  align-self: end;
  justify-self: end;
  padding: 2px 6px;
  border: 1px solid #bdd0dd;
  background: #fff;
  color: #24455e;
  font-size: 11px;
  white-space: nowrap;
}

.pos-inventory-sync {
  display: grid;
  gap: 4px;
  padding: 9px;
  border: 1px solid #9eb8ca;
  background: linear-gradient(#f8fbfe, #e6f1f8);
  color: #12324a;
  box-shadow: inset 0 1px 0 #fff;
}

.pos-inventory-sync strong {
  font-size: 13px;
}

.pos-inventory-sync span,
.pos-inventory-sync small {
  color: #607486;
  font-size: 11px;
  line-height: 1.28;
}

.inventory-task-layout {
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.inventory-task-rail {
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: linear-gradient(#f8fbfe, #e8f2f8);
  box-shadow: inset 0 1px 0 #fff;
}

.inventory-task-rail-header {
  display: grid;
  gap: 3px;
  padding: 7px 8px 9px;
  border-bottom: 1px solid #b9cad6;
}

.inventory-task-rail-header strong {
  color: #12324a;
  font-size: 12px;
  text-transform: uppercase;
}

.inventory-task-rail-header small {
  color: #607486;
  font-size: 11px;
}

.inventory-task-group {
  display: grid;
  gap: 4px;
  padding: 6px 0;
}

.inventory-task-group h3 {
  margin: 0 0 2px;
  padding: 0 8px;
  color: #12324a;
  font-size: 12px;
  text-transform: uppercase;
}

.inventory-task-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  align-items: center;
  min-height: 52px;
  padding: 8px 9px;
  border: 1px solid transparent;
  border-left: 3px solid transparent;
  text-align: left;
  color: #12324a;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
}

.inventory-task-link:hover,
.inventory-task-link.active {
  border-color: #9eb8ca;
  border-left-color: #2874a8;
  background: linear-gradient(#ffffff, #dcebf6);
  box-shadow: inset 0 1px 0 #fff;
}

.inventory-task-link.active {
  color: #06253b;
}

.inventory-task-link span {
  grid-column: 1;
  font-size: 13px;
  font-weight: 800;
}

.inventory-task-link small {
  grid-column: 1;
  color: #607486;
  font-size: 11px;
  line-height: 1.22;
}

.inventory-task-link b {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  padding: 2px 6px;
  border: 1px solid #b8ccd9;
  background: #fff;
  color: #24455e;
  font-size: 11px;
  white-space: nowrap;
}

.inventory-task-main {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.inventory-task-heading {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: linear-gradient(#fbfdff, #eef5fa);
  box-shadow: inset 0 1px 0 #fff;
}

.inventory-task-heading h3 {
  margin: 1px 0 2px;
  color: #12324a;
  font-size: 18px;
}

.inventory-task-heading > div:first-child > span {
  color: #607486;
  font-size: 11px;
  text-transform: uppercase;
}

.inventory-task-stats {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.inventory-task-stats span {
  display: grid;
  min-width: 78px;
  padding: 6px 8px;
  border: 1px solid #bdd0dd;
  background: #fff;
  color: #607486;
  font-size: 11px;
}

.inventory-task-stats strong {
  color: #12324a;
  font-size: 16px;
}

.inventory-work-panel {
  min-width: 0;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: #fff;
  box-shadow: inset 0 1px 0 #fff;
}

.inventory-item-form {
  grid-template-columns: repeat(3, minmax(130px, 1fr));
}

.receive-batch-form {
  margin: 0;
}

.inventory-import-panel {
  display: grid;
  gap: 12px;
  align-items: center;
  grid-template-columns: minmax(240px, 1fr) auto;
}

.inventory-import-panel h3 {
  margin: 0 0 3px;
}

.inventory-import-actions {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.inventory-import-result {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #a9bfce;
  border-radius: 4px;
  background: #f8fbfe;
}

.inventory-import-result.ok {
  border-color: #86ad8c;
  background: #f4fbf5;
}

.inventory-import-result.has-errors {
  border-color: #c4a36c;
  background: #fffaf0;
}

.inventory-import-result h4 {
  margin: 0;
  color: #17374e;
  font-size: 15px;
}

.inventory-import-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(90px, 1fr));
  gap: 7px;
}

.inventory-import-summary div {
  display: grid;
  gap: 3px;
  padding: 7px 8px;
  border: 1px solid #c3d2dd;
  background: #fff;
}

.inventory-import-summary span {
  color: #5f7383;
  font-size: 11px;
}

.inventory-import-summary strong {
  color: #17374e;
  font-size: 16px;
}

.inventory-import-fixes {
  display: grid;
  gap: 7px;
}

.inventory-import-fix-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 4px 8px;
  padding: 7px 8px;
  border: 1px solid #d6c092;
  background: #fffdf8;
}

.inventory-import-fix-row span {
  grid-row: span 2;
  color: #7a5418;
  font-size: 12px;
  font-weight: 800;
}

.inventory-import-fix-row p,
.inventory-import-fix-row em {
  margin: 0;
}

.inventory-import-fix-row em {
  color: #5e6f7d;
  font-style: normal;
  font-size: 12px;
}

.inventory-list-toolbar {
  margin-bottom: 10px;
}

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

.receive-batch-meta {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(150px, 0.85fr) 130px minmax(220px, 1.25fr);
  gap: 6px;
  align-items: center;
}

.receive-batch-meta input {
  min-width: 0;
}

.receive-lines {
  display: grid;
  gap: 6px;
}

.inventory-receive-line {
  display: grid;
  grid-template-columns: 28px minmax(110px, 0.9fr) minmax(170px, 1.25fr) minmax(92px, 0.7fr) minmax(70px, 0.45fr) minmax(76px, 0.45fr) minmax(78px, 0.5fr) minmax(68px, auto);
  gap: 6px;
  align-items: center;
  padding: 6px;
  border: 1px solid #bfd0dc;
  background: #fff;
}

.inventory-receive-line input,
.inventory-receive-line select {
  min-width: 0;
}

.inventory-adjust-panel {
  display: grid;
  gap: 10px;
}

.inventory-adjust-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.5fr) minmax(140px, 0.7fr) minmax(100px, 0.45fr) minmax(180px, 0.9fr) minmax(130px, 0.55fr);
  gap: 8px;
  align-items: end;
}

.inventory-adjust-grid label {
  min-width: 0;
}

.inventory-adjust-grid .wide {
  grid-column: 1 / -1;
}

.receive-line-placeholder {
  min-height: 28px;
  padding: 6px 8px;
  border: 1px solid #c6d3dc;
  color: #5c7282;
  background: #f6f9fb;
  font-size: 12px;
}

.receive-line-number {
  color: #46677d;
  font-weight: 700;
  text-align: center;
}

.receive-batch-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.receive-batch-actions button {
  min-height: 30px;
}

.receive-create-panel {
  margin: 0;
}

.receive-create-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 6px;
  align-items: center;
  margin-top: 8px;
}

.receive-create-grid input {
  min-width: 0;
}

.inventory-sort-filter {
  grid-template-columns: auto minmax(160px, 220px);
}

.profile-dock button.active {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.profile-dock strong,
.profile-dock small {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.profile-dock small {
  color: #5f7282;
  font-size: 11px;
}

.profile-dock button.active small {
  color: #dceaf5;
}

.profile-avatar {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid #7f9ab0;
  border-radius: 3px;
  color: #19364b;
  background: linear-gradient(#fffbe7, #d6b25e);
  font-size: 12px;
  font-weight: 800;
}

section {
  display: grid;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
}

.dashboard-heading {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.dashboard-heading h2 {
  margin: 0;
}

.dashboard-company-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-left: auto;
  padding: 5px 7px;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #edf5fb);
}

.dashboard-company-label {
  color: #24475f;
  font-size: 12px;
  font-weight: 700;
}

.dashboard-company-controls select {
  flex: 1 1 220px;
  width: clamp(190px, 24vw, 320px);
  min-width: 160px;
  min-height: 24px;
  border-color: #7ca3c3;
  border-radius: 3px;
  background: #fff;
  color: #173449;
}

.dashboard-company-controls .add-company-button {
  flex: 0 0 auto;
  min-height: 24px;
  padding: 0 10px;
  border-color: #6f97b8;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #e5f3ff);
  font-weight: 700;
  white-space: nowrap;
}

.period-toggle {
  display: flex;
  gap: 4px;
  padding: 3px;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: #e8f0f6;
}

.period-toggle button {
  min-width: 64px;
}

.period-toggle button.active {
  color: #fff;
  border-color: #1b5f91;
  background: linear-gradient(#3d91c6, #1d6498);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.home-dashboard {
  display: grid;
  grid-template-columns: minmax(260px, 0.7fr) minmax(420px, 1.3fr);
  gap: 10px;
}

.home-hero-panel,
.chart-panel {
  border: 1px solid #86a6bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f0f7fc);
  box-shadow: 0 1px 2px rgba(40, 72, 96, 0.1), inset 0 1px 0 #fff;
}

.home-hero-panel {
  display: grid;
  align-content: space-between;
  gap: 14px;
  padding: 13px;
}

.home-hero-panel strong {
  display: block;
  color: #123650;
  font-size: 28px;
  line-height: 1.1;
}

.home-hero-panel small {
  color: #607789;
}

.profit-badge {
  display: grid;
  gap: 3px;
  width: max-content;
  min-width: 150px;
  padding: 9px;
  border: 1px solid #9eb4c5;
  background: #fff;
}

.profit-badge.good {
  border-left: 4px solid #39815c;
}

.profit-badge.bad {
  border-left: 4px solid #b55343;
}

.dashboard-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 10px;
}

.office-attention {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #86a6bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f0f7fc);
}

.attention-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.attention-card {
  min-height: 94px;
  padding: 9px;
  display: grid;
  gap: 3px;
  align-content: start;
  text-align: left;
  border-color: #83a4ba;
  background: linear-gradient(#ffffff, #e7f2fa);
}

.attention-card strong {
  color: #103953;
  font-size: 24px;
  line-height: 1;
}

.attention-card em {
  color: #315d78;
  font-style: normal;
  font-weight: 700;
}

.attention-card small {
  min-height: 28px;
  color: #5f7586;
  line-height: 1.2;
}

.chart-panel {
  min-width: 0;
  padding: 10px;
}

.chart-panel.wide {
  grid-column: 1 / -1;
}

.donut-layout {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.donut-chart {
  width: 126px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid #91aabd;
  box-shadow: inset 0 1px 2px rgba(24, 50, 70, 0.18);
}

.donut-chart::before {
  content: "";
  position: absolute;
}

.donut-chart span {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  color: #17374e;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  padding: 4px;
  box-shadow: 0 0 0 1px #c5d3de;
}

.chart-legend {
  display: grid;
  gap: 6px;
}

.chart-legend div,
.home-bar-row {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
}

.chart-legend i {
  width: 10px;
  height: 10px;
  border: 1px solid rgba(28, 51, 68, 0.25);
}

.chart-legend span,
.home-bar-row span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chart-legend strong,
.home-bar-row strong {
  font-size: 12px;
}

.home-bar-list {
  display: grid;
  gap: 8px;
}

.home-bar-row {
  grid-template-columns: 120px minmax(0, 1fr) 90px;
}

.home-bar-track {
  height: 13px;
  border: 1px solid #a7bac8;
  background: #edf3f7;
}

.home-bar-track i {
  display: block;
  height: 100%;
}

.dashboard-metrics {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.simple-mode main {
  background: #f5f7f6;
}

.simple-mode .sidebar {
  color: #21384a;
  border-right-color: #638aa6;
  background: linear-gradient(#f9fcff, #cfe3f1 52%, #adcadd);
}

.simple-mode .company-pane,
.simple-mode .nav-group,
.simple-task-panel,
.simple-hero,
.simple-empty {
  border: 1px solid #85a9c0;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 5px rgba(37, 72, 98, 0.16);
}

.simple-mode .nav-heading {
  padding: 7px 10px;
  color: #24475f;
  background: linear-gradient(#ffffff, #e4f0f8);
  border-bottom-color: #b7cfdf;
  font-size: 12px;
  letter-spacing: 0;
}

.simple-mode nav {
  gap: 6px;
}

.simple-mode nav button {
  min-height: 36px;
  padding: 7px 10px;
  color: #1b3448;
  font-size: 13px;
}

.simple-mode .simple-primary-nav button {
  gap: 8px;
}

.simple-mode .sidebar nav .nav-heading-button {
  min-height: 34px;
  padding: 6px 10px;
  color: #24475f;
  background: linear-gradient(#ffffff, #e4f0f8);
}

.simple-mode .nav-group.open .nav-group-items {
  max-height: min(360px, calc(100vh - 260px));
  overflow-y: auto;
}

.simple-mode nav button.active {
  background: linear-gradient(#4d95cd, #2f75a7);
}

.simple-mode nav button:hover:not(.active) {
  background: #e3f1fa;
}

.simple-mode .topbar {
  min-height: 64px;
  border-color: #b9c7c0;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(28, 51, 42, 0.08);
}

.simple-home {
  gap: 12px;
}

.simple-home-overview {
  display: grid;
  grid-template-columns: minmax(240px, 0.7fr) minmax(420px, 1.1fr) minmax(300px, 0.9fr);
  gap: 12px;
  align-items: stretch;
}

.simple-home-overview .chart-panel {
  min-height: 156px;
}

.simple-home-overview .simple-money-focus {
  min-height: 156px;
}

.simple-chart-grid {
  grid-template-columns: repeat(2, minmax(220px, 1fr));
}

.simple-dashboard-heading h2 {
  min-width: 180px;
  border-color: #b9c7c0;
  border-radius: 6px;
  background: #fff;
}

.simple-hero {
  display: grid;
  grid-template-columns: minmax(360px, 1fr);
  gap: 12px;
  padding: 14px;
}

.simple-today-panel {
  display: grid;
  grid-template-columns: minmax(250px, 0.8fr) minmax(420px, 1.2fr);
  gap: 12px;
  align-items: start;
}

.simple-today-work,
.simple-collapsible {
  padding: 12px;
  border: 1px solid #b9c7c0;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(28, 51, 42, 0.08);
}

.simple-collapsible > summary {
  min-height: 38px;
  display: flex;
  align-items: center;
  cursor: pointer;
  color: #203c2e;
  font-weight: 800;
}

.simple-collapsible[open] > summary {
  margin-bottom: 8px;
  border-bottom: 1px solid #d8e3dd;
}

.compact-attention-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.simple-money-focus {
  display: grid;
  align-content: center;
  gap: 8px;
  min-height: 148px;
  padding: 16px;
  border-radius: 6px;
  color: #21342c;
  background: linear-gradient(135deg, #edf7f1, #fffaf1);
}

.simple-money-focus span,
.simple-money-grid span {
  color: #5d7067;
  font-weight: 700;
}

.simple-money-focus strong {
  font-size: 38px;
  line-height: 1;
}

.good-money {
  color: #276645;
}

.bad-money {
  color: #a23e38;
}

.simple-money-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(150px, 1fr));
  gap: 10px;
}

.simple-money-grid div {
  min-height: 68px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 10px;
  border: 1px solid #d9e1dd;
  border-radius: 6px;
  background: #f8faf9;
}

.simple-money-grid strong {
  color: #23382f;
  font-size: 20px;
}

.simple-task-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.management-work-panel {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid #b9c7c0;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(28, 51, 42, 0.08);
}

.management-financial-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #b9c7c0;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(28, 51, 42, 0.08);
}

.management-check-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.management-work-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 12px;
}

.simple-task-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}

.simple-task {
  min-height: 82px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 5px;
  padding: 13px;
  border-color: #b9c7c0;
  border-radius: 6px;
  background: #fbfcfc;
  box-shadow: none;
  text-align: left;
}

.simple-task:hover {
  border-color: #6c9a7e;
  background: #f0f8f3;
}

.simple-task strong {
  font-size: 16px;
  line-height: 1.15;
}

.simple-task span {
  color: inherit;
  opacity: 0.82;
}

.simple-attention {
  border-radius: 6px;
}

.simple-empty {
  padding: 14px;
  color: #617369;
}

.table-wrap,
.journal-form,
.login-panel,
.user-row,
.item-form,
.tax-form,
.invoice-tax-panel,
.invoice-form {
  border: 1px solid #86a6bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f0f7fc);
  box-shadow: 0 1px 2px rgba(40, 72, 96, 0.08), inset 0 1px 0 #fff;
}

.accounting-review-page {
  display: grid;
  gap: 12px;
  width: 100%;
  max-width: 100%;
}

.accounting-review-strip {
  grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
}

.accounting-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  max-width: 100%;
}

.accounting-review-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
  gap: 12px;
  max-width: 100%;
}

.accounting-review-panel {
  min-width: 0;
  padding: 10px;
  border: 1px solid #a8c3d5;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.72);
}

.accounting-review-panel > h3 {
  margin: 0 0 8px;
  color: #1d3f58;
  font-size: 15px;
}

.accounting-period-form {
  grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
}

.accounting-period-form .span-2 {
  grid-column: 1 / -1;
}

.accounting-period-form button.primary {
  align-self: end;
}

.ledger-review-panel {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #86a6bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f0f7fc);
  box-shadow: 0 1px 2px rgba(40, 72, 96, 0.08), inset 0 1px 0 #fff;
}

.ledger-review-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
}

.ledger-review-head h3 {
  margin: 2px 0 0;
}

.table-wrap,
.journal-form,
.login-panel,
.user-row,
.item-form,
.tax-form,
.invoice-tax-panel,
.invoice-form {
  padding: 10px;
}

.table-wrap {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow: visible;
}

.table-wrap.filterable-wrap {
  overflow: visible;
}

.table-scroll {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
}

.table-scroll-top {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 15px;
  margin: 0 0 4px;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid #b3c4d1;
  border-radius: 2px;
  background: linear-gradient(#eef5fb, #d7e5f0);
}

.table-scroll-top-spacer {
  height: 1px;
}

.table-scroll-top::-webkit-scrollbar,
.table-scroll::-webkit-scrollbar {
  height: 13px;
}

.table-scroll-top::-webkit-scrollbar-track,
.table-scroll::-webkit-scrollbar-track {
  background: #d6e3ec;
  border-radius: 2px;
}

.table-scroll-top::-webkit-scrollbar-thumb,
.table-scroll::-webkit-scrollbar-thumb {
  border: 2px solid #d6e3ec;
  border-radius: 7px;
  background: #6688a2;
}

.table-scroll-top::-webkit-scrollbar-thumb:hover,
.table-scroll::-webkit-scrollbar-thumb:hover {
  background: #466f8e;
}

.table-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.table-title-row h3 {
  margin-bottom: 8px;
}

.table-title-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.table-search {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #24475f;
}

.table-search input {
  width: clamp(150px, 20vw, 250px);
  min-height: 26px;
  padding: 3px 7px;
}

.table-result-count {
  font-size: 12px;
  font-weight: 700;
  color: #456174;
}

.table-footer-row {
  display: flex;
  justify-content: flex-end;
  padding: 8px 2px 0;
}

.server-page-controls {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #344e62;
  font-size: 12px;
  font-weight: 700;
}

.server-page-controls span {
  min-width: 140px;
}

.column-menu {
  position: relative;
  margin-bottom: 6px;
}

.column-menu summary {
  min-height: 22px;
  padding: 3px 8px;
  border: 1px solid #a1b5c5;
  border-radius: 3px;
  color: #24475f;
  background: linear-gradient(#fff, #e8f1f8);
  cursor: pointer;
  list-style: none;
}

.column-menu summary::-webkit-details-marker {
  display: none;
}

.column-menu-list {
  position: absolute;
  top: 26px;
  right: 0;
  z-index: 20;
  display: grid;
  gap: 2px;
  min-width: 180px;
  max-height: 260px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid #7f9ab0;
  background: #fff;
  box-shadow: 0 8px 18px rgba(34, 58, 78, 0.18);
}

.column-menu-list label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}

.column-menu-list input {
  width: auto;
  min-height: auto;
}

table {
  width: max-content;
  min-width: 100%;
  table-layout: auto;
  border-collapse: collapse;
  background: var(--record-surface, white);
  border: 1px solid #a8b9c6;
}

th,
td {
  min-width: 92px;
  max-width: 360px;
  border-bottom: 1px solid var(--record-divider, #d9e3eb);
  border-right: 1px solid var(--record-grid, #edf2f6);
  padding: 6px 7px;
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
  word-break: break-word;
}

th {
  color: #233d52;
  font-size: 11px;
  font-weight: 700;
  background: linear-gradient(var(--record-header-top, #f8fbfe), var(--record-header-bottom, #d8e7f2));
}

tr:nth-child(even) td {
  background: var(--record-row-alt, #f8fbfe);
}

.table-wrap:not(.report-spreadsheet) td input,
.table-wrap:not(.report-spreadsheet) td select,
.table-wrap:not(.report-spreadsheet) td textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.table-wrap:not(.report-spreadsheet) td button {
  min-height: 28px;
  padding-top: 4px;
  padding-bottom: 4px;
  max-width: 100%;
  white-space: normal;
}

.table-wrap:not(.report-spreadsheet) td textarea {
  min-height: 68px;
  overflow: auto;
}

.table-wrap:not(.report-spreadsheet) td label {
  min-width: 0;
  max-width: 100%;
}

.table-wrap:not(.report-spreadsheet) td .count-chip {
  white-space: normal;
}

.table-wrap:not(.report-spreadsheet) td .check {
  min-width: 0;
  white-space: normal;
}

.table-wrap:not(.report-spreadsheet) td .row-actions,
.table-wrap:not(.report-spreadsheet) td .button-row.compact {
  flex-wrap: wrap;
  align-items: stretch;
}

.table-amount-input {
  width: min(96px, 100%);
  min-width: 0;
}

.empty {
  color: #6f8292;
  text-align: center;
  padding: 22px;
}

.empty strong,
.empty span {
  display: block;
}

.empty strong {
  color: #344f63;
  margin-bottom: 3px;
}

.toolbar-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
  gap: 7px;
  align-items: end;
}

.toolbar-form.audit-toolbar {
  grid-template-columns: minmax(220px, 1fr) minmax(150px, 220px) auto;
}

.toolbar-form.single {
  grid-template-columns: minmax(240px, 360px);
}

.toolbar-form.ledger-toolbar {
  grid-template-columns: minmax(260px, 420px) minmax(240px, 360px);
}

.toolbar-form.customer-form {
  grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) minmax(220px, 1.4fr) 80px;
}

.customer-form {
  display: block;
}

.customer-card,
.vendor-card {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #a8b9c6;
  background: linear-gradient(#f7fbfe, #e8f0f6);
}

.vendor-card > label,
.vendor-card > .form-actions {
  min-width: 0;
}

.customer-section {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.customer-section h3 {
  margin: 0;
}

.customer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 7px;
}

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

.address-grid {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) 92px 110px 112px;
  gap: 7px;
}

.section-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 24px;
}

.toolbar-form.directory-form {
  grid-template-columns: repeat(4, minmax(145px, 1fr)) 80px;
}

.toolbar-form.vendor-form {
  grid-template-columns: repeat(3, minmax(150px, 1fr));
}

.vendor-form textarea,
.vendor-form .form-actions {
  grid-column: 1 / -1;
}

.toolbar-form.document-form {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  margin: 0;
  min-height: 276px;
  padding: 16px;
  border: 1px solid #9db7c8;
  border-radius: 6px;
  background: linear-gradient(#ffffff, #f5f9fc);
  box-shadow: 0 1px 2px rgba(40, 72, 96, 0.08), inset 0 1px 0 #fff;
}

.document-command-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(520px, 1fr));
  gap: 14px;
  align-items: start;
  margin-top: 12px;
}

.document-upload-row {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) auto auto;
  gap: 7px;
  align-items: center;
}

.document-section-heading {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: start;
}

.document-section-heading h3 {
  margin: 0 0 3px;
  color: #143a52;
  font-size: 15px;
}

.document-section-heading p {
  max-width: 680px;
  color: #5c7080;
  font-size: 12px;
  line-height: 1.35;
}

.document-hidden-file {
  display: none;
}

.document-pick-button {
  min-height: 44px;
  display: grid;
  justify-items: start;
  align-content: center;
  gap: 2px;
  padding: 7px 10px;
  border-radius: 6px;
  text-align: left;
  background: linear-gradient(#ffffff, #e8f2f8);
}

.document-pick-button strong,
.document-pick-button span {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.document-pick-button strong {
  color: #133b55;
}

.document-pick-button span {
  color: #5b7283;
  font-size: 12px;
}

.document-clear-file {
  min-height: 34px;
}

.document-metadata-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) 132px;
  gap: 7px;
  align-items: center;
}

.document-metadata-row textarea[placeholder="Notes"] {
  grid-column: 1 / -1;
  min-height: 76px;
  max-height: 150px;
  resize: vertical;
  line-height: 1.35;
}

.document-metadata-row input[placeholder="Record ID"] {
  max-width: 120px;
}

.document-upload-error {
  margin: 0;
}

.document-form-uploading {
  box-shadow:
    0 0 0 2px rgba(47, 120, 173, 0.08),
    0 8px 24px rgba(47, 120, 173, 0.12),
    inset 0 1px 0 #fff;
}

.document-upload-progress {
  position: relative;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  border: 1px solid #84a9c2;
  border-radius: 6px;
  padding: 8px 11px;
  color: #16415d;
  background: linear-gradient(#f8fcff, #e3f0f8);
}

.document-upload-progress span {
  width: 18px;
  height: 18px;
  border: 3px solid rgba(47, 120, 173, 0.22);
  border-top-color: #2f78ad;
  border-radius: 50%;
  animation: documentUploadSpin 720ms linear infinite;
}

.document-upload-progress::after {
  content: "";
  position: absolute;
  left: -35%;
  right: auto;
  bottom: 0;
  width: 35%;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(47, 120, 173, 0), #2f78ad, rgba(47, 120, 173, 0));
  animation: documentUploadSweep 1200ms ease-in-out infinite;
}

.document-upload-success {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 58px;
  border: 1px solid #76a783;
  border-radius: 7px;
  padding: 10px;
  color: #1c5338;
  background:
    linear-gradient(180deg, rgba(250, 255, 250, 0.96), rgba(234, 248, 237, 0.94)),
    radial-gradient(circle at 24px 24px, rgba(57, 129, 92, 0.16), transparent 44px);
  box-shadow: 0 10px 28px rgba(34, 88, 56, 0.14);
  animation: documentUploadSuccessPop 520ms cubic-bezier(.2, .9, .22, 1.15);
}

.document-upload-success-mark {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(180deg, #52a873, #26704a);
  font-size: 22px;
  font-weight: 900;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.35),
    0 0 0 7px rgba(57, 129, 92, 0.12);
  animation: documentUploadCheckPulse 900ms ease-out;
}

.document-upload-success strong,
.document-upload-success span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.document-upload-success span {
  margin-top: 2px;
  color: #4d745d;
  font-size: 12px;
}

.document-summary-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 6px;
}

.document-summary-chips span {
  border: 1px solid #9bb9ca;
  border-radius: 999px;
  padding: 5px 9px;
  color: #11364d;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.document-list-intro {
  display: grid;
  gap: 3px;
}

.document-list-intro h3 {
  margin: 0;
  color: #143a52;
  font-size: 15px;
}

.document-list-intro p {
  color: #5c7080;
  font-size: 12px;
  line-height: 1.35;
}

@keyframes documentUploadSpin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes documentUploadSweep {
  0% {
    left: -35%;
  }
  100% {
    left: 100%;
  }
}

@keyframes documentUploadSuccessPop {
  0% {
    opacity: 0;
    transform: translateY(-5px) scale(0.96);
  }
  70% {
    opacity: 1;
    transform: translateY(1px) scale(1.012);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes documentUploadCheckPulse {
  0% {
    transform: scale(0.72);
    box-shadow: 0 0 0 0 rgba(57, 129, 92, 0.26);
  }
  55% {
    transform: scale(1.08);
    box-shadow: 0 0 0 10px rgba(57, 129, 92, 0.12);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 7px rgba(57, 129, 92, 0.12);
  }
}

.document-search-section {
  display: grid;
  gap: 12px;
  margin: 0;
  min-height: 276px;
  padding: 16px;
  border: 1px solid #9db7c8;
  border-radius: 6px;
  background: linear-gradient(#ffffff, #f5f9fc);
  box-shadow: 0 1px 2px rgba(40, 72, 96, 0.08), inset 0 1px 0 #fff;
}

.document-search-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
  border: 1px solid #aec4d3;
  border-radius: 4px;
  padding: 9px;
  background: #edf5fa;
}

.document-search-form .primary {
  min-height: 30px;
  padding: 5px 14px;
}

.document-search-form .search-filter {
  min-width: min(100%, 420px);
}

.document-filter-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
}

.document-status-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.document-table-controls {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.document-date-sort {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #24475f;
  font-size: 12px;
  font-weight: 700;
}

.document-date-sort select {
  min-height: 30px;
  min-width: 132px;
}

.document-status-buttons button {
  border: 1px solid #9ab7c8;
  border-radius: 999px;
  padding: 5px 10px;
  color: #173b52;
  background: linear-gradient(#fff, #edf5fa);
  font-weight: 700;
}

.document-status-buttons button.active {
  border-color: #2f78ad;
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
  box-shadow: 0 2px 6px rgba(47, 120, 173, 0.18);
}

.document-list-section {
  display: grid;
  gap: 14px;
  margin-top: 12px;
}

.document-note-preview {
  max-width: 360px;
  display: -webkit-box;
  overflow: hidden;
  line-height: 1.3;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.document-archive-success {
  width: max-content;
  max-width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid #76a783;
  border-radius: 999px;
  padding: 6px 11px 6px 7px;
  color: #1c5338;
  background: linear-gradient(#fbfffc, #eaf7ed);
  box-shadow: 0 6px 16px rgba(34, 88, 56, 0.12);
  animation: archiveConfirmPop 420ms ease-out;
}

.document-archive-success span {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(#52a873, #26704a);
  font-size: 13px;
  font-weight: 900;
}

.document-archive-success strong {
  font-size: 12px;
}

.document-archive-success em {
  max-width: 320px;
  overflow: hidden;
  color: #4d745d;
  font-size: 12px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.receipt-review-section {
  display: grid;
  gap: 12px;
  margin-top: 20px;
  border-top: 1px solid #bfd1dc;
  padding-top: 14px;
}

.receipt-metrics {
  margin-top: 0;
}

@keyframes archiveConfirmPop {
  0% {
    opacity: 0;
    transform: translateY(-4px) scale(0.97);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.toolbar-form.bank-import-form {
  grid-template-columns: minmax(210px, 1fr) minmax(220px, 1fr) 110px;
}

.bank-rule-panel,
.custom-field-panel {
  display: grid;
  gap: 9px;
}

.bank-rule-form,
.custom-field-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 7px;
  align-items: end;
}

.bank-rule-form .wide,
.custom-field-form .wide {
  grid-column: 1 / -1;
}

.custom-field-layout {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 10px;
  align-items: start;
}

.custom-field-entity-picker {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 260px);
  gap: 10px;
  align-items: center;
  margin: 8px 0 10px;
  padding: 9px 10px;
  border: 1px solid #9db7cb;
  background: linear-gradient(#f8fbfd, #e8f1f7);
}

.custom-field-entity-picker strong,
.custom-field-entity-picker span {
  display: block;
}

.custom-field-entity-picker span {
  margin-top: 2px;
  color: #5c7181;
  font-size: 11px;
}

.field-note {
  display: block;
  margin-top: 3px;
  color: #5c7181;
  font-size: 11px;
}

.file-picker {
  position: relative;
  min-height: 28px;
  display: flex;
  align-items: center;
  padding: 0 8px;
  overflow: hidden;
  border: 1px solid #8fa4b5;
  border-radius: 2px;
  color: #1b2d3c;
  background: linear-gradient(#ffffff, #d9e6f0 52%, #c4d5e1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  cursor: pointer;
}

.file-picker span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.file-picker input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.item-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(145px, 1fr));
  gap: 7px;
  align-items: end;
}

.form-section-title {
  grid-column: 1 / -1;
  margin-top: 4px;
  padding-top: 7px;
  border-top: 1px solid #d1dde7;
  color: #24455e;
  font-size: 12px;
  font-weight: 700;
}

.form-section-title:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.form-help {
  grid-column: 1 / -1;
  margin: -2px 0 1px;
  color: #5c7181;
  font-size: 11px;
}

.item-form textarea {
  grid-column: span 2;
}

.item-preset-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 7px;
}

.item-preset {
  display: grid;
  gap: 3px;
  justify-items: start;
  min-height: 58px;
  padding: 9px 10px;
  border: 1px solid #9fb6c8;
  background: linear-gradient(#ffffff, #eef5fa);
}

.item-preset strong {
  color: #1f3f57;
}

.item-preset span {
  color: #5a7182;
  font-size: 11px;
}

.item-preset.active {
  border-color: #2f78aa;
  box-shadow: inset 3px 0 0 #2f78aa;
  background: #f1f8fc;
}

.form-advanced-panel {
  padding: 7px;
  border: 1px solid #bfd0dc;
  border-radius: 4px;
  background: #f8fbfd;
}

.form-advanced-panel summary {
  cursor: pointer;
  color: #24455e;
  font-weight: 700;
  font-size: 12px;
}

.form-advanced-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(150px, 1fr));
  gap: 7px;
  margin-top: 7px;
}

.wide-field {
  grid-column: span 2;
  display: grid;
  gap: 4px;
}

.category-tag-field input {
  width: 100%;
}

.tag-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  min-height: 24px;
  align-items: center;
}

.tag-pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 7px;
  border: 1px solid #9fb8ca;
  border-radius: 999px;
  background: #eef6fb;
  color: #25465f;
  font-size: 11px;
  font-weight: 700;
}

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

.parts-metrics {
  margin-top: 0;
}

.parts-flow-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr));
  gap: 7px;
}

.parts-flow-strip button {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  justify-content: flex-start;
  background: linear-gradient(#ffffff, #eef5fa);
}

.parts-flow-strip strong {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #2f78aa;
  color: #fff;
  font-size: 12px;
}

.parts-flow-strip span {
  color: #24455e;
  font-weight: 700;
}

.tax-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 120px minmax(220px, 1fr) 90px;
  gap: 7px;
  align-items: end;
}

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

.items-command-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  padding: 8px 10px;
  border: 1px solid #9fb4c4;
  background: linear-gradient(#fbfdff, #edf4f9);
}

.items-command-main {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.items-overview-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 7px;
  margin: 8px 0 10px;
}

.items-overview-button {
  display: grid;
  min-height: 50px;
  justify-items: start;
  align-content: center;
  gap: 3px;
  padding: 7px 10px;
  text-align: left;
  background: linear-gradient(#ffffff, #eef5fa);
}

.items-overview-button.active {
  border-color: #2f78aa;
  color: #18384f;
  background: linear-gradient(#f9fcff, #d7e9f5);
  box-shadow: inset 3px 0 0 #2f78aa;
}

.items-overview-button strong,
.items-overview-button span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.items-overview-button strong {
  font-size: 13px;
}

.items-overview-button span,
.items-overview-note {
  color: #49677d;
  font-size: 11px;
}

.items-overview-note {
  align-self: center;
  padding: 6px 8px;
  border: 1px solid #d7c794;
  background: #fff9df;
}

.items-main-action {
  min-width: 112px;
}

.items-import-progress {
  display: grid;
  gap: 7px;
  margin: 0 0 10px;
  padding: 9px 10px;
  border: 1px solid #9eb3c3;
  background: #f8fbfd;
}

.items-import-progress.complete {
  border-color: #8fb59a;
  background: #f4fbf6;
}

.items-import-progress.needs-review {
  border-color: #d7c794;
  background: #fff9df;
}

.items-import-progress.error {
  border-color: #d99a9a;
  background: #fff5f5;
}

.items-import-progress-head,
.items-import-progress-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.items-import-progress-head > div {
  display: grid;
  gap: 2px;
}

.items-import-progress-head strong {
  color: #1f3c52;
  font-size: 13px;
}

.items-import-progress-head span,
.items-import-progress-meta {
  color: #49677d;
  font-size: 11px;
}

.items-import-progress-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #dce7ef;
}

.items-import-progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2f78aa, #42a2b8);
  transition: width 180ms ease;
}

.items-import-progress.error .items-import-progress-track span {
  background: #b94b4b;
}

.items-import-errors {
  display: grid;
  gap: 4px;
  color: #7b3b2d;
  font-size: 12px;
}

.items-import-errors p {
  margin: 0;
}

.items-control-panel {
  display: grid;
  gap: 5px;
  margin-bottom: 8px;
  padding: 6px 8px;
  border: 1px solid #a8b9c6;
  background: #f8fbfd;
}

.items-search-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.items-search-box {
  display: grid;
  flex: 1 1 460px;
  max-width: 620px;
  grid-template-columns: auto minmax(260px, 1fr);
  align-items: center;
  gap: 4px;
  color: #23445e;
  font-size: 12px;
  font-weight: 700;
}

.items-search-box input {
  width: 100%;
}

.items-search-row .count-chip {
  margin-bottom: 0;
}

.items-rows-control {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
  align-items: center;
  margin-left: auto;
}

.items-rows-control .filter-field {
  min-width: 84px;
}

.items-quick-filters,
.items-pager-controls,
.items-export-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.items-advanced-controls {
  padding-top: 0;
}

.items-advanced-controls summary {
  width: max-content;
  min-height: 25px;
  padding: 4px 8px;
  border: 1px solid #9eb3c3;
  border-radius: 3px;
  color: #23445e;
  background: linear-gradient(#ffffff, #e5eef6);
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}

.items-advanced-controls summary:hover {
  background: linear-gradient(#ffffff, #dceaf4);
}

.items-advanced-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(220px, 0.8fr) auto auto;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.bill-taskbar {
  display: grid;
  gap: 7px;
  margin-bottom: 10px;
  padding: 8px;
  border: 1px solid #a4b8c7;
  background: linear-gradient(#f9fcff, #e7f0f7);
}

.bill-taskbar-main,
.bill-secondary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.bill-taskbar-note {
  color: #5b7183;
  font-size: 12px;
}

.section-helper {
  margin: 2px 0 0;
  color: #607789;
  font-size: 12px;
}

.ap-more-panel {
  margin-top: 14px;
}

.bill-secondary-actions {
  padding-top: 7px;
  border-top: 1px solid #c6d4de;
}

.inline-details {
  align-self: center;
  color: #334f64;
  font-size: 12px;
}

.inline-details summary {
  cursor: pointer;
}

.inline-details span {
  display: inline-block;
  max-width: 760px;
  margin-left: 8px;
  color: #5f7282;
}

.inline-notice {
  margin: 8px 0 10px;
  padding: 8px 10px;
  color: #24475f;
  border: 1px solid #9eb4c5;
  border-left: 4px solid #2f78ad;
  background: #fff;
}

.inline-warning {
  margin: 8px 0 10px;
  padding: 8px 10px;
  color: #68450f;
  border: 1px solid #d4b16f;
  border-left: 4px solid #b87818;
  background: #fff9ea;
}

.one-time-code {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  margin: 8px 0 10px;
  padding: 9px 10px;
  border: 1px solid #b89149;
  border-left: 4px solid #b87818;
  background: #fff9ea;
}

.one-time-code strong,
.one-time-code span {
  display: block;
}

.one-time-code span {
  color: #6c5631;
  font-size: 12px;
}

.one-time-code code {
  padding: 6px 8px;
  border: 1px solid #c9a663;
  background: #fff;
  color: #123650;
  font-weight: 800;
  letter-spacing: 0;
  user-select: all;
}

.settings-health {
  min-width: 185px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 8px 10px;
  border: 1px solid #a5b8c7;
  background: #fff;
}

.settings-health span,
.settings-metric-grid span,
.settings-event-row span,
.settings-company-card span,
.settings-company-card em {
  color: #5d7282;
  font-size: 12px;
}

.settings-health strong {
  color: #1d5a32;
}

.settings-tabs {
  margin-bottom: 10px;
}

.settings-heading {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 10px;
}

.settings-heading h1 {
  margin: 0;
  font-size: 18px;
  padding: 0;
  border: 0;
  background: transparent;
}

.settings-heading p { margin-top: 4px; color: #536b7d; }

.settings-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr);
  gap: 10px;
  align-items: start;
}

.settings-panel {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #8fa8bb;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f2f7fb);
  box-shadow: inset 0 1px 0 #fff;
}

.settings-panel.wide {
  grid-column: 1 / -1;
}

.company-logo-preview {
  display: grid;
  gap: 5px;
  align-content: start;
  min-height: 86px;
  padding: 7px;
  border: 1px solid #b2c4d2;
  border-radius: 3px;
  background: #fff;
  color: #425a6d;
  font-size: 12px;
}

.company-logo-preview > span {
  font-weight: 700;
}

.company-logo-preview img,
.company-logo-empty {
  width: min(100%, 220px);
  height: 58px;
  object-fit: contain;
  object-position: left center;
  border: 1px solid #d4e0e9;
  border-radius: 3px;
  background:
    linear-gradient(45deg, #f2f6f9 25%, transparent 25%),
    linear-gradient(-45deg, #f2f6f9 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #f2f6f9 75%),
    linear-gradient(-45deg, transparent 75%, #f2f6f9 75%),
    #fff;
  background-position: 0 0, 0 8px, 8px -8px, -8px 0;
  background-size: 16px 16px;
}

.company-logo-empty {
  display: grid;
  place-items: center;
  color: #7b8d9a;
  font-weight: 700;
}

.company-logo-upload {
  display: inline-flex;
  width: fit-content;
  min-height: 26px;
  align-items: center;
  justify-content: center;
  padding: 0 9px;
  border: 1px solid #7c93a8;
  border-radius: 3px;
  color: #1c3344;
  cursor: pointer;
  background: linear-gradient(#ffffff, #d9e6f0 52%, #c4d5e1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  font-weight: 600;
}

.company-logo-upload:hover {
  border-color: #3d6f9e;
  background: linear-gradient(#ffffff, #e5f3ff 48%, #bed8ec);
}

.company-logo-upload input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.address-typeahead-field {
  display: grid;
  gap: 4px;
}

.address-suggestion-list {
  display: grid;
  gap: 4px;
  padding: 5px;
  border: 1px solid #b2c4d2;
  border-radius: 3px;
  background: #f8fbfe;
}

.address-suggestion {
  display: grid;
  gap: 2px;
  justify-items: start;
  min-height: 38px;
  padding: 5px 7px;
  text-align: left;
  background: #fff;
}

.address-suggestion strong,
.address-suggestion span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.address-suggestion span {
  color: #5d7282;
  font-size: 11px;
}

.settings-form {
  display: grid;
  gap: 8px;
}

.settings-form.inline {
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
}

.settings-code-box {
  padding: 8px 10px;
  border: 1px solid #9eb3c2;
  background: #fff;
  color: #123650;
  font-family: Consolas, "Courier New", monospace;
  font-weight: 800;
  letter-spacing: 0;
  user-select: all;
  overflow-wrap: anywhere;
}

.settings-company-list {
  display: grid;
  gap: 6px;
}

.settings-company-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  width: 100%;
  min-height: 48px;
  padding: 7px 9px;
  border: 1px solid #9eb3c2;
  border-radius: 3px;
  text-align: left;
  background: #fff;
  cursor: pointer;
}

.settings-company-card.active {
  border-color: #2f78ad;
  background: linear-gradient(#f8fcff, #d7eafa);
}

.settings-company-card:focus {
  outline: 2px solid #5d97c5;
  outline-offset: 1px;
}

.settings-company-info {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-company-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.settings-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.settings-metric-grid div {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid #b3c3cf;
  background: #fff;
}

.settings-event-row {
  display: grid;
  gap: 2px;
  padding: 7px 0;
  border-bottom: 1px solid #d7e2ea;
}

.settings-event-row:last-child {
  border-bottom: 0;
}

.danger-panel {
  border-color: #b38c8c;
  background: linear-gradient(#fff, #fff7f7);
}

.settings-password-confirm {
  display: grid;
  gap: 4px;
  max-width: 360px;
  font-weight: 700;
}

.settings-password-confirm input {
  border-color: #b38c8c;
  background: #fff;
}

.settings-list {
  margin: 0;
  padding-left: 18px;
}

.settings-list li {
  margin-bottom: 5px;
}

/* Legal and shipping share the same form and heading contracts. */
.legal-center,
.shipping-center {
  display: grid;
  gap: var(--space-3);
}

.legal-heading,
.shipping-heading {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  align-items: center;
  padding: var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.legal-heading h2,
.shipping-heading h2 {
  padding: 0;
  border: 0;
  background: transparent;
}

.legal-heading p,
.legal-matter-cell span {
  color: #5d7282;
  font-size: 12px;
}

.legal-disclaimer {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid #c8ab68;
  border-left: 4px solid #a97419;
  border-radius: 3px;
  color: #49360d;
  background: #fff9ea;
}

.legal-disclaimer strong {
  font-size: 13px;
}

.legal-disclaimer p {
  margin: 0;
  max-width: 1180px;
  font-size: 12px;
  line-height: 1.45;
}

.legal-metrics,
.shipping-metrics {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.legal-form,
.shipping-form,
.shipping-rate-panel {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.legal-form-grid,
.shipping-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: var(--space-3);
}

.legal-form-grid label,
.shipping-form-grid label {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
  color: var(--muted);
  font-size: var(--text-small);
  font-weight: 600;
}

.legal-form-grid .wide,
.shipping-form-grid .wide {
  grid-column: 1 / -1;
}

.legal-matter-cell {
  display: grid;
  gap: 2px;
}

.shipping-heading p,
.shipping-record-cell span,
.shipping-recipient-cell span {
  color: #5d7282;
  font-size: 12px;
}

.shipping-live-status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  max-width: 360px;
  padding: 5px 8px;
  border: 1px solid #d0ad6f;
  border-radius: 3px;
  color: #68450f;
  background: #fff9ea;
  font-size: 12px;
  font-weight: 700;
}

.shipping-live-status.ready {
  border-color: #8bb49b;
  color: #245f3d;
  background: #f0f8f3;
}

.shipping-record-cell,
.shipping-recipient-cell {
  display: grid;
  gap: 2px;
  min-width: 150px;
}

.shipping-recipient-cell {
  min-width: 210px;
}

.shipping-table-input {
  min-width: 128px;
  max-width: 150px;
}

.shipping-status-select {
  min-width: 118px;
}

.shipping-list-toolbar {
  flex-wrap: wrap;
}

.shipping-center .row-actions {
  min-width: 124px;
  flex-wrap: wrap;
}

.shipping-rate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.shipping-rate-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 9px;
  border: 1px solid #b7c8d3;
  border-radius: 4px;
  background: #fff;
}

.shipping-rate-card strong,
.shipping-rate-card span {
  display: block;
}

.shipping-rate-card span {
  color: #60746b;
  font-size: 12px;
}

.shipping-rate-price {
  color: #17344a;
  font-size: 16px;
  font-weight: 800;
  white-space: nowrap;
}

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

.icebox-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid #9eb4c5;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fb);
}

.icebox-card strong,
.icebox-card span,
.icebox-card p {
  display: block;
}

.icebox-card span {
  margin-top: 2px;
  color: #607789;
  font-size: 12px;
  font-weight: 700;
}

.icebox-card p {
  margin: 5px 0 0;
  color: #41586a;
}

.status-filter {
  display: inline-flex;
  flex: 0 0 auto;
  width: max-content;
  max-width: 100%;
  overflow: hidden;
  border: 1px solid #7c93a8;
  border-radius: 3px;
  background: #fff;
}

.status-filter button {
  min-height: 26px;
  white-space: nowrap;
  border: 0;
  border-right: 1px solid #b9c7d2;
  border-radius: 0;
  background: linear-gradient(#ffffff, #e8f0f6);
}

.status-filter button:last-child {
  border-right: 0;
}

.status-filter button.active {
  color: #fff;
  background: linear-gradient(#5fa0ce, #2f78ad 52%, #1f5f91);
  font-weight: 700;
}

.list-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  border: 1px solid #a8b9c6;
  background: linear-gradient(#f8fbfe, #e2edf5);
}

.filter-toolbar {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.filter-field {
  display: inline-grid;
  grid-template-columns: auto minmax(150px, 210px);
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
}

.filter-field select {
  min-width: 0;
}

.filter-field input {
  min-width: 0;
}

.compact-filter {
  grid-template-columns: auto minmax(112px, 148px);
}

.receivables-filter-toolbar {
  margin: 8px 0;
}

.receivables-search-filter {
  grid-template-columns: auto minmax(210px, 280px);
}

.receivables-sort-filter {
  grid-template-columns: auto minmax(160px, 230px);
}

.customer-filter-toolbar {
  margin: 8px 0;
}

.customer-search-filter {
  grid-template-columns: auto minmax(210px, 280px);
}

.customer-sort-filter {
  grid-template-columns: auto minmax(160px, 220px);
}

.amount-filter {
  grid-template-columns: auto minmax(150px, 180px);
}

.range-input-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  min-width: 0;
}

.receivable-sort-button {
  min-height: 22px;
  padding: 2px 6px;
  font-size: 11px;
  font-weight: 700;
}

.receivable-sort-button.active {
  color: #fff;
  background: linear-gradient(#5fa0ce, #2f78ad 52%, #1f5f91);
}

.filter-button-group {
  max-width: min(100%, 430px);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  padding: 2px;
  font-size: 12px;
  font-weight: 700;
}

.filter-button-label {
  flex: 0 0 auto;
  margin-right: 2px;
}

.filter-chip {
  flex: 0 0 auto;
  min-height: 26px;
  padding: 3px 9px;
  border-color: #9fb4c5;
  color: #284b63;
  background: linear-gradient(#ffffff, #edf4f9);
  box-shadow: none;
  white-space: nowrap;
}

.filter-chip.active {
  color: #fff;
  border-color: #2f78ad;
  background: linear-gradient(#5fa0ce, #2f78ad);
}

.category-filter-group {
  min-width: 0;
}

.count-chip {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid #a8b9c6;
  border-radius: 3px;
  color: #334f64;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
}

.tax-rate-toolbar {
  margin-top: 10px;
}

.tax-settings-panel {
  margin: 10px 0 12px;
  padding: 10px;
  border: 1px solid #8fb0c8;
  background: #eef6fb;
}

.tax-settings-panel .tax-rate-toolbar {
  margin-top: 0;
}

.tax-settings-panel .compact-panel {
  margin: 8px 0;
}

.collapsible-panel {
  display: block;
}

.collapsible-panel summary {
  width: max-content;
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid #6f879a;
  border-radius: 2px;
  color: #17374e;
  background: linear-gradient(#ffffff, #d9e6f0 52%, #c4d5e1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  list-style-position: inside;
}

.collapsible-panel[open] summary {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.collapsible-panel[open] .item-form {
  margin-top: 8px;
}

.compact-select {
  width: auto;
  min-width: 130px;
}

.archive-action {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) auto;
  gap: 5px;
  align-items: center;
}

.archive-action input {
  min-width: 130px;
}

.compact-panel {
  background: #f8fbfe;
}

.order-link-panel {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  border: 1px solid #aac0d0;
  border-radius: 4px;
  padding: 10px;
}

.order-link-panel .section-title-row {
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}

.order-link-panel .section-title-row > button {
  margin-left: auto;
}

.order-link-new-order {
  min-width: 176px;
  min-height: 32px;
  padding: 5px 14px;
  font-weight: 800;
  white-space: nowrap;
}

.order-link-controls {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto auto;
  gap: 8px;
  align-items: end;
}

.order-link-select {
  min-width: 0;
}

.order-link-use,
.order-link-convert {
  min-width: 190px;
  white-space: nowrap;
}

.order-link-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 8px;
}

.order-link-metric {
  min-height: 48px;
  padding: 8px 10px;
}

.quote-item-choice {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.item-search-picker {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.item-search-picker input {
  width: 100%;
  min-width: 0;
}

.item-picker-selected,
.item-picker-help {
  display: block;
  overflow: hidden;
  color: #5f7282;
  font-size: 11px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.quote-availability {
  margin: 0;
  font-size: 11px;
}

.quote-entry-header,
.quote-entry-line {
  grid-template-columns: minmax(220px, 1fr) 80px 110px 110px 92px 92px;
}

.sales-order-entry-header,
.sales-order-entry-line {
  grid-template-columns: minmax(220px, 1fr) 80px 110px 110px 92px 92px;
}

.quote-workflow-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: #f7fafc;
}

.quote-workflow-head h3 {
  margin: 0;
}

.quote-workflow-head p {
  margin: 2px 0 0;
}

.quote-line-remove {
  align-self: center;
  justify-self: end;
}

.sales-order-line-remove {
  align-self: center;
  justify-self: end;
}

.quote-price-guide,
.quote-price-history {
  display: grid;
  gap: 8px;
}

.quote-price-history {
  padding-top: 2px;
}

.warehouse-board {
  display: grid;
  gap: 10px;
}

.ready-invoice-panel {
  display: grid;
  gap: 8px;
  margin: 10px 0;
  border-color: #9fb9cc;
  background: linear-gradient(#ffffff, #f5f9fc);
}

.warehouse-layout {
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(420px, 1fr);
  gap: 12px;
  align-items: start;
}

.warehouse-queue,
.packing-slip-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #9fb9cc;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f4f9fc);
}

.warehouse-order-card {
  display: grid;
  gap: 6px;
  padding: 9px;
  border: 1px solid #b3c6d6;
  border-radius: 4px;
  background: #ffffff;
  cursor: pointer;
}

.warehouse-order-card.selected {
  border-color: #2f78aa;
  box-shadow: inset 3px 0 0 #2f78aa;
}

.warehouse-order-card:hover {
  border-color: #6f9fbe;
  background: #fbfdff;
}

.fulfillment-schedule-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  gap: 8px;
}

.fulfillment-schedule-filter {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 6px;
  align-items: center;
  min-height: 54px;
  padding: 7px 9px;
  text-align: left;
  border: 1px solid #adc3d3;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fa);
  color: #143750;
}

.fulfillment-schedule-filter span {
  min-width: 0;
  font-size: 12px;
  font-weight: 800;
}

.fulfillment-schedule-filter strong {
  color: #092f49;
  font-size: 17px;
  text-align: right;
}

.fulfillment-schedule-filter small {
  grid-column: 1 / -1;
  color: #607588;
  font-size: 11px;
  font-weight: 700;
}

.fulfillment-schedule-filter.active {
  border-color: #2f78aa;
  background: linear-gradient(#e8f4fb, #d8ecf8);
  box-shadow: inset 3px 0 0 #2f78aa;
}

.warehouse-card-head,
.warehouse-card-meta,
.warehouse-due-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.warehouse-card-customer {
  color: #17364d;
  font-weight: 700;
}

.warehouse-card-meta {
  flex-wrap: wrap;
  color: #536c7f;
  font-size: 12px;
}

.warehouse-card-foot {
  padding-top: 2px;
  color: #557086;
  font-size: 12px;
  font-weight: 700;
}

.count-chip.warning {
  color: #7a4b00;
  border-color: #d0a34b;
  background: #fff7df;
}

.warehouse-order-card.selected .warehouse-card-foot {
  color: #1e5f8b;
}

.warehouse-due-line strong {
  color: #17364d;
  font-size: 12px;
}

.ship-date-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 7px;
  border: 1px solid #aebfcd;
  border-radius: 4px;
  background: #f2f6f9;
  color: #24475f;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}

.ship-date-badge.overdue {
  border-color: #c78973;
  background: #fff0e9;
  color: #8d3f20;
}

.ship-date-badge.today {
  border-color: #bd963a;
  background: #fff8df;
  color: #765514;
}

.ship-date-badge.this-week {
  border-color: #73a7c8;
  background: #e8f5fc;
  color: #1c5f87;
}

.ship-date-badge.later {
  border-color: #a7bdce;
  background: #f2f7fb;
  color: #395a73;
}

.ship-date-badge.no-date {
  border-color: #9f9f9f;
  background: #f4f4f4;
  color: #535353;
}

.ship-date-badge.shipped {
  border-color: #79a983;
  background: #eef8f0;
  color: #2f6b3b;
}

.warehouse-stage-control {
  display: inline-grid;
  grid-template-columns: minmax(122px, 168px) auto;
  gap: 6px;
  align-items: end;
  padding: 5px;
  border: 1px solid #b5c9d8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fa);
}

.warehouse-stage-control label {
  min-width: 0;
  color: #24475f;
  font-size: 11px;
  font-weight: 700;
}

.warehouse-stage-control select {
  margin-top: 2px;
  min-height: 24px;
}

.fulfillment-stepper {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.fulfillment-step-button {
  display: grid;
  gap: 3px;
  min-height: 52px;
  padding: 8px 10px;
  text-align: left;
  border: 1px solid #b5c9d8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #eef5fa);
  color: #163852;
}

.fulfillment-step-button strong {
  font-size: 13px;
}

.fulfillment-step-button span {
  color: #617789;
  font-size: 11px;
  font-weight: 600;
}

.fulfillment-step-button.active {
  border-color: #2f78aa;
  background: linear-gradient(#eaf5fb, #d9edf8);
  box-shadow: inset 4px 0 0 #2f78aa;
}

.fulfillment-step-button:disabled {
  cursor: default;
  opacity: 0.55;
}

.fulfillment-step-body,
.fulfillment-empty-step,
.fulfillment-finish-panel {
  display: grid;
  gap: 10px;
}

.fulfillment-empty-step {
  min-height: 170px;
  align-content: center;
  justify-items: center;
  padding: 24px;
  border: 1px dashed #b5c9d8;
  border-radius: 4px;
  background: #fbfdff;
  text-align: center;
}

.fulfillment-empty-step strong {
  color: #0b344f;
  font-size: 16px;
}

.fulfillment-step-actions,
.fulfillment-finish-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.fulfillment-finish-panel {
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: center;
  padding: 12px;
  border: 1px solid #a9bfce;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f4f9fc);
}

.fulfillment-finish-copy h4 {
  margin: 0 0 3px;
  color: #0b344f;
  font-size: 15px;
}

.fulfillment-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  gap: 8px;
}

.fulfillment-summary-strip > div,
.fulfillment-mini-grid > div {
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border: 1px solid #bfd0dd;
  border-radius: 4px;
  background: #f8fbfd;
}

.fulfillment-summary-strip span,
.fulfillment-mini-grid span {
  color: #5f7282;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.fulfillment-summary-strip strong,
.fulfillment-mini-grid strong {
  color: #0b344f;
  font-size: 15px;
}

.fulfillment-worker-panel {
  display: grid;
  gap: 10px;
}

.fulfillment-line-card {
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid #aec3d3;
  border-radius: 4px;
  background: #ffffff;
}

.fulfillment-line-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.fulfillment-line-title {
  color: #0c3049;
  font-size: 14px;
  font-weight: 800;
}

.fulfillment-line-subtitle {
  margin-top: 2px;
  color: #5f7282;
  font-size: 12px;
}

.fulfillment-mini-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(82px, 1fr));
  gap: 6px;
}

.fulfillment-line-alert {
  padding: 7px 9px;
  border-left: 3px solid #c88623;
  background: #fff8ea;
  color: #704712;
  font-weight: 700;
}

.fulfillment-edit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr)) minmax(220px, 1.5fr);
  gap: 8px;
  align-items: end;
}

.fulfillment-note-field {
  min-width: 0;
}

.fulfillment-line-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.location-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  min-width: 0;
}

.location-mini-grid input {
  min-width: 0;
  padding: 0 5px;
}

.trace-panel {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #9fb9cc;
}

.journal-preview,
.story-panel,
.aging-panel {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #b4c8d7;
}

.journal-preview h3,
.story-panel h3,
.aging-panel h3 {
  margin: 0 0 6px;
  color: #23445e;
  font-size: 14px;
}

.warehouse-metrics {
  grid-template-columns: repeat(auto-fit, minmax(115px, 1fr));
  gap: 6px;
}

.warehouse-metrics .metric {
  min-height: auto;
  padding: 8px 10px;
}

.warehouse-metrics .metric strong {
  margin-top: 3px;
  font-size: 16px;
}

.customer-record-panel {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: linear-gradient(#fbfdff, #f1f7fb);
}

.customer-record-modal {
  margin-top: 0;
  max-height: min(72vh, 760px);
  overflow: auto;
}

.customer-record-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.customer-record-heading h3 {
  margin: 0;
  font-size: 15px;
}

.customer-record-heading p {
  margin-top: 2px;
}

.customer-record-metrics {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.customer-item-history-panel {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #b6c7d4;
  background: #fff;
}

.customer-item-history-heading,
.customer-item-history-controls {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.customer-item-history-heading h3 {
  margin: 0;
  font-size: 14px;
}

.customer-item-history-heading p {
  margin-top: 2px;
}

.customer-item-history-controls .item-search-picker {
  flex: 1 1 320px;
}

.customer-item-history-metrics {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.table-wrap .customer-name-link {
  min-height: 22px;
  width: auto;
  padding: 0 2px;
  border: 0;
  color: #175e92;
  background: transparent;
  box-shadow: none;
  font-weight: 700;
  text-align: left;
  text-decoration: underline;
}

.table-wrap .customer-name-link:hover,
.table-wrap .customer-name-link.selected {
  color: #fff;
  background: #2f78ad;
  text-decoration: none;
}

.customer-record-actions {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.customer-record-id {
  min-width: 86px;
  font-weight: 700;
  color: #173b54;
}

.customer-record-link {
  max-width: 128px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.aging-metrics {
  margin-bottom: 8px;
}

.smoke-metrics {
  margin-bottom: 8px;
}

.invoice-page {
  overflow-x: clip;
}

.invoice-page > *,
.invoice-page .section-actions,
.invoice-page .section-title-row,
.invoice-page .compact-panel,
.invoice-page .story-panel {
  min-width: 0;
  max-width: 100%;
}

.invoice-page .table-wrap {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
  overflow-y: visible;
}

.invoice-page .table-scroll,
.invoice-page .table-scroll-top {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.invoice-form {
  display: grid;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}

.invoice-workflow-rail {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.invoice-workflow-rail.compact {
  margin-bottom: 2px;
}

.invoice-workflow-step {
  min-height: 62px;
  padding: 9px 10px;
  border: 1px solid #b3c7d5;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f2f7fb);
  box-shadow: inset 0 1px 0 #fff;
}

.invoice-workflow-step.active {
  border-color: #2f75a7;
  background: linear-gradient(#f8fcff, #e7f3fb);
  box-shadow: inset 3px 0 0 #2f75a7;
}

.invoice-workflow-step.done {
  border-color: #6f9c83;
  background: linear-gradient(#ffffff, #eef8f1);
  box-shadow: inset 3px 0 0 #3d865e;
}

.invoice-workflow-step span,
.invoice-workflow-step small {
  display: block;
  color: #5d7384;
  font-size: 11px;
}

.invoice-workflow-step strong {
  display: block;
  margin: 3px 0;
  color: #123650;
  font-size: 14px;
}

.invoice-workflow-panel,
.invoice-finish-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  padding: 10px;
  border: 1px solid #a8bdcc;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f6fafc);
}

.invoice-ready-badge {
  align-self: start;
  min-width: 82px;
  padding: 6px 9px;
  border: 1px solid #b7c7d2;
  border-radius: 3px;
  color: #526879;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}

.invoice-ready-badge.ready {
  border-color: #4d8b67;
  color: #245b3a;
  background: #eef8f1;
}

.invoice-finish-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.invoice-finish-summary div {
  min-height: 50px;
  padding: 8px 9px;
  border: 1px solid #bfd0dc;
  background: #fff;
}

.invoice-finish-summary span {
  display: block;
  color: #5c7283;
  font-size: 11px;
}

.invoice-finish-summary strong {
  display: block;
  margin-top: 5px;
  color: #123650;
  font-size: 16px;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: start center;
  padding: 28px 18px;
  overflow: auto;
  background: rgba(14, 36, 52, 0.38);
}

.standard-modal {
  display: grid;
  width: min(760px, 100%);
  min-width: 0;
  max-height: calc(100vh - 56px);
  max-width: 100%;
  overflow: hidden;
  border: 1px solid #87a6bb;
  background: #f8fbfd;
  box-shadow: 0 18px 42px rgba(14, 36, 52, 0.28);
}

.standard-modal.wide {
  width: min(1180px, 100%);
}

.modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border-bottom: 1px solid #b7ccda;
  background: linear-gradient(#eff7fc, #d9eaf5);
}

.modal-head h3 {
  margin: 0;
  color: #123650;
  font-size: 17px;
}

.modal-head p {
  margin-top: 3px;
}

.modal-close {
  min-width: 72px;
}

.modal-body {
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  padding: 12px;
  overflow: auto;
}

.email-draft-panel {
  display: grid;
  gap: 8px;
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
}

.email-draft-panel h3 {
  margin: 0;
}

.email-draft-panel textarea {
  min-height: 92px;
}

.email-draft-grid {
  grid-template-columns: minmax(180px, 1fr) minmax(160px, 0.8fr) minmax(240px, 1.2fr);
}

.money-in-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

.money-in-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 10px;
  align-items: stretch;
  min-width: 0;
  max-width: 100%;
}

.money-in-panel > *,
.money-in-summary > *,
.ar-filter-drawer,
.ar-receivables-toolbar,
.ar-section-anchor {
  min-width: 0;
  max-width: 100%;
}

.ar-metrics {
  grid-template-columns: repeat(4, minmax(125px, 1fr));
}

.ar-metrics .metric {
  min-height: 78px;
}

.ar-metric-button {
  width: 100%;
  position: relative;
  display: grid;
  gap: 6px;
  align-content: center;
  cursor: pointer;
  text-align: left;
  border-color: #83a8c1;
  background: linear-gradient(#ffffff, #eef6fb);
  box-shadow: inset 3px 0 0 #8eb1c8, inset 0 1px 0 #fff;
}

.ar-metric-button:hover,
.ar-metric-button:focus-visible {
  border-color: #2f78ad;
  background: linear-gradient(#ffffff, #e7f3fb);
  box-shadow: inset 4px 0 0 #2f78ad, inset 0 1px 0 #fff, 0 4px 10px rgba(47, 120, 173, 0.14);
}

.ar-metric-button:active {
  box-shadow: inset 4px 0 0 #2f78ad, inset 0 2px 4px rgba(22, 58, 83, 0.12);
}

.ar-metric-button small {
  display: block;
  color: #607789;
  font-size: 11px;
  font-weight: 700;
}

.ar-section-anchor {
  scroll-margin-top: calc(var(--menu-bar-height) + 14px);
}

.ar-section-anchor .table-wrap {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
  overflow-y: visible;
}

.ar-section-anchor .table-scroll,
.ar-section-anchor .table-scroll-top {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.overdue-metric strong {
  color: #8b3f1f;
}

.ar-collect-card {
  display: grid;
  gap: 10px;
  align-content: space-between;
  padding: 12px;
  border: 1px solid #8fb1c7;
  border-radius: 4px;
  background: linear-gradient(#fffdf7, #edf6fb);
  box-shadow: inset 0 1px 0 #fff;
}

.ar-collect-card strong {
  display: block;
  margin-top: 3px;
  font-size: 16px;
}

.ar-collect-card p {
  margin: 4px 0 0;
}

.ar-collect-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.ar-collect-actions button {
  min-height: 34px;
  padding-inline: 13px;
}

.money-in-form,
.payment-draft-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
}

.money-in-form {
  border-left: 4px solid #2f78ad;
}

.money-in-form h3,
.payment-draft-panel h3 {
  margin: 0;
}

.ar-receivables-toolbar {
  align-items: center;
}

.ar-receivables-toolbar .receivables-search-filter {
  flex: 1 1 360px;
  grid-template-columns: auto minmax(220px, 1fr);
}

.ar-receivables-toolbar .receivables-sort-filter {
  flex: 0 1 300px;
  grid-template-columns: auto minmax(170px, 1fr);
}

.ar-filter-drawer {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
  padding: 9px;
  border: 1px solid #a8b9c6;
  border-top: 0;
  background: linear-gradient(#fbfdff, #edf4f9);
}

.receive-row-button {
  min-width: 76px;
}

.tab-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.tab-strip button.active {
  border-color: #2e6898;
  background: linear-gradient(#dff0fc, #b9d6eb);
  font-weight: 700;
}

.tab-strip button.utility {
  margin-left: auto;
}

.smoke-tabs {
  margin: 8px 0;
}

.smoke-panel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.95fr);
  gap: 10px;
  align-items: start;
}

.smoke-admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.retail-admin-forms,
.retail-admin-tables {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.retail-admin-forms {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.retail-form-panel {
  padding: 10px;
  border: 1px solid #9fb6c7;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #edf5fb);
}

.retail-admin-tables .table-wrap {
  margin-top: 0;
  min-width: 0;
  overflow: auto;
}

.smoke-form-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.form-grid.smoke-form-grid {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}

.smoke-catalog-form,
.smoke-pos-form,
.smoke-receiving-form,
.smoke-master-form {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
}

.smoke-catalog-view {
  display: grid;
  gap: 10px;
}

.smoke-catalog-actions {
  padding: 9px 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.smoke-pos-form {
  grid-template-columns: 1fr;
}

.smoke-current-panel {
  grid-template-columns: 1fr;
  min-width: 0;
}

.smoke-receiving-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.8fr);
  gap: 10px;
  align-items: start;
}

.smoke-receiving-form,
.smoke-receiving-cart,
.smoke-restock-panel,
.smoke-recent-receiving {
  min-width: 0;
}

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

.smoke-receiving-form > .form-grid,
.smoke-receiving-form > .form-actions,
.smoke-receiving-form > .receive-product-preview {
  grid-column: 1 / -1;
}

.smoke-receiving-cart,
.smoke-restock-panel,
.smoke-recent-receiving {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.smoke-restock-panel {
  grid-column: 2;
  grid-row: 1;
}

.smoke-receiving-cart,
.smoke-recent-receiving {
  grid-column: 1 / -1;
}

.receive-product-preview {
  display: grid;
  gap: 3px;
  padding: 7px 8px;
  border: 1px solid #c0d1de;
  background: #f8fbfe;
}

.receive-product-preview strong {
  color: #24475f;
}

.receive-product-preview span {
  color: #5a7184;
  font-size: 11px;
}

.receive-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 7px;
}

.receive-summary div {
  display: grid;
  gap: 2px;
  padding: 7px;
  border: 1px solid #c2d2df;
  background: #f8fbfe;
}

.receive-summary span {
  color: #5a7184;
  font-size: 11px;
}

.receive-summary strong {
  color: #17374e;
  font-size: 14px;
}

.smoke-sale-total {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: center;
  padding: 8px;
  border: 1px solid #b8c9d6;
  background: #f8fbfe;
}

.smoke-sale-total strong {
  flex-basis: 100%;
  font-size: 18px;
  color: #163a52;
}

.smoke-pos-form > .form-grid,
.smoke-pos-form > .check.inline,
.smoke-pos-form > .form-actions {
  grid-column: 1 / -1;
}

.smoke-product-card {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid #c8d6e1;
  background: #f8fbfe;
}

.distribution-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
}

.distribution-panel,
.distribution-panel-wide {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.distribution-panel-wide {
  grid-column: 1 / -1;
}

.distribution-mini-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 7px;
}

.distribution-mini-metrics div {
  display: grid;
  gap: 2px;
  min-height: 50px;
  padding: 7px;
  border: 1px solid #c2d2df;
  background: #f8fbfe;
}

.distribution-mini-metrics span {
  color: #5a7184;
  font-size: 11px;
}

.distribution-mini-metrics strong {
  color: #17374e;
  font-size: 14px;
}

.distribution-table-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.distribution-table-grid .table-wrap,
.distribution-panel .table-wrap {
  min-width: 0;
  margin-top: 0;
  overflow: auto;
}

.distribution-checklist {
  display: grid;
  gap: 5px;
}

.distribution-checklist span {
  min-height: 28px;
  padding: 6px 8px;
  border: 1px solid #c6d5df;
  border-left: 4px solid #3f789d;
  background: #f8fbfe;
  color: #27485e;
}

.restock-po-strip {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(140px, 180px) auto;
  gap: 8px;
  align-items: end;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #c6d5df;
}

.management-center .owner-command-center {
  margin-top: 12px;
}

.role-home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px;
  margin: 10px 0;
}

.role-home-panel {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.role-home-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.role-home-actions button {
  display: grid;
  gap: 3px;
  min-height: 64px;
  justify-items: start;
  text-align: left;
}

.role-home-actions button span {
  color: #506a7c;
  font-size: 11px;
  font-weight: 400;
}

.role-home-review-list {
  display: grid;
  gap: 6px;
}

.role-home-review-list button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2px 8px;
  align-items: center;
  min-height: 50px;
  text-align: left;
}

.role-home-review-list small {
  grid-column: 2;
  color: #506a7c;
}

.owner-action-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.owner-action-button {
  display: grid;
  gap: 4px;
  align-content: start;
  min-height: 62px;
  padding: 10px 12px;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  color: #173b54;
  background: linear-gradient(#ffffff, #edf5fa);
  text-align: left;
}

.owner-action-button:hover {
  border-color: #2f7aa5;
  background: linear-gradient(#f2fbff, #dff1fb);
}

.owner-action-button strong,
.owner-action-button span {
  display: block;
  min-width: 0;
}

.owner-action-button strong {
  font-size: 13px;
  line-height: 1.2;
}

.owner-action-button span {
  color: #526b7f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.owner-review-simple > .dashboard-chart-grid.owner-grid,
.owner-review-simple > .owner-review-workbench,
.owner-review-simple > .table-wrap {
  display: none;
}

.owner-review-workbench {
  display: grid;
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin-top: 10px;
}

.owner-note-panel {
  align-self: start;
}

.owner-note-form {
  grid-template-columns: 1fr;
}

.owner-note-form .span-2 {
  grid-column: 1;
}

.owner-note-form textarea {
  min-height: 82px;
}

.owner-attention-panel {
  align-self: start;
}

.owner-review-center .section-actions button.active {
  border-color: #4b8b64;
  color: #245a38;
  background: #edf7ef;
}

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

.pos-workspace > * {
  min-width: 0;
  max-width: 100%;
}

.pos-workspace-header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #edf5fb);
  box-shadow: inset 0 1px 0 #fff;
}

.pos-workspace-header h2,
.pos-workspace-header p {
  margin: 0;
}

.pos-workspace-header h2 {
  color: #12324a;
}

.pos-workspace-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  align-items: center;
}

.pos-workspace-header.focus {
  position: sticky;
  top: 0;
  z-index: 20;
  border-color: #6f8ca3;
  min-height: 64px;
  background: linear-gradient(#fdfefe, #e0edf6);
}

.pos-role-actions,
.pos-payment-buttons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 7px;
}

.pos-role-actions button,
.pos-payment-buttons button {
  min-height: 44px;
  font-weight: 700;
}

.pos-focus-workspace .pos-role-actions {
  position: sticky;
  top: 74px;
  z-index: 19;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  padding: 4px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: #eef6fb;
}

.pos-focus-workspace .pos-role-actions button {
  min-height: 52px;
  font-size: 15px;
}

.pos-inventory-desk {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #89a8bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f4f9fc);
}

.pos-inventory-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.pos-inventory-title h3,
.pos-inventory-title p {
  margin: 0;
}

.pos-inventory-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(72px, 1fr));
  gap: 7px;
}

.pos-inventory-summary span {
  display: grid;
  gap: 2px;
  min-height: 48px;
  padding: 7px;
  border: 1px solid #aec3d3;
  background: #f7fbfe;
  font-size: 12px;
}

.pos-inventory-summary strong {
  font-size: 18px;
  color: #12324a;
}

.pos-inventory-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 180px));
  gap: 7px;
}

.pos-stock-check,
.pos-receive-panel {
  display: grid;
  gap: 9px;
}

.pos-stock-check > label input {
  min-height: 38px;
  font-size: 16px;
}

.pos-receive-meta,
.pos-missing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 7px;
  align-items: end;
}

.pos-receive-lines {
  display: grid;
  gap: 6px;
}

.pos-receive-line {
  display: grid;
  grid-template-columns: 34px minmax(140px, 1fr) minmax(220px, 2fr) 92px auto auto;
  gap: 6px;
  align-items: center;
}

.pos-receive-line:has(input[placeholder="Unit cost"]) {
  grid-template-columns: 34px minmax(130px, 1fr) minmax(190px, 2fr) 84px 100px auto auto;
}

.pos-receive-line .line-number {
  display: grid;
  place-items: center;
  min-height: 32px;
  border: 1px solid #aec3d3;
  background: #eaf3f9;
  font-weight: 700;
}

.pos-missing-item {
  border: 1px solid #b7c9d7;
  background: #fbfdff;
  padding: 8px;
}

.pos-missing-item summary {
  cursor: pointer;
  font-weight: 700;
}

.pos-pin-screen {
  min-height: calc(100vh - 16px);
  display: grid;
  place-items: center;
  padding: 18px;
  position: relative;
}

.pos-pin-panel {
  width: min(560px, 100%);
  display: grid;
  gap: 14px;
  padding: 24px;
  border: 1px solid #84a1b7;
  border-radius: 6px;
  background: linear-gradient(#ffffff, #eef6fb);
  box-shadow: 0 8px 24px rgba(38, 74, 102, 0.16);
}

.pos-pin-panel h2,
.pos-pin-panel p {
  margin: 0;
}

.pos-pin-panel h2 {
  font-size: 26px;
}

.pos-pin-panel input {
  min-height: 56px;
  font-size: 26px;
  text-align: center;
  letter-spacing: 0;
}

.pos-pin-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  gap: 10px;
  align-items: stretch;
}

.pos-pin-entry button {
  min-height: 56px;
  font-weight: 700;
}

.pos-pin-keypad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.pos-pin-keypad button {
  min-height: 68px;
  font-size: 20px;
  font-weight: 700;
}

.pos-pin-panel > button.primary {
  min-height: 58px;
  font-size: 18px;
}

.pos-focus-workspace .pos-register-grid {
  grid-template-columns: minmax(0, 3fr) minmax(420px, 2fr);
}

.pos-simple-checkout.pos-focus-workspace .pos-register-grid {
  grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
  max-width: 1320px;
  margin: 0 auto;
}

.pos-register-grid {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(380px, 2fr);
  gap: 10px;
  align-items: start;
}

.pos-register-panel,
.pos-tender-panel,
.gift-card-guide article {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.pos-register-panel,
.pos-tender-panel {
  min-width: 0;
}

.pos-refund-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.pos-refund-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(150px, 0.7fr) minmax(170px, 0.8fr);
  gap: 8px;
  align-items: end;
}

.pos-refund-grid .wide {
  grid-column: 1 / -1;
}

.pos-refund-summary {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  padding: 8px;
  border: 1px solid #bdd0de;
  background: #f7fbfe;
}

.pos-refund-summary span {
  color: #607486;
}

.pos-focus-workspace .pos-register-panel,
.pos-focus-workspace .pos-tender-panel {
  padding: 12px;
}

.pos-simple-checkout .pos-workspace-header.focus {
  max-width: 1320px;
  margin: 0 auto;
}

.pos-simple-checkout .pos-register-panel {
  gap: 10px;
}

.pos-simple-checkout .pos-simple-scan-row {
  grid-template-columns: minmax(260px, 1fr) minmax(84px, 110px) minmax(220px, 0.8fr) minmax(120px, 150px);
}

.pos-simple-checkout .pos-simple-lookup-row {
  grid-template-columns: minmax(260px, 1fr) minmax(120px, 150px);
}

.pos-simple-checkout .pos-total-box {
  font-size: 15px;
}

.pos-simple-checkout .pos-total-box .total-due {
  font-size: 20px;
}

.pos-simple-checkout .pos-payment-buttons {
  grid-template-columns: 1fr;
}

.pos-simple-checkout .pos-payment-buttons button {
  min-height: 72px;
  font-size: 18px;
}

.pos-simple-checkout .pos-simple-tender-row {
  grid-template-columns: minmax(92px, 1fr) minmax(84px, 110px) 56px;
}

.pos-simple-checkout .section-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.pos-simple-checkout .section-actions .primary {
  min-height: 58px;
  font-size: 18px;
}

.pos-focus-workspace .pos-register-meta {
  grid-template-columns: repeat(5, minmax(140px, 1fr));
}

.pos-focus-workspace .pos-register-meta label.wide {
  grid-column: span 2;
}

.pos-focus-workspace input,
.pos-focus-workspace select,
.pos-focus-workspace button {
  min-height: 40px;
}

.pos-register-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 7px;
}

.pos-register-meta label.wide {
  grid-column: span 2;
}

.pos-cashier-strip {
  display: grid;
  grid-template-columns: minmax(150px, 0.7fr) minmax(240px, 1.2fr) auto auto;
  gap: 7px;
  align-items: end;
  padding: 8px;
  border: 1px solid #bdd0de;
  border-radius: 3px;
  background: #f7fbfe;
}

.pos-cashier-strip button {
  min-width: 112px;
}

.pos-quick-customer {
  display: grid;
  grid-template-columns: minmax(170px, 1.2fr) minmax(110px, 0.75fr) minmax(120px, 0.8fr) auto minmax(100px, 0.65fr) minmax(110px, 0.65fr) auto;
  gap: 7px;
  align-items: end;
  padding: 8px;
  border: 1px solid #9fb8ca;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #eef7ed);
}

.pos-quick-customer > strong {
  align-self: center;
  color: #245a38;
}

.pos-register-tools {
  display: flex;
  justify-content: flex-start;
  gap: 7px;
}

.pos-add-cashier {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px;
}

.pos-add-cashier button {
  min-width: 48px;
  padding: 0 8px;
}

.pos-scan-row,
.pos-gift-card-issue {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 7px;
  align-items: end;
}

.pos-focus-workspace .pos-scan-row {
  grid-template-columns: minmax(260px, 1.1fr) minmax(96px, 120px) minmax(240px, 0.8fr) minmax(160px, 0.55fr);
}

.pos-scan-row + .pos-scan-row {
  grid-template-columns: minmax(200px, 1fr) auto minmax(90px, 120px);
}

.pos-scan-row .item-search-picker {
  width: 100%;
}

.pos-scan-row .item-search-picker input {
  width: 100%;
}

.pos-qty-shortcuts {
  display: grid;
  grid-template-columns: repeat(4, minmax(52px, 1fr));
  gap: 6px;
  align-items: end;
}

.pos-qty-shortcuts button {
  min-height: 40px;
  font-weight: 700;
}

.pos-qty-cell {
  display: grid;
  grid-template-columns: 36px minmax(68px, 1fr) 36px 48px;
  gap: 4px;
  align-items: center;
}

.pos-qty-cell input {
  min-width: 0;
  text-align: center;
}

.pos-compliance-banner {
  display: grid;
  gap: 3px;
}

.pos-compliance-banner strong {
  color: #12324a;
}

.pos-compliance-banner small {
  color: #536f82;
}

.pos-gift-card-issue {
  grid-template-columns: minmax(130px, auto) minmax(140px, 1fr) 110px minmax(140px, 1fr) auto;
  align-items: center;
  padding: 8px;
  border: 1px solid #b8c9d6;
  background: #f8fbfe;
}

.pos-gift-card-issue strong {
  color: #24475f;
}

.pos-total-box {
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid #9db6c9;
  background: linear-gradient(#f9fcff, #e7f0f7);
}

.pos-total-box span,
.pos-tender-row {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) minmax(90px, auto);
  gap: 6px;
  align-items: center;
}

.pos-total-box strong {
  text-align: right;
}

.pos-total-box .total-due {
  padding-top: 5px;
  border-top: 1px solid #bdd0de;
  color: #123650;
  font-size: 16px;
  font-weight: 700;
}

.pos-total-box .paid {
  color: #20603a;
}

.pos-total-box .due {
  color: #8b3428;
}

.pos-tender-list {
  display: grid;
  gap: 7px;
}

.pos-tender-row {
  grid-template-columns: minmax(78px, 0.95fr) minmax(64px, 78px) minmax(70px, 1fr) 40px;
  gap: 4px;
}

.pos-tender-row strong {
  display: grid;
  gap: 2px;
  color: #24475f;
  line-height: 1.15;
}

.pos-tender-row strong small {
  color: #6b7f8f;
  font-size: 10px;
  font-weight: 600;
}

.pos-tender-row input {
  min-width: 0;
}

.pos-tender-row button.small {
  width: 100%;
  min-width: 0;
  padding: 0 2px;
  font-size: 11px;
}

.pos-focus-workspace .pos-tender-panel {
  position: sticky;
  top: 136px;
  max-height: calc(100vh - 148px);
  overflow: auto;
}

.pos-focus-workspace .pos-payment-buttons {
  grid-template-columns: repeat(2, minmax(120px, 1fr));
}

.pos-focus-workspace .pos-payment-buttons button {
  min-height: 64px;
  font-size: 16px;
}

.pos-focus-workspace .pos-tender-row {
  grid-template-columns: minmax(92px, 0.8fr) minmax(82px, 92px) minmax(100px, 1fr) 54px;
  gap: 6px;
}

.pos-gift-card-ledger,
.gift-card-guide {
  display: grid;
  gap: 10px;
}

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

.gift-card-guide article h4 {
  margin: 0;
  color: #23445e;
  font-size: 13px;
}

.gift-card-guide article p {
  color: #38566d;
  line-height: 1.45;
}

.invoice-line-header,
.invoice-line {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 80px 110px 110px;
  gap: 6px;
}

.invoice-line-header.with-tax,
.invoice-line.with-tax {
  grid-template-columns: minmax(220px, 1fr) 80px 110px 110px 92px;
}

.invoice-item-cell {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.invoice-items-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #9fb5c7;
  background: #f4f8fb;
}

.invoice-items-head {
  display: flex;
  align-items: center;
  gap: 10px;
}

.invoice-items-head h3 {
  margin: 0;
}

.invoice-items-head p {
  margin-top: 2px;
}

.invoice-add-strip {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid #c4d4df;
  background: #fff;
}

.invoice-scan-field {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.invoice-scan-control {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 112px;
  gap: 6px;
}

.invoice-lines-stack {
  display: grid;
  gap: 8px;
}

.invoice-entry-line {
  display: grid;
  gap: 8px;
  align-items: start;
  min-width: 0;
  max-width: 100%;
  padding: 9px;
  border: 1px solid #c4d4df;
  background: #fff;
}

.invoice-entry-line.simple {
  grid-template-columns: minmax(240px, 1fr) 74px 108px 104px 132px;
}

.invoice-entry-line.with-cost {
  grid-template-columns: minmax(240px, 1fr) 74px 108px 108px 104px 132px;
}

.invoice-item-entry {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.invoice-line-kicker {
  color: #193d57;
  font-size: 12px;
  font-weight: 700;
}

.invoice-selected-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 33px;
  padding: 6px 8px;
  border: 1px solid #b8cdda;
  background: #f7fbfd;
}

.invoice-selected-copy {
  min-width: 0;
}

.invoice-selected-copy strong,
.invoice-selected-copy small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.invoice-selected-copy small {
  color: #5d7281;
  font-size: 11px;
}

.invoice-last-sale-lookup {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
  min-width: 0;
}

.invoice-last-sale-lookup .muted {
  font-size: 11px;
}

.invoice-last-sale-lookup button,
.invoice-selected-actions button.tiny {
  min-height: 24px;
}

.invoice-selected-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 4px;
}

.invoice-line-actions {
  margin-top: 1px;
}

.invoice-add-selected {
  min-width: 112px;
  min-height: 38px;
  padding: 7px 14px;
  font-weight: 800;
}

.invoice-line-confirm {
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.invoice-items-footer {
  display: flex;
  justify-content: flex-end;
  padding-top: 2px;
}

.invoice-mini-field {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
  color: #334f64;
  font-weight: 700;
}

.invoice-mini-field input {
  width: 100%;
  min-width: 0;
}

.invoice-tax-toggle {
  min-height: 29px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #425a6d;
  font-weight: 400;
}

.inline-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.invoice-customer-field {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.invoice-customer-create {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  color: #526b7e;
  font-size: 12px;
}

.payment-terms-field {
  min-width: 0;
}

.payment-terms-control {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) minmax(110px, .85fr);
  gap: 5px;
  align-items: center;
}

.payment-terms-control select,
.payment-terms-control input {
  min-width: 0;
}

.invoice-lines-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0 6px;
  padding: 8px;
  border: 1px solid #a8b9c6;
  background: linear-gradient(#f8fbfe, #e8f0f6);
}

.invoice-lines-toolbar h3 {
  margin: 0;
}

.invoice-lines-toolbar p {
  margin-top: 2px;
}

.add-next-line-button {
  min-height: 34px;
  padding: 6px 14px;
  font-weight: 800;
  transform: none;
  transition: border-color 130ms ease, background 130ms ease, filter 110ms ease, box-shadow 110ms ease;
}

.add-next-line-button:active,
.add-next-line-button.button-click-feedback {
  transform: none;
  animation: none;
}

.simple-accounting-preview {
  margin-top: 8px;
  color: #435c70;
}

.simple-accounting-preview summary {
  width: max-content;
  max-width: 100%;
  cursor: pointer;
  font-weight: 700;
}

.simple-accounting-preview .journal-preview {
  margin-top: 8px;
}

.simple-accounting-preview:not([open]) .journal-preview {
  display: none;
}

.invoice-quick-item {
  margin: 8px 0;
}

.barcode-scan-panel {
  display: grid;
  gap: 8px;
  margin: 8px 0;
}

.barcode-scan-row {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 130px;
  gap: 6px;
  align-items: center;
}

.inventory-receive-row {
  grid-template-columns: minmax(160px, 1.1fr) minmax(180px, 1.3fr) 90px 110px minmax(140px, 1fr) minmax(130px, 1fr) 110px;
}

.inventory-receive-row.secondary {
  grid-template-columns: 150px minmax(260px, 1fr);
}

@media (max-width: 980px) {
  .barcode-scan-row,
  .invoice-entry-line.simple,
  .invoice-entry-line.with-cost,
  .invoice-finish-summary,
  .invoice-scan-field,
  .invoice-scan-control,
  .invoice-workflow-rail,
  .inventory-receive-row,
  .inventory-receive-row.secondary,
  .payment-terms-control {
    grid-template-columns: 1fr;
  }
}

.invoice-tax-panel {
  display: grid;
  gap: 8px;
  background: linear-gradient(#ffffff, #edf6fc);
}

.invoice-tax-controls {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(260px, 1fr);
  gap: 8px;
  align-items: end;
}

.invoice-tax-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(90px, 1fr));
  gap: 6px;
}

.invoice-tax-summary div {
  min-height: 44px;
  padding: 7px 8px;
  border: 1px solid #a8b9c6;
  background: #fff;
}

.invoice-tax-summary span {
  display: block;
  color: #566d7e;
  font-size: 11px;
}

.invoice-tax-summary strong {
  display: block;
  margin-top: 4px;
  color: #123852;
  font-size: 14px;
}

.invoice-tax-setup {
  display: grid;
  gap: 8px;
}

.tax-line-check {
  align-self: center;
  justify-content: center;
  min-height: 30px;
  white-space: nowrap;
}

.bill-line-header,
.bill-line {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) minmax(190px, 1fr) 80px 100px 100px;
  gap: 6px;
}

.po-line-wrap {
  display: grid;
  gap: 5px;
}

.po-line {
  grid-template-columns: minmax(190px, 1fr) minmax(210px, 1fr) 82px 110px 92px;
  align-items: center;
}

.po-line-note {
  width: 100%;
  min-height: 28px;
}

.purchase-orders-center {
  display: grid;
  gap: 12px;
}

.purchase-order-form,
.purchase-fulfillment-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #91aabd;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f4f9fd);
}

.purchase-fulfillment-panel .table-wrap {
  margin-top: 0;
}

.purchase-fulfillment-panel .table-amount-input {
  width: 96px;
}

.ap-check-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
}

.ap-check-panel h3 {
  margin: 0;
}

.check-run-form {
  grid-template-columns: 150px minmax(230px, 1fr) 150px;
}

.invoice-line-header,
.bill-line-header,
.line-header {
  color: #334f64;
  font-size: 11px;
  font-weight: 700;
}

.form-grid {
  display: grid;
  grid-template-columns: 150px minmax(220px, 1fr) 180px;
  gap: 7px;
}

label {
  display: grid;
  gap: 3px;
  color: #425a6d;
  font-size: 12px;
}

.line-header,
.entry-line {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 130px 130px;
  gap: 7px;
  align-items: center;
}

.journal-form .form-grid {
  grid-template-columns: 150px minmax(280px, 1fr) 180px;
}

.journal-form {
  max-width: 920px;
  display: grid;
  gap: 10px;
}

.journal-balance-strip {
  margin-bottom: 10px;
}

.journal-lines {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 1px solid #c8d6e1;
  background: #f8fbfe;
}

.journal-lines .line-header,
.journal-lines .entry-line {
  grid-template-columns: minmax(210px, 1.15fr) minmax(180px, 1fr) minmax(96px, 0.5fr) minmax(96px, 0.5fr) auto;
}

.journal-lines .entry-line button {
  width: 100%;
}

.save-note {
  min-height: 24px;
  display: flex;
  align-items: center;
  color: #245f3d;
  font-weight: 700;
}

.save-note.inline {
  min-height: 0;
}

.check.inline {
  display: inline-flex;
  grid-template-columns: none;
  align-items: center;
  gap: 5px;
}

.form-actions,
.row-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.order-link-disclosure > summary {
  min-height: 34px;
  cursor: pointer;
  color: #25465d;
  font-weight: 800;
}

.invoice-finish-panel {
  position: sticky;
  bottom: 0;
  z-index: 12;
  border-color: #86a6bd;
  box-shadow: 0 -4px 12px rgba(33, 56, 74, 0.12);
}

.report-overview-grid,
.bank-workflow-rail {
  display: grid;
  gap: 10px;
  margin: 10px 0;
}

.report-overview-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.report-overview-card {
  min-height: 84px;
  display: grid;
  gap: 5px;
  align-content: center;
  padding: 12px;
  border: 1px solid #91aabd;
  border-radius: 4px;
  text-align: left;
  background: linear-gradient(#ffffff, #f3f8fc);
}

.report-overview-card strong {
  color: #16384f;
  font-size: 16px;
}

.report-overview-card span {
  color: #566d7e;
}

.reports-workflow {
  position: relative;
}

.report-memory-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin: 10px 0;
  padding: 9px 10px;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #eef5f9);
}

.reports-title-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.reports-title-row h2 {
  margin: 0;
}

.reports-title-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.reports-title-actions button:disabled,
.report-output-actions button:disabled {
  display: none;
}

.reports-title-actions button.active {
  border-color: #4b8b64;
  color: #245a38;
  background: #edf7ef;
}

.report-star-button {
  width: 34px;
  min-width: 34px;
  height: 32px;
  padding: 0;
  font-size: 20px;
  line-height: 1;
}

.report-star-button.active {
  color: #9b6400;
  border-color: #c98d18;
  background: #fff4d7;
}

.report-favorites-tray {
  position: absolute;
  top: 42px;
  left: 0;
  z-index: 60;
  width: min(560px, calc(100vw - 120px));
  max-height: min(620px, calc(100vh - 150px));
  overflow: auto;
  margin: 0;
  padding: 0;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fa);
  box-shadow: 0 10px 24px rgba(36, 68, 91, 0.22);
}

.shared-report-tray {
  width: 100%;
  max-height: min(760px, calc(100vh - 120px));
  overflow: auto;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fa);
  box-shadow: 0 8px 20px rgba(36, 68, 91, 0.16);
}

.report-inquiry-slot {
  padding: 12px;
}

.report-inquiry-slot .shared-report-tray {
  max-height: none;
  overflow: visible;
}

.report-inquiry-workflow .report-guide {
  grid-template-columns: minmax(0, 1fr);
}

.report-inquiry-workflow .report-guide-steps,
.report-inquiry-workflow .report-topic-panel,
.report-inquiry-workflow .report-period-panel,
.report-inquiry-workflow .report-choice-panel {
  display: none;
}

.report-inquiry-workflow .report-output-panel {
  grid-column: 1;
  grid-row: auto;
  min-height: 0;
  position: static;
}

.report-inquiry-workflow .reports-title-actions > button:not(.report-top-button),
.report-inquiry-workflow .reports-title-actions > .count-chip {
  display: none;
}

.report-inquiry-workflow .reports-title-actions .report-top-button {
  min-width: 105px;
}

.report-inquiry-top-tray {
  width: min(620px, calc(100vw - 120px));
}

.report-inquiry-main .report-step-heading {
  margin-bottom: 8px;
}

.shared-report-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  border-bottom: 1px solid #cbdbe6;
  background: linear-gradient(#ffffff, #eef6fb);
}

.shared-report-head strong,
.shared-report-head span {
  display: block;
}

.shared-report-head strong {
  color: #16384f;
}

.shared-report-head span,
.shared-report-help {
  color: #5c7283;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.35;
}

.shared-report-help {
  margin: 8px 9px 0;
}

.shared-report-tray .compact-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 8px 9px 2px;
}

.shared-report-tray .compact-form .span-2 {
  grid-column: 1 / -1;
}

.shared-report-tray .compact-form label,
.shared-report-tray .compact-form input,
.shared-report-tray .compact-form select,
.shared-report-tray .compact-form textarea {
  min-width: 0;
  width: 100%;
}

.report-inquiry-snapshot-form {
  margin-top: 6px;
  padding-bottom: 8px;
  border-bottom: 1px solid #d3e0e8;
}

.report-inquiry-card-section {
  min-width: 0;
}

.mini-report-topic-grid,
.mini-report-choice-grid {
  display: grid;
  gap: 7px;
}

.mini-report-topic-grid {
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
}

.mini-report-choice-grid {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.mini-report-card,
.mini-report-choice {
  display: grid;
  gap: 3px;
  min-width: 0;
  min-height: 74px;
  padding: 8px 9px;
  border: 1px solid #b6cad8;
  border-radius: 4px;
  color: #24475f;
  background: linear-gradient(#ffffff, #f3f8fb);
  text-align: left;
}

.mini-report-card:hover,
.mini-report-card.active,
.mini-report-choice:hover,
.mini-report-choice.active {
  border-color: #2f7aa5;
  background: linear-gradient(#f2fbff, #dff1fb);
  box-shadow: inset 3px 0 0 #2f7aa5;
}

.mini-report-card strong,
.mini-report-choice strong {
  color: #16384f;
  font-size: 13px;
  line-height: 1.2;
}

.mini-report-card small,
.mini-report-choice small {
  color: #5c7283;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.mini-report-kicker {
  color: #2f7aa5;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.report-inquiry-output-row {
  min-width: 0;
}

.mini-output-toggle {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mini-output-toggle button {
  min-height: 30px;
}

.mini-output-toggle button.active {
  color: #fff;
  border-color: #1f5d80;
  background: linear-gradient(#3f8db8, #2f7aa5);
}

.report-inquiry-period {
  min-width: 0;
}

.compact-field-label {
  display: block;
  margin-bottom: 3px;
  color: #24475f;
  font-size: 12px;
  font-weight: 800;
}

.report-inquiry-period .report-period-controls {
  margin: 0;
}

.report-inquiry-detail-page {
  display: grid;
  gap: 12px;
  max-width: 1180px;
}

.report-inquiry-detail-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 14px;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fa);
}

.report-inquiry-detail-head h2,
.report-inquiry-detail-head p {
  margin: 0;
}

.report-inquiry-detail-head h2 {
  margin-top: 2px;
  color: #16384f;
}

.report-inquiry-detail-head p {
  color: #5c7283;
  font-weight: 700;
}

.report-inquiry-detail-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 8px;
}

.report-inquiry-detail-summary > div,
.report-inquiry-question-card {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid #c9d9e4;
  border-radius: 4px;
  background: #fff;
}

.report-inquiry-detail-summary span,
.report-inquiry-question-card span {
  color: #5c7283;
  font-size: 12px;
  font-weight: 800;
}

.report-inquiry-detail-summary strong {
  color: #16384f;
}

.report-inquiry-question-card p {
  margin: 0;
  color: #1d3548;
  font-weight: 700;
  line-height: 1.4;
}

.report-inquiry-attached-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f1f7fb);
}

.report-inquiry-attached-card span,
.report-inquiry-attached-card strong,
.report-inquiry-attached-card p {
  display: block;
}

.report-inquiry-attached-card span {
  color: #5c7283;
  font-size: 12px;
  font-weight: 800;
}

.report-inquiry-attached-card strong {
  margin-top: 2px;
  color: #16384f;
  font-size: 15px;
}

.report-inquiry-attached-card p {
  margin: 2px 0 0;
  color: #5c7283;
  font-weight: 700;
}

.report-inquiry-table-card .table-wrap {
  margin: 0;
}

.report-inquiry-secondary-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.shared-report-tray .compact-form textarea {
  min-height: 72px;
  resize: vertical;
}

.shared-team-preview {
  min-width: 0;
  align-self: end;
  padding: 6px 8px;
  border: 1px solid #d3e0e8;
  border-radius: 4px;
  color: #5c7283;
  background: #f7fbfd;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.shared-report-tray .form-actions {
  padding: 7px 9px 9px;
}

.report-guide {
  display: grid;
  grid-template-columns: minmax(340px, 0.82fr) minmax(560px, 1.35fr);
  gap: 10px 12px;
  align-items: start;
  margin-bottom: 12px;
}

.report-guide-steps {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 8px;
}

.report-guide-step {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 8px;
  align-items: center;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid #9eb6c7;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf4f9);
}

.report-guide-step > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 30px;
  border-radius: 999px;
  background: #2f7aa5;
  color: #fff;
  font-weight: 900;
}

.step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 54px;
  min-height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  background: #2f7aa5;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.report-guide-step strong,
.report-guide-step small {
  display: block;
}

.report-guide-step small {
  margin-top: 2px;
  color: #587184;
  font-size: 12px;
  font-weight: 700;
}

.report-step-panel {
  padding: 12px;
  border: 1px solid #9fb7c8;
  border-radius: 4px;
  background: #fff;
}

.report-topic-panel,
.report-period-panel,
.report-choice-panel {
  grid-column: 1;
}

.report-output-panel {
  grid-column: 2;
  grid-row: 2 / span 4;
  min-height: 620px;
  position: sticky;
  top: 88px;
}

.report-step-heading {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: start;
  margin-bottom: 10px;
}

.report-step-heading h3,
.report-step-heading p {
  margin: 0;
}

.report-step-heading h3 {
  color: #16384f;
}

.report-step-heading p {
  margin-top: 2px;
  color: #5c7283;
  font-weight: 600;
}

.report-topic-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.report-topic-card {
  min-height: 82px;
  display: grid;
  gap: 5px;
  align-content: start;
  padding: 11px;
  border: 1px solid #9eb4c5;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f4f8fb);
  text-align: left;
  color: #28475d;
}

.report-topic-card.active {
  border-color: #2f7aa5;
  background: linear-gradient(#eaf5fb, #d7ebf6);
  box-shadow: inset 0 0 0 1px #2f7aa5;
}

.report-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.report-choice-card {
  min-height: 60px;
  display: grid;
  gap: 5px;
  align-content: start;
  padding: 10px;
  border: 1px solid #9eb4c5;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f5f9fc);
  text-align: left;
}

.report-choice-card.active {
  border-color: #2f7aa5;
  background: linear-gradient(#eaf5fb, #d7ebf6);
  box-shadow: inset 0 0 0 1px #2f7aa5;
}

.report-choice-card strong {
  color: #16384f;
}

.report-choice-card span {
  color: #5d7282;
  line-height: 1.35;
}

.report-step-empty {
  padding: 10px;
  border: 1px dashed #abc0ce;
  border-radius: 4px;
  color: #5c7283;
  background: #f7fbfd;
  font-weight: 700;
}

.report-output-actions,
.report-result-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.report-output-actions button.active {
  border-color: #2f7aa5;
  color: #143d55;
  background: #e6f2f9;
  box-shadow: inset 0 0 0 1px #2f7aa5;
}

.report-topic-card strong {
  color: #15384f;
  font-size: 16px;
}

.report-topic-card span:last-child {
  color: #5d7282;
  line-height: 1.35;
}

.report-topic-card .report-topic-list {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid #d6e2ea;
  color: #274d65;
  font-size: 12px;
  font-weight: 800;
}

.report-topic-kicker {
  color: #35637f;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.report-current-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 9px 10px;
  border: 1px solid #b2c4d1;
  border-radius: 4px;
  background: #f7fbfd;
}

.report-result-section {
  margin-top: 10px;
  max-height: calc(100vh - 245px);
  overflow: auto;
}

.report-result-heading {
  position: sticky;
  top: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0 9px;
  background: #fff;
  border-bottom: 1px solid #d3e0e8;
}

.report-focus-metrics {
  margin: 10px 0 0;
}

.report-detail-drawer {
  border: 1px solid #a5bbc9;
  border-radius: 4px;
  background: #fff;
}

.report-detail-drawer > summary {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  cursor: pointer;
  color: #24445b;
  font-weight: 900;
}

.report-detail-drawer {
  margin-top: 10px;
}

.report-detail-drawer > .data-table,
.report-detail-drawer > .table-wrap {
  margin: 0 10px 10px;
}

.report-start-panel {
  min-height: 84px;
  display: grid;
  align-content: center;
  padding: 16px;
  border: 1px dashed #9fb7c8;
  background: #f8fbfd;
}

.report-start-panel h3,
.report-start-panel p {
  margin: 0;
}

.report-start-panel p {
  margin-top: 5px;
  color: #526c7e;
  font-weight: 600;
}

.report-result-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.report-result-heading h3,
.report-result-heading p {
  margin: 0;
}

.report-result-heading p {
  margin-top: 3px;
  color: #5c7283;
  font-weight: 600;
}

.report-memory-status {
  display: grid;
  gap: 2px;
}

.report-memory-status span,
.report-memory-row span,
.report-history-row span {
  color: #5f7383;
  font-size: 12px;
}

.report-memory-status strong {
  color: #17374e;
}

.report-memory-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.report-memory-actions button.active {
  border-color: #4b8b64;
  color: #245a38;
  background: #edf7ef;
}

.report-memory-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
}

.report-memory-panel {
  border: 0;
  border-bottom: 1px solid #d5e0e8;
  border-radius: 0;
  background: #fff;
}

.report-memory-panel:last-child {
  border-bottom: 0;
}

.report-memory-panel > summary,
.report-memory-panel-title {
  min-height: 30px;
  display: flex;
  align-items: center;
  padding: 7px 9px;
  border-bottom: 1px solid #d5e0e8;
  color: #24445b;
  font-weight: 800;
  background: #f4f9fc;
}

.report-memory-list {
  display: grid;
  gap: 4px;
  max-height: 220px;
  overflow: auto;
  padding: 4px 8px 8px;
}

.report-memory-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 5px 0;
  border-top: 1px solid #e1e9ef;
}

.report-favorites-tray .report-memory-row > span {
  display: none;
}

.report-history-row {
  display: grid;
  gap: 2px;
  justify-items: start;
  min-height: 34px;
  padding: 6px 8px;
  text-align: left;
}

.report-favorites-tray .form-actions {
  padding: 0 8px 8px;
}

.popover-actions {
  display: grid;
  gap: 5px;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid #d5e0e8;
}

.bank-workflow-rail {
  grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.bank-step {
  display: grid;
  grid-template-columns: 32px 1fr;
  column-gap: 9px;
  row-gap: 2px;
  align-items: center;
  padding: 10px;
  border: 1px solid #b8c8d4;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f4f8fb);
}

.bank-step span {
  grid-row: span 2;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: #31536b;
  background: #e5eef5;
  font-weight: 800;
}

.bank-step.active span {
  color: #fff;
  background: #2f719f;
}

.bank-step strong {
  color: #18394f;
}

.bank-step small {
  color: #64788a;
}

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

.check input,
.permission input {
  width: auto;
  min-height: auto;
}

.balance-status {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.balance-status.good {
  color: #1d6d3c;
}

.balance-status.bad {
  color: #8a3131;
}

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

.user-summary-row {
  display: grid;
  grid-template-columns: minmax(160px, 1.2fr) minmax(130px, 0.9fr) minmax(150px, 1fr) 90px auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid #a8b9c6;
  background: linear-gradient(#ffffff, #eef5fa);
}

.profile-form {
  max-width: 760px;
  display: grid;
  gap: 8px;
  border: 1px solid #91aabd;
  border-radius: 3px;
  padding: 10px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.profile-card {
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 10px;
  align-items: center;
  padding-bottom: 8px;
  border-bottom: 1px solid #d9e3eb;
}

.profile-card strong,
.profile-card span {
  display: block;
}

.profile-card span {
  color: #5d7282;
  font-size: 12px;
}

.large-avatar {
  width: 40px;
  height: 40px;
}

.profile-grid,
.profile-password-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 8px;
}

.profile-password-grid {
  padding-top: 8px;
  border-top: 1px solid #d9e3eb;
}

.data-tabs {
  margin-bottom: 8px;
}

.data-center-grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(360px, 1.1fr);
  gap: 10px;
  align-items: start;
}

.data-panel {
  min-width: 0;
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid #8ea8bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f4f9fd);
  box-shadow: inset 0 1px 0 #fff;
}

.data-panel.wide {
  grid-column: 1 / -1;
}

.csv-paste-box {
  min-height: 180px;
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
}

.bulk-edit-bar,
.report-builder-bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 7px;
  align-items: end;
}

.report-builder-bar {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.report-builder-bar input,
.report-builder-bar select,
.report-builder-bar button {
  min-width: 0;
}

.report-builder-bar .check.inline {
  align-self: center;
  white-space: nowrap;
}

.report-summary-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 8px 0;
}

.report-column-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 7px;
  border: 1px solid #c4d4df;
  background: #fff;
}

.report-column-picker label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: auto;
  min-height: 22px;
  padding: 2px 6px;
  border: 1px solid #d5e1ea;
  background: #f8fbfe;
  font-size: 12px;
}

.report-column-picker input {
  width: auto;
  min-height: auto;
}

.filterable-table th {
  vertical-align: top;
}

.table-column-head {
  position: relative;
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.table-column-head span {
  font-weight: 700;
  min-width: 0;
  overflow-wrap: anywhere;
}

.column-filter-control {
  position: relative;
  flex: 0 0 auto;
}

.column-filter-button {
  width: 26px;
  min-height: 20px;
  padding: 2px 4px;
  border: 1px solid #8fa9bc;
  border-radius: 2px;
  background: linear-gradient(#ffffff, #ddebf5);
  color: #24475f;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.1;
}

.column-filter-button.active {
  border-color: #1b6a9c;
  background: linear-gradient(#dff2ff, #a9d3ee);
  color: #0d4061;
}

.column-filter-popover {
  position: absolute;
  top: 24px;
  right: 0;
  z-index: 30;
  display: grid;
  gap: 6px;
  min-width: 190px;
  padding: 8px;
  border: 1px solid #7f9ab0;
  background: #fff;
  box-shadow: 0 8px 18px rgba(34, 58, 78, 0.2);
}

.column-filter-title {
  color: #233d52;
  font-size: 12px;
  font-weight: 700;
}

.column-filter-sort-row,
.column-filter-choice-actions {
  display: flex;
  gap: 6px;
}

.column-filter-input {
  width: 100%;
  min-height: 24px;
  padding: 3px 5px;
  border: 1px solid #9fb8cc;
  background: #fff;
  font-size: 11px;
  font-weight: 400;
}

.column-filter-choices {
  display: grid;
  gap: 2px;
  max-height: 210px;
  overflow-y: auto;
  padding: 3px;
  border: 1px solid #d2e0ea;
  background: #f8fbfe;
}

.column-filter-choices label {
  display: flex;
  gap: 6px;
  align-items: center;
  min-height: 22px;
  font-size: 12px;
}

.column-filter-choices input {
  width: auto;
  min-height: auto;
}

.compact-empty {
  padding: 5px;
  font-size: 12px;
}

.column-filter-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
}

.export-package-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(230px, 1fr));
  gap: 8px;
}

.export-package-button {
  min-height: 76px;
  display: grid;
  gap: 4px;
  align-content: center;
  text-align: left;
}

.export-package-button strong,
.export-package-button span {
  display: block;
}

.export-package-button span {
  color: #5d7282;
  font-size: 12px;
}

.people-intro,
.people-create-panel,
.person-card {
  display: grid;
  gap: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border: 1px solid #9fb9cc;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #f5f9fc);
}

.people-intro {
  grid-template-columns: minmax(260px, 1fr) minmax(320px, 0.9fr) auto;
  align-items: center;
}

.people-intro strong,
.people-intro span {
  display: block;
}

.people-intro span {
  margin-top: 3px;
  color: #5d7282;
}

.people-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(90px, 1fr));
  gap: 6px;
}

.people-intro-actions {
  display: flex;
  justify-content: flex-end;
}

.people-toolbar {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.people-toolbar > strong {
  margin-right: auto;
}

.people-toolbar input {
  flex: 1 1 240px;
  max-width: 380px;
  min-width: 160px;
}

.people-access-page > .people-access-reference { margin-top: 16px; }
.people-access-page .people-toolbar select { width: auto; max-width: 100%; flex: 0 1 auto; }
.people-access-page > .people-access-reference > summary { width: fit-content; color: #526b7d; font-size: 12px; }
.people-access-page .person-permissions { display: grid; gap: 6px; }
.people-access-page .person-permissions > [role="status"] { color: #526b7d; }
.people-access-page .person-permissions[aria-busy="true"] input { cursor: progress; }

.people-metrics > div,
.person-detail-grid > div {
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border: 1px solid #bfd0dd;
  border-radius: 4px;
  background: #ffffff;
}

.people-metrics span,
.person-detail-grid span {
  color: #5f7282;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.people-form-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(145px, 1fr));
  gap: 8px;
  align-items: end;
}

.input-with-button {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto;
  gap: 5px;
}

.people-role-note {
  display: grid;
  gap: 2px;
  padding: 8px;
  border-left: 3px solid #2f78aa;
  background: #eef7fc;
}

.people-role-note span {
  color: #526b7d;
}

.people-company-picker,
.person-company-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.company-check,
.company-access-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid #aac0cf;
  border-radius: 4px;
  background: #ffffff;
}

.company-check.active,
.company-access-pill.active {
  border-color: #2f78aa;
  background: #edf7fd;
}

.people-list {
  display: grid;
  gap: 9px;
}

.person-card {
  background: #ffffff;
}

.person-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.person-main strong,
.person-main span {
  display: block;
}

.person-main span {
  color: #5d7282;
  font-size: 12px;
}

.person-detail-grid {
  display: grid;
  grid-template-columns: minmax(150px, 0.7fr) minmax(240px, 1.4fr) minmax(90px, 0.4fr);
  gap: 6px;
}

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

.person-password-reset {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto auto auto;
  gap: 6px;
  align-items: end;
  padding: 8px;
  border: 1px solid #bdd0de;
  border-radius: 4px;
  background: #f4f9fc;
}

.person-password-reset label {
  margin: 0;
}

.role-matrix-panel {
  margin-bottom: 10px;
  padding: 9px;
  border: 1px solid #9fb9cc;
  border-radius: 4px;
  background: #ffffff;
}

.access-map-panel {
  margin-bottom: 10px;
  padding: 9px;
  border: 1px solid #9fb9cc;
  border-radius: 4px;
  background: #ffffff;
}

.column-access-callout {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  padding: 9px;
  border: 1px solid #b7c9d7;
  border-left: 3px solid #2f78aa;
  border-radius: 4px;
  background: #f4f9fc;
}

.column-access-callout span {
  color: #526b7d;
  font-size: 12px;
}

.stacked-cell {
  display: grid;
  gap: 2px;
}

.stacked-cell span {
  color: #5d7282;
  font-size: 11px;
}

.user-row {
  display: grid;
  gap: 8px;
}

.user-row-header {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.permission-panel {
  display: block;
}

.permission-panel summary {
  width: max-content;
  min-height: 26px;
  padding: 5px 9px;
  border: 1px solid #7c93a8;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #e8f0f6);
  cursor: pointer;
  font-weight: 700;
}

.permission-panel[open] summary {
  margin-bottom: 8px;
}

.help-shell {
  display: grid;
  grid-template-columns: minmax(230px, 280px) minmax(360px, 1fr) minmax(230px, 300px);
  gap: 10px;
  align-items: start;
}

.help-rail,
.help-side,
.help-panel,
.guide-detail,
.help-admin-panel {
  min-width: 0;
  border: 1px solid #91aabd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f3f8fc);
  box-shadow: inset 0 1px 0 #fff;
}

.help-rail,
.guide-detail,
.help-side,
.help-panel,
.help-admin-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.help-search-box {
  display: grid;
  gap: 7px;
  padding-bottom: 8px;
  border-bottom: 1px solid #d5e0e8;
}

.help-category-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.help-category-strip button {
  min-height: 22px;
  padding: 0 7px;
  font-size: 11px;
}

.help-category-strip button.active {
  color: #fff;
  border-color: #1b5f91;
  background: linear-gradient(#3d91c6, #1d6498);
}

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

.guide-list button {
  display: grid;
  justify-items: start;
  min-height: 48px;
  padding: 7px 8px;
  text-align: left;
  line-height: 1.2;
}

.guide-list button.active {
  color: #fff;
  border-color: #1f5f91;
  background: linear-gradient(#5d97c5, #2e6f9f);
}

.guide-list span {
  color: #5f7282;
  font-size: 11px;
}

.guide-list button.active span {
  color: #dceaf5;
}

.guide-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
  gap: 10px;
  align-items: start;
  padding-bottom: 8px;
  border-bottom: 1px solid #d5e0e8;
}

.guide-title-row h3 {
  margin: 0 0 4px;
  color: #17374e;
  font-size: 19px;
}

.guide-title-row p,
.guide-section {
  color: #38566d;
  line-height: 1.4;
}

.guide-section {
  display: grid;
  gap: 7px;
}

.guide-steps {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: guide-step;
}

.guide-steps li {
  counter-increment: guide-step;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 8px;
  border: 1px solid #d4e0e8;
  background: #fff;
}

.guide-steps li::before {
  content: counter(guide-step);
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: #fff;
  border-radius: 3px;
  background: linear-gradient(#5d97c5, #2e6f9f);
  font-size: 12px;
  font-weight: 700;
}

.guide-field-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 7px;
}

.guide-field-list div {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid #d4e0e8;
  background: #fff;
}

.guide-field-list span {
  color: #5b7182;
  font-size: 12px;
}

.help-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  align-content: start;
}

.help-actions button {
  justify-content: flex-start;
  text-align: left;
}

.help-empty {
  padding: 12px;
  color: #607789;
  border: 1px dashed #b7c6d2;
  background: #fff;
}

.help-admin-panel summary {
  cursor: pointer;
  color: #24475f;
  font-weight: 700;
}

.issue-form {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  align-items: end;
}

.issue-description textarea {
  min-height: 88px;
  resize: vertical;
}

.issue-file-note {
  margin: 0;
  color: #38566d;
  font-size: 12px;
  word-break: break-word;
}

.help-status {
  gap: 6px;
}

.help-status-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 5px 0;
  border-bottom: 1px solid #dbe5ec;
}

.help-status-row:last-child {
  border-bottom: 0;
}

.help-status-row span {
  color: #5a7082;
  font-size: 12px;
}

.help-status-row strong {
  max-width: 140px;
  overflow: hidden;
  color: #1e3d54;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.help-company-list {
  display: grid;
  gap: 6px;
}

.help-company-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid #d4e0e8;
  background: #fff;
}

.help-company-row.active {
  border-color: #2e6f9f;
  background: linear-gradient(#eef8ff, #d6ebf9);
  box-shadow: inset 3px 0 0 #2e6f9f;
}

.help-company-row div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.help-company-row strong,
.help-company-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.help-company-row span {
  color: #607789;
  font-size: 12px;
}

.help-company-row em {
  padding: 2px 6px;
  border: 1px solid #b9c9d4;
  border-radius: 999px;
  color: #38566d;
  background: #f7fbfe;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}

.help-company-row.active em {
  color: #fff;
  border-color: #1b5f91;
  background: #2e6f9f;
}

.help-admin-panel {
  margin-top: 10px;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.feature-grid.compact {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.feature-tile {
  display: grid;
  gap: 8px;
  align-content: start;
  min-height: 92px;
  padding: 10px;
  border: 1px solid #a8b9c6;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #eef5fa);
}

.feature-tile strong,
.feature-tile span {
  display: block;
}

.feature-tile span,
.feature-tile small,
.feature-metric small {
  color: #5d7282;
  font-size: 12px;
}

.feature-metric {
  min-height: 90px;
  display: grid;
  gap: 3px;
}

.module-tabs {
  margin-bottom: 10px;
}

.explainer {
  padding: 9px 10px;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: #fff;
  color: #3b5265;
  font-weight: 600;
}

.integration-grid,
.report-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 9px;
  margin-bottom: 10px;
}

.report-tabs {
  margin: 8px 0 10px;
}

.report-period-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  padding: 8px;
  margin: 8px 0 10px;
  border: 1px solid #91aabd;
  background: linear-gradient(#ffffff, #e5f0f8);
}

.report-period-panel .report-period-controls {
  margin: 0;
}

.report-period-toggle {
  margin: 0;
}

.period-field {
  width: 132px;
}

.period-chip {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid #b9c7d2;
  border-radius: 3px;
  color: #24475f;
  background: #fff;
  font-weight: 700;
}

.report-section {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.report-section h3 {
  margin-bottom: 0;
}

.quick-task-layout {
  display: grid;
  grid-template-columns: minmax(220px, 285px) minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.quick-task-layout.single-panel-layout {
  grid-template-columns: 1fr;
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}

.quick-task-list,
.quick-task-panel {
  min-width: 0;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: #fff;
}

.quick-task-list {
  padding: 10px 8px;
}

.quick-task-list h3 {
  padding: 0 6px 7px;
  margin-bottom: 7px;
  border-bottom: 1px solid #dbe5ec;
}

.quick-task {
  display: flex;
  width: 100%;
  min-height: 32px;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 4px 8px;
  border: 0;
  border-radius: 2px;
  background: transparent;
  box-shadow: none;
  text-align: left;
}

.quick-task:hover,
.quick-task.active {
  background: #e9f3fb;
}

.quick-task.ar-nav-task,
.quick-task.customer-nav-task {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  min-height: 46px;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-left-width: 4px;
}

.quick-task.ar-nav-task:hover,
.quick-task.ar-nav-task.active,
.quick-task.customer-nav-task:hover,
.quick-task.customer-nav-task.active {
  border-color: #bfd3e2;
  background: linear-gradient(#f8fcff, #e7f1f8);
}

.quick-task.ar-nav-task.active {
  border-left-color: #2f78ad;
}

.quick-task.customer-nav-task.active {
  border-left-color: #36784f;
  background: linear-gradient(#f8fcff, #e8f3ed);
}

.quick-task-label {
  font-weight: 700;
}

.quick-task.ar-nav-task small,
.quick-task.customer-nav-task small {
  color: #5f7282;
  font-size: 11px;
}

.quick-star {
  width: 22px;
  color: #697986;
  font-size: 23px;
  line-height: 1;
}

.quick-task-panel {
  padding: 10px;
  min-width: 0;
  max-width: 100%;
}

.quick-task-layout.single-panel-layout .quick-task-panel {
  overflow-x: clip;
}

.statement-panel,
.tax-panel {
  display: grid;
  gap: 10px;
}

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

.service-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  padding: 8px;
  border: 1px solid #a4b8c7;
  border-radius: 3px;
  background: linear-gradient(#f9fcff, #e7f0f7);
}

.service-toolbar input {
  flex: 1 1 220px;
}

.service-toolbar select {
  flex: 0 1 210px;
}

.hidden-file-input {
  display: none;
}

.service-edit-panel {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: #fff;
}

.service-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 9px;
}

.service-form-grid label {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: #40596b;
  font-size: 12px;
  font-weight: 600;
}

.service-form-grid .wide {
  grid-column: 1 / -1;
}

.service-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 9px;
}

.service-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 10px;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: #fff;
}

.service-card-head,
.service-card-foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.service-card-actions {
  display: flex;
  justify-content: flex-end;
}

.service-card-head strong {
  min-width: 0;
  color: #183b55;
  font-size: 14px;
}

.service-card-head span,
.service-card-foot span,
.service-card-meta,
.service-card-note {
  color: #5a7080;
  font-size: 12px;
}

.service-card-meta,
.service-card-note {
  min-height: 18px;
}

.service-rate-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.service-rate-row span {
  display: grid;
  gap: 2px;
  padding: 6px;
  border: 1px solid #d5e1ea;
  border-radius: 2px;
  color: #536879;
  background: #f8fbfe;
}

.service-rate-row strong {
  color: #163a52;
}

.service-margin.good strong {
  color: #27643f;
}

.service-margin.bad strong {
  color: #8c3328;
}

.tax-review-list {
  display: grid;
  gap: 7px;
  padding: 8px;
  border: 1px solid #d2dde6;
  background: #f8fbfe;
}

.review-check {
  display: flex;
  align-items: center;
  gap: 8px;
}

.review-check input {
  width: auto;
  min-height: auto;
}

.integration-card,
.report-panel,
.calendar-board,
.calendar-agenda {
  min-width: 0;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f2f7fb);
  box-shadow: inset 0 1px 0 #fff;
}

.integration-card {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 10px;
}

.integration-card div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.integration-card strong,
.integration-card span {
  display: block;
}

.integration-card span {
  color: #5d7282;
  font-size: 12px;
  text-align: right;
}

.integration-card p,
.report-panel p {
  color: #445d70;
  line-height: 1.35;
}

.calendar-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.calendar-toolbar {
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 7px 8px;
  margin: 10px 0;
  border: 1px solid #91aabd;
  background: linear-gradient(#ffffff, #e5f0f8);
}

.calendar-nav,
.calendar-mode,
.agenda-head {
  display: flex;
  align-items: center;
  gap: 5px;
}

.calendar-nav .icon-button {
  width: 30px;
  min-width: 30px;
  padding: 0;
  font-weight: 800;
}

.calendar-mode {
  overflow: hidden;
  border: 1px solid #7c93a8;
  border-radius: 3px;
  background: #fff;
}

.calendar-mode button,
.calendar-mode input {
  min-height: 26px;
  border: 0;
  border-right: 1px solid #b9c7d2;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.calendar-mode input {
  width: 132px;
  padding: 0 6px;
  color: #16384f;
}

.calendar-mode button:last-child,
.calendar-mode input:last-child {
  border-right: 0;
}

.calendar-mode button.active {
  color: #fff;
  background: linear-gradient(#5d97c5, #2e6f9f);
  font-weight: 700;
}

.calendar-layout {
  display: grid;
  grid-template-columns: minmax(520px, 1fr) minmax(240px, 320px);
  gap: 10px;
  margin-bottom: 10px;
}

.calendar-board {
  padding: 9px;
}

.calendar-title {
  min-width: 0;
  color: #14364f;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

.calendar-weekdays,
.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar-weekdays span {
  padding: 6px 5px;
  color: #4f687b;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  border: 1px solid #c5d3de;
  border-bottom: 0;
  background: linear-gradient(#f8fbfe, #dfeaf2);
}

.calendar-day {
  position: relative;
  min-height: 104px;
  padding: 5px;
  border: 1px solid #c5d3de;
  background: #fff;
  overflow: hidden;
  cursor: pointer;
}

.calendar-day.outside {
  color: #879aaa;
  background: #f2f6f9;
}

.calendar-day.today {
  outline: 2px solid #2f78ad;
  outline-offset: -2px;
}

.calendar-day.selected-range {
  background: #eef7ff;
}

.calendar-day.selected-range .calendar-date {
  border-radius: 3px;
  background: #2f78ad;
  color: #fff;
}

.calendar-date {
  width: 24px;
  height: 22px;
  display: grid;
  place-items: center;
  margin-bottom: 4px;
  color: #1f4059;
  font-weight: 700;
}

.day-add-reminder {
  position: absolute;
  top: 5px;
  right: 5px;
  min-height: 21px;
  max-width: calc(100% - 38px);
  padding: 0 5px;
  opacity: 0;
  pointer-events: none;
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: opacity 0.12s ease;
}

.calendar-day:hover .day-add-reminder,
.calendar-day:focus-within .day-add-reminder {
  opacity: 1;
  pointer-events: auto;
}

.calendar-events {
  display: grid;
  gap: 3px;
}

.calendar-event,
.calendar-more {
  display: block;
  min-width: 0;
  padding: 2px 5px;
  border-radius: 2px;
  color: #183247;
  font-size: 11px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: #e7f1f8;
  border-left: 3px solid #5d97c5;
}

.calendar-event {
  display: flex;
  align-items: center;
  gap: 3px;
  padding-right: 2px;
}

.calendar-event-label {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}

.calendar-event-remove {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 24px;
  min-width: 24px;
  min-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #6c1e1e;
  background: transparent;
  box-shadow: none;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

.calendar-event-remove:hover {
  color: #fff;
  background: #9b3e3e;
}

.calendar-confirm {
  display: flex;
  min-width: 0;
  width: 100%;
  align-items: center;
  gap: 3px;
}

.calendar-confirm span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.calendar-event.invoice {
  border-left-color: #2f78ad;
}

.calendar-event.order {
  border-left-color: #7d8b2f;
  background: #f2f4de;
}

.calendar-event.payroll {
  border-left-color: #7e5aa7;
  background: #eee8f5;
}

.calendar-event.tax {
  border-left-color: #b34e3b;
  background: #fae9e4;
}

.calendar-event.reporting {
  border-left-color: #b38b2d;
  background: #fbf1d7;
}

.calendar-event.recurring {
  border-left-color: #b05a32;
  background: #f7eee6;
}

.calendar-event.banking,
.calendar-event.reconcile {
  border-left-color: #39815c;
  background: #e8f4ed;
}

.calendar-more {
  margin-top: 3px;
  color: #5b6f7e;
  background: transparent;
  border-left-color: transparent;
}

.calendar-agenda {
  padding: 9px;
}

.agenda-head {
  justify-content: space-between;
  margin-bottom: 8px;
}

.agenda-head h3 {
  margin-bottom: 0;
}

.reminder-form {
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
}

.reminder-form.quick {
  grid-template-columns: 1fr;
  padding: 8px;
  border: 1px solid #9eb4c5;
  background: #fff;
}

.reminder-form.quick strong {
  color: #24475f;
}

.recurring-form {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #d2dde6;
}

.recurring-form h3 {
  margin: 0;
}

.agenda-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px;
  align-items: center;
  padding: 7px 8px;
  margin-bottom: 6px;
  border-left: 4px solid #5d97c5;
  background: #fff;
}

.agenda-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.agenda-delete {
  display: flex;
  justify-content: flex-end;
  min-width: 28px;
}

.agenda-delete .reminder-remove {
  width: 26px;
  min-width: 26px;
  padding: 0;
  font-weight: 700;
}

.agenda-confirm {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #6c1e1e;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.agenda-row.order {
  border-left-color: #7d8b2f;
}

.agenda-row.payroll {
  border-left-color: #7e5aa7;
}

.agenda-row.tax {
  border-left-color: #b34e3b;
}

.agenda-row.reporting {
  border-left-color: #b38b2d;
}

.agenda-row.recurring {
  border-left-color: #b05a32;
}

.agenda-row.banking,
.agenda-row.reconcile {
  border-left-color: #39815c;
}

.agenda-row small {
  color: #607789;
}

.report-panel {
  padding: 10px;
}

.report-chart-panel {
  min-height: 260px;
}

.report-chart-layout {
  display: grid;
  grid-template-columns: minmax(220px, 0.72fr) minmax(280px, 1fr);
  gap: 14px;
  align-items: start;
}

.report-pie-wrap {
  display: grid;
  gap: 10px;
  justify-items: center;
  padding: 10px;
  border: 1px solid #d2e0e8;
  border-radius: 4px;
  background: #fff;
}

.report-pie {
  position: relative;
  display: grid;
  place-items: center;
  width: min(190px, 100%);
  aspect-ratio: 1;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px #8da7ba;
}

.report-pie::after {
  content: "";
  width: 48%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 1px #c6d6df;
}

.report-pie span {
  position: absolute;
  z-index: 1;
  max-width: 44%;
  color: #16384f;
  font-weight: 900;
  text-align: center;
  overflow-wrap: anywhere;
}

.report-pie-legend {
  display: grid;
  gap: 6px;
  width: 100%;
}

.report-pie-legend-row {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  color: #344f61;
  font-size: 12px;
  font-weight: 700;
}

.report-pie-legend-row span:nth-child(2) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-pie-swatch {
  width: 12px;
  height: 12px;
  border: 1px solid #7c93a8;
  border-radius: 2px;
}

.report-chart-panel.large .bar-list {
  gap: 7px;
}

.report-lines {
  display: grid;
  gap: 7px;
}

.report-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid #dbe5ec;
}

.report-line:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.report-line span {
  min-width: 0;
  color: #4f6678;
}

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

.bar-row {
  display: grid;
  gap: 4px;
}

.bar-label {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: #273f52;
  font-size: 12px;
}

.bar-label span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bar-track {
  height: 12px;
  border: 1px solid #a7bac8;
  background: #edf3f7;
}

.bar-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #2f78ad, #74a845);
}

.report-open-panel {
  display: grid;
  gap: 7px;
  align-content: start;
  margin-top: 10px;
  border: 1px solid #a9bfcc;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #eef5f9);
}

.report-open-panel strong {
  color: #16384f;
  font-size: 14px;
}

.report-open-panel span {
  color: #5c7283;
  font-weight: 700;
}

.report-open-panel button {
  justify-self: start;
}

.standard-modal.report-sheet-window {
  grid-template-rows: auto minmax(0, 1fr);
  width: min(1280px, 100%);
  height: min(780px, calc(100dvh - 56px));
  background: var(--surface);
}

.report-sheet-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-height: 0;
  overflow: hidden;
}

.report-sheet-content > .report-sheet-actions,
.report-sheet-content > .report-sheet-toolbar {
  flex: 0 0 auto;
}

.report-sheet-content > .report-sheet-body {
  flex: 1 1 auto;
}

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

.report-sheet-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
  padding: 8px 10px;
  border-bottom: 1px solid #b7ccda;
  background: #eef5f9;
}

.report-sheet-toolbar label {
  display: grid;
  gap: 3px;
  color: #38586d;
  font-size: 11px;
  font-weight: 800;
}

.report-sheet-toolbar select {
  min-width: 124px;
}

.report-sheet-page-controls {
  margin-left: auto;
  display: flex;
  gap: 7px;
  align-items: center;
}

.report-sheet-body {
  min-height: 0;
  padding: 10px;
  overflow: hidden;
}

.report-spreadsheet {
  height: min(640px, calc(100vh - 315px));
  min-height: 360px;
  display: block;
  overflow: auto;
  border-color: #8faebe;
  background: #fff;
}

.report-sheet-body .report-spreadsheet {
  height: 100%;
  min-height: 0;
}

.report-spreadsheet .table-title-row {
  padding: 7px 8px;
  background: linear-gradient(#f8fbfd, #e6f0f6);
  border-bottom: 1px solid #a9bfcc;
}

.report-spreadsheet table {
  width: max-content;
  min-width: 100%;
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12px;
  background: #fff;
}

.report-spreadsheet th,
.report-spreadsheet td {
  min-width: 96px;
  padding: 4px 7px;
  border-right: 1px solid #d1dde5;
  border-bottom: 1px solid #dce6ec;
  white-space: nowrap;
  vertical-align: top;
}

.report-spreadsheet td {
  background: #fff;
}

.report-spreadsheet tbody tr:nth-child(even) td {
  background: #f7fbfe;
}

.report-spreadsheet th {
  background: linear-gradient(#e9f2f8, #d5e5ef);
  color: #173a51;
  font-weight: 800;
}

.report-spreadsheet td:first-child,
.report-spreadsheet th:first-child {
  min-width: 118px;
  background: #f9fcfe;
}

.report-spreadsheet th:first-child {
  background: linear-gradient(#e9f2f8, #d5e5ef);
}

.watch-number {
  color: #14364f;
  font-size: 32px;
  font-weight: 800;
  line-height: 1;
}

.watch-row {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid #d5e0e8;
}

.watch-row span {
  color: #607789;
}

.empty-card {
  padding: 9px;
  color: #607789;
  border: 1px dashed #b7c6d2;
  background: #fff;
}

.schema-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto auto auto;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 1px solid #9eb4c5;
  border-radius: 3px;
  background: #fff;
}

.schema-toolbar span {
  color: #526c7f;
  font-weight: 700;
}

.schema-list {
  display: grid;
  gap: 10px;
}

.schema-table {
  display: grid;
  gap: 8px;
  padding: 9px;
  border: 1px solid #8ea8bd;
  border-radius: 3px;
  background: linear-gradient(#ffffff, #f2f7fb);
}

.schema-table h3 {
  margin: 0;
  font-size: 14px;
}

.proposed-schema {
  border-style: dashed;
}

.schema-purpose {
  color: #41586a;
  font-weight: 600;
}

.time-entry-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid #93b4cc;
  border-radius: 5px;
  background: #f8fcff;
}

.time-entry-panel-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.time-entry-panel h3 {
  margin: 0 0 4px;
  font-size: 16px;
}

.time-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  align-items: end;
}

.time-form label {
  display: grid;
  gap: 4px;
  color: #002b45;
  font-size: 12px;
  font-weight: 700;
}

.time-form input,
.time-form select,
.time-form textarea {
  width: 100%;
}

.time-customer-field {
  grid-column: span 2;
}

.time-billable-check {
  align-self: center;
}

.time-notes-field {
  grid-column: 1 / -1;
}

.time-notes-field textarea {
  min-height: 92px;
  max-height: 190px;
  resize: vertical;
  line-height: 1.4;
}

.time-form-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 31px;
}

.time-note-cell {
  display: grid;
  gap: 5px;
  min-width: 180px;
  max-width: 360px;
}

.time-note-preview {
  display: -webkit-box;
  overflow: hidden;
  overflow-wrap: anywhere;
  color: #16394f;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.time-note-cell .small {
  justify-self: start;
}

.time-note-full {
  max-height: 280px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  border: 1px solid #b7c9d7;
  border-radius: 4px;
  background: #f8fcff;
  font-family: inherit;
  line-height: 1.4;
}

.user-row strong,
.user-row span {
  display: block;
}

.user-row span {
  color: #5d7282;
  font-size: 12px;
  margin-top: 2px;
}

.permission-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 6px;
}

.permission-group-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 8px;
}

.permission-group {
  display: grid;
  gap: 6px;
  align-content: start;
  padding: 8px;
  border: 1px solid #b7c9d7;
  border-radius: 4px;
  background: #f7fbfd;
}

.permission-group > strong {
  color: #24455e;
  font-size: 12px;
}

.column-permission-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 7px;
}

.column-permission-list .permission {
  align-items: flex-start;
}

.column-permission-list .permission span {
  display: grid;
  gap: 2px;
}

.column-permission-list .permission small {
  color: #607486;
  font-size: 11px;
}

.role-template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.role-template {
  display: grid;
  gap: 5px;
  align-content: start;
  border: 1px solid #9eb4c5;
  border-radius: 4px;
  padding: 9px;
  background: linear-gradient(#ffffff, #edf5fb);
}

.role-template.selected {
  border-color: #2e6f9f;
  box-shadow: inset 3px 0 0 #2e6f9f;
}

.role-template span,
.role-template small {
  color: #5d7282;
  font-size: 12px;
}

.button-row.compact {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.permission {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #a8b9c6;
  border-radius: 3px;
  padding: 6px;
  background: #fff;
}

.permission.allowed {
  background: #eef6ed;
  border-color: #96b992;
}

.login-page {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(360px, 520px) minmax(360px, 420px) minmax(220px, 260px);
  align-items: start;
  align-content: center;
  justify-content: center;
  gap: clamp(18px, 2.3vw, 34px);
  padding: clamp(24px, 3vw, 54px);
  color: #163043;
  background:
    linear-gradient(115deg, rgba(247, 250, 248, 0.94) 0%, rgba(234, 241, 244, 0.9) 44%, rgba(158, 182, 184, 0.86) 100%),
    url("/assets/ledgerdesk-logo-mini.png") 7% 10% / 112px auto no-repeat,
    linear-gradient(135deg, #f5f0df, #c1d4dc 48%, #4e7883);
}

.login-panel {
  width: min(410px, 100%);
  justify-self: center;
  margin-top: clamp(96px, 12vh, 126px);
  padding: 24px;
  display: grid;
  gap: 12px;
  border-color: rgba(88, 122, 137, 0.46);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 250, 0.92)),
    linear-gradient(135deg, rgba(214, 178, 94, 0.2), rgba(80, 127, 129, 0.1));
  box-shadow:
    0 22px 60px rgba(23, 52, 62, 0.18),
    0 2px 7px rgba(23, 52, 62, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.company-invitations { margin-bottom: 20px; }
.invitation-form { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; }
.invitation-form label { flex: 1; min-width: 200px; }
.company-invitations label { display: grid; gap: 6px; }
.invitation-result { margin-top: 16px; padding: 14px; background: #f1f7f3; border: 1px solid #a8c1af; border-radius: 8px; display: grid; gap: 10px; }
.invitation-result input { width: 100%; min-width: 0; }
.invitation-list { list-style: none; padding: 0; }
.invitation-list li { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 8px 0; border-bottom: 1px solid #d9e1e5; }
.invitation-list li > span:first-child { flex: 1; overflow-wrap: anywhere; }

.login-panel form {
  display: grid;
  gap: 10px;
}

.login-showcase {
  max-width: 640px;
  align-self: start;
  display: grid;
  gap: 22px;
}

.login-showcase-brand {
  display: flex;
  align-items: center;
  gap: 16px;
}

.login-showcase-brand img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  border: 1px solid rgba(62, 102, 104, 0.24);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 12px 30px rgba(32, 59, 65, 0.12);
}

.login-kicker {
  color: #6c5a26;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.login-showcase h1 {
  color: #102b38;
  font-size: clamp(44px, 7vw, 78px);
  line-height: 0.95;
  letter-spacing: 0;
  font-weight: 850;
}

.login-lede {
  max-width: 600px;
  color: #28495a;
  font-size: clamp(18px, 2.15vw, 25px);
  line-height: 1.28;
}

.login-product-preview {
  width: min(560px, 100%);
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(77, 118, 128, 0.38);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(239, 246, 245, 0.76)),
    repeating-linear-gradient(0deg, rgba(31, 74, 86, 0.04) 0, rgba(31, 74, 86, 0.04) 1px, transparent 1px, transparent 35px);
  box-shadow: 0 18px 48px rgba(35, 68, 78, 0.13);
}

.preview-titlebar,
.preview-row,
.preview-flow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.preview-titlebar {
  min-height: 34px;
  padding: 0 10px;
  border-radius: 6px;
  color: #f9fbf7;
  background: linear-gradient(90deg, #254f58, #667a58);
}

.preview-titlebar span {
  font-size: 12px;
  font-weight: 800;
}

.preview-titlebar strong {
  font-size: 13px;
  text-transform: uppercase;
}

.preview-ledger {
  display: grid;
  gap: 7px;
}

.preview-row {
  min-height: 38px;
  padding: 0 11px;
  border: 1px solid rgba(126, 151, 156, 0.44);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.76);
}

.preview-row span {
  color: #526b73;
  font-size: 12px;
  font-weight: 700;
}

.preview-row b {
  color: #173945;
  font-size: 16px;
}

.preview-row.strong {
  border-color: rgba(214, 178, 94, 0.68);
  background: rgba(255, 249, 232, 0.84);
}

.preview-chart-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(126, 151, 156, 0.44);
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(246, 250, 248, 0.8)),
    repeating-linear-gradient(90deg, rgba(49, 83, 91, 0.045) 0, rgba(49, 83, 91, 0.045) 1px, transparent 1px, transparent 72px);
}

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

.preview-chart-head span {
  color: #274954;
  font-size: 13px;
  font-weight: 850;
}

.preview-chart-head b {
  color: #80682a;
  font-size: 12px;
}

.preview-chart {
  position: relative;
  height: 122px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  align-items: end;
  gap: 10px;
  padding: 12px 10px 9px;
  border: 1px solid rgba(95, 129, 136, 0.28);
  border-radius: 7px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(212, 229, 226, 0.3)),
    repeating-linear-gradient(0deg, transparent 0, transparent 29px, rgba(45, 83, 93, 0.08) 30px);
}

.preview-chart::before,
.preview-chart::after {
  content: none;
}

.preview-trend-line {
  position: absolute;
  left: 14px;
  top: 10px;
  width: calc(100% - 28px);
  height: calc(100% - 22px);
  z-index: 2;
  pointer-events: none;
}

.preview-trend-line polyline {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.preview-trend-line .trend-shadow {
  stroke: rgba(55, 94, 101, 0.46);
  stroke-width: 3;
}

.preview-trend-line .trend-main {
  stroke: rgba(207, 176, 87, 0.9);
  stroke-width: 3.5;
}

.preview-chart span {
  position: relative;
  z-index: 1;
  min-height: 18px;
  border: 1px solid rgba(49, 92, 101, 0.28);
  border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, #7ca3a0, #2e656b);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.preview-chart span:nth-child(2n) {
  background: linear-gradient(180deg, #dfc576, #997b2f);
}

.preview-dot {
  position: absolute;
  z-index: 3;
  width: 10px;
  height: 10px;
  border: 2px solid rgba(255, 255, 255, 0.92);
  border-radius: 50%;
  background: #1e5660;
  box-shadow: 0 2px 7px rgba(20, 52, 62, 0.22);
}

.preview-dot.dot-one {
  left: 21%;
  top: 57%;
}

.preview-dot.dot-two {
  left: 52%;
  top: 39%;
}

.preview-dot.dot-three {
  left: 78%;
  top: 40%;
}

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

.preview-signal-grid div {
  display: grid;
  gap: 2px;
  min-height: 54px;
  padding: 9px;
  border: 1px solid rgba(126, 151, 156, 0.42);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.68);
}

.preview-signal-grid span {
  color: #66787e;
  font-size: 11px;
  font-weight: 750;
}

.preview-signal-grid b {
  color: #173945;
  font-size: 13px;
  line-height: 1.15;
}

.preview-flow {
  justify-content: start;
  flex-wrap: wrap;
}

.preview-flow span,
.login-proof-points span {
  min-height: 27px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(70, 108, 115, 0.34);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
  color: #294c58;
  font-size: 12px;
  font-weight: 750;
}

.preview-flow span {
  padding: 0 12px;
}

.login-proof-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.login-proof-points span {
  padding: 0 11px;
  background: rgba(239, 246, 242, 0.66);
}

.login-panel-title {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #173342;
  font-size: 20px;
  line-height: 1.2;
  box-shadow: none;
}

.login-support {
  align-self: start;
  margin-top: clamp(96px, 12vh, 126px);
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(85, 121, 128, 0.32);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.44);
  box-shadow: 0 18px 48px rgba(32, 64, 70, 0.1);
}

.login-support-kicker {
  color: #80682a;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.login-support h2 {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #173945;
  font-size: 20px;
  line-height: 1.14;
  box-shadow: none;
}

.support-stack {
  display: grid;
  gap: 8px;
}

.support-item {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 9px;
  align-items: center;
  min-height: 58px;
  padding: 8px;
  border: 1px solid rgba(95, 128, 136, 0.32);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.56);
}

.support-item.active {
  border-color: rgba(214, 178, 94, 0.64);
  background: rgba(255, 248, 229, 0.56);
}

.support-item span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  color: #f8fbf7;
  background: linear-gradient(180deg, #32666d, #244c55);
  font-size: 11px;
  font-weight: 850;
}

.support-item strong,
.support-item small {
  display: block;
}

.support-item strong {
  color: #173945;
  font-size: 13px;
  line-height: 1.16;
}

.support-item small {
  margin-top: 2px;
  color: #64777d;
  font-size: 11px;
  line-height: 1.22;
}

.support-mini-chart {
  display: grid;
  gap: 7px;
  padding: 10px;
  border: 1px solid rgba(95, 128, 136, 0.28);
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.28), rgba(222, 234, 232, 0.3)),
    repeating-linear-gradient(90deg, transparent 0, transparent 34px, rgba(49, 83, 91, 0.06) 35px);
}

.support-mini-chart span {
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, #2e656b, #d0b35e);
}

.company-choice-panel {
  width: min(520px, 100%);
}

.company-choice-page {
  grid-template-columns: 1fr;
  place-items: center;
}

.company-choice-page .login-panel {
  justify-self: center;
}

.company-choice-page .login-showcase,
.company-choice-page .login-support {
  display: none;
}

.company-choice-list {
  display: grid;
  gap: 8px;
}

.company-choice-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 9px;
  align-items: center;
  min-height: 54px;
  padding: 9px;
  border: 1px solid #9eb4c5;
  border-radius: 4px;
  background: linear-gradient(#ffffff, #edf5fb);
  cursor: pointer;
}

.company-choice-card.active {
  border-color: #2e6f9f;
  background: linear-gradient(#eef8ff, #d6ebf9);
  box-shadow: inset 3px 0 0 #2e6f9f;
}

.company-choice-card input {
  grid-row: span 2;
}

.company-choice-card span {
  color: #123650;
  font-weight: 800;
}

.company-choice-card small,
.company-choice-note {
  color: #607789;
}

.company-choice-note {
  margin: 0;
}

.company-code-entry {
  display: grid;
  gap: 4px;
}

.company-choice-actions {
  display: flex;
  gap: 8px;
}

.company-choice-actions button {
  flex: 1 1 0;
}

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

.brand-mark {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(99, 120, 107, 0.58);
  border-radius: 8px;
  color: #233f43;
  background: linear-gradient(#fff7d9, #d7b75d 58%, #a88637);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
  font-weight: 800;
}

.brand strong,
.brand span {
  display: block;
}

.brand span {
  color: #66777c;
}

.login-field {
  display: grid;
  gap: 6px;
  color: #17344a;
  font-size: 12px;
  font-weight: 700;
}

.login-field input {
  min-height: 36px;
  border-color: rgba(102, 131, 139, 0.62);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.92);
  font-weight: 400;
}

.password-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
}

.password-row input {
  min-width: 0;
}

.password-row button {
  min-width: 62px;
  border-radius: 6px;
}

.login-divider {
  height: 1px;
  margin: 4px 0 0;
  background: linear-gradient(90deg, transparent, #bfd0dc, transparent);
}

.link-button {
  width: max-content;
  padding: 0;
  border: 0;
  color: #175e92;
  background: transparent;
  box-shadow: none;
  font-weight: 700;
  text-align: left;
}

.link-button:hover {
  color: #0f4167;
  text-decoration: underline;
  background: transparent;
}

.recovery-panel {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #9fb4c5;
  border-radius: 3px;
  background: #f8fbfe;
}

.login-hint {
  margin: 0;
  color: #526a7b;
  font-size: 12px;
  line-height: 1.35;
}

.login-hint.warning {
  color: #8b5a00;
  font-weight: 700;
}

/* Share one grid row so the two sign-in cards keep matching top and bottom edges. */
@media (min-width: 1181px) {
  .login-page:has(.login-support) {
    grid-template-rows: clamp(96px, 12vh, 126px) auto auto;
    row-gap: 0;
  }
  .login-page:has(.login-support) .login-showcase { grid-column: 1; grid-row: 1 / -1; }
  .login-page:has(.login-support) .login-panel { grid-column: 2; grid-row: 2; margin-top: 0; align-self: stretch; align-content: start; }
  .login-page:has(.login-support) .login-support { grid-column: 3; grid-row: 2; margin-top: 0; align-self: stretch; grid-template-rows: auto auto 1fr auto; }
}

@media (max-width: 1180px) {
  .login-page {
    grid-template-columns: minmax(340px, 560px) minmax(340px, 420px);
  }

  .login-support {
    display: none;
  }
}

@media (max-width: 900px) {
  .login-page {
    grid-template-columns: 1fr;
    align-items: start;
    align-content: start;
    gap: 22px;
    padding: 28px 18px;
  }

  .login-showcase {
    max-width: 100%;
    gap: 16px;
  }

  .login-showcase h1 {
    font-size: clamp(40px, 13vw, 58px);
  }

  .login-lede {
    font-size: 17px;
  }

  .login-product-preview {
    display: none;
  }

  .login-panel {
    width: 100%;
    justify-self: stretch;
    margin-top: 0;
  }
}

@media (max-width: 560px) {
  .login-page {
    padding: 20px 12px;
  }

  .login-showcase-brand {
    gap: 12px;
  }

  .login-showcase-brand img {
    width: 46px;
    height: 46px;
  }

  .login-proof-points {
    display: none;
  }

  .login-panel {
    padding: 18px;
  }

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

  .password-row button {
    width: 100%;
  }
}

.error,
.toast {
  color: #812727;
}

.toast {
  position: fixed;
  right: 16px;
  top: 44px;
  z-index: 10;
  border: 1px solid #9aaec0;
  border-left: 4px solid #d6b25e;
  border-radius: 3px;
  background: #fff;
  padding: 9px 11px;
  box-shadow: 0 8px 22px rgba(34, 58, 78, 0.18);
}

.save-pulse {
  position: fixed;
  right: 16px;
  top: 92px;
  z-index: 10;
  display: grid;
  gap: 2px;
  min-width: 190px;
  border: 1px solid #83a889;
  border-left: 4px solid #39815c;
  border-radius: 3px;
  background: #f5fff7;
  padding: 8px 10px;
  color: #24543a;
  box-shadow: 0 8px 22px rgba(34, 58, 78, 0.14);
}

.save-pulse span {
  color: #587064;
  font-size: 12px;
}

.admin-reset-panel {
  border: 1px solid #c5a35d;
  border-radius: 3px;
  padding: 10px;
  background: #fff8e8;
}

.record-drawer {
  position: fixed;
  top: 28px;
  right: 0;
  bottom: 0;
  z-index: 900;
  width: min(390px, 92vw);
  overflow-y: auto;
  border-left: 1px solid #6d8294;
  background: linear-gradient(#ffffff, #eef5fa);
  box-shadow: -8px 0 24px rgba(32, 52, 68, 0.24);
  padding: 12px;
}

.record-drawer-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: start;
  padding-bottom: 10px;
  border-bottom: 1px solid #cfdae3;
}

.record-drawer-head h3 {
  margin-bottom: 2px;
  font-size: 16px;
}

.record-drawer-head p {
  color: #61778a;
}

.record-drawer-head button.tiny {
  min-width: 24px;
  min-height: 24px;
}

.record-drawer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0;
}

.drawer-section {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #d8e2ea;
}

.drawer-row,
.attachment-preview,
.audit-preview {
  display: grid;
  gap: 2px;
  padding: 6px 7px;
  border: 1px solid #d5e1ea;
  background: #fff;
}

.drawer-row {
  grid-template-columns: minmax(90px, 0.45fr) minmax(0, 1fr);
}

.drawer-row span,
.attachment-preview span,
.audit-preview span,
.audit-preview small {
  color: #5f7282;
  font-size: 12px;
}

@media (max-width: 1340px) {
  .classic-menu {
    gap: 1px;
    padding: 0 5px;
  }

  .classic-menu button {
    padding: 0 6px;
    font-size: 12px;
  }
}

@media (max-width: 1240px) {

  .receive-batch-meta {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .inventory-receive-line {
    grid-template-columns: 32px minmax(140px, 0.9fr) minmax(210px, 1.35fr) 118px 82px minmax(92px, 0.55fr) 104px auto;
  }

  .receive-create-grid {
    grid-template-columns: repeat(3, minmax(130px, 1fr));
  }
}

@media (max-width: 1120px) {
  .dashboard-company-controls {
    order: 3;
    width: 100%;
    margin-left: 0;
  }

  .dashboard-company-controls select {
    flex: 1 1 auto;
    width: auto;
  }
}

@media (max-width: 980px) {
  .app-frame {
    padding-top: var(--menu-bar-height);
  }

  .classic-menu {
    overflow-x: auto;
    flex-wrap: nowrap;
    min-height: 28px;
  }

  .classic-menu button {
    padding: 0 5px;
  }

  .inventory-task-layout {
    grid-template-columns: 1fr;
  }

  .inventory-worker-start {
    grid-template-columns: 1fr;
  }

  .inventory-worker-actions {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }

  .inventory-task-rail {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  }

  .inventory-task-rail-header {
    grid-column: 1 / -1;
  }

  .top-utility-slot,
  .top-account-slot {
    position: sticky;
    right: 0;
    background: linear-gradient(#f7fbff, #c4d8e9);
  }

  .app-shell {
    grid-template-columns: 1fr;
  }

  .data-center-grid,
  .export-package-grid,
  .bulk-edit-bar,
  .report-builder-bar {
    grid-template-columns: 1fr;
  }

  .dashboard-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .document-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .document-summary-chips {
    justify-content: start;
  }

  .period-toggle {
    width: max-content;
    max-width: 100%;
  }

  .dashboard-company-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .dashboard-company-controls select,
  .dashboard-company-controls .add-company-button {
    width: 100%;
  }

  .sidebar {
    height: auto;
    max-height: none;
    position: static;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid #6d8294;
  }

  nav,
  .metrics,
  .home-dashboard,
  .simple-home-overview,
  .simple-hero,
  .simple-money-grid,
  .dashboard-chart-grid,
  .management-work-row,
  .owner-review-workbench,
  .donut-layout,
  .toolbar-form,
  .time-form,
  .document-command-grid,
  .document-upload-row,
  .document-metadata-row,
  .customer-grid,
  .address-columns,
  .address-grid,
  .form-grid,
  .line-header,
  .entry-line,
  .permission-grid,
  .permission-group-grid,
  .column-permission-list,
  .item-form,
  .item-preset-row,
  .form-advanced-grid,
  .parts-flow-strip,
  .tax-form,
  .items-command-strip,
  .items-search-row,
  .items-advanced-grid,
  .profile-form,
  .invoice-line-header,
  .invoice-line,
  .invoice-tax-controls,
  .invoice-tax-summary,
  .bill-line-header,
  .bill-line,
  .po-line,
  .check-run-form,
  .warehouse-layout,
  .user-summary-row,
  .user-row-header,
  .help-shell,
  .help-actions,
  .guide-title-row,
  .custom-field-entity-picker,
  .calendar-summary,
  .calendar-toolbar,
  .reminder-form,
  .integration-grid,
  .report-grid,
  .report-guide,
  .report-guide-steps,
  .report-chart-layout,
  .report-memory-grid,
  .quick-task-layout,
  .money-in-summary,
  .settings-grid,
  .settings-form.inline,
  .settings-metric-grid,
  .people-intro,
  .people-metrics,
  .people-form-grid,
  .person-detail-grid,
  .smoke-panel-grid,
  .smoke-admin-layout,
  .smoke-receiving-layout,
  .distribution-grid,
  .distribution-table-grid,
  .restock-po-strip,
  .role-home-grid,
  .role-home-actions,
  .pos-register-grid,
  .pos-scan-row,
  .pos-scan-row + .pos-scan-row,
  .pos-gift-card-issue,
  .pos-tender-row,
  .receive-batch-meta,
  .inventory-receive-line,
  .receive-create-grid,
  .order-link-controls,
  .order-link-summary,
  .fulfillment-stepper,
  .fulfillment-finish-panel,
  .fulfillment-summary-strip,
  .fulfillment-mini-grid,
  .fulfillment-edit-grid {
    grid-template-columns: 1fr;
  }

  .time-customer-field {
    grid-column: auto;
  }

  .quote-workflow-head {
    align-items: stretch;
    flex-direction: column;
  }

  .fulfillment-line-head,
  .fulfillment-line-actions,
  .fulfillment-step-actions,
  .fulfillment-finish-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .receive-line-number {
    text-align: left;
  }

  .receive-batch-actions {
    justify-content: stretch;
  }

  .receive-batch-actions button {
    flex: 1 1 150px;
  }

  .pos-inventory-title {
    grid-template-columns: 1fr;
  }

  .pos-inventory-switch,
  .pos-inventory-summary {
    grid-template-columns: 1fr;
  }

  .pos-receive-line,
  .pos-receive-line:has(input[placeholder="Unit cost"]) {
    grid-template-columns: 1fr;
  }

  .calendar-title {
    text-align: left;
  }

  .chart-panel.wide {
    grid-column: auto;
  }

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

  .report-topic-panel,
  .report-period-panel,
  .report-choice-panel,
  .report-output-panel {
    grid-column: 1;
    grid-row: auto;
  }

  .report-output-panel {
    min-height: 0;
    position: static;
  }

  .report-inquiry-slot {
    grid-column: 1;
    grid-row: auto;
    position: static;
    min-height: 0;
  }

  .shared-report-tray {
    width: 100%;
    max-height: none;
    margin-bottom: 10px;
  }

  .shared-report-head {
    position: static;
    grid-template-columns: 1fr;
  }

  .report-spreadsheet {
    height: 520px;
  }

  .standard-modal.report-sheet-window {
    width: 100%;
    height: calc(100dvh - 56px);
  }

  .report-sheet-page-controls {
    width: 100%;
    margin-left: 0;
  }

  .calendar-board {
    overflow-x: auto;
  }

  .calendar-weekdays,
  .calendar-grid {
    min-width: 700px;
  }

  .tab-strip button.utility {
    margin-left: 0;
  }

  .profile-card {
    grid-column: auto;
  }

  .settings-panel.wide {
    grid-column: auto;
  }

  .smoke-restock-panel,
  .smoke-receiving-cart,
  .smoke-recent-receiving {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 1180px) {
  .pos-register-grid {
    grid-template-columns: 1fr;
  }

  .pos-focus-workspace .pos-role-actions,
  .pos-cashier-strip,
  .pos-quick-customer,
  .pos-focus-workspace .pos-register-meta,
  .pos-focus-workspace .pos-scan-row,
  .pos-focus-workspace .pos-payment-buttons,
  .pos-focus-workspace .pos-tender-row {
    grid-template-columns: 1fr;
  }

  .pos-focus-workspace .pos-register-meta label.wide {
    grid-column: auto;
  }

  .pos-focus-workspace .pos-tender-panel {
    position: static;
    max-height: none;
  }

  .pos-qty-cell {
    grid-template-columns: 44px minmax(90px, 1fr) 44px 60px;
  }
}

@media (max-width: 640px) {
  .pos-register-meta label.wide {
    grid-column: auto;
  }

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

  .pos-tender-row strong {
    grid-column: 1 / -1;
  }
}

@media (max-width: 820px) {
  .calendar-layout {
    grid-template-columns: 1fr;
  }

  .calendar-agenda {
    order: -1;
  }
}

@media (max-width: 540px) {
  .inventory-task-rail,
  .inventory-task-heading,
  .inventory-work-panel {
    padding: 7px;
  }

  .inventory-task-rail,
  .inventory-task-heading,
  .inventory-task-stats {
    display: grid;
    grid-template-columns: 1fr;
  }

  .people-toolbar .status-filter {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
  }

  .people-toolbar .status-filter button {
    padding: 0 6px;
  }

  .items-control-panel .filter-field {
    grid-template-columns: 1fr;
  }

  .items-command-main,
  .items-quick-filters,
  .items-pager-controls,
  .items-export-controls {
    align-items: stretch;
    flex-direction: column;
  }
}

@media print {
  body {
    background: #fff;
  }

  .classic-menu,
  .sidebar,
  .topbar,
  .toast,
  .section-actions,
  .tab-strip,
  .status-filter,
  button {
    display: none !important;
  }

  .app-frame,
  .app-shell,
  main {
    display: block;
    height: auto;
    min-height: 0;
    overflow: visible;
    background: #fff;
  }

  main {
    padding: 0;
  }

  section {
    display: block;
  }

  .metric,
  .table-wrap,
  .chart-panel,
  .home-hero-panel {
    break-inside: avoid;
    box-shadow: none;
  }
}
/* Acumatica-style module landing pages keep existing destinations discoverable. */
.module-home {
  max-width: 1180px;
  margin: 0 auto;
  padding: 24px 28px 40px;
}

.module-home-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line, #d9e1ea);
}

.module-home-heading h2 {
  margin: 4px 0 0;
  font-size: 24px;
}

.module-home-heading p {
  max-width: 420px;
  margin: 0;
  color: var(--muted, #667085);
  text-align: right;
}

.module-home-quick-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 8px;
  margin-top: 18px;
}

.module-home-quick-button {
  display: grid;
  min-height: 58px;
  justify-items: start;
  align-content: center;
  gap: 4px;
  padding: 9px 11px;
  border: 1px solid #9eb3c3;
  border-radius: 3px;
  color: #1f3c52;
  background: linear-gradient(#ffffff, #edf4f9);
  box-shadow: none;
  text-align: left;
}

.module-home-quick-button strong,
.module-home-quick-button span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.module-home-quick-button strong {
  font-size: 13px;
}

.module-home-quick-button span {
  color: #49677d;
  font-size: 11px;
}

.module-home-sections {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: 26px;
}

.module-home-section h3 {
  margin: 0 0 10px;
  color: var(--muted, #667085);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.module-home-links {
  display: grid;
  gap: 1px;
  border-top: 1px solid var(--line, #d9e1ea);
}

.module-home-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid var(--line, #d9e1ea);
  background: transparent;
  color: var(--text, #1d2939);
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.module-home-link:hover,
.module-home-link:focus-visible {
  background: var(--surface-soft, #f5f8fb);
  color: var(--accent, #185abd);
  outline: none;
}

.module-home-arrow {
  color: var(--muted, #667085);
  font-size: 18px;
}

.module-home-reveal {
  display: flex;
  justify-content: center;
  margin-top: 14px;
  padding-top: 8px;
  border-top: 1px solid var(--line, #d9e1ea);
}

.module-home-reveal-button {
  min-width: 92px;
  min-height: 28px;
  padding: 3px 14px;
  border-color: transparent;
  border-radius: 3px;
  color: var(--accent, #185abd);
  background: transparent;
  box-shadow: none;
  font-size: 12px;
  font-weight: 700;
}

.module-home-reveal-button:hover,
.module-home-reveal-button:focus-visible {
  border-color: var(--line, #d9e1ea);
  background: var(--surface-soft, #f5f8fb);
  outline: none;
}

.sales-workspace {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 24px 28px 40px;
}

.sales-workspace-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line, #d9e1ea);
}

.sales-workspace-heading h2 {
  margin: 4px 0 0;
  font-size: 24px;
}

.sales-workspace-heading p {
  max-width: 360px;
  margin: 0;
  color: var(--muted, #667085);
  text-align: right;
}

.sales-workspace-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 20px 28px;
  margin-top: 22px;
}

.sales-workspace-section {
  align-self: start;
  min-width: 0;
}

.sales-workspace-section h3 {
  margin: 0 0 9px;
  color: var(--muted, #667085);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.sales-workspace-links {
  display: grid;
  border: 1px solid var(--line, #d9e1ea);
  background: #fff;
}

.sales-workspace-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  padding: 7px 10px;
  border: 0;
  border-bottom: 1px solid var(--line, #d9e1ea);
  border-radius: 0;
  color: var(--text, #1d2939);
  background: transparent;
  box-shadow: none;
  cursor: grab;
  font: inherit;
  text-align: left;
}

.sales-workspace-link:last-child {
  border-bottom: 0;
}

.sales-workspace-link:active {
  cursor: grabbing;
}

.sales-workspace-link:hover,
.sales-workspace-link:focus-visible {
  color: var(--accent, #185abd);
  background: var(--surface-soft, #f5f8fb);
  outline: none;
}

.sales-workspace-link-label {
  min-width: 0;
  overflow-wrap: anywhere;
}

.sales-workspace-link-arrow {
  flex: 0 0 auto;
  margin-left: 12px;
  color: var(--muted, #667085);
  font-size: 16px;
}

/* Master pages: frequent work stays visible; occasional tools open on demand. */
.office-workspace { max-width: 1024px; }
.office-workspace .sales-workspace-heading { padding-bottom: 12px; }
.office-workspace .sales-workspace-heading h2 { padding: 0; border: 0; background: none; box-shadow: none; font-size: 22px; color: #24415d; }
.workspace-daily { margin-top: 20px; }
.workspace-daily h3 { margin: 0 0 10px; font-size: 13.5px; color: var(--muted); }
.workspace-daily .sales-workspace-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.workspace-daily .sales-workspace-links { border: 1px solid #b9cbdc; gap: 1px; background: #dbe5ee; }
.office-workspace .sales-workspace-link { cursor: pointer; padding: 12px 14px; background: #f7fafd; }
.workspace-daily .sales-workspace-link { min-height: 75px; height: 100%; border: 0; margin: 0; }
.office-workspace .sales-workspace-link:hover { background: #edf4fa; }
.office-workspace .sales-workspace-link:focus-visible { outline: 2px solid #567fa5; outline-offset: -2px; background: #edf4fa; }
.workspace-task-copy { display: grid; gap: 4px; min-width: 0; }
.workspace-task-copy .sales-workspace-link-label { font-size: 13px; font-weight: 600; color: #244666; }
.workspace-task-copy small { font-size: 12px; line-height: 1.4; color: #607387; font-weight: 400; }
.workspace-more > .module-home-reveal-button { display: inline-flex; gap: 7px; align-items: center; min-height: 34px; padding: 7px 10px; border: 1px solid #afc3d5; border-radius: 3px; color: #315679; background: linear-gradient(#fcfdff, #e5edf5); text-decoration: none; }
.workspace-more > .module-home-reveal-button .workspace-tool-count { margin: 0 0 0 4px; padding: 1px 6px; border: 1px solid #c7d5e2; border-radius: 3px; background: #f7fafc; color: #526c82; }
.workspace-extra-help { margin: 0 0 12px; font-size: 12px; color: #607387; }
.workspace-more { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 14px; }
.workspace-tool-count { margin-left: 8px; font-size: 12px; color: var(--muted); font-weight: 400; }
.workspace-extra { margin-top: 16px; }
.workspace-tool-search { display: grid; gap: 6px; max-width: 360px; font-size: 13px; }
.workspace-tool-search input { width: 100%; min-width: 0; }
.workspace-tool-groups { margin-top: 16px; display: grid; gap: 8px; }
.workspace-tool-group { min-width: 0; }
.workspace-tool-group h3 { margin: 0; }
.workspace-group-toggle { display: flex; align-items: center; width: 100%; min-height: 42px; padding: 10px; text-align: left; box-shadow: none; white-space: normal; }
.workspace-group-toggle > span:last-child { margin-left: auto; padding-left: 12px; }
.office-workspace button:focus-visible { outline: 2px solid var(--accent, #185abd); outline-offset: 2px; }
/* Sidescreens share one balanced task layout and a full-height blue surface. */
@media screen {
  main:has(.navigation-workspace) {
    min-height: calc(100vh - var(--menu-bar-height));
    min-height: calc(100dvh - var(--menu-bar-height));
    background: linear-gradient(180deg, #e5edf4 0, #dce7f0 100%);
  }
}
.office-workspace .workspace-daily .sales-workspace-link-label { font-size: 13.5px; }
.office-workspace .workspace-daily .workspace-task-copy small { font-size: 12.5px; }
@media screen and (min-width: 981px) {
  .office-workspace.navigation-workspace {
    /* Center on the screen where space permits, without covering the sidebar. */
    margin-left: max(0px, calc((100% - 1024px - var(--sidebar-width, 272px)) / 2));
    margin-right: auto;
    padding-top: clamp(56px, 8vh, 88px);
  }
}
@media screen {
  .navigation-workspace .sales-workspace-heading,
  .navigation-workspace .workspace-daily,
  .navigation-workspace .workspace-more {
    padding: 12px;
    border: 1px solid #9eb8ce;
    border-top: 3px solid #648cae;
    border-radius: 5px;
    background: linear-gradient(180deg, #dceaf5, #eaf2f8);
    box-shadow: 0 2px 8px rgba(40, 76, 105, 0.1);
  }
  .navigation-workspace .sales-workspace-heading { align-items: center; }
  .navigation-workspace .sales-workspace-heading h2 { margin: 0; }
  .navigation-workspace .workspace-daily h3 { color: #244666; }
  .navigation-workspace .workspace-daily .sales-workspace-links { border-radius: 3px; }
  .navigation-workspace .workspace-extra { padding-top: 12px; border-top: 1px solid #bed0df; }
}
@media (max-width: 640px) {
  .workspace-daily .sales-workspace-links { grid-template-columns: minmax(0, 1fr); }
}

.page-size-input {
  width: 74px;
  min-width: 74px;
}

@media (max-width: 980px) {
  .global-search-box {
    width: 190px;
    max-width: 190px;
    flex-basis: 190px;
  }
}

@media (max-width: 640px) {
  .global-search-box {
    width: 155px;
    max-width: 155px;
    min-width: 155px;
    flex-basis: 155px;
  }
}

@media (max-width: 850px) {
  .module-home {
    padding: 18px 16px 32px;
  }

  .module-home-heading {
    align-items: start;
    flex-direction: column;
    gap: 8px;
  }

  .module-home-heading p {
    text-align: left;
  }

  .module-home-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .module-home-sections {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .sales-workspace {
    padding: 18px 16px 32px;
  }

  .sales-workspace-heading {
    align-items: start;
    flex-direction: column;
    gap: 8px;
  }

  .sales-workspace-heading p {
    text-align: left;
  }

  .sales-workspace-sections {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

@media (max-width: 640px) {
  .module-home-quick-actions,
  .items-overview-strip {
    grid-template-columns: 1fr;
  }
}
.login-remember-device {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.9rem;
}
.login-remember-device input[type="checkbox"] {
  width: 1rem;
  min-height: 1rem;
  margin: 0;
}

.last-sold-lookup { display: grid; gap: 16px; }
.last-sold-lookup > label { display: grid; gap: 6px; }
.last-sold-lookup > button { justify-self: start; }
.last-sold-matches { display: grid; gap: 6px; max-height: 220px; overflow-y: auto; }
.last-sold-matches button { text-align: left; }
.last-sold-lookup .metric strong { overflow-wrap: anywhere; }
.last-sold-lookup .customer-profile-link { font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.last-sold-lookup .customer-profile-link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.customer-profile-contact { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-bottom: 16px; }
.customer-purchase-history { display: grid; gap: 12px; margin-bottom: 20px; }
.customer-purchase-history > label { display: grid; gap: 6px; }
.customer-purchase-history .metric strong { overflow-wrap: anywhere; }
.customer-profile-simple { max-height: none; overflow: visible; border: 0; background: none; padding: 4px; gap: 18px; }
.customer-profile-simple .customer-profile-contact:empty { display: none; }
.customer-profile-simple .customer-profile-contact { margin-bottom: 0; }
.customer-profile-simple .customer-purchase-history { border: 0; padding: 0; background: none; box-shadow: none; margin: 0; }
.customer-last-bought { display: grid; gap: 8px; padding: 18px; margin: 16px 0; background: #eaf3fa; border-radius: 6px; color: #234359; }
.customer-last-bought strong { font-size: 23px; line-height: 1.3; overflow-wrap: anywhere; }
.customer-purchases-scroll { overflow-x: auto; }
.customer-purchases-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; }
.customer-purchases-table caption { text-align: left; font-weight: 600; padding: 4px 0 12px; }
.customer-purchases-table th, .customer-purchases-table td { padding: 10px 8px; white-space: normal; overflow-wrap: anywhere; }
.customer-purchases-table th:nth-child(2) { width: 38%; }
.customer-purchases-table th:nth-child(3) { width: 9%; }
.customer-purchases-table button { white-space: normal; text-align: left; }
.customer-account-toggle { justify-self: start; }
.sales-document-links { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.sales-document-links .sales-document-link { font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.sales-document-links .sales-document-link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
#customer-account-details { display: grid; gap: 14px; }
.item-sale-search-choices { display: grid; gap: 4px; max-height: 280px; overflow-y: auto; margin-top: 6px; }
.item-sale-search-choice { display: flex; align-items: center; gap: 8px; border: 1px solid #c6d4e1; padding: 6px; border-radius: 4px; background: #f7fafc; }
.item-sale-search-choice .item-sale-select { flex: 1; display: grid; gap: 3px; min-width: 0; text-align: left; white-space: normal; background: transparent; border: 0; box-shadow: none; }
.item-sale-select strong, .item-sale-select small { overflow-wrap: anywhere; }
.item-sale-search-choice .item-sale-price-button { flex-shrink: 0; }
.item-search-picker > .item-sale-price-button { justify-self: start; margin-top: 4px; }
.sales-order-entry-line > input { align-self: start; }
.invoice-start-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px 0; }
.invoice-start-actions > button { min-height: 26px; font-size: 12px; }
.invoice-secondary-actions { display: flex; flex-wrap: wrap; gap: 18px; margin: 0 0 24px; }
.invoice-secondary-actions button { font-size: 12px; }
.item-sale-prices { display: grid; gap: 12px; }
.item-sale-prices p { margin: 0; }
.item-sale-price-summary { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.item-sale-price-comparison { font-weight: 600; color: #234359; }
.item-sale-prices .customer-purchases-table { table-layout: auto; min-width: 580px; }
.item-sale-prices .customer-purchases-table th:nth-child(2), .item-sale-prices .customer-purchases-table th:nth-child(3) { width: auto; }
.customer-directory-toolbar { display: flex; align-items: end; gap: 20px; margin: 22px 0 16px; }
.customer-directory-toolbar > label { display: grid; gap: 6px; width: min(540px, 75%); }
.customer-directory-toolbar input { width: 100%; min-height: 38px; }
.customer-directory-toolbar summary { cursor: pointer; padding: 8px; }
.customer-directory { max-width: 1100px; font-family: "Segoe UI", Tahoma, Arial, sans-serif; }
.customer-directory table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.customer-directory th:first-child { width: 76%; }
.customer-directory th:last-child, .customer-directory-balance { text-align: right; }
.customer-directory th { padding: 8px 18px; }
.customer-directory td { padding: 14px 18px; vertical-align: middle; }
.customer-directory tbody tr:hover td, .customer-directory tbody tr:focus-within td { background: #eaf3fa; }
.customer-directory .customer-name-link { font-size: 18px; font-weight: 600; line-height: 1.4; text-decoration: none; text-align: left; white-space: normal; overflow-wrap: anywhere; }
.customer-directory .customer-name-link:hover { text-decoration: underline; }
.customer-directory .customer-name-link:focus-visible { outline: 2px solid #4785aa; outline-offset: 3px; }
.customer-directory-balance { font-size: 17px; font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }
.customer-profile-header { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 18px; }
.customer-profile-header h3 { font-size: 24px; margin: 0 0 6px; }
.customer-section-layout { display: grid; grid-template-columns: 185px minmax(0, 1fr); gap: 18px; align-items: start; }
.customer-section-menu { display: grid; gap: 5px; padding: 10px; border: 1px solid #aabed2; background: #e8f0f7; }
.customer-section-menu button { width: 100%; min-height: 38px; padding: 9px 10px; text-align: left; white-space: normal; }
.customer-section-menu button.active { color: #fff; border-color: #456b97; background: linear-gradient(#7c9ec7, #365a87); }
.customer-section-content { min-width: 0; min-height: 290px; }
.customer-section-content > .customer-section-title { margin: 0 0 18px; padding: 0 0 9px; border-bottom: 1px solid #b9ccdc; font-size: 16px; }
.customer-section-content .customer-credentials { grid-template-columns: 1fr; }
.standard-modal:has(.customer-section-layout) { max-width: 1040px; height: min(780px, calc(100dvh - 56px)); grid-template-rows: auto minmax(0, 1fr); }
.standard-modal:has(.customer-section-layout) > .modal-body { overflow: hidden; }
.standard-modal .customer-profile-simple { height: 100%; min-height: 0; grid-template-rows: auto minmax(0, 1fr) auto; }
.standard-modal .customer-form, .standard-modal .customer-form > .customer-card { height: 100%; min-height: 0; }
.standard-modal .customer-form > .customer-card { grid-template-rows: minmax(0, 1fr) auto; }
.standard-modal .customer-section-layout { min-height: 0; align-items: stretch; }
.standard-modal .customer-section-menu { align-self: start; }
.standard-modal .customer-section-content { min-height: 0; overflow: auto; scrollbar-gutter: stable; padding-right: 6px; }
.customer-profile-simple { gap: 12px; }
.customer-profile-simple .customer-profile-header { margin-bottom: 0; }
.customer-profile-simple .customer-profile-header h3 { font-size: 17px; margin-bottom: 4px; }
.customer-status-toggle { flex: 0 0 auto; margin: 0; }
.customer-status-toggle button { min-width: 68px; min-height: 30px; }
.customer-section-menu { gap: 3px; padding: 6px; }
.customer-section-menu button { min-height: 34px; padding: 8px; font-size: 12px; }
.customer-section-content { min-height: 220px; }
.customer-section-content > .customer-section-title { font-size: 14px; margin-bottom: 14px; padding-bottom: 8px; }
.customer-fields { border: 0; padding: 0; margin: 0; min-width: 0; }
.customer-section-content .customer-grid, .customer-section-content .address-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; }
.customer-section-content .customer-grid { margin-bottom: 14px; }
.customer-section-content .customer-identity-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.customer-identity-grid > label:first-child { grid-column: span 2; }
.customer-section-content .customer-credentials fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; padding: 12px; border-color: #c5d3df; background: #f8fbfe; }
.customer-section-content .customer-credentials legend { font-size: 12px; font-weight: 600; }
.customer-section-content .customer-credentials fieldset > label { margin: 0; }
.customer-section-content .customer-field-wide { grid-column: 1 / -1; }
.customer-section-content .customer-fields label, .customer-section-content .customer-card label { font-size: 12px; font-weight: 400; color: #526378; }
.customer-section-content input:not([type=checkbox]), .customer-section-content select, .customer-section-content textarea { width: 100%; min-width: 0; min-height: 32px; padding: 6px 9px; border: 1px solid #aebfce; border-radius: 4px; background: #fff; box-shadow: inset 0 1px 2px #193b5208; font: 13px "Segoe UI", Tahoma, Arial, sans-serif; color: #263e52; }
.customer-section-content input:focus-visible, .customer-section-content select:focus-visible, .customer-section-content textarea:focus-visible { outline: 2px solid #92b5d4; outline-offset: 1px; }
.customer-section-content input:not([type=checkbox]), .customer-section-content select { height: 32px; }
.customer-section-content input:disabled, .customer-section-content textarea:disabled { background: #edf2f6; color: #526378; }
.customer-section-content .customer-section h3 { font-size: 12px; }
.customer-section-content .customer-inline-form { margin: 0 0 16px; }
.customer-profile-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-top: 1px solid #c9d8e4; padding-top: 12px; }
.customer-profile-footer > span { margin-right: auto; font-size: 12px; }
.customer-shipping-picker { display: flex; align-items: end; flex-wrap: wrap; gap: 6px; }
.customer-shipping-picker > label { flex: 1; min-width: 130px; display: grid; gap: 4px; }
.customer-shipping-picker > button { min-height: 32px; }
.customer-address-options { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 14px; align-items: end; }
.customer-section-content .address-columns { gap: 12px 14px; }
.customer-section-content .address-columns > .customer-section { align-content: start; }
.customer-section-content .address-columns textarea { height: 64px; resize: none; }
.customer-notes-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 12px; }
.customer-notes-row > label { grid-column: 2; }
.customer-notes-row textarea { height: 72px; resize: vertical; }
@media (max-width: 700px) {
  .customer-section-layout { grid-template-columns: 1fr; }
  .standard-modal .customer-section-layout { grid-template-rows: auto minmax(0, 1fr); }
  .customer-section-menu { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-section-content .address-columns, .customer-address-options { grid-template-columns: 1fr; }
  .customer-section-content .customer-identity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-identity-grid > label:first-child { grid-column: auto; }
  .customer-notes-row { grid-template-columns: 1fr; }
  .customer-notes-row > label { grid-column: 1; }
}
.customer-credentials { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 20px; }
.customer-credentials fieldset { min-width: 0; margin: 0; padding: 12px; border: 1px solid #aabed2; border-radius: 4px; }
.customer-credentials legend { font-size: 14px; font-weight: 650; padding: 0 5px; }
.customer-credentials fieldset > label { display: grid; gap: 4px; margin-bottom: 8px; }
.customer-credentials fieldset > label.check { display: flex; }
.customer-credentials input { width: 100%; }
.customer-credentials input[type=checkbox] { width: auto; }
.customer-credentials dl { margin: 0; }
.customer-credentials dl > div { display: grid; grid-template-columns: 85px minmax(0, 1fr); gap: 8px; padding: 4px 0; }
.customer-credentials dt { color: #526378; }
.customer-credentials dd { margin: 0; overflow-wrap: anywhere; }
.customer-profile-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.customer-profile-details > div { display: grid; gap: 4px; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .customer-credentials, .customer-profile-details { grid-template-columns: 1fr; }
  .customer-profile-header { align-items: start; flex-direction: column; }
  .customer-directory td { padding: 12px 8px; }
  .customer-directory .customer-name-link { font-size: 17px; }
  .customer-directory-balance { font-size: 16px; }
  .customer-directory th:first-child { width: 65%; }
}
.customer-directory-pages { display: flex; justify-content: end; align-items: center; gap: 10px; padding: 12px 0; }
.app-shell.sidebar-collapsed { grid-template-columns: minmax(0, 1fr); }
.app-shell.sidebar-collapsed > .sidebar { display: none; }
.topbar { min-height: 62px; padding: 9px 12px; border-color: #9ab0c6; background: linear-gradient(#f9fcff, #e1ebf5); box-shadow: inset 0 1px 0 #fff, 0 1px 2px #203b5512; }
.topbar .navigation-controls { flex: 0 0 auto; gap: 5px; flex-wrap: nowrap; padding-right: 10px; border-right: 1px solid #bdcddd; }
.topbar .nav-history-button { width: 32px; min-width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 3px; color: #355978; box-shadow: inset 0 1px 0 #fff; }
.topbar .nav-history-button:disabled { opacity: .45; }
.topbar-page-title { min-width: 0; }
.topbar-page-title .eyebrow { font-size: 10px; line-height: 1.3; color: #647b91; }
.topbar-page-title h1 { margin: 2px 0 0; font-size: 18px; line-height: 1.25; color: #25415c; }
.topbar-company-badge { min-height: 38px; border-color: #bdccda; box-shadow: none; background: #f7faff; }
@media (max-width: 640px) {
  .topbar { flex-wrap: wrap; gap: 8px; }
  .topbar-title-wrap { flex: 1 1 100%; }
  .topbar-company-badge { flex: 0 1 210px; margin-left: auto; }
}
.sidebar-toggle { font-size: 18px; line-height: 1; }
.pos-focus-mode .sidebar-toggle, .pos-only-role .sidebar-toggle { display: none; }
.customer-list-tools { position: relative; align-self: center; }
.customer-list-tools > summary { list-style: none; cursor: pointer; padding: 3px 9px; border: 1px solid #99afc5; border-radius: 3px; background: linear-gradient(#fff, #d7e3ee); color: #294c70; font-size: 15px; line-height: 20px; }
.customer-list-tools > summary::-webkit-details-marker { display: none; }
.customer-list-tools > summary:focus-visible { outline: 2px solid #4785aa; outline-offset: 2px; }
.customer-list-tools-menu { position: absolute; top: calc(100% + 4px); left: 0; z-index: 30; display: grid; gap: 3px; min-width: 175px; padding: 5px; border: 1px solid #99afc5; border-radius: 3px; background: #f6faff; box-shadow: 0 3px 8px #203a5526; }
.customer-list-tools-menu button { width: 100%; text-align: left; white-space: nowrap; }

/* Workspaces use the same quiet, single-list layout as the customer directory. */
.classic-menu > .home-top-button, .classic-menu > .menu-slot { flex-shrink: 0; }
.workspace-directory { max-width: 820px; min-width: 0; }
.workspace-directory .workspace-tool-search { max-width: 100%; margin: 4px 0 18px; color: #526378; font-size: 12px; }
.workspace-directory .workspace-tool-search input { min-height: 38px; padding: 8px 10px; background: #fff; border: 1px solid #b8c8d6; border-radius: 4px; }
.workspace-categories { display: flex; flex-direction: row; flex-wrap: wrap; gap: 4px 16px; margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid #c9d8e4; }
.workspace-categories button { flex: 0 1 auto; width: auto; min-height: 36px; padding: 7px 2px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; box-shadow: none; color: #526378; white-space: normal; text-align: left; }
.workspace-categories button[aria-pressed="true"] { border-bottom-color: #315d7f; color: #24415d; font-weight: 650; }
.workspace-categories button:hover { color: #24415d; background: #edf4fa; }
.workspace-directory .workspace-task-list { display: grid; min-width: 0; }
.workspace-directory .workspace-task-list .sales-workspace-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; width: 100%; padding: 12px 8px; border: 0; border-bottom: 1px solid #e1e8ee; border-radius: 0; box-shadow: none; background: transparent; text-align: left; white-space: normal; }
.workspace-directory .workspace-task-list .sales-workspace-link:hover { background: #edf4fa; }
.workspace-directory .sales-workspace-link-label { color: #24415d; font-size: 14px; font-weight: 500; overflow-wrap: anywhere; }
.workspace-list-pages { display: flex; justify-content: end; align-items: center; gap: 8px; margin-top: 16px; }
.workspace-list-pages > span { margin-right: auto; color: #607387; font-size: 12px; }
.inventory-center-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.inventory-center-heading h2 { margin: 0; }
.inventory-center-simple > .inventory-task-main { min-width: 0; }
.inventory-center-simple .workspace-categories { margin-top: 0; }
@media (max-width: 640px) {
  .workspace-categories { gap: 4px 12px; }
  .workspace-categories button { font-size: 12px; }
  .inventory-center-heading { flex-wrap: wrap; }
}
.product-label-workspace { display: grid; gap: 14px; }
.product-label-workspace h4, .product-label-workspace p { margin: 0; }
.product-label-controls { border: 1px solid #d9e1e5; border-radius: 8px; padding: 12px; display: flex; align-items: end; flex-wrap: wrap; gap: 14px; min-width: 0; }
.product-label-controls label, .product-label-search { display: grid; gap: 6px; }
.product-label-controls .product-label-check { display: flex; align-items: center; padding-bottom: 8px; }
.product-label-results { max-height: 260px; overflow: auto; border: 1px solid #d9e1e5; border-radius: 8px; }
.product-label-result { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid #e5eaed; }
.product-label-result > span:first-of-type { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.product-label-result small { display: block; color: #526678; margin-top: 3px; }
.product-label-result input, .product-label-check input { width: auto; flex: 0 0 auto; }
.product-label-pagination, .product-label-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.product-label-selected { max-height: 220px; overflow: auto; }
.product-label-selected > div { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 8px 0; border-bottom: 1px solid #e5eaed; }
.product-label-selected > div > span { flex: 1; min-width: 140px; }
.product-label-selected label { display: flex; align-items: center; gap: 8px; }
.product-label-selected input { width: 76px; }
.product-label-ready { display: grid; gap: 10px; padding: 14px; border: 1px solid #a8c1af; background: #f1f7f3; border-radius: 8px; }

/* Sign-in only: a quiet paper-and-blue entrance to the classic application. */
.login-page.login-entry-page {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  grid-template-columns: minmax(0, 1080px);
  grid-template-rows: auto auto auto;
  align-content: center;
  gap: 22px;
  padding: 36px 28px;
  background: #edf2f6;
  color: #233d56;
}
.entry-masthead { display: flex; align-items: center; gap: 10px; }
.entry-masthead img { object-fit: contain; }
.entry-masthead strong { font-size: 23px; font-weight: 650; letter-spacing: -0.6px; }
.entry-masthead > span { margin-left: auto; color: #586c7c; font-size: 12px; }
main.entry-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  min-height: 570px;
  padding: 0;
  border: 1px solid #bccbd7;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(29, 57, 78, 0.07);
  overflow: hidden;
}
.entry-overview {
  padding: 42px 40px 32px;
  background: #e0eaf2;
  border-top: 4px solid #355e7e;
}
.entry-eyebrow,
.entry-form-kicker {
  margin: 0;
  color: #526c80;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.entry-overview h1 {
  margin: 16px 0;
  color: #203d55;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(32px, 3.3vw, 44px);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -1.4px;
}
.entry-description { max-width: 360px; margin: 0; color: #496277; font-size: 15px; line-height: 1.6; }
.entry-paper {
  width: min(100%, 362px);
  margin: 30px 0 0;
  padding: 22px 24px 18px;
  border: 1px solid #c3cfda;
  border-radius: 2px;
  background: #fffefa;
  color: #344e62;
  box-shadow: 5px 5px 0 #d2dee8;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.entry-paper-heading,
.entry-paper-reference,
.entry-paper-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.entry-paper-heading strong { font-family: Georgia, "Times New Roman", serif; font-size: 25px; font-weight: 400; }
.entry-paper-heading > span { color: #687880; font-size: 10px; letter-spacing: 1px; text-transform: uppercase; }
.entry-paper-reference { margin: 10px 0 20px; color: #687880; font-size: 11px; }
.entry-paper-reference > span:first-child { font-family: Consolas, monospace; }
.entry-paper-row { display: grid; grid-template-columns: minmax(0, 1fr) 32px 68px; gap: 10px; padding: 11px 0; border-bottom: 1px solid #e1e6e7; }
.entry-paper-row > span:not(:first-child) { text-align: right; }
.entry-paper-columns { padding: 8px 0; border-top: 1px solid #a9becd; color: #6d7c87; font-size: 10px; }
.entry-paper-total { margin-top: 16px; }
.entry-paper-total strong { font-size: 17px; color: #233d56; }
.entry-overview-note { margin: 24px 0 0; color: #526c80; font-size: 11px; line-height: 1.5; }
.login-entry-page .login-panel {
  align-self: stretch;
  align-content: center;
  width: 100%;
  margin: 0;
  padding: 40px 44px;
  gap: 16px;
  border: 0;
  border-left: 1px solid #cbd7e0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.entry-form-heading { display: grid; gap: 10px; margin-bottom: 8px; }
.login-entry-page .login-panel-title { margin: 0; padding: 0; color: #233d56; font-size: 28px; font-weight: 600; }
.login-entry-page .login-hint { color: #5b6c79; font-size: 12px; line-height: 1.5; }
.login-entry-page .login-hint.warning { color: #875407; }
.login-entry-page .login-field { gap: 8px; font-size: 13px; font-weight: 600; }
.login-entry-page .login-field input { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #9bafbe; border-radius: 4px; background: #fff; color: #233d56; font-size: 14px; box-shadow: none; }
.login-entry-page .login-field input::placeholder { color: #768590; opacity: 1; }
.login-entry-page .password-row { grid-template-columns: minmax(0, 1fr) auto; gap: 0; }
.login-entry-page .password-row input { border-radius: 4px 0 0 4px; }
.login-entry-page .password-row button { width: auto; min-width: 60px; padding: 0 10px; border: 1px solid #9bafbe; border-left: 0; border-radius: 0 4px 4px 0; background: #f2f6f9; color: #365a76; box-shadow: none; font-size: 12px; }
.login-entry-page .login-remember-device { gap: 8px; align-items: flex-start; color: #445c6f; font-size: 12px; line-height: 18px; }
.login-entry-page .login-remember-device input { flex-shrink: 0; margin-top: 1px; accent-color: #315d7f; }
.login-entry-page .login-panel > button.primary { min-height: 44px; margin-top: 2px; border: 1px solid #244c6c; border-radius: 4px; background: #315d7f; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); font-size: 14px; }
.login-entry-page .login-panel > button.primary:hover { background: #254c6b; filter: none; }
.login-entry-page .login-divider { margin: 0; background: #e2e8ed; }
.login-entry-page .link-button { min-height: 28px; color: #315d7f; font-size: 12px; font-weight: 500; }
.login-entry-page :is(input, button):focus-visible { outline: 2px solid #226ea2; outline-offset: 3px; }
.login-entry-page .recovery-panel { gap: 12px; padding: 14px; border-color: #c3d2de; background: #f6f9fb; }
.login-entry-page .recovery-panel > button { min-height: 38px; }
.login-entry-page .error { margin: 0; padding: 10px 12px; border-left: 3px solid #ad4133; background: #fff4f1; color: #903323; line-height: 1.5; }
.entry-footer { color: #5b6f7e; font-size: 12px; text-align: right; }
@media (max-width: 900px) {
  .login-page.login-entry-page { padding: 28px 20px; gap: 18px; }
  main.entry-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
  .entry-overview { padding: 32px 26px; }
  .login-entry-page .login-panel { padding: 32px 26px; }
  .entry-paper { padding: 18px; }
}
@media (max-width: 700px) {
  .login-page.login-entry-page { align-content: start; padding: 24px 16px; }
  .entry-masthead > span { display: none; }
  main.entry-layout { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .entry-overview { padding: 24px; }
  .entry-overview h1 { margin: 0 0 10px; font-size: 31px; letter-spacing: -0.8px; }
  .entry-description { max-width: none; font-size: 13px; }
  .entry-eyebrow, .entry-paper, .entry-overview-note { display: none; }
  .login-entry-page .login-panel { padding: 28px 24px; border-left: 0; border-top: 1px solid #cbd7e0; }
  .entry-form-heading { margin-bottom: 2px; }
  .entry-form-kicker { display: none; }
  .entry-footer { text-align: center; font-size: 11px; }
}

.invitation-result input[readonly] { max-width: 240px; font-family: Consolas, monospace; font-size: 22px; letter-spacing: 3px; }
#add-company-form { margin-top: 16px; }

/* Match the compact company card and workspace shell on the live site. */
.sidebar { overflow: visible; padding: 0; scrollbar-gutter: auto; }
.sidebar-scroll { width: 100%; height: 100%; overflow-y: auto; overflow-x: hidden; padding: 6px 12px; scrollbar-width: none; }
.sidebar-scroll::-webkit-scrollbar { display: none; }
.sidebar > .sidebar-toggle { position: absolute; right: -12px; top: 48px; z-index: 5; width: 24px; min-width: 24px; height: 36px; padding: 0; border: 1px solid #8aa9bf; border-radius: 4px; background: linear-gradient(#f9fcff,#dcebf5); color: #355978; }
.sidebar > .sidebar-toggle svg { width: 15px; height: 15px; }
.sidebar > .sidebar-toggle:focus-visible { outline: 2px solid #397caa; outline-offset: 2px; }
.app-shell.sidebar-collapsed { --sidebar-width: 28px; grid-template-columns: var(--sidebar-width) minmax(0,1fr); }
.app-shell.sidebar-collapsed > .sidebar { display: block; }
.app-frame.pos-focus-mode .app-shell > .sidebar, .app-frame.pos-only-role .app-shell > .sidebar { display: none; }
.sidebar-collapsed .sidebar-scroll { display: none; }
.sidebar .company-pane { display: grid; grid-template-columns: 42px minmax(0,1fr); column-gap: 9px; align-items: center; text-align: left; padding: 13px 9px; margin-bottom: 8px; }
.sidebar .company-pane .active-company-logo, .sidebar .company-pane .active-company-logo-mark { grid-row: 1 / span 2; width: 42px; height: 42px; margin: 0; font-size: 15px; }
.sidebar .company-pane > strong { font-size: 13px; overflow-wrap: anywhere; }
.sidebar .company-pane > span { font-size: 12px; margin: 3px 0 0; }
.sidebar nav { gap: 5px; }
.sidebar nav .nav-heading-button { min-height: 32px; padding: 6px 9px; font-size: 13px; }
.sidebar .nav-group-icon { display: none; }
.sidebar .shortcut-drop, .sidebar .shortcut-drop.empty { min-height: 0; padding: 0; }
.sidebar .shortcut-empty { padding: 8px; font-size: 12px; }
.sidebar .shortcut-drop.open .nav-group-items { max-height: 170px; overflow-y: auto; }
main:has(.navigation-workspace) > .topbar { display: none; }
@media (max-width: 640px) {
  .app-shell.sidebar-collapsed { display: grid; }
  .sidebar { position: relative; top: auto; }
  .app-shell.sidebar-collapsed > .sidebar { height: 100%; min-height: 60px; }
  .sidebar > .sidebar-toggle { right: 4px; top: 8px; }
  .sidebar-scroll { max-height: 280px; }
}