@import url('./src/modules/pickup-workflow/styles.css?v=20260912courier2');
@import url('./src/modules/login-security/styles.css?v=20260912courier2');
@import url('./src/modules/agency-access/styles.css?v=20260912courier2');

:root {
  --ink: #112262;
  --ink-soft: #4b577c;
  --ink-faint: #727c99;
  --paper: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f5f7fb;
  --line: #e3e7f0;
  --line-strong: #cbd2e1;
  --brand: #ffcc05;
  --brand-dark: #112262;
  --brand-yellow: #ffcc05;
  --brand-blue: #112262;
  --brand-soft: #fff8d6;
  --forest: #112262;
  --forest-soft: #1b327c;
  --lime: #ffcc05;
  --success: #16835b;
  --warning: #ad6a00;
  --danger: #b93a38;
  --shadow-sm: 0 1px 2px rgb(17 34 98 / 5%), 0 4px 14px rgb(17 34 98 / 4%);
  --shadow-lg: 0 24px 70px rgb(17 34 98 / 12%);
  --radius-sm: 9px;
  --radius-md: 13px;
  --radius-lg: 22px;
  --sidebar-width: 220px;
  font-family: Inter, "SF Pro Text", "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

.commission-rules-page {
  display: grid;
  gap: 1rem;
}

.commission-rules-form {
  display: grid;
  gap: 1rem;
}

.commission-rule-group {
  display: grid;
  gap: .65rem;
}

.commission-rule-group h2,
.commission-rule-group p {
  margin: 0;
}

.commission-rule-input {
  box-sizing: border-box;
  width: 100%;
  min-width: 7rem;
  padding: .7rem .75rem;
  border: 1px solid var(--line, #d8deea);
  border-radius: .65rem;
  font: inherit;
}

.commission-rule-grid,
.commission-rule-grid__body {
  display: grid;
  gap: .5rem;
}

.commission-rule-grid__row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
  align-items: center;
}

.commission-rule-grid__head {
  padding: 0 .25rem;
  color: var(--ink-soft);
  font-size: .78rem;
  font-weight: 700;
}

@media (max-width: 640px) {
  .commission-rule-grid__row {
    grid-template-columns: 1fr;
  }

  .commission-rule-grid__head {
    display: none;
  }
}

.commission-rules-actions {
  display: flex;
  justify-content: flex-end;
}

.commission-rules-feedback {
  min-height: 1.4rem;
  margin: 0;
}


*,
*::before,
*::after {
  box-sizing: border-box;
}

/*
 * `hidden` is an application state, not a styling hint. Author-level button,
 * grid and flex rules must never override the browser's default hiding rule.
 */
[hidden] {
  display: none !important;
}

html {
  min-width: 320px;
  min-height: 100%;
  background: var(--paper);
}

body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Shared numbered pagination */

nav.app-pagination {
  display: flex;
  min-height: 54px;
  padding: 9px 14px;
  border-top: 1px solid #e4e8f0;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #fff;
}

nav.app-pagination[hidden] {
  display: none;
}

.app-pagination__pages {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.app-pagination__arrow,
.app-pagination__page {
  display: inline-grid;
  min-width: 36px;
  height: 36px;
  padding: 0 9px;
  border: 1px solid #d7deeb;
  border-radius: 9px;
  place-items: center;
  background: #fff;
  color: #34415f;
  box-shadow: 0 1px 2px rgb(17 34 98 / 4%);
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  line-height: 1;
  transition: border-color 140ms ease, background 140ms ease, color 140ms ease, box-shadow 140ms ease;
}

.app-pagination__arrow {
  font-size: 1.2rem;
}

.app-pagination__arrow:hover:not(:disabled),
.app-pagination__page:hover:not(:disabled) {
  border-color: #8492b2;
  background: #f7f9fd;
  box-shadow: 0 3px 9px rgb(17 34 98 / 9%);
}

.app-pagination__arrow:focus-visible,
.app-pagination__page:focus-visible {
  outline: 3px solid rgb(17 34 98 / 14%);
  outline-offset: 2px;
}

.app-pagination__page--current {
  border-color: var(--brand-dark);
  background: var(--brand-dark);
  color: #fff;
  box-shadow: 0 5px 12px rgb(17 34 98 / 18%);
}

.app-pagination__arrow:disabled,
.app-pagination__page:disabled {
  cursor: default;
  opacity: 0.42;
}

.app-pagination__page--current:disabled {
  opacity: 1;
}

.app-pagination__ellipsis {
  min-width: 18px;
  color: #7b859b;
  font-size: 0.78rem;
  font-weight: 700;
  text-align: center;
}

@media (max-width: 520px) {
  .app-pagination {
    padding-inline: 8px;
    gap: 5px;
  }

  .app-pagination__pages { gap: 4px; }

  .app-pagination__arrow,
  .app-pagination__page {
    min-width: 34px;
    height: 34px;
    padding-inline: 7px;
  }
}

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

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

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

h1,
h2,
h3 {
  letter-spacing: -0.022em;
}

strong {
  letter-spacing: -0.012em;
}

:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  z-index: 1000;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-lg);
  color: var(--ink);
  font-weight: 700;
  transform: translateY(-180%);
  transition: transform 160ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

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

.eyebrow {
  margin-bottom: 10px;
  color: var(--brand-dark);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.brand-lockup,
.sidebar-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.055em;
}

.brand-accent {
  color: var(--brand);
}

.boot-screen {
  display: grid;
  min-height: 100vh;
  padding: 32px;
  place-content: center;
  background: var(--ink);
  text-align: center;
}

.boot-logo {
  display: block;
  width: min(178px, 72vw);
  height: auto;
  margin-inline: auto;
}

.boot-screen .loading-line {
  background: rgb(255 255 255 / 14%);
}

.loading-line {
  width: min(260px, 72vw);
  height: 3px;
  margin: 28px auto 0;
  overflow: hidden;
  border-radius: 999px;
  background: var(--line);
}

.loading-line span {
  display: block;
  width: 45%;
  height: 100%;
  border-radius: inherit;
  background: var(--brand);
  animation: loading-slide 1.15s ease-in-out infinite alternate;
}

@keyframes loading-slide {
  from { transform: translateX(-5%); }
  to { transform: translateX(130%); }
}

.noscript-message {
  position: fixed;
  right: 16px;
  bottom: 16px;
  left: 16px;
  z-index: 100;
  margin: 0;
  padding: 14px 18px;
  border-radius: var(--radius-sm);
  background: var(--danger);
  color: #fff;
  text-align: center;
  font-weight: 700;
}

/* Login */

.login-layout {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  min-height: 100svh;
  grid-template-columns: minmax(0, 39%) minmax(0, 61%);
  background: #fff;
}

.login-brand-plane {
  position: relative;
  z-index: 0;
  min-height: 100svh;
}

.login-brand-plane::before,
.login-brand-plane::after {
  position: absolute;
  top: 50%;
  bottom: auto;
  left: auto;
  border-radius: 50%;
  content: "";
  pointer-events: none;
  transform: translateY(-50%) rotate(-2deg);
  transform-origin: center;
}

.login-brand-plane::before {
  z-index: -1;
  right: 0;
  width: calc(100% + 20vw);
  height: 128svh;
  background: #112262;
  box-shadow: 20px 28px 72px rgb(17 34 98 / 13%);
}

.login-brand-plane::after {
  z-index: -2;
  right: -1.2vw;
  width: calc(100% + 22vw);
  height: 132svh;
  background: rgb(17 34 98 / 8%);
}

.login-operations-network {
  position: absolute;
  z-index: 1;
  top: 48%;
  left: 48%;
  width: min(64%, 350px);
  max-height: 52svh;
  height: auto;
  filter: drop-shadow(0 18px 28px rgb(4 14 52 / 16%));
  opacity: 0.96;
  transform: translate(-50%, -52%);
}

.login-brand-message {
  position: absolute;
  z-index: 2;
  right: clamp(42px, 7vw, 96px);
  bottom: clamp(54px, 8vh, 88px);
  left: clamp(42px, 5vw, 72px);
  max-width: 390px;
  margin: 0;
  color: #fff;
}

.login-brand-message::before {
  display: block;
  width: 34px;
  height: 3px;
  margin-bottom: 18px;
  border-radius: 99px;
  background: #ffcc05;
  content: "";
}

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

.login-brand-message strong {
  font-size: clamp(1.35rem, 2vw, 1.85rem);
  font-weight: 680;
  letter-spacing: -0.032em;
  line-height: 1.2;
}

.login-brand-message span {
  margin-top: 10px;
  color: rgb(255 255 255 / 68%);
  font-size: 0.72rem;
  font-weight: 620;
  letter-spacing: 0.07em;
  line-height: 1.5;
  text-transform: uppercase;
}

.login-access {
  position: relative;
  z-index: 1;
  display: grid;
  min-width: 0;
  padding: 48px clamp(48px, 7vw, 128px) 56px;
  place-items: center;
  background: transparent;
}

.login-panel {
  width: min(100%, 390px);
  align-self: center;
}

.login-logo {
  position: absolute;
  z-index: 2;
  top: clamp(34px, 5vh, 54px);
  left: clamp(42px, 5vw, 72px);
  display: block;
  width: 178px;
  height: auto;
}

.login-service-name {
  position: absolute;
  z-index: 2;
  top: clamp(101px, calc(5vh + 66px), 121px);
  left: clamp(42px, 5vw, 72px);
  margin: 0;
  color: #fff;
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.16em;
  line-height: 1;
}

.login-panel h1 {
  margin-bottom: 32px;
  color: #112262;
  font-size: clamp(1.75rem, 2.25vw, 2rem);
  font-weight: 710;
  line-height: 1.2;
}

.service-error {
  margin: -12px 0 24px;
  padding: 11px 13px;
  border: 1px solid #efc3c1;
  border-radius: var(--radius-sm);
  background: #fff1f0;
  color: #7e2726;
  font-size: 0.82rem;
  font-weight: 700;
}

.service-error[hidden] {
  display: none;
}

.login-form {
  display: grid;
  gap: 20px;
}

.field-group {
  display: grid;
  gap: 8px;
}

.field-label-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  align-items: center;
  justify-content: space-between;
}

.field-group label {
  color: #112262;
  font-size: 0.8rem;
  font-weight: 650;
  line-height: 1.125rem;
}

.field-group input {
  width: 100%;
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid #cfd6e5;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(17 34 98 / 3%);
  color: #112262;
  font-size: 0.95rem;
  transition: border-color 150ms ease, box-shadow 150ms ease, background 150ms ease;
}

.field-group input:hover {
  border-color: #929db9;
}

.field-group input:focus {
  border-color: #112262;
  background: #fff;
  box-shadow: 0 0 0 3px rgb(255 204 5 / 24%);
  outline: none;
}

.field-group input[aria-invalid="true"] {
  border-color: var(--danger);
}

.field-group input[aria-invalid="true"]:focus {
  box-shadow: 0 0 0 2px rgb(185 58 56 / 12%);
}

.field-error {
  margin: -1px 0 0;
  color: #9f302f;
  font-size: 0.75rem;
  font-weight: 550;
  line-height: 1.125rem;
}

.field-error[hidden] {
  display: none;
}

.password-control {
  position: relative;
}

.password-control input {
  padding-right: 56px;
}

.forgot-password-link {
  margin-left: auto;
  color: #4b577c;
  font-size: 0.75rem;
  font-weight: 620;
  line-height: 1.125rem;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 4px;
  transition: color 150ms ease, text-decoration-color 150ms ease;
}

.forgot-password-link:hover {
  color: #112262;
  text-decoration-color: currentColor;
}

.text-button {
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  width: 42px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #536080;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 140ms ease, color 140ms ease;
}

.password-eye {
  display: block;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.65;
}

.password-eye--hide,
.text-button[aria-pressed="true"] .password-eye--show {
  display: none;
}

.text-button[aria-pressed="true"] .password-eye--hide {
  display: block;
}

.text-button:hover {
  background: rgb(17 34 98 / 6%);
  color: #112262;
}

.text-button:focus-visible {
  z-index: 1;
  outline: 2px solid #112262;
  outline-offset: -2px;
}

.form-message {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-left: 3px solid var(--danger);
  border-radius: 4px var(--radius-sm) var(--radius-sm) 4px;
  background: #fff1f0;
  color: #7e2726;
  font-size: 0.82rem;
  font-weight: 650;
}

.form-message__reference {
  display: block;
  overflow-wrap: anywhere;
  color: #6d2a2a;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.68rem;
  font-weight: 620;
  line-height: 1.45;
}

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

.primary-button {
  display: flex;
  min-height: 46px;
  padding: 11px 17px;
  border: 0;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #112262 0%, #1b327c 100%);
  box-shadow: 0 3px 9px rgb(17 34 98 / 16%), inset 0 1px 0 rgb(255 255 255 / 12%);
  color: #fff;
  cursor: pointer;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.005em;
  transition: background 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.primary-button:hover:not(:disabled) {
  background: linear-gradient(135deg, #172b73 0%, #25408f 100%);
  box-shadow: 0 5px 14px rgb(17 34 98 / 21%), inset 0 1px 0 rgb(255 255 255 / 12%);
  transform: translateY(-1px);
}

.primary-button:focus-visible {
  outline-color: var(--brand);
}

.primary-button:disabled {
  cursor: wait;
  opacity: 0.68;
}

/* Every explicit search action finishes at the far-right edge of its own row
   without repositioning a parent that may also contain the search input. */
.search-action-button {
  align-self: end;
  justify-self: end;
  margin-inline-start: auto;
}

/* A direct search action always occupies the final grid track. Action-only
   wrappers opt in explicitly so input + button composites are never moved. */
form > .search-action-button.search-action-button,
form > .search-action-group.search-action-group {
  grid-column-end: -1;
  justify-self: end;
  margin-inline-start: auto;
}

.login-submit {
  min-height: 52px;
  margin-top: 8px;
  border-radius: 8px;
  background: #112262;
  box-shadow: 0 10px 24px rgb(17 34 98 / 18%);
  font-size: 0.9rem;
  font-weight: 740;
}

.login-submit:hover:not(:disabled) {
  background: #1a2e73;
  box-shadow: 0 13px 28px rgb(17 34 98 / 23%);
}

.login-submit:focus-visible {
  outline: 3px solid #ffcc05;
  outline-offset: 3px;
}

.recovery-panel {
  max-width: 392px;
}

.recovery-message {
  margin: -12px 0 30px;
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.65;
}

.recovery-action {
  width: 100%;
  min-height: 52px;
}

/* Application shell */

.app-shell {
  display: grid;
  min-height: 100vh;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  font-size: 14px;
  line-height: 1.45;
}

.app-shell--controller {
  display: block;
}

.controller-actions {
  display: flex;
  padding: 12px clamp(18px, 2.5vw, 36px) 0;
  justify-content: flex-end;
}

.controller-logout {
  min-width: 64px;
  min-height: 38px;
  padding: 7px 14px;
  border: 1px solid #c92222;
  border-radius: 9px;
  background: #fff;
  color: #b71919;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 700;
}

.controller-logout:hover:not(:disabled) {
  background: #fff7f7;
}

.controller-logout:disabled {
  cursor: wait;
  opacity: 0.55;
}

.sidebar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  height: 100vh;
  min-height: 0;
  padding: 12px 10px 11px;
  flex-direction: column;
  border-right: 1px solid rgb(255 255 255 / 8%);
  background: var(--brand-dark);
  color: #f7f8ff;
}

.sidebar :focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}

.sidebar-brand {
  min-height: 62px;
  margin: -12px -10px 10px;
  padding: 13px 17px;
  border-bottom: 1px solid rgb(255 255 255 / 10%);
  background: transparent;
}

.sidebar-logo {
  display: block;
  width: 136px;
  height: auto;
}

.sidebar-nav {
  width: calc(100% + 10px);
  min-height: 0;
  margin-left: -10px;
  padding-left: 10px;
  flex: 1;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #50609e transparent;
  scrollbar-width: thin;
}

.nav-section + .nav-section {
  margin-top: 12px;
}

.nav-group__toggle {
  display: flex;
  min-height: 34px;
  padding: 6px 9px;
  border-radius: 10px;
  align-items: center;
  justify-content: space-between;
  color: #d9def1;
  cursor: pointer;
  font-size: 0.8125rem;
  font-weight: 600;
  list-style: none;
}

.nav-group__toggle::-webkit-details-marker {
  display: none;
}

.nav-group__toggle::after {
  content: '';
  display: block;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  border-radius: 3px;
  background:
    linear-gradient(#aeb8db, #aeb8db) 50% 50% / 10px 2px no-repeat,
    linear-gradient(#aeb8db, #aeb8db) 50% 50% / 2px 10px no-repeat;
}

.nav-group[open] > .nav-group__toggle::after {
  background:
    linear-gradient(#aeb8db, #aeb8db) 50% 50% / 10px 2px no-repeat;
}

.nav-group__toggle:hover {
  background: rgb(255 255 255 / 6%);
  color: #fff;
}

.nav-group > .nav-list {
  margin-top: 3px;
  padding-left: 7px;
}

.nav-list {
  display: grid;
  margin: 0;
  padding: 0;
  gap: 3px;
  list-style: none;
}

.nav-link {
  position: relative;
  display: flex;
  min-height: 35px;
  padding: 5px 10px;
  border-radius: 10px;
  align-items: center;
  gap: 11px;
  color: #dce1f2;
  font-size: 0.8125rem;
  font-weight: 600;
  transition: background 140ms ease, color 140ms ease, box-shadow 140ms ease;
}

.nav-link:hover {
  background: rgb(255 255 255 / 6%);
  color: #fff;
}

.nav-link--active {
  margin-left: -10px;
  padding-left: 16px;
  border-left: 4px solid var(--brand);
  border-radius: 0 10px 10px 0;
  background: rgb(255 255 255 / 12%);
  box-shadow: 0 5px 16px rgb(3 11 50 / 14%);
  color: #ffffff;
  font-weight: 700;
}

.nav-group > .nav-list .nav-link--active {
  margin-left: -17px;
  padding-left: 23px;
}

.nav-link--active:hover {
  background: rgb(255 255 255 / 14%);
  color: #ffffff;
}

.nav-link--disabled,
.nav-link--disabled:hover {
  background: transparent;
  color: #8e98bd;
  cursor: not-allowed;
  opacity: 0.68;
}

.nav-link__icon {
  display: inline-grid;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 11%);
  border-radius: 7px;
  color: #b9c2e2;
  font-size: 0.57rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

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

.nav-link__badge {
  display: inline-grid;
  min-width: 22px;
  min-height: 22px;
  margin-left: auto;
  padding: 2px 6px;
  flex: 0 0 auto;
  place-items: center;
  border: 2px solid rgb(255 255 255 / 90%);
  border-radius: 999px;
  background: #e51d2a;
  color: #fff;
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  line-height: 1;
}

.nav-link--active .nav-link__icon {
  border-color: rgb(255 204 5 / 35%);
  background: rgb(255 204 5 / 10%);
  color: var(--brand);
}

.sidebar-account {
  display: flex;
  min-width: 0;
  margin-top: 10px;
  padding: 10px 7px 0;
  border-top: 1px solid rgb(255 255 255 / 11%);
  align-items: center;
  gap: 10px;
}

.avatar {
  display: inline-grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 8%);
  border-radius: 8px;
  background: var(--brand);
  color: var(--ink);
  font-size: 0.72rem;
  font-weight: 700;
}

.sidebar-account__copy {
  display: grid;
  min-width: 0;
}

.sidebar-account__copy strong,
.sidebar-account__copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-account__copy strong {
  color: #ffffff;
  font-size: 0.78rem;
}

.sidebar-account__copy small {
  color: #b5bfdc;
  font-size: 0.65rem;
}

.logout-button {
  min-width: 42px;
  min-height: 34px;
  margin-left: auto;
  padding: 6px 9px;
  border: 1px solid rgb(255 255 255 / 13%);
  border-radius: 8px;
  background: rgb(255 255 255 / 3%);
  color: #e3e7f7;
  cursor: pointer;
  font-size: 0.68rem;
  font-weight: 700;
}

.logout-button:hover:not(:disabled) {
  border-color: rgb(255 255 255 / 26%);
  background: rgb(255 255 255 / 6%);
  color: #fff;
}

.logout-button:disabled {
  cursor: wait;
  opacity: 0.55;
}

.sidebar-overlay {
  display: none;
}

.workspace {
  min-width: 0;
  background: #f7f9fc;
}

.workspace--package-detail,
.workspace-main--package-detail,
.package-detail-page {
  background: #ffffff;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  min-height: 60px;
  padding: 8px clamp(18px, 2vw, 30px);
  border-bottom: 1px solid rgb(203 210 225 / 62%);
  align-items: center;
  gap: 16px;
  justify-content: space-between;
  background: rgb(255 255 255 / 88%);
  box-shadow: 0 8px 28px rgb(17 34 98 / 4%);
  backdrop-filter: blur(18px);
}

.menu-button {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--brand-dark);
  cursor: pointer;
}

.menu-button__icon,
.mobile-logout-button svg {
  pointer-events: none;
}

.mobile-logout-button {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid #d7a7a7;
  border-radius: 7px;
  place-items: center;
  background: #fff;
  color: #a02727;
  cursor: pointer;
}

.mobile-logout-button:disabled {
  cursor: wait;
  opacity: 0.6;
}

.topbar__title {
  display: grid;
  margin-right: auto;
}

.topbar__title small {
  color: var(--ink-faint);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.topbar__title strong {
  font-size: 0.86rem;
  font-weight: 700;
}

.system-chip {
  display: inline-flex;
  padding: 7px 11px;
  border: 1px solid #dfe4ed;
  border-radius: 999px;
  align-items: center;
  gap: 7px;
  background: rgb(255 255 255 / 80%);
  color: var(--ink-soft);
  font-size: 0.7rem;
  font-weight: 600;
}

.system-chip::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ink-faint);
  content: "";
}

.system-chip--online::before {
  background: var(--success);
}

.system-chip--offline::before {
  background: #fff;
}

.system-chip--offline {
  border-color: #bd3f39;
  background: #bd3f39;
  color: #fff;
}

.system-chip--checking::before {
  animation: status-pulse 1.2s ease-in-out infinite;
}

.workspace-main {
  width: min(100%, 1540px);
  min-width: 0;
  margin: 0 auto;
  padding: clamp(18px, 1.8vw, 28px);
}

.workspace-main > * {
  min-width: 0;
  max-width: 100%;
}

.workspace-main:focus-visible {
  outline: 0;
}

.app-shell .primary-button {
  border: 1px solid var(--brand-dark);
  border-radius: 9px;
  background: var(--brand-dark);
  box-shadow: 0 1px 2px rgb(17 34 98 / 12%);
  transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.app-shell .primary-button:hover:not(:disabled) {
  border-color: #1b327c;
  background: #1b327c;
  box-shadow: 0 2px 5px rgb(17 34 98 / 14%);
  transform: none;
}

.shell-alert {
  width: min(calc(100% - 40px), 1430px);
  margin: 18px auto -18px;
  padding: 12px 15px;
  border: 1px solid #efc3c1;
  border-radius: var(--radius-sm);
  background: #fff1f0;
  color: #7e2726;
  font-size: 0.8rem;
  font-weight: 700;
}

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

.notification-center {
  position: fixed;
  z-index: 1800;
  top: 18px;
  right: 20px;
  display: grid;
  width: min(390px, calc(100vw - 32px));
  gap: 9px;
  pointer-events: none;
}

.notification-center--network {
  top: auto;
  bottom: max(18px, env(safe-area-inset-bottom));
}

.system-notification {
  display: grid;
  min-height: 54px;
  padding: 10px 10px 10px 12px;
  border: 1px solid #dce2ed;
  border-left: 3px solid var(--brand-dark);
  border-radius: 9px;
  align-items: center;
  grid-template-columns: 28px minmax(0, 1fr) 28px;
  gap: 9px;
  background: #fff;
  box-shadow: 0 10px 28px rgb(17 34 98 / 16%);
  color: var(--brand-dark);
  pointer-events: auto;
  animation: notification-enter 180ms ease-out both;
}

.system-notification--success {
  border-left-color: #16835f;
}

.system-notification--error {
  border-color: #efcfcc;
  border-left-color: #bd3f39;
}

.system-notification--network.system-notification--success {
  border-color: #16835f;
  background: #16835f;
  color: #fff;
}

.system-notification--network.system-notification--error {
  border-color: #bd3f39;
  background: #bd3f39;
  color: #fff;
}

.system-notification--pos {
  border: 0;
  border-left: 5px solid #27ae60;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(46, 204, 113, 0.95) 0%, rgba(39, 174, 96, 0.95) 100%);
  box-shadow: 0 10px 25px rgb(0 0 0 / 20%);
  color: #fff;
  font-weight: 600;
}

.system-notification--pos.system-notification--error {
  border-left-color: #c0392b;
  background: linear-gradient(135deg, rgba(231, 76, 60, 0.95) 0%, rgba(192, 57, 43, 0.95) 100%);
}

.system-notification--pos .system-notification__message {
  color: #fff;
  font-weight: 600;
}

.system-notification--pos .system-notification__icon {
  background: transparent;
  color: #fff;
}

.system-notification--pos .system-notification__dismiss {
  color: #fff;
}

.system-notification__icon {
  display: inline-grid;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  place-items: center;
  background: #e8f5ef;
  color: #0e684a;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
}

.system-notification--error .system-notification__icon {
  background: #fff0ef;
  color: #9b302c;
}

.system-notification--network.system-notification--success .system-notification__icon,
.system-notification--network.system-notification--error .system-notification__icon {
  background: rgb(255 255 255 / 18%);
  color: #fff;
}

.system-notification__message {
  margin: 0;
  color: #24324e;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.4;
}

.system-notification--network .system-notification__message {
  color: #fff;
}

.system-notification__dismiss {
  display: inline-grid;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  place-items: center;
  background: transparent;
  color: #6d7890;
  cursor: pointer;
  font-size: 1.15rem;
  line-height: 1;
}

.system-notification__dismiss:hover,
.system-notification__dismiss:focus-visible {
  background: #f1f4f9;
  color: var(--brand-dark);
}

.system-notification--network .system-notification__dismiss,
.system-notification--network .system-notification__dismiss:hover,
.system-notification--network .system-notification__dismiss:focus-visible {
  background: transparent;
  color: #fff;
}

.system-notification--pos.system-notification--error .system-notification__icon,
.system-notification--pos .system-notification__dismiss:hover,
.system-notification--pos .system-notification__dismiss:focus-visible {
  background: transparent;
  color: #fff;
}

@keyframes notification-enter {
  from {
    opacity: 0;
    transform: translate3d(14px, -4px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 640px) {
  .notification-center {
    top: 10px;
    right: 10px;
    width: calc(100vw - 20px);
  }

  .notification-center--network {
    top: auto;
    bottom: max(10px, env(safe-area-inset-bottom));
  }
}

@media (prefers-reduced-motion: reduce) {
  .system-notification {
    animation: none;
  }
}

/* Admin dashboard — composition and labels mirror Admin.php. */

.admin-dashboard {
  display: grid;
  gap: 16px;
}

.admin-dashboard-heading {
  min-width: 0;
  padding: 1px 2px 0;
}

.admin-dashboard-heading h1 {
  margin: 0;
  color: #202a49;
  font-size: clamp(1rem, 1.4vw, 1.18rem);
  font-weight: 750;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.admin-dashboard-alert {
  display: flex;
  min-height: 42px;
  padding: 9px 14px;
  border: 0;
  border-radius: 11px;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  background: #fff4f3;
  box-shadow: 0 7px 20px rgb(185 58 56 / 8%);
  color: #a83230;
  font-size: 0.75rem;
  text-decoration: none;
  transition: background 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.admin-dashboard-alert:hover {
  background: #ffefed;
  box-shadow: 0 9px 24px rgb(185 58 56 / 12%);
  transform: translateY(-1px);
}

.admin-dashboard-alert:focus-visible {
  outline: 3px solid rgb(185 58 56 / 22%);
  outline-offset: 2px;
}

.admin-dashboard-alert__icon {
  display: inline-grid;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  border: 0;
  border-radius: 50%;
  place-items: center;
  background: #fbd9d6;
  font-size: 0.68rem;
  font-weight: 700;
}

.admin-dashboard-alert__arrow {
  margin-left: auto;
  color: #8d2927;
  font-size: 0.95rem;
  font-weight: 700;
}

.admin-metrics {
  display: grid;
  overflow: visible;
  border: 0;
  border-radius: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  background: transparent;
  box-shadow: none;
}

.admin-metric {
  position: relative;
  display: grid;
  overflow: hidden;
  min-width: 0;
  min-height: 92px;
  padding: 14px 15px 13px;
  border: 1px solid rgb(226 231 241 / 72%);
  border-radius: 12px;
  align-content: center;
  gap: 8px;
  background: var(--surface);
  box-shadow: 0 9px 24px rgb(17 34 98 / 6%);
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.admin-metric::before {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #c89024;
  content: "";
}

.admin-metric:hover {
  border-color: rgb(190 200 220 / 78%);
  box-shadow: 0 12px 30px rgb(17 34 98 / 9%);
  transform: translateY(-1px);
}

.admin-metric--clickable {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

.admin-metric--clickable:focus-visible {
  border-color: rgb(17 34 98 / 24%);
  outline: 3px solid rgb(17 34 98 / 12%);
  outline-offset: 2px;
}

.admin-metric--te_dorezuara::before {
  background: var(--success);
}

.admin-metric--problematike_te_kthyera::before {
  background: var(--danger);
}

.admin-metric--te_pa_likujduara::before {
  background: var(--brand);
}

.admin-metric__value {
  display: flex;
  min-height: 24px;
  align-items: baseline;
  justify-content: flex-start;
}

.admin-metric__value strong {
  color: var(--ink);
  font-size: 1.36rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.admin-metric__value span {
  color: var(--ink-faint);
  margin-left: 2px;
  font-size: 0.65rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.admin-metric__label {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
  color: #596480;
  font-size: 0.7rem;
  font-weight: 600;
}

.admin-metric__label strong {
  color: var(--ink);
  padding: 2px 6px;
  border-radius: 999px;
  background: #f2f4f8;
  font-size: 0.65rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.admin-metric__progress {
  width: 100%;
  height: 3px;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  appearance: none;
  background: var(--surface-soft);
  accent-color: var(--warning);
}

.admin-metric__progress::-webkit-progress-bar {
  border-radius: inherit;
  background: var(--surface-soft);
}

.admin-metric__progress::-webkit-progress-value {
  border-radius: inherit;
  background: var(--warning);
}

.admin-metric__progress::-moz-progress-bar {
  border-radius: inherit;
  background: var(--warning);
}

.admin-metric--te_dorezuara .admin-metric__progress {
  accent-color: var(--success);
}

.admin-metric--te_dorezuara .admin-metric__progress::-webkit-progress-value {
  background: var(--success);
}

.admin-metric--te_dorezuara .admin-metric__progress::-moz-progress-bar {
  background: var(--success);
}

.admin-metric--problematike_te_kthyera .admin-metric__progress {
  accent-color: var(--danger);
}

.admin-metric--problematike_te_kthyera .admin-metric__progress::-webkit-progress-value {
  background: var(--danger);
}

.admin-metric--problematike_te_kthyera .admin-metric__progress::-moz-progress-bar {
  background: var(--danger);
}

.admin-metric__amounts {
  display: grid;
  justify-items: start;
  gap: 2px;
  color: var(--ink-faint);
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
}

.admin-metric__amounts span {
  white-space: nowrap;
}

.admin-metric__amounts strong {
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: 700;
}

.business-metrics > .admin-metric {
  min-height: 104px;
  padding: 14px 15px;
  gap: 6px;
}

.business-financial-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 12px;
}

.business-financial-summary__group {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 8px;
}

.business-financial-summary__group + .business-financial-summary__group {
  border-left: 1px solid var(--line);
  padding-left: 12px;
}

.business-financial-summary .admin-metric__amounts span {
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  .business-metrics > .admin-metric:nth-child(3),
  .business-metrics > .business-financial-summary {
    grid-column: 1 / -1;
  }
}

.admin-dashboard-lower {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(190px, 0.23fr) minmax(0, 1fr);
  align-items: start;
  gap: 14px;
}

.business-dashboard-workspace {
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 14px;
}

.business-import-columns {
  margin: 0;
  color: var(--ink-muted);
  font-size: 12px;
  line-height: 1.45;
}

.business-import-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 2px;
}

.business-import-header h2 {
  flex: 1;
  min-width: 0;
  margin: 0;
}

.business-import-header .business-import-template-download {
  flex: 0 0 auto;
  margin-left: auto;
}

.business-dashboard-charts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
  align-items: start;
}

.business-chart-card {
  min-width: 0;
  padding: 18px;
  min-height: 365px;
}

.business-chart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 32px;
  margin-bottom: 16px;
}

.business-chart-header h2 {
  min-width: 0;
  margin: 0;
  color: var(--ink);
  font-size: 1rem;
}

.business-chart-periods {
  display: flex;
  flex: 0 0 auto;
  padding: 3px;
  gap: 2px;
  border: 1px solid var(--line);
  background: var(--surface-muted, #f5f7fb);
  border-radius: 8px;
}

.business-chart-periods button {
  border: 0;
  background: transparent;
  border-radius: 5px;
  padding: 5px 8px;
  color: var(--ink-muted);
  font-size: 0.72rem;
  white-space: nowrap;
  cursor: pointer;
}

.business-chart-periods button[aria-pressed='true'] {
  color: #fff;
  background: var(--navy, #15245f);
}

.business-chart-period-label {
  flex: 0 0 auto;
  color: var(--ink-muted);
  font-size: 0.72rem;
  background: var(--surface-muted, #f5f7fb);
  border-radius: 5px;
  padding: 5px 8px;
}

.business-chart-legend { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 12px; }
.business-chart-legend__item { display: flex; align-items: center; gap: 6px; color: var(--ink-muted); font-size: 0.74rem; }
.business-chart-legend__item strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.business-chart-legend__item i { width: 8px; height: 8px; border-radius: 50%; background: var(--chart-color); }
.business-chart-series--created { --chart-color: #233e87; }
.business-chart-series--delivered { --chart-color: #23875c; }
.business-chart-plot { display: block; width: 100%; overflow: visible; }
.business-chart-gridline { stroke: var(--line, #e3e8f0); stroke-width: 1; }
.business-chart-axis { fill: var(--ink-muted, #68758e); font-size: 11px; }
.business-chart-line { fill: none; stroke: var(--chart-color); stroke-width: 2.5; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.business-chart-dot { fill: var(--chart-color); stroke: #fff; stroke-width: 1; }
.business-chart-cursor { stroke: #a9b3c8; stroke-width: 1; stroke-dasharray: 3 3; }
.business-chart-hitarea { fill: transparent; }
.business-chart-day { cursor: crosshair; outline: none; }
.business-chart-day:focus .business-chart-hitarea { fill: #edf1f9; fill-opacity: 0.55; }
.business-chart-day:focus .business-chart-dot { stroke: var(--ink); stroke-width: 2; }
.business-chart-readout { margin: 7px 0 10px; color: var(--ink-muted); font-size: 0.73rem; min-height: 30px; line-height: 1.5; }
.business-chart-empty { color: var(--ink-muted); font-size: 0.8rem; line-height: 1.5; }
.business-chart-data { border-top: 1px solid var(--line); padding-top: 10px; }
.business-chart-data summary { color: var(--ink-muted); cursor: pointer; font-size: 0.75rem; }
.business-chart-data__actions { display: flex; justify-content: flex-end; margin-top: 8px; }
.business-chart-data__scroll { max-height: 230px; overflow: auto; margin-top: 8px; }
.business-chart-data table { width: 100%; border-collapse: collapse; font-size: 0.75rem; font-variant-numeric: tabular-nums; }
.business-chart-data th, .business-chart-data td { padding: 7px; text-align: right; border-bottom: 1px solid var(--line); }
.business-chart-data th:first-child { text-align: left; font-weight: 500; }
.business-chart-cities { display: grid; gap: 14px; }
.business-chart-city-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.business-chart-city { display: grid; grid-template-columns: minmax(70px, 1fr) minmax(0, 1.7fr) auto; align-items: center; gap: 10px; padding: 4px 0; color: var(--ink); }
.business-chart-city__label, .business-chart-city strong { font-size: 0.8rem; }
.business-chart-city__label { min-width: 0; overflow-wrap: anywhere; }
.business-chart-city strong { min-width: 2.5ch; text-align: right; font-variant-numeric: tabular-nums; }
.business-chart-city__track { display: block; height: 8px; border-radius: 4px; background: #f0f3f8; overflow: hidden; }
.business-chart-city__fill { height: 100%; display: block; border-radius: inherit; background: #426ba6; }
.business-chart-periods button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.business-chart-note { margin: 0; color: var(--ink-muted); font-size: 0.72rem; line-height: 1.5; }

@media (max-width: 760px) {
  .business-dashboard-charts { grid-template-columns: minmax(0, 1fr); }
  .business-chart-card { padding: 14px; min-height: 0; }
  .business-chart-header { gap: 8px; margin-bottom: 14px; }
  .business-chart-header h2 { font-size: 0.9rem; }
  .business-chart-periods button { padding: 6px; }
}

@media (max-width: 480px) {
  .business-chart-axis { font-size: 17px; }
}

.package-filters.business-import-form {
  margin-top: 0;
  padding: 12px 0;
  border: 0;
  grid-template-columns: minmax(0, 1fr) auto;
}

.business-import-form .package-filter-actions {
  grid-column: auto;
  justify-content: flex-end;
}

.business-import-form input[type='file'] {
  width: 100%;
  min-height: 38px;
  padding: 6px 8px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink-soft);
  font: inherit;
  font-size: 0.74rem;
}

.business-import-form input[type='file']::file-selector-button {
  margin-right: 9px;
  padding: 6px 10px;
  border: 0;
  border-radius: 5px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.business-import-status {
  margin: 0;
  padding: 9px 0;
  color: #245e4d;
  font-size: 0.74rem;
  font-weight: 650;
}

.business-import-status.package-filter-error {
  padding: 9px 11px;
  border: 0;
  border-radius: 7px;
}

.business-import-results {
  max-height: 290px;
  margin-bottom: 12px;
  overflow: auto;
  border: 1px solid rgb(226 231 241 / 82%);
  border-radius: 9px;
}

.business-import-results__table {
  min-width: 580px;
}

.business-import-outcome {
  display: inline-flex;
  padding: 3px 7px;
  border-radius: 999px;
  background: #edf2fb;
  color: #354568;
  font-size: 0.66rem;
  font-weight: 700;
  white-space: nowrap;
}

.business-import-outcome--created,
.business-import-outcome--replayed {
  background: #e8f7f0;
  color: #1f6a50;
}

.business-import-outcome--pending_external,
.business-import-outcome--external_verification_required {
  background: #fff6d8;
  color: #765b00;
}

.business-import-outcome--failed,
.business-import-outcome--not_processed {
  background: #fff0ef;
  color: #8a2c2a;
}

@media (max-width: 760px) {
  .package-filters.business-import-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .business-import-form .package-filter-actions,
  .business-import-form .package-filter-actions > * {
    width: 100%;
    grid-column: 1;
  }
}

.admin-active-users,
.admin-agencies {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgb(226 231 241 / 72%);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 9px 24px rgb(17 34 98 / 6%);
}

.admin-active-users__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.admin-active-users__list li {
  min-height: 34px;
  padding: 0;
  border-bottom: 1px solid #edf0f5;
  color: #344063;
  font-size: 0.71rem;
  font-weight: 500;
}

.admin-active-users__list li:hover {
  background: #f5f8fd;
}

.admin-active-users__list li a {
  display: grid;
  min-height: 34px;
  padding: 6px 11px;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

.admin-active-users__list li a:focus-visible {
  outline: 2px solid rgb(17 34 98 / 24%);
  outline-offset: -2px;
}

.admin-active-users__list li span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-active-users__list li strong {
  min-width: 24px;
  color: var(--ink);
  font-size: 0.73rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.admin-active-users__more {
  display: flex;
  min-height: 34px;
  padding: 6px 9px;
  align-items: center;
  border-top: 1px solid #edf0f5;
  background: #fbfcfe;
  color: var(--ink);
  font-size: 0.71rem;
  font-weight: 700;
  text-decoration: none;
}

.admin-active-users__more:hover {
  background: #f2f5fa;
  color: var(--brand-dark);
}

.admin-active-users__more:focus-visible {
  outline: 2px solid rgb(17 34 98 / 24%);
  outline-offset: -2px;
}

.admin-active-users__empty {
  display: flex;
  min-height: 64px !important;
  padding: 12px 11px !important;
  align-items: center;
  color: var(--ink-faint) !important;
  font-style: italic;
}

.admin-agencies h2 {
  margin: 0;
  padding: 11px 13px;
  border-bottom: 1px solid #e5e9f1;
  background: #ffffff;
  font-size: 0.82rem;
  font-weight: 700;
}

.admin-agencies__table-region {
  min-width: 0;
  overflow: auto;
}

.admin-agencies__table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-size: 0.75rem;
}

.admin-agencies__table th,
.admin-agencies__table td {
  height: 31px;
  padding: 5px 8px;
  border-bottom: 1px solid #edf0f5;
  font-variant-numeric: tabular-nums;
  text-align: center;
  white-space: nowrap;
}

.admin-agencies__table th {
  position: sticky;
  z-index: 1;
  top: 0;
  background: #f7f9fc;
  color: #59647f;
  font-size: 0.67rem;
  font-weight: 600;
  letter-spacing: 0;
}

.admin-agencies__table th:first-child,
.admin-agencies__table td:first-child {
  width: 44%;
  color: #29375f;
  font-weight: 600;
  text-align: left;
}

.admin-agencies__table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-agencies__table tbody tr:hover {
  background: #f2f5fa;
}

.admin-dashboard .dashboard-table-empty td {
  height: 72px;
  color: var(--ink-faint) !important;
  font-style: italic;
  font-weight: 500 !important;
  text-align: center !important;
}

.dashboard-empty-state {
  min-height: 74px;
  margin: 0;
  display: grid;
  place-items: center;
  color: var(--ink-faint);
  font-size: 0.72rem;
  font-style: italic;
  text-align: center;
}

.admin-table__row-link {
  color: inherit;
  text-decoration: none;
}

.admin-table__row-link:hover {
  color: var(--brand-dark);
}

.table-row--clickable {
  cursor: pointer;
}

.table-row--clickable > td {
  transition: background-color 140ms ease, color 140ms ease;
}

.table-row--clickable:focus-visible {
  outline: 0;
  box-shadow: inset 3px 0 0 var(--brand-dark);
}

.table-row--clickable:focus-visible > td {
  background: #eef3fb;
}

.dashboard-state {
  display: flex;
  min-height: 140px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 0.78rem;
}

.dashboard-state__spinner {
  width: 16px;
  height: 16px;
  border: 2px solid var(--line-strong);
  border-top-color: var(--brand-dark);
  border-radius: 50%;
  animation: dashboard-spin 700ms linear infinite;
}

.dashboard-state--error {
  flex-direction: column;
}

.dashboard-state--error p {
  margin: 0;
}

.dashboard-state__retry {
  min-height: 36px;
}

.dashboard-role-placeholder h1 {
  margin: 0;
  font-size: 1.35rem;
}

.module-pending {
  margin: 0;
  color: var(--ink-faint);
  font-size: 0.78rem;
}

@keyframes dashboard-spin {
  to { transform: rotate(360deg); }
}

.dashboard-hero,
.module-heading {
  display: flex;
  margin-bottom: 16px;
  align-items: flex-end;
  gap: 24px;
  justify-content: space-between;
}

.dashboard-hero h1,
.module-heading h1 {
  max-width: 850px;
  margin-bottom: 8px;
  font-size: clamp(1.4rem, 2vw, 2rem);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.03em;
}

.dashboard-hero__lead,
.module-heading p:last-child {
  max-width: 680px;
  margin-bottom: 0;
  color: var(--ink-soft);
  line-height: 1.7;
}

.route-tag {
  display: grid;
  min-width: 132px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

.route-tag span {
  color: var(--ink-faint);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.route-tag strong {
  font-size: 0.9rem;
}

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

.metric-card,
.panel-card {
  border: 1px solid rgb(226 231 241 / 72%);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 9px 24px rgb(17 34 98 / 6%);
}

.metric-card {
  min-height: 96px;
  padding: 12px 13px;
}

.metric-card__top {
  display: flex;
  min-height: 30px;
  align-items: flex-start;
  gap: 10px;
  justify-content: space-between;
}

.metric-card__top p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.79rem;
  font-weight: 600;
}

.metric-card__signal {
  padding: 3px 5px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--ink-faint);
  font-size: 0.52rem;
  font-weight: 600;
  letter-spacing: 0.08em;
}

.metric-card__value {
  display: block;
  margin: 5px 0 2px;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
}

.metric-card small {
  color: var(--ink-faint);
  font-size: 0.65rem;
}

.dashboard-grid,
.module-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.8fr);
  gap: 10px;
}

.panel-card {
  padding: clamp(14px, 1.5vw, 20px);
}

.panel-heading {
  display: flex;
  margin-bottom: 18px;
  align-items: flex-start;
  gap: 18px;
  justify-content: space-between;
}

.panel-heading .eyebrow {
  margin-bottom: 5px;
}

.panel-heading h2,
.module-ready h2,
.module-grid h2 {
  margin-bottom: 0;
  font-size: clamp(1rem, 1.5vw, 1.25rem);
}

.panel-meta {
  color: var(--ink-faint);
  font-size: 0.65rem;
}

.workflow-list {
  display: grid;
  margin: 0;
  padding: 0;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  list-style: none;
}

.workflow-list li {
  position: relative;
  display: grid;
  gap: 6px;
  padding: 13px 10px 8px 0;
  border-top: 1px solid var(--line-strong);
}

.workflow-list li:not(:last-child)::after {
  position: absolute;
  top: -4px;
  right: 15px;
  width: 8px;
  height: 8px;
  border: 2px solid var(--surface);
  border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 0 0 1px var(--brand);
  content: "";
}

.workflow-list span {
  color: var(--brand-dark);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.workflow-list strong {
  font-size: 0.74rem;
  letter-spacing: 0;
}

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

.quick-action {
  display: grid;
  padding: 8px 4px;
  border-bottom: 1px solid var(--line);
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
}

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

.quick-action:hover strong {
  color: var(--brand-dark);
}

.quick-action__code {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 9px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  font-size: 0.6rem;
  font-weight: 700;
}

.quick-action > span:nth-child(2) {
  display: grid;
  min-width: 0;
}

.quick-action strong {
  font-size: 0.79rem;
  transition: color 140ms ease;
}

.quick-action small {
  overflow: hidden;
  color: var(--ink-faint);
  font-size: 0.64rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.quick-action__arrow {
  color: var(--brand);
  font-weight: 700;
}

/* Module placeholders */

.module-heading {
  padding: 12px 0 8px;
}

.module-code {
  display: grid;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 9px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  color: var(--brand-dark);
  font-size: 1rem;
  font-weight: 700;
}

.module-code--locked {
  border-color: #efc3c1;
  background: #fff1f0;
  color: var(--danger);
}

.module-grid {
  align-items: stretch;
}

.module-ready {
  position: relative;
  min-height: 230px;
  overflow: hidden;
  background: var(--forest);
  color: #f7f8ff;
}

.module-ready::after {
  position: absolute;
  right: -70px;
  bottom: -100px;
  width: 260px;
  height: 260px;
  border: 1px solid rgb(255 255 255 / 8%);
  border-radius: 50%;
  box-shadow: 0 0 0 45px rgb(255 255 255 / 2%);
  content: "";
}

.module-ready .eyebrow {
  color: var(--lime);
}

.module-ready h2 {
  max-width: 520px;
  margin-bottom: 18px;
  font-size: clamp(1.25rem, 2vw, 1.8rem);
  line-height: 1.05;
}

.module-ready p:last-child {
  max-width: 570px;
  color: #c5cdec;
  line-height: 1.75;
}

.module-ready__mark {
  display: grid;
  width: 50px;
  height: 50px;
  margin-bottom: 56px;
  place-items: center;
  border-radius: 9px;
  background: var(--lime);
  color: var(--forest);
  font-size: 0.76rem;
  font-weight: 700;
}

.check-list {
  display: grid;
  margin: 18px 0 0;
  padding: 0;
  gap: 0;
  list-style: none;
}

.check-list li {
  display: flex;
  padding: 12px 0;
  border-top: 1px solid var(--line);
  align-items: center;
  gap: 12px;
  color: var(--ink-soft);
  font-size: 0.82rem;
}

.check-list li span:first-child {
  display: grid;
  width: 25px;
  height: 25px;
  flex: 0 0 25px;
  place-items: center;
  border-radius: 50%;
  background: var(--brand-soft);
  color: var(--ink);
  font-size: 0.7rem;
  font-weight: 700;
}

.access-card {
  max-width: 720px;
}

.access-card h2 {
  margin-bottom: 12px;
}

.access-card p {
  max-width: 620px;
  margin-bottom: 24px;
  color: var(--ink-soft);
  line-height: 1.7;
}

.secondary-button {
  display: inline-flex;
  min-height: 38px;
  padding: 7px 13px;
  border: 1px solid #cbd3e1;
  border-radius: 8px;
  align-items: center;
  justify-content: center;
  background: var(--surface);
  color: var(--ink);
  font-size: 0.78rem;
  box-shadow: none;
  font-weight: 700;
}

.secondary-button:hover {
  border-color: var(--forest-soft);
  background: #f5f7fb;
}

.icon-only-button,
.button-with-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.icon-only-button {
  width: 38px;
  min-width: 38px;
  min-height: 38px;
  padding: 7px;
}

.icon-only-button svg,
.button-with-icon svg,
.nav-link__icon svg {
  display: block;
  flex: 0 0 auto;
}

.button-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: button-spinner 700ms linear infinite;
}

@keyframes button-spinner {
  to { transform: rotate(360deg); }
}

body.modal-open {
  overflow: hidden;
}

body.sidebar-open {
  overflow: hidden;
}

.app-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  padding: clamp(14px, 3vw, 34px);
  place-items: center;
  overflow: auto;
  background: rgb(7 15 44 / 62%);
  backdrop-filter: blur(5px);
}

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

.app-modal__surface {
  width: min(100%, 900px);
  max-height: calc(100vh - clamp(28px, 6vw, 68px));
  overflow: auto;
  border: 1px solid rgb(255 255 255 / 45%);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 28px 80px rgb(3 10 35 / 36%);
}

/* Option lists are overlays. This class exists only while a shared/custom
   combobox is open, so cards and modal surfaces do not cut its choices. */
.select-overlay-host--open {
  overflow: visible !important;
}

/* The direct surface of any semantic modal remains the final scroll and
   collision boundary even while intermediate field wrappers are unclipped. */
.select-overlay-boundary--open {
  overflow: auto !important;
  overscroll-behavior: contain;
}

/* The fixed modal remains the viewport scroller while its surface lets the
   option list escape. Otherwise a dropdown near the lower edge is clipped by
   the viewport and its last choices cannot be reached. */
.app-modal.select-overlay-host--open {
  overflow: auto !important;
}

/* The modal surface remains the scroll boundary. Dropdown placement is
   collision-aware, so making this long form overflow visibly would only let
   its content spill onto the dimmed backdrop. */
.app-modal__surface.select-overlay-host--open {
  overflow: auto !important;
}

:is(.searchable-select--open, .business-combobox--open, .package-create-lookup--open) {
  z-index: 2300;
}

.confirmation-dialog {
  z-index: 2200;
}

.confirmation-dialog__surface {
  width: min(100%, 470px);
  overflow: hidden;
  border-color: #e2e7f0;
}

.confirmation-dialog__surface--danger {
  border-top: 4px solid #b63835;
}

.confirmation-dialog__header {
  display: grid;
  padding: 24px 26px 0;
  gap: 7px;
}

.confirmation-dialog__eyebrow {
  color: #9a3431;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.confirmation-dialog__header h2 {
  margin: 0;
  color: var(--brand-dark);
  font-size: 1.08rem;
  line-height: 1.3;
}

.confirmation-dialog__description {
  margin: 0;
  padding: 14px 26px 22px;
  color: #4e5a72;
  font-size: 0.84rem;
  line-height: 1.6;
  white-space: pre-line;
}

.confirmation-dialog__content {
  padding: 0 26px 22px;
}

.confirmation-dialog__content[hidden] {
  display: none;
}

.pos-drift-warning {
  display: grid;
  gap: 10px;
}

.pos-drift-warning__lead,
.pos-drift-warning__summary {
  margin: 0;
  color: #59657c;
  font-size: 0.76rem;
  line-height: 1.5;
}

.pos-drift-warning__list {
  max-height: min(280px, 38vh);
  margin: 0;
  padding: 0;
  overflow: auto;
  border: 1px solid #dfe4ee;
  border-radius: 9px;
  list-style: none;
  background: #fff;
}

.pos-drift-warning__item {
  display: grid;
  padding: 10px 12px;
  gap: 3px;
}

.pos-drift-warning__item + .pos-drift-warning__item {
  border-top: 1px solid #e8ebf2;
}

.pos-drift-warning__package-link {
  width: fit-content;
  color: var(--brand-dark);
  font-weight: 800;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.pos-drift-warning__package-link:hover,
.pos-drift-warning__package-link:focus-visible {
  color: #a97500;
}

.confirmation-dialog__actions {
  display: flex;
  padding: 14px 18px;
  border-top: 1px solid #e8ebf2;
  justify-content: flex-end;
  gap: 10px;
  background: #f8f9fc;
}

.confirmation-dialog__actions button {
  min-width: 104px;
}

.confirmation-dialog__surface--danger .confirmation-dialog__confirm {
  border-color: #a9312e;
  background: #b63835;
  color: #fff;
}

.confirmation-dialog__surface--danger .confirmation-dialog__confirm:hover,
.confirmation-dialog__surface--danger .confirmation-dialog__confirm:focus-visible {
  border-color: #8d2927;
  background: #982e2b;
}

@media (max-width: 520px) {
  .confirmation-dialog__header {
    padding: 20px 20px 0;
  }

  .confirmation-dialog__description {
    padding: 12px 20px 20px;
  }

  .confirmation-dialog__content {
    padding: 0 20px 20px;
  }

  .confirmation-dialog__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}

.table-heading-actions {
  display: flex;
  min-height: 46px;
  padding: 7px 12px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.table-heading-actions h2 {
  margin: 0;
}

.table-excel-button {
  min-width: 38px;
  flex: 0 0 auto;
  border-color: #217346 !important;
  background: #217346 !important;
  color: #fff !important;
  box-shadow: 0 3px 8px rgb(33 115 70 / 18%);
}

.table-excel-button:hover:not(:disabled) {
  border-color: #185c37 !important;
  background: #185c37 !important;
}

.table-excel-button:focus-visible {
  outline: 3px solid rgb(33 115 70 / 28%);
  outline-offset: 2px;
}

.table-excel-button:disabled {
  border-color: #8db7a0 !important;
  background: #8db7a0 !important;
  color: #f7fbf9 !important;
  cursor: not-allowed;
  box-shadow: none;
}

/* Shared form-compatible searchable single-select. */
.searchable-select {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}

.searchable-select::after,
.business-combobox::after {
  position: absolute;
  z-index: 2;
  top: 20px;
  right: 15px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid #63708d;
  border-bottom: 1.5px solid #63708d;
  content: "";
  pointer-events: none;
  transform: translateY(-65%) rotate(45deg);
  transition: transform 140ms ease, border-color 140ms ease;
}

.searchable-select--open::after,
.business-combobox--open::after {
  border-color: var(--brand-dark);
  transform: translateY(-20%) rotate(225deg);
}

.searchable-select > .searchable-select__input,
.business-combobox > .business-combobox__input {
  width: 100%;
  min-width: 0;
  height: 42px;
  min-height: 42px;
  padding: 9px 40px 9px 38px;
  border: 1px solid #c7cfde;
  border-radius: 10px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='8.5' cy='8.5' r='5.5' stroke='%2363708d' stroke-width='1.7'/%3E%3Cpath d='m12.7 12.7 4 4' stroke='%2363708d' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E") 13px center / 15px 15px no-repeat,
    #fff;
  color: #27365e;
  font: inherit;
  font-size: 0.78rem;
  line-height: 1.3;
  outline: 0;
  text-overflow: ellipsis;
  transition: border-color 140ms ease, box-shadow 140ms ease, background-color 140ms ease;
}

.searchable-select > .searchable-select__input::placeholder,
.business-combobox > .business-combobox__input::placeholder {
  color: #7a849a;
}

.searchable-select > .searchable-select__input::-webkit-search-cancel-button,
.business-combobox > .business-combobox__input::-webkit-search-cancel-button {
  display: none;
}

.searchable-select > .searchable-select__input:hover:not(:disabled),
.business-combobox > .business-combobox__input:hover:not(:disabled) {
  border-color: #8c98b2;
}

.searchable-select > .searchable-select__input:focus,
.business-combobox > .business-combobox__input:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 10%);
}

.searchable-select > .searchable-select__input[aria-invalid="true"],
.business-combobox > .business-combobox__input[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgb(185 58 56 / 9%);
}

.searchable-select > .searchable-select__input:disabled,
.business-combobox > .business-combobox__input:disabled {
  background: #f2f4f8;
  color: #7b859b;
  cursor: not-allowed;
}

.searchable-select__listbox {
  position: absolute;
  z-index: 90;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  display: block;
  width: 100%;
  max-width: min(100%, calc(100vw - 16px));
  max-height: var(--searchable-select-listbox-max-height, min(280px, 42vh));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  box-sizing: border-box;
  padding: 6px;
  border: 1px solid #c7cfde;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 16px 36px rgb(17 34 98 / 17%);
}

.searchable-select--above > .searchable-select__listbox {
  top: auto;
  bottom: calc(100% + 6px);
}

.searchable-select__listbox[hidden] {
  display: none;
}

.searchable-select__option,
.searchable-select__empty {
  display: block;
  width: 100%;
  min-height: 38px;
  padding: 9px 34px 9px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #27365e;
  cursor: pointer;
  font-size: 0.76rem;
  font-weight: 560;
  line-height: 1.3;
  text-align: left;
}

.searchable-select__option:hover,
.searchable-select__option--active {
  background: #eef2fa;
  color: var(--brand-dark);
}

.searchable-select__option[aria-selected="true"] {
  position: relative;
  background: #f4f6fb;
  font-weight: 740;
}

.searchable-select__option[aria-selected="true"]::after,
.business-combobox__option[aria-selected="true"]::after {
  position: absolute;
  top: 50%;
  right: 12px;
  color: var(--brand-dark);
  content: "\2713";
  font-size: 0.78rem;
  font-weight: 800;
  transform: translateY(-50%);
}

.searchable-select__option[aria-disabled="true"] {
  color: #929bb0;
  cursor: not-allowed;
}

.searchable-select__empty {
  padding-right: 10px;
  color: #77819a;
  cursor: default;
}

.searchable-select__empty[hidden] {
  display: none;
}

.searchable-select > .searchable-select__native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* One-field async business lookup; paging continues at the list edge. */
.business-combobox {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
}

.business-combobox__listbox {
  position: absolute;
  z-index: 95;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  display: block;
  max-height: min(300px, 44vh);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 6px;
  border: 1px solid #c7cfde;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 16px 36px rgb(17 34 98 / 17%);
}

.business-combobox__listbox[hidden] {
  display: none;
}

.business-combobox__option,
.business-combobox__empty {
  display: block;
  width: 100%;
  min-height: 38px;
  padding: 9px 34px 9px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #27365e;
  cursor: pointer;
  font-size: 0.76rem;
  font-weight: 560;
  line-height: 1.3;
  text-align: left;
}

.business-combobox__option:hover,
.business-combobox__option--active {
  background: #eef2fa;
  color: var(--brand-dark);
}

.business-combobox__option[aria-selected="true"] {
  position: relative;
  background: #f4f6fb;
  font-weight: 740;
}

.business-combobox__empty {
  padding-right: 10px;
  color: #77819a;
  cursor: default;
}

.business-combobox > .business-combobox__native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (min-width: 701px) {
  table[data-table-aligned="true"] :is(th, td).table-cell--text {
    text-align: left !important;
  }

  table[data-table-aligned="true"] :is(th, td).table-cell--numeric {
    font-variant-numeric: tabular-nums;
    text-align: right !important;
  }

  table[data-table-aligned="true"] :is(th, td).table-cell--center {
    text-align: center !important;
  }
}

.table-export-feedback {
  margin: 0;
  padding: 7px 12px;
  border-top: 1px solid #f0d6d4;
  border-bottom: 1px solid #f0d6d4;
  background: #fff7f6;
  color: #8a2c2a;
  font-size: 0.72rem;
  font-weight: 600;
}

.table-export-feedback[hidden] {
  display: none;
}

/* Packages */

/* POS */

.pos-page {
  display: grid;
  gap: 12px;
  color: var(--ink);
}

.pos-heading {
  display: flex;
  min-height: 58px;
  padding: 2px 0;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.pos-heading .eyebrow {
  margin-bottom: 5px;
}

.pos-heading h1 {
  margin: 0 0 3px;
  color: var(--ink);
  font-size: clamp(1.28rem, 1.55vw, 1.55rem);
  font-weight: 720;
  line-height: 1.1;
  letter-spacing: -0.035em;
}

.pos-heading p:last-child {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.76rem;
}

.pos-heading__scope {
  max-width: 260px;
  padding: 6px 10px;
  border: 1px solid #dbe1ec;
  border-radius: 7px;
  background: #fff;
  color: #56617d;
  font-size: 0.68rem;
  font-weight: 650;
  text-align: right;
}

.pos-panel,
.pos-receipt {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e1e6ef;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 7px 22px rgb(17 34 98 / 5%);
}

.pos-controls {
  display: grid;
  padding: 12px;
  border-bottom: 1px solid #e5e9f1;
  grid-template-columns: minmax(300px, 1.55fr) minmax(170px, 0.8fr) minmax(160px, 0.7fr) auto;
  align-items: end;
  gap: 9px;
}

.pos-field {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.pos-field > span {
  color: #4f5b78;
  font-size: 0.66rem;
  font-weight: 650;
}

.pos-field input,
.pos-field select,
.pos-proof__form input {
  width: 100%;
  min-height: 37px;
  padding: 6px 9px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink);
  font-size: 0.78rem;
  outline: 0;
  transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.pos-field input:hover,
.pos-field select:hover,
.pos-proof__form input:hover {
  border-color: #8d99b6;
}

.pos-field input:focus,
.pos-field select:focus,
.pos-proof__form input:focus {
  border-color: var(--brand-dark);
  background: #fff;
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.pos-field input:disabled,
.pos-field select:disabled {
  border-color: #e0e4ec;
  background: #f2f4f8;
  color: #8b93a8;
  cursor: not-allowed;
}

.pos-scan {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  align-items: end;
  gap: 7px;
}

.pos-reassign__toggle {
  min-height: 37px;
  padding-block: 6px;
}

.pos-reassign__toggle {
  white-space: nowrap;
}

.pos-reassign {
  display: grid;
  padding: 10px 12px;
  border-bottom: 1px solid #e5e9f1;
  grid-template-columns: minmax(170px, 1fr) minmax(160px, 1fr) auto auto;
  align-items: end;
  gap: 9px;
  background: #fbfcff;
}

.pos-reassign[hidden] {
  display: none;
}

.pos-reassign .primary-button,
.pos-reassign .secondary-button {
  min-height: 37px;
  padding-block: 6px;
}

.pos-feedback {
  min-height: 34px;
  padding: 8px 12px;
  border-bottom: 1px solid #edf0f5;
  color: #5b6681;
  font-size: 0.71rem;
  font-weight: 600;
}

.pos-feedback:empty {
  display: none;
}

.pos-feedback--success {
  background: #f5fbf8;
  color: #176c4e;
}

.pos-feedback--warning {
  background: #fff9e8;
  color: #795000;
}

.pos-feedback--error {
  background: #fff6f5;
  color: #8a2c2a;
}

.pos-feedback--legacy-blue,
.pos-feedback--legacy-red,
.pos-feedback--legacy-orange,
.pos-feedback--legacy-green {
  color: #fff;
  font-weight: 750;
}

.pos-feedback--legacy-blue {
  background: #003cff;
}

.pos-feedback--legacy-red {
  background: #ff0000;
}

.pos-feedback--legacy-orange {
  background: #e88d05;
}

.pos-feedback--legacy-green {
  background: #08aa08;
}

.pos-ownership,
.pos-commit-recovery,
.pos-scan-outbox {
  display: grid;
  padding: 10px 12px;
  gap: 8px;
  font-size: 0.72rem;
}

.pos-ownership {
  border-bottom: 1px solid #c8d8f1;
  background: #f1f6fd;
  color: #25466e;
}

.pos-commit-recovery,
.pos-scan-outbox {
  border-bottom: 1px solid #ead7a2;
  background: #fff9e8;
  color: #654600;
}

.pos-ownership[hidden],
.pos-commit-recovery[hidden],
.pos-scan-outbox[hidden] {
  display: none;
}

.pos-ownership > p,
.pos-commit-recovery > p,
.pos-scan-outbox > p {
  margin: 0;
}

.pos-scan-outbox__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pos-scan-outbox__header span {
  color: #795f20;
  font-variant-numeric: tabular-nums;
}

.pos-scan-outbox__list {
  display: grid;
  margin: 0;
  padding: 0;
  gap: 6px;
  list-style: none;
}

.pos-scan-outbox__list li {
  display: grid;
  min-height: 38px;
  padding: 6px 8px;
  border: 1px solid #efdba8;
  border-radius: 7px;
  grid-template-columns: minmax(130px, 0.35fr) minmax(220px, 1fr) auto;
  align-items: center;
  gap: 10px;
  background: #fff;
}

.pos-scan-outbox__list li > span {
  color: #382d15;
  font-weight: 750;
}

.pos-scan-outbox__list li > small {
  color: #795f20;
}

.pos-scan-outbox__actions {
  display: flex;
  gap: 6px;
}

.pos-scan-outbox .pos-scan-outbox__actions .secondary-button {
  width: 31px;
  min-width: 31px;
  min-height: 31px;
  padding: 5px;
}

.pos-commit-recovery .pos-scan-outbox__actions .secondary-button {
  width: auto;
  min-height: 33px;
  padding: 6px 10px;
}

.pos-scan-outbox__clear {
  width: max-content;
}

.pos-draft__header {
  display: flex;
  min-height: 48px;
  padding: 7px 12px;
  border-bottom: 1px solid #e5e9f1;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.pos-draft__count {
  display: flex;
  align-items: baseline;
  gap: 9px;
}

.pos-draft__count span {
  color: #5a6682;
  font-size: 0.7rem;
  font-weight: 650;
}

.pos-draft__count strong {
  color: var(--brand-dark);
  font-size: 1.1rem;
  font-variant-numeric: tabular-nums;
}

.pos-table-region {
  min-width: 0;
  max-height: min(52vh, 620px);
  overflow: auto;
  overscroll-behavior: contain;
}

.pos-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
  background: #fff;
  font-size: 0.72rem;
}

.pos-table--withdrawal {
  min-width: 1220px;
}

.pos-table th,
.pos-table td {
  height: 35px;
  padding: 6px 9px;
  border-bottom: 1px solid #edf0f5;
  vertical-align: middle;
  white-space: nowrap;
}

.pos-table th {
  position: sticky;
  z-index: 2;
  top: 0;
  background: #f8f9fc;
  color: #59647f;
  font-size: 0.65rem;
  font-weight: 680;
  text-align: left;
}

.pos-table tbody tr:hover > td {
  background: #f7f9fc;
}

.pos-table tbody .pos-draft-row--business > td,
.pos-table tbody .pos-draft-row--business:hover > td {
  background: var(--pos-row-background);
  color: var(--pos-row-color);
}

.pos-table tbody .pos-draft-row--status-15 > td,
.pos-table tbody .pos-draft-row--status-15:hover > td {
  background: yellow;
  color: #000;
}

.pos-table tbody .pos-draft-row--duplicate > td,
.pos-table tbody .pos-draft-row--duplicate:hover > td {
  background: red;
  color: white;
}

.pos-table tbody .pos-draft-row--business .pos-table__package-link,
.pos-table tbody .pos-draft-row--status-15 .pos-table__package-link,
.pos-table tbody .pos-draft-row--duplicate .pos-table__package-link {
  color: inherit;
}

.pos-table tbody tr:last-child td {
  border-bottom: 0;
}

.pos-table__number {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.pos-table__recipient,
.pos-table__package-link {
  color: #26365f;
  font-weight: 700;
}

.pos-table__package-link:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.pos-table__copy {
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pos-table__issue-comment {
  width: 280px;
  min-width: 220px;
  max-width: 360px;
  white-space: normal !important;
  line-height: 1.35;
}

.pos-table__actions {
  width: 58px;
  text-align: right;
}

.pos-table__delete {
  min-height: 28px;
  padding: 4px 8px;
  border: 1px solid #e2b8b6;
  border-radius: 6px;
  background: #fff;
  color: #9b302e;
  cursor: pointer;
  font-size: 0.66rem;
  font-weight: 700;
}

.pos-table__delete:hover:not(:disabled) {
  border-color: #c97773;
  background: #fff6f5;
}

.pos-business-summary {
  display: grid;
  padding: 10px 12px 12px;
  border-top: 1px solid #e5e9f1;
  grid-template-columns: minmax(160px, 0.45fr) minmax(0, 1.55fr);
  align-items: start;
  gap: 12px;
}

.pos-business-summary h2 {
  margin: 4px 0 0;
  font-size: 0.78rem;
}

.pos-business-summary__list {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 6px;
}

.pos-business-summary__list > div {
  display: flex;
  min-width: 0;
  padding: 7px 9px;
  border: 1px solid #e5e9f1;
  border-radius: 7px;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  background: #fbfcfe;
}

.pos-business-summary dt {
  overflow: hidden;
  color: #4c5876;
  font-size: 0.68rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pos-business-summary dd {
  margin: 0;
  color: var(--brand-dark);
  font-size: 0.78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

.pos-empty {
  margin: 0;
  padding: 22px 14px;
  color: #747e97;
  font-size: 0.74rem;
  text-align: center;
}

.pos-commit {
  display: flex;
  min-height: 58px;
  padding: 9px 12px;
  border-top: 1px solid #e5e9f1;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
}

.pos-commit p {
  margin: 0;
  color: #68738d;
  font-size: 0.68rem;
}

.pos-commit__button {
  min-width: 164px;
}

.pos-invoice-filters {
  display: grid;
  padding: 12px;
  border-bottom: 1px solid #e5e9f1;
  grid-template-columns: 142px 142px minmax(160px, 0.8fr) minmax(160px, 0.8fr) minmax(190px, 1fr) auto;
  align-items: end;
  gap: 9px;
}

.pos-invoice-filters__submit,
.pos-report-filters__submit {
  min-height: 37px;
  padding-block: 6px;
}

.pos-pagination {
  display: flex;
  min-height: 52px;
  padding: 8px 12px;
  border-top: 1px solid #e5e9f1;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.pos-pagination[hidden] {
  display: none;
}

.pos-pagination span {
  min-width: 96px;
  color: #65708a;
  font-size: 0.68rem;
  font-weight: 650;
  text-align: center;
}

.pos-receipt-host:empty {
  display: none;
}

.pos-receipt {
  width: min(100%, 1120px);
  margin: 0 auto;
  padding: 18px;
  overflow: visible;
}

.pos-receipt__document {
  min-width: 0;
}

.pos-receipt__header {
  display: flex;
  min-height: 94px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--brand-dark);
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.pos-receipt__identity .eyebrow {
  margin-bottom: 4px;
}

.pos-receipt__identity h2 {
  margin: 0;
  font-size: 1.35rem;
}

.pos-receipt__number {
  margin: 3px 0 0;
  color: #68738c;
  font-size: 0.68rem;
  font-weight: 650;
}

.pos-receipt__print-logo {
  display: none;
  width: 164px;
  height: auto;
  margin-bottom: 12px;
}

.pos-receipt__qr {
  display: grid;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  overflow: hidden;
  border: 1px solid #dce1eb;
  place-items: center;
  background: #fff;
  color: #6a748d;
  font-size: 0.62rem;
  font-weight: 700;
  text-align: center;
}

.pos-receipt__qr img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pos-receipt__facts {
  display: grid;
  margin: 0;
  padding: 12px 0;
  border-bottom: 1px solid #e5e9f1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px 18px;
}

.pos-receipt__facts > div {
  min-width: 0;
}

.pos-receipt__facts dt {
  color: #758099;
  font-size: 0.6rem;
  font-weight: 650;
  text-transform: uppercase;
}

.pos-receipt__facts dd {
  overflow: hidden;
  margin: 2px 0 0;
  color: #26365e;
  font-size: 0.73rem;
  font-weight: 680;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pos-receipt__table-region {
  min-width: 0;
  margin-top: 12px;
  overflow: auto;
}

.pos-receipt__table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-size: 0.7rem;
}

.pos-receipt__table th,
.pos-receipt__table td {
  height: 34px;
  padding: 6px 8px;
  border-bottom: 1px solid #e8ebf2;
  text-align: left;
}

.pos-receipt__table th {
  background: #f8f9fc;
  color: #59647f;
  font-size: 0.63rem;
  font-weight: 680;
}

.pos-receipt__package-link {
  color: var(--brand-dark);
  font-weight: 720;
}

.pos-status {
  display: inline-flex;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid var(--pos-status-color, #112262);
  border-radius: 5px;
  align-items: center;
  background: var(--pos-status-color, #112262);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 16%);
  color: #fff;
  font-size: 0.63rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.pos-receipt__totals {
  width: min(100%, 430px);
  margin: 12px 0 0 auto;
}

.pos-receipt__total {
  display: grid;
  min-height: 32px;
  padding: 6px 8px;
  border-bottom: 1px solid #e6eaf1;
  grid-template-columns: minmax(100px, 1fr) minmax(90px, auto) minmax(90px, auto);
  align-items: center;
  gap: 12px;
}

.pos-receipt__total dt,
.pos-receipt__total dd {
  margin: 0;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
}

.pos-receipt__total dt {
  color: #59647f;
  font-weight: 650;
}

.pos-receipt__total dd {
  color: #26365e;
  font-weight: 700;
  text-align: right;
}

.pos-receipt__total--net {
  border-bottom: 0;
  background: #f7f9fc;
}

.pos-receipt__total--net dt,
.pos-receipt__total--net dd {
  color: var(--brand-dark);
  font-weight: 780;
}

.pos-proof {
  display: flex;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #e5e9f1;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.pos-proof__heading {
  display: flex;
  min-width: 150px;
  align-items: center;
  gap: 8px;
}

.pos-proof__heading h3 {
  margin: 0;
  font-size: 0.78rem;
}

.pos-proof__state {
  color: #80889c;
  font-size: 0.62rem;
  font-weight: 650;
}

.pos-proof__state--ready {
  color: var(--success);
}

.pos-proof__form {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.pos-proof__form input {
  min-height: 36px;
  max-width: 260px;
}

.pos-proof__feedback {
  margin: 0;
  color: #176c4e;
  font-size: 0.65rem;
  font-weight: 650;
}

.pos-proof__feedback--error,
.pos-receipt__export-error {
  color: #8a2c2a;
}

.pos-receipt__toolbar {
  display: flex;
  min-height: 52px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #e5e9f1;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.pos-receipt__replay {
  margin-right: auto;
  color: #6a748c;
  font-size: 0.65rem;
  font-weight: 650;
}

.pos-receipt__print {
  min-width: 144px;
}

.pos-report-filters {
  display: grid;
  padding: 12px;
  border-bottom: 1px solid #e5e9f1;
  grid-template-columns: 150px 150px minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
  gap: 9px;
}

.pos-report-summary {
  display: grid;
  padding: 10px 12px;
  border-bottom: 1px solid #e5e9f1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.pos-report-summary__item {
  display: flex;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid #e2e7ef;
  border-radius: 7px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: #fbfcfe;
}

.pos-report-summary__item span {
  color: #5c6781;
  font-size: 0.68rem;
  font-weight: 650;
}

.pos-report-summary__item strong {
  color: var(--brand-dark);
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}

.pos-report-table,
.pos-invoices-table {
  min-width: 720px;
}

@media (max-width: 1240px) {
  .pos-controls {
    grid-template-columns: minmax(280px, 1.5fr) minmax(160px, 0.75fr) minmax(150px, 0.7fr);
  }

  .pos-reassign__toggle {
    grid-column: 3;
    grid-row: 2;
    justify-self: end;
  }

  .pos-invoice-filters {
    grid-template-columns: repeat(4, minmax(140px, 1fr));
  }

  .pos-field--query {
    grid-column: span 3;
  }
}

@media (max-width: 820px) {
  .pos-heading {
    align-items: flex-start;
  }

  .pos-controls,
  .pos-invoice-filters,
  .pos-report-filters,
  .pos-reassign {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pos-scan,
  .pos-field--query {
    grid-column: 1 / -1;
  }

  .pos-reassign__toggle {
    grid-column: auto;
    grid-row: auto;
    justify-self: stretch;
  }

  .pos-business-summary {
    grid-template-columns: 1fr;
  }

  .pos-scan-outbox__header {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
  }

  .pos-scan-outbox__list li {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .pos-scan-outbox__list li > small {
    grid-column: 1;
  }

  .pos-scan-outbox__actions {
    grid-column: 2;
    grid-row: 1 / span 2;
  }

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

  .pos-proof,
  .pos-proof__form {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 520px) {
  .pos-heading,
  .pos-commit,
  .pos-receipt__toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .pos-heading__scope {
    max-width: none;
    text-align: left;
  }

  .pos-controls,
  .pos-invoice-filters,
  .pos-report-filters,
  .pos-reassign,
  .pos-report-summary {
    grid-template-columns: 1fr;
  }

  .pos-reassign__toggle,
  .pos-field--query {
    grid-column: auto;
  }

  .pos-commit__button,
  .pos-receipt__print {
    width: 100%;
  }

  .pos-receipt {
    padding: 12px;
  }

  .pos-receipt__facts {
    grid-template-columns: 1fr 1fr;
  }
}

/* Bulk package search */

.bulk-search-page {
  display: grid;
  gap: 12px;
}

.bulk-search-panel {
  min-height: 260px;
}

.bulk-search-form {
  display: grid;
  padding: 14px;
  border-bottom: 1px solid #e4e8f0;
  grid-template-columns: minmax(0, 1fr) 132px;
  align-items: stretch;
  gap: 12px;
  background: #fff;
}

.bulk-search-input {
  display: grid;
  min-width: 0;
  gap: 6px;
}

.bulk-search-input > span {
  color: #4f5b78;
  font-size: 0.68rem;
  font-weight: 700;
}

.bulk-search-input textarea {
  width: 100%;
  min-height: 92px;
  padding: 10px 12px;
  resize: vertical;
  border: 1px solid #cbd3e1;
  border-radius: 8px;
  background: #fbfcfe;
  color: var(--ink);
  box-shadow: none;
  font: inherit;
  font-size: 0.8rem;
  line-height: 1.5;
  outline: 0;
  transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.bulk-search-input textarea:hover {
  border-color: #8996b5;
}

.bulk-search-input textarea:focus {
  border-color: var(--brand-dark);
  background: #fff;
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.bulk-search-input small {
  color: var(--ink-faint);
  font-size: 0.65rem;
}

.bulk-search-submit {
  min-height: 44px;
  margin-top: 21px;
  align-self: start;
}

.bulk-search-toolbar {
  display: flex;
  min-height: 48px;
  padding: 7px 12px;
  border-bottom: 1px solid #e4e8f0;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.bulk-search-toolbar[hidden] {
  display: none;
}

.bulk-search-toolbar p {
  margin: 0;
  color: #4f5b78;
  font-size: 0.74rem;
  font-weight: 600;
}

.bulk-search-export {
  min-width: 126px;
}

.bulk-search-table {
  min-width: 1420px;
}

.bulk-search-table__copy {
  min-width: 170px;
  max-width: 280px;
  line-height: 1.4;
  white-space: normal;
}

.bulk-search-table__status {
  min-width: 130px;
}

.bulk-search-status--plain {
  display: inline-flex;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  align-items: center;
  background: #65728b;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 600;
}

.bulk-search-table__link {
  color: var(--brand-dark);
  font-weight: 700;
  text-decoration: none;
}

.bulk-search-table__link:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.bulk-search-table__link:focus-visible {
  border-radius: 3px;
  outline: 2px solid rgb(17 34 98 / 28%);
  outline-offset: 2px;
}

.bulk-search-missing {
  margin: 10px 12px;
  padding: 8px 10px;
  border: 1px solid #e2e6ee;
  border-radius: 7px;
  background: #fbfcfe;
  color: #4f5b78;
  font-size: 0.72rem;
}

.bulk-search-missing summary {
  cursor: pointer;
  font-weight: 700;
}

.bulk-search-missing p {
  margin: 7px 0 0;
  overflow-wrap: anywhere;
  line-height: 1.5;
}

.bulk-search-invalid {
  margin: 8px 12px 12px;
  color: #7b5d18;
  font-size: 0.72rem;
  font-weight: 600;
}

@media (max-width: 760px) {
  .bulk-search-form {
    grid-template-columns: 1fr;
  }

  .bulk-search-submit {
    min-height: 42px;
    margin-top: 0;
  }
}

/* Package creation */

.package-create-page {
  display: grid;
  gap: 12px;
}

.package-create-heading {
  display: flex;
  min-height: 46px;
  align-items: flex-end;
  justify-content: space-between;
}

.package-create-heading h1 {
  margin: 0;
  font-size: 1.18rem;
}

.package-create-heading p {
  margin: 2px 0 0;
  color: var(--ink-faint);
  font-size: 0.7rem;
}

.package-create-page-status {
  min-height: 18px;
  color: var(--ink-soft);
  font-size: 0.72rem;
}

.package-create-page-status:empty {
  display: none;
}

.package-create-page-status--error,
.package-create-feedback--error {
  color: var(--danger);
}

.package-create-body {
  min-height: 240px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  overflow: visible;
}

.package-create-form {
  display: grid;
  border-radius: inherit;
  grid-template-columns: minmax(0, 1fr) minmax(350px, 400px);
}

.package-create-form__main {
  min-width: 0;
  border-radius: 14px 0 0 14px;
  background: var(--surface);
}

.package-create-feedback {
  min-height: 35px;
  padding: 9px 16px 7px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: 0.72rem;
  font-weight: 650;
}

.package-create-feedback:empty {
  min-height: 0;
  padding: 0;
  border-bottom: 0;
}

.package-create-section {
  min-width: 0;
  margin: 0;
  padding: 0 22px 16px;
  border: 0;
  border-bottom: 1px solid var(--line);
}

.package-create-section legend {
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 11px;
  padding: 12px 0 0;
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 780;
}

.package-create-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 15px 16px;
}

.package-create-field,
.package-create-lookup {
  display: grid;
  min-width: 0;
  grid-column: span 6;
  align-content: start;
  gap: 5px;
}

.package-create-field--wide,
.package-create-locked {
  grid-column: 1 / -1;
}

.package-create-field--quarter {
  grid-column: span 3;
}

.package-create-field__label,
.package-create-field > span:first-child,
.package-create-locked > span {
  color: #52607e;
  font-size: 0.7rem;
  font-weight: 720;
}

.package-create-field__required {
  color: var(--danger);
}

.package-create-input,
.package-create-select,
.package-create-lookup input,
.package-create-lookup select {
  width: 100%;
  min-width: 0;
  height: 44px;
  padding: 9px 11px;
  border: 1px solid #cbd3e1;
  border-radius: 9px;
  background: #fff;
  color: var(--ink);
  box-shadow: none;
  font-size: 0.79rem;
  outline: 0;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.package-create-input[type="hidden"] {
  display: none;
}

.package-create-input:hover,
.package-create-select:hover,
.package-create-lookup input:hover,
.package-create-lookup select:hover {
  border-color: #8996b5;
}

.package-create-input:focus,
.package-create-select:focus,
.package-create-lookup input:focus,
.package-create-lookup select:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.package-create-input:disabled,
.package-create-select:disabled,
.package-create-lookup input:disabled,
.package-create-lookup select:disabled {
  cursor: not-allowed;
  background: #f3f5f8;
  color: #707a91;
}

.package-create-field small,
.package-create-lookup__status {
  min-height: 14px;
  color: var(--ink-faint);
  font-size: 0.64rem;
  line-height: 1.3;
}

.package-create-lookup {
  position: relative;
  grid-template-columns: 1fr;
}

.package-create-lookup--combobox::after {
  position: absolute;
  z-index: 2;
  top: 41px;
  right: 15px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid #63708d;
  border-bottom: 1.5px solid #63708d;
  content: "";
  pointer-events: none;
  transform: translateY(-65%) rotate(45deg);
  transition: transform 140ms ease, border-color 140ms ease;
}

.package-create-lookup--combobox.package-create-lookup--open::after {
  border-color: var(--brand-dark);
  transform: translateY(-20%) rotate(225deg);
}

.package-create-lookup--combobox > .package-create-input {
  padding-right: 40px;
  padding-left: 38px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='8.5' cy='8.5' r='5.5' stroke='%2363708d' stroke-width='1.7'/%3E%3Cpath d='m12.7 12.7 4 4' stroke='%2363708d' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E") 13px center / 15px 15px no-repeat,
    #fff;
  text-overflow: ellipsis;
}

.package-create-lookup--combobox > .package-create-input::-webkit-search-cancel-button {
  display: none;
}

.package-create-input[aria-invalid="true"],
.package-create-select[aria-invalid="true"],
.package-create-lookup--combobox > .package-create-input[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgb(185 58 56 / 9%);
}

.package-create-lookup > .package-create-field__label,
.package-create-lookup__status {
  grid-column: auto;
}

.package-create-lookup__more {
  min-height: 28px;
  padding: 3px 8px;
  border: 0;
  background: transparent;
  color: var(--brand-dark);
  cursor: pointer;
  font-size: 0.63rem;
  font-weight: 730;
  text-align: left;
}

.package-create-lookup__more[hidden] {
  display: none;
}

.package-create-lookup__status:empty {
  display: none;
}

.package-create-lookup__results {
  position: absolute;
  z-index: 24;
  top: 68px;
  right: 0;
  left: 0;
  display: block;
  max-height: min(280px, 42vh);
  padding: 6px;
  border: 1px solid #c7cfde;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 16px 36px rgb(17 34 98 / 17%);
  overflow: auto;
  overscroll-behavior: contain;
}

.package-create-lookup__results[hidden] {
  display: none;
}

.package-create-lookup__option {
  display: block;
  width: 100%;
  min-height: 38px;
  padding: 9px 34px 9px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #27365e;
  cursor: pointer;
  font-size: 0.76rem;
  font-weight: 560;
  line-height: 1.3;
  text-align: left;
}

.package-create-lookup__option:hover,
.package-create-lookup__option:focus-visible {
  background: #eef2fa;
  color: var(--brand-dark);
  outline: 0;
}

.package-create-lookup__option[aria-selected="true"] {
  position: relative;
  background: #f4f6fb;
  font-weight: 740;
}

.package-create-lookup__option[aria-selected="true"]::after {
  position: absolute;
  top: 50%;
  right: 12px;
  color: var(--brand-dark);
  content: "\2713";
  font-size: 0.78rem;
  font-weight: 800;
  transform: translateY(-50%);
}

.package-create-locked {
  display: grid;
  min-height: 38px;
  padding: 6px 10px;
  border-left: 3px solid var(--brand);
  align-content: center;
  background: #fffdf3;
  gap: 0;
}

.package-create-locked strong {
  font-size: 0.76rem;
}

.package-create-toggles {
  display: flex;
  padding: 12px 0 0;
  flex-wrap: wrap;
  gap: 8px 22px;
}

.package-create-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  font-size: 0.68rem;
  font-weight: 680;
}

.package-create-field[hidden],
.package-create-toggle[hidden] {
  display: none;
}

.package-create-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.package-create-toggle__control {
  position: relative;
  width: 29px;
  height: 16px;
  border: 1px solid #aeb8cc;
  border-radius: 20px;
  background: #e6e9f0;
  transition: background 140ms ease, border-color 140ms ease;
}

.package-create-toggle__control::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgb(17 34 98 / 22%);
  content: "";
  transition: transform 140ms ease;
}

.package-create-toggle input:checked + .package-create-toggle__control {
  border-color: var(--brand-dark);
  background: var(--brand-dark);
}

.package-create-toggle input:checked + .package-create-toggle__control::after {
  transform: translateX(13px);
}

.package-create-toggle input:focus-visible + .package-create-toggle__control {
  outline: 3px solid rgb(17 34 98 / 18%);
  outline-offset: 2px;
}

.package-create-actions {
  display: flex;
  min-height: 58px;
  padding: 10px 16px;
  align-items: center;
  justify-content: flex-end;
}

.package-create-submit {
  min-width: 150px;
  min-height: 40px;
}

.package-create-side {
  min-width: 0;
  border-left: 1px solid var(--line);
  border-radius: 0 14px 14px 0;
  background: #f4f6fa;
}

.package-create-side__sticky {
  position: sticky;
  top: 16px;
  padding: 20px;
}

.package-create-side-actions {
  display: grid;
  width: 100%;
  min-height: 0;
  margin-top: 18px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 11px;
  justify-content: stretch;
}

.package-create-side-actions__prints[hidden] {
  display: none;
}

.package-profile-actions__grid.package-create-side-actions__prints {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.package-create-side-actions .package-create-submit {
  width: 100%;
  min-height: 44px;
  grid-column: 1 / -1;
}

.package-create-side-actions .package-create-print-button {
  display: inline-flex;
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 9px 10px;
  align-items: center;
  justify-content: center;
  line-height: 1.25;
  overflow: visible;
  overflow-wrap: anywhere;
  text-align: center;
  white-space: normal;
}

.package-create-side-actions .package-print-link--wide {
  grid-column: 1 / -1;
}

.package-create-quote,
.package-create-result {
  padding: 16px 18px;
}

.package-create-result {
  background: transparent;
}

.package-create-quote h2,
.package-create-result h2 {
  margin: 0 0 10px;
  font-size: 0.82rem;
}

.package-create-quote__body {
  min-height: 86px;
  color: var(--ink-soft);
  font-size: 0.69rem;
}

.package-create-quote__rows,
.package-create-result__details {
  display: grid;
  margin: 0;
  gap: 0;
}

.package-create-quote__rows > div,
.package-create-result__details > div {
  display: flex;
  min-height: 30px;
  border-bottom: 1px solid #e7eaf1;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.package-create-quote__rows dt,
.package-create-result__details dt {
  color: var(--ink-faint);
}

.package-create-quote__rows dd,
.package-create-result__details dd {
  margin: 0;
  color: var(--ink);
  font-weight: 720;
  text-align: right;
}

.package-create-quote__rows .package-create-quote__total {
  min-height: 39px;
  border-bottom: 0;
  color: var(--ink);
  font-size: 0.76rem;
  font-weight: 780;
}

.package-create-result__tracking {
  overflow-wrap: anywhere;
  color: var(--brand-dark);
  font-size: 0.82rem;
}

.package-create-print-button {
  width: 100%;
}

.package-create-print-button:disabled {
  cursor: wait;
  opacity: 0.55;
}

.package-client-suggestions {
  position: relative;
  display: grid;
  margin-top: -5px;
  gap: 5px;
}

.package-client-suggestions__status {
  min-height: 0;
  color: var(--ink-faint);
  font-size: 0.64rem;
}

.package-client-suggestions__status:empty {
  display: none;
}

.package-client-suggestions:has(> .package-client-suggestions__selected[hidden]):has(> .package-client-suggestions__status:empty):has(> .package-client-suggestions__list[hidden]) {
  display: none;
}

.package-client-suggestions__selected {
  display: flex;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid #bad8c7;
  border-radius: 8px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  background: #eef9f2;
  color: #1f6b3d;
  font-size: 0.66rem;
}

.package-client-suggestions__selected[hidden],
.package-client-suggestions__list[hidden] {
  display: none;
}

.package-client-suggestions__selected strong {
  color: #164c2c;
  font-size: 0.69rem;
}

.package-client-suggestions__list {
  position: absolute;
  z-index: 12;
  top: 100%;
  right: 0;
  left: 0;
  display: grid;
  max-height: 240px;
  border: 1px solid #b9c3d6;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 14px 34px rgb(17 34 98 / 16%);
  overflow: auto;
}

.package-client-suggestions__option {
  display: grid;
  min-height: 48px;
  padding: 8px 11px;
  border: 0;
  border-bottom: 1px solid #edf0f5;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  gap: 2px;
  text-align: left;
}

.package-client-suggestions__option:hover,
.package-client-suggestions__option:focus-visible {
  background: #f2f5fb;
  outline: 0;
}

.package-client-suggestions__option span {
  color: var(--ink-faint);
  font-size: 0.66rem;
}

.package-create-pod {
  position: static;
  margin: 0;
  border: 1px solid #c9d0dd;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 12px 28px rgb(17 34 98 / 9%);
  overflow: hidden;
}

.package-create-pod__header {
  display: grid;
  padding: 14px 16px 12px;
  border-bottom: 2px solid var(--brand-dark);
  background: linear-gradient(135deg, #fff, #f3f6fb);
  gap: 9px;
}

.package-create-pod__header > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.package-create-pod__header > div span {
  color: var(--brand-dark);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.08em;
}

.package-create-pod__header > div strong {
  font-size: 1rem;
  letter-spacing: 0.08em;
}

.package-create-pod__body {
  display: grid;
  padding: 15px 16px;
  gap: 13px;
}

.package-create-pod__recipient,
.package-create-pod__address {
  display: grid;
  gap: 3px;
}

.package-create-pod__metrics span {
  color: var(--ink-faint);
  font-size: 0.58rem;
  font-weight: 730;
  text-transform: uppercase;
}

.package-create-pod__recipient strong {
  font-size: 0.92rem;
}

.package-create-pod__recipient span,
.package-create-pod__address span,
.package-create-pod__body p {
  color: var(--ink-soft);
  font-size: 0.7rem;
  line-height: 1.45;
}

.package-create-pod__metrics {
  display: grid;
  padding: 10px 0;
  border-top: 1px solid #e4e8f0;
  border-bottom: 1px solid #e4e8f0;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.package-create-pod__metrics > div {
  display: grid;
  gap: 3px;
}

.package-create-pod__body p {
  min-height: 15px;
  margin: 0;
}

.package-create-pod__flags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.package-create-pod__flags span {
  padding: 4px 7px;
  border-radius: 999px;
  background: #eef1f7;
  color: #46536e;
  font-size: 0.59rem;
  font-weight: 730;
}

.package-create-pod .package-create-quote {
  padding: 14px 16px 16px;
  border-top: 1px solid #dfe4ed;
  background: #f8f9fc;
}

.package-create-pod .package-create-quote__body {
  min-height: 0;
}

.package-create-modal {
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  padding: 0;
  border: 0;
  border-radius: 14px;
  color: var(--ink);
  box-shadow: 0 28px 90px rgb(12 24 70 / 28%);
  overflow: auto;
}

.package-create-modal::backdrop {
  background: rgb(11 20 49 / 54%);
  backdrop-filter: blur(2px);
}

.package-create-modal__card {
  padding: 20px;
  background: #fff;
}

.package-create-modal__header {
  display: flex;
  margin-bottom: 10px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.package-create-modal__header h2 {
  margin: 0;
  font-size: 1rem;
}

.package-create-modal__close {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #eef1f6;
  color: var(--ink);
  cursor: pointer;
  font-size: 1.2rem;
}

.package-create-modal__footer {
  display: flex;
  margin-top: 16px;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.package-create-modal__profile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

@media (max-width: 1080px) {
  .package-create-form {
    grid-template-columns: 1fr;
  }

  .package-create-side {
    border-top: 1px solid var(--line);
    border-left: 0;
    border-radius: 0 0 14px 14px;
  }

  .package-create-form__main {
    border-radius: 14px 14px 0 0;
  }

  .package-create-side__sticky {
    position: static;
    max-width: 560px;
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 900px) {
  .package-create-field--quarter {
    grid-column: span 6;
  }
}

@media (max-width: 720px) {
  .package-create-field,
  .package-create-lookup,
  .package-create-field--quarter {
    grid-column: span 6;
  }

  .package-create-field--wide,
  .package-create-locked {
    grid-column: 1 / -1;
  }
}

@media (max-width: 470px) {
  .package-create-heading p {
    display: none;
  }

  .package-create-side__sticky {
    padding: 14px;
  }

  .package-create-section {
    padding-right: 12px;
    padding-left: 12px;
  }

  .package-create-grid {
    column-gap: 8px;
  }

  .package-create-submit {
    width: 100%;
  }

}

.packages-page {
  display: grid;
  gap: 12px;
}

.packages-heading {
  display: flex;
  margin-top: -10px;
  padding: 2px 0;
  align-items: flex-end;
  gap: 18px;
  justify-content: space-between;
}

.packages-heading .eyebrow {
  margin-bottom: 6px;
}

.packages-heading h1 {
  margin-bottom: 4px;
  color: var(--ink);
  font-size: clamp(1.28rem, 1.55vw, 1.55rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.035em;
}

.packages-heading p:last-child {
  max-width: 720px;
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 0.78rem;
}

.packages-heading__action {
  display: inline-grid;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  flex: 0 0 auto;
  line-height: 0;
  place-items: center;
}

.packages-heading__action svg {
  width: 20px;
  height: 20px;
}

.packages-panel {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgb(226 231 241 / 72%);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 10px 28px rgb(17 34 98 / 6%);
}

.package-filters {
  display: grid;
  padding: 12px;
  border-bottom: 1px solid #e1e6ef;
  grid-template-columns: minmax(250px, 1.5fr) minmax(170px, 0.8fr) minmax(145px, 0.62fr) minmax(145px, 0.62fr) auto;
  align-items: end;
  gap: 10px;
  background: #ffffff;
}

.package-filter {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.package-filter--multi {
  position: relative;
}

.package-multi-select {
  position: relative;
  min-width: 0;
}

.package-multi-select summary {
  display: flex;
  width: 100%;
  min-height: 36px;
  padding: 6px 9px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
  background: #fbfcfe;
  color: var(--ink);
  cursor: pointer;
  font-size: 0.78rem;
  list-style: none;
  outline: 0;
  transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.package-multi-select summary::-webkit-details-marker {
  display: none;
}

.package-multi-select summary::after {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  margin: -3px 3px 0 4px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  color: #68738f;
  content: "";
  transform: rotate(45deg);
  transform-origin: center;
}

.package-multi-select[open] summary::after {
  margin-top: 3px;
  transform: rotate(225deg);
}

.package-multi-select summary:hover {
  border-color: #8996b5;
}

.package-multi-select summary:focus-visible,
.package-multi-select[open] summary {
  border-color: var(--ink);
  background: #fff;
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%), 0 1px 2px rgb(17 34 98 / 5%);
}

.package-multi-select summary > span {
  overflow: hidden;
  min-width: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.package-multi-select summary > small {
  display: inline-grid;
  min-width: 20px;
  min-height: 20px;
  margin-left: auto;
  padding: 2px 5px;
  border-radius: 999px;
  place-items: center;
  background: #e8ecf6;
  color: var(--brand-dark);
  font-size: 0.62rem;
  font-weight: 700;
}

.package-multi-select summary > small:empty {
  display: none;
}

.package-multi-select--selected summary {
  border-color: #9da8c2;
  background: #fff;
  font-weight: 650;
}

.package-multi-select__panel {
  position: absolute;
  z-index: 40;
  top: calc(100% + 5px);
  left: 0;
  width: max(100%, 250px);
  padding: 8px;
  border: 1px solid #cbd3e1;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 16px 42px rgb(17 34 98 / 16%);
}

.package-multi-select__search {
  width: 100%;
  min-height: 34px;
  margin-bottom: 7px;
  padding: 6px 9px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink);
  font-size: 0.75rem;
  outline: 0;
}

.package-multi-select__search:focus {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.package-multi-select__options {
  display: grid;
  max-height: 260px;
  overflow-y: auto;
  overscroll-behavior: contain;
  gap: 2px;
  scrollbar-width: thin;
}

.package-multi-select__option {
  display: grid;
  min-height: 32px;
  padding: 5px 7px;
  border-radius: 6px;
  align-items: center;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  color: #263354;
  cursor: pointer;
  font-size: 0.73rem;
}

.package-multi-select__option:hover,
.package-multi-select__option:focus-within {
  background: #f1f4fa;
}

.package-multi-select__group + .package-multi-select__group {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px solid #e3e8f2;
}

.package-multi-select__group-toggle {
  background: #f1f4fa;
}

.package-multi-select__group-toggle span {
  display: grid;
  gap: 2px;
}

.package-multi-select__group-toggle small {
  color: var(--ink-faint);
  font-size: 0.66rem;
  font-weight: 400;
}

.package-filter .package-multi-select__option input {
  width: 15px;
  height: 15px;
  min-height: 15px;
  margin: 0;
  padding: 0;
  border: 0;
  box-shadow: none;
  accent-color: var(--brand-dark);
}

.package-multi-select__empty {
  margin: 0;
  padding: 10px 6px;
  color: var(--ink-faint);
  font-size: 0.7rem;
  text-align: center;
}

.package-multi-select__empty[hidden] {
  display: none;
}

.package-filter > span {
  color: #4f5b78;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.015em;
}

.package-filter--checkbox {
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  align-items: center;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  background: var(--surface);
  cursor: pointer;
  box-shadow: none;
  transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

.package-filter--checkbox:hover {
  border-color: #8996b5;
  background: #fbfcff;
}

.package-filter--checkbox:focus-within {
  border-color: var(--ink);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.package-filter--checkbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  box-shadow: none;
  accent-color: var(--brand-dark);
  cursor: pointer;
}

.package-filter--checkbox > span {
  overflow: hidden;
  color: var(--ink);
  font-size: 0.76rem;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.package-filter__hint {
  color: var(--ink-faint);
  font-size: 0.61rem;
  line-height: 1.35;
}

.package-filter--disabled > span,
.package-filter--disabled .package-filter__hint {
  color: #9098ae;
}

.package-filter input,
.package-filter select,
.package-page-size select {
  width: 100%;
  min-height: 36px;
  padding: 6px 9px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  background: #fbfcfe;
  color: var(--ink);
  box-shadow: none;
  font-size: 0.78rem;
  outline: 0;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.package-filter input:hover,
.package-filter select:hover,
.package-page-size select:hover {
  border-color: #8996b5;
}

.package-filter input:disabled {
  border-color: var(--line);
  background: #f1f3f8;
  color: #8991a7;
  cursor: not-allowed;
}

.package-filter input:focus,
.package-filter select:focus,
.package-page-size select:focus {
  border-color: var(--ink);
  background: #fff;
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%), 0 1px 2px rgb(17 34 98 / 5%);
}

.package-filter-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.package-advanced-filters {
  grid-column: 1 / -1;
  padding-top: 2px;
}

.package-advanced-filters summary {
  width: max-content;
  padding: 5px 0;
  color: #4b5876;
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 600;
}

.package-advanced-filters summary:hover {
  color: var(--ink);
}

.package-advanced-filters__grid {
  display: grid;
  margin-top: 7px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 9px;
}

.package-filter-submit {
  min-height: 36px;
  padding: 6px 13px;
  white-space: nowrap;
}

.package-filter-error {
  margin: 0;
  padding: 8px 14px;
  border-bottom: 1px solid #efc3c1;
  background: #fff6f5;
  color: #8a2c2a;
  font-size: 0.76rem;
  font-weight: 600;
}

.package-filter-error[hidden],
.package-progress[hidden],
.package-pagination[hidden] {
  display: none;
}

.package-progress {
  position: absolute;
  z-index: 5;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  overflow: hidden;
  background: var(--brand-soft);
}

.package-progress span {
  display: block;
  width: 36%;
  height: 100%;
  animation: package-progress 1s ease-in-out infinite alternate;
  background: var(--brand);
}

@keyframes package-progress {
  from { transform: translateX(-10%); }
  to { transform: translateX(190%); }
}

.package-results-toolbar {
  display: flex;
  min-height: 42px;
  padding: 6px 12px;
  border-bottom: 1px solid #e4e8f0;
  align-items: center;
  gap: 18px;
  justify-content: space-between;
}

.package-results-toolbar__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.package-export-button {
  min-height: 34px;
  padding: 5px 11px;
  white-space: nowrap;
}

.package-results-toolbar > p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.75rem;
  color: #4f5b78;
  font-weight: 600;
}

.package-printing-panel .package-filters {
  grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.package-printing-panel .package-filter select[multiple] {
  min-height: 104px;
  padding: 4px;
  background: #fff;
}

.package-printing-panel .package-filter select[multiple] option {
  padding: 5px 7px;
  border-radius: 5px;
}

.package-printing-panel .package-filter select[multiple] option:checked {
  background: linear-gradient(var(--brand-dark), var(--brand-dark));
  color: #fff;
}

.package-printing-panel .package-filter-actions {
  align-self: end;
}

.package-printing-actions {
  position: sticky;
  z-index: 4;
  top: 0;
  background: rgb(255 255 255 / 96%);
  backdrop-filter: blur(10px);
}

.package-printing-actions .package-results-toolbar__actions {
  width: 100%;
  flex-wrap: wrap;
}

.package-printing-select-all {
  display: inline-flex;
  min-height: 34px;
  padding: 5px 9px;
  border: 1px solid #d8deea;
  border-radius: 7px;
  align-items: center;
  gap: 7px;
  background: #fff;
  color: #35415f;
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 650;
}

.package-printing-select-all input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: var(--brand-dark);
}

.package-printing-actions p {
  margin: 0;
  color: #56617b;
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}

.package-printing-action {
  min-height: 34px;
  padding: 5px 13px;
  box-shadow: 0 5px 14px rgb(17 34 98 / 12%);
  white-space: nowrap;
}

.package-printing-action:first-of-type {
  background: var(--brand-dark);
}

.package-printing-table__select {
  width: 54px;
  text-align: center;
}

.package-printing-table__select input {
  width: 16px;
  height: 16px;
  accent-color: var(--brand-dark);
}

.package-printing-row {
  cursor: pointer;
  outline: 0;
}

.package-printing-row.selected td {
  background: #f0f3fb;
}

.package-printing-row:focus-visible td {
  box-shadow: inset 0 2px 0 rgb(17 34 98 / 35%), inset 0 -2px 0 rgb(17 34 98 / 35%);
}

@media (max-width: 1100px) {
  .package-printing-panel .package-filters {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 640px) {
  .package-printing-panel .package-filters {
    grid-template-columns: minmax(0, 1fr);
  }

  .package-printing-actions .package-results-toolbar__actions,
  .package-printing-action,
  .package-printing-select-all {
    width: 100%;
  }

  .package-printing-action,
  .package-printing-select-all {
    justify-content: center;
  }
}

.package-page-size {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink-faint);
  font-size: 0.69rem;
  font-weight: 600;
}

.package-page-size select {
  min-width: 70px;
  min-height: 32px;
  padding: 4px 8px;
}

.package-results {
  min-height: 160px;
}

.package-table-region {
  max-width: 100%;
  max-height: min(68vh, 800px);
  overflow: auto;
  outline: 0;
}

.package-table-region:focus-visible {
  box-shadow: inset 0 0 0 3px rgb(17 34 98 / 12%);
}

.package-table {
  width: 100%;
  min-width: 1160px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
}

.package-table th {
  position: sticky;
  z-index: 2;
  top: 0;
  padding: 8px 9px;
  border-bottom: 1px solid #dce2ec;
  background: #f7f9fc;
  color: #58647f;
  font-size: 0.67rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-align: left;
  text-transform: none;
}

.package-table__sort {
  display: inline-flex;
  margin: -6px -8px;
  padding: 6px 8px;
  border: 0;
  align-items: center;
  gap: 5px;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
}

.package-table__sort:focus-visible {
  border-radius: 4px;
  outline: 2px solid rgb(17 34 98 / 28%);
  outline-offset: 1px;
}

.package-table__sort-mark {
  min-width: 0.7em;
  color: var(--brand-dark);
}

.package-table__column--number { width: 56px; }
.package-table__column--name { min-width: 150px; }
.package-table__column--comment { min-width: 160px; }
.package-table__column--phone { min-width: 138px; }
.package-table__column--address { min-width: 180px; }
.package-table__column--created,
.package-table__column--delivered,
.package-table__column--lastAction { min-width: 116px; }
.package-table__column--shippingFee,
.package-table__column--credit { min-width: 90px; }
.package-table__column--status { min-width: 124px; }

.package-table td {
  padding: 7px 9px;
  border-bottom: 1px solid #edf0f5;
  color: #4c5876;
  font-size: 0.75rem;
  vertical-align: middle;
}

.package-table tbody tr:last-child td {
  border-bottom: 0;
}

.package-table__summary-row td {
  border-top: 1px solid var(--line-strong);
  border-bottom: 0;
  background: #f6f8fb;
}

.package-table__summary-money {
  border-right: 1px solid var(--line) !important;
  border-left: 1px solid var(--line) !important;
  color: var(--ink) !important;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.package-table__summary-money span {
  display: block;
}

.package-table tbody tr:hover {
  background: #f4f7fc;
}

.package-table tbody tr.package-table__row--warning {
  background: #fff9e8;
  box-shadow: inset 4px 0 0 #d59600;
}

.package-table tbody tr.package-table__row--fee-missing {
  background: #edfaff;
  box-shadow: inset 4px 0 0 #1687a7;
}

.package-table tbody tr.package-table__row--prepaid {
  background: #eafaf1;
  box-shadow: inset 4px 0 0 #258a57;
}

.package-table tbody tr.package-table__row--stale {
  background: #fff2ef;
  box-shadow: inset 4px 0 0 #9c3932;
}

.package-table tbody tr.package-table__row--phone {
  background: #fff4f4;
  box-shadow: inset 4px 0 0 #bd3434;
}

.package-table tbody tr.package-table__row--warning:hover {
  filter: brightness(.985);
}

.package-table-stack {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.package-table-stack strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.package-table-stack small {
  overflow: hidden;
  color: var(--ink-faint);
  font-size: 0.64rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.package-table__detail-link {
  margin: -3px;
  padding: 3px;
  border-radius: 5px;
  color: inherit;
  text-decoration: none;
}

.package-table__detail-link:hover strong {
  color: var(--brand-dark);
  text-decoration: underline;
  text-decoration-color: rgb(17 34 98 / 28%);
  text-underline-offset: 2px;
}

.package-table__detail-link:focus-visible {
  outline: 2px solid rgb(17 34 98 / 28%);
  outline-offset: 1px;
}

.package-table__number,
.package-table__date,
.package-table__money {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.package-table__number {
  display: flex;
  align-items: center;
  gap: 5px;
}

.package-table__exchange {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}

.package-table__comment,
.package-table__address {
  line-height: 1.35;
}

.package-table__money {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.package-table__money--strong {
  color: var(--ink) !important;
  font-weight: 700;
}

.package-status {
  display: inline-flex;
  max-width: 100%;
  min-width: 92px;
  min-height: 23px;
  padding: 3px 9px;
  border: 1px solid var(--package-status-color, var(--ink));
  border-radius: 6px;
  align-items: center;
  justify-content: center;
  background: var(--package-status-color, var(--ink));
  color: #fff;
  font-size: 0.63rem;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 15%);
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

.package-status--with-credit {
  flex-direction: column;
}

.package-table__status-content {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 7px;
}

.package-table__status-group {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.package-table__status-line {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.package-table__issue-button {
  display: inline-grid;
  width: 27px;
  height: 27px;
  padding: 0;
  border: 1px solid #cbd5e5;
  border-radius: 50%;
  flex: 0 0 auto;
  place-items: center;
  background: #fff;
  color: var(--brand-dark);
  cursor: pointer;
  transition: border-color 130ms ease, background-color 130ms ease, color 130ms ease;
}

.package-table__issue-button:hover {
  border-color: #8795b4;
  background: #f1f4fb;
}

.package-table__issue-button:focus-visible {
  outline: 2px solid rgb(17 34 98 / 26%);
  outline-offset: 2px;
}

.package-issue-dialog {
  z-index: 2220;
}

.package-issue-dialog__surface {
  width: min(100%, 570px);
  overflow: hidden;
  border-color: #e0e6f0;
}

.package-issue-dialog__surface::before {
  display: block;
  height: 4px;
  background: #dc2626;
  content: "";
}

.package-issue-dialog[data-issue-kind="problematic"] .package-issue-dialog__surface::before {
  background: #d97706;
}

.package-issue-dialog__header {
  display: grid;
  padding: 24px 26px 0;
  align-items: start;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 13px;
}

.package-issue-dialog__mark {
  display: inline-grid;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  place-items: center;
  background: #fff0f0;
  color: #b42323;
}

.package-issue-dialog[data-issue-kind="problematic"] .package-issue-dialog__mark {
  background: #fff5df;
  color: #a96400;
}

.package-issue-dialog__eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #8b3440;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.package-issue-dialog[data-issue-kind="problematic"] .package-issue-dialog__eyebrow {
  color: #915900;
}

.package-issue-dialog__header h2 {
  margin: 0;
  color: var(--brand-dark);
  font-size: 1.15rem;
  line-height: 1.3;
}

.package-issue-dialog__package {
  margin: 5px 0 0;
  color: #6b7690;
  font-size: 0.75rem;
  font-weight: 650;
}

.package-issue-dialog__body {
  display: grid;
  padding: 18px 26px 24px;
  gap: 14px;
}

.package-issue-dialog__reason {
  margin: 0;
  padding: 15px 17px;
  border: 1px solid #e1e6ef;
  border-radius: 10px;
  background: #f8f9fc;
  color: #263454;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.6;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.package-issue-dialog__reason--loading {
  color: #707b94;
  font-weight: 500;
}

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

.package-issue-dialog__metadata[hidden] {
  display: none;
}

.package-issue-dialog__metadata div {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.package-issue-dialog__metadata dt {
  color: #7a849a;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.package-issue-dialog__metadata dd {
  margin: 0;
  color: #35415e;
  font-size: 0.76rem;
  font-weight: 650;
}

.package-issue-dialog__feedback {
  margin: 0;
  color: #66728c;
  font-size: 0.72rem;
  line-height: 1.45;
}

.package-issue-dialog__feedback[hidden] {
  display: none;
}

.package-issue-dialog__feedback--warning {
  color: #8b5b0a;
}

.package-issue-dialog__actions {
  display: flex;
  padding: 14px 26px 18px;
  border-top: 1px solid #e7eaf1;
  justify-content: flex-end;
  background: #fbfcfe;
}

.package-issue-dialog__close {
  min-width: 110px;
}

.package-table__delete {
  position: relative;
  width: 27px;
  height: 27px;
  padding: 0;
  border: 1px solid #e5c9c7;
  border-radius: 6px;
  flex: 0 0 auto;
  background: #fff;
  color: #a43f3b;
  cursor: pointer;
  transition: border-color 130ms ease, background-color 130ms ease, color 130ms ease;
}

.package-table__delete svg {
  display: block;
  margin: auto;
}

.package-table__delete:hover:not(:disabled) {
  border-color: #ca8c88;
  background: #fff7f6;
  color: #8e2f2b;
}

.package-table__delete:focus-visible {
  outline: 2px solid rgb(164 63 59 / 28%);
  outline-offset: 2px;
}

.package-table__delete:disabled {
  cursor: wait;
  opacity: 0.55;
}

.package-table__mobile-credit {
  display: none;
}

.package-mobile-table-region {
  display: none;
}

.package-skeleton {
  padding: 0 20px;
}

.package-skeleton__row {
  display: grid;
  min-height: 42px;
  border-bottom: 1px solid var(--line);
  grid-template-columns: 1.2fr 1.3fr 1.3fr 1.1fr 0.7fr 0.8fr;
  align-items: center;
  gap: 18px;
}

.package-skeleton__row span {
  height: 10px;
  border-radius: 999px;
  animation: package-skeleton 1.2s ease-in-out infinite alternate;
  background: #e9ecf4;
}

@keyframes package-skeleton {
  to { opacity: 0.45; }
}

.package-state {
  display: grid;
  min-height: 200px;
  padding: 22px 16px;
  place-content: center;
  justify-items: center;
  text-align: center;
}

.package-state__mark {
  display: grid;
  width: 40px;
  height: 40px;
  margin-bottom: 12px;
  place-items: center;
  border-radius: 8px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  font-size: 0.76rem;
  font-weight: 700;
}

.package-state--error .package-state__mark {
  background: #fff1f0;
  color: var(--danger);
}

.package-state h2 {
  margin-bottom: 6px;
  font-size: 1rem;
}

.package-state p {
  max-width: 450px;
  margin-bottom: 14px;
  color: var(--ink-soft);
  font-size: 0.8rem;
}

.package-pagination {
  display: grid;
  min-height: 50px;
  padding: 7px 12px;
  border-top: 1px solid #e4e8f0;
  background: #ffffff;
  grid-template-columns: auto minmax(120px, 1fr) auto;
  align-items: center;
  gap: 14px;
}

.package-pagination .secondary-button {
  min-height: 36px;
  padding: 6px 11px;
}

.package-pagination button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.package-pagination > span {
  color: var(--ink-faint);
  font-size: 0.7rem;
  font-weight: 600;
  text-align: center;
}

/* Package detail */

.package-detail-page {
  display: grid;
  gap: 16px;
}

.package-detail-heading {
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.package-detail-heading h1 {
  margin: 3px 0 0;
  color: var(--ink);
  font-size: clamp(1.28rem, 1.55vw, 1.55rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.1;
}

.package-detail-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #53607d;
  font-size: 0.71rem;
  font-weight: 700;
  text-decoration: none;
}

.package-detail-back::before {
  color: var(--brand-dark);
  content: "←";
}

.package-detail-back:hover {
  color: var(--brand-dark);
}

.package-detail-status {
  display: inline-flex;
  min-width: 104px;
  min-height: 26px;
  padding: 4px 11px;
  border: 1px solid var(--package-detail-status-color, var(--brand-dark));
  border-radius: 3px;
  align-items: center;
  justify-content: center;
  background: var(--package-detail-status-color, var(--brand-dark));
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.package-detail-content {
  display: grid;
  min-width: 0;
  gap: 30px;
}

.package-profile-grid {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(520px, 1.45fr) minmax(360px, 0.85fr);
  align-items: start;
  gap: 36px;
}

.package-profile-main,
.package-profile-label,
.package-profile-information {
  display: grid;
  min-width: 0;
}

.package-profile-main {
  gap: 30px;
}

.package-profile-information {
  padding-top: 2px;
  border-top: 1px solid #dfe4ed;
  gap: 24px;
}

.package-profile-label {
  gap: 18px;
}

.package-pod {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #dfe4ed;
  border-radius: 2px;
  background: #fff;
  box-shadow: none;
}

.package-pod__identity {
  display: flex;
  min-height: 70px;
  padding: 14px 18px 12px;
  border-bottom: 0;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.package-pod__identity-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
}

.package-pod__identity small,
.package-pod-party > small,
.package-pod__notes > small,
.package-pod__tracking small {
  display: block;
  margin-bottom: 3px;
  color: #77819a;
  font-size: 0.61rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.package-pod__identity h2 {
  margin: 0;
  color: #112262;
  font-size: clamp(1.12rem, 1.55vw, 1.42rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  overflow-wrap: anywhere;
}

.package-pod__tracking-identity {
  min-width: 0;
}

.package-pod__tracking-row {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
}

.package-pod__copy-code {
  width: 30px;
  min-width: 30px;
  min-height: 30px;
  padding: 6px;
  border: 1px solid #d7ddea;
  border-radius: 6px;
  flex: 0 0 auto;
  background: #f7f9fc;
  color: #112262;
  cursor: pointer;
}

.package-pod__copy-code:hover {
  border-color: #aeb9cf;
  background: #eef2f8;
}

.package-pod__copy-code:focus-visible {
  outline: 2px solid rgb(17 34 98 / 30%);
  outline-offset: 2px;
}

.package-pod__copy-code:disabled {
  cursor: default;
  opacity: 0.55;
}

.package-pod__copy-feedback {
  display: block;
  margin-top: 4px;
  color: #59657e;
  font-size: 0.63rem;
  font-weight: 650;
}

.package-pod__copy-feedback[hidden] {
  display: none;
}

.package-pod__copy-feedback--success {
  color: #166a4e;
}

.package-pod__copy-feedback--error {
  color: #a23842;
}

.package-pod__city-sequence {
  display: grid;
  min-width: 68px;
  min-height: 46px;
  padding: 7px 11px;
  border: 0;
  border-radius: 2px;
  align-content: center;
  justify-items: center;
  background: #f2f4f9;
}

.package-pod__city-sequence small {
  color: #68738c;
  font-size: 0.53rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.package-pod__city-sequence strong {
  color: #112262;
  font-size: 1.08rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.package-pod__parties {
  display: grid;
  padding: 2px 18px 14px;
  grid-template-columns: 1fr;
  gap: 0;
}

.package-pod-party {
  display: grid;
  min-width: 0;
  min-height: 0;
  padding: 11px 0 13px;
  border-radius: 0;
  align-content: start;
  gap: 5px;
  background: transparent;
}

.package-pod-party + .package-pod-party {
  padding: 13px 0 11px;
  border-top: 1px solid #e8ebf1;
  border-left: 0;
}

.package-pod-party--recipient {
  background: transparent;
}

.package-pod-party--recipient strong {
  font-size: 0.92rem;
}

.package-pod-party strong {
  color: #202d4f;
  font-size: 0.84rem;
  line-height: 1.35;
}

.package-pod-party > span {
  color: #56627d;
  font-size: 0.72rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.package-pod__edit-target {
  display: inline-flex;
  max-width: 100%;
  min-width: 0;
  margin: -2px;
  padding: 2px;
  border: 0;
  border-radius: 3px;
  align-items: baseline;
  gap: 5px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  line-height: inherit;
  text-align: left;
  overflow-wrap: anywhere;
}

.package-pod__edit-target svg {
  flex: 0 0 auto;
  opacity: 0.52;
  transform: translateY(2px);
}

.package-pod__edit-target:hover,
.package-pod__edit-target:focus-visible {
  background: #fff8d9;
  color: #112262;
  outline: 2px solid rgb(255 204 5 / 44%);
  outline-offset: 1px;
}

.package-pod__edit-target:hover svg,
.package-pod__edit-target:focus-visible svg {
  opacity: 1;
}

.package-pod-party__address {
  display: block;
}

.package-pod__phone-row {
  display: flex;
  width: fit-content;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
}

.package-pod__edit-target--icon {
  display: grid;
  width: 25px;
  min-width: 25px;
  height: 25px;
  min-height: 25px;
  margin: -4px 0 -4px 1px;
  padding: 4px;
  place-items: center;
}

.package-pod__edit-target--icon svg {
  transform: none;
}

.package-pod__edit-target--flag {
  margin: -3px;
  padding: 3px;
  align-items: center;
}

.package-pod__edit-target--notes {
  width: 100%;
  justify-content: space-between;
}

.package-pod__phone {
  width: fit-content;
  color: #112262;
  font-size: 0.78rem;
  font-weight: 750;
  text-decoration: none;
}

.package-pod__phone:hover {
  text-decoration: underline;
}

.package-pod__phone--search {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.package-pod__phone--search svg {
  flex: 0 0 auto;
  color: #e05a16;
}

.package-pod__phone-call {
  padding-left: 7px;
  border-left: 1px solid #d0d5dd;
  color: #b54708;
  font-size: 0.7rem;
}

.package-pod__facts {
  display: grid;
  margin: 0 18px 12px;
  padding: 11px 0;
  border-top: 1px solid #e9ecf2;
  border-bottom: 1px solid #e9ecf2;
  border-radius: 0;
  grid-template-columns: repeat(auto-fit, minmax(105px, 1fr));
  gap: 18px;
  background: transparent;
}

.package-pod__facts .package-detail-data__item {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.package-pod__facts dt {
  font-size: 0.58rem;
}

.package-pod__facts dd {
  margin: 0;
  font-size: 0.74rem;
}

.package-pod__flags {
  display: flex;
  padding: 0 18px 12px;
  border-bottom: 0;
  flex-wrap: wrap;
  gap: 8px 18px;
}

.package-pod-flag {
  display: inline-flex;
  min-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 2px;
  align-items: center;
  gap: 5px;
  background: transparent;
  color: #68738c;
}

.package-pod-flag small {
  font-size: 0.61rem;
  font-weight: 650;
}

.package-pod-flag strong {
  color: #53607b;
  font-size: 0.63rem;
}

.package-pod-flag--active {
  background: transparent;
  color: #112262;
}

.package-pod-flag--active strong {
  color: #112262;
}

.package-pod-flag--active::before {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ffcc05;
  content: "";
}

.package-pod__notes {
  min-height: 54px;
  margin: 0 18px 10px;
  padding: 9px 12px 9px 15px;
  border-bottom: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: inset 3px 0 #ffcc05;
}

.package-pod__notes p {
  margin: 0;
  color: #3f4b68;
  font-size: 0.74rem;
  line-height: 1.5;
  white-space: pre-wrap;
}

.package-pod__codes {
  display: grid;
  min-height: 126px;
  padding: 12px 18px 14px;
  border-top: 1px solid #eef0f4;
  align-content: center;
  gap: 5px;
  background: #fff;
}

.package-pod__code-media {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.package-pod-code {
  min-width: 0;
  margin: 0;
  text-align: center;
}

.package-pod-code--qr {
  display: grid;
  width: 86px;
  flex: 0 0 86px;
  overflow: hidden;
  place-items: center;
}

.package-pod-code--qr img {
  display: block;
  width: 78px;
  height: 78px;
  object-fit: contain;
}

.package-pod-code figcaption {
  max-width: 100%;
  margin-top: 2px;
  overflow: hidden;
  color: #68738c;
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.025em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.package-pod__qr-fallback {
  display: grid;
  width: 78px;
  height: 78px;
  padding: 7px;
  border: 1px solid #e1e5ec;
  border-radius: 5px;
  place-items: center;
  color: #112262;
  font-size: 0.65rem;
  font-weight: 800;
  overflow-wrap: anywhere;
  text-align: center;
}

.package-pod__fiscal-identifiers {
  display: flex;
  min-width: 0;
  padding-top: 3px;
  color: #56627d;
  font-size: 0.6rem;
  gap: 12px;
  overflow-wrap: anywhere;
}

.package-pod__tracking {
  min-width: 0;
}

.package-pod__tracking strong {
  display: block;
  color: #112262;
  font-size: 1rem;
  font-weight: 850;
  letter-spacing: 0.025em;
  overflow-wrap: anywhere;
}

.package-pod__tracking small {
  margin-top: 5px;
}

.package-pod-editor-modal[hidden] {
  display: none;
}

.package-pod-editor-modal {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  padding: 24px;
  background: rgb(9 20 54 / 56%);
  place-items: center;
}

.package-pod-editor-modal__panel {
  width: min(100%, 520px);
  max-height: min(720px, calc(100vh - 48px));
  overflow: auto;
  border: 1px solid rgb(17 34 98 / 12%);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 24px 72px rgb(7 18 52 / 28%);
}

.package-pod-editor-modal__header {
  display: flex;
  padding: 22px 24px 18px;
  border-bottom: 1px solid #e8ebf1;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.package-pod-editor-modal__header h2 {
  margin: 2px 0 0;
  color: #112262;
  font-size: 1.15rem;
  letter-spacing: -0.02em;
}

.package-pod-editor-modal__header p {
  margin: 5px 0 0;
  color: #68738c;
  font-size: 0.72rem;
  font-weight: 700;
}

.package-pod-editor-modal__eyebrow {
  color: #8a6b00;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.package-pod-editor-modal__close {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border: 1px solid #d8dde7;
  border-radius: 50%;
  background: #fff;
  color: #4a5671;
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
  place-items: center;
}

.package-pod-editor-modal__close:hover,
.package-pod-editor-modal__close:focus-visible {
  border-color: #112262;
  color: #112262;
  outline: 2px solid rgb(255 204 5 / 35%);
  outline-offset: 1px;
}

.package-pod-editor__form {
  display: grid;
  padding: 22px 24px 24px;
  gap: 16px;
}

.package-pod-editor__field {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.package-pod-editor__field > span {
  color: #5f6b86;
  font-size: 0.64rem;
  font-weight: 700;
}

.package-pod-editor__control {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid #cfd5e1;
  border-radius: 2px;
  background: #fff;
  color: #172653;
  font-size: 0.75rem;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.package-pod-editor__control:hover {
  border-color: #9ea8bd;
}

.package-pod-editor__control:focus {
  border-color: #112262;
  box-shadow: 0 0 0 2px rgb(255 204 5 / 24%);
  outline: 0;
}

.package-pod-editor__textarea {
  min-height: 58px;
  line-height: 1.45;
  resize: vertical;
}

.package-pod-editor__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.package-pod-editor__save,
.package-pod-editor__cancel {
  min-height: 38px;
  padding: 7px 15px;
  border-radius: 2px;
  font-size: 0.7rem;
  font-weight: 740;
}

.package-pod-editor__cancel {
  border: 1px solid #cfd5e1;
  background: #fff;
  color: #3e4b6a;
  cursor: pointer;
}

.package-pod-editor__cancel:hover:not(:disabled) {
  border-color: #112262;
  color: #112262;
}

.package-pod-editor__feedback {
  margin: 0;
  color: #465573;
  font-size: 0.68rem;
  line-height: 1.45;
}

.package-pod-editor__feedback--success {
  color: #126648;
}

.package-pod-editor__feedback--error {
  color: #9f302f;
}


.package-detail-card {
  min-width: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: var(--surface);
  box-shadow: 0 1px 2px rgb(17 34 98 / 4%), 0 4px 14px rgb(17 34 98 / 3%);
}

.package-profile-overview,
.package-profile-details,
.package-profile-actions {
  min-width: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

.package-profile-overview h2 {
  margin: 0;
  padding: 0 0 14px;
  border-bottom: 0;
  color: #112262;
  font-size: 0.8rem;
  font-weight: 750;
}

.package-profile-actions h2 {
  margin: 0;
  padding: 0 0 11px;
  border-bottom: 0;
  color: #112262;
  font-size: 0.8rem;
  font-weight: 750;
}

.package-profile-actions__grid {
  display: grid;
  padding: 0;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.package-print-link {
  display: inline-flex;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid #112262;
  border-radius: 3px;
  align-items: center;
  justify-content: center;
  background: #112262;
  color: #fff;
  font-size: 0.71rem;
  font-weight: 760;
  letter-spacing: 0.005em;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.package-print-link:disabled {
  cursor: wait;
  opacity: 0.58;
}

.package-print-link[data-unavailable="true"]:disabled {
  cursor: not-allowed;
}

.package-print-link:hover {
  border-color: #1b2f7a;
  background: #1b2f7a;
  color: #fff;
}

.package-print-link:focus-visible {
  outline: 3px solid rgb(255 204 5 / 45%);
  outline-offset: 2px;
}

.package-print-link--wide {
  grid-column: 1 / -1;
}

.package-print-link--primary {
  grid-column: 1 / -1;
  border-color: #ffcc05;
  background: #ffcc05;
  color: #112262;
}

.package-print-link--primary:hover {
  border-color: #e6b800;
  background: #e6b800;
  color: #112262;
}

.package-profile-actions__feedback {
  margin: 9px 0 0;
  color: #a23842;
  font-size: 0.68rem;
  line-height: 1.4;
}

.package-profile-actions__reason {
  margin: 8px 0 0;
  color: #69748d;
  font-size: 0.65rem;
  line-height: 1.4;
}

.package-profile-exchange {
  padding-top: 2px;
}

.package-exchange-action {
  display: inline-flex;
  width: 100%;
  min-height: 42px;
  padding: 9px 14px;
  border: 1px solid #e9b900;
  border-radius: 3px;
  align-items: center;
  justify-content: center;
  background: #ffcc05;
  color: #112262;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  cursor: pointer;
}

.package-exchange-action:hover:not(:disabled) {
  border-color: #d9aa00;
  background: #f6c300;
}

.package-exchange-action:disabled {
  cursor: wait;
  opacity: 0.72;
}

.package-profile-exchange__feedback {
  margin-top: 9px;
  color: #a23842;
  font-size: 0.68rem;
  line-height: 1.45;
}

.package-profile-exchange__feedback--success {
  color: #176443;
}

.package-profile-exchange__link {
  color: #112262;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.package-profile-overview__list {
  display: grid;
  margin: 0;
  padding: 0;
  grid-template-columns: 1fr 1fr;
  column-gap: 20px;
  row-gap: 18px;
}

.package-profile-overview__list .package-detail-data__item {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.package-profile-overview__list .package-detail-data__item:nth-child(2n) {
  border-right: 0;
}

.package-profile-overview__list dt {
  margin-bottom: 3px;
  color: #6a748d;
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.package-profile-overview__list dd {
  min-width: 0;
  margin: 0;
  color: #303b58;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.package-profile-details summary {
  position: relative;
  padding: 13px 40px 13px 0;
  border-top: 1px solid #e8ebf1;
  border-bottom: 1px solid #e8ebf1;
  color: #112262;
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 750;
  list-style: none;
}

.package-profile-details summary::-webkit-details-marker {
  display: none;
}

.package-profile-details summary::after {
  position: absolute;
  top: 50%;
  right: 13px;
  color: #68738c;
  content: "+";
  font-size: 1rem;
  transform: translateY(-50%);
}

.package-profile-details[open] summary {
  border-bottom: 0;
}

.package-profile-details[open] summary::after {
  content: "−";
}

.package-profile-details .package-detail-data {
  padding: 18px 0 4px;
  grid-template-columns: 1fr 1fr;
  column-gap: 24px;
  row-gap: 16px;
}

.package-profile-details .package-detail-data__item:nth-child(2n) {
  border-right: 0;
}

.package-profile-details .package-detail-data__item {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.package-detail-card > h2 {
  margin: 0;
  padding: 11px 13px;
  border-bottom: 1px solid #e1e6ef;
  background: #f8f9fc;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 700;
}

.package-detail-data {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.package-detail-data__item {
  min-width: 0;
  padding: 10px 13px;
  border: 0;
}

.package-detail-data__item:nth-child(4n) {
  border-right: 0;
}

.package-detail-data__item--wide {
  grid-column: span 2;
}

.package-detail-data dt {
  margin-bottom: 3px;
  color: #6a748d;
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.package-detail-data dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: #303b58;
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.4;
}

.package-history {
  border: 0;
  border-radius: 0;
  box-shadow: inset 0 1px #e8ebf1;
}

.package-history-filters {
  display: grid;
  padding: 14px 0 12px;
  border-bottom: 1px solid #e7eaf0;
  grid-template-columns:
    minmax(135px, 0.9fr)
    minmax(105px, 0.55fr)
    minmax(130px, 0.8fr)
    repeat(2, minmax(124px, 0.65fr))
    auto;
  align-items: end;
  gap: 9px;
}

.package-history-filters__field {
  display: grid;
  min-width: 0;
  color: #59647d;
  font-size: 0.61rem;
  font-weight: 700;
  gap: 5px;
}

.package-history-filters__control {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 6px 9px;
  border: 1px solid #cbd2df;
  border-radius: 2px;
  background: #fff;
  color: #263451;
  font: inherit;
  font-size: 0.7rem;
}

.package-history-filters__control:focus {
  border-color: #112262;
  box-shadow: 0 0 0 2px rgb(17 34 98 / 9%);
  outline: 0;
}

.package-history-filters__actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.package-history-filters__apply {
  min-height: 36px;
  padding: 7px 13px;
  border-radius: 2px;
  box-shadow: none;
  font-size: 0.68rem;
  font-weight: 750;
}

.package-history-filters__feedback {
  grid-column: 1 / -1;
  margin: 0;
  color: #a23842;
  font-size: 0.68rem;
}

.package-history > h2 {
  padding: 20px 0 8px;
  border-bottom: 0;
  background: #fff;
}

.package-history-log {
  min-width: 0;
}

.package-history-log__head,
.package-history-entry {
  display: grid;
  min-width: 0;
  grid-template-columns: 132px 148px minmax(150px, 1fr) 130px;
  align-items: start;
  column-gap: 18px;
}

.package-history-log__head {
  padding: 12px 0 9px;
  border-bottom: 1px solid #dfe4ed;
  color: #707b94;
  font-size: 0.59rem;
  font-weight: 750;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.package-history-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.package-history-entry {
  padding: 14px 0;
  border-bottom: 1px solid #eef0f4;
}

.package-history-entry__status {
  min-width: 0;
  padding: 5px 9px;
  border: 1px solid var(--package-history-status-color, #112262);
  border-radius: 5px;
  background: var(--package-history-status-color, #112262);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 16%);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-align: center;
}

.package-history-entry__date {
  padding-top: 2px;
  color: #59657e;
  font-size: 0.69rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
}

.package-history-entry__comment {
  margin: 0;
  color: #34405d;
  font-size: 0.72rem;
  line-height: 1.45;
  white-space: pre-wrap;
}

.package-history-entry__user {
  padding-top: 2px;
  color: #59657e;
  font-size: 0.69rem;
  line-height: 1.35;
}

.package-history-more {
  margin: 10px 0;
}

.package-history-more[hidden] {
  display: none;
}

.package-history-empty {
  margin: 0;
  padding: 22px 0;
  color: var(--ink-soft);
  font-size: 0.78rem;
}

.package-activity {
  min-width: 0;
  overflow: hidden;
  border-radius: 0;
  background: #fff;
  border-top: 1px solid #dfe4ed;
  box-shadow: none;
}

.package-activity-tabs {
  display: flex;
  padding: 12px 0 0;
  border-bottom: 1px solid #e3e7ef;
  gap: 20px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.package-activity-tab {
  min-height: 40px;
  margin-bottom: -1px;
  padding: 8px 0 11px;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #58647f;
  cursor: pointer;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}

.package-activity-tab[aria-selected="true"] {
  border-bottom-color: #ffcc05;
  box-shadow: none;
  background: transparent;
  color: #112262;
}

.package-activity-tab:focus-visible {
  border-bottom-color: #112262;
  outline: 0;
}

.package-activity-tab[aria-selected="true"]:focus-visible {
  border-bottom-color: #ffcc05;
}

.package-activity-body {
  min-height: 72px;
}

.package-command-form {
  display: grid;
  min-width: 0;
  padding: 16px 0 20px;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px 14px;
}

.package-command-form__fields {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(150px, 0.42fr) minmax(240px, 1fr);
  align-items: end;
  gap: 6px 12px;
}

.package-command-form label {
  color: #59647d;
  font-size: 0.65rem;
  font-weight: 700;
}

.package-command-form__field {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.package-command-form__fields--comment-only .package-command-form__field {
  grid-column: 1 / -1;
}

.package-command-form__control {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #b8c0d0;
  border-radius: 2px;
  background: #fff;
  color: #263451;
  font-size: 0.74rem;
}

.package-command-form__control:focus {
  border-color: #112262;
  box-shadow: 0 0 0 2px rgb(17 34 98 / 10%);
  outline: 0;
}

.package-command-form__comment {
  min-height: 54px;
  resize: vertical;
  line-height: 1.4;
}

.package-command-form__save {
  min-width: 92px;
  min-height: 38px;
  padding: 8px 18px;
}

.package-status-form {
  display: block;
  padding: 14px 0 18px;
}

.package-status-form .package-command-form__fields {
  display: grid;
  grid-template-columns: minmax(170px, 0.38fr) minmax(240px, 1fr) 94px;
  align-items: stretch;
  gap: 8px;
}

.package-status-form .package-command-form__fields--comment-only {
  grid-template-columns: minmax(0, 1fr) 94px;
}

.package-status-form .package-command-form__fields--comment-only .package-command-form__field {
  grid-column: auto;
}

.package-status-form .package-command-form__field {
  gap: 0;
}

.package-status-form .package-command-form__control {
  min-height: 42px;
  border-color: #cbd2df;
  border-radius: 2px;
  font-size: 0.73rem;
}

.package-status-form .package-command-form__comment {
  height: 42px;
  min-height: 42px;
  max-height: 108px;
  padding-top: 10px;
  padding-bottom: 10px;
  resize: vertical;
}

.package-status-form .package-command-form__save {
  width: 94px;
  min-width: 94px;
  min-height: 42px;
  padding: 8px 14px;
  border-radius: 2px;
  box-shadow: none;
}

.package-status-form .package-command-form__feedback {
  margin-top: 8px;
}

.package-command-form__feedback {
  grid-column: 1 / -1;
  margin: 0;
  color: #58647f;
  font-size: 0.68rem;
}

.package-command-form__feedback--success {
  color: #166a4e;
}

.package-command-form__feedback--error {
  color: #a23842;
}

.package-staff-comment-form {
  grid-template-columns: minmax(0, 1fr) auto;
}

.package-staff-comment-form label {
  grid-column: 1 / -1;
}

.package-history-panel {
  min-width: 0;
}

.package-audit-panel,
.package-audit-log {
  min-width: 0;
}

.package-audit-log__head,
.package-audit-entry {
  display: grid;
  min-width: 0;
  grid-template-columns: 132px 76px 100px 140px minmax(220px, 1fr) 150px;
  align-items: start;
  column-gap: 18px;
}

.package-audit-log__head {
  padding: 12px 0 9px;
  border-bottom: 1px solid #dfe4ed;
  color: #707b94;
  font-size: 0.59rem;
  font-weight: 750;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.package-audit-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.package-audit-entry {
  padding: 14px 0;
  border-bottom: 1px solid #eef0f4;
  color: #34405d;
  font-size: 0.7rem;
  line-height: 1.42;
}

.package-audit-entry__date {
  padding-top: 2px;
  color: #59657e;
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
}

.package-audit-entry__action {
  padding: 2px 0 2px 9px;
  border-left: 3px solid #ffcc05;
  color: #112262;
  font-size: 0.7rem;
}

.package-audit-entry__type {
  display: inline-flex;
  min-height: 22px;
  width: fit-content;
  padding: 2px 7px;
  align-items: center;
  background: #f1f4fa;
  color: #4d5973;
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.025em;
}

.package-audit-entry__field {
  padding-top: 2px;
  color: #4d5973;
  font-weight: 650;
  overflow-wrap: anywhere;
}

.package-audit-entry__change {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 5px 8px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.package-audit-entry__before {
  color: #7b8499;
  text-decoration: line-through;
  text-decoration-color: #bbc1cd;
}

.package-audit-entry__arrow {
  color: #9aa3b6;
  font-weight: 700;
}

.package-audit-entry__after {
  color: #263451;
  font-weight: 650;
}

.package-audit-entry__actor {
  display: grid;
  min-width: 0;
  padding-top: 2px;
  color: #4d5973;
  gap: 2px;
  overflow-wrap: anywhere;
}

.package-audit-entry__actor small {
  color: #858ea2;
  font-size: 0.6rem;
}

.package-activity-list {
  display: grid;
  padding: 4px 0 14px;
  gap: 18px;
}

.package-activity-entry {
  display: grid;
  min-width: 0;
  padding: 8px 0;
  border-radius: 0;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 14px 22px;
  background: transparent;
}

.package-activity-entry__field {
  min-width: 0;
}

.package-activity-entry__field small {
  display: block;
  margin-bottom: 4px;
  color: #7a849b;
  font-size: 0.57rem;
  font-weight: 700;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.package-activity-entry__field span {
  display: block;
  color: #36425f;
  font-size: 0.72rem;
  line-height: 1.42;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.package-activity-empty,
.package-activity-error {
  margin: 0;
  padding: 18px 0 22px;
  color: #68738c;
  font-size: 0.74rem;
}

.package-activity-error {
  color: #a23842;
}

.package-activity-more {
  margin: 9px 0 12px;
}

.package-detail-loading,
.package-detail-state {
  display: grid;
  min-height: 180px;
  padding: 24px;
  border: 1px solid #dee4ee;
  border-radius: 9px;
  place-content: center;
  justify-items: center;
  background: var(--surface);
  text-align: center;
}

.package-detail-loading__line {
  width: 180px;
  height: 4px;
  overflow: hidden;
  border-radius: 99px;
  background: #e7eaf1;
}

.package-detail-loading__line::after {
  display: block;
  width: 42%;
  height: 100%;
  animation: package-progress 1s ease-in-out infinite alternate;
  background: var(--brand);
  content: "";
}

.package-detail-state h2 {
  margin-bottom: 6px;
  font-size: 1rem;
}

.package-detail-state p {
  max-width: 460px;
  margin: 0 0 14px;
  color: var(--ink-soft);
  font-size: 0.78rem;
}

.package-print-page {
  display: grid;
  gap: 12px;
}

.package-print-toolbar {
  display: flex;
  min-height: 52px;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.package-print-toolbar h1 {
  margin: 4px 0 0;
  color: #112262;
  font-size: 1.25rem;
  letter-spacing: -0.025em;
}

.package-print-action {
  min-width: 112px;
  min-height: 36px;
  padding: 8px 18px;
}

.package-print-loading {
  display: grid;
  min-height: 260px;
  place-content: center;
}

.package-print-preview {
  min-width: 0;
  overflow: auto;
  border: 1px solid #dce2ec;
  border-radius: 8px;
  background: #f2f4f8;
}

@media (max-width: 1320px) {
  .package-filters {
    grid-template-columns: minmax(260px, 1fr) minmax(170px, 0.7fr) minmax(145px, 0.55fr) minmax(145px, 0.55fr);
  }

  .package-filter-actions {
    grid-column: 4 / 5;
    justify-content: flex-end;
  }

  .package-table {
    min-width: 1120px;
  }

  .package-table th,
  .package-table td {
    padding-right: 10px;
    padding-left: 10px;
  }

  .package-profile-grid {
    grid-template-columns: minmax(480px, 1.35fr) minmax(340px, 0.85fr);
    gap: 28px;
  }
}

@media (max-width: 760px) {
  .packages-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .packages-heading__action {
    width: 40px;
    height: 40px;
    justify-self: end;
  }

  .package-filters {
    grid-template-columns: 1fr 1fr;
  }

  .package-filter--search,
  .package-filter-actions {
    grid-column: 1 / -1;
  }

  .package-advanced-filters__grid {
    grid-template-columns: 1fr 1fr;
  }

  .package-filter-actions > * {
    flex: 1;
  }

  .packages-page .package-filter-actions {
    width: auto;
    justify-self: end;
    margin-inline-start: auto;
  }

  .packages-page .package-filter-actions > * {
    flex: 0 0 auto;
  }

  .package-table-region {
    display: none;
  }

  .package-mobile-table-region {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }

  .package-table--mobile {
    min-width: 0;
    table-layout: fixed;
  }

  .package-table--mobile .package-table__column--number {
    width: 54px;
  }

  .package-table--mobile .package-table__column--name {
    width: auto;
  }

  .package-table--mobile .package-table__column--comment {
    width: 32%;
  }

  .package-table--mobile .package-table__column--status {
    width: clamp(155px, 30vw, 165px);
  }

  .package-table--mobile th,
  .package-table--mobile td {
    padding: 8px 7px;
  }

  .package-table--mobile .package-status {
    min-width: 0;
    width: 100%;
    padding: 4px 3px;
    overflow-wrap: anywhere;
  }

  .package-table--mobile td.package-table__number {
    display: table-cell;
    vertical-align: middle;
  }

  .packages-page .package-state--empty {
    min-height: 140px;
    padding: 16px;
  }

  .package-table--mobile .package-table__status {
    text-align: center;
  }

  .package-table--mobile .package-table__status-content {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
  }

  .package-table--mobile .package-table__status-group {
    width: 100%;
    min-width: 0;
  }

  .package-table--mobile .package-table__status-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
  }

  .package-table--mobile .package-table__delete {
    display: inline-grid;
    align-self: center;
    justify-self: end;
    border-color: #efcecb;
    border-radius: 8px;
    place-items: center;
    background: #fff5f4;
    color: var(--danger);
    box-shadow: 0 1px 2px rgb(104 38 34 / 10%);
  }

  .package-table--mobile .package-table__delete svg {
    margin: 0;
  }

  .package-table--mobile .package-table__mobile-credit {
    display: block;
    min-width: 0;
    max-width: 100%;
    margin-top: 2px;
    color: inherit;
    font-size: 0.63rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .package-skeleton {
    padding: 12px;
  }

  .package-skeleton__row {
    min-height: 104px;
    margin-bottom: 8px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 13px;
    grid-template-columns: 1fr 1fr;
  }

  .package-detail-data {
    grid-template-columns: 1fr 1fr;
  }

  .package-profile-grid {
    grid-template-columns: 1fr;
  }

  .package-profile-label {
    padding-top: 2px;
  }

  .package-pod {
    position: static;
  }

  .package-issue-dialog__header,
  .package-issue-dialog__body,
  .package-issue-dialog__actions {
    padding-right: 18px;
    padding-left: 18px;
  }

  .package-issue-dialog__metadata {
    grid-template-columns: minmax(0, 1fr);
  }

  .package-issue-dialog__close {
    width: 100%;
  }

}

@media (max-width: 420px) {
  .package-table--mobile .package-table__column--number {
    width: 44px;
  }

  .package-table--mobile th,
  .package-table--mobile td {
    padding-right: 5px;
    padding-left: 5px;
  }

  .package-table--mobile .package-table__column--status {
    width: 155px;
  }
}

@media (max-width: 680px) {
  .package-filters {
    padding: 10px;
    grid-template-columns: 1fr 1fr;
  }

  .package-filter--search,
  .package-filter--multi,
  .package-filter-actions {
    grid-column: 1 / -1;
  }

  .packages-page .package-filter--multi {
    grid-column: auto;
  }

  .package-multi-select__panel {
    width: 100%;
  }

  .package-filter--tracking input,
  .package-filter--minimum-fee input {
    font-size: 0.72rem;
  }

  .package-advanced-filters {
    grid-column: 1 / -1;
  }

  .package-advanced-filters__grid {
    grid-template-columns: 1fr 1fr;
  }

  .package-results-toolbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .package-results-toolbar__actions {
    width: 100%;
    justify-content: space-between;
  }

  .package-pagination {
    grid-template-columns: 1fr 1fr;
  }

  .package-pagination > span {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .package-detail-heading {
    align-items: start;
  }

  .package-detail-status {
    min-width: 0;
    max-width: 46%;
  }

  .package-detail-data {
    grid-template-columns: 1fr;
  }

  .package-detail-data__item,
  .package-detail-data__item:nth-child(2n),
  .package-detail-data__item:nth-child(4n) {
    border-right: 0;
  }

  .package-detail-data__item--wide {
    grid-column: auto;
  }

  .package-profile-grid {
    grid-template-columns: 1fr;
  }

  .package-pod {
    position: static;
  }

  .package-pod__parties {
    grid-template-columns: 1fr;
  }

  .package-pod-party + .package-pod-party {
    border-top: 1px solid #e8ebf1;
    border-left: 0;
  }

  .package-pod__facts {
    grid-template-columns: 1fr 1fr;
  }

  .package-pod__facts .package-detail-data__item:nth-child(2n) {
    border-right: 0;
  }

  .package-pod__codes {
    padding-right: 10px;
    padding-left: 10px;
  }

  .package-pod__code-media {
    flex-wrap: wrap;
    gap: 8px;
  }

  .package-pod-code--qr {
    width: 78px;
    flex-basis: 78px;
  }

  .package-profile-details .package-detail-data {
    grid-template-columns: 1fr;
  }

  .package-profile-details .package-detail-data__item {
    border-right: 0;
  }

  .package-command-form,
  .package-staff-comment-form {
    grid-template-columns: 1fr;
  }

  .package-command-form__fields {
    grid-template-columns: 1fr;
  }

  .package-status-form .package-command-form__fields,
  .package-status-form .package-command-form__fields--comment-only {
    grid-template-columns: 1fr;
  }

  .package-status-form .package-command-form__save {
    width: 100%;
  }

  .package-history-filters {
    grid-template-columns: 1fr 1fr;
  }

  .package-history-filters__field:first-child,
  .package-history-filters__actions,
  .package-history-filters__feedback {
    grid-column: 1 / -1;
  }

  .package-history-filters__actions {
    justify-content: flex-end;
  }

  .package-command-form__save {
    width: 100%;
  }

  .package-history-log__head {
    display: none;
  }

  .package-audit-log__head {
    display: none;
  }

  .package-history-entry {
    grid-template-columns: 104px minmax(0, 1fr);
    row-gap: 9px;
  }

  .package-history-entry__comment,
  .package-history-entry__user {
    grid-column: 1 / -1;
  }

  .package-history-entry__comment::before,
  .package-history-entry__user::before {
    color: #747e95;
    font-size: 0.61rem;
    font-weight: 700;
  }

  .package-history-entry__comment::before {
    content: "Koment: ";
  }

  .package-history-entry__user::before {
    content: "Kryer nga: ";
  }

  .package-audit-entry {
    grid-template-columns: 104px minmax(0, 1fr);
    row-gap: 9px;
  }

  .package-audit-entry__field,
  .package-audit-entry__change,
  .package-audit-entry__actor {
    grid-column: 1 / -1;
  }

  .package-audit-entry__type {
    align-self: start;
  }

  .package-audit-entry__field::before,
  .package-audit-entry__change::before,
  .package-audit-entry__actor::before {
    margin-right: 5px;
    color: #747e95;
    font-size: 0.61rem;
    font-weight: 700;
  }

  .package-audit-entry__field::before {
    content: "Fusha: ";
  }

  .package-audit-entry__change::before {
    content: "Ndryshimi: ";
  }

  .package-audit-entry__actor::before {
    content: "Kryer nga: ";
  }

  .package-activity-entry {
    grid-template-columns: 1fr 1fr;
  }
}

/* Pickup */

.pickup-page {
  display: grid;
  gap: 12px;
}

.pickup-heading {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.pickup-heading h1 {
  margin: 0;
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.025em;
}

.pickup-heading__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pickup-heading__create {
  width: 38px;
  min-width: 38px;
  min-height: 38px;
  padding: 7px;
}

.pickup-heading__distribute {
  min-width: 112px;
  min-height: 38px;
  padding-inline: 18px;
  background: var(--brand-blue);
}

.pickup-create-panel {
  width: min(100%, 920px);
  overflow: hidden;
  border: 1px solid #dfe4ed;
  border-top: 3px solid var(--brand-blue);
  background: #fff;
  box-shadow: 0 10px 30px rgb(17 34 98 / 7%);
}

.pickup-distribution-panel {
  overflow: hidden;
  border: 1px solid #dfe4ed;
  border-top: 3px solid var(--brand-blue);
  background: #fff;
  box-shadow: 0 10px 30px rgb(17 34 98 / 7%);
}

.pickup-distribution-panel[hidden] {
  display: none;
}

.pickup-distribution-form {
  padding: 16px 18px 18px;
}

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

.pickup-distribution-selection {
  min-height: 24px;
  margin: 10px 0 0;
  color: #526079;
  font-size: 0.72rem;
  font-weight: 650;
}

.pickup-distribution-submit {
  min-width: 168px;
  min-height: 40px;
}

.pickup-create-panel[hidden] {
  display: none;
}

.pickup-create-panel__header {
  display: flex;
  min-height: 52px;
  padding: 0 18px;
  border-bottom: 1px solid #e8ebf1;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.pickup-create-panel__header h2 {
  margin: 0;
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.pickup-create-panel__close {
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: #58647c;
  cursor: pointer;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 650;
}

.pickup-create-panel__close:hover,
.pickup-create-panel__close:focus-visible {
  color: var(--brand-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pickup-create-form {
  padding: 16px 18px 18px;
}

.pickup-create-form__body {
  display: grid;
  align-items: stretch;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.88fr);
}

.pickup-create-form__body--single {
  grid-template-columns: minmax(0, 1fr);
}

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

.pickup-create-field {
  display: grid;
  min-width: 0;
  gap: 6px;
}

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

.pickup-create-field__label {
  color: #3d4861;
  font-size: 0.69rem;
  font-weight: 700;
}

.pickup-create-field__required {
  color: #a42c37;
}

.pickup-create-field input,
.pickup-create-field select {
  width: 100%;
  min-height: 40px;
  padding: 8px 11px;
  border: 1px solid #d5dce7;
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 0.78rem;
}

.pickup-create-field input:focus,
.pickup-create-field select:focus {
  border-color: var(--brand-blue);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
  outline: 0;
}

.pickup-create-field [aria-invalid="true"] {
  border-color: #b83c47;
  box-shadow: 0 0 0 3px rgb(184 60 71 / 8%);
}

.pickup-create-business-control {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(180px, 0.75fr) minmax(260px, 1.25fr);
}

.pickup-create-feedback {
  min-height: 30px;
  padding-top: 10px;
  color: var(--ink-soft);
  font-size: 0.73rem;
}

.pickup-create-feedback--error {
  color: var(--danger);
  font-weight: 650;
}

.pickup-create-feedback--success {
  color: #24704d;
  font-weight: 650;
}

.pickup-create-actions {
  display: flex;
  justify-content: flex-end;
}

.pickup-create-submit {
  min-width: 168px;
  min-height: 40px;
}

.pickup-map {
  overflow: hidden;
  min-width: 0;
  border: 1px solid #dfe5ef;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 22px rgb(17 34 98 / 5%);
  transition: border-color 160ms ease, box-shadow 160ms ease, opacity 160ms ease;
}

.pickup-map__header {
  display: flex;
  min-height: 56px;
  padding: 10px 13px;
  border-bottom: 1px solid #e8ecf3;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.pickup-map__heading {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.pickup-map__title {
  color: var(--ink);
  font-size: 0.76rem;
  font-weight: 750;
}

.pickup-map__instruction {
  color: #68748a;
  font-size: 0.65rem;
  line-height: 1.35;
}

.pickup-map__coordinates {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid #e1e6ef;
  border-radius: 5px;
  background: #f8faff;
  color: var(--brand-blue);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.pickup-map__surface {
  display: grid;
  min-height: 284px;
  padding: 8px 14px;
  place-items: center;
  background:
    radial-gradient(circle at 50% 45%, rgb(17 34 98 / 4%), transparent 54%),
    #fbfcff;
}

.pickup-map__canvas {
  position: relative;
  width: min(100%, 224px);
  aspect-ratio: 4 / 5;
  outline: 0;
  touch-action: none;
  user-select: none;
}

.pickup-map__regions {
  display: block;
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 8px 14px rgb(17 34 98 / 8%));
}

.pickup-map__grid path {
  fill: none;
  stroke: #112262;
  stroke-dasharray: 2 8;
  stroke-opacity: 0.08;
  stroke-width: 0.7;
  vector-effect: non-scaling-stroke;
}

.pickup-map__countries path {
  fill: #edf1fa;
  stroke: #112262;
  stroke-linejoin: round;
  stroke-opacity: 0.38;
  stroke-width: 0.9;
  vector-effect: non-scaling-stroke;
}

.pickup-map__countries path:nth-child(2) {
  fill: #e7edf9;
}

.pickup-map__labels {
  fill: #112262;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 8px;
  font-weight: 750;
  letter-spacing: 0.8px;
  opacity: 0.55;
  text-anchor: middle;
}

.pickup-map__marker {
  position: absolute;
  z-index: 2;
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 3px solid #fff;
  border-radius: 50% 50% 50% 8px;
  background: var(--brand-blue);
  box-shadow: 0 7px 14px rgb(17 34 98 / 27%);
  cursor: grab;
  place-items: center;
  transform: translate(-50%, -76%) rotate(-45deg);
  transition: box-shadow 140ms ease, opacity 140ms ease;
}

.pickup-map__marker:active {
  cursor: grabbing;
}

.pickup-map__marker:focus-visible {
  box-shadow: 0 0 0 4px rgb(255 204 5 / 40%), 0 8px 16px rgb(17 34 98 / 28%);
  outline: 2px solid var(--brand-blue);
  outline-offset: 3px;
}

.pickup-map__marker-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-yellow);
  box-shadow: 0 0 0 2px rgb(255 255 255 / 22%);
  transform: rotate(45deg);
}

.pickup-map__footer {
  display: flex;
  min-height: 38px;
  padding: 8px 12px;
  border-top: 1px solid #e8ecf3;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #6b778c;
  font-size: 0.61rem;
  line-height: 1.35;
}

.pickup-map__state {
  color: #46536c;
  font-weight: 650;
  text-align: right;
}

.pickup-map--disabled {
  opacity: 0.68;
}

.pickup-map--disabled .pickup-map__marker {
  cursor: not-allowed;
  opacity: 0.58;
}

.pickup-map--loading .pickup-map__surface {
  cursor: progress;
}

.pickup-map--loading .pickup-map__regions {
  opacity: 0.62;
}

.pickup-map--invalid,
.pickup-map[aria-invalid="true"] {
  border-color: #b83c47;
  box-shadow: 0 0 0 3px rgb(184 60 71 / 8%);
}

.geo-map {
  overflow: hidden;
  width: 100%;
  border: 1px solid #dce3ee;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 22px rgb(17 34 98 / 6%);
}

.geo-map__header {
  display: flex;
  min-height: 58px;
  padding: 10px 13px;
  border-bottom: 1px solid #e7ebf2;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.geo-map__heading {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.geo-map__controls {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.geo-map__title {
  color: #17233f;
  font-size: .76rem;
  font-weight: 750;
}

.geo-map__instruction,
.geo-map__state {
  color: #657188;
  font-size: .65rem;
  line-height: 1.35;
}

.geo-map__locate {
  min-height: 32px;
  padding: 5px 9px;
  white-space: nowrap;
  font-size: .66rem;
}

.geo-map__locate:disabled {
  cursor: not-allowed;
  opacity: .58;
}

@media (max-width: 620px) {
  .geo-map__header,
  .geo-map__controls {
    align-items: stretch;
    flex-direction: column;
  }

  .geo-map__state {
    text-align: left;
  }
}

.geo-map__state {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid #e1e6ef;
  border-radius: 5px;
  background: #f8faff;
  color: #112262;
  font-weight: 700;
}

.geo-map__surface {
  position: relative;
  width: calc(100% - 24px);
  max-width: 760px;
  min-height: 300px;
  aspect-ratio: 16 / 10;
  margin: 12px auto;
  outline: none;
  touch-action: none;
  user-select: none;
}

.geo-map__provider {
  position: absolute;
  z-index: 3;
  inset: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  border: 1px solid #dce3ee;
  border-radius: 7px;
  background: #eef2f7;
  touch-action: auto;
}

.geo-map--google .geo-map__surface > .pickup-map__regions,
.geo-map--google .geo-map__overlay,
.geo-map--google .geo-map__marker {
  visibility: hidden;
}

.geo-map__provider-note {
  margin: 0;
  padding: 8px 12px;
  border-top: 1px solid #e7ebf2;
  background: #f8faff;
  color: #56637c;
  font-size: .68rem;
  line-height: 1.4;
}

.geo-map__provider-note--error {
  background: #fff8ed;
  color: #8a4518;
}

.geo-map__surface:focus-visible {
  border-radius: 6px;
  box-shadow: 0 0 0 4px rgb(255 204 5 / 34%);
}

.geo-map__surface > .pickup-map__regions,
.geo-map__overlay {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.geo-map__overlay {
  z-index: 1;
  pointer-events: none;
}

.geo-map__guide {
  fill: none;
  stroke: #d58c00;
  stroke-dasharray: 5 3;
  stroke-linejoin: round;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.geo-map__polygon {
  fill: rgb(255 204 5 / 26%);
  stroke: #b77700;
  stroke-linejoin: round;
  stroke-width: 2.2;
  vector-effect: non-scaling-stroke;
}

.geo-map__zone {
  fill: rgb(17 34 98 / 8%);
  stroke: rgb(17 34 98 / 52%);
  stroke-linejoin: round;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}

.geo-map__zone:nth-child(even) {
  fill: rgb(255 204 5 / 13%);
  stroke: rgb(183 119 0 / 62%);
}

.geo-map__vertex {
  fill: #112262;
  stroke: #fff;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.geo-map__vertices .geo-map__vertex:first-child {
  fill: #ffcc05;
  stroke: #112262;
}

.geo-map__actions {
  display: flex;
  padding: 10px 12px;
  border-top: 1px solid #e7ebf2;
  justify-content: flex-end;
  gap: 8px;
}

.geo-map__action {
  min-height: 34px;
  padding: 6px 10px;
  font-size: .68rem;
}

.geo-map__action--clear {
  color: #a02727;
}

.geo-map__marker {
  position: absolute;
  z-index: 2;
  display: grid;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 3px solid #fff;
  border-radius: 50% 50% 50% 8px;
  background: #112262;
  box-shadow: 0 7px 16px rgb(17 34 98 / 32%);
  cursor: grab;
  place-items: center;
  transform: translate(-50%, -76%) rotate(-45deg);
}

.geo-map__marker[hidden] {
  display: none;
}

.geo-map__marker-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ffcc05;
  transform: rotate(45deg);
}

.geo-map__marker:focus-visible {
  outline: 3px solid rgb(255 204 5 / 58%);
  outline-offset: 3px;
}

.geo-map--disabled {
  opacity: .66;
}

.geo-map--invalid {
  border-color: #b42318;
  box-shadow: 0 0 0 3px rgb(180 35 24 / 10%);
}

.pickup-panel {
  overflow: hidden;
  border: 1px solid #dee4ee;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 2px 10px rgb(17 34 98 / 5%);
}

.pickup-filters {
  display: grid;
  padding: 12px;
  border-bottom: 1px solid #e4e8f0;
  gap: 10px;
  grid-template-columns: minmax(150px, 0.9fr) minmax(150px, 0.9fr) minmax(220px, 1.6fr) 86px auto;
}

.pickup-filters input,
.pickup-filters select {
  width: 100%;
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid #d8dee9;
  border-radius: 7px;
  background: #fff;
  color: var(--ink);
  font: inherit;
  font-size: 0.78rem;
}

.pickup-filters input:focus,
.pickup-filters select:focus {
  border-color: #112262;
  box-shadow: 0 0 0 2px rgb(17 34 98 / 8%);
  outline: 0;
}

.pickup-filters__submit {
  min-width: 90px;
  min-height: 36px;
  padding: 7px 15px;
}

.pickup-feedback {
  min-height: 28px;
  padding: 7px 12px 5px;
  color: var(--ink-soft);
  font-size: 0.72rem;
}

.pickup-feedback--error {
  color: var(--danger);
  font-weight: 600;
}

.pickup-selection-toolbar {
  display: grid;
  min-height: 42px;
  padding: 8px 12px;
  border-bottom: 1px solid #e4e8f0;
  align-items: center;
  gap: 10px 18px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  color: #46536d;
  font-size: 0.71rem;
  font-weight: 650;
}

.pickup-selection-toolbar[hidden] {
  display: none;
}

.pickup-selection-toolbar__all {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--brand-blue);
  cursor: pointer;
}

.pickup-selection-toolbar__all input,
.pickup-table__select {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: var(--brand-blue);
  cursor: pointer;
}

.pickup-selection-toolbar__count {
  min-width: 112px;
  color: #68738b;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.pickup-results[aria-busy="true"] {
  min-height: 112px;
  opacity: 0.62;
}

.pickup-table-region {
  max-width: 100%;
  overflow: auto;
  outline: 0;
}

.pickup-table-region:focus-visible {
  box-shadow: inset 0 0 0 3px rgb(17 34 98 / 12%);
}

.pickup-table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  color: #34405c;
  font-size: 0.75rem;
}

.pickup-table th {
  padding: 8px 11px;
  border-top: 1px solid #e7ebf2;
  border-bottom: 1px solid #e0e5ed;
  background: #f5f7fa;
  color: #5d6780;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.045em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.pickup-table td {
  padding: 9px 11px;
  border-bottom: 1px solid #e8ecf2;
  vertical-align: middle;
}

.pickup-table tbody tr:nth-child(even) {
  background: #fafbfc;
}

.pickup-table tbody tr:hover {
  background: #f4f7fb;
}

.pickup-table tbody tr:last-child td {
  border-bottom: 0;
}

.pickup-table__business {
  color: var(--ink);
  font-weight: 600;
}

.pickup-table__business .pickup-table__select {
  margin-right: 9px;
  vertical-align: middle;
}

.pickup-table__link {
  color: inherit;
  text-decoration: none;
}

.pickup-table__link:hover,
.pickup-table__link:focus-visible {
  color: var(--brand-blue);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pickup-table__number {
  font-variant-numeric: tabular-nums;
}

.pickup-table__notes {
  max-width: 360px;
  line-height: 1.4;
}

.pickup-status {
  display: inline-flex;
  min-width: 92px;
  min-height: 24px;
  padding: 4px 9px;
  border: 1px solid #d9dfe9;
  border-radius: 6px;
  align-items: center;
  justify-content: center;
  background: #f7f8fa;
  color: #4f5a73;
  font-size: 0.68rem;
  font-weight: 600;
}

.pickup-status--waiting {
  border-color: #8a5100;
  background: #8a5100;
  color: #fff;
}

.pickup-status--confirmed {
  border-color: #14734f;
  background: #14734f;
  color: #fff;
}

.pickup-status--refused {
  border-color: #a72e35;
  background: #a72e35;
  color: #fff;
}

.pickup-empty {
  margin: 0;
  padding: 28px 12px 32px;
  color: var(--ink-soft);
  text-align: center;
}

.pickup-pagination {
  display: flex;
  min-height: 48px;
  padding: 8px 12px;
  border-top: 1px solid #e4e8f0;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
}

.pickup-pagination[hidden] {
  display: none;
}

.pickup-pagination .secondary-button {
  min-width: 78px;
  min-height: 32px;
  padding: 6px 10px;
}

.pickup-detail-page {
  display: grid;
  gap: 12px;
  min-height: 100%;
  align-content: start;
  background: #fff;
}

.pickup-detail-heading {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.pickup-detail-heading h1 {
  margin: 0;
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.025em;
}

.pickup-detail-back {
  min-width: 92px;
  min-height: 36px;
}

.pickup-detail-feedback {
  min-height: 28px;
  color: var(--ink-soft);
  font-size: 0.74rem;
}

.pickup-detail-feedback--error {
  color: var(--danger);
  font-weight: 650;
}

.pickup-detail-content {
  display: grid;
  border-top: 1px solid #e5e9f0;
  background: #fff;
}

.pickup-detail-content[aria-busy="true"] {
  min-height: 140px;
  opacity: 0.6;
}

.pickup-detail-summary {
  display: flex;
  min-height: 72px;
  padding: 14px 2px;
  border-bottom: 1px solid #e5e9f0;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.pickup-detail-summary > div {
  display: grid;
  gap: 3px;
}

.pickup-detail-summary__label {
  color: #6b758b;
  font-size: 0.66rem;
  font-weight: 650;
  text-transform: uppercase;
}

.pickup-detail-summary strong {
  color: var(--ink);
  font-size: 1rem;
}

.pickup-detail-grid {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pickup-detail-field {
  min-width: 0;
  padding: 16px 18px 17px 0;
  border-bottom: 1px solid #edf0f5;
}

.pickup-detail-field dt {
  margin-bottom: 5px;
  color: #6b758b;
  font-size: 0.66rem;
  font-weight: 650;
}

.pickup-detail-field dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: #27334d;
  font-size: 0.79rem;
  font-weight: 600;
}

.pickup-distribution-detail-page {
  display: grid;
  min-width: 0;
  gap: 14px;
  align-content: start;
  background: #fff;
}

.pickup-distribution-detail-heading {
  display: flex;
  min-height: 58px;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}

.pickup-distribution-detail-heading .eyebrow {
  margin: 0 0 3px;
  color: #657089;
  font-size: 0.65rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pickup-distribution-detail-heading h1 {
  margin: 0;
  color: #112262;
  font-size: 1.35rem;
  letter-spacing: -0.025em;
}

.pickup-distribution-detail-heading__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pickup-distribution-detail-print {
  min-width: 154px;
  min-height: 38px;
}

.pickup-distribution-detail-feedback {
  min-height: 22px;
  color: #657089;
  font-size: 0.74rem;
}

.pickup-distribution-detail-feedback--error {
  color: var(--danger);
  font-weight: 650;
}

.pickup-distribution-detail-facts {
  display: grid;
  margin: 0;
  border-top: 1px solid #e4e8f0;
  border-bottom: 1px solid #e4e8f0;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pickup-distribution-detail-facts .pickup-detail-field {
  padding: 13px 16px 14px 0;
  border: 0;
}

.pickup-distribution-detail-table-host[aria-busy="true"] {
  min-height: 180px;
  opacity: 0.55;
}

.pickup-distribution-detail-table-region {
  max-width: 100%;
  overflow: auto;
  outline: 0;
}

.pickup-distribution-detail-table {
  width: 100%;
  min-width: 940px;
  border-collapse: collapse;
  background: #fff;
  font-size: 0.75rem;
}

.pickup-distribution-detail-table th {
  padding: 10px 12px;
  border-bottom: 1px solid #dfe4ed;
  color: #657089;
  font-size: 0.64rem;
  font-weight: 750;
  letter-spacing: 0.045em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.pickup-distribution-detail-table td {
  padding: 11px 12px;
  border-bottom: 1px solid #edf0f5;
  color: #27334d;
  vertical-align: middle;
}

.pickup-distribution-detail-table tbody tr:hover td,
.pickup-distribution-detail-table tbody tr:focus-visible td {
  background: #f8f9fc;
}

.pickup-distribution-detail-table__link {
  color: #112262;
  font-weight: 750;
  text-decoration: none;
}

.pickup-distribution-detail-table__link:hover,
.pickup-distribution-detail-table__link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.pickup-distribution-status {
  display: inline-flex;
  min-width: 78px;
  min-height: 24px;
  padding: 3px 10px;
  align-items: center;
  justify-content: center;
  background: var(--pickup-distribution-status-color, #7b8497);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 750;
}

.pickup-distribution-detail-pagination {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.pickup-distribution-detail-pagination select {
  min-width: 78px;
  min-height: 34px;
  padding: 6px 9px;
  border: 1px solid #d8dee9;
  background: #fff;
  color: #27334d;
  font: inherit;
  font-size: 0.74rem;
}

.pickup-distribution-detail-pagination__info {
  min-width: 130px;
  color: #657089;
  font-size: 0.7rem;
  text-align: center;
}

.pickup-distribution-print-host {
  display: none;
}

.pickup-distribution-print {
  color: #16213b;
  font-family: Inter, Arial, sans-serif;
}

.pickup-distribution-print__header {
  display: flex;
  margin-bottom: 8mm;
  padding-bottom: 4mm;
  border-bottom: 1px solid #cfd5e0;
  align-items: center;
  justify-content: space-between;
  gap: 8mm;
}

.pickup-distribution-print__header img {
  width: 164px;
  height: auto;
}

.pickup-distribution-print__header > div {
  display: grid;
  justify-items: end;
  gap: 2px;
}

.pickup-distribution-print__header h1 {
  margin: 0;
  color: #112262;
  font-size: 16pt;
}

.pickup-distribution-print__facts {
  display: grid;
  margin: 0 0 6mm;
  gap: 3mm 6mm;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.pickup-distribution-print__facts dt {
  margin-bottom: 1mm;
  color: #69738a;
  font-size: 7pt;
  font-weight: 700;
  text-transform: uppercase;
}

.pickup-distribution-print__facts dd {
  margin: 0;
  font-size: 8.5pt;
  font-weight: 650;
}

.pickup-distribution-print__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 7.5pt;
}

.pickup-distribution-print__table th,
.pickup-distribution-print__table td {
  padding: 2.2mm 2.4mm;
  border-bottom: 0.25mm solid #dfe4ed;
  text-align: left;
  vertical-align: top;
}

.pickup-distribution-print__table th {
  color: #59657d;
  font-size: 6.7pt;
  text-transform: uppercase;
}

@media (max-width: 760px) {
  .pickup-filters {
    grid-template-columns: 1fr 1fr;
  }

  .pickup-filters input[type="search"],
  .pickup-filters__submit {
    grid-column: 1 / -1;
  }

  .pickup-create-business-control {
    grid-template-columns: 1fr;
  }

  .pickup-create-form__body {
    grid-template-columns: 1fr;
  }

  .pickup-map__surface {
    min-height: 262px;
  }

  .pickup-map__canvas {
    width: min(100%, 208px);
  }

  .pickup-selection-toolbar {
    grid-template-columns: 1fr auto;
  }

  .pickup-selection-toolbar__count {
    grid-column: 1 / -1;
    text-align: left;
  }

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

  .pickup-distribution-detail-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .pickup-distribution-detail-heading__actions {
    flex-wrap: wrap;
  }

  .pickup-distribution-detail-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 430px) {
  .pickup-heading {
    min-height: 42px;
    align-items: stretch;
    flex-direction: column;
  }

  .pickup-heading__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .pickup-heading__create {
    width: 38px;
    align-self: flex-end;
  }

  .pickup-heading__distribute {
    width: 100%;
  }

  .pickup-filters {
    grid-template-columns: 1fr;
  }

  .pickup-filters input[type="search"],
  .pickup-filters__submit {
    grid-column: auto;
  }

  .pickup-create-grid,
  .pickup-distribution-grid,
  .pickup-detail-grid,
  .pickup-distribution-detail-facts {
    grid-template-columns: 1fr;
  }

  .pickup-map__header,
  .pickup-map__footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .pickup-map__state {
    text-align: left;
  }
}

/* Full-page system states */

.system-state {
  display: grid;
  min-height: 100vh;
  padding: 24px;
  place-items: center;
  background:
    radial-gradient(circle at 12% 16%, rgb(255 204 5 / 9%), transparent 28%),
    radial-gradient(circle at 88% 84%, rgb(17 34 98 / 7%), transparent 30%),
    #f7f8fb;
}

.system-state__card {
  width: min(100%, 500px);
  padding: clamp(28px, 5vw, 46px);
  border: 1px solid #dfe4ee;
  border-radius: 16px;
  background: var(--surface);
  box-shadow: 0 22px 58px rgb(17 34 98 / 12%);
}

.system-state__logo {
  display: block;
  width: min(158px, 58vw);
  height: auto;
  margin-bottom: 34px;
  padding: 16px 20px;
  border-radius: 8px;
  background: var(--ink);
}

.system-state__card .eyebrow {
  margin: 0 0 9px;
  color: #66718a;
  font-size: 0.68rem;
  letter-spacing: 0.1em;
}

.system-state__card h1 {
  margin: 0 0 13px;
  color: var(--brand-dark);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  letter-spacing: -0.035em;
  line-height: 1.08;
}

.system-state__message {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.65;
}

.system-state__diagnostics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 24px 0 0;
  padding: 13px 15px;
  border: 1px solid #e1e6ef;
  border-radius: 8px;
  background: #f7f8fb;
}

.system-state__diagnostics > div {
  display: flex;
  min-width: 0;
  gap: 6px;
  align-items: baseline;
}

.system-state__diagnostics dt,
.system-state__diagnostics dd {
  margin: 0;
}

.system-state__diagnostics dt {
  color: #737d92;
  font-size: 0.68rem;
  font-weight: 650;
}

.system-state__diagnostics dd {
  color: #26365f;
  font-size: 0.72rem;
  font-weight: 720;
}

.system-state__diagnostics code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.68rem;
}

.system-state__diagnostic-reference {
  flex: 1 1 100%;
}

.system-state__diagnostic-reference dd {
  min-width: 0;
  overflow-wrap: anywhere;
}

.system-state__action {
  width: 100%;
  min-height: 50px;
  margin-top: 24px;
}

.system-state__action-icon {
  width: 17px;
  height: 17px;
}

.system-state__support {
  margin: 14px 0 0;
  color: #7a8499;
  font-size: 0.72rem;
  line-height: 1.5;
  text-align: center;
}

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

  .dashboard-grid,
  .module-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .login-layout {
    grid-template-columns: minmax(0, 39%) minmax(0, 61%);
  }

  .login-logo {
    left: 34px;
    width: 160px;
  }

  .login-service-name {
    left: 34px;
  }

  .login-brand-message {
    right: 46px;
    bottom: 54px;
    left: 34px;
  }

  .login-brand-message strong {
    font-size: 1.3rem;
  }

  .login-operations-network {
    width: min(68%, 290px);
  }

  .login-access {
    padding-right: clamp(28px, 5vw, 56px);
    padding-left: clamp(28px, 5vw, 56px);
  }

  .app-shell {
    display: block;
  }

  .sidebar {
    position: fixed;
    left: 0;
    transform: translateX(-105%);
    transition: transform 190ms ease;
    visibility: hidden;
  }

  .app-shell--menu-open .sidebar {
    box-shadow: 20px 0 60px rgb(0 0 0 / 24%);
    transform: translateX(0);
    visibility: visible;
  }

  .sidebar-overlay {
    position: fixed;
    z-index: 25;
    inset: 0;
    display: block;
    border: 0;
    background: rgb(17 34 98 / 48%);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 190ms ease;
  }

  .app-shell--menu-open .sidebar-overlay {
    opacity: 1;
    pointer-events: auto;
  }

  .menu-button {
    display: inline-flex;
  }

  .mobile-logout-button {
    display: inline-grid;
  }

  .topbar {
    min-height: 56px;
  }

  .admin-dashboard-lower {
    grid-template-columns: 1fr;
  }

}

@media (max-width: 680px) {
  .login-layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(184px, 28svh) minmax(0, 1fr);
    overflow: auto;
  }

  .login-brand-plane {
    min-height: 184px;
    overflow: hidden;
  }

  .login-brand-plane::before {
    top: -118%;
    right: -9%;
    bottom: auto;
    left: -34%;
    width: auto;
    height: 230%;
    border-radius: 50%;
    transform: rotate(-2deg);
  }

  .login-brand-plane::after {
    top: -122%;
    right: -11%;
    bottom: auto;
    left: -36%;
    width: auto;
    height: 238%;
    border-radius: 50%;
    transform: rotate(-2deg);
  }

  .login-operations-network {
    top: -24px;
    right: 12px;
    left: auto;
    width: 132px;
    max-height: none;
    filter: none;
    opacity: 0.68;
    transform: none;
  }

  .login-brand-message {
    right: 144px;
    bottom: 22px;
    left: 24px;
  }

  .login-brand-message::before {
    width: 26px;
    height: 2px;
    margin-bottom: 10px;
  }

  .login-brand-message strong {
    font-size: 1rem;
    letter-spacing: -0.02em;
  }

  .login-brand-message span {
    margin-top: 5px;
    font-size: 0.58rem;
    letter-spacing: 0.05em;
  }

  .login-access {
    min-height: calc(100svh - 184px);
    padding: clamp(38px, 7vh, 54px) 24px 48px;
    place-items: start center;
  }

  .login-logo {
    top: 22px;
    left: 24px;
    width: 150px;
  }

  .login-service-name {
    top: 78px;
    left: 24px;
    font-size: 0.58rem;
  }

  .login-panel {
    justify-self: center;
  }

  .login-panel h1 {
    margin-bottom: 28px;
    font-size: 1.65rem;
  }

  .topbar,
  .workspace-main {
    padding-right: 18px;
    padding-left: 18px;
  }

  .system-chip {
    max-width: 130px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .dashboard-hero,
  .module-heading {
    display: grid;
    align-items: start;
  }

  .route-tag {
    min-width: 0;
  }

  .metrics-grid {
    grid-template-columns: 1fr 1fr;
  }

  .admin-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .admin-metric:nth-child(2) {
    border-right: 0;
  }

  .admin-metric:nth-child(-n + 2) {
    border-bottom: 1px solid var(--line);
  }

  .metric-card {
    min-height: 108px;
    padding: 13px;
  }

  .workflow-list {
    grid-template-columns: 1fr;
  }

  .workflow-list li {
    min-height: 58px;
    padding: 12px 0 12px 46px;
    border-top: 0;
    border-left: 1px solid var(--line-strong);
    align-content: center;
  }

  .workflow-list li::after,
  .workflow-list li:not(:last-child)::after {
    top: 24px;
    right: auto;
    left: -4px;
  }

  .workflow-list span {
    position: absolute;
    top: 12px;
    left: 15px;
  }

  .module-code {
    width: 58px;
    height: 58px;
    flex-basis: 58px;
    border-radius: 17px 17px 17px 6px;
  }
}

@media (max-width: 430px) {
  .metrics-grid {
    grid-template-columns: 1fr;
  }

  .metric-card {
    min-height: 104px;
  }

  .admin-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .admin-metric,
  .admin-metric:nth-child(2) {
    min-height: 88px;
    border: 1px solid #e0e5ef;
  }

  .admin-metric:nth-child(even) {
    border-right: 1px solid #e0e5ef;
  }

  .admin-metric:nth-child(n + 3) {
    border-bottom: 1px solid #e0e5ef;
  }

  .topbar__title small {
    display: none;
  }

  .system-chip {
    max-width: 118px;
    padding: 6px 9px;
    font-size: 0.64rem;
  }

  .system-chip::before {
    width: 7px;
    height: 7px;
  }
}

@media (max-width: 360px) {
  .package-filters,
  .package-advanced-filters__grid {
    grid-template-columns: 1fr;
  }

  .package-filter--search,
  .package-filter-actions,
  .package-advanced-filters {
    grid-column: auto;
  }

  .packages-page .package-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .packages-page .package-filter--search,
  .packages-page .package-filter-actions {
    grid-column: 1 / -1;
  }

  .admin-metrics {
    grid-template-columns: 1fr;
  }

  .admin-metric,
  .admin-metric:nth-child(2),
  .admin-metric:nth-child(n + 3) {
    min-height: 76px;
    border: 1px solid #e0e5ef;
  }

  .admin-metric:last-child {
    border-bottom: 1px solid #e0e5ef;
  }
}

/* Finance reports */

.report-page,
.package-chart-page {
  display: grid;
  gap: 12px;
}

.report-heading,
.package-chart-heading {
  display: flex;
  min-height: 48px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.report-heading .eyebrow,
.package-chart-heading .eyebrow {
  margin-bottom: 3px;
}

.report-heading h1,
.package-chart-heading h1 {
  margin: 0;
  color: #1d2d5b;
  font-size: clamp(1.05rem, 1.6vw, 1.28rem);
  font-weight: 760;
}

.report-heading__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

.report-heading__actions .table-excel-button {
  min-height: 38px;
  border-color: #bdc7d9;
  background: #fff;
}

.report-filters,
.package-chart-filters {
  display: grid;
  padding: 12px;
  border: 1px solid #e1e6ef;
  border-radius: 10px;
  grid-template-columns: repeat(auto-fit, minmax(154px, 1fr));
  align-items: end;
  gap: 9px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(17 34 98 / 4%);
}

.report-filter {
  display: grid;
  min-width: 0;
  gap: 5px;
}

.report-filter > span {
  overflow: hidden;
  color: #53607d;
  font-size: 0.65rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-filter input,
.report-filter select,
.package-chart-filters input,
.package-chart-filters select {
  width: 100%;
  min-width: 0;
  height: 38px;
  padding: 7px 10px;
  border: 1px solid #cbd3e1;
  border-radius: 7px;
  background: #fff;
  color: #27365e;
  box-shadow: none;
  font-size: 0.73rem;
  outline: 0;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.report-filter input:hover,
.report-filter select:hover,
.package-chart-filters input:hover,
.package-chart-filters select:hover {
  border-color: #8996b5;
}

.report-filter input:focus,
.report-filter select:focus,
.package-chart-filters input:focus,
.package-chart-filters select:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.report-filters > .primary-button,
.package-chart-filters > .primary-button {
  min-height: 38px;
  padding-block: 7px;
  justify-self: end;
}

.report-feedback,
.package-chart-feedback {
  min-height: 16px;
  margin: -2px 0 0;
  color: #66718b;
  font-size: 0.67rem;
  font-weight: 650;
}

.report-feedback:empty,
.package-chart-feedback:empty {
  display: none;
}

.report-feedback--error,
.package-chart-feedback--error {
  color: var(--danger);
}

.report-results {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e1e6ef;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(17 34 98 / 5%);
}

.report-table-region {
  width: 100%;
  overflow: auto;
  overscroll-behavior-inline: contain;
}

.report-table {
  width: 100%;
  min-width: 720px;
  border-collapse: separate;
  border-spacing: 0;
  color: #2a385e;
  font-size: 0.7rem;
}

.report-table th,
.report-table td {
  height: 38px;
  padding: 7px 10px;
  border-bottom: 1px solid #e8ebf2;
  text-align: left;
  white-space: nowrap;
}

.report-table thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  background: #f8f9fc;
  color: #52607d;
  font-size: 0.63rem;
  font-weight: 740;
  letter-spacing: 0.018em;
}

.report-table tbody tr:last-child td,
.report-table tfoot tr:last-child th {
  border-bottom: 0;
}

.report-table tbody tr:hover > td,
.report-table tbody tr:focus-within > td {
  background: #f7f9fd;
}

.report-table tbody tr.report-table__row--warning > td {
  background: #fff1d6;
  color: #6d4300;
  font-weight: 680;
}

.report-table tbody tr.report-table__row--warning:hover > td,
.report-table tbody tr.report-table__row--warning:focus-within > td {
  background: #ffe7b4;
}

.report-table .table-row--clickable {
  cursor: pointer;
}

.report-table__number {
  font-variant-numeric: tabular-nums;
  text-align: right !important;
}

.report-table__totals th {
  border-top: 1px solid #d4dbe8;
  background: #fbfcfe;
  color: #1f315f;
  font-weight: 760;
}

.report-state {
  display: grid;
  min-height: 150px;
  margin: 0;
  padding: 24px;
  place-content: center;
  color: #68738d;
  font-size: 0.72rem;
  text-align: center;
}

.report-state h2 {
  margin: 0 0 4px;
  color: #26365e;
  font-size: 0.84rem;
}

.report-state p {
  margin: 0;
}

.report-state--error {
  color: var(--danger);
}

.package-chart-heading {
  display: grid;
  justify-content: stretch;
  gap: 0;
}

.package-chart-warning {
  margin: 4px 0 0;
  color: #68738d;
  font-size: 0.67rem;
}

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

.package-chart-card {
  min-width: 0;
  min-height: 350px;
  padding: 14px;
  border: 1px solid #e1e6ef;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(17 34 98 / 5%);
}

.package-chart-grid > .package-chart-card:first-child {
  grid-column: 1 / -1;
}

.package-chart-card h2 {
  margin: 0 0 12px;
  color: #26365e;
  font-size: 0.78rem;
  font-weight: 760;
}

.package-chart-pie {
  display: grid;
  min-height: 290px;
  grid-template-columns: minmax(210px, 1fr) minmax(190px, 0.86fr);
  align-items: center;
  gap: 18px;
}

.package-chart-pie svg {
  display: block;
  width: min(100%, 260px);
  height: auto;
  margin-inline: auto;
  overflow: visible;
}

.package-chart-pie__track {
  fill: #edf0f5;
}

.package-chart-pie__segment {
  stroke: #fff;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.package-chart-pie__slice-label,
.package-chart-pie__empty {
  text-anchor: middle;
}

.package-chart-pie__slice-label {
  fill: #fff;
  font-size: 0.52rem;
  font-weight: 780;
  paint-order: stroke;
  stroke: rgb(15 29 65 / 38%);
  stroke-linejoin: round;
  stroke-width: 2px;
}

.package-chart-pie__slice-percentage {
  font-size: 0.44rem;
  font-weight: 720;
}

.package-chart-pie__empty {
  fill: #717b94;
  font-size: 0.62rem;
  font-weight: 650;
  dominant-baseline: middle;
}

.package-chart-legend,
.package-chart-bars {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.package-chart-legend {
  min-height: 205px;
  align-content: center;
  gap: 5px;
}

.package-chart-legend li {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) minmax(58px, auto);
  min-height: 28px;
  padding: 4px 0;
  align-items: center;
  gap: 7px;
  border-bottom: 1px solid #edf0f5;
  color: #53607d;
  font-size: 0.66rem;
}

.package-chart-legend li:last-child {
  border-bottom: 0;
}

.package-chart-legend-shell {
  min-width: 0;
}

.package-chart-legend__values {
  display: grid;
  justify-items: end;
  gap: 1px;
  font-variant-numeric: tabular-nums;
}

.package-chart-legend__values small {
  color: #68738d;
  font-size: 0.59rem;
  font-weight: 680;
}

.package-chart-legend li strong,
.package-chart-bars li strong {
  color: #26365e;
  font-variant-numeric: tabular-nums;
}

.package-chart-legend__marker {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.package-chart-legend__marker--empty {
  border: 1px solid #aab3c5;
  background: transparent;
}

.package-chart-legend__pagination {
  display: flex;
  min-height: 30px;
  margin-top: 7px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-top: 1px solid #e5e9f1;
}

.package-chart-legend__pagination[hidden] {
  display: none;
}

.package-chart-legend__button {
  width: 26px;
  height: 24px;
  padding: 0;
  border: 1px solid #cbd3e1;
  border-radius: 5px;
  background: #fff;
  color: #27365e;
  font: inherit;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}

.package-chart-legend__button:disabled {
  opacity: 0.35;
  cursor: default;
}

.package-chart-legend__button:not(:disabled):hover,
.package-chart-legend__button:not(:disabled):focus-visible {
  border-color: var(--brand-dark);
  outline: 0;
}

.package-chart-legend__page {
  min-width: 38px;
  color: #68738d;
  font-size: 0.61rem;
  font-weight: 700;
  text-align: center;
}

.package-chart-bars {
  gap: 8px;
}

.package-chart-bars li {
  display: grid;
  grid-template-columns: minmax(80px, 0.7fr) minmax(86px, 1fr) minmax(26px, auto);
  align-items: center;
  gap: 8px;
  font-size: 0.64rem;
}

.package-chart-bars__label {
  overflow: hidden;
  color: #53607d;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.package-chart-bars__track {
  height: 6px;
  overflow: hidden;
  background: #edf0f5;
}

.package-chart-bars__fill {
  display: block;
  height: 100%;
  background: var(--brand-dark);
}

.package-chart-bars--returns .package-chart-bars__fill {
  background: var(--brand);
}

.package-chart-empty {
  margin: 0;
  padding: 58px 8px;
  color: #737d95;
  font-size: 0.7rem;
  text-align: center;
}

@media (max-width: 880px) {
  .package-chart-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .package-chart-grid > .package-chart-card:first-child {
    grid-column: auto;
  }
}

@media (max-width: 680px) {
  .report-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .report-heading__actions,
  .report-heading__actions .table-excel-button {
    width: 100%;
  }

  .report-filters,
  .package-chart-filters,
  .package-chart-grid,
  .package-chart-pie {
    grid-template-columns: 1fr;
  }

  .package-chart-card {
    min-height: 0;
  }

  .package-chart-pie {
    min-height: 0;
  }

  .package-chart-pie svg {
    width: min(100%, 230px);
  }

  .package-chart-legend {
    min-height: 0;
  }
}

/* Raportet financiare legacy pa ekuivalent në regjistrin e përbashkët */

/* Pako të marra nga agjensitë */

.from-agencies-page {
  display: grid;
  min-width: 0;
  gap: 12px;
}

.from-agencies-heading {
  display: flex;
  min-height: 48px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.from-agencies-heading .eyebrow {
  margin-bottom: 3px;
}

.from-agencies-heading h1 {
  margin: 0;
  color: var(--brand-dark);
  font-size: clamp(1.05rem, 1.6vw, 1.28rem);
  font-weight: 760;
}

.from-agencies-heading__actions {
  display: flex;
  flex: 0 0 auto;
}

.from-agencies-heading__actions .table-excel-button {
  min-height: 38px;
  border-color: #bdc7d9;
  background: #fff;
}

.from-agencies-filters {
  display: grid;
  padding: 12px;
  border: 1px solid #e1e6ef;
  border-radius: 8px;
  grid-template-columns: minmax(160px, 1fr) minmax(160px, 1fr) minmax(110px, 0.45fr) auto;
  align-items: end;
  gap: 9px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(17 34 98 / 4%);
}

.from-agencies-filters label {
  display: grid;
  min-width: 0;
  gap: 5px;
  color: #53607d;
  font-size: 0.65rem;
  font-weight: 700;
}

.from-agencies-filters input,
.from-agencies-filters select {
  width: 100%;
  min-width: 0;
  height: 38px;
  padding: 7px 10px;
  border: 1px solid #cbd3e1;
  border-radius: 6px;
  background: #fff;
  color: #27365e;
  font-size: 0.73rem;
  outline: 0;
}

.from-agencies-filters input:focus,
.from-agencies-filters select:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.from-agencies-filters .primary-button {
  min-width: 118px;
  min-height: 38px;
}

.from-agencies-feedback {
  min-height: 16px;
  margin: -2px 0 0;
  color: #66718b;
  font-size: 0.67rem;
  font-weight: 650;
}

.from-agencies-feedback--error {
  color: var(--danger);
}

.from-agencies-table-region {
  width: 100%;
  min-width: 0;
  overflow: auto;
  border: 1px solid #e1e6ef;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(17 34 98 / 5%);
  overscroll-behavior-inline: contain;
}

.from-agencies-table {
  width: 100%;
  min-width: 560px;
  border-collapse: separate;
  border-spacing: 0;
  color: #2a385e;
  font-size: 0.7rem;
}

.from-agencies-table th,
.from-agencies-table td {
  height: 40px;
  padding: 8px 12px;
  border-bottom: 1px solid #e8ebf2;
  text-align: left;
}

.from-agencies-table thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  background: #f8f9fc;
  color: #52607d;
  font-size: 0.63rem;
  font-weight: 740;
  letter-spacing: 0.018em;
}

.from-agencies-table tbody tr:hover > *,
.from-agencies-table tbody tr:focus-visible > * {
  background: #f7f9fd;
}

.from-agencies-table__ordinal {
  width: 72px;
  color: #7a849d;
  font-variant-numeric: tabular-nums;
}

.from-agencies-table__link {
  color: #1e326b;
  font-weight: 720;
}

.from-agencies-table__number {
  font-variant-numeric: tabular-nums;
  text-align: right !important;
}

.from-agencies-table__count {
  color: #112262;
  font-weight: 760;
}

.from-agencies-table tfoot > tr > * {
  border-top: 1px solid #ccd4e3;
  border-bottom: 0;
  background: #fbfcfe;
  color: #1f315f;
  font-weight: 760;
}

.from-agencies-state {
  display: grid;
  min-height: 150px;
  margin: 0;
  padding: 24px;
  place-content: center;
  color: #68738d;
  font-size: 0.72rem;
  text-align: center;
}

.from-agencies-state--error {
  color: var(--danger);
}

.from-agencies-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  color: #66718b;
  font-size: 0.68rem;
  font-weight: 650;
}

@media (max-width: 760px) {
  .from-agencies-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .from-agencies-heading__actions,
  .from-agencies-heading__actions .table-excel-button {
    width: 100%;
  }

  .from-agencies-filters {
    grid-template-columns: 1fr;
  }

  .from-agencies-filters .primary-button {
    width: 100%;
  }

  .from-agencies-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
  }
}

.extra-report-page {
  display: grid;
  min-width: 0;
  gap: 12px;
}

.extra-report-heading {
  display: flex;
  min-height: 48px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.extra-report-heading .eyebrow {
  margin-bottom: 3px;
}

.extra-report-heading h1 {
  margin: 0;
  color: #1d2d5b;
  font-size: clamp(1.05rem, 1.6vw, 1.28rem);
  font-weight: 760;
}

.extra-report-heading__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}

.extra-report-heading__actions .table-excel-button {
  min-height: 38px;
  border-color: #bdc7d9;
  background: #fff;
}

.extra-report-filters {
  display: grid;
  padding: 12px;
  border: 1px solid #e1e6ef;
  border-radius: 8px;
  grid-template-columns: repeat(auto-fit, minmax(154px, 1fr));
  align-items: end;
  gap: 9px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(17 34 98 / 4%);
}

.extra-report-filters label {
  display: grid;
  min-width: 0;
  gap: 5px;
  color: #53607d;
  font-size: 0.65rem;
  font-weight: 700;
}

.extra-report-filters input,
.extra-report-filters select {
  width: 100%;
  min-width: 0;
  height: 38px;
  padding: 7px 10px;
  border: 1px solid #cbd3e1;
  border-radius: 6px;
  background: #fff;
  color: #27365e;
  font: inherit;
  font-size: 0.73rem;
  outline: 0;
}

.extra-report-filters input:hover,
.extra-report-filters select:hover {
  border-color: #8996b5;
}

.extra-report-filters input:focus,
.extra-report-filters select:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 9%);
}

.extra-report-filters > .primary-button {
  min-height: 38px;
  justify-self: end;
}

.extra-report-feedback {
  min-height: 16px;
  margin: -2px 0 0;
  color: #66718b;
  font-size: 0.67rem;
  font-weight: 650;
}

.extra-report-feedback:empty {
  display: none;
}

.extra-report-feedback--error {
  color: var(--danger);
}

.extra-report-table-region {
  width: 100%;
  min-width: 0;
  overflow: auto;
  border: 1px solid #e1e6ef;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(17 34 98 / 5%);
  overscroll-behavior-inline: contain;
}

.extra-report-table {
  width: 100%;
  min-width: 620px;
  border-collapse: separate;
  border-spacing: 0;
  color: #2a385e;
  font-size: 0.7rem;
}

.extra-report-table--settled {
  min-width: 1420px;
}

.extra-report-table th,
.extra-report-table td {
  height: 38px;
  padding: 7px 10px;
  border-bottom: 1px solid #e8ebf2;
  text-align: left;
  white-space: nowrap;
}

.extra-report-table thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  background: #f8f9fc;
  color: #52607d;
  font-size: 0.63rem;
  font-weight: 740;
  letter-spacing: 0.018em;
}

.extra-report-table tbody tr:not(.extra-report-table__group):hover > * {
  background: #f7f9fd;
}

.extra-report-table tbody tr:last-child > * {
  border-bottom: 0;
}

.extra-report-table__number {
  font-variant-numeric: tabular-nums;
  text-align: right !important;
}

.extra-report-table__group th {
  height: 34px;
  border-bottom-color: #d9dfeb;
  background: #eef2fa;
  color: #112262;
  font-size: 0.7rem;
  font-weight: 780;
  letter-spacing: 0.018em;
}

.extra-report-table__subtotal > * {
  border-top: 1px solid #d3dae7;
  background: #fbfcfe;
  color: #1f315f;
  font-weight: 760;
}

.extra-report-state {
  display: grid;
  min-height: 150px;
  margin: 0;
  padding: 24px;
  place-content: center;
  color: #68738d;
  font-size: 0.72rem;
  text-align: center;
}

.extra-report-pagination {
  display: flex;
  justify-content: flex-end;
}

.extra-report-load-more {
  min-width: 160px;
}

@media (max-width: 680px) {
  .extra-report-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .extra-report-heading__actions,
  .extra-report-heading__actions .table-excel-button,
  .extra-report-load-more {
    width: 100%;
  }

  .extra-report-filters {
    grid-template-columns: 1fr;
  }
}

/* Arkë, fatura dhe detyrime */

.finance-page {
  display: grid;
  min-width: 0;
  gap: 10px;
}

.finance-heading {
  display: flex;
  min-height: 46px;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.finance-heading .eyebrow {
  margin-bottom: 2px;
}

.finance-heading h1 {
  margin: 0;
  color: #1d2d5b;
  font-size: clamp(1.05rem, 1.6vw, 1.28rem);
  font-weight: 760;
}

.finance-heading__actions,
.cash-entry-form__actions,
.finance-pagination {
  display: flex;
  align-items: center;
  gap: 8px;
}

.finance-heading__actions .table-excel-button,
.finance-heading__actions .cash-entry-create,
.finance-heading__actions .collection-create-button,
.finance-heading__actions .collection-import-button,
.finance-heading__actions .invoice-create-button {
  min-height: 38px;
}

.finance-filters {
  display: grid;
  padding: 10px 0;
  border-block: 1px solid #e1e6ef;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  align-items: end;
  gap: 8px;
  background: #fff;
}

.finance-filter {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.finance-filter > span {
  overflow: hidden;
  color: #52607d;
  font-size: 0.64rem;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-filter input,
.finance-filter select,
.finance-filter textarea,
.obligation-form input,
.cash-entry-item input {
  width: 100%;
  min-width: 0;
  height: 38px;
  padding: 7px 10px;
  border: 1px solid #cbd3e1;
  border-radius: 6px;
  background: #fff;
  color: #27365e;
  box-shadow: none;
  font: inherit;
  font-size: 0.72rem;
  outline: 0;
}

.finance-filter input:focus,
.finance-filter select:focus,
.finance-filter textarea:focus,
.obligation-form input:focus,
.cash-entry-item input:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 8%);
}

.finance-feedback {
  min-height: 16px;
  margin: 0;
  color: #68738d;
  font-size: 0.67rem;
  font-weight: 650;
}

.finance-feedback:empty {
  display: none;
}

.finance-feedback--error,
.finance-state--error {
  color: var(--danger);
}

.collection-import-issues {
  max-height: 260px;
  padding: 10px 12px;
  overflow: auto;
  border: 1px solid rgb(163 38 48 / 24%);
  border-radius: 6px;
  background: rgb(163 38 48 / 4%);
  color: #6f2630;
  font-size: 0.69rem;
}

.collection-import-issues h3 {
  margin: 0 0 6px;
  color: #82242e;
  font-size: 0.74rem;
}

.collection-import-issues ul {
  margin: 0;
  padding-left: 18px;
}

.collection-import-issues li + li {
  margin-top: 5px;
}

.finance-results {
  min-width: 0;
  overflow: hidden;
  border-block: 1px solid #e1e6ef;
  background: #fff;
}

.finance-table-region {
  width: 100%;
  overflow: auto;
  overscroll-behavior-inline: contain;
}

.finance-table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  color: #2a385e;
  font-size: 0.69rem;
}

.finance-table th,
.finance-table td {
  height: 38px;
  padding: 7px 9px;
  border-bottom: 1px solid #e8ebf2;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.finance-table thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  background: #f8f9fc;
  color: #52607d;
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.015em;
}

.finance-table tbody tr:not(.finance-table__empty):hover td,
.finance-table tbody tr:not(.finance-table__empty):focus td {
  background: #f6f8fc;
}

.finance-table__detail-link {
  color: var(--brand-dark);
  font-weight: 780;
  text-decoration: none;
}

.finance-table__detail-link:hover,
.finance-table__detail-link:focus-visible {
  color: #0a56a8;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.finance-table tbody tr:last-child td,
.finance-table tfoot tr:last-child th {
  border-bottom: 0;
}

.finance-table__number {
  font-variant-numeric: tabular-nums;
  text-align: right !important;
}

.finance-table__totals th {
  border-top: 1px solid #d4dbe8;
  background: #fbfcfe;
  color: #1f315f;
  font-weight: 760;
}

.finance-table__empty td,
.finance-state {
  height: 110px;
  color: #6f7990;
  text-align: center;
}

.finance-status {
  display: inline-flex;
  min-height: 24px;
  padding: 3px 8px;
  align-items: center;
  border: 1px solid #65728b;
  border-radius: 999px;
  background: #65728b;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 740;
}

.finance-status[data-legacy-color="true"] {
  border-color: var(--finance-status-color);
  background: var(--finance-status-color);
  color: #fff;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}

.finance-state-badge {
  display: inline-flex;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  align-items: center;
  background: #667085;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 740;
  white-space: nowrap;
}

.finance-state-badge--settled {
  background: #087443;
}

.finance-state-badge--pending {
  background: #b54708;
}

.finance-state-badge--partial {
  background: #175cd3;
}

.finance-state-badge--unsubmitted,
.finance-state-badge--not-applicable {
  background: #475467;
}

.finance-state-badge--unknown {
  background: #7a271a;
}

.finance-pagination {
  justify-content: flex-end;
}

.finance-pagination .secondary-button {
  min-width: 78px;
  min-height: 34px;
}

.finance-inspector,
.cash-entry-form,
.collection-create-panel,
.invoice-create-panel,
.obligation-command,
.obligation-warning {
  padding: 14px;
  border-left: 3px solid var(--brand-dark);
  background: #fff;
  box-shadow: 0 1px 3px rgb(17 34 98 / 6%);
}

.finance-action-modal__surface {
  width: min(100%, 1200px);
}

.finance-action-modal__surface.collection-create-panel,
.finance-action-modal__surface.invoice-create-panel {
  width: min(100%, 1480px);
  max-height: calc(100vh - 32px);
  padding: 18px;
  border-left-width: 0;
  box-shadow: 0 28px 80px rgb(3 10 35 / 30%);
}

.finance-search-submit {
  min-width: 112px;
  min-height: 38px;
  justify-self: end;
}

.finance-action-modal__surface > .cash-entry-form {
  border-left: 0;
  border-radius: inherit;
  box-shadow: none;
}

.obligation-action-modal__surface {
  width: min(100%, 660px);
  padding: 16px;
}

.obligation-action-modal__surface .obligation-form {
  margin-top: 14px;
}

.finance-inspector__header,
.cash-entry-form__header,
.collection-create-panel__header,
.invoice-create-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.finance-inspector__header h2,
.cash-entry-form__header h2,
.cash-entry-form h3,
.collection-create-panel__header h2,
.collection-create-form h3,
.invoice-create-panel__header h2,
.invoice-create-form h3,
.obligation-table-title {
  margin: 0;
  color: #26365e;
  font-size: 0.78rem;
  font-weight: 760;
}

.finance-inspector__close,
.cash-entry-item__remove {
  padding: 4px 7px;
  border: 0;
  background: transparent;
  color: #5f6b84;
  font-size: 0.66rem;
  font-weight: 700;
  cursor: pointer;
}

.finance-inspector__grid {
  display: grid;
  margin: 12px 0 0;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px 18px;
}

.finance-inspector__field {
  min-width: 0;
}

.finance-inspector dt {
  color: #68738d;
  font-size: 0.59rem;
  font-weight: 700;
}

.finance-inspector dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  color: #24345c;
  font-size: 0.72rem;
  font-weight: 660;
}

.cash-entry-form {
  display: grid;
  gap: 12px;
}

.cash-entry-form[hidden],
.collection-create-panel[hidden],
.invoice-create-panel[hidden],
.finance-inspector[hidden] {
  display: none;
}

.cash-entry-form__fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.cash-entry-form__payment-source {
  grid-column: 1 / -1;
}

.cash-entry-form__source-help {
  color: #667085;
  font-size: 0.66rem;
  line-height: 1.45;
}

.cash-entry-form__income-notice {
  margin: 0;
}

.cash-entry-items {
  display: grid;
  gap: 10px;
}

.cash-entry-item {
  display: grid;
  min-width: 0;
  margin: 0;
  padding: 10px;
  border: 1px solid #e1e6ef;
  border-radius: 8px;
  grid-template-columns: minmax(220px, 1.55fr) minmax(110px, 0.55fr) auto;
  align-items: end;
  gap: 8px;
  background: #fbfcfe;
}

.cash-entry-item--expense {
  grid-template-columns:
    minmax(220px, 1.45fr)
    minmax(110px, 0.55fr)
    minmax(180px, 0.9fr)
    minmax(210px, 1fr)
    auto;
}

.cash-entry-item__legend {
  grid-column: 1 / -1;
  padding: 0 4px;
  color: #26365e;
  font-size: 0.66rem;
  font-weight: 760;
}

.cash-entry-item__field {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.cash-entry-item__label {
  overflow: hidden;
  color: #52607d;
  font-size: 0.64rem;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cash-entry-item__field .searchable-select {
  width: 100%;
}

.cash-entry-item__field input,
.cash-entry-item__field select,
.cash-entry-item__field .searchable-select__input {
  width: 100%;
  min-width: 0;
}

.cash-entry-form__actions {
  justify-content: space-between;
}

.cash-entry-form__actions .button-with-icon,
.cash-entry-form__actions .primary-button {
  min-height: 38px;
}

.cash-entry-item__remove {
  width: 38px;
  min-width: 38px;
  min-height: 38px;
  align-self: end;
}

.cash-entry-item__remove:disabled {
  cursor: not-allowed;
  opacity: 0.38;
}

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

.collection-create-form {
  display: grid;
  gap: 12px;
}

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

.collection-package-toolbar,
.collection-package-toolbar__actions,
.collection-create-panel__header,
.collection-create-actions,
.collection-preview-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.collection-package-toolbar__actions {
  justify-content: flex-end;
}

.collection-select-all {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  color: #34436a;
  font-size: 0.7rem;
  font-weight: 720;
  cursor: pointer;
}

.collection-select-all input,
.collection-preview-table__select input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--brand-dark);
}

.collection-package-results {
  min-height: 116px;
  max-height: min(52vh, 620px);
  overflow: auto;
  border-block: 1px solid #e1e6ef;
  background: #fff;
}

.collection-preview-table {
  min-width: 900px;
}

.collection-preview-table__select {
  width: 40px;
  text-align: center !important;
}

.collection-preview-status {
  display: inline-flex;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid var(--legacy-status-color, #65728b);
  border-radius: 5px;
  align-items: center;
  justify-content: center;
  background: var(--legacy-status-color, #65728b);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 16%);
  color: #fff;
  font-size: 0.64rem;
  font-weight: 720;
  text-align: center;
}

.collection-preview-pagination {
  justify-content: flex-end;
}

.collection-summary {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-block: 1px solid #e1e6ef;
}

.collection-summary > div {
  min-width: 0;
  padding: 10px 12px;
}

.collection-summary dt {
  overflow: hidden;
  color: #68738d;
  font-size: 0.59rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.collection-summary dd {
  margin: 3px 0 0;
  color: #1f315f;
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  font-weight: 780;
}

.collection-summary__remainder {
  background: #f8f9fc;
}

.collection-command-fields {
  display: grid;
  grid-template-columns: minmax(150px, 0.25fr) minmax(150px, 0.25fr) minmax(260px, 1fr);
  gap: 8px;
}

.collection-command-fields textarea {
  min-height: 38px;
  resize: none;
}

.collection-create-actions {
  justify-content: flex-end;
}

.collection-create-save {
  min-width: 150px;
}

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

.invoice-create-form {
  display: grid;
  gap: 12px;
}

.invoice-create-fields {
  display: grid;
  grid-template-columns: minmax(300px, 1.35fr) minmax(170px, 0.62fr) minmax(220px, 0.78fr) minmax(270px, 1fr);
  align-items: end;
  gap: 8px;
}

.invoice-business-search,
.invoice-tracking-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
}

.invoice-business-field {
  align-self: stretch;
}

.invoice-business-field > select {
  margin-top: 2px;
}

.invoice-create-fields .finance-filter input,
.invoice-create-fields .finance-filter select,
.invoice-create-fields .business-combobox__input {
  height: 42px;
  min-height: 42px;
  border-radius: 8px;
}

.invoice-package-toolbar,
.invoice-package-toolbar__filters,
.invoice-preview-pagination,
.invoice-create-actions,
.invoice-create-confirmation {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.invoice-package-toolbar__filters {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.invoice-tracking-search {
  min-width: 250px;
}

.invoice-tracking-search input,
.invoice-package-toolbar select {
  min-height: 36px;
  padding: 7px 9px;
  border: 1px solid #cbd3e1;
  border-radius: 6px;
  background: #fff;
  color: #27365e;
  font: inherit;
  font-size: 0.7rem;
  outline: 0;
}

.invoice-tracking-search input:focus,
.invoice-package-toolbar select:focus {
  border-color: var(--brand-dark);
  box-shadow: 0 0 0 3px rgb(17 34 98 / 8%);
}

.invoice-package-results {
  min-height: 116px;
  max-height: min(52vh, 620px);
  overflow: auto;
  border-block: 1px solid #e1e6ef;
  background: #fff;
}

.invoice-create-table {
  min-width: 1180px;
}

.invoice-preview-pagination {
  justify-content: flex-end;
}

.invoice-create-summary {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-block: 1px solid #e1e6ef;
}

.invoice-create-summary > div {
  min-width: 0;
  padding: 9px 11px;
}

.invoice-create-summary dt {
  color: #68738d;
  font-size: 0.59rem;
  font-weight: 700;
}

.invoice-create-summary dd {
  margin: 3px 0 0;
  color: #1f315f;
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
  font-weight: 780;
}

.invoice-create-confirmation {
  padding: 10px 12px;
  border-inline-start: 3px solid var(--brand-dark);
  background: rgb(17 34 98 / 4%);
  color: #27365e;
  font-size: 0.68rem;
}

.invoice-create-confirmation[hidden] {
  display: none;
}

.invoice-create-actions {
  justify-content: flex-end;
}

.invoice-create-save {
  min-width: 150px;
}

.obligation-command {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  align-items: center;
  gap: 18px;
}

.obligation-action-trigger {
  justify-self: end;
}

.obligation-debt {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 2px 12px;
}

.obligation-debt span {
  grid-column: 1 / -1;
  color: #68738d;
  font-size: 0.62rem;
  font-weight: 720;
}

.obligation-debt strong {
  color: #1f315f;
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
}

.obligation-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(100px, 1fr)) auto;
  align-items: center;
  gap: 8px;
}

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

.obligation-form .finance-feedback {
  grid-column: 1 / -1;
}

.obligation-table-title {
  margin-top: 4px;
}

.obligation-warning {
  border-left-color: #e6aa22;
  color: #5e4d27;
  font-size: 0.66rem;
  line-height: 1.5;
}

.obligation-warning ol {
  margin: 6px 0 0;
  padding-left: 18px;
}

.finance-settlement-receipt-host:empty {
  display: none;
}

.finance-settlement-receipt {
  width: min(100%, 760px);
  margin: 2px auto 4px;
  padding: 18px;
  border: 1px solid #dce2ec;
  background: #fff;
  box-shadow: 0 8px 24px rgb(17 34 98 / 7%);
}

.finance-settlement-receipt__header {
  display: flex;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--brand-dark);
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.finance-settlement-receipt__logo {
  display: none;
  width: 164px;
  height: auto;
  margin-bottom: 12px;
}

.finance-settlement-receipt__identity .eyebrow {
  margin-bottom: 4px;
}

.finance-settlement-receipt__identity h2 {
  margin: 0;
  color: #1e2e59;
  font-size: 1.08rem;
  font-weight: 780;
}

.finance-settlement-receipt__date {
  margin: 4px 0 0;
  color: #66718a;
  font-size: 0.68rem;
  font-weight: 650;
}

.finance-settlement-receipt__qr {
  display: grid;
  width: 148px;
  margin: 0;
  flex: 0 0 148px;
  gap: 4px;
  place-items: center;
}

.finance-settlement-receipt__qr img {
  display: block;
  width: 148px;
  height: 148px;
}

.finance-settlement-receipt__qr figcaption {
  color: #6d7790;
  font-size: 0.59rem;
  font-weight: 680;
}

.finance-settlement-receipt__facts {
  display: grid;
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid #e6eaf1;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.finance-settlement-receipt__facts dt,
.finance-settlement-receipt__token span {
  color: #747e96;
  font-size: 0.59rem;
  font-weight: 680;
  text-transform: uppercase;
}

.finance-settlement-receipt__facts dd {
  margin: 3px 0 0;
  color: #24345c;
  font-size: 0.73rem;
  font-weight: 730;
  font-variant-numeric: tabular-nums;
}

.finance-settlement-receipt__token {
  display: grid;
  padding: 12px 0;
  gap: 3px;
}

.finance-settlement-receipt__token strong {
  overflow-wrap: anywhere;
  color: #26365e;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.7rem;
  letter-spacing: 0.035em;
}

.finance-settlement-receipt__toolbar {
  display: flex;
  padding-top: 12px;
  border-top: 1px solid #e6eaf1;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.finance-settlement-receipt__replay {
  margin-right: auto;
  color: #68738d;
  font-size: 0.64rem;
  font-weight: 650;
}

.finance-settlement-receipt__print {
  min-width: 148px;
}

.finance-obligation-detail-page {
  min-width: 0;
  min-height: 100%;
  padding: clamp(18px, 2.3vw, 30px);
  color: #17233f;
  background: #fff;
}

.finance-obligation-detail-heading,
.finance-obligation-detail-heading__actions,
.finance-obligation-detail-overview,
.finance-obligation-print__header {
  display: flex;
  align-items: center;
}

.finance-obligation-detail-heading {
  justify-content: space-between;
  gap: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid #dfe5ef;
}

.finance-obligation-detail-heading h1 {
  margin: 2px 0 0;
  color: #112262;
  font-size: clamp(1.22rem, 2vw, 1.62rem);
  letter-spacing: -0.025em;
}

.finance-obligation-detail-back {
  color: #566586;
  font-size: 0.7rem;
  font-weight: 720;
  text-decoration: none;
}

.finance-obligation-detail-back:hover,
.finance-obligation-detail-back:focus-visible {
  color: #112262;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.finance-obligation-detail-heading__actions {
  justify-content: flex-end;
  gap: 8px;
}

.finance-obligation-detail-feedback {
  min-height: 18px;
  margin: 10px 0 0;
}

.finance-obligation-detail-overview {
  align-items: stretch;
  justify-content: space-between;
  gap: clamp(18px, 3vw, 42px);
  padding: 22px 0;
}

.finance-obligation-facts {
  display: grid;
  width: 100%;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px 24px;
}

.finance-obligation-fact dt {
  color: #72809b;
  font-size: 0.61rem;
  font-weight: 720;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.finance-obligation-fact dd {
  margin: 5px 0 0;
  color: #1f2e50;
  font-size: 0.77rem;
  font-weight: 690;
  line-height: 1.45;
  font-variant-numeric: tabular-nums;
}

.finance-obligation-qr {
  display: grid;
  width: 176px;
  min-width: 176px;
  margin: 0;
  place-items: center;
  gap: 5px;
}

.finance-obligation-qr img {
  display: block;
  width: 164px;
  height: 164px;
}

.finance-obligation-qr figcaption {
  color: #68758f;
  font-size: 0.6rem;
  font-weight: 680;
}

.finance-obligation-qr__invalid {
  margin: auto 0;
  color: #9a321f;
  font-size: 0.68rem;
  font-weight: 680;
  line-height: 1.45;
  text-align: center;
}

.finance-obligation-table-region {
  overflow: auto;
  border-top: 1px solid #dfe5ef;
}

.finance-obligation-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  font-size: 0.7rem;
}

.finance-obligation-table th {
  padding: 11px 12px;
  color: #62708e;
  background: #f7f9fc;
  font-size: 0.59rem;
  font-weight: 760;
  letter-spacing: 0.025em;
  text-align: left;
  text-transform: uppercase;
}

.finance-obligation-table td {
  padding: 13px 12px;
  border-bottom: 1px solid #e5eaf2;
  color: #253455;
  font-weight: 620;
  vertical-align: middle;
}

.finance-obligation-table__number {
  text-align: right !important;
  font-variant-numeric: tabular-nums;
}

.finance-obligation-status {
  display: inline-flex;
  min-height: 25px;
  padding: 4px 10px;
  border-radius: 999px;
  align-items: center;
  color: #fff;
  background: var(--finance-obligation-status-color, #73809a);
  font-size: 0.62rem;
  font-weight: 750;
  white-space: nowrap;
}

.finance-obligation-print-host:empty {
  display: none;
}

.finance-obligation-print {
  display: none;
  color: #17233f;
  background: #fff;
}

.finance-obligation-print__header {
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 16px;
  border-bottom: 2px solid #112262;
}

.finance-obligation-print__logo {
  width: 190px;
  height: auto;
}

.finance-obligation-print__header h1 {
  margin: 0;
  color: #112262;
  font-size: 1.15rem;
}

.finance-obligation-print__header p {
  margin: 5px 0 0;
  color: #69758c;
  font-size: 0.72rem;
}

.finance-obligation-print__header .finance-obligation-qr {
  width: 150px;
  min-width: 150px;
}

.finance-obligation-print__header .finance-obligation-qr img {
  width: 144px;
  height: 144px;
}

.finance-obligation-print__table {
  min-width: 0;
  margin-top: 18px;
}

.finance-collection-page {
  min-width: 0;
  padding: clamp(18px, 2.3vw, 30px);
  color: #17233f;
  background: #fff;
}

.finance-collection-heading,
.finance-collection-heading__actions,
.finance-collection-pagination {
  display: flex;
  align-items: center;
}

.finance-collection-heading {
  justify-content: space-between;
  gap: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid #dfe5ef;
}

.finance-collection-heading__copy {
  min-width: 0;
}

.finance-collection-back {
  display: inline-flex;
  margin-bottom: 7px;
  color: #566582;
  font-size: 0.76rem;
  font-weight: 720;
  text-decoration: none;
}

.finance-collection-back:hover,
.finance-collection-back:focus-visible {
  color: var(--brand-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.finance-collection-heading h1 {
  margin: 0;
  color: var(--brand-dark);
  font-size: clamp(1.35rem, 2.2vw, 1.85rem);
  line-height: 1.12;
  letter-spacing: -0.035em;
}

.finance-collection-heading__actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.finance-collection-action--print {
  min-width: 154px;
  background: var(--brand-dark);
  box-shadow: 0 8px 18px rgb(17 34 98 / 18%);
}

.finance-collection-feedback {
  min-height: 20px;
  margin: 12px 0 0;
}

.finance-collection-facts {
  display: grid;
  margin: 0;
  padding: 19px 0 17px;
  border-bottom: 1px solid #e5eaf2;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px 24px;
}

.finance-collection-fact {
  min-width: 0;
}

.finance-collection-fact dt {
  margin: 0 0 5px;
  color: #6b7891;
  font-size: 0.68rem;
  font-weight: 720;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.finance-collection-fact dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: #17233f;
  font-size: 0.84rem;
  font-weight: 680;
}

.finance-collection-summary {
  display: flex;
  margin: 0;
  padding: 14px 0;
  border-bottom: 2px solid var(--brand-dark);
  align-items: center;
  gap: clamp(22px, 4vw, 54px);
}

.finance-collection-summary .finance-collection-fact:first-child {
  margin-right: auto;
}

.finance-collection-integrity-host:empty {
  display: none;
}

.finance-collection-integrity {
  margin: 12px 0 0;
  padding: 9px 12px;
  border-inline-start: 3px solid #b42318;
  color: #8c1c13;
  background: #fff6f5;
  font-size: 0.78rem;
  font-weight: 680;
}

.finance-collection-results {
  min-width: 0;
  margin-top: 12px;
}

.finance-collection-table-region {
  width: 100%;
  overflow: auto;
}

.finance-collection-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  table-layout: auto;
  font-size: 0.76rem;
}

.finance-collection-table th,
.finance-collection-table td {
  padding: 10px 9px;
  border-bottom: 1px solid #e4e9f1;
  text-align: left;
  vertical-align: middle;
}

.finance-collection-table thead th {
  position: sticky;
  z-index: 1;
  top: 0;
  color: #53617c;
  background: #fff;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.025em;
  white-space: nowrap;
}

.finance-collection-table tbody tr:hover td,
.finance-collection-table tbody tr:focus td {
  background: #f8faff;
}

.finance-collection-table__package-link {
  color: var(--brand-dark);
  font-weight: 780;
  text-decoration: none;
}

.finance-collection-table__package-link:hover,
.finance-collection-table__package-link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.finance-collection-table__number {
  text-align: right !important;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.finance-collection-status {
  display: inline-flex;
  min-height: 25px;
  padding: 4px 9px;
  color: #fff;
  background: var(--finance-collection-status-color, #65728b);
  align-items: center;
  font-size: 0.68rem;
  font-weight: 760;
  line-height: 1;
  white-space: nowrap;
}

.finance-collection-pagination {
  justify-content: flex-end;
  margin-top: 14px;
  gap: 10px;
}

.finance-collection-pagination[hidden] {
  display: none;
}

.finance-collection-pagination > span {
  color: #65728b;
  font-size: 0.75rem;
  font-weight: 680;
}

.finance-collection-page-size {
  display: inline-flex;
  color: #65728b;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  font-weight: 680;
}

.finance-collection-page-size select {
  min-height: 34px;
  padding: 5px 24px 5px 8px;
  border: 1px solid #cbd3e1;
  border-radius: 0;
  background: #fff;
  color: #26365e;
  font: inherit;
}

.finance-collection-print-host {
  display: none;
}

.finance-collection-print {
  page: finance-collection;
  color: #17233f;
  background: #fff;
}

.finance-collection-print__header {
  display: flex;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--brand-dark);
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.finance-collection-print__identity {
  display: grid;
  gap: 3px;
}

.finance-collection-print__logo {
  display: block;
  width: 164px;
  height: auto;
  margin-bottom: 7px;
}

.finance-collection-print__qr {
  display: block;
  width: 104px;
  height: 104px;
  flex: 0 0 auto;
  image-rendering: crisp-edges;
}

.finance-collection-print__identity h1 {
  margin: 0;
  color: var(--brand-dark);
  font-size: 1rem;
  font-weight: 820;
}

.finance-collection-print__identity strong {
  font-size: 0.72rem;
}

.finance-collection-print__meta,
.finance-collection-print__facts {
  display: grid;
  margin: 0;
  gap: 7px 18px;
}

.finance-collection-print__meta {
  min-width: 210px;
}

.finance-collection-print__facts {
  padding: 9px 0;
  border-bottom: 1px solid #dce2ec;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.finance-collection-print dt {
  color: #68738d;
  font-size: 0.54rem;
  font-weight: 700;
}

.finance-collection-print dd {
  margin: 2px 0 0;
  font-size: 0.64rem;
  font-weight: 690;
}

.finance-collection-print__table-region {
  width: 100%;
  overflow: visible;
}

.finance-collection-print__table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
  font-size: 0.52rem;
}

.finance-collection-print__table th,
.finance-collection-print__table td {
  padding: 4px 3px;
  border-bottom: 1px solid #dfe4ec;
  text-align: left;
  vertical-align: middle;
}

.finance-collection-print__table th {
  color: #4f5e7a;
  font-size: 0.5rem;
  font-weight: 780;
}

.finance-collection-print__totals {
  display: grid;
  width: min(100%, 410px);
  margin: 9px 0 0 auto;
  gap: 3px;
}

.finance-collection-print__totals > div {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 14px;
}

.finance-collection-print__totals dt,
.finance-collection-print__totals dd {
  margin: 0;
  font-size: 0.62rem;
  font-variant-numeric: tabular-nums;
  font-weight: 720;
}

.finance-invoice-page {
  display: grid;
  min-width: 0;
  gap: 12px;
  background: #fff;
  color: #26365e;
}

.finance-invoice-heading,
.finance-invoice-heading__actions,
.finance-invoice-heading__status,
.finance-invoice-pagination,
.finance-invoice-confirmation,
.finance-invoice-confirmation__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.finance-invoice-heading {
  min-height: 52px;
  justify-content: space-between;
  gap: 18px;
}

.finance-invoice-heading__copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.finance-invoice-back {
  width: fit-content;
  color: #65718a;
  font-size: 0.65rem;
  font-weight: 680;
  text-decoration: none;
}

.finance-invoice-back:hover,
.finance-invoice-back:focus-visible {
  color: var(--brand-dark);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.finance-invoice-heading h1 {
  margin: 0;
  color: #1d2d5b;
  font-size: clamp(1.04rem, 1.5vw, 1.24rem);
  font-weight: 780;
}

.finance-invoice-heading__status {
  margin-top: 2px;
}

.finance-invoice-heading__actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.finance-invoice-heading__actions > button {
  min-height: 38px;
}

.finance-invoice-action--print {
  min-width: 138px;
  background: var(--brand-dark);
  color: #fff;
}

.app-shell .finance-invoice-action--settle,
.app-shell .finance-invoice-action--confirm {
  width: auto;
  min-width: 118px;
  padding-inline: 14px;
  border-color: #e4b800;
  background: var(--brand-yellow);
  color: var(--brand-dark);
}

.app-shell .finance-invoice-action--settle:hover:not(:disabled),
.app-shell .finance-invoice-action--confirm:hover:not(:disabled) {
  border-color: #d5ab00;
  background: #e4b800;
  color: var(--brand-dark);
}

.finance-invoice-status {
  display: inline-flex;
  min-height: 24px;
  padding: 3px 9px;
  border: 1px solid var(--finance-invoice-status-color, #65728b);
  border-radius: 5px;
  align-items: center;
  background: var(--finance-invoice-status-color, #65728b);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 16%);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 760;
  white-space: nowrap;
}

.finance-invoice-confirmation {
  display: grid;
  width: min(100%, 540px);
  padding: 20px;
  border-inline-start: 3px solid var(--brand-yellow);
  gap: 16px;
  background: #fffaf0;
}

.finance-invoice-confirmation[hidden] {
  display: none;
}

.finance-invoice-confirmation h2 {
  margin: 0;
  color: #26365e;
  font-size: 0.74rem;
  font-weight: 780;
}

.finance-invoice-confirmation__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.finance-invoice-confirmation p {
  margin: 3px 0 0;
  color: #646e82;
  font-size: 0.66rem;
}

.finance-invoice-confirmation__actions {
  flex: 0 0 auto;
}

.finance-invoice-facts {
  display: grid;
  margin: 0;
  padding: 11px 0;
  border-block: 1px solid #e1e6ef;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px 20px;
}

.finance-invoice-fact {
  min-width: 0;
}

.finance-invoice-fact dt {
  overflow: hidden;
  color: #6e7890;
  font-size: 0.59rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-invoice-fact dd {
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  color: #24345c;
  font-size: 0.72rem;
  font-weight: 690;
}

.finance-invoice-integrity-host:empty {
  display: none;
}

.finance-invoice-integrity {
  margin: 0;
  padding: 9px 11px;
  border-inline-start: 3px solid #d99b22;
  background: #fffaf0;
  color: #704f12;
  font-size: 0.66rem;
  font-weight: 680;
}

.finance-invoice-results {
  min-width: 0;
  overflow: hidden;
  border-block: 1px solid #e1e6ef;
}

.finance-invoice-table-region {
  width: 100%;
  overflow: auto;
  overscroll-behavior-inline: contain;
}

.finance-invoice-table {
  width: 100%;
  min-width: 1120px;
  border-collapse: separate;
  border-spacing: 0;
  color: #2a385e;
  font-size: 0.66rem;
}

.finance-invoice-table th,
.finance-invoice-table td {
  height: 36px;
  padding: 6px 8px;
  border-bottom: 1px solid #e8ebf2;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.finance-invoice-table thead th {
  position: sticky;
  z-index: 2;
  top: 0;
  background: #f8f9fc;
  color: #52607d;
  font-size: 0.59rem;
  font-weight: 760;
}

.finance-invoice-table tbody tr:hover td,
.finance-invoice-table tbody tr:focus td {
  background: #f6f8fc;
}

.finance-invoice-table__package-link {
  color: var(--brand-dark);
  font-weight: 770;
  text-decoration: none;
}

.finance-invoice-table__package-link:hover,
.finance-invoice-table__package-link:focus-visible {
  color: #0a56a8;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.finance-invoice-table__number {
  font-variant-numeric: tabular-nums;
  text-align: right !important;
}

.finance-invoice-table tfoot th {
  background: #fbfcfe;
  color: #20315d;
  font-size: 1.125rem;
  font-weight: 800;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
}

.finance-invoice-table__remaining th {
  border-bottom: 0;
  background: #f5f7fb;
}

.finance-invoice-pagination {
  justify-content: flex-end;
}

.finance-invoice-pagination[hidden] {
  display: none;
}

.finance-invoice-pagination > span {
  color: #69748b;
  font-size: 0.65rem;
  font-weight: 680;
}

.finance-invoice-page-size {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #68738d;
  font-size: 0.63rem;
  font-weight: 690;
}

.finance-invoice-page-size select {
  min-height: 34px;
  padding: 5px 24px 5px 8px;
  border: 1px solid #cbd3e1;
  border-radius: 5px;
  background: #fff;
  color: #26365e;
  font: inherit;
}

.finance-invoice-print-host {
  display: none;
}

.finance-invoice-print {
  page: finance-invoice;
  color: #17233f;
  background: #fff;
}

.finance-invoice-print__header {
  display: flex;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--brand-dark);
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.finance-invoice-print__identity {
  display: grid;
  gap: 3px;
}

.finance-invoice-print__logo {
  display: block;
  width: 164px;
  height: auto;
  margin-bottom: 7px;
}

.finance-invoice-print__identity h1 {
  margin: 0;
  color: var(--brand-dark);
  font-size: 1rem;
  font-weight: 820;
}

.finance-invoice-print__identity strong {
  font-size: 0.78rem;
}

.finance-invoice-print__identity span {
  color: #5f6b84;
  font-size: 0.64rem;
}

.finance-invoice-print__qr {
  display: grid;
  width: 132px;
  margin: 0;
  gap: 2px;
  place-items: center;
}

.finance-invoice-print__qr img {
  display: block;
  width: 132px;
  height: 132px;
}

.finance-invoice-print__qr figcaption {
  font-size: 0.58rem;
  font-weight: 760;
}

.finance-invoice-print__facts {
  display: grid;
  margin: 0;
  padding: 9px 0;
  border-bottom: 1px solid #dce2ec;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px 16px;
}

.finance-invoice-print__facts dt {
  color: #68738d;
  font-size: 0.54rem;
  font-weight: 700;
}

.finance-invoice-print__facts dd {
  margin: 2px 0 0;
  font-size: 0.64rem;
  font-weight: 690;
}

.finance-invoice-print__fact--business dd {
  color: var(--brand-dark);
  font-size: 0.88rem;
  font-weight: 820;
}

.finance-invoice-print__table-region {
  width: 100%;
  overflow: visible;
}

.finance-invoice-print__table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
  font-size: 0.52rem;
}

.finance-invoice-print__table th,
.finance-invoice-print__table td {
  padding: 4px 3px;
  border-bottom: 1px solid #dfe4ec;
  text-align: left;
  vertical-align: middle;
}

.finance-invoice-print__table th {
  color: #4f5e7a;
  font-size: 0.5rem;
  font-weight: 780;
}

.finance-invoice-print__summary th {
  color: #17233f;
  background: #f8f9fc;
  font-size: 10pt;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.finance-invoice-print__summary tr:first-child th {
  border-top: 1.5px solid #cbd3e1;
}

.finance-invoice-print__remaining-row th {
  border-bottom: 1.5px solid #cbd3e1;
}

.finance-invoice-print__continuation {
  margin: 8px 0 0;
  color: #5f6b84;
  font-size: 0.58rem;
  text-align: right;
}

@media (max-width: 760px) {
  .finance-heading,
  .obligation-command {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .finance-heading {
    flex-direction: column;
  }

  .finance-collection-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-collection-heading__actions,
  .finance-collection-heading__actions > * {
    width: 100%;
  }

  .finance-collection-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-collection-summary {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .finance-collection-summary .finance-collection-fact:first-child {
    margin-right: 0;
  }

  .finance-collection-pagination {
    flex-wrap: wrap;
    justify-content: stretch;
  }

  .finance-heading__actions,
  .finance-heading__actions > * {
    width: 100%;
  }

  .finance-heading__actions > .icon-only-button {
    width: 38px;
  }

  .cash-entry-form__fields,
  .collection-create-form__top,
  .collection-command-fields,
  .invoice-create-fields,
  .obligation-form,
  .cash-entry-item {
    grid-template-columns: 1fr;
  }

  .collection-package-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .invoice-package-toolbar,
  .invoice-create-confirmation {
    align-items: stretch;
    flex-direction: column;
  }

  .invoice-package-toolbar__filters,
  .invoice-tracking-search,
  .invoice-package-toolbar__filters > *,
  .invoice-create-actions,
  .invoice-create-actions > * {
    width: 100%;
  }

  .invoice-create-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .collection-package-toolbar__actions {
    width: 100%;
    justify-content: space-between;
  }

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

  .finance-settlement-receipt__header {
    align-items: center;
  }

  .finance-settlement-receipt__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finance-invoice-heading,
  .finance-invoice-confirmation {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-invoice-heading__actions,
  .finance-invoice-heading__actions > *,
  .finance-invoice-confirmation__actions,
  .finance-invoice-confirmation__actions > * {
    width: 100%;
  }

  .finance-invoice-heading__actions > .icon-only-button {
    width: 38px;
  }

  .finance-invoice-facts {
    grid-template-columns: 1fr;
  }

  .finance-invoice-pagination {
    justify-content: space-between;
  }
}

.client-page {
  display: grid;
  min-width: 0;
  gap: 16px;
  color: #17233f;
}

.client-heading,
.client-heading__actions,
.client-editor__header,
.client-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.client-heading h1,
.client-editor h2 {
  margin: 0;
  color: #112262;
  letter-spacing: -0.025em;
}

.client-heading h1 {
  font-size: clamp(1.25rem, 2vw, 1.7rem);
}

.client-panel {
  background: #fff;
  border: 1px solid #e4e9f2;
  box-shadow: 0 8px 28px rgb(17 34 98 / 7%);
}

.client-editor[hidden] {
  display: none;
}

.client-editor {
  padding: clamp(14px, 3vw, 34px);
}

.client-editor__surface {
  width: min(100%, 760px);
  padding: 18px;
  border-top: 3px solid #ffcc05;
}

.client-editor h2 {
  font-size: 1rem;
}

.client-editor__close,
.client-row-action {
  border: 0;
  background: transparent;
  color: #112262;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.client-editor__close {
  padding: 8px 0 8px 12px;
}

.client-editor__form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 16px;
  margin-top: 16px;
}

.client-field {
  display: grid;
  gap: 6px;
  color: #526078;
  font-size: 0.72rem;
  font-weight: 700;
}

.client-field input,
.client-field select,
.client-field textarea,
.client-filters input {
  width: 100%;
  min-height: 40px;
  border: 1px solid #d8dfeb;
  border-radius: 5px;
  background: #fff;
  color: #17233f;
  font: inherit;
  font-size: 0.82rem;
  padding: 8px 10px;
}

.client-field textarea {
  resize: vertical;
}

.client-field input:focus,
.client-field select:focus,
.client-field textarea:focus,
.client-filters input:focus {
  border-color: #112262;
  box-shadow: 0 0 0 3px rgb(17 34 98 / 10%);
  outline: 0;
}

.client-field--check {
  display: flex;
  align-items: center;
  align-self: center;
  gap: 8px;
  min-height: 40px;
}

.client-field--check input {
  width: 16px;
  min-height: 16px;
  accent-color: #112262;
}

.client-editor__feedback {
  align-self: center;
  margin: 0;
  color: #526078;
  font-size: 0.76rem;
}

.client-editor__feedback--error,
.client-feedback--error {
  color: #a02727;
}

.client-editor__save {
  justify-self: end;
  min-width: 150px;
}

.client-panel {
  overflow: hidden;
}

.client-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(145px, 0.4fr)) auto;
  gap: 10px;
  padding: 14px;
  border-bottom: 1px solid #e4e9f2;
}

.client-filters__submit {
  width: auto;
  min-width: 108px;
  min-height: 40px;
  padding-inline: 14px;
  justify-self: end;
}

.client-feedback {
  min-height: 20px;
  padding: 0 14px;
  font-size: 0.75rem;
  line-height: 20px;
}

.client-table-region {
  overflow: auto;
}

.client-table {
  width: 100%;
  min-width: 840px;
  border-collapse: collapse;
  font-size: 0.76rem;
}

.client-table th,
.client-table td {
  padding: 11px 12px;
  border-bottom: 1px solid #edf0f5;
  text-align: left;
  vertical-align: middle;
}

.client-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8faff;
  color: #526078;
  font-size: 0.66rem;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.client-table tbody tr:hover td,
.client-table tbody tr:focus td {
  background: #f7f9fd;
}

.client-action-cell {
  width: 74px;
  text-align: center !important;
}

.client-row-action {
  padding: 6px;
  font-size: 0.7rem;
}

.client-row-action--danger {
  color: #a02727;
}

.client-empty {
  margin: 0;
  padding: 28px 14px;
  color: #6a768d;
  text-align: center;
}

.client-pagination {
  justify-content: flex-end;
  padding: 12px 14px;
}

@media (max-width: 760px) {
  .client-heading,
  .client-heading__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .client-heading__actions > *,
  .client-editor__save {
    width: 100%;
  }

  .client-editor__form,
  .client-filters {
    grid-template-columns: 1fr;
  }

  .client-filters__submit {
    width: auto;
  }
}

.business-page {
  display: grid;
  min-width: 0;
  gap: 14px;
  color: #17233f;
}

.business-heading,
.business-editor__header,
.business-form__footer,
.business-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.business-heading__eyebrow {
  margin: 0 0 3px;
  color: #66738a;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.business-heading h1,
.business-editor h2,
.business-form h3 {
  margin: 0;
  color: #112262;
  letter-spacing: -0.025em;
}

.business-heading h1 {
  font-size: clamp(1.25rem, 2vw, 1.7rem);
}

.business-panel {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e4e9f2;
  box-shadow: 0 8px 28px rgb(17 34 98 / 7%);
}

.business-editor[hidden],
.business-form[hidden],
.business-editor__lifecycle[hidden],
.business-field--pickup-zone[hidden],
.business-pickup-zone__use[hidden] {
  display: none;
}

.business-editor {
  padding: clamp(14px, 3vw, 34px);
}

.business-editor__surface {
  width: min(100%, 1020px);
  border-top: 3px solid #ffcc05;
}

.business-editor__form {
  display: grid;
}

.business-editor__create-footer {
  position: sticky;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 15px 18px;
  border-top: 1px solid #edf0f5;
  background: #fff;
}

.business-editor__create-footer[hidden] {
  display: none;
}

.business-editor__create-footer .business-form__feedback {
  margin-right: auto;
}

.business-editor__header {
  padding: 15px 18px;
  border-bottom: 1px solid #edf0f5;
}

.business-editor h2,
.business-form h3 {
  font-size: 0.95rem;
}

.business-editor__close,
.business-row-action,
.business-status-button {
  border: 0;
  background: transparent;
  color: #112262;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 750;
  cursor: pointer;
}

.business-editor__close {
  padding: 7px 0 7px 12px;
}

.business-form {
  display: grid;
  gap: 14px;
  padding: 17px 18px;
}

.business-form + .business-form {
  border-top: 1px solid #edf0f5;
}

.business-form__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px 14px;
}

.business-form__grid--tariffs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.business-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px 14px;
  padding-top: 13px;
  border-top: 1px solid #edf0f5;
}

.business-field {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: #526078;
  font-size: 0.7rem;
  font-weight: 700;
}

.business-field input,
.business-field select,
.business-filters > input,
.business-filters > select {
  width: 100%;
  min-height: 39px;
  border: 1px solid #d8dfeb;
  border-radius: 5px;
  background: #fff;
  color: #17233f;
  font: inherit;
  font-size: 0.8rem;
  padding: 7px 10px;
}

.business-field input:focus,
.business-field select:focus,
.business-filters > input:focus,
.business-filters > select:focus {
  border-color: #112262;
  box-shadow: 0 0 0 3px rgb(17 34 98 / 10%);
  outline: 0;
}

.business-field input[aria-invalid="true"],
.business-field select[aria-invalid="true"] {
  border-color: #c23b3b;
  box-shadow: 0 0 0 3px rgb(194 59 59 / 12%);
}

.business-field--pickup-zone {
  align-content: start;
  grid-column: 1 / -1;
  width: 100%;
}

.business-field--location-map {
  grid-column: 1 / -1;
}

.business-pickup-zone__suggestion {
  display: flex;
  min-height: 24px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.business-pickup-zone__state {
  color: #5d6472;
  font-size: 0.65rem;
  font-weight: 650;
  line-height: 1.35;
}

.business-pickup-zone__use {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid #112262;
  border-radius: 5px;
  background: #112262;
  color: #fff;
  font: inherit;
  font-size: 0.65rem;
  font-weight: 800;
  cursor: pointer;
}

.business-pickup-zone__use:focus-visible {
  outline: 3px solid rgb(255 204 5 / 45%);
  outline-offset: 2px;
}

.business-field--check {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 39px;
}

.business-field--check > span {
  order: 2;
}

.business-field--check input {
  width: 16px;
  min-height: 16px;
  padding: 0;
  accent-color: #112262;
}

.business-form__feedback,
.business-feedback {
  margin: 0;
  min-height: 18px;
  color: #66738a;
  font-size: 0.72rem;
}

.business-form__feedback--error,
.business-feedback--error {
  color: #a02727;
}

.business-form__save {
  min-width: 150px;
}

.business-editor__lifecycle {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 0 18px 17px;
}

.business-editor__lifecycle .business-form__feedback {
  margin-right: auto;
}

.business-status-button,
.business-row-status {
  color: #a02727;
}

.business-status {
  display: inline-flex;
  min-height: 25px;
  padding: 4px 10px;
  border-radius: 999px;
  align-items: center;
  background: #147347;
  color: #fff;
  font-size: 0.66rem;
  font-weight: 760;
}

.business-status--inactive {
  background: #a92319;
}

.business-status-button--activate,
.business-row-status--activate {
  color: #16704b;
}

.business-filters {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) repeat(2, minmax(140px, 0.45fr)) minmax(120px, 0.36fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 14px;
  border-bottom: 1px solid #e4e9f2;
}

.business-filters .business-field--check {
  white-space: nowrap;
}

.business-feedback {
  padding: 4px 14px;
  line-height: 18px;
}

.business-table-region {
  overflow: auto;
}

.business-table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-size: 0.76rem;
}

.business-table th,
.business-table td {
  padding: 11px 13px;
  border-bottom: 1px solid #edf0f5;
  text-align: left;
  vertical-align: middle;
}

.business-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8faff;
  color: #526078;
  font-size: 0.66rem;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.business-table tbody tr:hover td,
.business-table tbody tr:focus td {
  background: #f7f9fd;
}

.business-action-cell {
  width: 118px;
  text-align: center !important;
}

.business-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.business-row-action {
  padding: 6px;
}

.business-empty {
  margin: 0;
  padding: 30px 14px;
  color: #66738a;
  text-align: center;
}

.business-pagination {
  justify-content: flex-end;
  padding: 12px 14px;
}

@media (max-width: 1020px) {
  .business-form__grid,
  .business-form__grid--tariffs,
  .business-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

@media (max-width: 660px) {
  .business-heading,
  .business-form__footer,
  .business-editor__create-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .business-form__grid,
  .business-form__grid--tariffs,
  .business-options,
  .business-filters {
    grid-template-columns: 1fr;
  }

  .business-heading > *,
  .business-form__save {
    width: 100%;
  }
}

.exchange-rate-page {
  width: min(100%, 760px);
}

.exchange-rate-heading {
  margin-bottom: 18px;
}

.exchange-rate-content {
  min-height: 148px;
}

.exchange-rate-form {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto;
  gap: 24px;
  align-items: end;
  padding: 26px 28px;
  border: 0;
  border-left: 3px solid var(--brand-blue, #112262);
  border-radius: 0 10px 10px 0;
  background: #fff;
  box-shadow: 0 12px 32px rgba(17, 34, 98, 0.08);
}

.exchange-rate-field {
  display: grid;
  gap: 8px;
  color: #26324a;
  font-size: 0.82rem;
  font-weight: 700;
}

.exchange-rate-input {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid #d9e1ec;
  border-radius: 8px;
  background: #fff;
  color: #112262;
  font: inherit;
  font-size: 1rem;
  font-weight: 650;
  outline: none;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.exchange-rate-input:focus {
  border-color: #112262;
  box-shadow: 0 0 0 3px rgba(17, 34, 98, 0.1);
}

.exchange-rate-input[aria-invalid="true"] {
  border-color: #b42318;
}

.exchange-rate-actions {
  display: flex;
  justify-content: flex-end;
}

.exchange-rate-submit {
  min-width: 156px;
  min-height: 48px;
}

.exchange-rate-feedback {
  min-height: 20px;
  margin: 0 0 10px;
  color: #49617f;
  font-size: 0.86rem;
}

.exchange-rate-feedback--error,
.exchange-rate-page .field-error {
  color: #b42318;
}

@media (max-width: 640px) {
  .exchange-rate-form {
    grid-template-columns: 1fr;
    padding: 22px 20px;
  }

  .exchange-rate-submit {
    width: 100%;
  }
}

.system-setting-page {
  width: min(100%, 840px);
}

.system-setting-heading {
  margin-bottom: 18px;
}

.system-setting-feedback {
  min-height: 20px;
  margin: 0 0 10px;
  color: #49617f;
  font-size: 0.86rem;
}

.system-setting-feedback--error,
.system-setting-page .field-error {
  color: #b42318;
}

.system-setting-form {
  display: grid;
  gap: 20px;
  padding: 26px 28px;
  border: 0;
  border-left: 3px solid var(--brand-blue, #112262);
  border-radius: 0 10px 10px 0;
  background: #fff;
  box-shadow: 0 12px 32px rgba(17, 34, 98, 0.08);
}

.system-setting-field {
  display: grid;
  gap: 8px;
  color: #26324a;
  font-size: 0.82rem;
  font-weight: 700;
}

.system-setting-input,
.system-setting-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #d9e1ec;
  border-radius: 8px;
  background: #fff;
  color: #16233d;
  font: inherit;
  font-size: 0.94rem;
  font-weight: 500;
  outline: none;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.system-setting-input {
  min-height: 48px;
}

.system-setting-textarea {
  min-height: 164px;
  resize: vertical;
  line-height: 1.55;
}

.system-setting-input:focus,
.system-setting-textarea:focus {
  border-color: #112262;
  box-shadow: 0 0 0 3px rgba(17, 34, 98, 0.1);
}

.system-setting-input[aria-invalid="true"],
.system-setting-textarea[aria-invalid="true"] {
  border-color: #b42318;
}

.system-setting-check-row {
  display: grid;
  gap: 6px;
}

.system-setting-check {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  width: fit-content;
  color: #26324a;
  font-size: 0.9rem;
  font-weight: 650;
  cursor: pointer;
}

.system-setting-check input {
  width: 18px;
  height: 18px;
  accent-color: #112262;
}

.system-setting-actions {
  display: flex;
  justify-content: flex-end;
}

.system-setting-submit {
  min-width: 156px;
  min-height: 48px;
}

@media (max-width: 640px) {
  .system-setting-form {
    padding: 22px 20px;
  }

  .system-setting-submit {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media (max-width: 760px) {
  .finance-obligation-detail-heading,
  .finance-obligation-detail-overview {
    align-items: stretch;
    flex-direction: column;
  }

  .finance-obligation-detail-heading__actions,
  .finance-obligation-detail-heading__actions > * {
    width: 100%;
  }

  .finance-obligation-facts {
    grid-template-columns: 1fr 1fr;
  }

  .finance-obligation-qr {
    width: 100%;
  }
}

/* Print portals are inert outside print media, including webviews that omit
   `afterprint`.  This also prevents a transient duplicate receipt on screen. */
body > .document-print-root {
  display: none;
}

.print-orientation-control {
  display: inline-flex;
  min-height: 38px;
  padding: 4px 5px 4px 11px;
  border: 1px solid #cbd3e1;
  border-radius: 8px;
  background: #fff;
  color: #4f5e7a;
  align-items: center;
  gap: 7px;
  font-size: 0.72rem;
  font-weight: 720;
  white-space: nowrap;
}

.print-orientation-control[hidden] {
  display: none;
}

.print-orientation-control select {
  min-height: 28px;
  padding: 3px 26px 3px 8px;
  border: 0;
  border-left: 1px solid #dfe4ec;
  border-radius: 0 5px 5px 0;
  background-color: #fff;
  color: #17233f;
  font: inherit;
}

.print-orientation-control select:focus-visible {
  outline: 2px solid var(--brand-orange);
  outline-offset: 1px;
}

/*
 * Browser-generated date/title/URL/page-number fields live in the page margin
 * boxes, outside our document markup.  A zero page margin suppresses those
 * boxes in Chromium/WebView; printable whitespace is owned by the isolated
 * document portal below so the actual receipt still has an 8 mm safe area.
 */
@page {
  margin: 0;
}

@media print {
  body[data-document-printing="true"] > :not(.document-print-root) {
    display: none !important;
  }

  body[data-document-printing="true"] {
    display: block !important;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #fff;
  }

  .document-print-root {
    display: block !important;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 8mm;
    background: #fff;
  }

  .document-print-root > * {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-shadow: none !important;
  }

  .document-print-root .pos-receipt__toolbar,
  .document-print-root .pos-proof {
    display: none !important;
  }

  .document-print-root .pos-receipt__print-logo {
    display: block;
  }

  .document-print-root .pos-receipt__table-region {
    overflow: visible;
  }

  .document-print-root .pos-receipt__table {
    min-width: 0;
  }

  .document-print-root .table-row--clickable > td {
    background: #fff;
  }

  @page express24-document {
    size: A4 portrait;
    margin: 0;
  }

  @page pickup-distribution {
    size: A4 landscape;
    margin: 0;
  }

  @page finance-invoice {
    size: A4 landscape;
    margin: 0;
  }

  @page finance-collection {
    size: A4 landscape;
    margin: 0;
  }

  @page express24-document-portrait {
    size: A4 portrait;
    margin: 0;
  }

  @page express24-document-landscape {
    size: A4 landscape;
    margin: 0;
  }

  .document-print-root[data-print-orientation="portrait"] > *,
  .document-print-root[data-print-orientation="portrait"] .finance-invoice-print,
  .document-print-root[data-print-orientation="portrait"] .finance-collection-print,
  .document-print-root[data-print-orientation="portrait"] .finance-obligation-print,
  .document-print-root[data-print-orientation="portrait"] .finance-settlement-receipt,
  .document-print-root[data-print-orientation="portrait"] .package-commission-settlements__receipt-document,
  .document-print-root[data-print-orientation="portrait"] .agency-closures-detail__document {
    page: express24-document-portrait;
  }

  .document-print-root[data-print-orientation="landscape"] > *,
  .document-print-root[data-print-orientation="landscape"] .finance-invoice-print,
  .document-print-root[data-print-orientation="landscape"] .finance-collection-print,
  .document-print-root[data-print-orientation="landscape"] .finance-obligation-print,
  .document-print-root[data-print-orientation="landscape"] .finance-settlement-receipt,
  .document-print-root[data-print-orientation="landscape"] .package-commission-settlements__receipt-document,
  .document-print-root[data-print-orientation="landscape"] .agency-closures-detail__document {
    page: express24-document-landscape;
  }

  .document-print-root .pos-receipt__document,
  .document-print-root .finance-obligation-print,
  .document-print-root .finance-settlement-receipt {
    page: express24-document;
  }

  .document-print-root .pickup-distribution-print {
    page: pickup-distribution;
  }

  .sidebar,
  .topbar,
  .sidebar-overlay,
  .skip-link,
  .notification-center {
    display: none !important;
  }

  .app-shell {
    display: block;
  }

  .workspace-main {
    width: 100%;
    padding: 0;
  }

  .metric-card,
  .panel-card,
  .admin-metrics,
  .admin-active-users,
  .admin-agencies {
    box-shadow: none;
  }

  .pos-page[data-printing="true"] > :not(.pos-receipt-host),
  .pos-page[data-printing="true"] .pos-receipt__toolbar,
  .pos-page[data-printing="true"] .pos-proof {
    display: none !important;
  }

  .pos-page[data-printing="true"],
  .pos-page[data-printing="true"] .pos-receipt-host,
  .pos-page[data-printing="true"] .pos-receipt {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }

  .pos-page[data-printing="true"] .pos-receipt__print-logo {
    display: block;
  }

  .pos-page[data-printing="true"] .pos-receipt__table-region {
    overflow: visible;
  }

  .pos-page[data-printing="true"] .pos-receipt__table {
    min-width: 0;
  }

  .pos-page[data-printing="true"] .table-row--clickable > td {
    background: #fff;
  }

  .finance-invoice-page[data-invoice-printing="true"] > :not(.finance-invoice-print-host) {
    display: none !important;
  }

  .finance-invoice-page[data-invoice-printing="true"],
  .finance-invoice-page[data-invoice-printing="true"] .finance-invoice-print-host,
  .finance-invoice-page[data-invoice-printing="true"] .finance-invoice-print {
    display: block !important;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }

  .finance-invoice-page[data-invoice-printing="true"] .finance-invoice-status {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .finance-collection-page[data-collection-printing="true"] > :not(.finance-collection-print-host) {
    display: none !important;
  }

  .finance-collection-page[data-collection-printing="true"],
  .finance-collection-page[data-collection-printing="true"] .finance-collection-print-host,
  .finance-collection-page[data-collection-printing="true"] .finance-collection-print {
    display: block !important;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }

  .finance-collection-page[data-collection-printing="true"] .finance-collection-status {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .finance-obligation-detail-page[data-obligation-printing="true"] > :not(.finance-obligation-print-host) {
    display: none !important;
  }

  .finance-obligation-detail-page[data-obligation-printing="true"],
  .finance-obligation-detail-page[data-obligation-printing="true"] .finance-obligation-print-host,
  .finance-obligation-detail-page[data-obligation-printing="true"] .finance-obligation-print {
    display: block !important;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }

  .finance-obligation-detail-page[data-obligation-printing="true"] .finance-obligation-status {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .pickup-distribution-detail-page[data-pickup-distribution-printing="true"] {
    page: pickup-distribution;
  }

  .pickup-distribution-detail-page[data-pickup-distribution-printing="true"] > :not(.pickup-distribution-print-host) {
    display: none !important;
  }

  .pickup-distribution-detail-page[data-pickup-distribution-printing="true"],
  .pickup-distribution-detail-page[data-pickup-distribution-printing="true"] .pickup-distribution-print-host,
  .pickup-distribution-detail-page[data-pickup-distribution-printing="true"] .pickup-distribution-print {
    display: block !important;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }

  .pickup-distribution-detail-page[data-pickup-distribution-printing="true"] .pickup-distribution-status {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .obligation-page[data-settlement-printing="true"] > :not(.finance-settlement-receipt-host),
  .obligation-page[data-settlement-printing="true"] .finance-settlement-receipt__toolbar {
    display: none !important;
  }

  .obligation-page[data-settlement-printing="true"],
  .obligation-page[data-settlement-printing="true"] .finance-settlement-receipt-host,
  .obligation-page[data-settlement-printing="true"] .finance-settlement-receipt {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }

  .obligation-page[data-settlement-printing="true"] .finance-settlement-receipt__logo {
    display: block;
  }
}

.pickup-zone-directory {
  display: grid;
  gap: 1.15rem;
}

.pickup-zone-directory__heading {
  align-items: center;
}

.pickup-zone-directory__toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .65rem;
}

.pickup-zone-directory__add {
  min-height: 42px;
  padding-inline: 1rem;
}

.pickup-zone-directory__modal .app-modal__surface {
  width: min(1040px, calc(100vw - 2rem));
}

.pickup-zone-directory__editor {
  display: grid;
  gap: 1.15rem;
  padding: 1.25rem;
}

.pickup-zone-directory__editor-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid #e6eaf0;
}

.pickup-zone-directory__editor-heading h2 {
  margin: 0;
  color: #172b4d;
  font-size: 1.2rem;
}

.pickup-zone-directory__close {
  flex: 0 0 auto;
}

.pickup-zone-directory__form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  align-items: end;
}

.pickup-zone-directory__field {
  display: grid;
  gap: .4rem;
  min-width: 0;
}

.pickup-zone-directory__field textarea,
.pickup-zone-directory__field input {
  width: 100%;
  min-width: 0;
}

.pickup-zone-directory__field--description {
  grid-column: 1 / -1;
}

.pickup-zone-directory__map {
  grid-column: 1 / -1;
}

.pickup-zone-directory__field textarea {
  min-height: 96px;
  resize: vertical;
}

.pickup-zone-directory__active {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
}

.pickup-zone-directory__actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .6rem;
  grid-column: 1 / -1;
  padding-top: .35rem;
}

.pickup-zone-directory__feedback {
  min-height: 1.35rem;
  margin: 0;
}

.pickup-zone-directory__feedback--error {
  color: var(--danger, #b42318);
}

.pickup-zone-directory__table-region {
  overflow: auto;
  background: #fff;
  border: 1px solid #e4e9f0;
  border-radius: 14px;
  box-shadow: 0 10px 28px rgb(31 45 61 / 7%);
}

.pickup-zone-directory__table {
  width: 100%;
  border-collapse: collapse;
  min-width: 850px;
}

.pickup-zone-directory__table th,
.pickup-zone-directory__table td {
  padding: .85rem 1rem;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid #edf0f4;
}

.pickup-zone-directory__table th {
  background: #f6f8fb;
  color: #526174;
  font-size: .76rem;
  font-weight: 750;
  letter-spacing: .045em;
  text-transform: uppercase;
  white-space: nowrap;
}

.pickup-zone-directory__table tbody tr {
  transition: background-color 150ms ease;
}

.pickup-zone-directory__table tbody tr:hover {
  background: #f8fbff;
}

.pickup-zone-directory__table tbody tr:last-child td {
  border-bottom: 0;
}

.pickup-zone-directory__code {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .2rem .55rem;
  border-radius: 8px;
  background: #eef4ff;
  color: #2457a7;
  font-weight: 750;
}

.pickup-zone-directory__status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .2rem .6rem;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 700;
  white-space: nowrap;
}

.pickup-zone-directory__status--active {
  background: #e8f7ee;
  color: #157347;
}

.pickup-zone-directory__status--inactive {
  background: #f1f3f5;
  color: #667085;
}

.pickup-zone-directory__row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .45rem;
}

.pickup-zone-directory__row-action {
  width: 38px;
  height: 38px;
  min-width: 38px;
  padding: 0;
  border-radius: 10px;
}

.pickup-zone-directory__row-action--edit {
  color: #2457a7;
  border-color: #c8d9f5;
  background: #f5f9ff;
}

.pickup-zone-directory__row-action--delete {
  color: #b42318;
  border-color: #f2c9c5;
  background: #fff7f6;
}

.pickup-zone-directory__row-action:disabled {
  opacity: .42;
}

@media (max-width: 900px) {
  .pickup-zone-directory__heading {
    align-items: flex-start;
  }

  .pickup-zone-directory__toolbar {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .pickup-zone-directory__form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pickup-zone-directory__field--description,
  .pickup-zone-directory__map,
  .pickup-zone-directory__actions {
    grid-column: 1 / -1;
  }

  .pickup-zone-directory__actions > button {
    flex: 1 1 100%;
  }
}

/* Shared mobile contract for list/report filter bars. Forms opt in explicitly so
   creation and editor forms keep their own responsive composition. */
@media (max-width: 760px) {
  form.responsive-filter-grid.responsive-filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 12px 10px;
  }

  form.responsive-filter-grid.responsive-filter-grid > * {
    min-width: 0;
    max-width: 100%;
    grid-column: auto;
  }

  form.responsive-filter-grid.responsive-filter-grid > .responsive-filter-grid__search,
  form.responsive-filter-grid.responsive-filter-grid > .responsive-filter-grid__actions,
  form.responsive-filter-grid.responsive-filter-grid > [role="alert"],
  form.responsive-filter-grid.responsive-filter-grid > [role="status"] {
    grid-column: 1 / -1;
  }

  form.responsive-filter-grid.responsive-filter-grid > .responsive-filter-grid__search {
    width: 100%;
  }

  form.responsive-filter-grid.responsive-filter-grid > .responsive-filter-grid__actions {
    width: auto;
    max-width: 100%;
    justify-self: end;
    margin-inline-start: auto;
  }

  form.responsive-filter-grid.responsive-filter-grid > :is(div, footer).responsive-filter-grid__actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
  }

  form.responsive-filter-grid.responsive-filter-grid > .responsive-filter-grid__actions > :is(button, a),
  form.responsive-filter-grid.responsive-filter-grid > button.responsive-filter-grid__actions {
    width: auto;
    max-width: 100%;
    flex: 0 1 auto;
  }

  form.responsive-filter-grid.responsive-filter-grid :is(
    input,
    select,
    textarea,
    .searchable-select,
    .business-combobox,
    .package-multi-select
  ) {
    min-width: 0;
    max-width: 100%;
  }

  form.responsive-filter-grid.responsive-filter-grid :is(input, select, .package-multi-select summary) {
    min-height: 40px;
    font-size: 14px;
    font-weight: 500;
  }

  form.responsive-filter-grid.responsive-filter-grid > label {
    align-self: stretch;
    align-content: end;
  }

  form.responsive-filter-grid.responsive-filter-grid > :is(input, select, textarea) {
    width: 100%;
  }
}

/* Keep the native calendar control and the field's existing 40/44px height. */
.date-input-control {
  position: relative;
  display: inline-flex;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  vertical-align: middle;
}
.date-input-control > input[type="date"] {
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  padding-inline-end: 36px;
}
.date-input-control--filled > input[type="date"] { padding-inline-end: 66px; }
.date-input-control > input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 12px;
  top: 50%;
  width: 16px;
  height: 16px;
  margin: 0;
  transform: translateY(-50%);
}
.date-input-control > .date-input-clear {
  position: absolute;
  top: 50%;
  right: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  min-width: 24px;
  max-width: 24px;
  height: 24px;
  min-height: 24px;
  margin: 0;
  padding: 3px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--ink-faint);
  box-shadow: none;
  transform: translateY(-50%);
  cursor: pointer;
}
.date-input-control > .date-input-clear[hidden] { display: none; }
.date-input-control > .date-input-clear:hover { background: var(--surface-soft); color: var(--ink); }
.date-input-control > .date-input-clear:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; }
.date-input-clear > svg { width: 15px; height: 15px; }
@media print { .date-input-control > .date-input-clear { display: none; } }
/* Shared screen-only tracking actions; printing/export keeps only the code. */
.tracking-code-inline { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; }
.tracking-code-inline > :first-child { min-width: 0; overflow-wrap: anywhere; }
.tracking-code-copy { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 24px; width: 24px; height: 24px; padding: 3px; border: 0; border-radius: 5px; background: transparent; color: #69789e; cursor: pointer; vertical-align: middle; }
.tracking-code-copy:hover, .tracking-code-copy:focus-visible { background: #eef1f8; color: #172563; }
.tracking-code-copy--success { color: #178457; }
@media print { .tracking-code-copy { display: none !important; } }
.package-create-phone-primary { display: flex; align-items: end; gap: 8px; min-width: 0; }
.package-create-phone-primary > label { flex: 1; min-width: 0; }
.package-create-phone-toggle { flex: 0 0 44px; width: 44px; height: 44px; align-self: end; padding: 0; border: 1px solid #ccd4e9; border-radius: 8px; background: #f5f7fc; color: #172563; cursor: pointer; }
.package-create-phone-secondary[hidden] { display: none !important; }
.package-create-phone-group--expanded { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 15px 16px; align-items: end; }
.package-pod__add-phone { align-self: start; padding: 4px 0; border: 0; background: transparent; color: #526389; font-size: 12px; cursor: pointer; }
.package-pod__add-phone:hover { color: #172563; text-decoration: underline; }
.package-create-phone-group--expanded > .package-create-phone-secondary {
  grid-column: auto;
}
