:root {
  color-scheme: light;
  --ink: #1f2528;
  --muted: #637074;
  --line: #d6dfdc;
  --soft-line: #edf2f0;
  --surface: #f3f8f6;
  --app-bg: #f3f8f6;
  --nav-bg: #f3f8f6;
  --tile-tint: #eef8f6;
  --brand-tint: #eef8f6;
  --panel: #ffffff;
  --brand: #1c8d84;
  --brand-dark: #2f6862;
  --leaf: #6fa393;
  --clay: #b58c59;
  --clay-soft: #d8c8aa;
  --steel: #667781;
  --danger: #8c3f35;
  --shadow: 0 10px 24px rgba(39, 54, 54, .12);
  --pos-rail-offset: 80px;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-width: 0;
  overflow-x: clip;
}

[hidden] {
  display: none !important;
}

body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--app-bg);
  line-height: 1.4;
}

button,
input,
textarea {
  font: inherit;
}

button {
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  cursor: pointer;
}

button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand) 28%, transparent);
  outline-offset: 2px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.app-frame {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 12px;
  width: min(1520px, calc(100% - 24px));
  margin: 0 auto;
  padding: 14px 0 28px;
}

body.admin-open .app-frame {
  grid-template-columns: minmax(0, 1fr);
}

body.admin-open .side-nav,
body.admin-open .topbar {
  display: none;
}

.shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  min-height: calc(100vh - 28px);
}

.side-nav {
  position: sticky;
  top: calc(14px + var(--pos-rail-offset));
  z-index: 20;
  display: grid;
  grid-auto-rows: min-content;
  gap: 8px;
  align-self: start;
  min-height: calc(100vh - var(--pos-rail-offset) - 28px);
  max-height: calc(100dvh - var(--pos-rail-offset) - 28px);
  margin-top: var(--pos-rail-offset);
  border: 1px solid #dfe5e3;
  border-radius: 8px;
  padding: 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--nav-bg);
  box-shadow: 0 8px 18px rgba(39, 54, 54, .08);
  scrollbar-width: none;
}

.side-nav::-webkit-scrollbar {
  display: none;
}

.side-nav-categories {
  display: grid;
  gap: 8px;
}

.side-nav-item {
  display: grid;
  place-items: center;
  gap: 4px;
  min-width: 0;
  width: 56px;
  min-height: 58px;
  border-color: transparent;
  padding: 4px;
  background: transparent;
  color: var(--steel);
}

.side-nav-item span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 30px;
  border-radius: 8px;
  background: #ffffff;
  font-weight: 850;
  line-height: 1;
}

.lucide-icon {
  width: 1em;
  height: 1em;
  display: block;
  color: currentColor;
}

.side-nav-item .lucide-icon,
.admin-tabs button > span .lucide-icon {
  width: 18px;
  height: 18px;
  stroke-width: 2.2;
}

.side-nav-item small {
  max-width: 100%;
  overflow: hidden;
  color: inherit;
  font-size: .68rem;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.side-nav-item.active {
  border-color: var(--brand);
  background: #ffffff;
  color: var(--brand-dark);
}

.side-nav-item.utility {
  border-top: 1px solid var(--line);
  border-radius: 0;
  padding-top: 10px;
}

.side-nav-item.active span {
  background: var(--tile-tint);
}

.side-nav-spacer {
  min-height: 16px;
}

.mobile-backdrop {
  display: none;
}

.login-screen {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(239, 247, 245, .94);
  backdrop-filter: blur(8px);
}

.login-screen[hidden] {
  display: none;
}

.login-card {
  display: grid;
  gap: 14px;
  width: min(420px, 100%);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(31, 37, 40, .18);
}

.login-card img {
  width: 156px;
  height: 54px;
  object-fit: contain;
  object-position: left center;
}

.login-card h2,
.login-card p {
  margin: 0;
}

.login-card p {
  color: var(--muted);
}

.login-card label {
  display: grid;
  gap: 6px;
}

.login-card label span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.login-card input,
.login-card select {
  min-height: 56px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  font: inherit;
  font-size: 1.05rem;
}

.login-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.login-divider {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.login-divider::before,
.login-divider::after {
  content: "";
  height: 1px;
  background: var(--line);
}

.topbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 80px;
  border-bottom: 1px solid var(--line);
}

.topbar-actions {
  position: relative;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-self: end;
}

.topbar-popover {
  position: relative;
}

.topbar-icon-button {
  display: inline-grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--brand-dark);
  box-shadow: 0 6px 16px rgba(31, 37, 40, .06);
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.topbar-icon-button:hover,
.topbar-icon-button[aria-expanded="true"],
.topbar-icon-button[aria-pressed="true"] {
  border-color: rgba(21, 142, 132, .45);
  background: rgba(21, 142, 132, .09);
}

.topbar-icon-button .lucide-icon {
  width: 22px;
  height: 22px;
}

.realtime-call-topbar-button {
  position: relative;
}

.topbar-call-dot {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 10px;
  height: 10px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #e03d3d;
}

.realtime-call-panel {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 120;
  display: grid;
  gap: 12px;
  width: min(420px, calc(100vw - 24px));
  max-height: min(720px, calc(100dvh - 32px));
  overflow: auto;
  border: 1px solid rgba(31, 37, 40, .18);
  border-radius: 8px;
  padding: 14px;
  background: #ffffff;
  box-shadow: 0 18px 48px rgba(31, 37, 40, .22);
}

.realtime-call-panel[hidden] {
  display: none;
}

.realtime-call-panel[data-call-layout="fullscreen"] {
  inset: 14px;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: auto;
  max-height: none;
  overflow: hidden;
}

.realtime-call-panel-header,
.realtime-incoming-call,
.realtime-call-actions,
.realtime-call-controls {
  display: flex;
  align-items: center;
  gap: 10px;
}

.realtime-call-panel-header {
  justify-content: space-between;
}

.realtime-call-panel-header strong,
.realtime-incoming-call strong {
  display: block;
}

.realtime-call-panel-header small,
.realtime-incoming-call small,
.realtime-call-status {
  color: var(--muted);
}

.realtime-call-start {
  display: grid;
  gap: 10px;
}

.segmented-control {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f4f8f7;
}

.segmented-control button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  justify-items: start;
  column-gap: 8px;
  row-gap: 2px;
  min-width: 0;
  min-height: 64px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 9px 10px;
  background: transparent;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.segmented-control button.active {
  border-color: rgba(21, 142, 132, .62);
  background: #ffffff;
  box-shadow: inset 0 0 0 2px rgba(21, 142, 132, .16), 0 1px 6px rgba(31, 37, 40, .12);
}

.segmented-control button.active::after {
  content: "Actief";
  grid-column: 2;
  display: inline-block;
  border-radius: 999px;
  padding: 2px 7px;
  background: rgba(21, 142, 132, .12);
  color: var(--brand);
  font-size: .72rem;
  font-weight: 900;
}

.segmented-control .lucide-icon {
  grid-row: span 2;
  width: 18px;
  height: 18px;
}

.segmented-control .mode-title,
.segmented-control .mode-hint {
  min-width: 0;
}

.segmented-control .mode-hint {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 700;
}

.realtime-call-panel .segmented-control {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.realtime-call-panel .segmented-control button {
  position: relative;
  grid-template-columns: 22px minmax(0, 1fr);
  grid-template-rows: auto auto;
  min-width: 0;
  overflow: hidden;
}

.realtime-call-panel .segmented-control button.active {
  padding-right: 10px;
}

.realtime-call-panel .segmented-control button.active::after {
  position: absolute;
  top: 8px;
  right: 8px;
  grid-column: auto;
  max-width: calc(100% - 16px);
  font-size: .66rem;
  line-height: 1.1;
}

.realtime-call-panel .segmented-control .lucide-icon {
  flex: 0 0 auto;
}

.realtime-call-panel .segmented-control .mode-title,
.realtime-call-panel .segmented-control .mode-hint {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: normal;
  word-break: normal;
  line-height: 1.2;
}

.realtime-call-panel .segmented-control .mode-title {
  align-self: end;
}

.realtime-call-panel .segmented-control .mode-hint {
  grid-column: 2;
  white-space: normal;
}

.realtime-call-panel .segmented-control button.active .mode-title {
  padding-right: 46px;
}

.realtime-incoming-call {
  justify-content: space-between;
  border: 1px solid rgba(224, 61, 61, .24);
  border-radius: 8px;
  padding: 10px;
  background: #fff6f4;
}

.realtime-active-call {
  display: grid;
  gap: 12px;
  min-height: 0;
}

.realtime-call-panel[data-call-layout="fullscreen"] .realtime-active-call {
  grid-template-rows: minmax(0, 1fr) auto auto;
  height: 100%;
}

.realtime-call-panel[data-active-call] .realtime-call-panel-header strong,
.realtime-call-panel[data-active-call] .realtime-call-panel-header small,
.realtime-call-panel[data-active-call] .realtime-call-status {
  display: none;
}

.realtime-active-call[hidden],
.realtime-incoming-call[hidden] {
  display: none;
}

.realtime-video-stage {
  display: grid;
  gap: 10px;
  min-height: 0;
}

.realtime-video-main {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  min-height: 220px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #101819;
  color: #fff;
  text-align: center;
  overflow: hidden;
}

.realtime-call-panel[data-call-layout="fullscreen"] .realtime-video-stage,
.realtime-call-panel[data-call-layout="fullscreen"] .realtime-video-main {
  height: 100%;
}

.realtime-call-panel[data-call-layout="fullscreen"] .realtime-video-main {
  aspect-ratio: auto;
  min-height: calc(100dvh - 230px);
}

.realtime-video-placeholder {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-content: center;
  gap: 8px;
  padding: 20px;
}

.realtime-video-placeholder[hidden] {
  display: none;
}

.realtime-video-placeholder .lucide-icon {
  width: 34px;
  height: 34px;
}

.realtime-video-main video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.realtime-video-overlay {
  display: none;
}

.realtime-video-overlay strong,
.realtime-video-overlay small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.realtime-video-overlay small {
  opacity: .86;
  font-size: .72rem;
}

.realtime-video-main .realtime-local-preview {
  inset: 10px 10px auto auto;
  z-index: 3;
  width: 92px;
  height: 68px;
  object-fit: cover;
  border: 2px solid rgba(255, 255, 255, .8);
  border-radius: 8px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .32);
}

.realtime-video-main video[data-testid="realtime-remote-video"]:not([hidden]) ~ .realtime-video-placeholder {
  display: none;
}

.realtime-video-strip {
  display: flex;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
}

.realtime-participant-chip {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 10px;
  background: #f8fbfb;
  font-size: .85rem;
  font-weight: 800;
}

.realtime-call-controls {
  display: grid;
  grid-template-columns: repeat(4, 44px);
  justify-content: center;
  gap: 12px;
}

.realtime-video-main .realtime-call-controls {
  position: absolute;
  left: 50%;
  bottom: 12px;
  z-index: 4;
  display: flex;
  grid-template-columns: none;
  gap: 8px;
  padding: 6px;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 999px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 14px 36px rgba(0, 0, 0, .24);
  backdrop-filter: blur(14px);
  transform: translateX(-50%);
}

.realtime-call-controls button,
.realtime-call-actions button {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  font-weight: 800;
  cursor: pointer;
}

.realtime-call-controls button {
  display: inline-grid;
  width: 44px;
  height: 44px;
  place-items: center;
  padding: 0;
}

.realtime-call-controls .lucide-icon {
  width: 20px;
  height: 20px;
}

.realtime-call-controls button[aria-pressed="true"] {
  border-color: rgba(21, 142, 132, .45);
  background: rgba(21, 142, 132, .09);
}

.realtime-call-controls button.danger,
.realtime-call-actions button.danger {
  border-color: rgba(224, 61, 61, .45);
  background: #e03d3d;
  color: #fff;
}

.icon-only-button {
  display: inline-grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
}

.icon-only-button .lucide-icon {
  width: 18px;
  height: 18px;
}

.retail-media-slot {
  min-width: 0;
}

.retail-media-slot[hidden] {
  display: none !important;
}

.retail-media-card {
  display: grid;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--line) 84%, var(--brand));
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff 0%, color-mix(in srgb, var(--brand-tint) 74%, #fff) 100%);
  color: var(--ink);
  box-shadow: 0 8px 18px rgba(31, 37, 40, .07);
  overflow: hidden;
}

.retail-media-card a {
  display: grid;
  gap: 2px;
  min-width: 0;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.retail-media-card.with-creative a {
  grid-template-columns: 58px minmax(0, 1fr);
  grid-template-areas:
    "image label"
    "image headline"
    "image body"
    "image cta";
  column-gap: 10px;
}

.retail-media-card.image-banner {
  background: #fff;
}

.retail-media-card.image-banner a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.retail-media-banner-image {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}

.retail-media-creative {
  grid-area: image;
  align-self: stretch;
  width: 58px;
  height: 100%;
  min-height: 48px;
  border-radius: 6px;
  object-fit: cover;
  background: var(--brand-tint);
}

.retail-media-card small {
  grid-area: label;
  color: var(--muted);
  font-size: .64rem;
  font-weight: 850;
  line-height: 1.1;
  text-transform: uppercase;
}

.retail-media-card strong,
.retail-media-card span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.retail-media-card strong {
  grid-area: headline;
  font-size: .88rem;
  line-height: 1.12;
  white-space: nowrap;
}

.retail-media-card span {
  grid-area: body;
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.18;
}

.retail-media-card em {
  grid-area: cta;
  color: var(--brand-dark);
  font-size: .72rem;
  font-style: normal;
  font-weight: 850;
}

.retail-media-header {
  display: flex;
  justify-content: center;
  align-self: center;
  min-width: 240px;
}

body.retail-media-header-active .payoff {
  display: none;
}

.retail-media-header .retail-media-card {
  width: 100%;
  max-width: 608px;
  height: 58px;
  max-height: 58px;
}

.retail-media-header .retail-media-card:not(.image-banner) a {
  padding: 9px 12px;
}

.retail-media-header .retail-media-banner-image {
  width: 100%;
  height: auto;
  max-width: 608px;
  max-height: 58px;
}

.retail-media-cart {
  display: block;
}

.retail-media-cart .retail-media-card {
  width: 100%;
}

.retail-media-cart .retail-media-card.image-banner {
  height: auto;
}

.retail-media-cart .retail-media-card.image-banner a {
  height: auto;
}

.retail-media-cart .retail-media-banner-image {
  width: 100%;
  max-width: 520px;
}

.retail-media-cart .retail-media-card:not(.image-banner) a {
  padding: 12px 14px;
}

.topbar-menu {
  position: absolute;
  z-index: 80;
  top: calc(100% + 8px);
  right: 0;
  width: min(280px, calc(100vw - 28px));
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(31, 37, 40, .18);
}

.topbar-menu select,
.topbar-menu button {
  touch-action: manipulation;
}

.context-menu {
  width: min(360px, calc(100vw - 28px));
}

.context-menu .topbar-menu-field + .topbar-menu-field {
  margin-top: 10px;
}

.topbar-menu-status {
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 84%, #fff);
  color: var(--muted);
  font-size: .82rem;
  font-weight: 720;
}

.topbar-menu-status[data-tone="ok"] {
  background: color-mix(in srgb, var(--brand) 12%, #fff);
  color: var(--brand-dark);
}

.topbar-menu-status[data-tone="error"] {
  background: color-mix(in srgb, var(--danger) 10%, #fff);
  color: var(--danger);
}

.topbar-menu[hidden] {
  display: none;
}

.topbar-menu-field {
  display: grid;
  gap: 6px;
}

.topbar-menu-field span {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.topbar-menu-field select {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-weight: 760;
}

#language-menu {
  width: min(236px, calc(100vw - 28px));
  padding: 8px;
}

#language-menu .topbar-menu-field {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

#language-menu [data-testid="language-select"] {
  display: none;
}

.language-option-list {
  display: grid;
  gap: 2px;
}

.settings-language-native-field,
.settings-language-native-field .language-select-shell {
  display: none !important;
}

.settings-language-dropdown {
  position: relative;
  width: min(360px, 100%);
  min-width: 0;
}

.settings-language-button {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 18px;
  gap: 10px;
  align-items: center;
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
}

.settings-language-button:hover,
.settings-language-button:focus-visible,
.settings-language-button[aria-expanded="true"] {
  border-color: rgba(8, 129, 120, .42);
  background: color-mix(in srgb, var(--brand-tint) 36%, #fff);
  outline: none;
}

.settings-language-button strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-language-option-list {
  position: absolute;
  z-index: 82;
  top: calc(100% + 6px);
  left: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(31, 37, 40, .18);
}

.settings-language-option-list[hidden] {
  display: none;
}

.language-scope-note,
.language-base-help {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

.language-option {
  min-height: 44px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  padding: 0 10px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.language-option:hover,
.language-option:focus-visible {
  background: rgba(8, 129, 120, .08);
  outline: none;
}

.language-option[aria-selected="true"] {
  background: rgba(8, 129, 120, .12);
  color: var(--accent-strong);
}

.language-option[aria-selected="true"]::after {
  content: "";
  width: 8px;
  height: 14px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(40deg);
  justify-self: end;
  grid-column: 3;
  grid-row: 1;
}

.language-select-shell {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.topbar-menu-field .language-selected-flag,
.select-box .language-selected-flag,
.language-option-flag {
  width: 28px;
  height: 22px;
  border: 1px solid var(--line);
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 2px rgba(22, 32, 35, .08);
  font-size: 1.05rem;
  line-height: 1;
  text-transform: none;
}

.language-selected-flag img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.language-option-flag img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.device-gate {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 16px;
  border: 1px solid rgba(191, 142, 77, .45);
  border-left: 6px solid var(--clay);
  border-radius: 8px;
  padding: 18px;
  background: #fffaf2;
  box-shadow: var(--shadow);
}

.device-gate[hidden] {
  display: none;
}

.device-gate h2,
.device-gate p,
.device-gate dl {
  margin: 0;
}

.device-gate h2 {
  margin-top: 8px;
  font-size: clamp(1.25rem, 2vw, 1.8rem);
}

.device-gate p {
  margin-top: 6px;
  color: var(--muted);
}

.device-gate-facts {
  display: grid;
  gap: 8px;
}

.device-gate-facts div {
  min-width: 0;
  border: 1px solid rgba(191, 142, 77, .28);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.device-gate-facts dt {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 860;
  text-transform: uppercase;
}

.device-gate-facts dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  font-weight: 820;
}

.device-activation-form {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, auto) minmax(160px, auto);
  gap: 10px;
  align-items: end;
}

.device-activation-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.device-activation-form input {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 1.25rem;
  font-weight: 860;
  letter-spacing: 0;
}

.topbar-menu-action {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
  font-weight: 820;
  text-align: left;
  cursor: pointer;
}

.topbar-menu-action:hover,
.topbar-menu-action:focus-visible {
  border-color: rgba(21, 142, 132, .45);
  background: rgba(21, 142, 132, .08);
  outline: none;
}

.topbar-menu-action.danger {
  color: #8a2f2f;
}

.topbar-menu-action.danger:hover,
.topbar-menu-action.danger:focus-visible {
  border-color: rgba(138, 47, 47, .35);
  background: #fff4f2;
}

.topbar-menu-action .lucide-icon {
  width: 20px;
  height: 20px;
}

.custom-language-form textarea {
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  resize: vertical;
}

.language-json-tools {
  display: flex;
  gap: 10px;
  align-items: end;
  flex-wrap: wrap;
  min-width: 0;
}

.language-json-tools .mini-action {
  min-height: 48px;
  flex: 1 1 180px;
}

.language-upload-control {
  display: grid;
  gap: 6px;
  flex: 2 1 260px;
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
  text-transform: uppercase;
}

.language-upload-control input {
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
  color: var(--ink);
}

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

.icon-button {
  display: none;
  width: 52px;
  height: 52px;
  font-size: 2rem;
  font-weight: 750;
  line-height: 1;
}

.brand-mark {
  display: flex;
  min-width: 0;
  gap: 12px;
  align-items: center;
}

body.retail-media-header-active .brand-mark {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
}

body.retail-media-header-active .brand-mark > div {
  display: none;
}

.brand-mark img {
  width: 168px;
  max-width: 42vw;
  height: 56px;
  object-fit: contain;
  object-position: left center;
}

.payoff {
  margin: 0;
  color: var(--muted);
  font-size: .95rem;
  overflow-wrap: anywhere;
}

.register-context,
.register-switcher,
.status-strip,
.sync-strip,
.category-tabs,
.profile-filter-tabs,
.payment-stack {
  display: flex;
  min-width: 0;
  gap: 8px;
  align-items: center;
}

.register-context {
  flex-wrap: wrap;
  justify-content: flex-start;
  color: var(--muted);
  font-size: .94rem;
}

.register-context strong {
  color: var(--ink);
}

.register-switcher {
  flex-wrap: wrap;
}

.register-switcher label {
  display: grid;
  min-width: 150px;
  gap: 4px;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 800;
  text-transform: uppercase;
}

.register-switcher select {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  padding: 6px 10px;
  font: inherit;
  font-size: .9rem;
  font-weight: 700;
}

.status-strip,
.sync-strip {
  flex-wrap: wrap;
  padding: 0;
}

.context-footer {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
  align-self: end;
}

.status {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--clay);
  border-radius: 8px;
  padding: 6px 12px;
  color: var(--muted);
  background: rgba(255, 255, 255, .78);
}

.status.ok {
  border-left-color: var(--brand);
  color: var(--ink);
}

.sync-strip {
  display: grid;
  grid-template-columns: minmax(132px, .8fr) minmax(160px, 1fr) minmax(170px, 1fr) minmax(170px, 1fr) minmax(190px, 1.1fr);
  gap: 8px;
  align-items: stretch;
}

.sync-pill {
  display: inline-flex;
  min-width: 0;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-strong);
  border-radius: 8px;
  padding: 7px 12px;
  background: rgba(255, 255, 255, .86);
  color: var(--ink);
  font-size: .86rem;
  font-weight: 760;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.sync-pill small {
  display: block;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 720;
  line-height: 1.2;
}

.sync-pill.ok {
  border-left-color: var(--brand);
}

.sync-pill.offline {
  border-left-color: #b58c59;
  background: #fff8ec;
}

.sync-pill.degraded,
.sync-pill.warning {
  border-left-color: #c7812d;
  background: #fff8ec;
}

.sync-pill.syncing {
  border-left-color: var(--brand-dark);
  background: color-mix(in srgb, var(--brand) 10%, #fff);
}

.sync-dot {
  width: 10px;
  height: 10px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 14%, transparent);
}

.sync-action {
  justify-content: flex-start;
  text-align: left;
}

.sync-action.has-queue {
  border-left-color: #b58c59;
}

.queue-button {
  min-height: 38px;
  padding: 0 12px;
  color: var(--brand-dark);
  font-weight: 760;
}

.queue-review-panel {
  display: grid;
  gap: 4px;
  min-width: min(360px, 100%);
  border: 1px solid rgba(181, 82, 64, .38);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgba(255, 247, 235, .96);
  color: var(--ink);
  box-shadow: 0 10px 22px rgba(51, 41, 32, .08);
}

.queue-diagnostics-panel {
  display: grid;
  gap: 6px;
  min-width: min(420px, 100%);
  max-width: 520px;
  border: 1px solid rgba(41, 91, 91, .22);
  border-radius: 8px;
  padding: 8px 10px;
  background: rgba(255, 255, 255, .94);
  color: var(--ink);
  box-shadow: 0 10px 22px rgba(51, 41, 32, .06);
}

.queue-diagnostics-panel[hidden] {
  display: none;
}

.queue-diagnostics-panel > strong,
.queue-diagnostics-panel > small {
  overflow-wrap: anywhere;
}

.queue-diagnostics-panel > small {
  color: var(--muted);
  line-height: 1.25;
}

.queue-diagnostics-list {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.queue-diagnostics-list li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 8px;
  align-items: start;
  padding: 6px 8px;
  border: 1px solid rgba(35, 43, 43, .08);
  border-radius: 6px;
  background: rgba(246, 248, 248, .9);
}

.queue-diagnostics-list li[data-queue-status="syncing"] {
  border-color: rgba(41, 91, 91, .26);
  background: color-mix(in srgb, var(--brand) 8%, #fff);
}

.queue-diagnostics-list li[data-queue-status="conflict"],
.queue-diagnostics-list li[data-queue-status="rejected"] {
  border-color: rgba(181, 82, 64, .32);
  background: rgba(255, 247, 235, .96);
}

.queue-diagnostics-list strong,
.queue-diagnostics-list small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.queue-diagnostics-list small {
  grid-column: 1 / -1;
  color: var(--muted);
  line-height: 1.25;
}

.queue-status-badge {
  border-radius: 999px;
  padding: 2px 7px;
  background: rgba(35, 43, 43, .08);
  color: var(--ink);
  font-size: .75rem;
  font-weight: 780;
  white-space: nowrap;
}


.queue-review-panel[hidden] {
  display: none;
}

.queue-review-panel strong,
.queue-review-panel span,
.queue-review-panel small {
  overflow-wrap: anywhere;
}

.queue-review-panel small {
  color: var(--muted);
  line-height: 1.25;
}

.queue-review-action {
  justify-self: start;
  border: 1px solid rgba(181, 82, 64, .45);
  border-radius: 6px;
  padding: 5px 9px;
  background: rgba(255, 255, 255, .8);
  color: var(--brand-dark);
  font: inherit;
  font-weight: 760;
  cursor: pointer;
}

.queue-review-action:hover {
  background: #fff;
}

.pos-workspace {
  display: grid;
  grid-template-columns: minmax(440px, 1.12fr) minmax(390px, .72fr);
  gap: 12px;
  align-items: start;
  height: 100%;
  min-height: 0;
}

@media (min-width: 1200px) {
  .pos-workspace {
    grid-template-columns: minmax(620px, 1fr) minmax(440px, .58fr);
  }
}

.pos-workspace[hidden],
.status-strip[hidden],
.sync-strip[hidden],
.context-footer[hidden] {
  display: none;
}

article,
button {
  min-width: 0;
}

article {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .9);
}

.product-pane,
.cart-pane {
  max-height: 100%;
  padding: 12px;
  box-shadow: var(--shadow);
}

.product-pane {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  gap: 15px;
  height: auto;
}

.cart-pane {
  position: sticky;
  top: 14px;
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 12px;
  align-content: start;
}

.admin-workspace {
  display: grid;
  grid-template-columns: 286px minmax(0, 1fr);
  grid-template-areas:
    "header panel"
    "nav panel";
  gap: 12px 16px;
  align-items: start;
}

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

.admin-header,
.admin-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--shadow);
}

.admin-header {
  grid-area: header;
  position: sticky;
  top: 14px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.admin-panel {
  grid-area: panel;
  display: grid;
  gap: 16px;
  padding: 18px;
}

.admin-header h2,
.admin-panel h2 {
  margin: 0;
}

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

.admin-logo {
  width: min(190px, 100%);
  height: auto;
}

.admin-context-card {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f7fbfa;
}

.admin-context-card span {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 820;
  letter-spacing: 0;
  text-transform: uppercase;
}

.admin-context-card strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: .95rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-tabs {
  grid-area: nav;
  position: sticky;
  top: 288px;
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--shadow);
}

.admin-tabs button {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-areas:
    "icon label";
  align-items: center;
  justify-content: stretch;
  gap: 0 10px;
  width: 100%;
  min-height: 50px;
  border-color: transparent;
  background: transparent;
  padding: 8px 10px;
  font-weight: 760;
  color: var(--steel);
  text-align: left;
}

.admin-tabs button > span {
  grid-area: icon;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: #f1f6f4;
  color: var(--brand-dark);
  font-weight: 900;
}

.admin-tabs button > strong,
.admin-tabs button > small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-tabs button > strong {
  grid-area: label;
  color: inherit;
  font-size: .95rem;
  line-height: 1.15;
  white-space: nowrap;
}

.admin-tabs button > small {
  grid-area: meta;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 680;
  line-height: 1.2;
  white-space: nowrap;
}

.admin-nav-footer {
  display: grid;
  gap: 8px;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--soft-line);
}

.admin-tabs .active {
  border-color: var(--brand);
  background: var(--tile-tint);
  color: var(--brand-dark);
}

.admin-tabs .active > span {
  background: color-mix(in srgb, var(--tile-tint) 75%, var(--panel));
}

.admin-task-board {
  display: grid;
  gap: 14px;
}

.admin-task-section {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 14px;
  background: #f7fbfa;
}

.admin-task-section h3 {
  color: var(--steel);
  font-size: .82rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.admin-task-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(132px, 1fr));
  gap: 10px;
}

.admin-task-card {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 72px;
  border-color: var(--line);
  padding: 10px;
  background: #fff;
  text-align: left;
  box-shadow: 0 8px 16px rgba(39, 54, 54, .05);
}

.admin-task-card span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: var(--tile-tint);
  color: var(--brand-dark);
  font-weight: 900;
}

.admin-task-card strong {
  min-width: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: .95rem;
  line-height: 1.15;
  text-overflow: ellipsis;
}

.admin-task-card:hover,
.admin-task-card:focus-visible {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.admin-domain-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-domain-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  grid-template-areas:
    "icon label"
    "icon meta";
  align-items: center;
  gap: 2px 12px;
  min-height: 118px;
  border-color: var(--line);
  padding: 14px;
  background: #fff;
  text-align: left;
  box-shadow: 0 8px 18px rgba(39, 54, 54, .06);
}

.admin-domain-card > span {
  grid-area: icon;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 8px;
  background: var(--tile-tint);
  color: var(--brand-dark);
  font-size: 1.35rem;
  font-weight: 900;
}

.admin-domain-card > strong {
  grid-area: label;
  min-width: 0;
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.2;
}

.admin-domain-card > small {
  grid-area: meta;
  min-width: 0;
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.28;
}

.admin-work-queue {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-work-queue section {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  padding: 14px;
  background: #f7fbfa;
}

.admin-work-queue strong,
.admin-work-queue span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.admin-work-queue span {
  color: var(--muted);
}

body.admin-open {
  background: #f4f6f8;
}

body.admin-open .app-frame {
  width: 100%;
  max-width: none;
  padding: 0;
}

body.admin-open .shell {
  min-height: 100dvh;
}

body.admin-open .admin-workspace {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  grid-template-rows: 76px minmax(0, 1fr);
  grid-template-areas:
    "header header"
    "nav panel";
  gap: 0;
  min-height: 100dvh;
  background: #f4f6f8;
}

body.admin-open .admin-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: grid;
  grid-template-columns: 220px minmax(210px, .8fr) minmax(260px, 1fr) auto auto auto;
  gap: 14px;
  align-items: center;
  border: 0;
  border-bottom: 1px solid #dde5e3;
  border-radius: 0;
  padding: 10px 16px;
  background: #ffffff;
  box-shadow: none;
}

.admin-brand-block {
  min-width: 0;
}

body.admin-open .admin-logo {
  display: block;
  width: 174px;
  height: 48px;
  object-fit: contain;
  object-position: left center;
}

.admin-title-block {
  min-width: 0;
}

body.admin-open .admin-header h2 {
  font-size: 1.15rem;
}

body.admin-open .admin-header p {
  overflow: hidden;
  font-size: .86rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-global-search {
  display: grid;
  position: relative;
  gap: 3px;
  min-width: 0;
}

.admin-global-search span {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 820;
  text-transform: uppercase;
}

.admin-global-search input {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d7e0dd;
  border-radius: 8px;
  padding: 0 12px;
  background: #f8faf9;
  font: inherit;
}

.admin-search-results {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  left: 0;
  z-index: 50;
  display: grid;
  gap: 4px;
  max-height: min(420px, calc(100dvh - 150px));
  min-width: min(420px, calc(100vw - 32px));
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(21, 33, 34, .16);
}

.admin-search-results[hidden] {
  display: none;
}

.admin-search-option {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 52px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 8px 10px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.admin-search-option:hover,
.admin-search-option:focus-visible,
.admin-search-option.active {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--line));
  background: var(--tile-tint);
  outline: none;
}

.admin-search-option > span:first-child {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: var(--brand-dark);
  background: color-mix(in srgb, var(--tile-tint) 72%, #fff);
}

.admin-search-option .lucide-icon {
  width: 18px;
  height: 18px;
  stroke-width: 2.15;
}

.admin-search-option-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-search-option-text strong,
.admin-search-option-text small {
  overflow-wrap: anywhere;
}

.admin-search-option-text strong {
  color: var(--ink);
  font-size: .94rem;
  line-height: 1.2;
}

.admin-search-option-text small {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 760;
}

.admin-search-empty {
  padding: 12px;
  color: var(--muted);
  font-size: .9rem;
}

body.admin-open .admin-context-card {
  border: 0;
  padding: 0;
  background: transparent;
}

body.admin-open .admin-tabs {
  position: sticky;
  top: 76px;
  align-self: start;
  height: calc(100dvh - 76px);
  overflow-y: auto;
  border: 0;
  border-right: 1px solid #dce4e1;
  border-radius: 0;
  padding: 14px 12px;
  background: #ffffff;
  box-shadow: none;
}

body.admin-open .admin-tabs button {
  min-height: 44px;
  border-radius: 8px;
  padding: 7px 9px;
  color: #607077;
}

body.admin-open .admin-tabs button > span {
  width: 30px;
  height: 30px;
  background: transparent;
}

body.admin-open .admin-tabs .active {
  border-color: var(--brand);
  background: var(--tile-tint);
  color: var(--brand-dark);
}

body.admin-open .admin-panel {
  min-height: calc(100dvh - 76px);
  border: 0;
  border-radius: 0;
  align-content: start;
  padding: 18px 24px 108px;
  background: #f4f6f8;
  box-shadow: none;
}

.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 2px;
}

.admin-kpi-card {
  display: grid;
  gap: 6px;
  min-height: 116px;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 16px;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.admin-kpi-card span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.admin-kpi-card strong {
  color: var(--ink);
  font-size: 1.55rem;
  line-height: 1;
  overflow-wrap: anywhere;
}

.admin-kpi-card em {
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 760;
  overflow-wrap: anywhere;
}

.admin-kpi-card.warning em {
  color: #9a6a20;
}

.admin-dashboard-grid,
.stock-work-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .65fr);
  gap: 14px;
}

.purchasing-work-grid,
.purchasing-secondary-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr);
  align-items: start;
  gap: 14px;
}

.inventory-alerts .device-list {
  max-height: 252px;
  overflow-y: auto;
  padding-right: 4px;
}

.supplier-list {
  max-height: 360px;
  overflow-y: auto;
}

.purchasing-form {
  align-items: start;
}

.purchasing-form-section {
  grid-column: 1 / -1;
  display: grid;
  gap: 3px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--soft-line);
}

.purchasing-form-section strong {
  font-size: .98rem;
}

.purchasing-form-section p {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

.purchasing-form .span-2 {
  grid-column: span 2;
}

.purchasing-form-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}

.purchasing-form-actions .check-row {
  margin-right: auto;
}

.supplier-editor-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.supplier-editor-form .full {
  grid-column: 1 / -1;
}

.supplier-editor-form .checkbox-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: center;
  align-self: end;
}

.supplier-editor-form .checkbox-row input {
  width: 22px;
  height: 22px;
  min-height: 22px;
  padding: 0;
}

.purchase-order-form {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.purchase-order-form .mini-action {
  min-height: 48px;
  white-space: normal;
}

.purchase-order-summary {
  display: grid;
  gap: 2px;
  align-self: end;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 10px;
  background: #f7fbfa;
}

.purchase-order-summary span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.purchase-order-summary strong {
  font-size: 1.02rem;
}

.purchase-order-summary.blocked {
  border-color: color-mix(in srgb, #b58c59 42%, var(--line));
  background: #fff3d8;
}

.admin-chart-panel,
.admin-alert-panel,
.admin-table-card {
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 16px;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.admin-trend-bars {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  align-items: end;
  gap: 12px;
  height: 260px;
  margin-top: 18px;
  border-radius: 8px;
  padding: 18px;
  background: var(--surface);
}

.admin-trend-bars span {
  display: block;
  min-height: 24px;
  border-radius: 8px 8px 0 0;
  background: var(--brand);
}

.admin-trend-bars.empty span {
  background: #cfd8d5;
}

.admin-payment-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
  color: var(--muted);
  font-weight: 720;
}

.admin-payment-row {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid #e2e8e5;
  border-radius: 8px;
  padding: 10px 12px;
  background: #f8faf9;
}

.admin-payment-row strong,
.admin-payment-row span,
.admin-payment-row b {
  min-width: 0;
  overflow-wrap: anywhere;
}

.admin-payment-row b {
  color: var(--ink);
  font-size: 1rem;
}

.reports-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
  min-width: 0;
}

.report-period-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.report-period-tabs button {
  min-height: 42px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  padding: 0 14px;
  font-weight: 850;
}

.report-period-tabs button.active {
  border-color: rgba(32, 143, 134, .42);
  background: #eef7f5;
  color: var(--brand-dark);
}

.management-report-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap: 14px;
}

.management-report-grid.secondary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.omnichannel-report-sidecar {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid #d6e3e0;
  border-radius: 8px;
  padding: 14px;
  background: #f8fcfb;
}

.omnichannel-report-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.omnichannel-report-heading > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.omnichannel-report-heading strong,
.omnichannel-report-grid strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.omnichannel-report-heading span {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.omnichannel-report-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.omnichannel-report-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.omnichannel-report-grid > section {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.report-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.report-row {
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--surface);
  color: var(--muted);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.report-row strong {
  display: block;
  color: var(--ink);
  margin-bottom: 4px;
}

.report-row span {
  display: block;
}

.admin-alert-panel {
  display: grid;
  align-content: start;
  gap: 12px;
}

.admin-topic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.integration-result-bar {
  margin-top: 14px;
}

.integration-command-center {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  max-width: 1180px;
  margin-bottom: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px 16px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.integration-command-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.integration-command-copy strong {
  color: var(--ink);
  font-size: 1rem;
}

.integration-command-copy span {
  color: var(--muted);
  line-height: 1.35;
}

.integration-status-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  padding: 5px 10px;
  color: var(--brand-dark);
  font-size: .82rem;
  font-weight: 820;
  background: var(--tile-tint);
}

.status-pill.warning {
  color: #70501c;
  background: #fff5df;
}

.status-pill.good {
  color: #0f5132;
  background: #dff6ea;
}

.status-pill.error {
  color: #8d2525;
  background: #ffe8e8;
}

.status-pill.neutral {
  color: var(--muted);
  background: #eef3f2;
}

.integration-heading-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
}

.admin-topic-card {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 10px;
  min-width: 0;
  min-height: 142px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 16px;
  text-align: left;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
  cursor: pointer;
}

.admin-topic-card.static-card {
  cursor: default;
}

.admin-topic-card:hover,
.admin-topic-card.active {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.admin-topic-card.static-card:hover {
  border-color: #dde5e3;
  background: #ffffff;
}

.help-article-card {
  appearance: none;
  width: 100%;
  font: inherit;
}

.admin-topic-card span {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: var(--brand-dark);
  font-size: .88rem;
  font-weight: 860;
  background: var(--tile-tint);
}

.admin-topic-card > span .lucide-icon {
  width: 19px;
  height: 19px;
  stroke-width: 2.15;
}

.admin-topic-card strong {
  color: var(--ink);
  font-size: 1.12rem;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.admin-topic-card em {
  color: var(--muted);
  font-size: .94rem;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.admin-topic-card small {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 28px;
  border-radius: 999px;
  padding: 4px 9px;
  color: var(--brand-dark);
  font-size: .78rem;
  font-weight: 820;
  background: var(--tile-tint);
  overflow-wrap: anywhere;
}

.admin-topic-card small.warning {
  color: #70501c;
  background: #fff5df;
}

.admin-topic-card small.error {
  color: #8d2525;
  background: #ffe8e8;
}

.accounting-dashboard {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.accounting-status-card,
.accounting-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.accounting-status-card {
  display: grid;
  gap: 8px;
  align-items: start;
  max-width: 1180px;
}

.accounting-status-card strong {
  color: var(--ink);
  font-size: 1.02rem;
}

.accounting-status-card span {
  color: var(--muted);
  line-height: 1.35;
}

.accounting-status-card.inactive {
  background: color-mix(in srgb, var(--tile-tint) 64%, #fff);
}

.accounting-status-card.active {
  border-color: color-mix(in srgb, var(--brand) 36%, var(--line));
}

[data-testid="accounting-result"]:empty {
  display: none;
}

.accounting-liquidity-strip {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  max-width: 1180px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 34%, var(--line));
  border-radius: 8px;
  padding: 12px 14px;
  background: color-mix(in srgb, var(--tile-tint) 70%, #fff);
  color: var(--ink);
}

.accounting-liquidity-strip > span {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  color: var(--brand-dark);
  background: #fff;
}

.accounting-liquidity-strip div {
  min-width: 0;
}

.accounting-liquidity-strip strong,
.accounting-liquidity-strip b {
  color: var(--ink);
  font-weight: 900;
}

.accounting-liquidity-strip p {
  margin: 3px 0 0;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-liquidity-strip b {
  justify-self: end;
  white-space: nowrap;
  font-size: 1.06rem;
}

.accounting-liquidity-strip b.negative {
  color: #b42318;
}

.accounting-liquidity-strip b.positive {
  color: #087443;
}

.accounting-liquidity-strip b.neutral {
  color: var(--ink);
}

.accounting-tile-hub {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}

.accounting-tile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px 12px;
  align-content: start;
  min-width: 0;
  min-height: 218px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
  text-align: left;
  cursor: pointer;
}

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

.accounting-subtile {
  min-height: 170px;
  background: color-mix(in srgb, var(--tile-tint) 42%, #fff);
}

.accounting-tile:hover,
.accounting-tile:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 52%, var(--line));
  box-shadow: 0 14px 28px rgba(21, 128, 120, .12);
  outline: none;
}

.accounting-tile-icon,
.accounting-preview-icon {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  color: var(--brand-dark);
  background: var(--tile-tint);
}

.accounting-tile-icon {
  grid-row: 1 / span 2;
}

.accounting-tile strong {
  min-width: 0;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.accounting-tile em,
.accounting-tile small {
  grid-column: 1 / -1;
  min-width: 0;
  color: var(--muted);
  font-size: .86rem;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-tile small b {
  color: var(--ink);
}

.accounting-tile-primary {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--brand) 52%, var(--line));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--tile-tint) 78%, #fff), #fff 68%);
  box-shadow: 0 16px 34px rgba(21, 128, 120, .14);
}

.accounting-tile-primary::after {
  content: "▶";
  position: absolute;
  right: 18px;
  bottom: 8px;
  z-index: 0;
  color: color-mix(in srgb, var(--brand) 14%, transparent);
  font-size: clamp(4.5rem, 8vw, 7.5rem);
  line-height: 1;
  pointer-events: none;
}

.accounting-tile-primary > * {
  position: relative;
  z-index: 1;
}

.accounting-tile-primary strong {
  font-size: 1.08rem;
}

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

.accounting-topic-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 186px;
  gap: 14px;
  align-items: start;
  min-width: 0;
}

.accounting-topic-layout[hidden] {
  display: none;
}

.accounting-topic-main {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.accounting-topic-nav {
  position: sticky;
  top: 76px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding-bottom: 88px;
}

.accounting-topic-back-action {
  width: 100%;
  min-height: 42px;
}

.accounting-topic-nav-list {
  display: grid;
  gap: 6px;
  min-width: 0;
  max-height: calc(100vh - 176px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.accounting-topic-nav-list button {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 7px;
  padding: 8px 9px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: .84rem;
  font-weight: 850;
  line-height: 1.18;
  text-align: left;
  cursor: pointer;
  overflow-wrap: anywhere;
}

.accounting-topic-nav-list button:hover,
.accounting-topic-nav-list button:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 42%, var(--line));
  background: color-mix(in srgb, var(--tile-tint) 64%, #fff);
  color: var(--ink);
  outline: none;
}

.accounting-topic-nav-list button.active {
  border-color: color-mix(in srgb, var(--brand) 60%, var(--line));
  background: color-mix(in srgb, var(--brand) 12%, #fff);
  color: var(--brand-dark);
}

.accounting-workspace {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}

.accounting-summary-panel,
.accounting-report-preview-panel,
.accounting-liquidity-panel,
.accounting-opening-panel,
.accounting-creditors-panel {
  grid-column: 1 / -1;
}

.accounting-summary-panel {
  background: color-mix(in srgb, var(--tile-tint) 45%, #fff);
}

.accounting-row.depreciation {
  grid-template-columns: auto minmax(0, 1fr) minmax(180px, auto);
  align-items: center;
}

.accounting-row-kpi {
  display: grid;
  gap: 2px;
  justify-items: end;
  min-width: 0;
}

.accounting-row-kpi strong {
  color: var(--ink);
  font-weight: 900;
}

.accounting-row-kpi small {
  color: var(--muted);
  text-align: right;
  overflow-wrap: anywhere;
}

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

.accounting-metrics span,
.accounting-metrics button {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
  min-height: 58px;
  align-content: center;
}

.accounting-metrics button {
  cursor: pointer;
  color: inherit;
  font: inherit;
  text-align: left;
}

.accounting-metrics strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.accounting-metrics small {
  color: var(--muted);
  font-size: .8rem;
  line-height: 1.25;
}

.accounting-metrics em {
  margin-top: 4px;
  color: var(--brand-dark);
  font-size: .76rem;
  font-style: normal;
  font-weight: 900;
}

.accounting-metrics button:hover,
.accounting-metrics button:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 68%, var(--line));
  box-shadow: 0 10px 20px rgba(21, 128, 120, .1);
  outline: none;
}

.accounting-metrics span.attention,
.accounting-metrics button.attention {
  border-color: #e5b2ad;
  background: #fff7f6;
}

.accounting-metrics span.attention strong,
.accounting-metrics button.attention strong {
  color: #a13a32;
}

.accounting-metrics span.ok,
.accounting-metrics button.ok {
  border-color: color-mix(in srgb, var(--brand) 46%, var(--line));
  background: color-mix(in srgb, var(--tile-tint) 48%, #fff);
}

.accounting-metrics span.ok strong,
.accounting-metrics button.ok strong {
  color: var(--brand-dark);
}

.accounting-opening-panel {
  background: #fff;
}

.accounting-opening-form,
.accounting-equity-form {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 34%, #fff);
}

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

.accounting-equity-form {
  background: #fff;
}

.accounting-equity-form h4,
.accounting-equity-form p {
  margin: 0;
  min-width: 0;
}

.accounting-equity-form p {
  color: var(--muted);
}

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

.accounting-opening-control {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.accounting-opening-control span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.accounting-opening-control small {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.accounting-opening-control strong {
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 950;
  overflow-wrap: anywhere;
}

.accounting-opening-control em {
  grid-column: 1 / -1;
  color: var(--muted);
  font-style: normal;
  font-weight: 750;
}

.accounting-opening-control.ok {
  border-color: color-mix(in srgb, var(--brand) 58%, var(--line));
  background: color-mix(in srgb, var(--brand) 7%, #fff);
}

.accounting-opening-control.ok em,
.accounting-opening-control.ok strong {
  color: var(--brand-dark);
}

.accounting-opening-control.warning {
  border-color: #e6b8b8;
  background: #fff6f6;
}

.accounting-opening-control.warning em,
.accounting-opening-control.warning strong:last-child {
  color: #a13a32;
}

.accounting-work-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
  min-width: 0;
  margin-bottom: 12px;
}

.accounting-work-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
  border: 1px solid #d8e5e2;
  border-radius: 8px;
  padding: 12px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  min-height: 122px;
  align-content: start;
}

.accounting-work-card strong {
  display: block;
  color: var(--ink);
  font-size: .94rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.accounting-work-card p,
.accounting-work-card small {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-work-card small[data-tone="attention"] {
  color: #a13a32;
  font-weight: 850;
}

.accounting-work-card small[data-tone="ok"] {
  color: var(--brand-dark);
  font-weight: 850;
}

.accounting-work-card em {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 26px;
  margin-top: 10px;
  padding: 4px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 10%, #fff);
  color: var(--brand-dark);
  font-size: .78rem;
  font-style: normal;
  font-weight: 900;
  line-height: 1.2;
}

.accounting-work-icon {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: var(--brand-dark);
  background: var(--tile-tint);
}

.accounting-work-card-button {
  cursor: pointer;
  border-color: color-mix(in srgb, var(--brand) 44%, var(--line));
  background: linear-gradient(135deg, color-mix(in srgb, var(--tile-tint) 76%, #fff), #fff);
}

.accounting-work-card-button:hover,
.accounting-work-card-button:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 72%, var(--line));
  box-shadow: 0 12px 24px rgba(21, 128, 120, .12);
  outline: none;
}

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

.accounting-form fieldset {
  margin: 0;
  border: 1px solid #d8e3e0;
  border-radius: 8px;
  padding: 12px;
  background: color-mix(in srgb, var(--tile-tint) 28%, #fff);
  min-width: 0;
}

.accounting-form legend {
  padding: 0 6px;
  color: var(--ink);
  font-weight: 900;
}

.accounting-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.accounting-form input,
.accounting-form select {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  color: var(--ink);
  background: #fff;
  font: inherit;
  text-transform: none;
}

.accounting-form > button {
  grid-column: 1 / -1;
}

.accounting-form-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}

.accounting-form-actions .mini-action {
  min-height: 42px;
}

.accounting-reconcile-form {
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.accounting-inline-help {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
  margin: 0;
}

.accounting-match-suggestions {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.accounting-bank-settlement {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.accounting-bank-status-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.accounting-bank-status-metrics span,
.accounting-bank-status-list span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 10px;
}

.accounting-bank-status-metrics strong,
.accounting-bank-status-list strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.accounting-bank-status-metrics small,
.accounting-bank-status-list small {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-bank-status-list {
  display: grid;
  gap: 8px;
}

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

.accounting-match-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 10px;
}

.accounting-match-row span {
  min-width: 0;
}

.accounting-match-row small,
.accounting-match-row em {
  display: block;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-match-score {
  min-width: 52px;
  border-radius: 999px;
  background: var(--tile-tint);
  color: var(--brand-dark);
  font-weight: 850;
  padding: 6px 8px;
  text-align: center;
}

.accounting-form .accounting-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 9px 10px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 800;
  text-transform: none;
}

.accounting-form .accounting-check input {
  width: 18px;
  min-height: 18px;
  margin: 0;
  accent-color: var(--accent);
}

.accounting-ledger-panel {
  grid-column: 1 / -1;
}

#accounting-section-tasks {
  grid-column: 1 / -1;
}

.accounting-ledger-panel[hidden] {
  display: none;
}

.accounting-creditors-layout,
.accounting-debtors-layout,
.accounting-ledger-layout {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.4fr);
  gap: 14px;
  min-width: 0;
}

.accounting-creditors-layout:has(.accounting-creditor-form[hidden]),
.accounting-debtors-layout:has(.accounting-debtor-form[hidden]),
.accounting-ledger-layout:has(.accounting-ledger-form[hidden]) {
  grid-template-columns: minmax(0, 1fr);
}

.accounting-row.creditor,
.accounting-row.debtor,
.accounting-row.ledger {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}

.accounting-row.creditor.inactive,
.accounting-row.debtor.inactive,
.accounting-row.ledger.inactive {
  opacity: .62;
}

.accounting-creditor-form,
.accounting-debtor-form,
.accounting-ledger-form {
  align-content: start;
}

.accounting-creditor-form[hidden],
.accounting-debtor-form[hidden],
.accounting-ledger-form[hidden] {
  display: none;
}

.accounting-period-status {
  margin-top: 12px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--tile-tint) 36%, #fff);
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

.accounting-vat-summary {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  min-width: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

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

.accounting-vat-metrics span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 9px;
  background: color-mix(in srgb, var(--tile-tint) 36%, #fff);
}

.accounting-vat-metrics strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.accounting-vat-metrics small {
  color: var(--muted);
  font-size: .78rem;
}

.accounting-vat-summary ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
}

.accounting-report-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 12px;
  min-width: 0;
}

.accounting-preview-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-content: start;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 12px;
  background: color-mix(in srgb, var(--tile-tint) 30%, #fff);
}

.accounting-preview-card > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.accounting-preview-card strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.accounting-preview-card em {
  color: var(--brand-dark);
  font-size: .82rem;
  font-style: normal;
  font-weight: 900;
}

.accounting-preview-card p,
.accounting-preview-card small,
.accounting-disabled-note {
  margin: 0;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-preview-card .accounting-actions {
  grid-column: 1 / -1;
}

.accounting-preview-card .accounting-actions .primary {
  border-color: color-mix(in srgb, var(--brand) 58%, var(--line));
  background: var(--brand);
  color: #fff;
}

.accounting-report-preview-detail {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--line));
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.accounting-report-preview-detail[hidden] {
  display: none;
}

.accounting-report-modal {
  position: fixed;
  inset: 0;
  z-index: 190;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(19, 31, 32, .34);
}

.accounting-report-modal[hidden] {
  display: none;
}

.accounting-report-dialog {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 14px;
  width: min(1080px, 100%);
  max-height: min(840px, calc(100vh - 36px));
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--brand) 26%, var(--line));
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 22px 58px rgba(24, 35, 35, .24);
}

.accounting-report-modal-head {
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}

.accounting-report-modal-kicker {
  color: var(--brand-dark);
  font-size: .74rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.accounting-report-modal-body {
  min-width: 0;
  overflow: auto;
}

.accounting-balance-sheet {
  display: grid;
  gap: 16px;
  min-width: 0;
  border: 4px solid #2430c5;
  border-radius: 26px;
  padding: clamp(18px, 3vw, 34px);
  color: #0f174a;
  background: #fff;
}

.accounting-balance-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  text-align: center;
}

.accounting-balance-title h5 {
  margin: 0;
  color: #0f174a;
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  line-height: 1.1;
}

.accounting-balance-title p {
  margin: 0;
  color: #0f174a;
  font-size: clamp(1rem, 2vw, 1.35rem);
  font-style: italic;
}

.accounting-balance-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  border-top: 5px solid #2430c5;
}

.accounting-balance-columns section {
  display: grid;
  align-content: start;
  gap: 18px;
  min-width: 0;
  padding: 18px clamp(12px, 2.5vw, 34px) 0;
}

.accounting-balance-columns section + section {
  border-left: 5px solid #2430c5;
}

.accounting-balance-columns h6 {
  margin: 0;
  color: #0f174a;
  font-size: clamp(1.05rem, 1.8vw, 1.45rem);
}

.accounting-balance-group {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.accounting-balance-group > strong {
  color: #050505;
  font-size: clamp(1rem, 1.6vw, 1.28rem);
}

.accounting-balance-group div,
.accounting-balance-total {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 12px;
  align-items: baseline;
  min-width: 0;
}

.accounting-balance-group span {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #050505;
}

.accounting-balance-group b,
.accounting-balance-total span {
  color: #050505;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.accounting-balance-total {
  margin-top: 8px;
  color: #2430c5;
  font-size: clamp(1.05rem, 1.8vw, 1.35rem);
  font-weight: 950;
}

.accounting-balance-total strong,
.accounting-balance-total span {
  color: #2430c5;
}

.accounting-preview-document-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.accounting-preview-document-head h5 {
  margin: 0;
  color: var(--ink);
  font-size: 1rem;
}

.accounting-preview-document-head p,
.accounting-report-preview-detail > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.accounting-preview-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: .9rem;
}

.accounting-preview-table th,
.accounting-preview-table td {
  border-bottom: 1px solid #dde5e3;
  padding: 9px 8px;
  text-align: left;
  overflow-wrap: anywhere;
}

.accounting-preview-table th:last-child,
.accounting-preview-table td:last-child {
  text-align: right;
  font-weight: 850;
}

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

.accounting-report-section h6 {
  margin: 0;
  color: var(--ink);
  font-size: .92rem;
}

.accounting-report-status {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 58%, #fff);
  color: var(--muted);
  line-height: 1.35;
}

.accounting-report-status.ok {
  color: #0f5f50;
  border-color: color-mix(in srgb, #0f8f76 35%, var(--line));
}

.accounting-report-status.warning,
.accounting-preview-totals tr.warning td {
  color: #9f1d1d;
  border-color: color-mix(in srgb, #cf3f3f 42%, var(--line));
  background: color-mix(in srgb, #ffe8e8 65%, #fff);
}

.accounting-preview-totals {
  background: color-mix(in srgb, var(--tile-tint) 38%, #fff);
}

.accounting-delivery-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--line));
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
}

.accounting-delivery-panel strong,
.accounting-delivery-panel span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.accounting-delivery-panel label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 850;
  text-transform: uppercase;
}

.accounting-delivery-panel input,
.accounting-delivery-panel textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--ink);
  font: inherit;
  text-transform: none;
}

.accounting-liquid-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.accounting-liquid-kpis span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.accounting-liquid-kpis strong {
  color: var(--ink);
  font-size: 1.04rem;
  overflow-wrap: anywhere;
}

.accounting-liquid-kpis small,
.accounting-liquidity-summary p {
  color: var(--muted);
  line-height: 1.35;
}

.accounting-liquidity-summary {
  display: grid;
  gap: 10px;
}

.accounting-upload-drop {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px 12px;
  align-items: start;
  min-height: 112px;
  border: 1px dashed color-mix(in srgb, var(--brand) 52%, var(--line));
  border-radius: 8px;
  padding: 16px;
  background: color-mix(in srgb, var(--tile-tint) 42%, #fff);
  cursor: pointer;
}

.accounting-upload-drop > [data-lucide],
.accounting-upload-drop > svg {
  width: 20px;
  height: 20px;
  margin-top: 2px;
}

.accounting-upload-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.accounting-upload-drop strong,
.accounting-upload-result strong {
  color: var(--ink);
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.accounting-upload-drop strong,
.accounting-upload-drop small {
  display: block;
}

.accounting-upload-drop small,
.accounting-upload-result {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-upload-drop input {
  grid-column: 1 / -1;
  min-width: 0;
}

.accounting-scan-status {
  color: var(--muted);
}

.accounting-scan-summary {
  display: grid;
  gap: 5px;
  min-width: 0;
  border: 1px solid #d7e4de;
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  color: var(--ink);
}

.accounting-scan-summary.warning {
  border-color: #ead9a3;
  background: #fffaf0;
}

.accounting-scan-summary.ok {
  border-color: #b8dbc9;
  background: #f5fbf7;
}

.accounting-scan-summary span,
.accounting-scan-summary small,
.accounting-scan-summary li {
  overflow-wrap: anywhere;
}

.accounting-scan-summary ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
  color: #7a4f00;
}

.accounting-upload-result {
  display: grid;
  gap: 4px;
  margin-top: 10px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
}

.accounting-wizard-panel {
  grid-column: 1 / -1;
  padding: 0;
  overflow: hidden;
}

.accounting-wizard-shell {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: 18px;
}

.accounting-wizard-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  min-width: 0;
}

.accounting-wizard-head > div:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.accounting-wizard-head h4,
.accounting-wizard-step h5 {
  margin: 0;
  color: var(--ink);
}

.accounting-wizard-head p,
.accounting-wizard-copy {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.accounting-wizard-actions,
.accounting-wizard-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.accounting-wizard-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.accounting-wizard-steps li {
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 9px 10px;
  color: var(--muted);
  background: #fff;
  font-size: .86rem;
  font-weight: 900;
  text-align: center;
}

.accounting-wizard-steps li.active {
  color: var(--brand-dark);
  border-color: color-mix(in srgb, var(--brand) 48%, var(--line));
  background: color-mix(in srgb, var(--tile-tint) 58%, #fff);
}

.accounting-wizard-steps li.done {
  color: #146447;
  background: #edf8f2;
}

.accounting-wizard-step {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.accounting-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.accounting-choice-grid button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 10px;
  align-items: start;
  min-height: 108px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.accounting-choice-grid button:hover,
.accounting-choice-grid button:focus-visible,
.accounting-choice-grid button.active {
  border-color: color-mix(in srgb, var(--brand) 52%, var(--line));
  background: color-mix(in srgb, var(--tile-tint) 48%, #fff);
  outline: none;
}

.accounting-choice-grid span {
  color: var(--brand-dark);
}

.accounting-choice-grid strong,
.accounting-choice-grid small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.accounting-choice-grid small {
  grid-column: 1 / -1;
  color: var(--muted);
  line-height: 1.35;
}

.accounting-route-actions,
.accounting-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.accounting-route-actions .mini-action,
.accounting-preview-actions .mini-action {
  min-height: 42px;
}

.accounting-help-note {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 20%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 45%, #fff);
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.4;
}

.accounting-sales-invoice-workbench {
  max-width: 980px;
}

.accounting-sales-invoice-grid,
.accounting-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.accounting-supplier-section .accounting-form-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.accounting-section-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 10px;
}

.accounting-section-head legend {
  display: block;
  margin-bottom: 2px;
}

.accounting-section-head p {
  margin: 0;
  color: var(--muted);
  font-size: .88rem;
}

.accounting-invoice-lines {
  display: grid;
  gap: 8px;
}

.accounting-invoice-line {
  display: grid;
  grid-template-columns: 34px minmax(220px, 2fr) minmax(86px, .7fr) minmax(128px, 1fr) minmax(120px, .9fr) auto;
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 24%, #fff);
}

.accounting-invoice-line-index {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 12%, #fff);
  color: var(--brand);
  font-weight: 900;
}

.accounting-invoice-line-calculation {
  grid-column: 2 / 6;
  margin: -2px 0 0;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 750;
}

.accounting-sales-invoice-footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 38%, #fff);
}

.accounting-invoice-total {
  font-weight: 900;
  color: var(--ink);
}

.accounting-form-alert {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid #d36f5f;
  border-radius: 8px;
  background: #fff4f1;
  color: #9b2f24;
  font-weight: 850;
}

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

.accounting-form-alert:before {
  content: "Controleer dit eerst";
  display: block;
  margin-bottom: 3px;
  color: #7f261e;
  font-size: .74rem;
  font-weight: 950;
  text-transform: uppercase;
}

.accounting-validation-dialog {
  display: grid;
  gap: 12px;
}

.accounting-validation-dialog p {
  margin: 0;
  color: var(--muted);
  font-weight: 750;
}

.accounting-validation-dialog ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.accounting-validation-dialog li {
  padding: 10px 12px;
  border: 1px solid #d36f5f;
  border-radius: 8px;
  background: #fff4f1;
  color: #8f2b22;
  font-weight: 900;
}

.accounting-invoice-preview-lines {
  display: grid;
  gap: 6px;
}

.accounting-invoice-preview-lines div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.accounting-invoice-preview-lines span,
.accounting-invoice-preview-lines small {
  min-width: 0;
}

.accounting-issued-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--brand) 42%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 7%, #fff);
}

.accounting-issued-card > strong {
  font-size: 1.2rem;
}

.accounting-issued-card dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.accounting-issued-card dt {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.accounting-issued-card dd {
  margin: 0;
  font-weight: 900;
}

.accounting-email-send-panel {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.accounting-email-send-panel h5 {
  margin: 0;
}

.accounting-email-send-panel label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: .76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.accounting-email-send-panel input,
.accounting-email-send-panel textarea {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 11px;
  color: var(--ink);
  font: inherit;
  font-size: .9rem;
  font-weight: 650;
  text-transform: none;
}

.accounting-email-send-panel textarea {
  min-height: 82px;
  resize: vertical;
}

.accounting-email-status {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: var(--tile-tint);
  color: var(--muted);
  font-weight: 800;
}

.accounting-email-status.error {
  border-color: #d36f5f;
  background: #fff4f1;
  color: #9b2f24;
}

.accounting-email-status.success {
  border-color: color-mix(in srgb, var(--brand) 42%, var(--line));
  background: color-mix(in srgb, var(--brand) 8%, #fff);
  color: var(--brand);
}

.accounting-invoice-line.invalid {
  border-color: #d36f5f;
  background: #fff7f5;
}

.accounting-issued-invoices {
  margin-top: 12px;
}

.accounting-issued-invoice-list {
  display: grid;
  gap: 8px;
}

.accounting-issued-invoice-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid #d7e2df;
  border-radius: 8px;
  background: #fff;
}

.accounting-issued-invoice-card strong,
.accounting-issued-invoice-card small,
.accounting-issued-invoice-card em {
  display: block;
  min-width: 0;
}

.accounting-issued-invoice-card small,
.accounting-issued-invoice-card em {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.accounting-issued-invoice-card em {
  margin-top: 2px;
  font-size: .86rem;
  font-style: normal;
}

.accounting-issued-invoice-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.accounting-compliance-card {
  display: grid;
  gap: 12px;
  border: 1px solid #d8e3e0;
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  color: var(--ink);
}

.accounting-compliance-card.ready {
  border-color: color-mix(in srgb, var(--brand) 65%, var(--line));
  background: color-mix(in srgb, var(--tile-tint) 34%, #fff);
}

.accounting-compliance-card.blocked {
  border-color: #dba7a0;
  background: #fff8f7;
}

.accounting-compliance-card header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.accounting-compliance-card header strong {
  font-size: 1rem;
}

.accounting-compliance-card header span {
  color: var(--muted);
  font-weight: 800;
  text-align: right;
}

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

.accounting-compliance-parties span {
  display: grid;
  gap: 4px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 10px;
  min-width: 0;
  background: rgba(255, 255, 255, .72);
}

.accounting-compliance-parties small {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-compliance-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.accounting-compliance-list li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 8px 10px;
  min-width: 0;
  font-weight: 800;
}

.accounting-compliance-list li span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  font-weight: 950;
}

.accounting-compliance-list li.ok span {
  background: color-mix(in srgb, var(--brand) 18%, #fff);
  color: var(--brand);
}

.accounting-compliance-list li.missing {
  border-color: #e1b5ad;
  background: #fff;
}

.accounting-compliance-list li.missing span {
  background: #f8d8d2;
  color: #9f2f24;
}

.accounting-warning {
  display: grid;
  gap: 6px;
  margin: 0;
  border: 1px solid #e1b5ad;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
  color: #8f2f25;
}

.accounting-warning ul {
  margin: 0;
  padding-left: 18px;
}

.accounting-success {
  margin: 0;
  color: var(--brand-dark, var(--brand));
  font-weight: 800;
}

.accounting-wizard-upload {
  margin: 0;
}

.accounting-wizard-no-document {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 44px;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 10px 12px;
  color: var(--ink);
  background: #fff;
  font-weight: 800;
}

.accounting-wizard-no-document input {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
}

.accounting-wizard-form {
  align-items: stretch;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.accounting-wizard-form [hidden] {
  display: none;
}

.accounting-wizard-form [data-wizard-field],
.accounting-recurring-form [data-recurring-field] {
  align-self: stretch;
}

.accounting-wizard-form [data-wizard-field="counterparty"],
.accounting-wizard-form [data-wizard-field="creditor"],
.accounting-wizard-form [data-wizard-field="debtor"],
.accounting-wizard-form [data-wizard-field="description"],
.accounting-wizard-form [data-wizard-field="ledger"],
.accounting-recurring-form .accounting-form-section,
.accounting-recurring-form [data-recurring-field="creditor"],
.accounting-recurring-form [data-recurring-field="description"],
.accounting-recurring-form [data-recurring-field="ledger"] {
  grid-column: 1 / -1;
}

.accounting-form-section {
  display: grid;
  gap: 4px;
  grid-column: 1 / -1;
  min-width: 0;
}

.accounting-recurring-flow {
  display: grid;
  gap: 6px;
  grid-column: 1 / -1;
  min-width: 0;
  border: 1px solid #d7e4de;
  border-radius: 8px;
  padding: 12px;
  background: #f7fbf8;
}

.accounting-recurring-flow strong {
  color: var(--ink);
}

.accounting-recurring-flow span {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-form-section h5 {
  margin: 0;
  color: var(--ink);
}

.accounting-form-section p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.accounting-wizard-form[data-booking-kind="purchase"] [data-wizard-field="creditor"],
.accounting-wizard-form[data-booking-kind="cost"] [data-wizard-field="creditor"],
.accounting-wizard-form[data-booking-kind="asset"] [data-wizard-field="creditor"],
.accounting-wizard-form[data-booking-kind="sale"] [data-wizard-field="debtor"] {
  order: 1;
}

.accounting-wizard-form [data-wizard-field="date"] {
  order: 2;
}

.accounting-wizard-form [data-wizard-field="description"] {
  order: 3;
}

.accounting-wizard-form[data-booking-kind="cost"] [data-wizard-field="totalAmount"],
.accounting-wizard-form[data-booking-kind="bank"] [data-wizard-field="totalAmount"] {
  order: 4;
}

.accounting-wizard-form[data-booking-kind="purchase"] [data-wizard-field="netAmount"],
.accounting-wizard-form[data-booking-kind="sale"] [data-wizard-field="netAmount"],
.accounting-wizard-form[data-booking-kind="asset"] [data-wizard-field="netAmount"] {
  order: 4;
}

.accounting-wizard-form [data-wizard-field="vatRate"] {
  order: 5;
}

.accounting-wizard-form [data-wizard-field="ledger"],
.accounting-wizard-form [data-wizard-field="assetKind"] {
  order: 6;
}

.accounting-wizard-form [data-wizard-field="usefulLifeMonths"] {
  order: 7;
}

.accounting-wizard-calculation {
  order: 8;
  grid-column: 1 / -1;
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--line));
  border-radius: 8px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--tile-tint) 42%, #fff);
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

.accounting-wizard-calculation strong {
  color: var(--ink);
}

.accounting-wizard-form .accounting-wizard-footer,
.accounting-recurring-form .accounting-wizard-footer {
  order: 20;
  grid-column: 1 / -1;
  padding-top: 4px;
}

.accounting-recurring-form {
  margin-top: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 26%, var(--line));
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--tile-tint) 34%, #fff);
}

.accounting-recurring-form .accounting-wizard-calculation {
  order: 18;
}

.accounting-relation-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 8px;
  align-items: stretch;
  min-width: 0;
}

.accounting-relation-field select {
  min-width: 0;
}

.accounting-relation-field .mini-action,
.accounting-relation-field .relation-action {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 150px;
  min-height: 42px;
  white-space: nowrap;
}

.accounting-ocr-relation-suggestion {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  border: 1px solid #b8dbc9;
  border-radius: 8px;
  padding: 10px;
  background: #f5fbf7;
  color: var(--ink);
}

.accounting-ocr-relation-suggestion[hidden] {
  display: none;
}

.accounting-ocr-relation-suggestion strong,
.accounting-ocr-relation-suggestion small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.accounting-ocr-relation-suggestion .mini-action {
  justify-self: start;
}

.accounting-money-input {
  font-variant-numeric: tabular-nums;
}

.accounting-relation-modal,
.accounting-sales-invoice-modal,
.accounting-editor-modal {
  position: fixed;
  inset: 0;
  z-index: 160;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(19, 31, 32, .28);
}

.accounting-relation-modal {
  z-index: 170;
}

.accounting-relation-modal[hidden],
.accounting-sales-invoice-modal[hidden],
.accounting-editor-modal[hidden] {
  display: none;
}

.accounting-relation-dialog,
.accounting-sales-invoice-dialog,
.accounting-editor-dialog {
  display: grid;
  gap: 14px;
  width: min(760px, 100%);
  max-height: min(780px, calc(100vh - 36px));
  overflow: auto;
  border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--line));
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(24, 35, 35, .22);
}

.accounting-sales-invoice-dialog {
  width: min(920px, 100%);
}

.accounting-sales-invoice-modal-body,
.accounting-sales-invoice-modal-actions {
  display: grid;
  gap: 10px;
}

.accounting-sales-invoice-modal-actions {
  grid-auto-flow: column;
  justify-content: end;
}

@media (max-width: 760px) {
  .accounting-sales-invoice-grid,
  .accounting-form-grid,
  .accounting-supplier-section .accounting-form-grid,
  .accounting-issued-card dl {
    grid-template-columns: 1fr;
  }

  .accounting-invoice-line {
    grid-template-columns: 30px 1fr;
  }

  .accounting-invoice-line label,
  .accounting-invoice-line button,
  .accounting-invoice-line-calculation {
    grid-column: 1 / -1;
  }

  .accounting-issued-invoice-card {
    grid-template-columns: 1fr;
  }

  .accounting-issued-invoice-actions {
    justify-content: stretch;
  }

  .accounting-issued-invoice-actions .mini-action {
    width: 100%;
  }

  .accounting-sales-invoice-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .accounting-sales-invoice-modal-actions {
    grid-auto-flow: row;
  }
}

.accounting-editor-dialog {
  width: min(900px, 100%);
}

.accounting-editor-head {
  align-items: start;
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}

.accounting-editor-body {
  min-width: 0;
}

.accounting-editor-body .accounting-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.accounting-editor-body .accounting-wizard-calculation,
.accounting-editor-body .accounting-wizard-footer,
.accounting-editor-body .accounting-form-section,
.accounting-editor-body .accounting-check,
.accounting-editor-body .accounting-relation-field,
.accounting-editor-body .accounting-form > button {
  grid-column: 1 / -1;
}

.accounting-relation-form [hidden] {
  display: none;
}

.accounting-wizard-review {
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--tile-tint) 34%, #fff);
}

.accounting-wizard-review dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.accounting-wizard-review div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.accounting-wizard-review dt {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.accounting-wizard-review dd {
  margin: 0;
  color: var(--ink);
  font-weight: 850;
  overflow-wrap: anywhere;
}

.accounting-wizard-review p {
  margin: 12px 0 0;
  color: var(--muted);
  line-height: 1.4;
}

.accounting-panel-highlight {
  animation: accountingPanelPulse .9s ease;
}

@keyframes accountingPanelPulse {
  0% { box-shadow: 0 0 0 0 rgba(21, 128, 120, .24); }
  50% { box-shadow: 0 0 0 5px rgba(21, 128, 120, .16); }
  100% { box-shadow: 0 10px 22px rgba(39, 54, 54, .05); }
}

@media (min-width: 781px) and (max-width: 1180px) {
  .accounting-topic-layout {
    grid-template-columns: minmax(0, 1fr) 176px;
  }

  .accounting-tile-hub {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .accounting-work-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .accounting-workspace {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .accounting-report-preview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .accounting-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.accounting-list {
  display: grid;
  gap: 10px;
}

.accounting-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 12px;
  background: color-mix(in srgb, var(--tile-tint) 38%, #fff);
}

.accounting-row.accounting-task-action {
  width: 100%;
  cursor: pointer;
  color: inherit;
  font: inherit;
  text-align: left;
}

.accounting-row.accounting-task-action:hover,
.accounting-row.accounting-task-action:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 68%, var(--line));
  background: linear-gradient(135deg, color-mix(in srgb, var(--tile-tint) 70%, #fff), #fff);
  box-shadow: 0 10px 20px rgba(21, 128, 120, .1);
  outline: none;
}

.accounting-row.accounting-task-action.attention {
  border-color: #e6b8b8;
  background: #fff8f7;
}

.accounting-row.accounting-task-action em {
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 950;
  white-space: nowrap;
}

.accounting-row.accounting-task-action.attention em {
  color: #a13a32;
}

.accounting-row.report {
  grid-template-columns: auto minmax(0, 1fr);
}

.accounting-row.provider {
  background: #fff;
}

.accounting-row.recurring {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}

.accounting-row.access {
  grid-template-columns: auto minmax(0, 1fr);
  background: #fff;
}

.accounting-row.connector-export {
  grid-template-columns: auto minmax(0, 1fr);
  background: #fff;
}

.accounting-row.audit {
  grid-template-columns: auto minmax(0, 1fr);
  background: #fff;
}

.accounting-row.journal {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  background: #fff;
}

.accounting-journal-lines {
  grid-column: 2;
  display: grid;
  gap: 6px;
  min-width: 0;
}

.accounting-journal-lines span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border-top: 1px solid #e4ebe9;
  padding-top: 6px;
}

.accounting-journal-lines em {
  color: var(--muted);
  font-size: .75rem;
  overflow-wrap: anywhere;
}

.accounting-row.connector-export em,
.accounting-row.audit em {
  grid-column: 2;
  color: var(--muted);
  font-size: .75rem;
  overflow-wrap: anywhere;
}

.accounting-row-icon {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: var(--brand-dark);
  background: var(--tile-tint);
}

.accounting-row-icon .lucide-icon {
  width: 18px;
  height: 18px;
  stroke-width: 2.15;
}

.accounting-row span:not(.accounting-row-icon) {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.accounting-row strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.accounting-row small,
.accounting-row em,
.accounting-empty {
  color: var(--muted);
  font-size: .86rem;
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.accounting-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  grid-column: 2 / -1;
}

.staff-topic-grid {
  align-items: stretch;
}

.staff-capacity-overview,
.staff-slot-list {
  grid-column: 1 / -1;
}

.staff-capacity-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  min-width: 0;
  border: 1px solid #bdd7d3;
  border-radius: 8px;
  padding: 16px;
  background: #f2fbf9;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .04);
}

.staff-capacity-overview > div:first-child {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 12px;
  align-items: center;
  min-width: 0;
}

.staff-capacity-overview > div:first-child > span {
  grid-row: 1 / span 2;
}

.staff-capacity-overview strong,
.staff-slot-body b {
  min-width: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.staff-capacity-overview em,
.staff-slot-body span,
.staff-slot-context {
  min-width: 0;
  color: var(--muted);
  font-style: normal;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.staff-capacity-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(72px, 1fr));
  gap: 8px;
  min-width: 0;
}

.staff-capacity-metrics span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid rgba(28, 141, 132, .18);
  border-radius: 8px;
  padding: 9px 10px;
  background: #fff;
}

.staff-capacity-metrics small {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 760;
  text-transform: uppercase;
}

.staff-capacity-metrics b {
  color: var(--ink);
  font-size: 1.08rem;
}

.staff-slot-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.staff-slot-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid #d9e5e2;
  border-left: 4px solid #9bb7b2;
  border-radius: 8px;
  padding: 13px;
  background: #fff;
}

.staff-slot-card.available {
  border-left-color: var(--brand);
}

.staff-slot-card.overcapacity {
  border-left-color: #c88a24;
  background: #fffaf0;
}

.staff-slot-warning,
[data-testid="staff-capacity-summary"].warning,
[data-testid="staff-capacity-panel-summary"].warning {
  color: #70501c;
}

.staff-slot-warning {
  margin: 4px 0 0;
  border: 1px solid #ead7ad;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff7e6;
  font-size: .88rem;
  line-height: 1.35;
}

.staff-user-list {
  display: grid;
  gap: 10px;
}

.staff-user-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: stretch;
  min-width: 0;
  border: 1px solid #d5e4e1;
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(39, 54, 54, .04);
}

.staff-user-card.inactive {
  border-left-color: #a9b6b3;
  background: #fbfcfc;
}

.staff-user-card.access-warning {
  border-left-color: #d69b35;
}

.staff-user-card.access-error {
  border-left-color: #b85d5d;
}

.staff-user-card.access-neutral {
  border-left-color: #9aa8a5;
}

.staff-user-main,
.staff-user-identity {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.staff-user-title-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  min-width: 0;
}

.staff-user-title-row .status-pill {
  flex: 0 0 auto;
  max-width: 46%;
  text-align: center;
}

.staff-user-title-row strong {
  color: var(--ink);
  font-size: 1.02rem;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.staff-user-title-row span:not(.status-pill),
.staff-user-details {
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.staff-identity-status {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid #d8e6e3;
  border-radius: 8px;
  padding: 10px 12px;
  background: #f8fbfa;
}

.staff-identity-status.warning {
  border-color: #ead7ad;
  background: #fffaf0;
}

.staff-identity-status.good {
  border-color: #bfe3cf;
  background: #f1fbf5;
}

.staff-identity-status.error {
  border-color: #f0c7c7;
  background: #fff6f6;
}

.staff-identity-status-header {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.staff-identity-status-header strong {
  min-width: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.staff-identity-status p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.staff-identity-explainer {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.staff-identity-explainer span {
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.staff-identity-status-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.staff-identity-status-meta span {
  border-radius: 999px;
  padding: 4px 8px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 760;
  background: rgba(255, 255, 255, .75);
}

.staff-user-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 8px;
  min-width: 0;
}

.staff-user-meta > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid rgba(28, 141, 132, .14);
  border-radius: 8px;
  padding: 8px 10px;
  background: #f7fbfa;
}

.staff-user-meta small {
  color: var(--muted);
  font-size: .7rem;
  font-weight: 820;
  text-transform: uppercase;
}

.staff-user-meta b {
  min-width: 0;
  color: var(--ink);
  font-size: .9rem;
  overflow-wrap: anywhere;
}

.staff-user-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(94px, 1fr));
  gap: 8px;
  align-content: start;
  min-width: 306px;
}

.staff-user-actions .mini-action {
  width: 100%;
  min-height: 40px;
  justify-content: center;
  text-align: center;
  white-space: normal;
}

.staff-slot-header {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  min-width: 0;
}

.staff-slot-header strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.staff-slot-body {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.staff-slot-context {
  border: 1px solid #d9e5e2;
  border-radius: 8px;
  padding: 12px;
  background: #f7fbfa;
}

.admin-topic-card.requires-module,
.admin-topic-card:disabled {
  border-color: #d9dfdd;
  color: var(--muted);
  background: #f1f4f3;
  box-shadow: none;
  cursor: not-allowed;
}

.admin-topic-card.requires-module:hover,
.admin-topic-card:disabled:hover {
  border-color: #d9dfdd;
  background: #f1f4f3;
}

.admin-topic-card.requires-module span,
.admin-topic-card:disabled span {
  color: #6e7a78;
  background: #e2e8e6;
}

.admin-topic-card.requires-module strong,
.admin-topic-card:disabled strong,
.admin-topic-card.requires-module em,
.admin-topic-card:disabled em {
  color: #667270;
}

.admin-topic-card small.neutral {
  color: var(--muted);
  background: #eef3f2;
}

@media (max-width: 980px) {
  .staff-user-card {
    grid-template-columns: 1fr;
  }

  .staff-user-actions {
    min-width: 0;
  }

  .staff-user-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .staff-user-title-row {
    display: grid;
  }

  .staff-identity-status-header {
    display: grid;
  }

  .staff-user-meta,
  .staff-user-actions {
    grid-template-columns: 1fr;
  }
}

.help-detail-panel {
  display: grid;
  gap: 16px;
  max-width: 1060px;
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.help-detail-panel[hidden] {
  display: none;
}

.help-detail-heading {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: start;
  min-width: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.help-detail-heading h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 1.28rem;
  line-height: 1.15;
}

.help-detail-heading small {
  color: var(--muted);
  font-weight: 820;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.help-detail-heading > span {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 5px 10px;
  color: var(--brand-dark);
  font-size: .82rem;
  font-weight: 820;
  background: var(--tile-tint);
}

.help-detail-panel p,
.help-detail-panel li,
.help-detail-panel footer {
  color: var(--muted);
  line-height: 1.45;
}

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

.help-detail-grid section {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #f8fbfa;
}

.help-detail-grid h4 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 1rem;
}

.help-detail-grid ol,
.help-detail-grid ul {
  margin: 0;
  padding-left: 20px;
}

.help-detail-panel footer {
  border-top: 1px solid var(--line);
  padding-top: 12px;
  font-size: .92rem;
}

.tenant-observability {
  display: grid;
  gap: 16px;
  max-width: 1180px;
}

.observability-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.observability-kpi,
.observability-panel,
.observability-advice,
.observability-device-card {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.observability-kpi {
  display: grid;
  gap: 5px;
  padding: 14px;
}

.observability-kpi span,
.observability-kpi em,
.observability-route-row span,
.observability-network-note,
.observability-device-advice span {
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.35;
}

.observability-kpi strong {
  color: var(--ink);
  font-size: 1.45rem;
  line-height: 1.05;
}

.observability-advice-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.observability-advice {
  display: grid;
  gap: 6px;
  padding: 14px;
  border-left: 5px solid #7aa49b;
}

.observability-advice.warning {
  border-left-color: #d3982b;
  background: #fffaf0;
}

.observability-advice.good {
  border-left-color: #258a65;
  background: #f3fbf7;
}

.observability-advice strong,
.observability-device-main strong,
.observability-route-row strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.observability-advice p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.observability-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 14px;
  align-items: start;
}

.observability-panel {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.observability-route-list,
.observability-device-list {
  display: grid;
  gap: 10px;
}

.observability-route-row {
  display: grid;
  grid-template-columns: minmax(0, .65fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  border: 1px solid #e4ecea;
  border-radius: 8px;
  padding: 12px;
  background: #fbfdfc;
}

.latency-bars {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.latency-bar {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) 70px;
  gap: 8px;
  align-items: center;
  min-width: 0;
  font-size: .82rem;
}

.latency-bar div {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8efed;
}

.latency-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #238775;
}

.latency-bar:nth-child(2) i {
  background: #537fbe;
}

.latency-bar:nth-child(3) i {
  background: #c68a22;
}

.observability-hour-chart {
  display: grid;
  grid-template-columns: repeat(24, minmax(14px, 1fr));
  align-items: end;
  gap: 4px;
  min-height: 230px;
  border-radius: 8px;
  padding: 14px 10px 8px;
  background: var(--surface);
}

.hour-bar {
  display: grid;
  grid-template-rows: minmax(120px, 1fr) auto;
  align-items: end;
  justify-items: center;
  gap: 6px;
  min-width: 0;
}

.hour-bar span,
.hour-bar i {
  display: block;
  width: 9px;
  min-height: 2px;
  border-radius: 999px 999px 0 0;
  background: #238775;
}

.hour-bar i {
  width: 5px;
  margin-top: -100%;
  background: #537fbe;
}

.hour-bar small {
  color: var(--muted);
  font-size: .68rem;
}

.observability-device-card {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.observability-device-explain {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid #d8e5e1;
  border-radius: 8px;
  padding: 12px 14px;
  color: var(--ink);
  background: #f6faf9;
}

.observability-device-explain p {
  margin: 0;
  color: var(--muted);
  line-height: 1.42;
}

.observability-device-card.current {
  border-color: color-mix(in srgb, var(--brand) 42%, var(--line));
  background: color-mix(in srgb, var(--brand) 4%, #fff);
}

.observability-device-card.attention {
  border-color: #efcd8f;
}

.observability-device-card.unmeasured {
  background: #fbfdfc;
}

.observability-device-main {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.observability-device-main > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.observability-device-meta {
  color: var(--muted);
  font-size: .76rem;
  line-height: 1.35;
}

.observability-device-context {
  color: var(--ink);
  font-size: .86rem;
  line-height: 1.35;
}

.observability-device-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-content: flex-start;
  gap: 6px;
}

.observability-device-main small {
  display: inline-flex;
  align-items: center;
  align-self: start;
  min-height: 28px;
  border-radius: 999px;
  padding: 4px 9px;
  color: var(--muted);
  font-weight: 820;
  background: #eef3f2;
}

.observability-device-main small.current {
  color: #075985;
  background: #e0f2fe;
}

.observability-device-main small.good {
  color: #176e50;
  background: #e7f8f0;
}

.observability-device-main small.attention,
.observability-device-main small.offline {
  color: #7a4e12;
  background: #fff2d7;
}

.observability-device-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.observability-device-metrics div {
  min-width: 0;
  border-radius: 8px;
  padding: 8px;
  background: var(--surface);
}

.observability-device-metrics dt {
  color: var(--muted);
  font-size: .72rem;
}

.observability-device-metrics dd {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: .92rem;
  font-weight: 780;
  overflow-wrap: anywhere;
}

.observability-device-advice {
  display: grid;
  gap: 4px;
  border-radius: 8px;
  padding: 10px;
  background: #f4f8f7;
}

.observability-device-advice.warning {
  background: #fff5df;
}

.observability-device-advice.info {
  background: #f4f8f7;
}

.observability-device-advice.good {
  background: #eaf8f1;
}

.observability-empty {
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 16px;
  color: var(--muted);
  background: #fff;
}

.observability-empty.warning {
  color: #7a4e12;
  background: #fff5df;
}

@media (max-width: 1200px) {
  .observability-layout,
  .observability-route-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 760px) {
  .help-detail-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .help-detail-heading {
    display: grid;
  }

  .observability-kpis,
  .observability-layout,
  .observability-route-row,
  .observability-device-metrics,
  .marketplace-connector-summary,
  .marketplace-connector-metrics,
  .marketplace-connector-panels {
    grid-template-columns: minmax(0, 1fr);
  }

  .observability-hour-chart {
    overflow-x: auto;
    grid-template-columns: repeat(24, 18px);
  }

  .observability-device-main {
    display: grid;
  }
}

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

.integration-readiness-card {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 13px 14px;
  background: #fff;
}

.integration-readiness-card strong {
  color: var(--ink);
}

.integration-readiness-card span {
  color: var(--muted);
  line-height: 1.36;
}

.integration-readiness-card small {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.3;
}

.marketplace-connector-workspace {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid #d6e3e0;
  border-radius: 8px;
  padding: 14px;
  background: #f8fcfb;
}

.marketplace-connector-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  min-width: 0;
}

.marketplace-connector-summary > div,
.marketplace-connector-panels article,
.marketplace-connector-result {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.marketplace-connector-summary strong,
.marketplace-connector-panels strong,
.marketplace-connector-result strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.marketplace-connector-summary span,
.marketplace-connector-panels span,
.marketplace-connector-result span,
.marketplace-connector-result li {
  color: var(--muted);
  line-height: 1.36;
  overflow-wrap: anywhere;
}

.marketplace-connector-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.marketplace-connector-metrics > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid #dce7e4;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
}

.marketplace-connector-metrics small {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 820;
  text-transform: uppercase;
}

.marketplace-connector-metrics b {
  color: var(--brand-dark);
  font-size: 1rem;
}

.marketplace-connector-panels {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.marketplace-connector-panels article,
.marketplace-connector-result {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.marketplace-connector-panels .mini-action {
  min-height: 40px;
  justify-content: center;
  white-space: normal;
}

.marketplace-connector-result ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding-left: 18px;
}

.activation-context-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.activation-context-panel section {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.activation-context-panel span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.activation-context-panel strong {
  color: var(--ink);
  font-size: 1rem;
  overflow-wrap: anywhere;
}

.activation-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.activation-actions .management-action {
  min-height: 54px;
}

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

.sales-topic-detail {
  display: grid;
  gap: 14px;
  min-width: 0;
  border: 1px solid #dde5e3;
  border-radius: 8px;
  padding: 16px;
  background: #ffffff;
  box-shadow: 0 10px 22px rgba(39, 54, 54, .05);
}

.sales-topic-detail[hidden] {
  display: none;
}

.omnichannel-order-workspace {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid #d8e5e2;
  border-radius: 8px;
  padding: 14px;
  background: #f7fbfa;
}

.omnichannel-order-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.omnichannel-order-heading h4 {
  margin: 0;
  color: var(--ink);
  font-size: 1.08rem;
  line-height: 1.2;
}

.omnichannel-order-heading p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.omnichannel-order-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(72px, 1fr));
  gap: 8px;
  min-width: 0;
}

.omnichannel-order-kpi {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid #dce7e4;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
}

.omnichannel-order-kpi strong {
  color: var(--brand-dark);
  font-size: 1.05rem;
}

.omnichannel-order-kpi small {
  color: var(--muted);
  font-size: .74rem;
  font-weight: 820;
  text-transform: uppercase;
}

.omnichannel-order-toolbar {
  display: grid;
  grid-template-columns: minmax(130px, .22fr) minmax(140px, .22fr) minmax(180px, 1fr);
  gap: 10px;
  align-items: end;
  min-width: 0;
}

.omnichannel-order-toolbar label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.omnichannel-order-toolbar select,
.omnichannel-order-toolbar input {
  min-width: 0;
  width: 100%;
  min-height: 42px;
  border: 1px solid #d5e2df;
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: .94rem;
  text-transform: none;
}

.omnichannel-order-layout {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(280px, .58fr);
  gap: 12px;
  min-width: 0;
  align-items: start;
}

.omnichannel-order-list,
.omnichannel-order-detail {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.omnichannel-order-item {
  display: grid;
  gap: 6px;
  min-width: 0;
  width: 100%;
  border: 1px solid #dce7e4;
  border-left: 5px solid #b5c5c1;
  border-radius: 8px;
  padding: 11px 12px;
  background: #fff;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.omnichannel-order-item[data-status="error"] {
  border-left-color: #b94b4b;
}

.omnichannel-order-item[data-status="warning"] {
  border-left-color: #c1842f;
}

.omnichannel-order-item[data-status="good"] {
  border-left-color: var(--brand);
}

.omnichannel-order-item[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand) 48%, #dce7e4);
  box-shadow: 0 0 0 3px rgba(28, 141, 132, .12);
}

.omnichannel-order-item-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.omnichannel-order-item-top strong,
.omnichannel-order-detail-title strong {
  min-width: 0;
  color: var(--ink);
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.omnichannel-order-item-meta,
.omnichannel-order-next {
  min-width: 0;
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.omnichannel-order-next {
  color: var(--brand-dark);
  font-weight: 780;
}

.omnichannel-order-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: .74rem;
  font-style: normal;
  font-weight: 850;
  white-space: nowrap;
}

.omnichannel-order-status.error {
  background: #fff1f1;
  color: #9f3333;
}

.omnichannel-order-status.warning {
  background: #fff6df;
  color: #80500f;
}

.omnichannel-order-status.good {
  background: #e8f7f3;
  color: var(--brand-dark);
}

.omnichannel-order-status.neutral {
  background: #eef3f2;
  color: #53615f;
}

.omnichannel-order-detail {
  border: 1px solid #dce7e4;
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.omnichannel-order-detail-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.omnichannel-order-detail-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.omnichannel-order-detail-meta > span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid #edf2f1;
  border-radius: 8px;
  padding: 8px;
  background: #fbfdfc;
}

.omnichannel-order-detail-meta small {
  color: var(--muted);
  font-size: .7rem;
  font-weight: 820;
  text-transform: uppercase;
}

.omnichannel-order-detail-meta b {
  min-width: 0;
  color: var(--ink);
  font-size: .9rem;
  overflow-wrap: anywhere;
}

.omnichannel-order-action-panel {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid #ead7ad;
  border-radius: 8px;
  padding: 10px;
  background: #fffaf0;
}

.omnichannel-order-action-panel strong {
  color: #775116;
}

.omnichannel-order-action-panel span,
.omnichannel-order-lines {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.omnichannel-order-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.omnichannel-order-actions .mini-action {
  min-height: 42px;
  justify-content: center;
  text-align: center;
  white-space: normal;
}

.omnichannel-order-no-actions,
.omnichannel-order-action-result {
  display: block;
  min-width: 0;
  color: var(--muted);
  font-size: .88rem;
}

.omnichannel-order-lines {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
}

.omnichannel-order-return-panel {
  display: grid;
  gap: 9px;
  min-width: 0;
  border: 1px solid #d7e3c7;
  border-radius: 8px;
  padding: 10px;
  background: #fbfff6;
}

.omnichannel-order-return-panel strong {
  color: #40621d;
}

.omnichannel-order-return-panel span {
  min-width: 0;
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.omnichannel-order-return-form {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(80px, .55fr);
  gap: 8px;
  min-width: 0;
}

.omnichannel-order-return-form label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.omnichannel-order-return-form select,
.omnichannel-order-return-form input {
  width: 100%;
  min-height: 38px;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.omnichannel-order-return-check {
  align-content: end;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}

.omnichannel-order-return-check input {
  width: 18px;
  min-height: 18px;
}

.omnichannel-order-return-reason,
.omnichannel-order-return-form .mini-action {
  grid-column: 1 / -1;
}

.rate-limit-admin-shell {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.rate-limit-admin-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.rate-limit-summary-card {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.rate-limit-summary-card small,
.rate-limit-policy-card small {
  color: var(--muted);
  font-size: .74rem;
  font-weight: 760;
  text-transform: uppercase;
}

.rate-limit-summary-card strong {
  overflow-wrap: anywhere;
}

.rate-limit-policy-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.rate-limit-policy-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.rate-limit-policy-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.rate-limit-policy-heading strong,
.rate-limit-policy-card p {
  min-width: 0;
  overflow-wrap: anywhere;
}

.rate-limit-policy-card p {
  margin: 0;
  color: var(--muted);
}

.rate-limit-policy-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.rate-limit-policy-metrics span {
  display: grid;
  gap: 3px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 8px;
  background: var(--surface);
}

.rate-limit-policy-message {
  padding-top: 8px;
  border-top: 1px solid var(--soft-line);
}

.rate-limit-override-form {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.security-events-shell {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.security-events-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.security-events-summary-card {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.security-events-summary-card small,
.security-event-meta small {
  color: var(--muted);
  font-size: .74rem;
  font-weight: 760;
  text-transform: uppercase;
}

.security-events-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  min-width: 0;
}

.security-events-toolbar label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.security-events-toolbar label > span {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 760;
  text-transform: uppercase;
}

.security-events-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.security-event-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.security-event-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.security-event-heading strong,
.security-event-card p,
.security-event-meta b {
  min-width: 0;
  overflow-wrap: anywhere;
}

.security-event-card p {
  margin: 0;
  color: var(--text);
  line-height: 1.4;
}

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

.security-event-meta span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 8px;
  background: var(--surface);
}

.security-policy-shell {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.security-policy-boundary {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface);
}

.security-policy-boundary-title,
.security-policy-card-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.security-policy-boundary p,
.security-policy-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.security-policy-boundary small {
  color: var(--muted);
  font-weight: 760;
}

.security-policy-explainer {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.security-policy-explainer article {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.security-policy-explainer strong {
  font-weight: 850;
}

.security-policy-explainer p {
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
}

.security-policy-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.security-policy-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.security-policy-card strong,
.security-policy-boundary strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.security-policy-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.security-policy-metrics span {
  display: grid;
  gap: 3px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 8px;
  background: var(--surface);
}

.security-policy-metrics small {
  color: var(--muted);
  font-size: .74rem;
  font-weight: 760;
  text-transform: uppercase;
}

.security-policy-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.security-policy-action {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  border: 1px solid var(--soft-line);
  border-radius: 999px;
  padding: 8px 10px;
  color: var(--muted);
  font-size: .88rem;
  font-weight: 760;
  background: #fff;
  overflow-wrap: anywhere;
}

.security-policy-adapter {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.security-policy-adapter-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.security-policy-adapter p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.security-policy-adapter-plans {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.security-policy-adapter-plan {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface);
}

.security-policy-adapter-plan strong,
.security-policy-adapter-plan span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.security-policy-adapter-plan span {
  color: var(--muted);
  font-size: .86rem;
  line-height: 1.35;
}

.sso-config-shell {
  display: grid;
  gap: 14px;
  min-width: 0;
}

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

.sso-explainer article {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.sso-explainer strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 850;
}

.sso-explainer p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.sso-readiness-card {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface);
}

.sso-readiness-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.sso-readiness-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
}

.sso-step-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sso-step-list span {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 999px;
  padding: 7px 10px;
  color: var(--muted);
  font-size: .86rem;
  font-weight: 760;
  background: #fff;
}

.sso-config-form {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

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

.shop-management-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
}

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

.shop-context-summary section,
.shop-topology-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(39, 54, 54, .045);
}

.shop-context-summary span {
  display: block;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.shop-context-summary strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: clamp(1.08rem, 1.2vw, 1.42rem);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.shop-context-summary em {
  display: block;
  margin-top: 6px;
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 740;
}

.shop-topology-panel {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
}

.shop-topology-list {
  display: grid;
  gap: 10px;
}

.shop-location-card {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(240px, .75fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
  border: 1px solid var(--line);
  border-left: 5px solid var(--brand);
  border-radius: 8px;
  padding: 12px;
  background: #fbfdfc;
}

.shop-location-card.warning {
  border-left-color: var(--clay);
}

.shop-location-main,
.shop-register-list {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.shop-location-main strong {
  font-size: 1rem;
  overflow-wrap: anywhere;
}

.shop-location-main span,
.shop-register-row {
  color: var(--muted);
  font-size: .9rem;
  font-weight: 720;
  overflow-wrap: anywhere;
}

.shop-register-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
}

.shop-register-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #f5fbfa;
}

.shop-register-toolbar strong {
  min-width: 0;
  color: var(--brand-dark);
  overflow-wrap: anywhere;
}

.register-editor-form[hidden] {
  display: none;
}

.device-card.guarded-delete {
  border-left-color: var(--clay);
}

.delete-guard-note,
.delete-ready-note {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: .78rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.delete-guard-note {
  background: #fff6e9;
  color: #7b4c13;
}

.delete-ready-note {
  background: #eaf7f3;
  color: var(--brand-dark);
}

.shop-management-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fbfdfd;
}

.shop-management-panel.register-panel {
  background: #fffcf7;
}

.shop-management-panel.attention-target {
  border-color: var(--brand);
  box-shadow: 0 0 0 4px rgba(38, 159, 150, .16), 0 14px 28px rgba(39, 54, 54, .1);
}

.panel-heading {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--soft-line);
}

.panel-heading span {
  color: var(--brand-dark);
  font-size: .76rem;
  font-weight: 850;
  text-transform: uppercase;
}

.register-panel .panel-heading span {
  color: #7c5b31;
}

.panel-heading strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.panel-heading p {
  margin: 0;
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.35;
}

.onboarding-explain {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid #e0c79d;
  border-radius: 8px;
  padding: 12px;
  background: #fffaf2;
  color: var(--ink);
}

.onboarding-explain strong {
  color: #7c5b31;
}

.onboarding-explain span {
  min-width: 0;
  color: var(--muted);
}

.admin-empty-state {
  min-height: 88px;
  border: 1px dashed #cbd8d5;
  border-radius: 8px;
  padding: 18px;
  color: var(--muted);
  background: #f8fbfa;
}

.admin-alert-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid #e2e9e7;
  border-radius: 8px;
  padding: 12px;
  background: #fbfdfc;
}

.status-badge {
  display: inline-grid;
  place-items: center;
  min-width: 58px;
  min-height: 26px;
  border-radius: 999px;
  padding: 0 10px;
  font-size: .74rem;
  font-weight: 850;
}

.status-badge.ok {
  background: #e2f6ed;
  color: #166947;
}

.status-badge.warn {
  background: #fff0cf;
  color: #8a5a13;
}

.status-badge.neutral {
  background: #eef2f4;
  color: #52636b;
}

.admin-table-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(170px, .32fr) minmax(170px, .32fr) auto;
  gap: 12px;
  align-items: end;
}

.pos-catalog-display-settings {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid #dbe6e3;
  border-radius: 8px;
  background: #f7fbfa;
}

.pos-catalog-display-settings > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.pos-catalog-display-settings strong {
  color: var(--ink);
}

.pos-catalog-display-settings span {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.segmented-control {
  display: inline-grid;
  grid-auto-flow: column;
  gap: 4px;
  padding: 4px;
  border: 1px solid #d4dfdd;
  border-radius: 8px;
  background: #ffffff;
}

.segmented-control label {
  position: relative;
  min-width: 132px;
  min-height: 42px;
}

.segmented-control input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.segmented-control span {
  display: grid;
  place-items: center;
  height: 100%;
  padding: 8px 12px;
  border-radius: 6px;
  color: var(--ink);
  font-weight: 800;
  text-align: center;
}

.segmented-control input:checked + span {
  background: #e8f3f1;
  color: #214945;
  box-shadow: inset 0 0 0 1px #b9d5d0;
}

.segmented-control input:focus-visible + span {
  outline: 3px solid rgba(38, 103, 95, .28);
  outline-offset: 2px;
}

.admin-table-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 12px;
}

.admin-table-scroll {
  overflow-x: auto;
}

.admin-data-table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
}

.admin-data-table th,
.admin-data-table td {
  border-bottom: 1px solid #e4ebe8;
  padding: 12px 10px;
  text-align: left;
  vertical-align: middle;
}

.admin-data-table th {
  color: var(--muted);
  font-size: .75rem;
  font-weight: 850;
  text-transform: uppercase;
}

.admin-data-table tbody tr {
  cursor: pointer;
}

.admin-data-table tbody tr:hover {
  background: #f7fbfa;
}

.admin-data-table td strong,
.admin-data-table td span {
  display: block;
  min-width: 0;
}

.admin-data-table td span {
  color: var(--muted);
  font-size: .82rem;
}

.table-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  white-space: nowrap;
}

.admin-drawer {
  width: 100%;
  overflow-y: auto;
  border: 1px solid #dce4e1;
  border-radius: 8px;
  padding: 18px;
  background: #ffffff;
  box-shadow: 0 12px 26px rgba(31, 37, 40, .08);
}

.admin-drawer[hidden] {
  display: none;
}

[data-testid="product-drawer"] {
  position: fixed;
  z-index: 90;
  top: 88px;
  right: 24px;
  bottom: 24px;
  width: min(620px, calc(100vw - 48px));
  max-height: calc(100dvh - 112px);
  overflow-y: auto;
}

.admin-drawer-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-bottom: 16px;
}

.pos-input-row {
  display: grid;
  grid-template-columns: minmax(220px, .86fr) minmax(260px, 1fr);
  gap: 10px;
  min-width: 0;
  align-items: end;
}

.barcode-box,
.search-box {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.barcode-box span,
.search-box span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.field-with-icon {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  min-height: 52px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--panel);
  color: var(--ink);
}

.field-with-icon > .lucide-icon {
  width: 20px;
  height: 20px;
  color: var(--steel);
  stroke-width: 2.4;
}

.barcode-box input,
.search-box input {
  width: 100%;
  min-width: 0;
  min-height: 50px;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  color: var(--ink);
}

.barcode-box input {
  font-weight: 760;
}

.select-box {
  display: grid;
  gap: 6px;
}

.select-box span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.select-box select {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
}

.select-box input {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
}

.category-tabs {
  overflow-x: auto;
  padding-bottom: 9px;
  scrollbar-color: #d8dfdd transparent;
  scrollbar-width: thin;
}

.profile-filter-tabs {
  align-items: stretch;
  overflow-x: auto;
  padding: 0 0 8px;
  scrollbar-color: #d8dfdd transparent;
  scrollbar-width: thin;
}

.category-tabs::-webkit-scrollbar {
  height: 9px;
}

.profile-filter-tabs::-webkit-scrollbar {
  height: 8px;
}

.category-tabs::-webkit-scrollbar-track {
  background: transparent;
}

.profile-filter-tabs::-webkit-scrollbar-track {
  background: transparent;
}

.category-tabs::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #d8dfdd;
  background-clip: content-box;
}

.profile-filter-tabs::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #d8dfdd;
  background-clip: content-box;
}

.category-tabs::-webkit-scrollbar-thumb:hover {
  background: #cbd4d1;
  background-clip: content-box;
}

.profile-filter-tabs::-webkit-scrollbar-thumb:hover {
  background: #cbd4d1;
  background-clip: content-box;
}

.category-tabs button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  min-width: 104px;
  width: max-content;
  padding: 0 18px;
  background: var(--category-bg, #ffffff);
  color: var(--category-fg, var(--ink));
  font-weight: 760;
  white-space: nowrap;
}

.profile-filter-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  max-width: min(560px, 100%);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px;
  background: color-mix(in srgb, var(--tile-tint) 64%, #ffffff);
}

.profile-filter-label {
  flex: 0 0 auto;
  padding: 0 8px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
  white-space: nowrap;
}

.profile-filter-pill {
  flex: 0 0 auto;
  min-height: 36px;
  border-radius: 999px;
  padding: 0 12px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 760;
  white-space: nowrap;
}

.profile-filter-pill.active {
  border-color: var(--brand);
  background: var(--brand);
  color: #ffffff;
}

.category-tab-icon {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}

.category-tab-icon img,
.side-nav-item img,
.category-icon-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.category-tabs .active {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 28%, transparent);
}

.pane-heading,
.section-heading {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
}

.product-pane > .pane-heading,
.cart-pane > .pane-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: start;
}

.cart-pane > .pane-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
}

.product-pane > .pane-heading > div,
.cart-pane > .pane-heading > div {
  min-width: 0;
}

.cart-heading-copy {
  flex: 1 0 100%;
  min-width: 0;
  max-width: 100%;
}

.cart-title-line {
  display: flex;
  align-items: baseline;
  gap: 6px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
}

.cart-title-line h2 {
  flex: 0 0 auto;
}

.cart-title-line span {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: .92rem;
  font-weight: 500;
  text-overflow: ellipsis;
}

.product-pane > .pane-heading p {
  overflow-wrap: anywhere;
}

.cart-tools {
  display: flex;
  flex: 1 0 100%;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.cart-icon-button {
  position: relative;
  display: inline-grid;
  flex: 0 0 58px;
  place-items: center;
  width: 58px;
  min-width: 58px;
  max-width: 58px;
  min-height: 54px;
  padding: 0;
  background: var(--surface);
  color: var(--brand-dark);
}

.cart-icon-button .lucide-icon {
  width: 23px;
  height: 23px;
  stroke-width: 2.35;
}

.cart-icon-button .stacked-icon {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
}

.cart-icon-button .cart-icon-badge {
  position: absolute;
  right: -7px;
  bottom: -5px;
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border: 2px solid var(--surface);
  border-radius: 999px;
  background: var(--surface);
}

.cart-icon-button .cart-icon-badge .lucide-icon {
  width: 14px;
  height: 14px;
  stroke-width: 2.6;
}

.cart-icon-button strong {
  position: absolute;
  top: 5px;
  right: 7px;
  min-width: 20px;
  border-radius: 999px;
  padding: 1px 5px;
  background: var(--brand-dark);
  color: #fff;
  font-size: .72rem;
  line-height: 1.35;
}

.cart-icon-button:hover,
.cart-icon-button:focus-visible,
.cart-icon-button.active {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.cart-context-panel {
  display: grid;
  grid-template-columns: minmax(150px, .92fr) minmax(180px, 1fr);
  gap: 8px;
  align-items: end;
}

.cart-fulfillment-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 8px 0 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #f9fbfb;
}

.cart-fulfillment-panel[hidden] {
  display: none;
}

.cart-fulfillment-panel > div {
  grid-column: 1 / -1;
  display: grid;
  gap: 2px;
}

.cart-fulfillment-panel strong {
  font-size: .94rem;
}

.cart-fulfillment-panel span {
  color: var(--muted);
  font-size: .8rem;
}

.cart-fulfillment-panel label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.cart-fulfillment-panel input {
  min-width: 0;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 8px;
  background: #fff;
}

.cart-fulfillment-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin: 8px 0 0;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--line));
  border-radius: 8px;
  padding: 10px;
  background: color-mix(in srgb, var(--brand) 7%, #fff);
}

.cart-fulfillment-summary[hidden] {
  display: none;
}

.cart-fulfillment-summary > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.cart-fulfillment-summary strong,
.cart-fulfillment-summary span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.cart-fulfillment-summary strong {
  font-size: .92rem;
}

.cart-fulfillment-summary span {
  color: var(--muted);
  font-size: .82rem;
}

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

.cart-fulfillment-actions .mini-action:disabled {
  cursor: not-allowed;
  opacity: .56;
}

.mini-action.customer-benefits-button {
  min-width: 92px;
}

.customer-benefits-button:disabled {
  cursor: not-allowed;
  opacity: .56;
}

.customer-benefits-preview {
  display: grid;
  gap: 8px;
  margin: 8px 0 0;
  border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--line));
  border-radius: 8px;
  padding: 10px;
  background: color-mix(in srgb, var(--brand) 6%, #fff);
}

.customer-benefits-preview[hidden] {
  display: none;
}

.customer-benefits-preview > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.customer-benefits-preview strong,
.customer-benefits-preview span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.customer-benefits-preview strong {
  font-size: .92rem;
}

.customer-benefits-preview span {
  color: var(--muted);
  font-size: .82rem;
}

.customer-benefits-preview ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.customer-voucher-form,
.customer-loyalty-form,
.customer-giftcard-form,
.customer-store-credit-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  min-width: 0;
}

.customer-voucher-form[hidden],
.customer-loyalty-form[hidden],
.customer-giftcard-form[hidden],
.customer-store-credit-form[hidden] {
  display: none;
}

.customer-voucher-form label,
.customer-loyalty-form label,
.customer-giftcard-form label,
.customer-store-credit-form label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.customer-voucher-form input,
.customer-loyalty-form input,
.customer-giftcard-form input,
.customer-store-credit-form input {
  min-width: 0;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
}

.customer-voucher-result,
.customer-loyalty-result,
.customer-giftcard-result,
.customer-store-credit-result {
  min-width: 0;
  color: var(--muted);
  font-size: .82rem;
  overflow-wrap: anywhere;
}

.customer-benefits-preview li {
  display: grid;
  gap: 2px;
  min-width: 0;
  border-top: 1px solid color-mix(in srgb, var(--brand) 16%, var(--line));
  padding-top: 6px;
}

.pos-omnichannel-pickup {
  display: grid;
  gap: 9px;
  margin: 8px 0 0;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--line));
  border-radius: 8px;
  padding: 10px;
  background: #f7fbfa;
}

.pos-omnichannel-pickup[hidden] {
  display: none;
}

.pos-omnichannel-pickup-heading,
.pos-omnichannel-pickup-heading > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.pos-omnichannel-pickup-heading strong,
.pos-omnichannel-pickup-title strong {
  min-width: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.pos-omnichannel-pickup-heading span,
.pos-omnichannel-pickup-result,
.pos-omnichannel-pickup-lines {
  color: var(--muted);
  font-size: .84rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.pos-omnichannel-pickup-search,
.pos-omnichannel-pickup-complete {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  min-width: 0;
}

.pos-omnichannel-pickup-search label,
.pos-omnichannel-pickup-complete label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.pos-omnichannel-pickup-search label > span,
.pos-omnichannel-pickup-complete label > span {
  color: var(--muted);
  font-size: .74rem;
  font-weight: 820;
  text-transform: uppercase;
}

.pos-omnichannel-pickup-search input,
.pos-omnichannel-pickup-complete input {
  min-width: 0;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
}

.pos-omnichannel-pickup-detail > .mini-action {
  width: 100%;
  min-height: 40px;
  justify-content: center;
}

.pos-omnichannel-pickup-detail {
  display: grid;
  gap: 9px;
  min-width: 0;
  border-top: 1px solid var(--soft-line);
  padding-top: 9px;
}

.pos-omnichannel-pickup-detail[hidden] {
  display: none;
}

.pos-omnichannel-pickup-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.pos-omnichannel-pickup-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.pos-omnichannel-pickup-meta > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 1px solid #e3ece9;
  border-radius: 8px;
  padding: 7px 8px;
  background: #fff;
}

.pos-omnichannel-pickup-meta small {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 820;
  text-transform: uppercase;
}

.pos-omnichannel-pickup-meta b {
  min-width: 0;
  color: var(--ink);
  font-size: .9rem;
  overflow-wrap: anywhere;
}

.pos-omnichannel-pickup-lines {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
}

.loyalty-wallet-admin {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.loyalty-wallet-admin[hidden] {
  display: none;
}

.loyalty-wallet-grid,
.loyalty-wallet-admin-lists {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.loyalty-wallet-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.loyalty-wallet-card h4 {
  margin: 0;
  font-size: .96rem;
}

.loyalty-wallet-card label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.loyalty-wallet-card input {
  min-width: 0;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
}

.wallet-admin-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
  border-top: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  padding-top: 8px;
}

.wallet-admin-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.wallet-admin-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.wallet-admin-row strong,
.wallet-admin-row em,
.wallet-admin-row b {
  min-width: 0;
  overflow-wrap: anywhere;
}

.wallet-admin-row em {
  color: var(--muted);
  font-style: normal;
  font-size: .82rem;
}

.wallet-admin-row b {
  justify-self: end;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 8px;
  background: color-mix(in srgb, var(--brand) 6%, #fff);
  font-size: .78rem;
}

.select-box.compact {
  gap: 4px;
}

.select-box.compact select {
  min-height: 42px;
}

.pane-heading h2,
.section-heading h2,
.rail-group h2 {
  margin: 0;
  font-size: 1.08rem;
}

.pane-heading p,
.section-heading p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: .92rem;
}

.pane-heading button:not(.cart-icon-button) {
  min-width: 146px;
  padding: 0 12px;
  color: var(--brand-dark);
  font-weight: 760;
  white-space: nowrap;
}

.quick-products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-height: 0;
  overflow-y: auto;
  padding: 2px 2px 10px;
}

.product-tile {
  position: relative;
  display: grid;
  grid-template-rows: 1fr;
  min-height: 148px;
  padding: 0;
  text-align: center;
  background: var(--panel);
  box-shadow: 0 3px 8px rgba(39, 54, 54, .13);
  overflow: hidden;
}

.product-tile-unavailable,
.product-tile-action:disabled {
  border-color: #d7dfdf;
  background: #f1f4f3;
  color: var(--muted);
  box-shadow: none;
  cursor: not-allowed;
  opacity: .72;
}

.product-tile-unavailable .product-icon,
.product-tile-action:disabled .product-icon {
  background: #e2e8e7;
  color: #8a9696;
  filter: grayscale(1);
}

.product-tile-unavailable span,
.product-tile-action:disabled span {
  color: var(--muted);
}

.product-tile-action {
  display: grid;
  grid-template-rows: 48px minmax(42px, auto) auto;
  gap: 7px;
  min-width: 0;
  min-height: 148px;
  width: 100%;
  padding: 12px 9px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: center;
  font: inherit;
}

.product-tile-action:hover,
.product-tile-action:focus-visible {
  background: color-mix(in srgb, var(--brand) 7%, transparent);
}

.product-info-button {
  position: absolute;
  z-index: 1;
  top: 8px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel) 88%, white);
  color: var(--brand-dark);
  box-shadow: 0 2px 8px rgba(39, 54, 54, .12);
}

.product-info-button svg {
  width: 18px;
  height: 18px;
}

.product-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0 auto;
  border-radius: 8px;
  background: #eef6f3;
  color: var(--brand-dark);
  overflow: hidden;
}

.product-icon svg {
  width: 30px;
  height: 30px;
}

.product-icon.icon-red {
  background: #f2e7ea;
  color: #6e2636;
}

.product-icon.icon-white {
  background: #f8f3df;
  color: #9a7a27;
}

.product-icon.icon-rose {
  background: #f9e6e8;
  color: #b85c69;
}

.product-icon.icon-bubbles,
.product-icon.icon-sweet {
  background: #f5efd9;
  color: #b08b3d;
}

.product-icon.icon-orange {
  background: #f5eadf;
  color: #a46335;
}

.product-icon.icon-glass {
  background: #eef6f8;
  color: #4f7f86;
}

.product-icon.icon-bottle {
  background: #edf2ef;
  color: #496c5a;
}

.product-icon.icon-snack {
  background: #f3eee5;
  color: #8a6a43;
}

.product-icon.icon-tea {
  background: #eef5ed;
  color: #5c7b45;
}

.product-icon.icon-service,
.product-icon.icon-variable {
  background: #eef2f4;
  color: var(--steel);
}

.product-icon.with-image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  border-radius: 8px;
  object-fit: contain;
  object-position: center;
}

.payment-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(31, 37, 40, .36);
}

.payment-modal[hidden] {
  display: none;
}

.payment-dialog {
  display: grid;
  gap: 14px;
  width: min(780px, 100%);
  max-height: calc(100dvh - 36px);
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(31, 37, 40, .24);
}

.pos-discount-dialog {
  width: min(920px, 100%);
}

.pos-discount-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: 16px;
  align-items: start;
}

.pos-discount-choice-panel,
.pos-discount-manual-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #f7fbfa;
}

.pos-discount-rule-list {
  display: grid;
  gap: 10px;
}

.pos-discount-rule-button {
  width: 100%;
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  padding: 14px;
  text-align: left;
  cursor: pointer;
}

.pos-discount-rule-button:hover,
.pos-discount-rule-button:focus-visible {
  border-color: var(--brand, #168a7a);
  box-shadow: 0 0 0 3px rgba(22, 138, 122, .12);
}

.pos-discount-rule-button span {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.pos-discount-rule-button strong,
.pos-discount-rule-button small {
  overflow-wrap: anywhere;
}

.pos-discount-rule-button small {
  color: var(--muted);
  line-height: 1.35;
}

.pos-discount-rule-button em {
  flex: 0 0 auto;
  font-style: normal;
  font-weight: 800;
  color: var(--brand, #168a7a);
}

.pos-discount-empty {
  border-radius: 8px;
  background: #eef5f3;
  color: var(--muted);
  padding: 14px;
  line-height: 1.45;
}

.pos-discount-manual-panel textarea {
  min-height: 88px;
  resize: vertical;
}

.pos-discount-manual-panel .admin-table-header,
.pos-discount-choice-panel .admin-table-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  align-items: start;
  margin-bottom: 12px;
}

.pos-discount-manual-panel .management-form.compact {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.pos-discount-manual-panel .management-form.compact label,
.pos-discount-manual-panel .management-form.compact button {
  grid-column: 1 / -1;
}

.pos-discount-manual-panel .management-form.compact select,
.pos-discount-manual-panel .management-form.compact input,
.pos-discount-manual-panel .management-form.compact textarea {
  width: 100%;
  min-height: 48px;
}

.pos-discount-manual-panel .management-form.compact textarea {
  min-height: 96px;
}

.pos-discount-manual-panel .management-form.compact button {
  min-height: 48px;
  width: 100%;
  white-space: normal;
  line-height: 1.2;
}

.shop-modal {
  position: fixed;
  inset: 0;
  z-index: 82;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(31, 37, 40, .34);
}

.shop-modal[hidden],
.shop-modal-panel[hidden] {
  display: none;
}

.shop-dialog {
  display: grid;
  gap: 14px;
  width: min(860px, 100%);
  max-height: calc(100dvh - 36px);
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(31, 37, 40, .24);
}

.shop-modal-panel {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.shop-linked-registers {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--soft-line);
}

.shop-linked-registers h4 {
  margin: 0;
  font-size: .95rem;
}

.payment-method-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 8px;
}

.payment-method {
  min-height: 64px;
  font-weight: 820;
}

.payment-method.active {
  border-color: var(--brand);
  background: var(--tile-tint);
  color: var(--brand-dark);
}

.payment-method:disabled,
.payment-method-panel .management-action:disabled,
.payment-method-panel input:disabled,
.payment-method-panel select:disabled {
  opacity: .58;
  cursor: not-allowed;
}

.payment-method-panel {
  display: grid;
  gap: 12px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.payment-method-panel[hidden] {
  display: none;
}

.payment-field-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  min-width: 0;
}

.payment-field-row-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.payment-field-row .select-box {
  min-width: 0;
}

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

.payment-summary-grid div {
  display: grid;
  gap: 4px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f7fbfa;
}

.payment-summary-grid span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 780;
  text-transform: uppercase;
}

.payment-summary-grid strong {
  font-size: 1.15rem;
}

.payment-lines-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.payment-lines {
  display: grid;
  gap: 8px;
}

.payment-discounts {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
  color: var(--muted);
}

.payment-line-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  background: #f8fbfa;
}

.payment-discount-row {
  border-color: rgba(32, 143, 134, .26);
  background: #eef8f5;
}

.payment-discount-row span {
  color: var(--brand-strong);
  font-weight: 800;
}

.payment-line-row strong,
.payment-line-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.final-payment-action:disabled {
  opacity: .48;
  cursor: not-allowed;
}

.receipt-delivery {
  display: grid;
  grid-template-columns: minmax(112px, .42fr) minmax(360px, 1fr);
  gap: 10px;
  align-items: start;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: #f7fbfa;
}

.receipt-delivery h3 {
  margin: 0;
}

.receipt-delivery-heading {
  min-height: 44px;
  display: flex;
  align-items: center;
}

.receipt-delivery-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.receipt-delivery-options label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 8px;
  background: #fff;
  font-weight: 760;
  text-align: center;
  white-space: normal;
  line-height: 1.1;
}

.receipt-delivery-options label:has(input:checked) {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 8%, #fff);
  color: var(--brand-strong);
}

.receipt-choice-none:has(input:checked) {
  border-color: #1f2933;
  background: #f0f2f2;
  color: #1f2933;
}

.receipt-email-field {
  grid-column: 2;
  margin-top: 0;
}

.receipt-email-field input:disabled {
  background: #eef3f2;
  color: var(--muted);
  cursor: not-allowed;
}

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

.cash-tender-row,
.cash-settlement-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.45fr);
  gap: 8px;
  align-items: end;
  min-width: 0;
}

.cash-tender-input,
.cash-suggestions,
.cash-settlement-row .management-action,
.change-due {
  min-width: 0;
}

.cash-tender-row .cash-suggestions {
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
}

.cash-suggestion-button {
  border-color: rgba(28, 141, 132, .24);
  background: color-mix(in srgb, var(--brand-tint) 58%, #fff);
  color: var(--brand-strong);
}

.cash-suggestion-button:hover,
.cash-suggestion-button:focus-visible {
  border-color: rgba(28, 141, 132, .5);
  background: color-mix(in srgb, var(--brand-tint) 74%, #fff);
}

.change-due {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
  font-size: 1.15rem;
  font-weight: 850;
}

.product-tile strong,
.cart-line strong,
.receipt-line strong,
.finance-item strong,
.inventory-item strong {
  overflow-wrap: anywhere;
}

.product-tile strong {
  align-self: end;
  font-size: .95rem;
  line-height: 1.12;
}

.product-tile span {
  color: var(--ink);
  font-size: .9rem;
  font-weight: 800;
}

.cart-lines,
.receipt-lines,
.finance-list,
.inventory-list,
.product-list,
.vat-list,
.roles {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin-top: 16px;
}

.cart-lines {
  align-content: start;
  margin-top: 0;
  min-height: 76px;
  max-height: clamp(180px, 32vh, 320px);
  overflow-y: auto;
  border-bottom: 1px solid var(--line);
  padding-bottom: 6px;
  scrollbar-gutter: stable;
}

.linked-cart-line {
  margin-left: 22px;
  border-left: 3px solid var(--line-strong, #cbd8d4);
}

.linked-cart-line-badge {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  margin-top: 4px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #eef4f2;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 800;
  line-height: 1.4;
}

.parked-cart-list {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: #fbfdfc;
}

.parked-cart-list[hidden] {
  display: none;
}

.parked-cart-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  border-bottom: 1px solid var(--soft-line);
  padding-bottom: 8px;
}

.parked-cart-item strong,
.parked-cart-item span {
  display: block;
  overflow-wrap: anywhere;
}

.parked-cart-item span {
  color: var(--muted);
  font-size: .86rem;
}

.cart-line {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) minmax(92px, auto) 32px;
  gap: 8px;
  align-items: center;
  min-height: 72px;
  border-bottom: 1px solid var(--soft-line);
  padding: 4px 2px;
}

.quantity-control {
  display: grid;
  grid-template-columns: 38px 40px 38px;
  gap: 7px;
  align-items: center;
}

.quantity-control button {
  width: 38px;
  min-height: 38px;
  border: 0;
  background: #dce8e8;
  font-size: 1.3rem;
  font-weight: 760;
}

.quantity-control span {
  text-align: center;
  font-size: 1.18rem;
  font-weight: 760;
}

.line-detail {
  min-width: 0;
}

.line-detail strong {
  display: -webkit-box;
  overflow: hidden;
  line-height: 1.15;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.line-detail span,
.receipt-line span,
.finance-item span,
.inventory-item span {
  display: block;
  color: var(--muted);
  font-size: .9rem;
}

.line-detail span {
  overflow: hidden;
  max-width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.line-transportation-select {
  display: grid;
  grid-template-columns: auto minmax(96px, 1fr);
  gap: 6px;
  align-items: center;
  max-width: 260px;
  margin-top: 6px;
}

.line-transportation-select span {
  font-size: .72rem;
  font-weight: 760;
  text-transform: uppercase;
}

.line-transportation-select select {
  min-width: 0;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 6px;
  background: #fff;
}

.line-price {
  font-weight: 760;
  white-space: nowrap;
  justify-self: end;
}

.cart-message {
  min-height: 44px;
  border: 1px solid rgba(181, 140, 89, .45);
  border-radius: 8px;
  padding: 10px 12px;
  background: rgba(216, 200, 170, .22);
  color: var(--ink);
}

.cart-status {
  min-height: 44px;
  margin: 10px 0 0;
  border: 1px solid rgba(181, 140, 89, .45);
  border-radius: 8px;
  padding: 10px 12px;
  background: rgba(216, 200, 170, .22);
  color: var(--ink);
  font-size: .92rem;
  line-height: 1.3;
}

.cart-status[hidden] {
  display: none;
}

.cart-status-action {
  margin-left: 10px;
  border: 1px solid rgba(181, 140, 89, .55);
  border-radius: 6px;
  padding: 5px 9px;
  background: rgba(255, 255, 255, .72);
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.cart-status-action:hover {
  background: rgba(255, 255, 255, .92);
}

.checkout-readiness-card,
.payment-readiness-card {
  display: grid;
  gap: 5px;
  border: 1px solid color-mix(in srgb, var(--line) 72%, var(--brand));
  border-radius: 8px;
  padding: 6px 10px;
  background: color-mix(in srgb, var(--brand) 7%, #fff);
  color: var(--ink);
  overflow-wrap: anywhere;
}

.checkout-readiness-card[hidden],
.payment-readiness-card[hidden] {
  display: none;
}

.checkout-readiness-card.ready,
.payment-readiness-card.ready {
  border-color: color-mix(in srgb, #2f7d55 38%, var(--line));
  background: color-mix(in srgb, #2f7d55 9%, #fff);
}

.checkout-readiness-card.attention,
.payment-readiness-card.attention {
  border-color: rgba(181, 140, 89, .48);
  background: rgba(216, 200, 170, .2);
}

.checkout-readiness-card.blocked,
.payment-readiness-card.blocked {
  border-color: color-mix(in srgb, var(--brand) 48%, var(--line));
  background: color-mix(in srgb, var(--brand) 9%, #fff);
}

.checkout-readiness-main {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}

.checkout-readiness-main strong {
  min-width: 0;
  font-size: .92rem;
  line-height: 1.25;
}

.checkout-readiness-pill {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(255, 255, 255, .72);
  color: var(--brand-dark);
  font-size: .72rem;
  font-weight: 860;
  text-transform: uppercase;
}

.checkout-readiness-card.ready .checkout-readiness-pill,
.payment-readiness-card.ready .checkout-readiness-pill {
  color: #226443;
}

.checkout-readiness-card ul,
.payment-readiness-card ul {
  display: grid;
  gap: 3px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: .84rem;
  line-height: 1.22;
}

.checkout-readiness-card:not(.ready):not(.attention):not(.blocked) ul,
.payment-readiness-card:not(.ready):not(.attention):not(.blocked) ul {
  display: none;
}

.readiness-guidance-item {
  min-width: 0;
}

.readiness-guidance-item strong,
.readiness-guidance-item span,
.readiness-guidance-item em {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.readiness-guidance-item strong {
  color: var(--ink);
  font-size: .86rem;
}

.readiness-guidance-item em {
  margin-top: 2px;
  color: var(--brand-dark);
  font-style: normal;
  font-weight: 760;
}

.checkout-readiness-card ul:empty,
.payment-readiness-card ul:empty {
  display: none;
}

.remove-line {
  width: 32px;
  min-height: 40px;
  border: 0;
  background: transparent;
  color: var(--steel);
  font-size: 1.18rem;
}

.totals {
  display: grid;
  gap: 5px;
  margin: 0;
}

.totals div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

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

.totals dd {
  margin: 0;
  font-weight: 760;
  white-space: nowrap;
}

.totals .discount dt,
.totals .discount dd {
  color: var(--brand-dark);
}

.cart-discount-total-row dd {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.cart-discount-total-row dt {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
  overflow-wrap: anywhere;
}

.cart-discount-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  min-width: 26px;
  min-height: 26px;
  border: 1px solid color-mix(in srgb, var(--brand-dark) 30%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 8%, #fff);
  color: var(--brand-dark);
  font: inherit;
  font-size: .96rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.cart-discount-remove:hover,
.cart-discount-remove:focus-visible {
  background: color-mix(in srgb, var(--brand) 16%, #fff);
  outline: 2px solid color-mix(in srgb, var(--brand) 32%, transparent);
  outline-offset: 2px;
}

.totals .grand {
  color: var(--ink);
  font-size: 1.18rem;
  font-weight: 860;
}

.financial-source {
  margin: -2px 0 0;
  color: #2f7d55;
  font-size: .76rem;
  font-weight: 760;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.financial-source:empty {
  display: none;
}

.financial-source.fallback {
  color: var(--muted);
}

.checkout-panel {
  z-index: 5;
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
  background: var(--panel);
}

.payment-stack {
  align-items: stretch;
}

.checkout-button {
  flex: 1 1 0;
  min-height: 70px;
  border: 0;
  color: white;
  font-size: 1.08rem;
  font-weight: 850;
}

.checkout-button.cash,
.rail-action.cash {
  background: var(--brand);
}

.checkout-button.card,
.rail-action.pin {
  background: var(--steel);
}

.ghost-button {
  background: var(--surface);
}

.overview-card,
.rail-action {
  width: 100%;
  min-width: 0;
  min-height: 82px;
  padding: 12px;
  color: white;
  white-space: normal;
  overflow-wrap: anywhere;
}

.overview-card {
  display: grid;
  gap: 4px;
  align-content: center;
  background: var(--brand-dark);
  text-align: left;
}

.overview-card span {
  font-size: .88rem;
}

.rail-group {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.rail-group .section-heading {
  align-items: center;
}

.mini-action {
  min-height: 36px;
  padding: 0 10px;
  color: var(--brand-dark);
  font-size: .84rem;
  font-weight: 760;
}

.finance-kpis,
.recent-sales-list,
.cash-session-result,
.cash-payment-list,
.module-list {
  display: grid;
  gap: 8px;
}

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

.finance-kpi,
.recent-sale,
.cash-payment-row,
.cash-session-result {
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 9px 10px;
  background: rgba(255, 255, 255, .76);
}

.finance-kpi,
.recent-sale,
.cash-payment-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.cash-payment-section {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.cash-payment-section h4 {
  margin: 0;
  font-size: 1rem;
}

.cash-payment-info {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.cash-payment-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.finance-kpi span,
.recent-sale span,
.cash-payment-row span,
.cash-session-result {
  color: var(--muted);
  font-size: .84rem;
}

.finance-kpi strong,
.recent-sale strong,
.cash-payment-row strong {
  overflow-wrap: anywhere;
  font-size: .92rem;
}

.close-cash {
  min-height: 56px;
}

.management-action {
  width: 100%;
  min-width: 0;
  min-height: 56px;
  border: 0;
  padding: 0 12px;
  background: var(--steel);
  color: white;
  font-weight: 800;
  white-space: normal;
  overflow-wrap: anywhere;
}

.management-action.primary {
  background: var(--brand);
}

.management-action.subtle {
  border: 1px solid rgba(32, 143, 134, .36);
  background: #eef7f5;
  color: var(--accent-dark);
}

.management-action.danger {
  background: var(--danger);
}

.compact-action {
  width: min(320px, 100%);
  min-height: 52px;
}

.admin-modal[hidden],
.session-lock[hidden] {
  display: none;
}

.admin-modal,
.session-lock {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 28px);
  background: rgba(12, 20, 20, .34);
}

.admin-modal-dialog,
.session-lock-card {
  width: min(720px, 100%);
  max-height: calc(100vh - 32px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  box-shadow: 0 24px 70px rgba(15, 27, 26, .26);
  padding: clamp(16px, 2vw, 24px);
}

.tap-config-dialog {
  width: min(1120px, 100%);
}

.device-binding-dialog {
  width: min(760px, 100%);
}

.device-binding-context {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.device-binding-context span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.device-binding-context strong {
  overflow-wrap: anywhere;
}

.integration-modal-dialog {
  width: min(980px, 100%);
}

.integration-modal-dialog:has(.product-import-modal-body) {
  width: min(1180px, 100%);
}

.inventory-mutation-dialog {
  width: min(860px, 100%);
}

.inventory-mutation-context {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(3, minmax(96px, max-content));
  gap: 10px;
  align-items: center;
  margin: 12px 0 16px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: #f7fbfa;
}

.inventory-mutation-context strong,
.inventory-mutation-context span {
  min-width: 0;
}

.inventory-mutation-body {
  display: grid;
  gap: 14px;
}

.inventory-mutation-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.inventory-mutation-form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.inventory-mutation-form input,
.inventory-mutation-form select,
.inventory-mutation-form textarea {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  text-transform: none;
}

.inventory-mutation-form .form-span-2 {
  grid-column: 1 / -1;
}

.inventory-mutation-actions,
.stock-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

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

.inventory-history-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(96px, max-content);
  gap: 10px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
}

.inventory-ops-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0;
}

.inventory-ops-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.inventory-ops-panel h3 {
  margin: 0;
  font-size: 1rem;
}

.inventory-ops-panel p {
  margin: 4px 0 0;
  color: var(--muted);
}

.inventory-ops-list {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.inventory-ops-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 10px;
  align-items: center;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f8fbfa;
  color: var(--text);
  font: inherit;
  text-align: left;
}

button.inventory-ops-row {
  cursor: pointer;
}

button.inventory-ops-row:hover,
button.inventory-ops-row:focus-visible {
  border-color: var(--accent);
  outline: none;
}

.inventory-ops-row span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.inventory-ops-row strong,
.inventory-ops-row em {
  min-width: 0;
  overflow-wrap: anywhere;
}

.inventory-ops-row em {
  color: var(--muted);
  font-style: normal;
  font-size: .88rem;
}

.inventory-ops-empty {
  border: 1px dashed var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  color: var(--muted);
  background: #f8fbfa;
}

.integration-modal-body {
  display: grid;
  gap: 14px;
}

.integration-modal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 12px;
  align-items: start;
}

.integration-modal-result {
  display: grid;
  align-content: start;
  gap: 10px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: rgba(255, 255, 255, .78);
}

.integration-modal-result strong {
  color: var(--ink);
}

.integration-modal-result span,
.integration-modal-result li {
  color: var(--muted);
  line-height: 1.35;
}

.integration-modal-result ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 18px;
}

.checkbox-line {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 48px;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.checkbox-line input {
  width: 24px;
  height: 24px;
  justify-self: center;
}

.checkbox-line span {
  min-width: 0;
}

.integration-modal-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.integration-modal-summary {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--tile-tint);
}

.webshop-provider-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.webshop-provider-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  min-height: 132px;
  border: 1px solid color-mix(in srgb, var(--brand) 38%, var(--line));
  border-radius: 8px;
  padding: 12px;
  background: var(--tile-tint);
  text-align: left;
  color: var(--text);
}

.webshop-provider-card strong,
.webshop-provider-card span,
.webshop-provider-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.webshop-provider-card strong {
  font-size: .98rem;
}

.webshop-provider-card span {
  width: fit-content;
  border-radius: 999px;
  padding: 3px 8px;
  background: #fff;
  color: var(--brand-dark);
  font-size: .78rem;
  font-weight: 850;
}

.webshop-provider-card small {
  color: var(--muted);
  line-height: 1.35;
}

.webshop-provider-card.disabled {
  border-color: var(--soft-line);
  background: #f7f8f8;
  color: var(--muted);
  cursor: not-allowed;
  opacity: .86;
}

.webshop-provider-card.disabled span {
  color: var(--muted);
}

.product-import-modal-body {
  gap: 12px;
}

.product-import-wizard {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.product-import-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.product-import-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 10px;
  align-items: start;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .82);
  padding: 10px;
}

.product-import-step.active {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.product-import-step-number {
  grid-row: span 2;
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(28, 141, 132, .12);
  color: var(--brand-dark, var(--brand));
  font-weight: 900;
}

.product-import-step strong {
  color: var(--ink);
}

.product-import-step span:last-child {
  color: var(--muted);
  line-height: 1.35;
}

.product-import-input-panel,
.product-import-panel {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .86);
  padding: 10px;
}

.product-import-panel-heading {
  display: grid;
  gap: 3px;
}

.product-import-panel-heading strong,
.product-import-panel strong {
  color: var(--ink);
}

.product-import-panel-heading span,
.product-import-panel-meta,
.product-import-empty {
  color: var(--muted);
  line-height: 1.35;
}

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

.product-import-guidance-card {
  display: grid;
  gap: 4px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: var(--surface);
  padding: 10px;
}

.product-import-guidance-card strong {
  color: var(--ink);
}

.product-import-guidance-card span {
  color: var(--muted);
  line-height: 1.35;
}

.product-import-input-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.product-import-file-field,
.product-import-payload-field {
  grid-column: 1 / -1;
}

.product-import-payload-field textarea {
  min-height: 96px;
  max-height: 126px;
  resize: vertical;
}

.product-import-wizard.has-preview .product-import-file-field,
.product-import-wizard.has-preview .product-import-payload-field {
  display: none;
}

.product-import-wizard.has-preview .product-import-step.active {
  border-color: var(--soft-line);
  background: rgba(255, 255, 255, .82);
}

.product-import-wizard.has-preview .product-import-step:nth-child(2) {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.product-import-file-field input::file-selector-button {
  min-height: 40px;
  margin-right: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 800;
  padding: 0 14px;
}

.product-import-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.product-import-actions .management-action {
  min-height: 46px;
}

.product-import-preview-area {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.product-import-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.product-import-metric {
  display: grid;
  gap: 3px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .88);
  padding: 10px;
}

.product-import-metric span {
  color: var(--muted);
  font-size: .9rem;
  font-weight: 800;
  text-transform: uppercase;
}

.product-import-metric strong {
  color: var(--ink);
  font-size: clamp(1rem, 1.2vw, 1.25rem);
}

.product-import-metric.success strong {
  color: var(--brand-dark, var(--brand));
}

.product-import-metric.warning strong {
  color: #8a5d13;
}

.product-import-preview-grid,
.product-import-review-grid {
  display: grid;
  grid-template-columns: minmax(180px, .8fr) minmax(0, 1.7fr) minmax(220px, 1fr);
  gap: 12px;
  min-width: 0;
}

.product-import-review-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(280px, 1.1fr);
}

.product-import-list {
  max-height: 170px;
  overflow: auto;
  margin: 0;
  padding-left: 20px;
}

.product-import-list li {
  color: var(--muted);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.product-import-update-guard {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid rgba(180, 83, 9, .25);
  border-radius: 8px;
  background: rgba(255, 251, 235, .72);
  color: var(--ink);
  font-weight: 800;
  padding: 10px 12px;
}

.product-import-update-guard[hidden] {
  display: none;
}

.product-import-update-guard input {
  flex: 0 0 auto;
  margin-top: 2px;
}

.product-import-update-guard span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.product-import-issues-panel {
  min-width: 0;
}

.product-import-issue-list {
  display: grid;
  gap: 8px;
  max-height: 210px;
  overflow: auto;
}

.product-import-issue {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px 10px;
  min-width: 0;
  border: 1px solid var(--line);
  border-left-width: 4px;
  border-radius: 8px;
  background: var(--surface);
  padding: 10px;
}

.product-import-issue.error {
  border-left-color: var(--danger);
}

.product-import-issue.warning {
  border-left-color: var(--warning);
}

.product-import-issue.info {
  border-left-color: var(--accent);
}

.product-import-issue-severity {
  width: fit-content;
  border-radius: 999px;
  background: var(--tile-tint);
  color: var(--ink);
  font-size: .75rem;
  font-weight: 900;
  padding: 3px 8px;
}

.product-import-issue-location {
  min-width: 0;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.product-import-issue p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--ink);
  line-height: 1.42;
  overflow-wrap: anywhere;
}

.product-import-profile-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  border: 1px solid rgba(28, 141, 132, .25);
  border-radius: 8px;
  background: var(--tile-tint);
  padding: 12px;
}

.product-import-profile-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.product-import-eyebrow {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.product-import-profile-copy strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.product-import-profile-copy span,
.product-import-profile-copy small {
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.product-import-profile-badge {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 8px 10px;
  font-size: .82rem;
  font-weight: 900;
  white-space: nowrap;
}

.product-import-profile-badge.active {
  background: rgba(20, 133, 94, .12);
  color: #126c4e;
}

.product-import-profile-badge.fallback {
  background: rgba(176, 117, 25, .14);
  color: #80550f;
}

.product-import-field-groups-panel {
  gap: 10px;
  max-height: 360px;
  overflow: auto;
}

.product-import-target-group {
  display: grid;
  gap: 8px;
  min-width: 0;
  border-top: 1px solid var(--soft-line);
  padding-top: 10px;
}

.product-import-target-group:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.product-import-target-group-header {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.product-import-target-group-header strong {
  color: var(--ink);
}

.product-import-target-group-header span {
  color: var(--muted);
  line-height: 1.35;
}

.product-import-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.product-import-field-card {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .74);
  padding: 10px;
}

.product-import-field-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.product-import-field-heading strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.product-import-required {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 4px 7px;
  font-size: .72rem;
  font-weight: 900;
}

.product-import-required.required {
  background: rgba(28, 141, 132, .13);
  color: var(--brand-dark, var(--brand));
}

.product-import-required.optional {
  background: rgba(98, 112, 120, .1);
  color: var(--muted);
}

.product-import-field-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.product-import-field-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

.product-import-field-meta span {
  min-width: 0;
  max-width: 100%;
  border-radius: 999px;
  background: rgba(235, 242, 241, .9);
  color: var(--muted);
  font-size: .75rem;
  font-weight: 800;
  padding: 4px 7px;
  overflow-wrap: anywhere;
}

.product-import-field-example {
  color: var(--ink);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.product-import-json-panel .code-preview {
  max-height: 178px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

@media (max-width: 1040px) {
  .integration-modal-dialog {
    width: min(1100px, 100%);
  }

  .product-import-step {
    padding: 10px;
  }

  .product-import-preview-grid,
  .product-import-review-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-import-field-groups-panel {
    grid-column: 1 / -1;
  }

  .product-import-json-panel {
    grid-column: 1 / -1;
  }
}

@media (max-width: 820px) {
  .product-import-steps,
  .product-import-source-guidance,
  .product-import-input-grid,
  .product-import-actions,
  .product-import-summary,
  .product-import-preview-grid,
  .product-import-review-grid {
    grid-template-columns: 1fr;
  }

  .product-import-json-panel {
    grid-column: auto;
  }

  .product-import-profile-context {
    align-items: stretch;
    flex-direction: column;
  }

  .product-import-profile-badge {
    width: fit-content;
  }

  .product-import-field-grid {
    grid-template-columns: 1fr;
  }

  .product-import-issue {
    grid-template-columns: 1fr;
  }
}

.admin-assistant-fab {
  position: fixed;
  right: clamp(14px, 2vw, 24px);
  bottom: clamp(14px, 2vw, 24px);
  z-index: 95;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--brand-dark, var(--brand));
  color: #fff;
  box-shadow: 0 18px 48px rgba(15, 27, 26, .22);
  font-weight: 900;
  padding: 0 18px;
}

body.realtime-call-open .admin-assistant-fab {
  z-index: 60;
  opacity: .42;
  transform: translateY(10px);
  pointer-events: none;
}

body.realtime-call-open .admin-assistant-drawer {
  z-index: 58;
}

.admin-assistant-fab[hidden] {
  display: none;
}

body.product-drawer-open .admin-assistant-fab {
  display: none;
}

.admin-assistant-drawer[hidden] {
  display: none;
}

.admin-assistant-drawer {
  position: fixed;
  right: clamp(12px, 2vw, 24px);
  bottom: clamp(78px, 8vw, 92px);
  z-index: 96;
  width: min(500px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
}

.admin-assistant-card {
  display: grid;
  gap: 14px;
  max-height: min(760px, calc(100dvh - 104px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 0 24px 70px rgba(15, 27, 26, .24);
  padding: clamp(14px, 2vw, 20px);
}

.admin-assistant-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}

.admin-assistant-title-block {
  min-width: 0;
}

.admin-assistant-title-block h3,
.admin-assistant-title-block p {
  margin: 0;
  overflow-wrap: anywhere;
}

.admin-assistant-title-block p {
  margin-top: 4px;
  line-height: 1.35;
}

.admin-assistant-header .mini-action {
  min-width: 0;
  min-height: 44px;
  max-width: 132px;
  padding-inline: 12px;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.1;
}

.admin-assistant-form {
  display: grid;
  gap: 10px;
}

.admin-assistant-context {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 6%, #fff);
  padding: 10px 12px;
}

.admin-assistant-context span,
.admin-assistant-context small {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.admin-assistant-context strong {
  color: var(--ink);
  font-size: .98rem;
  overflow-wrap: anywhere;
}

.admin-assistant-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.admin-assistant-suggestions[hidden] {
  display: none;
}

.admin-assistant-suggestions > span {
  flex-basis: 100%;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.admin-assistant-suggestions button {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.15;
  padding: 8px 10px;
  text-align: left;
  overflow-wrap: anywhere;
}

.admin-assistant-suggestions button:hover,
.admin-assistant-suggestions button:focus-visible {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 7%, #fff);
}

.admin-assistant-form .select-box {
  min-width: 0;
}

.admin-assistant-form textarea {
  width: 100%;
  min-width: 0;
  min-height: 92px;
  resize: vertical;
  border-radius: 8px;
  line-height: 1.35;
}

.admin-assistant-form .management-action {
  min-height: 56px;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.15;
}

.admin-assistant-answer,
.admin-assistant-prefill,
.admin-assistant-feature {
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 10px;
  background: var(--surface);
  padding: 12px;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.admin-assistant-answer p {
  margin: 8px 0;
}

.assistant-answer-heading {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.assistant-answer-heading strong {
  font-size: 1rem;
  line-height: 1.2;
}

.assistant-answer-heading span {
  color: var(--muted);
  font-size: .84rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.admin-assistant-answer ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

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

.admin-assistant-actions .mini-action {
  min-height: 48px;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.12;
  padding-inline: 12px;
}

.admin-assistant-actions[hidden],
.admin-assistant-prefill[hidden],
.admin-assistant-feature[hidden] {
  display: none;
}

.assistant-sources {
  margin-top: 10px;
  color: var(--muted);
  font-size: .82rem;
}

.assistant-sources summary {
  cursor: pointer;
  font-weight: 900;
}

.assistant-sources ul {
  margin-top: 6px;
}

.assistant-sources li {
  overflow-wrap: anywhere;
}

.assistant-prefill-row {
  display: grid;
  gap: 2px;
  border-top: 1px solid var(--soft-line);
  padding: 10px 0;
}

.assistant-governance-heading {
  margin-top: 18px;
}

.assistant-governance-shell {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.assistant-governance-readiness {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 14px;
}

.assistant-governance-readiness.ready {
  border-color: #b9e8cc;
  background: #f4fbf7;
}

.assistant-governance-readiness.blocked {
  border-color: #f0c3c3;
  background: #fff8f8;
}

.assistant-governance-readiness > div {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.assistant-governance-readiness strong,
.assistant-governance-readiness small,
.assistant-governance-policy span {
  overflow-wrap: anywhere;
}

.assistant-governance-readiness strong {
  color: var(--ink);
  font-size: 1.04rem;
}

.assistant-governance-readiness small {
  color: var(--muted);
  font-weight: 720;
}

.assistant-governance-policy {
  justify-items: end;
}

.assistant-governance-policy span {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  border-radius: 999px;
  background: var(--tile-tint);
  color: var(--brand-dark);
  font-size: .8rem;
  font-weight: 820;
  padding: 5px 9px;
}

.assistant-governance-metrics,
.assistant-governance-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.assistant-governance-metric,
.assistant-governance-list {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}

.assistant-governance-metric {
  display: grid;
  gap: 5px;
}

.assistant-governance-metric span,
.assistant-governance-metric small,
.assistant-governance-list small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.assistant-governance-metric span,
.assistant-governance-list h4 {
  font-size: .82rem;
  font-weight: 860;
  text-transform: uppercase;
  letter-spacing: 0;
}

.assistant-governance-metric strong {
  color: var(--ink);
  font-size: 1.45rem;
  line-height: 1;
}

.assistant-governance-metric small,
.assistant-governance-list small {
  font-size: .84rem;
  line-height: 1.35;
}

.assistant-governance-list h4 {
  margin: 0 0 10px;
  color: var(--ink);
}

.assistant-governance-list ul {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.assistant-governance-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 8px;
  align-items: center;
  min-width: 0;
  border-top: 1px solid var(--soft-line);
  padding-top: 9px;
}

.assistant-governance-list li:first-child {
  border-top: 0;
  padding-top: 0;
}

.assistant-governance-list li strong {
  min-width: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.assistant-governance-list li small {
  grid-column: 1 / -1;
}

.assistant-governance-list .status-pill {
  min-height: 24px;
  padding: 3px 8px;
  font-size: .74rem;
}

.assistant-governance-empty {
  display: block;
  color: var(--muted);
  font-weight: 760;
}

.assistant-prefill-row:first-of-type {
  border-top: 0;
}

.assistant-prefill-row small {
  color: var(--muted);
}

.assistant-role-fieldset {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
}

.assistant-role-fieldset legend {
  color: var(--muted);
  font-size: .8rem;
  font-weight: 900;
  text-transform: uppercase;
  padding: 0 6px;
}

.assistant-role-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.assistant-role-option {
  width: auto;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
  padding: 8px 12px;
}

@media (max-width: 980px) {
  .assistant-governance-metrics,
  .assistant-governance-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .admin-assistant-drawer {
    left: 12px;
    right: 12px;
    width: auto;
  }

  .admin-assistant-header,
  .admin-assistant-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-assistant-header .mini-action {
    justify-self: start;
    max-width: 100%;
  }

  .assistant-governance-readiness,
  .assistant-governance-metrics,
  .assistant-governance-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .assistant-governance-policy {
    justify-items: start;
  }
}

.session-lock {
  z-index: 120;
  background: color-mix(in srgb, var(--surface) 80%, rgba(12, 20, 20, .55));
}

.session-lock-card {
  width: min(980px, 100%);
}

.session-lock-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .34fr);
  gap: 16px;
  align-items: start;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.session-lock-heading h2,
.session-lock-heading p,
.session-lock-heading strong,
.session-lock-heading span {
  overflow-wrap: anywhere;
}

.session-lock-status {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px;
  background: var(--tile-tint);
}

.session-lock-status strong,
.session-lock-status span {
  display: block;
}

.session-lock-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.session-lock-panel {
  min-width: 0;
  display: grid;
  gap: 12px;
  align-content: start;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: clamp(14px, 2vw, 18px);
  background: #fff;
}

.session-lock-panel.primary {
  border-color: var(--brand);
  box-shadow: inset 4px 0 0 var(--brand);
}

.session-lock-panel h3 {
  margin: 0;
}

.session-lock-panel p {
  margin: 4px 0 0;
  color: var(--muted);
}

.session-lock-panel input,
.session-lock-panel select {
  min-height: 56px;
  font-size: 1.05rem;
}

.session-lock-card [data-testid="session-lock-result"] {
  margin-top: 16px;
}

.device-modal-dialog {
  width: min(780px, 100%);
}

.product-delete-dialog {
  width: min(640px, 100%);
}

.product-bulk-delete-dialog {
  width: min(720px, 100%);
}

.product-bulk-delete-form {
  margin-top: 14px;
}

.product-bulk-delete-form textarea,
.product-bulk-delete-form input[type="text"],
.product-bulk-delete-form input:not([type]) {
  width: 100%;
}

.delete-confirm-summary {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--danger) 28%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, var(--danger) 8%, #fff);
}

.delete-confirm-summary strong,
.delete-confirm-summary span {
  overflow-wrap: anywhere;
}

.delete-confirm-summary span {
  color: var(--muted);
}

.delete-confirm-actions {
  display: grid;
  grid-template-columns: minmax(0, .42fr) minmax(0, .58fr);
  gap: 10px;
  margin-top: 16px;
}

.cash-close-row,
.onboarding-form {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(180px, .3fr);
  gap: 12px;
  align-items: end;
}

.onboarding-form,
.cash-count-form {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
}

.branding-form,
.branding-form-grid {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.branding-form-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.receipt-template-layout {
  display: grid;
  grid-template-columns: minmax(520px, .95fr) minmax(360px, .58fr);
  gap: 18px;
  min-width: 0;
  align-items: start;
}

.receipt-template-settings,
.receipt-template-preview-panel {
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--tile-tint) 36%, var(--panel));
}

.receipt-template-settings h4 {
  margin: 0;
  font-size: 1rem;
}

.receipt-template-controls {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.receipt-control-group {
  box-sizing: border-box;
  display: grid;
  gap: 14px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--surface) 74%, var(--panel));
}

.receipt-control-heading {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.receipt-control-heading strong {
  font-size: .96rem;
}

.receipt-control-heading span {
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

.receipt-text-grid,
.receipt-print-grid,
.receipt-visibility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.receipt-control-group label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.receipt-control-group label > span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.receipt-control-group input:not([type="checkbox"]),
.receipt-control-group select,
.receipt-control-group textarea {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: var(--panel);
  font: inherit;
}

.receipt-control-group textarea {
  resize: vertical;
}

.receipt-template-controls .checkbox-row,
.receipt-visibility-grid .checkbox-row {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--panel);
}

.receipt-template-controls .checkbox-row span,
.receipt-visibility-grid .checkbox-row span {
  color: var(--text);
  font-size: .9rem;
  font-weight: 800;
  text-transform: none;
}

.receipt-template-controls .checkbox-row input,
.receipt-visibility-grid .checkbox-row input {
  width: 18px;
  min-height: 18px;
  flex: 0 0 auto;
}

.receipt-template-preview-panel {
  position: sticky;
  top: 14px;
  align-self: start;
}

.receipt-ticket {
  box-sizing: border-box;
  display: grid;
  gap: 10px;
  width: min(100%, 360px);
  justify-self: center;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .08) 0 6px, transparent 6px 12px) border-box;
  box-shadow: 0 18px 46px rgba(17, 24, 39, .08);
  color: var(--ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

.receipt-ticket-header {
  display: grid;
  gap: 8px;
  justify-items: center;
  text-align: center;
  min-width: 0;
  border-bottom: 1px dashed var(--line);
  padding-bottom: 12px;
}

.receipt-ticket-logo {
  display: block;
  max-width: 150px;
  max-height: 56px;
  object-fit: contain;
}

.receipt-ticket-title {
  font-family: var(--font);
  font-size: 1rem;
  font-weight: 850;
}

.receipt-ticket-meta {
  color: var(--muted);
  font-size: .78rem;
  overflow-wrap: anywhere;
}

.receipt-ticket-section {
  display: grid;
  gap: 8px;
  border-bottom: 1px dashed var(--line);
  padding-bottom: 10px;
}

.receipt-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: baseline;
  min-width: 0;
}

.receipt-line strong,
.receipt-line span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.receipt-line span {
  white-space: nowrap;
}

.receipt-line.total {
  border-top: 1px solid var(--line);
  padding-top: 10px;
  font-family: var(--font);
  font-size: 1rem;
  font-weight: 850;
}

.receipt-ticket-footer {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-family: var(--font);
  font-size: .84rem;
  line-height: 1.35;
  text-align: center;
}

.receipt-ticket-qr {
  justify-self: center;
  width: 58px;
  height: 58px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(90deg, var(--ink) 12px, transparent 12px 22px, var(--ink) 22px 34px, transparent 34px),
    linear-gradient(var(--ink) 12px, transparent 12px 22px, var(--ink) 22px 34px, transparent 34px),
    #fff;
  opacity: .76;
}

.receipt-template-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel);
}

.receipt-template-card header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.receipt-template-card strong,
.receipt-template-card span,
.receipt-template-card li {
  min-width: 0;
  overflow-wrap: anywhere;
}

.receipt-template-card ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.receipt-template-card li {
  border-radius: 999px;
  padding: 5px 8px;
  background: var(--tile-tint);
  color: var(--muted);
  font-size: .82rem;
  font-weight: 750;
}

.branding-mobile-logo-fields {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--tile-tint) 42%, var(--panel));
}

.invoice-template-layout {
  display: grid;
  grid-template-columns: minmax(520px, .9fr) minmax(460px, .82fr);
  gap: 18px;
  min-width: 0;
  align-items: start;
}

.invoice-template-settings,
.invoice-a4-preview {
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: color-mix(in srgb, var(--tile-tint) 36%, var(--panel));
}

.invoice-template-settings h4 {
  margin: 0;
  font-size: 1rem;
}

.invoice-template-controls {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.invoice-control-group {
  box-sizing: border-box;
  display: grid;
  gap: 14px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--surface) 74%, var(--panel));
}

.invoice-control-group-heading {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.invoice-control-group-heading strong {
  font-size: .96rem;
}

.invoice-control-group-heading span {
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.35;
}

.invoice-control-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
  align-items: start;
}

.invoice-control-fields .invoice-text-field {
  grid-row: auto;
}

.invoice-logo-field {
  box-sizing: border-box;
  display: grid;
  grid-column: 1 / -1;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: color-mix(in srgb, var(--panel) 82%, var(--surface));
}

.invoice-logo-field-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.invoice-logo-field-heading > span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.invoice-logo-picker {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  width: fit-content;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: var(--panel);
  color: var(--brand);
  cursor: pointer;
  white-space: nowrap;
}

.invoice-logo-picker input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

.invoice-logo-picker input[type="file"] {
  width: 1px !important;
  min-width: 1px !important;
  max-width: 1px !important;
  min-height: 1px !important;
  border: 0 !important;
  padding: 0 !important;
}

.invoice-logo-picker strong {
  min-width: 0;
  font-size: .9rem;
  overflow-wrap: anywhere;
}

.invoice-logo-upload-preview {
  min-height: 60px;
  border-radius: 8px;
  background: #fff;
}

.invoice-style-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(92px, .42fr);
  gap: 10px;
  min-width: 0;
  align-items: end;
}

.invoice-margin-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(86px, 1fr));
  gap: 10px;
  min-width: 0;
}

.invoice-margin-grid label {
  min-width: 0;
}

.invoice-letterhead-upload-preview {
  min-height: 44px;
  align-content: center;
  overflow-wrap: anywhere;
}

.invoice-side-controls {
  display: grid;
  grid-template-columns: minmax(132px, 160px) minmax(240px, 1fr);
  gap: 10px;
  min-width: 0;
  align-items: end;
}

.invoice-control-fields > .invoice-style-row {
  align-self: end;
}

.invoice-color-field {
  width: 100%;
  max-width: 160px;
}

.invoice-color-field input[type="color"] {
  width: 100%;
  min-width: 92px;
  padding: 6px;
}

@media (max-width: 1280px) {
  .invoice-template-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .invoice-a4-preview {
    order: 2;
  }

  .invoice-template-settings {
    order: 1;
  }

  .invoice-control-fields {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  .invoice-side-controls,
  .invoice-margin-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.invoice-template-controls .checkbox-row,
.invoice-visibility-grid .checkbox-row {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: var(--panel);
}

.invoice-template-controls .checkbox-row input,
.invoice-visibility-grid .checkbox-row input {
  width: 18px;
  min-height: 18px;
  flex: 0 0 auto;
}

.invoice-visibility-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.invoice-template-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .72fr);
  gap: 10px;
  min-width: 0;
}

.invoice-a4-sheet {
  box-sizing: border-box;
  position: relative;
  display: grid;
  gap: 12px;
  min-width: 0;
  aspect-ratio: 210 / 297;
  width: min(100%, 560px);
  justify-self: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: clamp(22px, 4vw, 34px);
  background: #fff;
  box-shadow: 0 16px 40px rgba(17, 24, 39, .08);
  color: var(--ink);
  font-size: .72rem;
  line-height: 1.34;
  overflow: hidden;
}

.invoice-a4-content {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 12px;
  min-width: 0;
}

.invoice-a4-letterhead {
  position: absolute;
  inset: 0;
  z-index: 0;
  min-width: 0;
  background: #fff;
  color: var(--muted);
  pointer-events: none;
}

.invoice-a4-letterhead-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

.invoice-a4-letterhead[hidden] {
  display: none;
}

.invoice-a4-letterhead-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1;
  display: grid;
  justify-items: end;
  gap: 3px;
  max-width: 100%;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 6px 20px rgba(15, 23, 42, .08);
  font-size: .72rem;
  overflow-wrap: anywhere;
  opacity: .72;
}

.kiosk-admin-layout {
  display: grid;
  grid-template-columns: minmax(320px, 380px) minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  min-width: 0;
}

.kiosk-config-panel,
.kiosk-preview-panel,
.kiosk-cart-panel,
.kiosk-upsell-panel {
  box-sizing: border-box;
  display: grid;
  gap: 14px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: var(--panel);
}

.kiosk-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.kiosk-panel-head h4 {
  margin: 0;
}

.kiosk-panel-head p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.35;
}

.kiosk-state-pill,
.kiosk-count-pill {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 7px 10px;
  background: color-mix(in srgb, var(--brand) 10%, var(--panel));
  color: var(--brand);
  font-weight: 800;
  font-size: .82rem;
  white-space: nowrap;
}

.kiosk-profile-summary,
.kiosk-url-card,
.kiosk-status {
  min-width: 0;
  border-radius: 8px;
  padding: 12px;
  background: color-mix(in srgb, var(--tile-tint) 54%, var(--panel));
  color: var(--muted);
  overflow-wrap: anywhere;
}

.kiosk-profile-summary {
  display: grid;
  gap: 5px;
}

.kiosk-profile-summary strong,
.kiosk-url-card strong {
  color: var(--ink);
}

.kiosk-profile-summary span,
.kiosk-profile-summary small,
.kiosk-url-card small {
  color: var(--muted);
  line-height: 1.35;
}

.kiosk-url-card {
  display: grid;
  gap: 6px;
  border: 1px dashed color-mix(in srgb, var(--brand) 28%, var(--line));
  background: color-mix(in srgb, var(--brand) 6%, var(--panel));
}

.kiosk-url-card > span,
.kiosk-subtitle {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

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

.kiosk-config-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.kiosk-config-grid select {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  text-transform: none;
}

.kiosk-payment-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
  min-width: 0;
}

.kiosk-payment-pill,
.kiosk-upsell-chip {
  border-radius: 999px;
  padding: 7px 10px;
  background: color-mix(in srgb, var(--brand) 10%, var(--panel));
  color: var(--brand);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.kiosk-action-row {
  display: flex;
  justify-content: flex-end;
}

.kiosk-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
  gap: 10px;
  min-width: 0;
}

.kiosk-product-card {
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto minmax(46px, 1fr) auto;
  gap: 9px;
  min-height: 188px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.kiosk-product-card:hover:not(:disabled),
.kiosk-product-card:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--line));
  box-shadow: 0 10px 22px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
}

.kiosk-product-card.disabled {
  opacity: .56;
  cursor: not-allowed;
}

.kiosk-product-image {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  min-height: 0;
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 60%, #fff);
  overflow: hidden;
}

.kiosk-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kiosk-product-card strong,
.kiosk-product-card small,
.kiosk-product-card em {
  min-width: 0;
  overflow-wrap: anywhere;
}

.kiosk-product-copy {
  display: grid;
  align-content: start;
  gap: 4px;
  min-width: 0;
}

.kiosk-product-copy strong {
  line-height: 1.15;
}

.kiosk-product-copy small,
.kiosk-product-foot em {
  color: var(--muted);
  font-style: normal;
  line-height: 1.25;
}

.kiosk-product-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.kiosk-product-foot strong {
  white-space: nowrap;
}

.kiosk-preview-bottom {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .42fr);
  gap: 10px;
  min-width: 0;
}

.kiosk-cart-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  border-bottom: 1px solid var(--soft-line);
  padding-bottom: 8px;
}

.kiosk-ready,
.kiosk-blocked {
  border-radius: 8px;
  padding: 10px 12px;
  font-weight: 800;
}

.kiosk-ready {
  background: #e8f7ef;
  color: #126237;
}

.kiosk-blocked {
  background: #fff4e5;
  color: #8a5600;
}

.kiosk-customer-mode {
  min-height: 100vh;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--kiosk-bg, #eef4f2) 88%, #fff), #fff 58%),
    var(--kiosk-bg, #eef4f2);
}

.kiosk-customer-mode .app-frame {
  display: none;
}

.kiosk-customer-app {
  box-sizing: border-box;
  width: min(1440px, 100%);
  margin: 0 auto;
  padding: clamp(16px, 3vw, 34px);
}

.kiosk-customer-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
  margin-bottom: 18px;
}

.kiosk-customer-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.kiosk-customer-logo {
  width: clamp(68px, 9vw, 118px);
  height: clamp(42px, 6vw, 78px);
  object-fit: contain;
}

.kiosk-customer-header h1 {
  margin: 4px 0 6px;
  font-size: clamp(2rem, 5vw, 4rem);
  line-height: 1;
}

.kiosk-customer-header p {
  margin: 0;
  color: var(--muted);
  font-size: 1.05rem;
}

.kiosk-customer-total {
  display: grid;
  gap: 4px;
  min-width: 180px;
  border-radius: 8px;
  padding: 14px 16px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(15, 23, 42, .08);
  text-align: right;
}

.kiosk-customer-total span {
  color: var(--muted);
  font-weight: 800;
  text-transform: uppercase;
}

.kiosk-customer-total strong {
  font-size: 1.45rem;
}

.kiosk-customer-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
  gap: 18px;
  align-items: start;
  min-width: 0;
}

.kiosk-customer-catalog,
.kiosk-customer-cart {
  box-sizing: border-box;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: clamp(14px, 2vw, 22px);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 18px 50px rgba(15, 23, 42, .08);
}

.kiosk-customer-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.kiosk-customer-section-head h2,
.kiosk-customer-cart h2 {
  margin: 0;
}

.kiosk-customer-section-head p {
  margin: 5px 0 0;
  color: var(--muted);
}

.kiosk-customer-section-head > span {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 8px 11px;
  background: color-mix(in srgb, var(--kiosk-brand, var(--brand)) 12%, #fff);
  color: var(--kiosk-brand, var(--brand));
  font-weight: 900;
}

.kiosk-customer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  min-width: 0;
}

.kiosk-customer-product {
  display: grid;
  grid-template-rows: auto minmax(58px, 1fr) auto;
  gap: 10px;
  min-width: 0;
  min-height: 230px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.kiosk-customer-product:focus-visible,
.kiosk-customer-product:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--kiosk-brand, var(--brand)) 48%, var(--line));
  box-shadow: 0 12px 28px rgba(15, 23, 42, .1);
}

.kiosk-customer-product.disabled {
  opacity: .48;
  cursor: not-allowed;
}

.kiosk-customer-product-image {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  background: color-mix(in srgb, var(--kiosk-tile, var(--tile-tint)) 64%, #fff);
  overflow: hidden;
}

.kiosk-customer-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kiosk-customer-product-copy,
.kiosk-customer-product-foot {
  min-width: 0;
}

.kiosk-customer-product-copy {
  display: grid;
  align-content: start;
  gap: 5px;
}

.kiosk-customer-product-copy strong {
  font-size: 1.05rem;
  line-height: 1.15;
}

.kiosk-customer-product-copy small,
.kiosk-customer-product-foot em {
  color: var(--muted);
  font-style: normal;
}

.kiosk-customer-product-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
}

.kiosk-customer-product-foot strong {
  white-space: nowrap;
}

.kiosk-customer-cart {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 14px;
}

.kiosk-customer-lines {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.kiosk-customer-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--soft-line);
  padding-bottom: 9px;
}

.kiosk-customer-line span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.kiosk-customer-upsells {
  display: grid;
  gap: 8px;
}

.kiosk-customer-upsell {
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--kiosk-brand, var(--brand)) 7%, #fff);
  color: var(--kiosk-brand, var(--brand));
  font-weight: 900;
  text-align: left;
}

.kiosk-customer-readiness {
  border-radius: 8px;
  padding: 12px;
  background: color-mix(in srgb, var(--kiosk-tile, var(--tile-tint)) 54%, #fff);
  color: var(--muted);
  font-weight: 800;
}

.kiosk-customer-readiness.ready {
  background: #e8f7ef;
  color: #126237;
}

.kiosk-customer-readiness.blocked {
  background: #fff4e5;
  color: #8a5600;
}

.kiosk-customer-checkout {
  min-height: 58px;
  border: 0;
  border-radius: 8px;
  background: var(--kiosk-brand, #050505);
  color: #fff;
  font-size: 1.15rem;
  font-weight: 950;
}

.kiosk-customer-checkout:disabled {
  opacity: .38;
}

@media (max-width: 780px) {
  .accounting-relation-field {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounting-relation-field .mini-action {
    width: 100%;
  }

  .accounting-relation-modal,
  .accounting-editor-modal,
  .accounting-report-modal {
    align-items: end;
    padding: 10px;
  }

  .accounting-relation-dialog,
  .accounting-editor-dialog,
  .accounting-report-dialog {
    max-height: calc(100vh - 20px);
  }

  .accounting-report-dialog {
    width: 100%;
    padding: 12px;
  }

  .accounting-balance-sheet {
    border-width: 3px;
    border-radius: 18px;
    padding: 16px;
  }

  .accounting-balance-columns {
    grid-template-columns: minmax(0, 1fr);
    border-top-width: 3px;
  }

  .accounting-balance-columns section {
    padding: 14px 0 0;
  }

  .accounting-balance-columns section + section {
    border-left: 0;
    border-top: 3px solid #2430c5;
  }

  .accounting-editor-body .accounting-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounting-liquidity-strip {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .accounting-liquidity-strip b {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .accounting-tile-hub,
  .accounting-subtile-grid,
  .accounting-work-grid,
  .accounting-report-preview-grid,
  .accounting-liquid-kpis,
  .accounting-compliance-parties,
  .accounting-compliance-list,
  .accounting-creditors-layout,
  .accounting-debtors-layout,
  .accounting-ledger-layout,
  .accounting-choice-grid,
  .accounting-wizard-steps,
  .accounting-wizard-review dl {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounting-tile {
    min-height: 0;
  }

  .accounting-row.depreciation {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .accounting-row-kpi {
    grid-column: 1 / -1;
    justify-items: start;
    padding-left: 50px;
  }

  .accounting-row-kpi small {
    text-align: left;
  }

  .accounting-wizard-head {
    display: grid;
  }

  .accounting-wizard-actions,
  .accounting-wizard-footer {
    justify-content: stretch;
  }

  .accounting-wizard-actions .mini-action,
  .accounting-wizard-footer .mini-action {
    flex: 1 1 140px;
  }

  .accounting-compliance-card header {
    display: grid;
  }

  .accounting-compliance-card header span {
    text-align: left;
  }

  .accounting-workspace,
  .accounting-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounting-topic-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounting-topic-nav {
    position: static;
    order: -1;
  }

  .accounting-topic-nav-list {
    grid-auto-flow: column;
    grid-auto-columns: minmax(132px, 1fr);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .accounting-topic-nav-list button {
    min-height: 44px;
  }

  .accounting-form,
  .accounting-metrics,
  .accounting-opening-control,
  .accounting-opening-form .accounting-fieldset,
  .accounting-vat-metrics {
    grid-template-columns: minmax(0, 1fr);
  }

  .accounting-row,
  .accounting-row.report {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .accounting-row em {
    grid-column: 2;
  }

  .accounting-row.recurring > button {
    grid-column: 2;
    justify-self: start;
  }

  .accounting-workspace {
    gap: 10px;
  }

  .kiosk-admin-layout,
  .kiosk-config-grid,
  .kiosk-preview-bottom {
    grid-template-columns: minmax(0, 1fr);
  }

  .kiosk-panel-head {
    display: grid;
  }

  .kiosk-customer-header,
  .kiosk-customer-section-head {
    display: grid;
  }

  .kiosk-customer-brand {
    align-items: flex-start;
  }

  .kiosk-customer-total {
    width: 100%;
    text-align: left;
  }

  .kiosk-customer-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .kiosk-customer-cart {
    position: static;
  }
}

.invoice-a4-sheet header {
  display: block;
  min-width: 0;
  border-bottom: 2px solid var(--brand);
  padding-bottom: 12px;
}

.invoice-a4-brand {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
}

.invoice-a4-brand img {
  display: block;
  flex: 0 1 126px;
  width: min(126px, 31vw);
  max-width: 126px;
  max-height: 48px;
  object-fit: contain;
  object-position: left center;
}

.invoice-a4-brand img[hidden] {
  display: none;
}

.invoice-a4-brand-text {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.invoice-a4-brand-text strong {
  display: block;
  font-size: clamp(.9rem, 1.45vw, 1.05rem);
  line-height: 1.12;
}

.invoice-a4-template-meta,
.invoice-a4-muted,
.invoice-a4-sheet p {
  color: var(--muted);
}

.invoice-a4-template-meta {
  display: block;
  font-size: .82rem;
  line-height: 1.35;
}

.invoice-a4-client {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.invoice-a4-business-preview,
.invoice-a4-facts,
.invoice-a4-parties {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.invoice-a4-facts,
.invoice-a4-parties {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.invoice-a4-card,
.invoice-a4-party {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
  min-width: 0;
}

.invoice-a4-card dl {
  display: grid;
  grid-template-columns: minmax(84px, .5fr) minmax(0, 1fr);
  gap: 3px 8px;
  margin: 0;
}

.invoice-a4-facts .invoice-a4-card:last-child dl {
  grid-template-columns: 46px minmax(0, 1fr);
}

.invoice-a4-card dt {
  color: var(--muted);
  font-size: .68rem;
  line-height: 1.28;
}

.invoice-a4-card dd {
  margin: 0;
  font-weight: 750;
  color: var(--ink);
  font-size: .72rem;
  line-height: 1.28;
}

.invoice-a4-party h4 {
  margin: 0 0 7px;
  color: var(--muted);
  font-size: .66rem;
  text-transform: uppercase;
}

.invoice-a4-client p,
.invoice-a4-sheet p {
  margin: 0;
}

.invoice-a4-muted {
  font-size: .68rem;
  line-height: 1.45;
}

.invoice-a4-sheet table {
  width: 100%;
  border-collapse: collapse;
  margin: 2px 0 0;
  font-size: .67rem;
}

.invoice-a4-sheet th,
.invoice-a4-sheet td {
  border-bottom: 1px solid var(--line);
  padding: 6px 5px;
  text-align: left;
}

.invoice-a4-sheet th:last-child,
.invoice-a4-sheet td:last-child {
  text-align: right;
}

.invoice-a4-total {
  margin-left: auto;
  text-align: right;
  font-size: .9rem;
  font-weight: 850;
  color: var(--ink) !important;
}

.invoice-a4-sheet strong,
.invoice-a4-sheet span,
.invoice-a4-sheet td,
.invoice-a4-sheet th,
.invoice-a4-sheet p {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 520px) {
  .invoice-a4-brand {
    flex-direction: column;
    gap: 12px;
  }

  .invoice-a4-brand img {
    width: min(164px, 70vw);
  }

  .invoice-a4-facts,
  .invoice-a4-parties {
    grid-template-columns: minmax(0, 1fr);
  }
}

.document-template-preview-shell {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: color-mix(in srgb, var(--tile-tint) 42%, var(--panel));
}

.document-template-preview-shell > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.document-template-preview-shell span[aria-hidden="true"] {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--tile-tint);
  color: var(--brand);
  flex: 0 0 auto;
}

.document-template-preview-shell strong,
.document-template-preview-shell p {
  min-width: 0;
  overflow-wrap: anywhere;
}

.document-template-preview-shell p {
  color: var(--muted);
}

.onboarding-form label,
.branding-form-grid label,
.invoice-control-fields label,
.invoice-style-row label,
.cash-count-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.brand-color-palette-field {
  display: grid;
  grid-column: 1 / -1;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: color-mix(in srgb, var(--surface) 72%, var(--panel));
}

.brand-logo-upload-preview {
  grid-column: 1 / -1;
  min-height: 66px;
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--surface) 72%, var(--panel));
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 12px;
  overflow-wrap: anywhere;
}

.brand-logo-upload-preview img {
  width: 112px;
  height: 42px;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.brand-color-palette-field > div:first-child {
  display: grid;
  gap: 4px;
}

.brand-color-palette-field span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.brand-color-palette-field small {
  color: var(--muted);
  font-size: .9rem;
}

.brand-color-palette {
  display: grid;
  grid-template-columns: repeat(5, minmax(116px, 1fr));
  gap: 10px;
  min-width: 0;
}

.brand-color-chip {
  display: grid !important;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px !important;
  min-height: 54px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 10px;
  background: var(--panel);
}

.brand-color-chip span {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 850;
}

.brand-color-preview {
  display: block;
  min-width: 40px;
  width: 100%;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.brand-color-chip input[type="color"] {
  width: 42px;
  min-height: 34px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  padding: 0;
  background: transparent;
}

.onboarding-form label span,
.branding-form-grid label span,
.invoice-control-fields label span,
.invoice-style-row label span,
.cash-count-form label span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.onboarding-form input,
.onboarding-form select,
.branding-form-grid input,
.branding-form-grid textarea,
.invoice-control-fields input,
.invoice-control-fields select,
.invoice-control-fields textarea,
.invoice-style-row input,
.invoice-style-row select,
.cash-count-form input {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
}

.branding-form-grid textarea,
.invoice-control-fields textarea {
  min-height: 86px;
  padding: 10px;
  resize: vertical;
}

.is-hidden-field {
  display: none !important;
}

.onboarding-result,
.branding-result {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.onboarding-profile-options {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: color-mix(in srgb, var(--surface) 70%, var(--panel));
}

.onboarding-profile-heading {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.onboarding-profile-heading strong {
  font-size: 1rem;
}

.onboarding-profile-heading span {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.onboarding-profile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.onboarding-profile-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  min-height: 142px;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px;
  background: var(--panel);
  color: var(--ink);
  cursor: pointer;
}

.onboarding-profile-card strong,
.onboarding-profile-card span,
.onboarding-profile-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.onboarding-profile-card span,
.onboarding-profile-card small {
  color: var(--muted);
}

.onboarding-profile-card small {
  font-size: .78rem;
  font-weight: 800;
}

.onboarding-profile-card.is-selected {
  border-color: color-mix(in srgb, var(--accent) 72%, var(--line));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);
}

.brand-preview {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.brand-preview-header {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.brand-preview-header img {
  width: 132px;
  height: 48px;
  object-fit: contain;
  object-position: left center;
}

.brand-preview-header div {
  display: grid;
  min-width: 0;
}

.brand-preview-header strong,
.brand-preview-header span {
  overflow-wrap: anywhere;
}

.receipt-ticket {
  display: grid;
  gap: 12px;
  width: 100%;
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fbfdfc;
}

.receipt-template-preview-panel .receipt-ticket {
  box-sizing: border-box;
  gap: 10px;
  width: min(100%, 360px);
  justify-self: center;
  border: 1px solid var(--line);
  padding: 18px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .08) 0 6px, transparent 6px 12px) border-box;
  box-shadow: 0 18px 46px rgba(17, 24, 39, .08);
  color: var(--ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

.receipt-return-panel,
.receipt-return-form {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.receipt-return-lines {
  display: grid;
  gap: 8px;
}

.receipt-return-line {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto minmax(92px, 118px);
  gap: 10px;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  background: #ffffff;
}

.receipt-return-line.is-disabled {
  opacity: .58;
}

.receipt-return-line-info {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.receipt-return-line-info strong,
.receipt-return-line-info span {
  overflow-wrap: anywhere;
}

.receipt-return-line-info span {
  color: var(--muted);
  font-size: .82rem;
}

.receipt-return-line input[type="number"] {
  min-width: 0;
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  font: inherit;
  font-weight: 760;
}

.receipt-return-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}

.receipt-return-controls label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.receipt-return-controls label > span {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.receipt-return-controls input,
.receipt-return-controls select {
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
}

.receipt-return-controls .checkbox-row {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  min-height: 42px;
}

.receipt-return-controls .checkbox-row span {
  color: var(--ink);
  font-size: .9rem;
  text-transform: none;
}

.receipt-popin {
  position: fixed;
  inset: 0;
  z-index: 85;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(31, 37, 40, .28);
}

.receipt-popin[hidden] {
  display: none;
}

.receipt-popin-panel {
  width: min(720px, 100%);
  max-height: calc(100dvh - 44px);
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: #ffffff;
  box-shadow: 0 22px 60px rgba(31, 37, 40, .22);
}

.manual-amount-modal,
.support-ticket-modal,
.pos-receipt-modal,
.receipt-action-popin {
  position: fixed;
  inset: 0;
  z-index: 92;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(31, 37, 40, .32);
}

.product-info-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(31, 37, 40, .32);
}

.product-info-modal[hidden] {
  display: none;
}

.product-info-dialog {
  width: min(720px, 100%);
  max-height: min(760px, calc(100vh - 36px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: 0 24px 70px rgba(31, 37, 40, .22);
  padding: 20px;
}

.product-info-body {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 18px;
  margin-top: 16px;
  min-width: 0;
}

.product-info-visual {
  display: grid;
  place-items: center;
  align-self: start;
  min-height: 132px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.product-info-visual img {
  width: 100%;
  max-height: 160px;
  object-fit: contain;
  border-radius: 7px;
}

.product-info-list {
  display: grid;
  gap: 0;
  min-width: 0;
}

.product-info-section-title {
  margin: 16px 0 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 880;
  letter-spacing: 0;
  text-transform: uppercase;
}

.product-info-section-title:first-child {
  margin-top: 0;
}

.product-info-list div,
.product-info-row {
  display: grid;
  grid-template-columns: minmax(110px, 150px) minmax(0, 1fr);
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.product-info-row-strong dd {
  font-size: 20px;
}

.product-info-row-ok dd {
  color: #1d5f46;
}

.product-info-row-warning dd {
  color: var(--danger);
}

.product-info-row-muted dd {
  color: var(--muted);
  font-weight: 700;
}

.product-info-row-description {
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.product-info-list dt {
  color: var(--muted);
  font-weight: 820;
}

.product-info-list dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 760;
}

.receipt-action-popin {
  z-index: 96;
  background: rgba(31, 37, 40, .38);
}

.manual-amount-modal[hidden],
.support-ticket-modal[hidden],
.pos-receipt-modal[hidden],
.receipt-action-popin[hidden] {
  display: none;
}

.manual-amount-dialog,
.support-ticket-dialog,
.pos-receipt-dialog,
.receipt-action-dialog {
  width: min(560px, 100%);
  max-height: calc(100dvh - 44px);
  overflow-y: auto;
  display: grid;
  align-content: start;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: #ffffff;
  box-shadow: 0 22px 60px rgba(31, 37, 40, .22);
}

.pos-receipt-dialog {
  width: min(1040px, 100%);
}

.support-ticket-dialog {
  width: min(680px, 100%);
}

.support-ticket-context {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f7fbfa;
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.support-ticket-status-list {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.support-ticket-status-empty {
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  color: var(--muted);
  background: var(--surface);
  font-size: .92rem;
}

.support-ticket-status-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
  min-width: 0;
}

.support-ticket-status-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.support-ticket-status-title {
  font-weight: 840;
  overflow-wrap: anywhere;
}

.support-ticket-status-meta {
  color: var(--muted);
  font-size: .84rem;
  overflow-wrap: anywhere;
}

.support-ticket-status-badge {
  border: 1px solid var(--soft-line);
  border-radius: 999px;
  padding: 5px 8px;
  background: #eef8f5;
  color: var(--brand-strong);
  font-size: .78rem;
  font-weight: 860;
  white-space: nowrap;
}

.support-ticket-status-badge.waiting-customer {
  border-color: #e8caa0;
  background: #fff8ea;
  color: #6a4619;
}

.support-ticket-status-badge.resolved,
.support-ticket-status-badge.closed {
  border-color: #d7dde0;
  background: #f3f5f5;
  color: var(--muted);
}

.support-ticket-body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.support-ticket-body label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.support-ticket-body span {
  color: var(--muted);
  font-size: .8rem;
  font-weight: 820;
  text-transform: uppercase;
}

.support-ticket-body input,
.support-ticket-body select,
.support-ticket-body textarea {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.support-ticket-body textarea {
  min-height: 128px;
  resize: vertical;
}

.support-ticket-wide,
.support-ticket-error {
  grid-column: 1 / -1;
}

.support-ticket-error,
.support-ticket-result {
  border: 1px solid #e8caa0;
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff8ea;
  color: #4d3820;
  overflow-wrap: anywhere;
}

.support-ticket-result.success {
  border-color: var(--soft-line);
  background: #ecf7f4;
  color: var(--brand-strong);
}

.receipt-action-dialog {
  width: min(500px, 100%);
}

.receipt-upload-panel {
  display: grid;
  gap: 10px;
}

.receipt-upload-panel[hidden] {
  display: none;
}

.receipt-upload-dropzone {
  display: grid;
  gap: 6px;
  border: 2px dashed color-mix(in srgb, var(--brand) 34%, var(--line));
  border-radius: 8px;
  padding: 16px;
  background: color-mix(in srgb, var(--brand) 7%, #fff);
  cursor: pointer;
}

.receipt-upload-dropzone:hover,
.receipt-upload-dropzone:focus-within {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 11%, #fff);
}

.receipt-upload-dropzone span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.receipt-upload-dropzone strong,
.receipt-upload-dropzone small {
  overflow-wrap: anywhere;
}

.receipt-upload-dropzone input {
  min-height: auto;
  border: 0;
  padding: 6px 0 0;
  background: transparent;
  font-weight: 650;
}

.receipt-upload-summary {
  display: grid;
  gap: 3px;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #f7fbfa;
  min-width: 0;
}

.receipt-upload-summary[hidden] {
  display: none;
}

.receipt-upload-summary strong,
.receipt-upload-summary span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.receipt-upload-summary span {
  color: var(--muted);
  font-size: .86rem;
}

.pos-receipt-layout {
  display: grid;
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
  gap: 14px;
  min-width: 0;
}

.pos-receipt-layout .recent-sales-list,
.pos-receipt-layout .receipt-ticket {
  min-width: 0;
}

.manual-amount-body,
.receipt-action-dialog label,
.receipt-attachment-fields {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.manual-amount-body label,
.receipt-action-dialog label,
.receipt-attachment-fields label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.manual-amount-body label > span,
.receipt-action-dialog label > span,
.receipt-attachment-fields label > span,
.manual-amount-fields legend,
.manual-receipt-fields legend {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 820;
  text-transform: uppercase;
}

.receipt-attachment-fields {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fbfdfc;
}

.receipt-attachment-fields summary {
  cursor: pointer;
  color: var(--brand-dark);
  font-weight: 820;
}

.manual-amount-fields,
.manual-receipt-fields {
  min-width: 0;
  display: grid;
  gap: 8px;
  border: 0;
  padding: 0;
  margin: 0;
}

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

.manual-receipt-options label {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  background: #ffffff;
}

.manual-receipt-options input[type="radio"] {
  width: auto;
  min-height: auto;
  accent-color: var(--brand);
}

.manual-money-input {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto minmax(90px, .38fr);
  gap: 10px;
  align-items: end;
  min-width: 0;
}

.manual-currency,
.manual-decimal-separator {
  min-height: 56px;
  display: inline-grid;
  place-items: center;
  color: var(--ink);
  font-weight: 900;
}

.manual-currency {
  min-width: 64px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
}

.manual-money-input input,
.manual-amount-body input,
.manual-amount-body select,
.receipt-action-dialog input,
.receipt-action-dialog textarea,
.receipt-attachment-fields input {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  color: var(--ink);
  background: #ffffff;
  font: inherit;
  font-weight: 760;
}

.receipt-action-dialog textarea {
  min-height: 118px;
  padding-top: 10px;
  resize: vertical;
}

.manual-amount-preview,
.manual-amount-error {
  margin: 0;
  border-radius: 8px;
  padding: 10px 12px;
}

.manual-amount-preview {
  color: var(--muted);
  background: var(--soft);
}

.manual-amount-error {
  color: #7f1d1d;
  background: #fef2f2;
}

.manual-amount-error[hidden] {
  display: none;
}

.manual-amount-actions {
  display: grid;
  grid-template-columns: minmax(0, .65fr) minmax(0, 1fr);
  gap: 10px;
}

.receipt-attachment-fields {
  grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 760px) {
  .manual-amount-modal,
  .pos-receipt-modal,
  .receipt-action-popin {
    padding: 10px;
    align-items: stretch;
  }

  .manual-amount-dialog,
  .pos-receipt-dialog,
  .receipt-action-dialog {
    max-height: calc(100dvh - 20px);
    align-self: stretch;
  }

  .pos-receipt-dialog {
    align-self: start;
  }

  .manual-money-input {
    grid-template-columns: auto minmax(0, 1fr) auto minmax(72px, .38fr);
  }

  .pos-receipt-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .manual-amount-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .support-ticket-body {
    grid-template-columns: minmax(0, 1fr);
  }

  .support-ticket-status-item {
    grid-template-columns: minmax(0, 1fr);
  }

  .support-ticket-status-badge {
    justify-self: start;
  }
}

.receipt-footer {
  margin: 0;
  color: var(--ink);
  font-size: .88rem;
  overflow-wrap: anywhere;
}

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

.device-layout {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 14px;
}

.integration-layout,
.inventory-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 14px;
}

.inventory-overview,
.management-overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.inventory-overview section,
.management-overview section {
  display: grid;
  gap: 4px;
  border: 1px solid var(--soft-line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  padding: 12px;
  background: #f7fbfa;
}

.inventory-overview span,
.management-overview span {
  color: var(--muted);
  font-size: .9rem;
}

.inventory-layout {
  grid-template-columns: minmax(320px, .86fr) minmax(360px, 1fr);
  align-items: start;
}

.inventory-catalog {
  grid-row: span 2;
}

.inventory-catalog .product-admin-list {
  max-height: 560px;
  overflow-y: auto;
  padding-right: 4px;
}

.inventory-editor {
  background: #fbfdfc;
}

.inventory-actions .finance-kpis {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

.management-grid .device-panel {
  align-content: start;
}

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

.management-form.compact {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.management-form label,
.management-form.compact label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.management-form span,
.management-form.compact span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 760;
  text-transform: uppercase;
}

.management-form input,
.management-form select,
.management-form textarea,
.management-form.compact input,
.management-form.compact select {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 8px;
  background: #fff;
}

.management-form textarea {
  padding: 10px 8px;
  resize: vertical;
}

.field-combobox {
  position: relative;
  min-width: 0;
}

.management-form .field-combobox input {
  width: 100%;
  padding-right: 52px;
}

.field-combobox-button {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 34px;
  min-height: 34px;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1;
}

.field-combobox-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  display: grid;
  max-height: 220px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 24px rgba(15, 23, 42, .16);
}

.field-combobox-menu[hidden] {
  display: none;
}

.field-combobox-menu button {
  width: 100%;
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--text);
  text-align: left;
}

.field-combobox-menu button:hover,
.field-combobox-menu button:focus-visible {
  background: var(--soft);
}

.fulfillment-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 1.25fr) repeat(3, minmax(150px, 1fr)) minmax(140px, .7fr);
  gap: 8px;
  margin-bottom: 12px;
  align-items: end;
}

.fulfillment-toolbar label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.fulfillment-toolbar label > span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 760;
  text-transform: uppercase;
}

.fulfillment-toolbar input,
.fulfillment-toolbar select {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
}

.fulfillment-summary {
  margin-bottom: 12px;
}

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

.fulfillment-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(280px, auto);
  gap: 10px;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 255, 255, .78);
}

.fulfillment-row-info {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.fulfillment-row-info strong,
.fulfillment-row-info span {
  overflow-wrap: anywhere;
}

.fulfillment-row-info span {
  color: var(--muted);
  font-size: .84rem;
}

.fulfillment-row-customer {
  color: var(--text) !important;
  font-weight: 850;
}

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

.fulfillment-actions .mini-action {
  min-height: 38px;
  padding: 0 10px;
}

.fulfillment-action-popin {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(22, 28, 31, .38);
}

.fulfillment-action-popin[hidden] {
  display: none;
}

.fulfillment-action-dialog {
  width: min(720px, 100%);
  max-height: min(86vh, 760px);
  overflow: auto;
  display: grid;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 18px;
  box-shadow: 0 22px 60px rgba(24, 31, 35, .22);
}

.fulfillment-action-context,
.fulfillment-action-fields {
  display: grid;
  min-width: 0;
}

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

.fulfillment-action-context span {
  display: grid;
  gap: 3px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: rgba(241, 247, 245, .78);
  padding: 9px 10px;
}

.fulfillment-action-context strong,
.fulfillment-action-fields label > span {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.fulfillment-action-context em {
  min-width: 0;
  color: var(--text);
  font-style: normal;
  font-weight: 850;
  overflow-wrap: anywhere;
}

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

.fulfillment-action-fields label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.fulfillment-action-wide {
  grid-column: 1 / -1;
}

.fulfillment-action-fields input,
.fulfillment-action-fields textarea {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  font: inherit;
}

.fulfillment-action-fields textarea {
  min-height: 96px;
  resize: vertical;
}

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

.transportation-policy-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 280px) max-content;
  gap: 10px;
  align-items: end;
}

.transportation-policy-toolbar label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.transportation-policy-toolbar span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 760;
  text-transform: uppercase;
}

.transportation-policy-toolbar select {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 8px;
  background: #fff;
}

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

.transportation-policy-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) repeat(5, minmax(72px, auto));
  gap: 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.transportation-policy-row > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.transportation-policy-row > div span {
  overflow: hidden;
  color: var(--muted);
  font-size: .82rem;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.check-row.compact {
  display: flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
  font-size: .84rem;
  font-weight: 650;
}

.management-form .form-span-2,
.management-form .product-photo-preview {
  grid-column: 1 / -1;
}

.product-photo-preview {
  min-height: 64px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--muted);
  font-weight: 650;
  display: flex;
  align-items: center;
  gap: 10px;
  overflow-wrap: anywhere;
}

.product-photo-preview img {
  width: 58px;
  height: 58px;
  border-radius: 8px;
  object-fit: cover;
  border: 1px solid var(--line);
}

.product-profile-fields {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--soft-panel);
}

.product-profile-fields[hidden] {
  display: none;
}

.product-profile-fields-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  min-width: 0;
}

.product-profile-fields-header strong {
  font-size: .95rem;
}

.product-profile-fields-header span {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 650;
  text-transform: none;
}

.product-profile-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.product-profile-field.checkbox-like {
  grid-template-columns: 1fr auto;
  align-items: center;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
}

.product-profile-field.checkbox-like input {
  min-height: auto;
  width: 18px;
  height: 18px;
  padding: 0;
}

.product-profile-option-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.product-profile-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
}

.product-profile-option input {
  min-height: auto;
  width: 16px;
  height: 16px;
  padding: 0;
}

.product-profile-option span {
  color: var(--ink);
  font-size: .9rem;
  font-weight: 700;
  text-transform: none;
}

.category-icon-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.category-icon-card {
  display: grid;
  grid-template-columns: 56px minmax(0, .72fr) minmax(420px, 1.28fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.category-icon-preview {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--tile-tint);
}

.category-icon-content {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.category-icon-content strong,
.category-icon-content span {
  overflow-wrap: anywhere;
}

.category-icon-content span {
  color: var(--muted);
  font-weight: 650;
}

.category-icon-controls {
  display: grid;
  gap: 10px;
  align-items: stretch;
  min-width: 0;
}

.category-icon-picker {
  display: grid;
  gap: 8px;
  max-height: 238px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: #fbfdfc;
}

.category-icon-group {
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: #fff;
}

.category-icon-group summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-height: 40px;
  padding: 8px 10px;
  cursor: pointer;
  list-style-position: inside;
}

.category-icon-group summary strong,
.category-icon-group summary span {
  min-width: 0;
}

.category-icon-group summary strong {
  overflow: hidden;
  color: var(--ink);
  font-size: .88rem;
  font-weight: 860;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.category-icon-group summary span {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 760;
  white-space: nowrap;
}

.category-icon-choice-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  padding: 0 8px 8px;
}

.category-icon-choice {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  padding: 0;
}

.category-icon-choice:hover,
.category-icon-choice:focus-visible {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.category-icon-choice.active {
  border-color: var(--brand);
  background: var(--tile-tint);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--brand) 18%, transparent);
  color: var(--brand-dark);
}

.category-icon-choice .lucide-icon {
  width: 21px;
  height: 21px;
}

.category-icon-choice img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.category-icon-group-custom {
  border-color: color-mix(in srgb, var(--brand) 28%, var(--soft-line));
  background: color-mix(in srgb, var(--tile-tint) 52%, #fff);
}

.inventory-profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
  gap: 14px;
  align-items: start;
}

.inventory-profile-controls,
.inventory-profile-preview {
  align-content: start;
}

.inventory-profile-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 360px) minmax(0, 1fr);
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
}

.device-result.compact {
  min-height: 44px;
  margin: 0;
}

.inventory-profile-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.inventory-profile-option,
.inventory-profile-category {
  display: grid;
  gap: 6px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  padding: 12px;
}

.inventory-profile-option:hover,
.inventory-profile-option:focus-visible,
.inventory-profile-category:hover,
.inventory-profile-category:focus-visible {
  border-color: var(--brand);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand) 20%, transparent);
}

.inventory-profile-option.active,
.inventory-profile-category.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--tile-tint) 68%, #fff);
}

.inventory-profile-option strong,
.inventory-profile-category strong {
  font-weight: 860;
  overflow-wrap: anywhere;
}

.inventory-profile-option span,
.inventory-profile-option small,
.inventory-profile-category span {
  color: var(--muted);
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.inventory-profile-category-panel,
.inventory-profile-custom-form {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfdfc;
  padding: 12px;
  margin-top: 12px;
}

.inventory-profile-category-grid {
  display: grid;
  grid-template-columns: minmax(210px, .42fr) minmax(0, .58fr);
  gap: 12px;
  align-items: start;
}

.inventory-profile-category-list {
  display: grid;
  gap: 8px;
  max-height: 468px;
  overflow: auto;
}

.inventory-profile-field-editor {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.inventory-profile-field-editor-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.inventory-profile-field-options {
  display: grid;
  gap: 8px;
  max-height: 468px;
  overflow: auto;
}

.inventory-profile-field-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 24px;
  gap: 8px;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.inventory-profile-field-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.inventory-profile-field-row strong,
.inventory-profile-field-row small {
  overflow-wrap: anywhere;
}

.inventory-profile-field-row small {
  color: var(--muted);
  font-weight: 620;
}

.inventory-profile-custom-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.inventory-profile-custom-form > div,
.inventory-profile-custom-form .full,
.inventory-profile-custom-form button {
  grid-column: 1 / -1;
}

.inventory-profile-custom-form label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.inventory-profile-custom-form label span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 760;
  text-transform: uppercase;
}

.inventory-profile-custom-form input,
.inventory-profile-custom-form select {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
}

.inventory-profile-preview {
  position: sticky;
  top: 14px;
}

.inventory-profile-preview-header {
  display: grid;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--tile-tint) 74%, #fff);
  padding: 12px;
  margin-bottom: 10px;
}

.inventory-profile-preview-header strong {
  font-size: 1rem;
  font-weight: 900;
}

.inventory-profile-preview-header span {
  color: var(--muted);
  font-weight: 650;
}

.inventory-profile-preview-body {
  display: grid;
  gap: 10px;
}

.inventory-profile-preview-group {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}

.inventory-profile-preview-group > strong {
  display: block;
  margin-bottom: 8px;
  font-weight: 900;
}

.inventory-profile-preview-group > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.inventory-profile-preview-group span {
  border-radius: 999px;
  background: var(--soft-bg);
  color: var(--muted);
  font-size: .8rem;
  font-weight: 720;
  padding: 6px 9px;
}

@media (max-width: 1180px) {
  .inventory-profile-layout {
    grid-template-columns: 1fr;
  }

  .inventory-profile-preview {
    position: static;
  }
}

@media (max-width: 820px) {
  .inventory-profile-toolbar,
  .inventory-profile-profile-grid,
  .inventory-profile-category-grid,
  .inventory-profile-custom-form {
    grid-template-columns: 1fr;
  }

  .inventory-profile-field-editor-header {
    grid-template-columns: 1fr;
  }
}

.category-svg-upload {
  position: relative;
  display: inline-grid;
  place-items: center;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 0 12px;
  color: var(--ink);
  font-weight: 820;
  cursor: pointer;
  white-space: nowrap;
}

.category-svg-upload:focus-within,
.category-svg-upload:hover {
  border-color: var(--brand);
  background: var(--tile-tint);
}

.category-svg-upload input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.category-icon-custom-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.management-form button {
  align-self: end;
}

[data-testid="product-form"] [data-testid="save-product-button"] {
  grid-column: 1 / -1;
  min-height: 52px;
}

.check-row {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  min-height: 44px;
}

.check-row input {
  width: 22px;
  min-height: 22px;
}

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

.card-actions .mini-action {
  flex: 1 1 104px;
}

.device-list[data-testid="management-payments"] .device-card {
  grid-template-columns: minmax(0, 1fr) max-content;
}

.device-list[data-testid="management-payments"] .card-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
}

.device-list[data-testid="management-payments"] .card-actions .mini-action {
  flex: 0 0 auto;
  min-width: 116px;
}

.settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 14px;
}

.customer-discount-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.discount-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}

.discount-admin-actions > * {
  min-height: 44px;
}

.discount-rule-card {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.discount-rule-content {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.discount-rule-content strong,
.discount-rule-content span,
.discount-rule-content small,
.discount-rule-content p {
  min-width: 0;
  overflow-wrap: anywhere;
}

.discount-rule-content span,
.discount-rule-content small,
.discount-rule-content p {
  color: var(--muted);
  font-weight: 650;
}

.discount-rule-content p {
  margin: 2px 0 0;
}

.admin-popin-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(10, 16, 18, .42);
}

.admin-popin-backdrop[hidden] {
  display: none;
}

.management-modal {
  display: grid;
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  gap: 16px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  padding: clamp(18px, 3vw, 26px);
  box-shadow: 0 28px 80px rgba(12, 18, 20, .32);
}

.discount-rule-popin.compact {
  width: min(560px, calc(100vw - 32px));
}

.day-close-wizard-popin {
  width: min(980px, calc(100vw - 32px));
}

.day-close-wizard-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .86fr);
  gap: 14px;
  align-items: start;
}

.day-close-wizard-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface);
}

.wizard-step-label {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.wizard-step-label span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: var(--brand);
  color: #fff;
  font-weight: 900;
}

.wizard-step-label strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.day-close-wizard-kpis {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

.day-close-wizard-grid .full {
  grid-column: 1 / -1;
}

.day-close-wizard-grid label,
.day-close-denominations label {
  min-width: 0;
}

.day-close-denominations {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.day-close-wizard-form .modal-actions .management-action,
.day-close-wizard-form .modal-actions .mini-action {
  width: min(220px, 100%);
}

.modal-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

.modal-heading .icon-button {
  display: grid;
  position: static;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.modal-heading h3,
.modal-heading p {
  margin: 0;
}

.modal-heading p {
  color: var(--muted);
  font-weight: 650;
}

.discount-rule-form textarea {
  min-height: 92px;
  resize: vertical;
}

.discount-product-scope {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--line));
  border-radius: 8px;
  padding: 12px;
  margin: 0;
  background: color-mix(in srgb, var(--brand) 5%, #fff);
}

.discount-product-scope legend {
  padding: 0 6px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.discount-product-scope p {
  margin: 0;
  color: var(--muted);
  font-size: .88rem;
  font-weight: 650;
  line-height: 1.45;
}

.discount-product-scope select[multiple] {
  min-height: 150px;
}

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

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

.danger-action {
  min-height: 44px;
  border: 1px solid #b42318;
  border-radius: 8px;
  background: #b42318;
  color: #fff;
  padding: 0 14px;
  font-weight: 850;
}

.delete-confirm-copy {
  border: 1px solid color-mix(in srgb, #b42318 26%, var(--line));
  border-radius: 8px;
  background: color-mix(in srgb, #b42318 7%, #fff);
  padding: 12px;
  color: var(--ink);
  font-weight: 700;
  overflow-wrap: anywhere;
}

.pos-customer-form {
  display: grid;
  position: fixed;
  inset: 50% auto auto 50%;
  z-index: 9999;
  grid-template-columns: 1fr;
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  gap: 16px;
  align-items: stretch;
  padding: clamp(22px, 3vw, 32px);
  transform: translate(-50%, -50%);
  border: 1px solid color-mix(in srgb, var(--brand) 20%, var(--line));
  border-radius: 14px;
  background: #ffffff;
  color: #111820;
  box-shadow: 0 28px 80px rgba(12, 18, 20, .38);
  opacity: 1;
  filter: none;
  overflow-y: auto;
}

body.customer-modal-open .pos-customer-form,
body.customer-modal-open .pos-customer-form * {
  opacity: 1;
  filter: none;
}

.pos-customer-form[hidden] {
  display: none;
}

.pos-customer-form-header h3,
.pos-customer-form-header p {
  margin: 0;
}

.pos-customer-form-header h3 {
  color: #111820;
  font-size: clamp(1.55rem, 2.2vw, 2rem);
  line-height: 1.05;
}

.pos-customer-form-header p {
  color: #3d484d;
  font-size: clamp(1rem, 1.5vw, 1.15rem);
}

.pos-customer-form label {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.pos-customer-form span {
  font-size: .92rem;
  font-weight: 800;
  color: #3d484d;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.pos-customer-form input,
.pos-customer-form select {
  min-width: 0;
  min-height: 58px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 16px;
  background: #fff;
  color: #111820;
  font: inherit;
  font-size: clamp(1.05rem, 1.55vw, 1.2rem);
}

.form-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(140px, 1fr));
  gap: 12px;
}

.pos-customer-form .mini-action {
  min-height: 58px;
  border-radius: 10px;
  font-size: clamp(1rem, 1.4vw, 1.1rem);
  font-weight: 850;
}

body.customer-modal-open::before {
  position: fixed;
  inset: 0;
  z-index: 9998;
  content: "";
  background: rgba(12, 18, 20, .22);
  pointer-events: none;
}

.mini-action.primary {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
}

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

.device-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}

.agent-card {
  display: grid;
  gap: 14px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--line));
  border-radius: 8px;
  padding: 16px;
  background: var(--tile-tint);
}

.agent-card-heading,
.agent-section-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.agent-card-heading > div,
.agent-section-heading > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.agent-card h3,
.agent-card p {
  margin: 0;
}

.agent-section-heading strong {
  font-size: 0.98rem;
}

.agent-section-heading span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.35;
}

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

.agent-context-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hardware-bridge-card .agent-context-form {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

[data-testid="agent-package-list"],
[data-testid="agent-adapter-list"] {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.agent-package-card,
.agent-test-card {
  position: relative;
  align-content: start;
  gap: 8px;
  min-height: 178px;
  padding: 14px;
  background: #fff;
}

.agent-package-card.is-coming,
.agent-test-card.is-coming {
  color: color-mix(in srgb, var(--ink) 62%, #fff);
  background: color-mix(in srgb, #fff 82%, var(--line));
  border-color: color-mix(in srgb, var(--line) 82%, #fff);
}

.agent-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: var(--brand);
  background: color-mix(in srgb, var(--brand) 10%, #fff);
}

.agent-card-icon .lucide-icon {
  width: 19px;
  height: 19px;
}

.agent-package-card.is-coming .agent-card-icon,
.agent-test-card.is-coming .agent-card-icon {
  color: color-mix(in srgb, var(--muted) 78%, #000);
  background: color-mix(in srgb, var(--line) 55%, #fff);
}

.agent-package-card .mini-action,
.agent-test-card .mini-action {
  align-self: end;
  justify-self: start;
  min-height: 38px;
}

.agent-package-card .mini-action[disabled],
.agent-test-card .mini-action[disabled] {
  opacity: 0.62;
  cursor: not-allowed;
}

.hardware-bridge-result {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.hardware-bridge-result strong,
.hardware-bridge-result span,
.hardware-bridge-result p {
  margin: 0;
  min-width: 0;
}

.hardware-bridge-command {
  display: block;
  max-width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.82rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.hardware-bridge-status-card {
  display: block;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
  padding: 14px;
}

.hardware-bridge-status-body {
  display: grid;
  grid-template-columns: minmax(240px, .82fr) minmax(0, 2.18fr);
  gap: 16px;
  width: 100%;
  min-width: 0;
}

.hardware-bridge-identity-panel,
.hardware-bridge-detail-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
}

.hardware-bridge-identity-panel {
  padding-right: 4px;
}

.hardware-bridge-detail-panel {
  grid-template-columns: minmax(0, 1fr);
}

.hardware-bridge-status-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.hardware-bridge-title {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.hardware-bridge-status-header strong,
.hardware-bridge-status-header span {
  min-width: 0;
}

.hardware-bridge-status-header .status-pill {
  display: inline-flex;
  flex: 0 0 auto;
  align-self: flex-start;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  min-height: 28px;
  padding: 5px 11px;
  color: #0f5132;
  font-size: .78rem;
  font-weight: 860;
  line-height: 1;
  background: color-mix(in srgb, var(--ok) 18%, #fff);
  border: 1px solid color-mix(in srgb, var(--ok) 28%, var(--line));
}

.hardware-bridge-status-header .status-pill.warning {
  color: #70501c;
  background: #fff5df;
  border-color: color-mix(in srgb, var(--clay) 30%, var(--line));
}

.hardware-bridge-identity-line {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.35;
}

.hardware-bridge-status-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.hardware-bridge-status-metrics section {
  display: grid;
  gap: 4px;
  min-width: 0;
  border-radius: 8px;
  padding: 10px;
  background: color-mix(in srgb, var(--brand) 5%, #fff);
  border: 1px solid color-mix(in srgb, var(--brand) 12%, var(--line));
}

.hardware-bridge-status-metrics span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.hardware-bridge-status-metrics strong {
  overflow-wrap: anywhere;
}

.hardware-bridge-version {
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.hardware-bridge-command-status {
  width: 100%;
  margin: 0;
  border-radius: 8px;
  padding: 10px 12px;
  background: color-mix(in srgb, var(--ok) 10%, #fff);
  color: var(--ink);
}

.hardware-bridge-command-status.pending {
  background: color-mix(in srgb, var(--clay) 12%, #fff);
}

.hardware-bridge-command-status.failed {
  background: color-mix(in srgb, var(--danger) 10%, #fff);
}

.hardware-bridge-card-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.hardware-bridge-card-actions .mini-action {
  justify-self: stretch;
  min-width: 0;
  min-height: 42px;
  padding: 8px 10px;
  border-width: 1px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04);
  line-height: 1.1;
  text-align: center;
  white-space: normal;
}

.hardware-bridge-card-actions .hardware-bridge-action-print {
  border-color: color-mix(in srgb, var(--ok) 44%, var(--line));
  background: color-mix(in srgb, var(--ok) 12%, #fff);
  color: color-mix(in srgb, var(--ok) 70%, #10251a);
}

.hardware-bridge-card-actions .hardware-bridge-action-print:hover,
.hardware-bridge-card-actions .hardware-bridge-action-print:focus-visible {
  background: color-mix(in srgb, var(--ok) 18%, #fff);
}

.hardware-bridge-card-actions .hardware-bridge-action-drawer {
  border-color: color-mix(in srgb, #1f6feb 42%, var(--line));
  background: color-mix(in srgb, #1f6feb 10%, #fff);
  color: #164d9e;
}

.hardware-bridge-card-actions .hardware-bridge-action-drawer:hover,
.hardware-bridge-card-actions .hardware-bridge-action-drawer:focus-visible {
  background: color-mix(in srgb, #1f6feb 16%, #fff);
}

.hardware-bridge-card-actions .hardware-bridge-action-health {
  border-color: color-mix(in srgb, #c026d3 40%, var(--line));
  background: color-mix(in srgb, #c026d3 10%, #fff);
  color: #8a1a9b;
}

.hardware-bridge-card-actions .hardware-bridge-action-health:hover,
.hardware-bridge-card-actions .hardware-bridge-action-health:focus-visible {
  background: color-mix(in srgb, #c026d3 16%, #fff);
}

.hardware-bridge-card-actions .mini-action:disabled {
  opacity: .62;
  box-shadow: none;
}

.hardware-bridge-revoke-hint {
  width: 100%;
  margin: 0;
  line-height: 1.45;
}

.mobile-activation-card {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.mobile-pwa-help {
  display: grid;
  gap: 14px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--line));
  border-radius: 8px;
  padding: 18px;
  background: color-mix(in srgb, var(--brand) 5%, #fff);
}

.mobile-pwa-help__intro {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.mobile-pwa-help__intro > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  color: var(--brand);
  background: color-mix(in srgb, var(--brand) 10%, #fff);
}

.mobile-pwa-help h4,
.mobile-pwa-help p {
  margin: 0;
}

.mobile-pwa-help h4 {
  font-size: 1rem;
}

.mobile-pwa-help p {
  color: var(--muted);
  line-height: 1.45;
}

.mobile-pwa-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.mobile-pwa-steps article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.mobile-pwa-steps strong {
  display: block;
  margin-bottom: 5px;
}

.mobile-activation-form {
  grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(180px, auto);
  align-items: end;
}

.mobile-activation-output {
  display: grid;
  grid-template-columns: minmax(176px, 220px) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--line));
  border-radius: 8px;
  padding: 18px;
  background: #fbfdfc;
}

.mobile-qr-frame,
.qr-placeholder {
  display: grid;
  place-items: center;
  width: min(100%, 220px);
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.mobile-qr-frame svg {
  display: block;
  width: 92%;
  height: 92%;
}

.qr-placeholder {
  color: var(--brand);
  font-size: 2rem;
  font-weight: 900;
}

.mobile-activation-details {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.mobile-activation-details strong,
.mobile-activation-details p {
  margin: 0;
  overflow-wrap: anywhere;
}

.mini-action.danger {
  color: var(--danger);
  border-color: rgba(140, 63, 53, 0.35);
}

.device-panel h3 {
  margin: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--soft-line);
}

.device-list {
  display: grid;
  gap: 10px;
}

.device-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fbfdfc;
}

.device-card.degraded {
  border-left-color: var(--clay);
}

.device-card.active,
.device-card.online {
  border-left-color: var(--brand);
}

.device-card.blocked,
.device-card.replaced {
  border-left-color: var(--danger);
}

.device-card.failed,
.device-card.offline {
  border-left-color: var(--danger);
}

.device-card strong,
.device-card span,
.device-card p {
  overflow-wrap: anywhere;
}

.fiscal-regime-panel {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.vat-regime-card {
  border-left-color: var(--clay);
  background: var(--surface);
}

.vat-regime-card p,
.vat-regime-card small {
  display: block;
  margin: 4px 0 0;
  color: var(--muted);
}

.tap-config {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  min-width: 0;
}

.tap-config-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(39, 54, 54, .045);
}

.tap-panel-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  min-width: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--soft-line);
}

.tap-panel-heading strong {
  display: block;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.2;
}

.tap-panel-heading p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.35;
}

.tap-config-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.tap-config-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.tap-config-form label > span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.tap-config-form input,
.tap-config-form select {
  min-width: 0;
  width: 100%;
}

.tap-config-form .toggle-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
}

.tap-config-form .toggle-line input {
  width: auto;
}

.tap-config-form .management-action {
  grid-column: 1 / -1;
}

.tap-config-list {
  display: grid;
  gap: 10px;
  min-width: 0;
  color: var(--muted);
}

@media (min-width: 980px) {
  .tap-config {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tap-config-panel:first-child {
    grid-column: 1 / -1;
  }
}

.device-card > div:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.device-card span {
  display: block;
  color: var(--muted);
  font-size: .9rem;
  font-weight: 760;
}

.agent-package-card,
.agent-test-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 12px;
  min-width: 0;
  min-height: 150px;
  padding: 16px;
  background: #fff;
}

.agent-package-card {
  min-height: 164px;
}

.agent-package-card.is-coming,
.agent-test-card.is-coming {
  color: color-mix(in srgb, var(--ink) 70%, #fff);
  background: color-mix(in srgb, #fff 88%, var(--line));
  border-left-color: color-mix(in srgb, var(--muted) 34%, var(--line));
}

.agent-item-header {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.agent-item-title {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.agent-package-card .agent-item-title strong,
.agent-test-card .agent-item-title strong {
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
  line-height: 1.25;
}

.agent-package-card .agent-item-status,
.agent-test-card .agent-item-status {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 780;
  line-height: 1.25;
  overflow-wrap: normal;
}

.agent-package-card .status-pill,
.agent-test-card .status-pill {
  width: fit-content;
  max-width: 100%;
}

.agent-package-card .muted,
.agent-test-card .muted {
  align-self: start;
  min-width: 0;
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
  overflow-wrap: normal;
  word-break: normal;
}

.agent-card-icon,
.device-card .agent-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  color: var(--brand);
  background: color-mix(in srgb, var(--brand) 10%, #fff);
}

.agent-card-icon .lucide-icon {
  width: 19px;
  height: 19px;
}

.agent-package-card.is-coming .agent-card-icon,
.agent-test-card.is-coming .agent-card-icon {
  color: color-mix(in srgb, var(--muted) 78%, #000);
  background: color-mix(in srgb, var(--line) 55%, #fff);
}

.agent-package-card .mini-action,
.agent-test-card .mini-action {
  align-self: end;
  justify-self: start;
  min-height: 38px;
}

.agent-package-card .mini-action[disabled],
.agent-test-card .mini-action[disabled] {
  opacity: 0.72;
  cursor: not-allowed;
}

.status-badge {
  display: inline-flex;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  border-radius: 999px;
  padding: 4px 10px;
  background: #eef2f4;
  color: var(--steel);
  font-size: .82rem;
  font-weight: 850;
}

.status-badge.active,
.status-badge.online,
.status-badge.ok {
  background: #e2f6ed;
  color: var(--brand-dark);
}

.status-badge.blocked,
.status-badge.replaced,
.status-badge.failed {
  background: #fff0ec;
  color: var(--danger);
}

.product-admin-card {
  grid-template-columns: 52px minmax(0, 1fr) minmax(140px, auto);
}

.product-admin-card .product-icon {
  width: 44px;
  height: 44px;
  margin: 0;
}

.product-admin-body {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.product-admin-body strong {
  font-size: .95rem;
  line-height: 1.2;
}

.product-admin-body span {
  font-weight: 650;
}

.cash-count-form {
  display: grid;
  gap: 10px;
}

.cash-count-form .cash-reason,
.cash-count-form button {
  grid-column: 1 / -1;
}

.device-result,
.cash-count-result {
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
  overflow-wrap: anywhere;
}

.badge-print-actions {
  display: grid;
  grid-template-columns: minmax(120px, 180px) repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.badge-print-actions[hidden] {
  display: none;
}

.badge-qr-preview {
  width: 112px;
  min-height: 112px;
}

.badge-qr-preview svg {
  display: block;
  width: 112px;
  height: 112px;
}

.subscription-summary {
  border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--line));
  border-radius: 8px;
  padding: 12px;
  background: var(--tile-tint);
  font-weight: 760;
}

.module-usage-heading,
.module-usage-row,
.module-usage-meta {
  min-width: 0;
}

.module-usage-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: baseline;
}

.module-usage-heading strong {
  font-weight: 850;
}

.module-usage-heading span,
.module-usage-empty {
  color: var(--muted);
  font-size: .9rem;
}

.module-usage-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.module-usage-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(116px, .28fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
  border-radius: 8px;
  padding: 9px 12px;
  background: color-mix(in srgb, var(--tile-tint) 30%, #fff);
}

.module-usage-row.warning {
  border-color: color-mix(in srgb, #b58c59 34%, var(--line));
  background: #fffaf0;
}

.module-usage-row.critical,
.module-usage-row.exhausted {
  border-color: color-mix(in srgb, #a6423a 34%, var(--line));
  background: #fff7f6;
}

.module-usage-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.module-usage-main strong,
.module-usage-main span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.module-usage-main span,
.module-usage-meta {
  color: var(--muted);
  font-size: .86rem;
}

.usage-meter {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(in srgb, var(--line) 72%, #fff);
}

.usage-meter span {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: var(--brand);
}

.module-usage-row.warning .usage-meter span {
  background: #b58c59;
}

.module-usage-row.critical .usage-meter span,
.module-usage-row.exhausted .usage-meter span {
  background: #a6423a;
}

.module-usage-meta {
  display: grid;
  gap: 3px;
  justify-items: end;
  white-space: nowrap;
}

.usage-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 0;
  background: transparent;
  color: var(--brand-dark);
  font-weight: 820;
}

.usage-status.warning {
  color: #7a5525;
}

.usage-status.critical,
.usage-status.exhausted {
  color: #8f2c25;
}

.module-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

.module-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  height: 100%;
  min-height: 244px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}

.module-card.active {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--line));
  background: var(--tile-tint);
}

.module-card.pending-cancel {
  border-color: #b58c59;
  background: #fffaf0;
}

.module-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  margin-top: 6px;
}

.module-status-pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 28px;
  border-radius: 999px;
  padding: 4px 9px;
  background: var(--surface);
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.module-status-pill.active {
  background: color-mix(in srgb, var(--brand) 12%, #fff);
  color: var(--brand-dark);
}

.module-status-pill.warning {
  background: #fff6e7;
  color: #7a5525;
}

.module-status-pill.expired {
  background: #ffece9;
  color: #8f2c25;
}

.module-card-usage {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.module-card-usage .module-usage-heading {
  align-items: start;
  gap: 16px;
}

.module-card-usage .module-usage-heading span {
  max-width: 64%;
  text-align: right;
  line-height: 1.35;
}

.module-card-usage .module-usage-row {
  padding: 9px 12px;
}

.module-card header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
}

.module-card-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--tile-tint);
  color: var(--brand-dark);
}

.module-card-icon .lucide-icon {
  width: 20px;
  height: 20px;
  stroke-width: 2.15;
}

.module-title-block {
  display: grid;
  gap: 5px;
  flex: 1 1 auto;
  min-width: 0;
}

.module-card h3 {
  margin: 0;
  font-size: 1rem;
}

.module-card p {
  color: var(--muted);
  font-size: .9rem;
}

.module-category,
.module-description {
  margin: 0;
}

.module-description {
  line-height: 1.45;
  min-height: 3.95em;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.module-price {
  color: var(--brand-dark);
  font-weight: 850;
  white-space: nowrap;
}

.module-card button {
  min-height: 44px;
  font-weight: 800;
}

.module-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 8px;
  margin-top: auto;
}

.module-actions button:only-child {
  grid-column: 1 / -1;
}

.module-usage-modal[hidden],
.module-checkout-modal[hidden],
.prepaid-topup-modal[hidden],
.byo-postgres-modal[hidden] {
  display: none;
}

.module-usage-modal,
.module-checkout-modal,
.prepaid-topup-modal,
.byo-postgres-modal {
  position: fixed;
  inset: 0;
  z-index: 82;
  display: grid;
  place-items: center;
  padding: clamp(10px, 2vw, 24px);
}

.module-usage-backdrop,
.module-checkout-backdrop,
.prepaid-topup-backdrop,
.byo-postgres-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12, 20, 20, .42);
}

.module-usage-dialog,
.module-checkout-dialog,
.prepaid-topup-dialog,
.byo-postgres-dialog {
  position: relative;
  display: grid;
  gap: 12px;
  width: min(560px, 100%);
  max-height: min(92vh, 720px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 36, 34, .22);
}

.module-usage-dialog {
  width: min(760px, 100%);
}

.module-usage-modal-body {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.module-usage-modal-body .module-card-usage {
  border: 0;
  padding: 0;
  background: transparent;
}

.module-checkout-dialog label,
.prepaid-topup-dialog label,
.byo-postgres-card label {
  display: grid;
  gap: 6px;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
}

.byo-postgres-dialog {
  width: min(1120px, 100%);
  max-height: min(92vh, 860px);
  background: var(--surface);
}

.byo-postgres-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: end;
}

.byo-postgres-status-grid,
.byo-postgres-workspace,
.byo-postgres-form-grid,
.byo-postgres-checks {
  display: grid;
  min-width: 0;
}

.byo-postgres-status-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.byo-postgres-kpi,
.byo-postgres-card,
.byo-postgres-check {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}

.byo-postgres-kpi {
  display: grid;
  gap: 7px;
}

.byo-postgres-kpi span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.byo-postgres-kpi strong {
  overflow-wrap: anywhere;
}

.byo-postgres-kpi.good {
  border-color: color-mix(in srgb, var(--brand) 42%, var(--line));
  background: color-mix(in srgb, var(--brand) 8%, #fff);
}

.byo-postgres-kpi.blocked {
  border-color: color-mix(in srgb, #a6423a 32%, var(--line));
  background: #fff7f6;
}

.byo-postgres-checks {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.byo-postgres-check {
  display: grid;
  gap: 4px;
}

.byo-postgres-check.passed {
  border-color: color-mix(in srgb, var(--brand) 35%, var(--line));
}

.byo-postgres-check.blocked {
  border-color: color-mix(in srgb, #b58c59 35%, var(--line));
  background: #fffaf0;
}

.byo-postgres-check strong,
.byo-postgres-check span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.byo-postgres-check span {
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.35;
}

.byo-postgres-workspace {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.byo-postgres-card {
  display: grid;
  gap: 12px;
}

.byo-postgres-card h4 {
  margin: 0;
}

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

.byo-postgres-card input,
.byo-postgres-card select {
  min-width: 0;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
}

.byo-postgres-toggle {
  display: flex !important;
  align-items: center;
  gap: 9px;
  color: var(--text) !important;
  text-transform: none !important;
}

.byo-postgres-toggle input {
  min-height: auto;
  accent-color: var(--brand);
}

.module-checkout-period {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  border: 0;
  padding: 0;
  margin: 0;
}

.module-checkout-period legend {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 850;
  text-transform: uppercase;
}

.module-checkout-period label {
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  text-transform: none;
}

.module-checkout-period input {
  accent-color: var(--brand);
}

.module-checkout-quantity input {
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
}

.module-checkout-details,
.prepaid-topup-details {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
  color: var(--text);
  font-weight: 760;
}

.capture-admin-modal[hidden] {
  display: none;
}

.capture-admin-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: clamp(10px, 2vw, 24px);
}

.capture-admin-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12, 20, 20, .42);
}

.capture-admin-dialog {
  position: relative;
  display: grid;
  gap: 14px;
  width: min(1180px, 100%);
  max-height: min(860px, calc(100vh - 24px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 24px 70px rgba(15, 27, 26, .26);
  padding: clamp(14px, 2vw, 22px);
  min-width: 0;
}

.capture-dialog-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  min-width: min(100%, 440px);
}

.capture-dialog-actions select {
  min-width: 0;
}

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

.capture-kpi,
.capture-settings-card,
.capture-credit-card,
.capture-audit-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
  min-width: 0;
}

.capture-kpi {
  display: grid;
  gap: 8px;
}

.capture-kpi span,
.capture-kpi small,
.capture-card-header p,
.capture-credit-card p {
  color: var(--muted);
}

.capture-kpi strong {
  font-size: clamp(1.25rem, 2vw, 1.8rem);
}

.capture-admin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, .8fr);
  gap: 14px;
  align-items: start;
  min-width: 0;
}

.capture-settings-card,
.capture-credit-card {
  display: grid;
  gap: 12px;
}

.capture-card-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
}

.capture-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  white-space: nowrap;
}

.capture-side-stack {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.capture-rights-table {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.capture-rights-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) repeat(4, minmax(76px, .38fr));
  gap: 8px;
  align-items: center;
  border: 1px solid var(--soft-line);
  border-radius: 8px;
  padding: 10px;
  min-width: 0;
}

.capture-rights-row.header {
  border: 0;
  padding-block: 0;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.capture-rights-row.inactive {
  opacity: .58;
}

.capture-rights-row strong,
.capture-rights-row small {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.capture-checkbox {
  display: flex;
  justify-content: center;
}

.capture-checkbox input {
  width: 24px;
  height: 24px;
}

.capture-audit-card {
  max-height: 260px;
  overflow: auto;
}

.capture-audit-row {
  display: grid;
  gap: 3px;
  border-bottom: 1px solid var(--soft-line);
  padding: 9px 0;
  overflow-wrap: anywhere;
}

.capture-audit-row:last-child {
  border-bottom: 0;
}

.capture-audit-row span {
  color: var(--muted);
  font-size: .86rem;
}

.rail-group h2 {
  margin-top: 0;
}

.rail-group.manage {
  align-self: end;
}

.receipt-preview {
  min-height: 0;
  overflow-y: auto;
  overflow-x: clip;
}

.rail-action {
  border: 0;
  font-weight: 800;
}

.rail-action.gift {
  background: var(--clay);
}

.hero.compact {
  margin-top: 18px;
  border: 0;
  padding: 0;
}

.eyebrow {
  margin: 0 0 12px;
  color: var(--brand);
  font-weight: 800;
  text-transform: uppercase;
  font-size: .78rem;
  letter-spacing: 0;
}

.summary,
.portal,
.catalog,
.pos-support,
.finance,
.inventory {
  display: grid;
  gap: 16px;
  padding-top: 16px;
}

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

.portal {
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
}

.catalog {
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
}

.pos-support {
  grid-template-columns: minmax(0, 1fr);
}

.finance {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
}

.inventory {
  grid-template-columns: minmax(0, 1fr) minmax(280px, .75fr);
  align-items: start;
}

.summary article,
.panel,
.receipt-preview,
.finance-panel,
.inventory-panel {
  min-width: 0;
  min-height: 150px;
  padding: 18px;
  background: rgba(255, 255, 255, .82);
}

.panel {
  min-height: 240px;
}

h3 {
  margin: 0;
  font-size: .95rem;
}

p {
  margin: 0;
}

.metric {
  display: block;
  margin-bottom: 8px;
  font-size: clamp(1.45rem, 3vw, 2.3rem);
  line-height: 1.05;
  font-weight: 760;
}

.steps {
  display: grid;
  gap: 10px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.steps li {
  border-left: 4px solid var(--line);
  padding: 8px 0 8px 12px;
}

.steps .complete {
  border-left-color: var(--brand);
}

.steps .open {
  border-left-color: var(--clay);
}

.role,
.product,
.vat,
.receipt-line,
.finance-item,
.inventory-item {
  min-height: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--panel);
}

.role p,
.product p,
.vat p {
  margin-top: 2px;
  color: var(--muted);
}

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

.price,
.stock-number {
  color: var(--brand);
  font-weight: 800;
  white-space: nowrap;
}

.receipt-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  min-height: 52px;
  align-items: center;
}

.finance-item {
  min-height: 56px;
}

.inventory-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  min-height: 64px;
  align-items: center;
}

.inventory-alert-button {
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.inventory-alert-button:hover,
.inventory-alert-button:focus-visible {
  border-color: var(--brand);
  background: var(--tile-tint);
  outline: none;
}

.inventory-item.low {
  border-left: 5px solid var(--clay);
}

.purchase-order-list {
  display: grid;
  gap: 8px;
  max-height: 320px;
  overflow-y: auto;
  border-top: 1px solid var(--soft-line);
  padding-top: 10px;
  color: var(--muted);
}

.purchase-order-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
}

.purchase-order-item > div {
  min-width: 0;
}

.purchase-order-item strong {
  overflow-wrap: anywhere;
}

.purchase-order-item span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.purchase-order-item .card-actions {
  justify-content: end;
}

.purchase-order-item .card-actions .mini-action {
  flex: 0 1 112px;
}

code {
  font-size: .92em;
}

@media (max-width: 1280px) {
  .cart-pane > .pane-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .cart-tools {
    justify-self: end;
    margin-top: 2px;
  }

  .purchasing-work-grid,
  .purchasing-secondary-grid {
    grid-template-columns: 1fr;
  }

  .shop-context-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shop-location-card,
  .shop-management-grid {
    grid-template-columns: 1fr;
  }

  .supplier-editor-form,
  .purchase-order-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .activation-context-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .cart-tools {
    gap: 6px;
  }

  .cart-icon-button {
    flex-basis: 46px;
    width: 46px;
    min-width: 46px;
    max-width: 46px;
    min-height: 46px;
  }

  .cart-icon-button .lucide-icon {
    width: 21px;
    height: 21px;
  }

  .cart-icon-button strong {
    top: 3px;
    right: 4px;
    min-width: 17px;
    padding: 1px 4px;
    font-size: .66rem;
  }
}

@media (max-width: 1180px) {
  .topbar {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .topbar-actions {
    justify-self: end;
  }

  .pos-workspace {
    grid-template-columns: minmax(0, 1.05fr) minmax(340px, .8fr);
  }

  .retail-media-header .retail-media-card {
    height: 64px;
  }

  .retail-media-card span {
    display: none;
  }

  .admin-task-grid {
    grid-template-columns: repeat(3, minmax(128px, 1fr));
  }
}

@media (max-width: 640px) {
  .realtime-call-panel {
    right: 8px;
    bottom: 8px;
    left: 8px;
    width: auto;
    max-height: min(72dvh, 620px);
    padding: 12px;
  }

  .realtime-call-panel[data-call-layout="fullscreen"] {
    inset: 8px;
    max-height: none;
  }

  .realtime-call-panel[data-call-layout="fullscreen"] .realtime-video-main {
    min-height: calc(100dvh - 360px);
  }

  .realtime-call-panel .segmented-control {
    grid-template-columns: minmax(0, 1fr);
  }

  .realtime-call-panel .segmented-control button {
    min-height: 56px;
  }

  .realtime-call-panel .segmented-control .mode-hint {
    display: none;
  }

  .realtime-incoming-call {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 1180px), (max-height: 900px) {
  .payment-modal {
    padding: 8px;
    align-items: start;
  }

  .payment-dialog {
    width: min(780px, 100%);
    max-height: calc(100dvh - 16px);
    gap: 8px;
    padding: 10px;
  }

  .payment-dialog .section-heading {
    align-items: start;
  }

  .pos-discount-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .pos-discount-rule-button {
    min-height: 84px;
    align-items: flex-start;
    flex-direction: column;
  }

  .pos-discount-rule-button em {
    align-self: flex-start;
  }

  .payment-summary-grid div,
  .payment-lines-panel,
  .payment-method-panel,
  .receipt-delivery {
    padding: 8px;
  }

  .payment-summary-grid {
    gap: 6px;
  }

  .payment-summary-grid div {
    gap: 2px;
  }

  .payment-summary-grid strong {
    font-size: 1.05rem;
  }

  .payment-method-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 7px;
  }

  .payment-method {
    min-height: 50px;
    padding: 8px 6px;
    font-size: .9rem;
  }

  .payment-lines-panel .admin-table-header {
    margin-bottom: 4px;
  }

  .payment-lines-panel .admin-table-header p,
  .receipt-delivery p {
    display: none;
  }

  .receipt-delivery {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .receipt-delivery-heading {
    min-height: auto;
  }

  .receipt-delivery-options {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .receipt-delivery-options label {
    min-height: 38px;
    padding: 0 8px;
  }

  .receipt-email-field {
    grid-column: 1;
  }

  .cash-tender-row,
  .cash-settlement-row {
    grid-template-columns: minmax(180px, .9fr) minmax(280px, 1.35fr);
  }

  .cash-suggestions {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
  }

  .change-due {
    padding: 9px;
    font-size: 1rem;
  }

  .final-payment-action,
  .payment-method-panel .management-action {
    min-height: 48px;
  }
}

@media (max-width: 860px) {
  .invoice-template-settings,
  .invoice-a4-preview,
  .invoice-control-group,
  .invoice-logo-field,
  .invoice-a4-sheet {
    max-width: 100%;
  }

  .invoice-a4-sheet {
    width: 100%;
    padding: 16px;
  }

  .receipt-template-preview-panel {
    position: static;
  }

  .invoice-logo-field-heading {
    flex-wrap: wrap;
  }

  .session-lock-heading,
  .session-lock-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .app-frame {
    display: block;
    width: min(100% - 16px, 760px);
  }

  .admin-workspace {
    grid-template-columns: 1fr;
    grid-template-areas:
      "header"
      "nav"
      "panel";
  }

  .admin-header {
    position: static;
  }

  .admin-panel .section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-panel .section-heading .mini-action {
    width: 100%;
  }

  .admin-header .ghost-button {
    width: 100%;
  }

  .admin-tabs {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    box-shadow: none;
  }

  .admin-tabs button {
    grid-template-columns: 34px minmax(0, 1fr);
    min-height: 56px;
    padding: 8px;
  }

  .admin-tabs button > strong,
  .admin-tabs button > small {
    white-space: normal;
  }

  .admin-nav-footer {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-task-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .shell {
    min-height: auto;
  }

  .device-gate,
  .device-activation-form {
    grid-template-columns: 1fr;
  }

  .side-nav {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 60;
    width: min(76vw, 280px);
    min-height: 100dvh;
    margin-top: 0;
    transform: translateX(calc(-100% - 16px));
    transition: transform .18s ease-out;
    border-radius: 0 8px 8px 0;
    padding: 14px 12px;
    overflow-y: auto;
  }

  body.nav-open .side-nav {
    transform: translateX(0);
  }

  .side-nav-item {
    grid-template-columns: 42px minmax(0, 1fr);
    justify-items: start;
    width: 100%;
    min-height: 54px;
    padding: 6px 10px;
  }

  .side-nav-item small {
    font-size: .95rem;
    text-overflow: clip;
    white-space: normal;
  }

  .mobile-backdrop {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: none;
    background: rgba(31, 37, 40, .34);
  }

  body.nav-open .mobile-backdrop {
    display: block;
  }

  .topbar,
  .pos-workspace,
  .summary,
  .portal,
  .catalog,
  .pos-support,
  .finance,
  .inventory {
    grid-template-columns: 1fr;
  }

  .category-icon-card {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .category-icon-controls {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }

  .icon-button {
    display: block;
    position: absolute;
    right: 8px;
    top: 14px;
  }

  .topbar {
    padding-bottom: 6px;
  }

  .topbar-actions {
    position: absolute;
    left: auto;
    right: 68px;
    bottom: auto;
    top: 14px;
  }

  .brand-mark {
    padding-right: 60px;
  }

  .payoff {
    display: none;
  }

  .brand-mark img {
    width: 132px;
    height: 46px;
  }

  .pos-workspace {
    height: auto;
    min-height: 0;
  }

  .pos-input-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .finance-kpis,
  .cash-close-row,
  .admin-domain-grid,
  .admin-work-queue,
  .onboarding-form,
  .branding-form,
  .branding-form-grid,
  .receipt-template-layout,
  .receipt-template-controls,
  .receipt-text-grid,
  .receipt-print-grid,
  .receipt-visibility-grid,
  .invoice-template-layout,
  .invoice-template-controls,
  .invoice-control-fields,
  .invoice-style-row,
  .invoice-side-controls,
  .invoice-visibility-grid,
  .invoice-template-actions,
  .cash-count-form,
  .agent-actions,
  .integration-actions,
  .omnichannel-order-heading,
  .omnichannel-order-toolbar,
  .omnichannel-order-layout,
  .management-grid,
  .management-form,
  .management-form.compact,
  .shop-management-grid,
  .receipt-return-controls,
  .device-layout,
  .integration-layout,
  .inventory-layout,
  .inventory-overview,
  .management-overview,
  .receipt-delivery,
  .receipt-delivery-options,
  .payment-summary-grid,
  .settings-layout,
  .customer-discount-layout,
  .form-grid-2,
  .pos-customer-form,
  .mobile-pwa-steps,
  .module-list {
    grid-template-columns: 1fr;
  }

  .invoice-control-fields,
  .invoice-style-row,
  .invoice-side-controls {
    min-width: 0;
  }

  .brand-color-palette {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .onboarding-explain {
    grid-template-columns: 1fr;
  }

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

  .onboarding-profile-grid {
    grid-template-columns: 1fr;
  }

  .payment-field-row,
  .payment-field-row-3 {
    grid-template-columns: 1fr;
  }

  .webshop-provider-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .omnichannel-order-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .omnichannel-order-detail-meta {
    grid-template-columns: minmax(0, 1fr);
  }

  .omnichannel-order-item-top,
  .omnichannel-order-detail-title {
    grid-template-columns: minmax(0, 1fr);
  }

  .omnichannel-order-status {
    width: fit-content;
    white-space: normal;
  }

  .payment-dialog {
    width: min(620px, 100%);
  }

  .cash-tender-row,
  .cash-settlement-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .cash-tender-row .cash-suggestions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mobile-activation-form,
  .mobile-activation-output {
    grid-template-columns: 1fr;
  }

  .mobile-qr-frame,
  .qr-placeholder {
    width: min(220px, 100%);
    justify-self: center;
  }

  .payment-method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .inventory-catalog,
  .receipt-email-field {
    grid-row: auto;
    grid-column: auto;
  }

  .device-card {
    grid-template-columns: 1fr;
  }

  .product-admin-card {
    grid-template-columns: 44px minmax(0, 1fr);
  }

  .product-admin-card .card-actions {
    grid-column: 1 / -1;
  }

  .receipt-return-line {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .receipt-return-line > strong,
  .receipt-return-line input[type="number"] {
    grid-column: 2;
  }

  .form-actions {
    grid-template-columns: 1fr 1fr;
  }

  .cart-pane {
    position: static;
    grid-template-rows: auto auto auto;
    height: auto;
    min-height: 0;
  }

  .quick-products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: none;
    overflow: visible;
  }

  .cart-lines {
    max-height: none;
    overflow: visible;
  }
}

@media (min-width: 740px) and (max-width: 860px) {
  .payment-dialog {
    width: min(780px, 100%);
  }

  .cash-tender-row,
  .cash-settlement-row {
    grid-template-columns: minmax(180px, .9fr) minmax(280px, 1.35fr);
  }

  .cash-tender-row .cash-suggestions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .invoice-logo-field-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .invoice-logo-picker {
    width: 100%;
  }

  .invoice-logo-upload-preview {
    align-items: flex-start;
    flex-direction: column;
  }

  .invoice-logo-upload-preview img {
    width: min(132px, 100%);
  }
}

@media (max-width: 520px) {
  .app-frame {
    width: min(100% - 12px, 420px);
    padding-top: 8px;
  }

  .shell {
    min-width: 0;
  }

  .topbar {
    position: relative;
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 0;
    gap: 8px;
    border-bottom: 0;
    padding-bottom: 6px;
  }

  .retail-media-header {
    display: none !important;
  }

  .topbar-actions {
    position: absolute;
    left: auto;
    right: 62px;
    bottom: auto;
    top: 14px;
    gap: 6px;
  }

  .topbar-icon-button {
    width: 38px;
    height: 38px;
  }

  .topbar-menu {
    width: min(260px, calc(100vw - 22px));
  }

  .brand-mark {
    padding-right: 60px;
    display: flex;
    gap: 8px;
    align-items: center;
  }

  .brand-mark h1 {
    display: none;
  }

  .brand-mark img {
    width: 122px;
    max-width: 58vw;
    height: 42px;
  }

  .payoff {
    display: none;
  }

  .context-footer {
    gap: 8px;
    margin: 10px 0 0;
    padding: 10px 0 0;
  }

  .register-context {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    font-size: .78rem;
  }

  .register-context span {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .status-strip,
  .sync-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

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

  .register-switcher label {
    min-width: 0;
  }

  .status,
  .sync-pill,
  .queue-button {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    font-size: .82rem;
  }

  .sync-pill small {
    font-size: .68rem;
  }

  .admin-workspace {
    gap: 10px;
  }

  .admin-header,
  .admin-tabs,
  .admin-panel {
    padding: 10px;
  }

  body.admin-open .admin-panel {
    padding-bottom: 96px;
  }

  body.admin-open .admin-assistant-fab {
    display: none;
  }

  .admin-tabs {
    grid-template-columns: 1fr;
  }

  .admin-nav-footer,
  .admin-task-grid {
    grid-template-columns: 1fr;
  }

  .admin-task-card {
    min-height: 62px;
  }

  .category-tabs button {
    min-width: 96px;
    padding-inline: 14px;
  }

  .profile-filter-group {
    max-width: 92vw;
  }

  .profile-filter-label {
    display: none;
  }

  .profile-filter-pill {
    min-height: 38px;
    padding-inline: 12px;
  }

  .quick-products {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .product-tile {
    grid-template-rows: auto;
    min-height: 82px;
    text-align: left;
  }

  .product-tile-action {
    grid-template-columns: 52px minmax(0, 1fr) auto;
    grid-template-rows: auto;
    align-items: center;
    min-height: 82px;
    padding-right: 54px;
    text-align: left;
  }

  .product-info-body,
  .product-info-list div {
    grid-template-columns: minmax(0, 1fr);
  }

  .product-info-visual {
    min-height: 96px;
  }

  .product-icon {
    margin: 0;
  }

  .cart-line {
    grid-template-columns: 128px minmax(0, 1fr) 32px;
    min-height: 92px;
  }

  .pos-omnichannel-pickup-search,
  .pos-omnichannel-pickup-complete,
  .pos-omnichannel-pickup-title,
  .pos-omnichannel-pickup-meta,
  .omnichannel-order-return-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .payment-method-grid,
  .cash-suggestions {
    grid-template-columns: 1fr;
  }

  .cash-tender-row .cash-suggestions {
    grid-template-columns: 1fr;
  }

  .remove-line {
    grid-column: 3;
    grid-row: 1;
  }

  .line-price {
    grid-column: 2 / 3;
    justify-self: end;
  }

  .payment-stack {
    display: grid;
  }
}

@media (max-width: 1040px) {
  body.admin-open .admin-header {
    grid-template-columns: 150px minmax(0, 1fr) auto;
    grid-auto-rows: auto;
  }

  body.admin-open .admin-logo {
    width: 136px;
    height: 38px;
  }

  .admin-global-search,
  body.admin-open .admin-context-card {
    display: none;
  }

  .admin-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-topic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-payment-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rate-limit-admin-summary,
  .rate-limit-policy-grid,
  .security-events-summary,
  .security-policy-explainer,
  .security-policy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .staff-capacity-overview {
    grid-template-columns: minmax(0, 1fr);
  }

  .staff-capacity-metrics,
  .staff-slot-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .capture-wallet-grid,
  .capture-admin-grid {
    grid-template-columns: 1fr;
  }

  .capture-rights-row {
    grid-template-columns: minmax(160px, 1fr) repeat(4, minmax(64px, .32fr));
  }

  .admin-dashboard-grid,
  .stock-work-grid,
  .management-report-grid,
  .management-report-grid.secondary,
  .omnichannel-report-heading,
  .omnichannel-report-kpis,
  .omnichannel-report-grid,
  .purchasing-work-grid,
  .purchasing-secondary-grid,
  .day-close-wizard-body {
    grid-template-columns: 1fr;
  }

  .day-close-denominations {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .supplier-editor-form,
  .purchase-order-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .cart-context-panel,
  .cart-fulfillment-panel,
  .cart-fulfillment-summary,
  .cart-fulfillment-actions,
  .customer-voucher-form,
  .customer-loyalty-form,
  .customer-giftcard-form,
  .customer-store-credit-form,
  .loyalty-wallet-grid,
  .loyalty-wallet-admin-lists,
  .wallet-admin-row,
  .transportation-policy-toolbar,
  .transportation-policy-row {
    grid-template-columns: 1fr;
  }

  .supplier-editor-form,
  .purchase-order-form {
    grid-template-columns: 1fr;
  }

  .purchasing-form-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .purchasing-form-actions .check-row {
    margin-right: 0;
  }

  .line-transportation-select {
    grid-template-columns: 1fr;
    max-width: 100%;
  }

  .staff-capacity-metrics,
  .staff-slot-list {
    grid-template-columns: 1fr;
  }

  body.admin-open .admin-workspace {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto minmax(0, 1fr);
    grid-template-areas:
      "header"
      "nav"
      "panel";
  }

  body.admin-open .admin-header {
    position: static;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 10px;
  }

  body.admin-open .admin-title-block {
    display: none;
  }

  .purchase-order-item {
    grid-template-columns: 1fr;
  }

  .purchase-order-item .card-actions {
    justify-content: stretch;
  }

  .capture-wallet-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rate-limit-admin-summary,
  .rate-limit-policy-grid,
  .rate-limit-policy-metrics,
  .security-events-summary,
  .security-events-toolbar,
  .security-event-meta,
  .security-policy-explainer,
  .security-policy-grid,
  .security-policy-metrics,
  .security-policy-adapter-plans,
  .fulfillment-toolbar,
  .fulfillment-row,
  .sso-explainer,
  .sso-action-grid {
    grid-template-columns: 1fr;
  }

  .fulfillment-actions {
    justify-content: stretch;
  }

  .fulfillment-actions .mini-action {
    flex: 1 1 150px;
  }

  .capture-rights-row,
  .capture-rights-row.header {
    grid-template-columns: minmax(140px, 1fr) repeat(3, 52px);
  }

  .capture-rights-row > :last-child,
  .capture-rights-row.header > :last-child {
    display: none;
  }

  .capture-card-header {
    display: grid;
  }

  .day-close-wizard-grid,
  .day-close-wizard-kpis,
  .day-close-denominations {
    grid-template-columns: 1fr;
  }

  .capture-dialog-actions {
    display: grid;
    min-width: 0;
  }

  .module-list,
  .module-checkout-period,
  .module-actions,
  .module-usage-row,
  .byo-postgres-status-grid,
  .byo-postgres-checks,
  .byo-postgres-workspace,
  .byo-postgres-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .byo-postgres-actions {
    justify-content: stretch;
  }

  .byo-postgres-actions .mini-action {
    width: 100%;
  }

  .module-usage-main strong,
  .module-usage-main span {
    white-space: normal;
  }

  .module-usage-meta {
    justify-items: start;
    white-space: normal;
  }

  .module-card header {
    display: grid;
  }

  .reports-toolbar,
  .reports-toolbar .section-actions {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
  }

  .report-period-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-payment-strip {
    grid-template-columns: 1fr;
  }

  .module-card-usage .module-usage-heading {
    display: grid;
  }

  .module-card-usage .module-usage-heading span {
    max-width: none;
    text-align: left;
  }

  .shop-context-summary {
    grid-template-columns: 1fr;
  }

  .shop-location-card,
  .shop-register-toolbar {
    grid-template-columns: 1fr;
  }

  body.admin-open .admin-tabs {
    position: static;
    display: flex;
    height: auto;
    overflow-x: auto;
    overflow-y: hidden;
    border-right: 0;
    border-bottom: 1px solid #dce4e1;
    padding: 8px;
  }

  body.admin-open .admin-tabs button {
    flex: 0 0 auto;
    width: auto;
    min-width: 126px;
  }

  body.admin-open .admin-nav-footer {
    display: flex;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
    border: 0;
  }

  body.admin-open .admin-panel {
    min-height: auto;
    padding: 14px 10px 24px;
  }

  .admin-kpi-grid,
  .admin-topic-grid,
  .finance-kpis,
  .admin-table-toolbar,
  .pos-catalog-display-settings,
  .activation-actions {
    grid-template-columns: 1fr;
  }

  .segmented-control {
    width: 100%;
    grid-auto-flow: row;
  }

  .segmented-control label {
    min-width: 0;
  }

  .admin-data-table {
    min-width: 760px;
  }

  .admin-drawer {
    width: 100%;
  }

  [data-testid="product-drawer"] {
    top: 12px;
    right: 12px;
    bottom: 12px;
    width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
  }
}

@media (max-width: 1180px) {
  [data-testid="agent-package-list"],
  [data-testid="agent-adapter-list"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tap-config {
    grid-template-columns: minmax(0, 1fr);
  }

  .module-usage-list,
  .module-list {
    grid-template-columns: minmax(0, 1fr);
  }

  .module-usage-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .module-usage-meta {
    justify-items: start;
  }
}

@media (max-width: 680px) {
  .inventory-ops-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .inventory-ops-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .inventory-mutation-context,
  .inventory-mutation-form,
  .inventory-history-item {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-testid='inventory-stock-table'] table,
  [data-testid='inventory-stock-table'] tbody,
  [data-testid='inventory-stock-table'] tr,
  [data-testid='inventory-stock-table'] td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  [data-testid='inventory-stock-table'] thead {
    display: none;
  }

  [data-testid='inventory-stock-table'] tr {
    border-bottom: 1px solid var(--soft-line);
    padding: 12px 0;
  }

  [data-testid='inventory-stock-table'] td {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    align-items: start;
    border-bottom: 0;
    padding: 6px 0;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  [data-testid='inventory-stock-table'] td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
  }

  [data-testid='inventory-stock-table'] td[data-label='Acties'] {
    grid-template-columns: 1fr;
  }

  [data-testid='inventory-stock-table'] td[data-label='Acties']::before {
    content: "";
    display: none;
  }

  .stock-row-actions .mini-action {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 40px;
  }

  .stock-row-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .tap-config-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .tap-panel-heading {
    grid-template-columns: minmax(0, 1fr);
  }

  .hardware-bridge-card .agent-context-form,
  .agent-context-form,
  [data-testid="agent-package-list"],
  [data-testid="agent-adapter-list"],
  .hardware-bridge-status-body,
  .hardware-bridge-status-metrics {
    grid-template-columns: minmax(0, 1fr);
  }

  .agent-card-heading,
  .agent-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .hardware-bridge-status-header {
    align-items: stretch;
    flex-direction: column;
  }

  .hardware-bridge-identity-panel {
    padding-right: 0;
  }

  .hardware-bridge-card-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .delete-confirm-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}