:root {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --ink: #17202a;
  --muted: #667789;
  --line: #dce4ec;
  --sidebar: #101a23;
  --accent: #59b9f5;
  --good: #0e8a55;
  --bad: #b93838;
  --warning: #8b6500;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

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

button,
input {
  font: inherit;
}

button {
  cursor: pointer;
}

.hidden {
  display: none !important;
}

.center-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.login-card,
.boot-card {
  width: min(430px, 100%);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 34px;
  box-shadow:
    0 18px 55px rgba(20,34,48,.11);
  text-align: center;
}

.boot-card {
  width: min(360px, 100%);
}

.brand-mark {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  margin: 0 auto 18px;
  font-weight: 950;
  letter-spacing: -.04em;
  background: var(--accent);
  color: #06131c;
}

.small-mark {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 11px;
  margin: 0;
  font-size: 13px;
}

.dev-badge {
  display: inline-block;
  margin-bottom: 10px;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  background: #eef6ff;
  color: #12669a;
}

.primary,
.secondary {
  border: 0;
  border-radius: 10px;
  padding: 13px 16px;
  font-weight: 800;
}

.primary {
  width: 100%;
  background: #111c25;
  color: #fff;
}

.primary.compact {
  width: auto;
}

.secondary {
  background: #e9eef3;
  color: #23323e;
}

.primary:disabled {
  opacity: .55;
  cursor: wait;
}

.small {
  color: var(--muted);
  font-size: 12px;
  margin-top: 18px;
  line-height: 1.5;
}

.blocked-icon,
.error-symbol {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  margin: 0 auto 16px;
  border-radius: 50%;
  background: #fde8e8;
  color: var(--bad);
  font-size: 26px;
  font-weight: 900;
}

.loader {
  width: 32px;
  height: 32px;
  margin: 20px auto 0;
  border: 3px solid #dfe8ef;
  border-top-color: var(--accent);
  border-radius: 50%;
  animation:
    spin .85s linear infinite;
}

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

.app {
  min-height: 100vh;
  display: grid;
  grid-template-columns:
    260px minmax(0,1fr);
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  z-index: 30;
  background: var(--sidebar);
  color: #fff;
  padding: 18px 14px;
  display: flex;
  flex-direction: column;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 8px 18px;
  border-bottom:
    1px solid rgba(255,255,255,.09);
}

.brand-copy {
  min-width: 0;
  flex: 1;
}

.brand strong {
  display: block;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.brand span {
  display: block;
  color: #9fb0bf;
  font-size: 11px;
  margin-top: 3px;
}

nav {
  padding: 14px 0;
  flex: 1;
  overflow-y: auto;
}

.nav-item {
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  margin: 2px 0;
  background: transparent;
  color: #cad4dd;
  border: 0;
  border-radius: 9px;
  font-size: 13px;
}

.nav-item:hover,
.nav-item.active {
  color: #fff;
  background:
    rgba(89,185,245,.15);
}

.sidebar-footer {
  border-top:
    1px solid rgba(255,255,255,.09);
  padding-top: 14px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-end;
}

.environment {
  display: block;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
  color: var(--accent);
}

.role-label {
  display: block;
  color: #95a7b7;
  font-size: 10px;
  margin-top: 4px;
}

.link-button {
  border: 0;
  background: transparent;
  color: #cad4dd;
  padding: 4px;
}

main {
  min-width: 0;
}

header {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 78px;
  background:
    rgba(255,255,255,.96);
  backdrop-filter: blur(10px);
  border-bottom:
    1px solid var(--line);
  padding: 15px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

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

header h2 {
  margin: 0;
  font-size: 20px;
}

header p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  font-size: 12px;
  color: var(--muted);
}

.status,
.pill,
.gate-pill {
  border-radius: 999px;
  padding: 6px 9px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.status.pending {
  background: #fff4cc;
  color: var(--warning);
}

.status.good {
  background: #e4f6ed;
  color: var(--good);
}

.status.bad {
  background: #fde8e8;
  color: var(--bad);
}

.retry-button {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 8px;
  padding: 6px 9px;
  color: #394a58;
  font-size: 11px;
  font-weight: 800;
}

.user-email {
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.content {
  padding: 28px;
}

.hero-card {
  background: #111c25;
  color: #fff;
  border-radius: 18px;
  padding: 28px;
  display: flex;
  justify-content: space-between;
  gap: 24px;
}

.hero-card h1 {
  margin: 8px 0;
  font-size: 30px;
}

.hero-card p {
  color: #b8c6d2;
  max-width: 780px;
  line-height: 1.55;
}

.eyebrow {
  font-size: 10px;
  letter-spacing: .14em;
  font-weight: 900;
  color: var(--accent);
}

.version-box {
  min-width: 160px;
  border:
    1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  padding: 16px;
  align-self: center;
}

.version-box strong,
.version-box span {
  display: block;
}

.version-box strong {
  color: #9fb0bf;
  font-size: 11px;
  margin-bottom: 4px;
}

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

.page-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
}

.page-card strong,
.page-card > span {
  display: block;
}

.page-card strong {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 6px;
}

.page-card > span {
  font-size: 15px;
  font-weight: 800;
}

.module-card h3 {
  margin: 0;
}

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

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

.gate-pill {
  background: #eef6ff;
  color: #12669a;
}

.migration-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-top:
    1px solid var(--line);
  font-size: 13px;
}

.pill.queued {
  background: #eef3f7;
  color: #61707d;
}

.pill.done {
  background: #e4f6ed;
  color: var(--good);
}

.placeholder {
  max-width: 820px;
  padding: 28px;
}

.placeholder h2 {
  margin-bottom: 6px;
}

.placeholder p {
  color: var(--muted);
  line-height: 1.55;
}

.placeholder-status {
  margin-top: 18px;
  display: inline-block;
  padding: 8px 10px;
  border-radius: 8px;
  background: #eef3f7;
  color: #61707d;
  font-size: 12px;
  font-weight: 800;
}

.loading-card,
.error-card {
  max-width: 680px;
  margin: 20px auto;
  text-align: center;
  padding: 36px;
}

.loading-card .loader {
  margin-top: 0;
}

.error-card p {
  color: var(--muted);
  line-height: 1.55;
}

.icon-button {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  display: grid;
  place-items: center;
}

.menu-button {
  display: none;
  background: #eef3f7;
}

.sidebar-close {
  display: none;
  color: #fff;
  font-size: 24px;
}

.mobile-backdrop {
  position: fixed;
  inset: 0;
  z-index: 25;
  background:
    rgba(6,15,23,.48);
}

.toast {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 80;
  max-width: min(420px, calc(100vw - 44px));
  background: #15232e;
  color: #fff;
  border-radius: 10px;
  padding: 12px 14px;
  box-shadow:
    0 14px 35px rgba(0,0,0,.22);
  font-size: 12px;
  font-weight: 700;
}

@media (max-width: 980px) {
  .grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .user-email {
    display: none;
  }
}

@media (max-width: 760px) {
  .app {
    display: block;
  }

  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: min(290px, 86vw);
    transform:
      translateX(-105%);
    transition:
      transform .2s ease;
    box-shadow:
      16px 0 42px
      rgba(0,0,0,.2);
  }

  .sidebar.mobile-open {
    transform:
      translateX(0);
  }

  .menu-button,
  .sidebar-close {
    display: grid;
  }

  header {
    padding: 13px 16px;
  }

  .content {
    padding: 16px;
  }

  .hero-card {
    flex-direction: column;
    padding: 22px;
  }

  .hero-card h1 {
    font-size: 25px;
  }

  .version-box {
    align-self: stretch;
  }

  .header-actions {
    gap: 7px;
  }
}

@media (max-width: 540px) {
  .grid {
    grid-template-columns: 1fr;
  }

  .section-heading {
    flex-direction: column;
  }

  .status {
    padding: 5px 7px;
    font-size: 10px;
  }

  header h2 {
    font-size: 18px;
  }

  header p {
    max-width: 190px;
  }
}


/* ============================================================
 * BOS 7.0 GATE #5 — DASHBOARD
 * ============================================================ */

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

.dashboard-title {
  margin: 6px 0 4px;
  font-size: 30px;
}

.dashboard-subtitle {
  margin: 0;
  color: var(--muted);
}

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

.compact-action {
  width: auto;
  padding: 9px 12px;
  font-size: 12px;
}

.notification-button {
  position: relative;
}

.notification-badge {
  position: absolute;
  right: -7px;
  top: -8px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #dc2626;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.dashboard-stat-grid {
  display: grid;
  grid-template-columns:
    repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.stat-card {
  appearance: none;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 14px;
  padding: 17px;
  text-align: left;
  color: var(--ink);
  min-height: 94px;
}

.stat-card.clickable:hover {
  border-color: var(--accent);
  box-shadow: 0 8px 22px rgba(30,60,85,.08);
}

.stat-label {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  margin-bottom: 8px;
}

.stat-value {
  display: block;
  font-size: 25px;
  line-height: 1;
  font-weight: 950;
}

.loading-stat {
  opacity: .7;
}

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

.dashboard-error {
  grid-column: 1 / -1;
  margin: 0;
}

.drawer-overlay {
  position: fixed;
  inset: 0;
  z-index: 65;
  background: rgba(8,18,28,.45);
}

.dashboard-drawer {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 70;
  height: 100vh;
  width: min(500px, 100vw);
  background: #fff;
  border-left: 1px solid var(--line);
  box-shadow: -15px 0 38px rgba(8,18,28,.18);
  transform: translateX(105%);
  transition: transform .2s ease;
  display: flex;
  flex-direction: column;
}

.dashboard-drawer.open {
  transform: translateX(0);
}

.drawer-header {
  min-height: 76px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.drawer-header h2 {
  margin: 5px 0 0;
  font-size: 21px;
}

.drawer-body {
  flex: 1;
  overflow: auto;
  background: #f7f9fc;
  padding: 14px;
}

.drawer-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
}

.drawer-loading,
.drawer-empty {
  padding: 34px 20px;
  text-align: center;
  color: var(--muted);
}

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

.drawer-empty strong {
  color: var(--ink);
  margin-bottom: 6px;
}

.notification-list,
.payout-list {
  display: grid;
  gap: 9px;
}

.notification-item {
  position: relative;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px 42px 14px 14px;
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 10px;
  cursor: pointer;
}

.notification-item.unread {
  background: #edf7ff;
  border-left: 4px solid var(--accent);
}

.notification-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #f0f4f7;
}

.notification-copy strong,
.notification-copy span {
  display: block;
}

.notification-copy p {
  margin: 4px 0;
  color: #425363;
  line-height: 1.4;
  font-size: 12px;
}

.notification-copy span {
  color: var(--muted);
  font-size: 10px;
}

.notification-delete {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: #748493;
  font-size: 18px;
}

.payout-item {
  width: 100%;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 12px;
  padding: 14px;
  text-align: left;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--ink);
}

.payout-item:hover {
  border-color: var(--accent);
}

.payout-item strong,
.payout-item span {
  display: block;
}

.payout-item span {
  color: var(--muted);
  font-size: 11px;
  margin-top: 4px;
}

.payout-item b {
  font-size: 18px;
  white-space: nowrap;
}

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

.payout-notes {
  margin-bottom: 12px;
}

.payout-notes p {
  white-space: pre-wrap;
  color: var(--muted);
}

.payout-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-bottom: 12px;
}

.danger-action {
  border: 0;
  border-radius: 10px;
  padding: 9px 12px;
  background: #dc2626;
  color: #fff;
  font-weight: 800;
}

@media (max-width: 800px) {
  .dashboard-topbar {
    flex-direction: column;
  }

  .dashboard-actions {
    justify-content: flex-start;
  }

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

@media (max-width: 520px) {
  .dashboard-info-grid,
  .detail-grid {
    grid-template-columns: 1fr;
  }

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

  .stat-value {
    font-size: 22px;
  }
}


/* ============================================================
 * BOS 7.0 GATE #6 — CUSTOMERS
 * ============================================================ */

.customer-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.customer-sub {
  margin: 0;
  color: var(--muted);
}

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

.customer-actions,
.customer-form-actions,
.customer-pager {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.customer-form-card {
  margin-bottom: 16px;
}

.customer-form-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.customer-form-head h2 {
  margin: 5px 0 0;
}

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

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

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

.customer-field span {
  font-size: 11px;
  font-weight: 850;
  color: #425363;
}

.customer-field input,
.customer-field select,
.customer-field textarea,
.customer-search-grid input,
.customer-search-grid select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
  color: var(--ink);
  outline: none;
}

.customer-field input:focus,
.customer-field select:focus,
.customer-field textarea:focus,
.customer-search-grid input:focus,
.customer-search-grid select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(89,185,245,.13);
}

.customer-form-message {
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
}

.customer-form-message.error {
  background: #fee2e2;
  color: #991b1b;
}

.customer-form-actions {
  margin-top: 15px;
}

.customer-list-card {
  margin-bottom: 16px;
}

.customer-search-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr) 190px auto;
  gap: 9px;
  align-items: center;
}

.customer-count {
  color: var(--muted);
  font-size: 12px;
  margin: 12px 0 8px;
}

.customer-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.customer-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.customer-table th,
.customer-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.customer-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.customer-table td strong,
.customer-table td small {
  display: block;
}

.customer-table td small {
  margin-top: 3px;
  color: var(--muted);
}

.customer-row {
  cursor: pointer;
}

.customer-row:hover {
  background: #f3f8fd;
}

.customer-empty {
  text-align: center !important;
  color: var(--muted);
  padding: 30px !important;
}

.customer-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 999px;
  background: #edf2f7;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.customer-pager {
  justify-content: flex-end;
  margin-top: 12px;
}

.customer-pager button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

@media (max-width: 850px) {
  .customer-form-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .customer-search-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .customer-toolbar,
  .customer-form-head {
    flex-direction: column;
  }

  .customer-form-grid {
    grid-template-columns: 1fr;
  }

  .customer-field.wide {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #7 — ESTIMATES
 * ============================================================ */

.estimate-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.estimate-sub {
  margin: 0;
  color: var(--muted);
}

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

.estimate-actions,
.estimate-detail-actions,
.estimate-management,
.estimate-lines-head {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.estimate-search-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) 190px auto;
  gap: 9px;
}

.estimate-search-grid input,
.estimate-search-grid select,
.estimate-management select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
  color: var(--ink);
}

.estimate-count {
  margin: 12px 0 8px;
  color: var(--muted);
  font-size: 12px;
}

.estimate-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.estimate-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.estimate-table th,
.estimate-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.estimate-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.estimate-table td strong,
.estimate-table td small {
  display: block;
}

.estimate-table td small {
  color: var(--muted);
  margin-top: 3px;
}

.estimate-empty {
  text-align: center !important;
  color: var(--muted);
  padding: 30px !important;
}

.estimate-status {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 999px;
  background: #edf2f7;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.estimate-row-actions {
  white-space: nowrap;
}

.estimate-drawer {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 70;
  width: min(760px, 100vw);
  height: 100vh;
  background: #fff;
  border-left: 1px solid var(--line);
  box-shadow: -15px 0 38px rgba(8,18,28,.18);
  transform: translateX(105%);
  transition: transform .2s ease;
  display: flex;
  flex-direction: column;
}

.estimate-drawer.open {
  transform: translateX(0);
}

.estimate-detail-actions {
  margin-bottom: 12px;
}

.estimate-detail-grid {
  margin-bottom: 12px;
}

.estimate-financial-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 9px;
  margin-bottom: 12px;
}

.estimate-money-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px;
}

.estimate-money-card span,
.estimate-money-card strong {
  display: block;
}

.estimate-money-card span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.estimate-money-card strong {
  margin-top: 5px;
  font-size: 18px;
}

.estimate-section {
  margin-bottom: 10px;
}

.estimate-section p {
  white-space: pre-wrap;
  color: #425363;
  line-height: 1.5;
}

.estimate-line-list {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

.estimate-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.estimate-line p {
  margin: 4px 0 0;
  font-size: 11px;
}

.estimate-management {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.estimate-management select {
  width: auto;
}

.estimate-edit-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.estimate-edit-grid .wide {
  grid-column: 1 / -1;
}

.estimate-lines-head {
  justify-content: space-between;
  margin-bottom: 10px;
}

.estimate-edit-line {
  display: grid;
  grid-template-columns: 1fr 1.3fr 85px 110px 90px 42px;
  gap: 7px;
  padding: 8px 0;
  border-top: 1px solid var(--line);
  align-items: center;
}

.estimate-edit-line input {
  min-width: 0;
  border: 1px solid #cdd8e3;
  border-radius: 7px;
  padding: 8px;
}

.estimate-check {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
}

.estimate-empty-lines {
  color: var(--muted);
  padding: 16px 0;
}

@media (max-width: 850px) {
  .estimate-toolbar {
    flex-direction: column;
  }

  .estimate-search-grid {
    grid-template-columns: 1fr;
  }

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

  .estimate-edit-line {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px) {
  .estimate-financial-grid,
  .estimate-edit-grid {
    grid-template-columns: 1fr;
  }

  .estimate-edit-grid .wide {
    grid-column: auto;
  }

  .estimate-edit-line {
    grid-template-columns: 1fr;
  }
}


/* Gate #7D Estimate open performance */
.estimate-performance-note {
  display: inline-block;
  margin-bottom: 10px;
  padding: 5px 8px;
  border-radius: 999px;
  background: #eaf7ef;
  color: #18794e;
  font-size: 10px;
  font-weight: 850;
}


/* ============================================================
 * BOS 7.0 GATE #8 — JOBS
 * ============================================================ */

.jobs-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.jobs-sub {
  color: var(--muted);
  margin: 0;
}

.jobs-toolbar,
.job-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

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

.job-editor-card,
.jobs-list-card {
  margin-bottom: 16px;
}

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

.job-form-grid .wide {
  grid-column: 1 / -1;
}

.jobs-filter-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr) 170px 160px auto;
  gap: 9px;
}

.jobs-filter-grid input,
.jobs-filter-grid select,
.job-inline-actions select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
  color: var(--ink);
}

.jobs-count {
  color: var(--muted);
  font-size: 12px;
  margin: 12px 0 8px;
}

.jobs-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.jobs-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.jobs-table th,
.jobs-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.jobs-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.job-row-web {
  cursor: pointer;
}

.job-row-web:hover {
  background: #f3f8fd;
}

.job-status-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 999px;
  background: #edf2f7;
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}

.jobs-empty {
  text-align: center !important;
  color: var(--muted);
  padding: 30px !important;
}

.job-utility-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 12px;
  margin: 16px 0;
}

.job-utility-panel {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: #f8fafc;
}

.job-utility-panel p {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

@media (max-width: 900px) {
  .job-form-grid {
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .jobs-filter-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 620px) {
  .jobs-toolbar,
  .job-editor-head {
    flex-direction: column;
  }

  .job-form-grid,
  .job-utility-grid,
  .jobs-filter-grid {
    grid-template-columns: 1fr;
  }

  .job-form-grid .wide {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #9 — DISPATCH & SCHEDULE
 * ============================================================ */

.dispatch-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.dispatch-sub {
  margin: 0;
  color: var(--muted);
}

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

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

.dispatch-actions input {
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 9px 11px;
}

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

.dispatch-layout {
  display: grid;
  grid-template-columns:
    1.05fr 1.2fr .9fr;
  gap: 12px;
  margin-bottom: 12px;
}

.dispatch-bottom-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.dispatch-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.dispatch-panel-head input {
  max-width: 210px;
  border: 1px solid #cdd8e3;
  border-radius: 8px;
  padding: 8px 9px;
}

.dispatch-tabs {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.dispatch-tab {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 999px;
  padding: 6px 9px;
  font-size: 10px;
  font-weight: 850;
}

.dispatch-tab.active {
  background: #15232e;
  color: #fff;
  border-color: #15232e;
}

#dispatchJobs,
#dispatchWorkers,
#dispatchAlerts,
#dispatchActivity {
  max-height: 560px;
  overflow: auto;
}

.dispatch-job {
  width: 100%;
  text-align: left;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 10px;
  padding: 11px;
  margin-bottom: 7px;
  color: var(--ink);
}

.dispatch-job.selected,
.dispatch-job:hover {
  border-color: var(--accent);
  background: #f2f9fe;
}

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

.dispatch-small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
  margin-top: 6px;
}

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

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

.dispatch-field span,
.dispatch-field strong {
  display: block;
}

.dispatch-field span {
  color: var(--muted);
  font-size: 10px;
  margin-bottom: 4px;
}

.dispatch-detail-actions {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 12px;
}

.dispatch-worker,
.dispatch-alert {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 7px;
}

.dispatch-alert.danger {
  border-left: 4px solid #dc2626;
  background: #fff7f7;
}

.dispatch-alert p {
  color: var(--muted);
  font-size: 11px;
  margin: 5px 0 0;
  line-height: 1.4;
}

.dispatch-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-right: 5px;
  background: #94a3b8;
}

.dispatch-dot.online {
  background: #16a34a;
}

.dispatch-empty {
  text-align: center;
  color: var(--muted);
  padding: 22px 10px;
}

.dispatch-modal {
  position: fixed;
  inset: 0;
  z-index: 75;
  display: grid;
  place-items: center;
  padding: 20px;
}

.dispatch-modal-card {
  width: min(520px,100%);
  max-height: 88vh;
  overflow: auto;
  background: #fff;
  border-radius: 14px;
  border: 1px solid var(--line);
  box-shadow: 0 24px 60px rgba(8,18,28,.2);
}

.dispatch-modal-body {
  padding: 16px;
  display: grid;
  gap: 12px;
}

.dispatch-modal-body input,
.dispatch-modal-body select,
.dispatch-modal-body textarea {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
}

@media (max-width: 1100px) {
  .dispatch-stats {
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .dispatch-layout {
    grid-template-columns:
      1fr 1fr;
  }

  .dispatch-workers-panel {
    grid-column:
      1 / -1;
  }
}

@media (max-width: 720px) {
  .dispatch-toolbar {
    flex-direction: column;
  }

  .dispatch-stats,
  .dispatch-layout,
  .dispatch-bottom-grid,
  .dispatch-detail-grid {
    grid-template-columns: 1fr;
  }

  .dispatch-workers-panel {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #10 — INVOICES
 * ============================================================ */

.invoices-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.invoice-sub {
  color: var(--muted);
  margin: 0;
}

.invoices-toolbar,
.invoice-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

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

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

.invoice-editor-card,
.invoices-list-card {
  margin-bottom: 16px;
}

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

.invoice-form-grid .wide {
  grid-column: 1 / -1;
}

.invoice-filter-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr) 190px auto;
  gap: 9px;
}

.invoice-filter-grid input,
.invoice-filter-grid select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
}

.invoice-count {
  color: var(--muted);
  font-size: 12px;
  margin: 12px 0 8px;
}

.invoice-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.invoice-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.invoice-table th,
.invoice-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.invoice-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.invoice-row-web {
  cursor: pointer;
}

.invoice-row-web:hover {
  background: #f3f8fd;
}

.invoice-empty {
  text-align: center !important;
  color: var(--muted);
  padding: 30px !important;
}

.invoice-items-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 18px 0 8px;
}

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

.invoice-item-row {
  display: grid;
  grid-template-columns:
    minmax(220px,1.5fr)
    90px
    90px
    110px
    90px
    44px;
  gap: 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px;
  background: #f8fafc;
}

.invoice-item-row input {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 8px;
  padding: 9px;
  background: #fff;
}

.invoice-taxable {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
}

.invoice-taxable input {
  width: auto;
}

.invoice-total-grid {
  display: grid;
  grid-template-columns:
    repeat(6,minmax(0,1fr));
  gap: 9px;
  margin: 16px 0;
}

.invoice-total-box {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 11px;
  background: #fff;
}

.invoice-total-box span,
.invoice-total-box strong {
  display: block;
}

.invoice-total-box span {
  color: var(--muted);
  font-size: 10px;
  margin-bottom: 5px;
}

.invoice-total-box strong {
  font-size: 17px;
}

@media (max-width: 1100px) {
  .invoice-stats {
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .invoice-total-grid {
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

  .invoice-item-row {
    grid-template-columns:
      1fr 90px 90px 110px;
  }

  .invoice-taxable {
    grid-column: 1 / 2;
  }
}

@media (max-width: 760px) {
  .invoices-toolbar,
  .invoice-editor-head {
    flex-direction: column;
  }

  .invoice-stats,
  .invoice-form-grid,
  .invoice-filter-grid,
  .invoice-total-grid,
  .invoice-item-row {
    grid-template-columns: 1fr;
  }

  .invoice-form-grid .wide,
  .invoice-taxable {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #11 — EMPLOYEES
 * ============================================================ */

.employees-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.employee-sub {
  color: var(--muted);
  margin: 0;
}

.employees-toolbar,
.employee-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

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

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

.employee-editor-card,
.employees-list-card {
  margin-bottom: 16px;
}

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

.employee-form-grid .wide {
  grid-column: 1 / -1;
}

.employee-filter-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr) 190px auto;
  gap: 9px;
}

.employee-filter-grid input,
.employee-filter-grid select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
}

.employee-count {
  color: var(--muted);
  font-size: 12px;
  margin: 12px 0 8px;
}

.employee-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.employee-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.employee-table th,
.employee-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.employee-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.employee-row-web {
  cursor: pointer;
}

.employee-row-web:hover {
  background: #f3f8fd;
}

.employee-id-small {
  margin-top: 3px;
  font-size: 10px;
  color: var(--muted);
}

.employee-empty {
  text-align: center !important;
  color: var(--muted);
  padding: 30px !important;
}

@media (max-width: 1100px) {
  .employee-stats {
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }

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

@media (max-width: 720px) {
  .employees-toolbar,
  .employee-editor-head {
    flex-direction: column;
  }

  .employee-stats,
  .employee-form-grid,
  .employee-filter-grid {
    grid-template-columns: 1fr;
  }

  .employee-form-grid .wide {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #12 — VENDORS
 * ============================================================ */

.vendors-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.vendor-sub {
  color: var(--muted);
  margin: 0;
}

.vendors-toolbar,
.vendor-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

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

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

.vendor-editor-card,
.vendors-list-card {
  margin-bottom: 16px;
}

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

.vendor-form-grid .wide {
  grid-column: 1 / -1;
}

.vendor-filter-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    175px
    175px
    auto;
  gap: 9px;
}

.vendor-filter-grid input,
.vendor-filter-grid select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
}

.vendor-count {
  color: var(--muted);
  font-size: 12px;
  margin: 12px 0 8px;
}

.vendor-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.vendor-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.vendor-table th,
.vendor-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.vendor-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.vendor-row-web {
  cursor: pointer;
}

.vendor-row-web:hover {
  background: #f3f8fd;
}

.vendor-small {
  margin-top: 3px;
  font-size: 10px;
  color: var(--muted);
}

.vendor-expired {
  color: #b91c1c;
  font-size: 10px;
  display: block;
}

.vendor-empty {
  text-align: center;
  color: var(--muted);
  padding: 20px;
}

.vendor-stripe-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  margin: 16px 0;
  background: #f8fafc;
}

.vendor-stripe-grid {
  display: grid;
  grid-template-columns:
    repeat(6,minmax(0,1fr));
  gap: 8px;
  margin-top: 10px;
}

.vendor-stripe-box {
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  padding: 9px;
}

.vendor-stripe-box span,
.vendor-stripe-box strong {
  display: block;
}

.vendor-stripe-box span {
  color: var(--muted);
  font-size: 9px;
  margin-bottom: 4px;
}

.vendor-stripe-box strong {
  font-size: 11px;
  overflow-wrap: anywhere;
}

.vendor-detail-grid {
  display: grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 16px;
}

.vendor-subpanel {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
}

.vendor-subpanel-head,
.vendor-record-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.vendor-record-list {
  max-height: 360px;
  overflow: auto;
  margin-top: 9px;
}

.vendor-record {
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 10px;
  margin-bottom: 7px;
  background: #fff;
}

.vendor-record-money {
  font-size: 11px;
  font-weight: 700;
  margin-top: 6px;
}

.vendor-doc-link {
  display: inline-block;
  margin-top: 6px;
  font-size: 11px;
  font-weight: 700;
}

@media (max-width: 1200px) {
  .vendor-stats {
    grid-template-columns:
      repeat(4,minmax(0,1fr));
  }

  .vendor-stripe-grid {
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }
}

@media (max-width: 800px) {
  .vendors-toolbar,
  .vendor-editor-head {
    flex-direction: column;
  }

  .vendor-stats,
  .vendor-form-grid,
  .vendor-filter-grid,
  .vendor-stripe-grid,
  .vendor-detail-grid {
    grid-template-columns: 1fr;
  }

  .vendor-form-grid .wide {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #13 — INVENTORY
 * ============================================================ */

.inventory-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.inventory-sub {
  color: var(--muted);
  margin: 0;
}

.inventory-toolbar,
.inventory-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
}

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

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

.inventory-editor-card,
.inventory-list-card {
  margin-bottom: 16px;
}

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

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

.inventory-filter-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    160px
    170px
    170px
    auto
    auto;
  gap: 9px;
  align-items: center;
}

.inventory-filter-grid input,
.inventory-filter-grid select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
}

.inventory-low-toggle {
  display: flex;
  gap: 7px;
  align-items: center;
  white-space: nowrap;
  font-size: 11px;
}

.inventory-low-toggle input {
  width: auto;
}

.inventory-count {
  color: var(--muted);
  font-size: 12px;
  margin: 12px 0 8px;
}

.inventory-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.inventory-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.inventory-table th,
.inventory-table td {
  padding: 12px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.inventory-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.inventory-row-web {
  cursor: pointer;
}

.inventory-row-web:hover {
  background: #f3f8fd;
}

.inventory-row-low {
  background: #fffaf2;
}

.inventory-small {
  margin-top: 3px;
  font-size: 10px;
  color: var(--muted);
}

.inventory-low-pill {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 6px;
  border-radius: 999px;
  background: #fff1d6;
  font-size: 9px;
  font-weight: 700;
}

.inventory-empty {
  text-align: center;
  color: var(--muted);
  padding: 24px;
}

.inventory-subpanel {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  margin-top: 16px;
}

.inventory-subpanel-head,
.inventory-record-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.inventory-record-list {
  max-height: 360px;
  overflow: auto;
  margin-top: 9px;
}

.inventory-record {
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 10px;
  margin-bottom: 7px;
  background: #fff;
}

.inventory-change {
  font-weight: 800;
  font-size: 12px;
}

.inventory-change.positive {
  color: #166534;
}

.inventory-change.negative {
  color: #b91c1c;
}

@media (max-width: 1200px) {
  .inventory-stats {
    grid-template-columns:
      repeat(4,minmax(0,1fr));
  }

  .inventory-filter-grid {
    grid-template-columns:
      repeat(3,minmax(0,1fr));
  }
}

@media (max-width: 800px) {
  .inventory-toolbar,
  .inventory-editor-head {
    flex-direction: column;
  }

  .inventory-stats,
  .inventory-form-grid,
  .inventory-filter-grid {
    grid-template-columns: 1fr;
  }

  .inventory-form-grid .wide {
    grid-column: auto;
  }
}


/* ============================================================
 * BOS 7.0 GATE #14 — ACCOUNTING
 * ============================================================ */

.accounting-page h1 {
  margin: 5px 0 4px;
  font-size: 30px;
}

.accounting-sub {
  color: var(--muted);
  margin: 0;
}

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

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

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

.accounting-filters-card {
  margin-bottom: 14px;
}

.accounting-filter-grid {
  display: grid;
  grid-template-columns:
    minmax(0,1fr)
    160px
    150px
    150px
    auto;
  gap: 9px;
}

.accounting-filter-grid input,
.accounting-filter-grid select {
  width: 100%;
  border: 1px solid #cdd8e3;
  border-radius: 9px;
  padding: 10px 11px;
  background: #fff;
}

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

.accounting-account,
.accounting-operation {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  border-bottom: 1px solid var(--line);
  padding: 10px 0;
}

.accounting-account:last-child,
.accounting-operation:last-child {
  border-bottom: 0;
}

.accounting-small {
  color: var(--muted);
  font-size: 10px;
  margin-top: 3px;
}

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

.accounting-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}

.accounting-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.accounting-table th,
.accounting-table td {
  padding: 11px;
  border-bottom: 1px solid #e8edf2;
  text-align: left;
  font-size: 11px;
  vertical-align: top;
}

.accounting-table th {
  background: #f8fafc;
  color: #475569;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.accounting-empty {
  text-align: center !important;
  color: var(--muted);
  padding: 24px !important;
}

.accounting-delete-btn {
  border: 0;
  background: #fee2e2;
  color: #991b1b;
  padding: 6px 8px;
  border-radius: 7px;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}

.accounting-modal {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(15,23,42,.55);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 55px 20px;
  overflow: auto;
}

.accounting-modal.hidden {
  display: none;
}

.accounting-modal-card {
  width: min(920px,100%);
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 24px 70px rgba(15,23,42,.3);
}

.accounting-modal-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

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

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

@media (max-width: 1200px) {
  .accounting-stats {
    grid-template-columns:
      repeat(4,minmax(0,1fr));
  }

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

@media (max-width: 800px) {
  .accounting-toolbar {
    flex-direction: column;
  }

  .accounting-stats,
  .accounting-grid,
  .accounting-filter-grid,
  .accounting-form-grid,
  .accounting-operations {
    grid-template-columns: 1fr;
  }

  .accounting-form-grid .wide {
    grid-column: auto;
  }
}

/* Gate #16 Messaging */
.messaging-shell{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);min-height:680px;border:1px solid #dbe3ec;border-radius:16px;overflow:hidden;background:#fff}
.messaging-sidebar-panel{border-right:1px solid #dbe3ec;min-width:0;display:flex;flex-direction:column;background:#f9fbfd}
.messaging-sidebar-tools{padding:14px;border-bottom:1px solid #dbe3ec;background:#fff}.messaging-search{width:100%;margin-bottom:10px}.messaging-filter-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.messaging-conversation-list{overflow:auto;flex:1;max-height:700px}.messaging-conversation{width:100%;border:0;border-bottom:1px solid #e9eef4;background:transparent;display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;text-align:left;padding:13px 12px;cursor:pointer;color:#152637}
.messaging-conversation:hover{background:#f0f6fa}.messaging-conversation.active{background:#e6f1f8;box-shadow:inset 3px 0 0 #183b56}.messaging-avatar{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;background:#dceaf4;color:#163a54}.messaging-avatar.large{width:46px;height:46px;font-size:15px}
.messaging-conversation-main{min-width:0;display:flex;flex-direction:column;gap:2px}.messaging-conversation-top{display:flex;justify-content:space-between;gap:8px}.messaging-conversation-top strong,.messaging-conversation-subject,.messaging-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.messaging-conversation-top time{font-size:11px;color:#6c7b88}.messaging-conversation-subject{font-size:12px;color:#465b6c}.messaging-preview{font-size:12px;color:#7b8995}.messaging-unread{min-width:21px;height:21px;border-radius:11px;background:#163a54;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;align-self:center}
.messaging-thread-panel{display:flex;flex-direction:column;min-width:0}.messaging-empty-thread,.messaging-loading,.messaging-error,.messaging-empty-list{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#6d7c89;padding:28px}.messaging-empty-icon{font-size:34px}
.messaging-thread-header{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:15px 18px;border-bottom:1px solid #e5ebf1}.messaging-thread-person{display:flex;gap:11px;align-items:center;min-width:0}.messaging-thread-person h3{margin:0;font-size:17px}.messaging-thread-person p{margin:3px 0 0;color:#6d7c89;font-size:12px}.messaging-thread-actions{display:flex;gap:7px;flex-wrap:wrap}.messaging-thread-meta{padding:7px 18px;background:#f7fafc;border-bottom:1px solid #e7edf3;display:flex;gap:16px;font-size:11px;color:#657887;flex-wrap:wrap}
.messaging-messages{flex:1;min-height:400px;max-height:540px;overflow:auto;padding:18px 20px;background:#f4f7fa;display:flex;flex-direction:column;gap:10px}.messaging-message-row{display:flex}.messaging-message-row.outbound{justify-content:flex-end}.messaging-message-row.internal{justify-content:center}.messaging-message-bubble{max-width:min(76%,720px);padding:9px 11px;border-radius:14px;background:#fff;border:1px solid #dfe6ed}.messaging-message-row.outbound .messaging-message-bubble{background:#163a54;color:#fff;border-color:#163a54;border-bottom-right-radius:4px}.messaging-message-row.inbound .messaging-message-bubble{border-bottom-left-radius:4px}.messaging-message-row.internal .messaging-message-bubble{background:#fff8db;border-color:#ead994;color:#564a18;max-width:88%}
.messaging-message-author{display:flex;gap:7px;font-size:11px;margin-bottom:4px}.messaging-internal-badge{font-size:10px;border:1px solid currentColor;border-radius:8px;padding:1px 5px}.messaging-message-text{font-size:13px;line-height:1.45;word-break:break-word}.messaging-message-footer{display:flex;gap:9px;justify-content:flex-end;font-size:10px;opacity:.72;margin-top:5px}
.messaging-attachment-preview{display:flex;gap:6px;flex-wrap:wrap;padding:8px 16px 0}.messaging-attachment-chip{display:inline-flex;gap:6px;align-items:center;background:#eef4f8;border:1px solid #d6e1e9;border-radius:12px;padding:4px 8px;font-size:11px}.messaging-attachment-chip button{border:0;background:transparent;cursor:pointer}.messaging-composer{padding:12px 16px 14px;border-top:1px solid #e3e9ef}.messaging-composer textarea{width:100%;resize:vertical;min-height:70px}.messaging-composer-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px}.messaging-composer-left{display:flex;gap:10px;align-items:center}.messaging-internal-toggle{font-size:12px;display:flex;gap:5px;align-items:center}.messaging-file-label{cursor:pointer}
.messaging-modal-backdrop{position:fixed;inset:0;background:rgba(6,18,28,.52);z-index:5000;display:flex;align-items:center;justify-content:center;padding:20px}.messaging-modal{width:min(720px,96vw);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 20px 70px rgba(0,0,0,.25);padding:20px}.messaging-modal-header,.messaging-modal-actions{display:flex;justify-content:space-between;align-items:center}.messaging-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.messaging-modal-grid label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700}.messaging-modal-grid .full{grid-column:1/-1}.messaging-modal-actions{justify-content:flex-end;gap:10px}
@media(max-width:900px){.messaging-shell{grid-template-columns:1fr}.messaging-sidebar-panel{border-right:0;border-bottom:1px solid #dbe3ec;max-height:360px}.messaging-messages{min-height:360px}.messaging-thread-header{align-items:flex-start;flex-direction:column}.messaging-modal-grid{grid-template-columns:1fr}}

/* Gate #16B recipient + channel selector */
.messaging-create-step{display:grid;grid-template-columns:220px minmax(0,1fr);gap:12px;margin:16px 0}
.messaging-create-step label,.messaging-channel-control{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700}
.messaging-recipient-results{border:1px solid #dfe6ed;border-radius:12px;max-height:260px;overflow:auto;background:#fafcfe}
.messaging-recipient-help{padding:18px;color:#6d7c89;text-align:center;font-size:12px}
.messaging-recipient-result{width:100%;display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;text-align:left;border:0;border-bottom:1px solid #e8edf2;background:#fff;padding:10px 12px;cursor:pointer;color:#183041}
.messaging-recipient-result:hover{background:#edf5fa}
.messaging-recipient-result span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.messaging-recipient-result small{font-size:11px;color:#6f7f8c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.messaging-selected-recipient{margin:12px 0}.messaging-selected-recipient.hidden{display:none}
.messaging-selected-card{display:flex;gap:12px;align-items:center;border:1px solid #bcd4e4;background:#eef7fc;border-radius:12px;padding:12px}
.messaging-selected-card>div{display:flex;flex-direction:column;gap:2px}.messaging-selected-card small{color:#647784}
.messaging-channel-step{grid-template-columns:220px minmax(0,1fr);align-items:end}
.messaging-channel-availability{font-size:11px;color:#5e7281;padding:9px 10px;background:#f7fafc;border:1px solid #e0e8ee;border-radius:8px}
.messaging-channel-control select{min-width:120px}
@media(max-width:700px){.messaging-create-step,.messaging-channel-step{grid-template-columns:1fr}}

.messaging-realtime-status{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 10px;
  border-radius:999px;
  background:#eef5f1;
  font-size:12px;
  font-weight:700;
  color:#23633c;
  white-space:nowrap;
}

.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:22px}
.settings-card{min-height:125px}
.settings-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.settings-card p{margin:10px 0 0;color:var(--muted,#667085);font-size:13px}
.settings-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800}
.settings-status.configured{background:#eaf7ef;color:#237a45}
.settings-status.missing{background:#fff1f0;color:#b42318}
.settings-hint{margin-top:9px;font-size:12px;font-family:monospace;color:#475467}
.settings-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.settings-kv>div{display:flex;flex-direction:column;gap:5px;padding:12px;border:1px solid #e4e7ec;border-radius:10px}
.settings-kv span{font-size:12px;color:#667085}.settings-kv strong{font-size:14px;color:#101828}

.settings-form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:16px;
}
.settings-form-field{
  display:flex;
  flex-direction:column;
  gap:7px;
}
.settings-form-field>span{
  font-size:12px;
  font-weight:800;
  color:#344054;
}
.settings-form-field input{
  width:100%;
  min-height:42px;
  padding:9px 11px;
  border:1px solid #d0d5dd;
  border-radius:9px;
  background:#fff;
  color:#101828;
  font:inherit;
}
.settings-form-field input:focus{
  outline:none;
  border-color:#59b9f5;
  box-shadow:0 0 0 3px rgba(89,185,245,.15);
}
.settings-form-field small{
  color:#667085;
  font-size:11px;
}
.settings-form-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:14px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid #eaecf0;
}
.settings-save-message{
  margin-right:auto;
  font-size:12px;
  font-weight:700;
}
.settings-save-message.success{color:#237a45}
.settings-save-message.error{color:#b42318}

.settings-form-field input[type="password"]{
  letter-spacing:.04em;
}