:root {
  --brand: #087b72;
  --brand-dark: #05665e;
  --yellow: #f3bd58;
  --green: #24835a;
  --green-dark: #166347;
  --ink: #17343a;
  --muted: #60777c;
  --soft: #f2f7f6;
  --line: #dce8e5;
  --sidebar: #102e34;
  --surface: #ffffff;
  --surface-alt: #f5faf8;
  --surface-muted: #e6f1ee;
  --shadow: rgba(16, 54, 56, 0.08);
  --shadow-sm: 0 8px 24px rgba(16, 54, 56, 0.06);
  --topbar: rgba(250, 253, 252, 0.94);
  --focus-ring: rgba(8, 123, 114, 0.25);
}

[data-theme="dark"] {
  --brand: #5ed9c5;
  --brand-dark: #82e6d4;
  --green: #75d8a4;
  --green-dark: #9be7bd;
  --ink: #e8f5f3;
  --muted: #adc5c5;
  --soft: #12252a;
  --line: #314a4e;
  --sidebar: #0b2026;
  --surface: #1a3137;
  --surface-alt: #213a40;
  --surface-muted: #2d4d4d;
  --shadow: rgba(0, 0, 0, 0.24);
  --shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.18);
  --topbar: rgba(20, 40, 45, 0.96);
  --focus-ring: rgba(94, 217, 197, 0.35);
}

* {
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  color: var(--ink);
  background: var(--surface);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.auth-page {
  display: grid;
  place-items: center;
  padding: 72px 20px 40px;
  background:
    radial-gradient(circle at 12% 14%, rgba(128, 219, 179, 0.2), transparent 30%),
    radial-gradient(circle at 93% 88%, rgba(51, 140, 131, 0.13), transparent 32%),
    linear-gradient(145deg, #eaf6f0, #f9fcfa 55%, #ecf4f3);
}

[data-theme="dark"] .auth-page {
  background:
    radial-gradient(circle at 10% 10%, rgba(65, 179, 146, 0.17), transparent 29%),
    radial-gradient(circle at 94% 88%, rgba(60, 165, 161, 0.14), transparent 30%),
    linear-gradient(145deg, #0b2026, #142e32 56%, #0b282d);
}

.auth-shell {
  width: min(450px, 100%);
  margin: auto;
}

.brand-logo {
  width: 58px;
  height: 58px;
  object-fit: contain;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 16px 32px rgba(245, 130, 32, 0.14);
}

[data-theme="dark"] .brand-logo {
  background: #fff;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.32);
}

.brand-logo-lg {
  width: 128px;
  height: 128px;
  border-radius: 50%;
  padding: 6px;
}

.eyebrow,
.section-kicker {
  color: var(--brand);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.72rem;
  font-weight: 800;
}

.auth-card-logo {
  display: flex;
  justify-content: center;
  margin-bottom: 22px;
}

.auth-card-logo .brand-logo {
  width: 88px;
  height: 88px;
  padding: 4px;
  border-radius: 50%;
  box-shadow: 0 8px 24px var(--shadow);
}

.auth-card .card-body > .mb-4 {
  text-align: center;
}

.auth-card .card {
  border-radius: 20px;
  border: 1px solid var(--line) !important;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 24px 54px rgba(13, 75, 71, 0.11) !important;
}

.auth-demo-field:disabled {
  background: var(--surface);
  color: var(--ink);
  -webkit-text-fill-color: var(--ink);
  opacity: 1;
}

.auth-account-switch {
  display: block;
  margin-top: 18px;
  text-align: center;
  font-size: 0.85rem;
}

.form-control,
.input-group-text,
.btn {
  border-radius: 12px;
}

.form-control,
.input-group-text {
  background-color: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}

.form-control:focus {
  background-color: var(--surface);
  color: var(--ink);
  border-color: var(--brand);
  box-shadow: 0 0 0 0.25rem rgba(245, 130, 32, 0.18);
}

.form-control::placeholder {
  color: var(--muted);
}

.text-secondary {
  color: var(--muted) !important;
}

.btn-primary {
  --bs-btn-bg: var(--brand);
  --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand-dark);
  --bs-btn-hover-border-color: var(--brand-dark);
  --bs-btn-active-bg: var(--brand-dark);
  --bs-btn-active-border-color: var(--brand-dark);
}

.app-layout {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 280px 1fr;
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  background: var(--sidebar);
  color: var(--ink);
  padding: 24px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line);
  box-shadow: 12px 0 38px rgba(245, 130, 32, 0.06);
}

.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--ink);
  text-decoration: none;
  margin-bottom: 34px;
}

.sidebar-brand strong,
.sidebar-brand small {
  display: block;
}

.sidebar-brand small {
  color: var(--muted);
  font-size: 0.74rem;
}

.sidebar-nav {
  display: grid;
  gap: 8px;
  overflow-y: auto;
  padding-right: 4px;
}

.sidebar-nav a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 46px;
  padding: 11px 13px;
  color: var(--muted);
  text-decoration: none;
  border-radius: 14px;
  transition: background 0.2s, color 0.2s;
}

.sidebar-nav a:hover,
.sidebar-nav a.active {
  background: linear-gradient(135deg, rgba(245, 130, 32, 0.12), rgba(247, 200, 75, 0.16));
  color: var(--brand-dark);
}

.sidebar-footer {
  margin-top: auto;
  padding: 16px;
  border-radius: 16px;
  background: var(--soft);
  border: 1px solid var(--line);
}

.sidebar-footer p {
  color: var(--muted);
  font-size: 0.75rem;
}

.sidebar-footer small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.75rem;
}

.sidebar-business-switcher {
  display: grid;
  gap: 8px;
  padding: 14px;
  margin: -12px 0 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--soft);
}

.sidebar-business-switcher label {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sidebar-business-switcher .form-select {
  min-height: 42px;
  border-color: var(--line);
  border-radius: 12px;
  background-color: var(--surface);
  color: var(--ink);
  font-weight: 800;
}

.accounting-nav {
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

/* Navigation follows the business's enabled-module catalog order in the DOM. */
.accounting-nav .customize-modules-link { border-top: 1px solid var(--line); margin-top: 8px; }
.module-preference-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.module-preference-item { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); cursor: pointer; }
.module-preference-item span { display: flex; align-items: center; gap: 8px; }
.module-preference-item small { padding: 2px 7px; border-radius: 5px; background: var(--surface-muted); color: var(--muted); font-size: 10px; }
.settings-action-card { color: inherit; text-decoration: none; }

.accounting-nav .workspace-back-link {
  margin-top: 12px;
  border-top: 1px solid var(--line);
  border-radius: 0 0 12px 12px;
  color: var(--brand-dark);
}

.accounting-nav > a.kiwi-nav-help {
  margin-top: 8px;
  border-top: 1px solid var(--line);
}

.accounting-nav a span {
  margin-left: auto;
  min-width: 24px;
  padding: 2px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 0.74rem;
  text-align: center;
}

.main-panel {
  min-width: 0;
}

.topbar {
  min-height: 82px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 28px;
  background: var(--topbar);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(12px);
  position: sticky;
  top: 0;
  z-index: 20;
}

.topbar-logo {
  width: 44px;
  height: 44px;
  object-fit: contain;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 12px 24px rgba(245, 130, 32, 0.12);
}

.user-menu {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
}

.theme-toggle {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 9px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink);
  font-weight: 700;
  font-size: 0.84rem;
  box-shadow: 0 12px 28px var(--shadow);
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.2s;
}

.theme-toggle:hover {
  border-color: rgba(245, 130, 32, 0.48);
  color: var(--brand-dark);
  transform: translateY(-1px);
}

.auth-theme-toggle {
  position: fixed;
  top: 22px;
  right: 22px;
  z-index: 10;
}

.avatar {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--brand), var(--yellow));
  color: #fff;
  font-weight: 800;
}

.content-wrap {
  padding: 28px;
}

.hero-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 30px;
  margin-bottom: 24px;
  border-radius: 24px;
  color: #fff;
  background:
    radial-gradient(circle at right top, rgba(247, 200, 75, 0.4), transparent 32%),
    linear-gradient(135deg, var(--brand) 0%, #e87514 54%, var(--green-dark) 100%);
}

.hero-panel h2 {
  font-weight: 800;
  letter-spacing: -0.04em;
}

.hero-panel p {
  max-width: 680px;
  color: rgba(255, 255, 255, 0.82);
  margin-bottom: 0;
}

.metric-card,
.panel-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 16px 42px var(--shadow);
}

.modal-content {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  color: var(--ink);
}

.modal-header,
.modal-footer {
  border-color: var(--line);
}

.business-manager {
  border-radius: 18px;
}

.business-table-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px;
  margin-bottom: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-alt);
}

.business-search {
  position: relative;
  flex: 1 1 320px;
}

.business-search i {
  position: absolute;
  top: 50%;
  left: 14px;
  color: var(--muted);
  transform: translateY(-50%);
  pointer-events: none;
}

.business-search .form-control {
  min-height: 44px;
  padding-left: 42px;
  border-radius: 12px;
  background: var(--surface);
}

.business-table-controls {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 800;
}

.business-table-controls .form-select {
  width: 82px;
  min-height: 44px;
  border-color: var(--line);
  border-radius: 12px;
  background-color: var(--surface);
  color: var(--ink);
  font-weight: 800;
}

.business-avatar {
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--green), var(--brand));
  color: #fff;
  font-weight: 800;
}

.business-table-wrap {
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
}

.business-table {
  margin-bottom: 0;
  min-width: 920px;
}

.business-table thead th {
  color: var(--muted);
  background: var(--surface-alt);
  border-bottom: 1px solid var(--line);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.business-table tbody tr {
  border-bottom: 1px solid var(--line);
  transition: background 0.2s, box-shadow 0.2s;
}

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

.business-table tbody tr:hover,
.business-table .active-business-row {
  background: rgba(76, 143, 23, 0.06);
}

.business-cell {
  display: flex;
  min-width: 300px;
  align-items: center;
  gap: 12px;
}

.business-cell strong,
.business-cell span,
.business-cell small {
  display: block;
  overflow-wrap: anywhere;
}

.business-cell span,
.business-cell small {
  color: var(--muted);
  font-size: 0.8rem;
}

.business-name-link {
  display: inline-block;
  color: var(--ink);
  font-weight: 800;
  text-decoration: none;
}

.business-name-link:hover {
  color: var(--brand-dark);
}

.business-table-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.business-table-actions .btn {
  min-height: 38px;
  padding: 7px 11px;
  border-radius: 10px;
  font-weight: 800;
}

.business-table-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-top: 16px;
  color: var(--muted);
  font-size: 0.9rem;
}

.business-pagination {
  display: flex;
  align-items: center;
  gap: 6px;
}

.business-pagination .btn {
  min-width: 36px;
  min-height: 36px;
  padding: 6px 10px;
  border-color: var(--line);
  border-radius: 10px;
  font-weight: 800;
}

.empty-table-state {
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 34px 16px;
  color: var(--muted);
  text-align: center;
}

.empty-table-state i {
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: var(--soft);
  color: var(--brand);
}

.empty-table-state strong {
  color: var(--ink);
}

.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--ink);
  --bs-table-border-color: var(--line);
}

.dropdown-menu {
  --bs-dropdown-bg: var(--surface);
  --bs-dropdown-color: var(--ink);
  --bs-dropdown-link-color: var(--ink);
  --bs-dropdown-link-hover-bg: var(--soft);
  --bs-dropdown-link-hover-color: var(--brand-dark);
  --bs-dropdown-border-color: var(--line);
}

.text-primary,
.text-info {
  color: var(--brand) !important;
}

.text-success {
  color: var(--green) !important;
}

.bg-primary-subtle,
.bg-info-subtle {
  background-color: rgba(245, 130, 32, 0.13) !important;
}

.bg-success-subtle {
  background-color: rgba(76, 143, 23, 0.13) !important;
}

.bg-warning-subtle {
  background-color: rgba(247, 200, 75, 0.2) !important;
}

.text-bg-primary {
  background-color: var(--brand) !important;
}

.text-bg-success {
  background-color: var(--green) !important;
}

.metric-icon {
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  border-radius: 14px;
  margin-bottom: 18px;
}

.metric-card p {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 0.88rem;
}

.metric-card h3 {
  font-weight: 800;
  letter-spacing: -0.04em;
  margin-bottom: 8px;
  overflow-wrap: anywhere;
}

.table > :not(caption) > * > * {
  padding: 15px 14px;
}

.task-item {
  display: flex;
  gap: 14px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.task-item:last-child {
  border-bottom: 0;
}

.task-item p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.business-workspace {
  background: var(--soft);
}

.workspace-shell {
  display: grid;
  grid-template-columns: 260px 1fr;
  min-height: calc(100vh - 82px);
}

.workspace-menu {
  background: var(--surface-alt);
  border-right: 1px solid var(--line);
  padding: 22px 18px;
}

.workspace-close {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  color: var(--muted);
  font-weight: 800;
  text-decoration: none;
}

.workspace-close:hover {
  color: var(--brand-dark);
}

.workspace-business {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
}

.workspace-business strong,
.workspace-business small {
  display: block;
}

.workspace-business small {
  color: var(--muted);
}

.workspace-menu nav {
  display: grid;
  gap: 6px;
}

.workspace-menu nav a {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 46px;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--muted);
  font-weight: 800;
  text-decoration: none;
}

.workspace-menu nav a:hover,
.workspace-menu nav a.active {
  background: var(--surface);
  color: var(--brand-dark);
  box-shadow: 0 10px 24px var(--shadow);
}

.workspace-menu nav a span {
  margin-left: auto;
  padding: 2px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: 0.75rem;
}

.workspace-content {
  min-width: 0;
  padding: 28px;
}

.workspace-header,
.workspace-section-title,
.module-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.workspace-header {
  padding: 20px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
}

.workspace-header h2,
.module-panel-header h3 {
  margin: 0;
  font-weight: 800;
}

.workspace-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.workspace-section-title {
  padding: 16px 20px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
  color: var(--muted);
}

.workspace-section-title span {
  color: var(--brand);
}

.workspace-section-title strong {
  margin-right: auto;
  color: var(--ink);
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  padding: 24px 28px 34px;
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: #f2f2f2;
}

.summary-grid h3 {
  margin: 0 0 18px;
  color: #cfcfcf;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 900;
}

.statement-card,
.module-panel,
.report-card,
.settings-grid article {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 14px 34px var(--shadow);
}

.statement-card {
  margin-bottom: 22px;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(37, 32, 25, 0.08);
}

.statement-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 66px;
  padding: 18px 20px;
  background: #fffef7;
  border-bottom: 1px solid var(--line);
  font-size: 1.08rem;
  font-weight: 900;
}

.statement-card header span {
  color: var(--ink);
  font-weight: 900;
}

.statement-card-body {
  min-height: 64px;
  padding: 18px 20px 20px;
  background: var(--surface);
}

.statement-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  min-height: 28px;
  padding: 3px 0;
  font-weight: 700;
}

.statement-line.group-line {
  font-weight: 900;
}

.statement-line.depth-1 {
  padding-left: 24px;
}

.statement-line.depth-2 {
  padding-left: 42px;
}

.statement-line.depth-3 {
  padding-left: 60px;
}

.statement-line.depth-4 {
  padding-left: 78px;
}

.statement-line-label {
  color: var(--ink);
}

.statement-line.muted,
.statement-line span {
  color: var(--muted);
}

.statement-line .statement-line-label {
  color: var(--ink);
}

.statement-line span.has-value {
  color: #3c90ca;
  font-weight: 900;
}

.summary-value-button {
  appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: #3c90ca;
  font: inherit;
  font-weight: 900;
  line-height: inherit;
  text-align: right;
  cursor: pointer;
}

.statement-card header .summary-value-button {
  color: var(--ink);
}

.summary-value-button:hover {
  color: var(--brand);
  text-decoration: underline;
}

.summary-total-card .statement-card-body {
  display: none;
}

.summary-transactions-modal .modal-dialog {
  max-width: 1180px;
}

.summary-transactions-body {
  display: grid;
  gap: 16px;
  padding: 22px 26px 28px;
}

.summary-transactions-total {
  display: inline-grid;
  grid-template-columns: auto minmax(100px, auto);
  justify-self: start;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.summary-transactions-total span,
.summary-transactions-total strong {
  min-height: 38px;
  padding: 8px 14px;
  background: var(--surface-alt);
  font-weight: 900;
}

.summary-transactions-total strong {
  border-left: 1px solid var(--line);
  background: var(--surface);
  text-align: right;
}

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

.summary-transactions-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
}

.summary-transactions-table th,
.summary-transactions-table td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.summary-transactions-table th {
  color: var(--muted);
  background: var(--surface-alt);
  font-weight: 900;
}

.summary-transactions-table tbody tr:hover {
  background: rgba(247, 128, 24, 0.04);
}

.module-panel {
  padding: 22px;
}

.module-table-placeholder {
  display: grid;
  grid-template-columns: 140px 140px 1fr 120px 120px;
  gap: 0;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
}

.module-table-placeholder div {
  padding: 13px;
  background: var(--surface-alt);
  color: var(--muted);
  font-weight: 800;
}

.module-table-placeholder span {
  grid-column: 1 / -1;
  padding: 36px;
  color: var(--muted);
  text-align: center;
}

.report-grid,
.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
}

.reports-breadcrumb {
  margin-bottom: 1.35rem;
}

.reports-catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.55rem 1.35rem;
}

.reports-catalog-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 8px 20px rgba(37, 32, 25, 0.05);
}

.reports-catalog-card header {
  padding: 1.45rem 1.85rem;
  border-bottom: 1px solid var(--line);
  background: var(--surface-alt);
  color: #cfcfcf;
  font-size: 1.18rem;
  font-weight: 900;
}

.reports-catalog-list {
  display: grid;
}

.reports-catalog-list a {
  padding: 0.85rem 1.85rem;
  border-bottom: 1px solid var(--line);
  color: #2f8cca;
  font-weight: 700;
  text-decoration: none;
}

.reports-catalog-list a:last-child {
  border-bottom: 0;
}

.reports-catalog-list a:hover,
.reports-catalog-list a:focus {
  background: rgba(47, 140, 202, 0.08);
  color: #1d6fa4;
}

.report-card,
.settings-grid article {
  display: grid;
  gap: 8px;
  padding: 20px;
}

.report-card i,
.settings-grid i {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  background: var(--surface-alt);
  color: var(--brand);
}

.report-card strong,
.settings-grid strong {
  font-size: 1rem;
}

.report-card span,
.settings-grid span,
.account-group-row span {
  color: var(--muted);
  font-size: 0.88rem;
}

.account-group-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.account-group-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-alt);
}

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

.account-stat-grid article {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: 0 14px 34px var(--shadow);
}

.account-stat-grid span,
.table-count-pill {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.account-stat-grid strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 1.8rem;
  line-height: 1;
}

.account-table-panel .module-panel-header {
  margin-bottom: 8px;
}

.table-count-pill {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface-alt);
}

.chart-account-name {
  display: grid;
  gap: 4px;
}

.chart-account-name span {
  color: var(--muted);
  font-size: 0.88rem;
}

.account-type-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 800;
}

.account-type-asset {
  background: rgba(37, 99, 235, 0.12);
  color: #2563eb;
}

.account-type-liability {
  background: rgba(220, 38, 38, 0.12);
  color: #dc2626;
}

.account-type-equity {
  background: rgba(124, 58, 237, 0.12);
  color: #7c3aed;
}

.account-type-income {
  background: rgba(22, 163, 74, 0.14);
  color: #15803d;
}

.account-type-expense {
  background: rgba(245, 158, 11, 0.16);
  color: #b45309;
}

.status-pill.inactive {
  background: rgba(107, 114, 128, 0.14);
  color: var(--muted);
}

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

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

.manager-chart-content {
  background: var(--surface-alt);
}

.manager-breadcrumb {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 70px;
  margin-bottom: 20px;
  padding: 0 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: #c8c8c8;
  font-size: 1rem;
  font-weight: 700;
}

.manager-breadcrumb a {
  color: var(--brand);
  text-decoration: none;
}

.manager-breadcrumb span {
  color: var(--muted);
}

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

.manager-chart-panel,
.manager-form-card {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.manager-chart-panel header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 66px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-alt);
}

.manager-chart-panel h3,
.manager-form-card h2 {
  margin: 0;
  color: #cfcfcf;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.15;
}

.manager-chart-actions {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 10px;
  white-space: nowrap;
}

.manager-chart-actions .btn,
.manager-secondary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(247, 128, 24, 0.22);
  border-radius: 10px;
  background: linear-gradient(135deg, #fff8ed, #e9f4ff);
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 900;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.manager-chart-actions .btn:hover,
.manager-secondary-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(247, 128, 24, 0.16);
  color: var(--brand);
}

.manager-chart-actions .manager-new-account-btn {
  background: #ffffff;
  border-color: var(--line);
  box-shadow: none;
}

.manager-chart-actions .manager-new-account-btn:hover {
  background: #ffffff;
  border-color: var(--brand);
}

@media (max-width: 1400px) {
  .manager-chart-grid {
    gap: 14px;
  }

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

  .manager-chart-panel header {
    gap: 10px;
    min-height: 62px;
    padding: 12px 14px;
  }

  .manager-chart-panel h3 {
    font-size: 0.88rem;
    line-height: 1.1;
  }

  .manager-chart-actions {
    gap: 7px;
  }

  .manager-chart-actions .btn {
    min-height: 34px;
    padding: 0 10px;
    border-radius: 9px;
    font-size: 0.78rem;
    line-height: 1;
  }
}

@media (max-width: 1180px) and (min-width: 992px) {
  .manager-chart-panel header {
    align-items: flex-start;
    flex-direction: column;
    min-height: 102px;
  }

  .manager-chart-actions {
    justify-content: flex-start;
    width: 100%;
  }
}

.manager-row-edit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: transparent;
  font-size: 0.9rem;
  font-weight: 700;
}

.manager-row-edit-btn:hover {
  border-color: var(--brand);
  background: transparent;
  color: var(--brand);
}

.manager-row-delete-form {
  margin: 0;
}

.manager-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.manager-row-move-form {
  margin: 0;
}

.manager-row-move-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--brand);
  background: transparent;
}

.manager-row-move-btn.group-move {
  color: #2f8fd3;
}

.manager-row-move-btn.group-move:hover {
  border-color: #2f8fd3;
  color: #1f6fa8;
  background: transparent;
}

.manager-row-move-btn.account-move {
  color: var(--brand);
}

.manager-row-move-btn.account-move:hover {
  border-color: var(--brand);
  color: var(--brand-dark);
  background: transparent;
}

.manager-row-delete-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  min-height: 28px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: #cc4a4a;
  background: transparent;
}

.manager-row-delete-btn:hover {
  border-color: #cc4a4a;
  color: #cc4a4a;
  background: transparent;
}

.manager-chart-table {
  display: grid;
}

.manager-chart-heading,
.manager-chart-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 124px;
  align-items: center;
  min-height: 54px;
  border-bottom: 1px solid var(--line);
}

.manager-chart-heading {
  background: var(--surface-alt);
  color: var(--muted);
  font-weight: 800;
}

.manager-chart-heading > *,
.manager-chart-row > * {
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 14px;
  border-right: 1px solid var(--line);
}

.manager-chart-heading > *:last-child,
.manager-chart-row > *:last-child {
  justify-content: center;
  border-right: 0;
}

.manager-chart-row.group .manager-row-name strong,
.manager-chart-row.total .manager-row-name strong {
  font-weight: 900;
}

.manager-row-name {
  gap: 8px;
}

.manager-row-name.indented {
  padding-left: 38px;
}

.manager-chart-row.depth-2 .manager-row-name {
  padding-left: 62px;
}

.manager-chart-row.depth-3 .manager-row-name {
  padding-left: 104px;
}

.manager-chart-row.account.depth-3 .manager-row-name {
  padding-left: 124px;
}

.manager-chart-row.account .manager-row-name span {
  font-weight: 500;
}

.manager-row-name small {
  color: var(--muted);
  font-weight: 700;
}

.manager-sort-icon {
  color: #9cc5df;
}

.manager-form-card header {
  padding: 26px 34px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-alt);
}

.manager-form-card h2 i {
  margin-left: 8px;
  color: #bdbdbd;
  font-size: 0.92rem;
}

.manager-form-body {
  display: grid;
  grid-template-columns: minmax(240px, 520px) minmax(160px, 220px);
  gap: 24px 18px;
  padding: 28px 34px 34px;
}

.manager-field {
  display: grid;
  gap: 10px;
}

.manager-field.wide,
.manager-group-field,
.manager-check {
  grid-column: 1 / -1;
}

.manager-field label,
.manager-check label {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 800;
}

.manager-field .form-control,
.manager-field .form-select {
  min-height: 50px;
  border-color: var(--line);
  border-radius: 8px;
  font-size: 1rem;
}

.manager-group-selects {
  display: inline-grid;
  grid-template-columns: auto minmax(180px, 260px) auto minmax(220px, 320px);
  align-items: center;
  width: fit-content;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.manager-group-selects span {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  padding: 0 16px;
  border-right: 1px solid var(--line);
  color: var(--ink);
}

.manager-group-selects .form-select {
  min-height: 50px;
  border: 0;
  border-radius: 0;
}

.manager-check {
  display: flex;
  align-items: center;
  gap: 10px;
}

.manager-check .form-check-input {
  width: 22px;
  height: 22px;
  margin: 0;
}

.manager-form-card footer {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 82px;
  padding: 18px 34px;
  border-top: 1px solid var(--line);
  background: var(--surface-alt);
}

.manager-primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 24px;
  font-weight: 900;
}

.customer-board > header .manager-primary-button,
.bank-account-board .manager-primary-button,
.reconciliation-board .manager-primary-button,
.wht-board .manager-primary-button {
  min-height: 36px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 0.9rem;
  line-height: 1;
  white-space: nowrap;
}

.manager-reset-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 24px;
  border-radius: 12px;
  font-weight: 900;
}

.manager-chart-modal .modal-content {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  color: var(--ink);
  box-shadow: 0 24px 70px rgba(37, 32, 25, 0.18);
}

.manager-chart-modal .modal-header,
.manager-chart-modal .modal-footer {
  border-color: var(--line);
  background: var(--surface-alt);
}

.manager-chart-modal .modal-header {
  align-items: flex-start;
  padding: 22px 26px;
}

.manager-chart-modal .modal-title {
  margin: 0;
  font-weight: 900;
}

.manager-modal-body {
  display: grid;
  gap: 18px;
  padding: 24px 26px 28px;
}

.manager-account-modal-body {
  grid-template-columns: minmax(0, 1fr) 160px;
}

.manager-account-modal-body .manager-group-field {
  grid-column: 1 / -1;
}

.manager-chart-modal .modal-footer {
  justify-content: flex-start;
  gap: 12px;
  padding: 16px 26px;
}

.journal-board {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.journal-board > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-alt);
}

.journal-board h2 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 900;
}

.journal-summary-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}

.journal-summary-strip article {
  display: grid;
  gap: 4px;
  padding: 18px 24px;
  border-right: 1px solid var(--line);
}

.journal-summary-strip article:last-child {
  border-right: 0;
}

.journal-summary-strip span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.journal-summary-strip strong {
  font-size: 1.35rem;
  font-weight: 900;
}

.journal-table-wrap {
  overflow-x: auto;
}

.journal-table {
  width: 100%;
  min-width: 880px;
  border-collapse: collapse;
}

.journal-table th,
.journal-table td {
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.journal-table th {
  color: var(--muted);
  background: var(--surface-alt);
  font-weight: 900;
}

.journal-table tbody tr:hover {
  background: rgba(247, 128, 24, 0.04);
}

.journal-empty {
  color: var(--muted);
  font-weight: 800;
  text-align: center;
}

.journal-status {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(73, 159, 58, 0.12);
  color: #2c7d1f;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: capitalize;
}

.journal-status.out_of_balance {
  background: rgba(220, 74, 74, 0.12);
  color: #c64343;
}

.journal-entry-modal .modal-dialog {
  max-width: 980px;
}

.journal-form-body {
  display: grid;
  gap: 22px;
  padding: 24px 28px;
}

.journal-form-grid {
  display: grid;
  grid-template-columns: 220px 280px minmax(0, 1fr);
  gap: 14px;
}

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

.journal-line-editor {
  display: grid;
  gap: 8px;
}

.journal-line-head,
.journal-line-row {
  display: grid;
  grid-template-columns: 64px minmax(240px, 1fr) 160px 160px 56px;
  gap: 8px;
  align-items: center;
}

.journal-line-editor.show-description .journal-line-head,
.journal-line-editor.show-description .journal-line-row {
  grid-template-columns: 64px minmax(220px, 1fr) minmax(180px, 0.8fr) 150px 150px 56px;
}

.journal-line-editor.show-qty .journal-line-head,
.journal-line-editor.show-qty .journal-line-row {
  grid-template-columns: 64px minmax(220px, 1fr) 92px 150px 150px 56px;
}

.journal-line-editor.show-description.show-qty .journal-line-head,
.journal-line-editor.show-description.show-qty .journal-line-row {
  grid-template-columns: 64px minmax(200px, 1fr) minmax(160px, 0.8fr) 82px 140px 140px 56px;
}

.journal-description-column,
.journal-qty-column {
  display: none;
}

.journal-line-editor.show-description .journal-description-column,
.journal-line-editor.show-qty .journal-qty-column {
  display: block;
}

.journal-line-head {
  color: var(--muted);
  font-weight: 900;
}

.journal-account-control {
  position: relative;
  min-width: 0;
}

.journal-account-control .form-select {
  padding-right: 104px;
}

.journal-account-group-note {
  position: absolute;
  top: 50%;
  right: 34px;
  max-width: 88px;
  overflow: hidden;
  color: #9a9a9a;
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
  transform: translateY(-50%);
  pointer-events: none;
}

.journal-line-handle,
.journal-remove-line {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border-color: var(--line);
  color: var(--muted);
  background: #fff;
}

.journal-remove-line {
  color: #c9c9c9;
  font-size: 1.2rem;
}

.journal-money-input {
  text-align: right;
}

.journal-qty-input {
  text-align: right;
}

.journal-add-line {
  justify-self: start;
  margin-top: 8px;
  font-weight: 800;
}

.journal-totals {
  display: grid;
  grid-template-columns: minmax(312px, 1fr) 160px 160px 56px;
  gap: 8px;
  align-items: center;
  max-width: calc(100% - 72px);
  margin-left: 72px;
}

.journal-totals span,
.journal-totals strong {
  min-height: 42px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-alt);
  font-weight: 900;
  text-align: right;
}

.journal-totals span {
  color: var(--muted);
  text-align: left;
}

.journal-balance-pill {
  display: inline-grid;
  grid-template-columns: auto 96px;
  align-items: stretch;
  justify-self: start;
  margin-top: 8px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.journal-balance-pill span,
.journal-balance-pill strong {
  min-height: 40px;
  padding: 8px 14px;
  background: var(--surface-alt);
  font-weight: 900;
}

.journal-balance-pill strong {
  border-left: 1px solid var(--line);
  background: var(--surface);
  text-align: right;
}

.journal-options {
  display: grid;
  gap: 14px;
}

.journal-options label {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--muted);
  font-weight: 900;
}

.journal-image-field {
  min-width: 0;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.journal-image-field legend {
  float: none;
  width: auto;
  margin: 0;
  padding: 0 12px;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 900;
}

.journal-view-shell {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-alt);
}

.journal-view-toolbar {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
}

.journal-view-toolbar h2 {
  margin: 0;
  color: #cfcfcf;
  font-size: 1.05rem;
  font-weight: 900;
}

.journal-view-toolbar > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.journal-view-toolbar .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 18px;
  border-color: var(--line);
  font-weight: 900;
}

.journal-toolbar-divider {
  width: 1px;
  height: 34px;
  margin: 0 8px;
  background: var(--line);
}

.journal-print-card {
  width: min(100%, 980px);
  min-height: 560px;
  margin: 24px;
  padding: 42px 46px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: #1f1f1f;
  box-shadow: 0 18px 36px rgba(37, 32, 25, 0.1);
}

.journal-print-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 40px;
  align-items: start;
  margin-bottom: 42px;
}

.journal-print-heading h1 {
  margin: 0;
  font-size: 2.6rem;
  font-weight: 900;
  letter-spacing: 0;
}

.journal-print-meta {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 22px;
}

.journal-print-meta > div:last-child {
  padding-left: 24px;
  border-left: 1px solid #1f1f1f;
}

.journal-print-meta strong,
.journal-print-meta span {
  display: block;
}

.journal-print-meta strong {
  font-size: 1rem;
  font-weight: 900;
}

.journal-print-meta span {
  font-size: 1rem;
}

.journal-print-narration {
  margin: -22px 0 28px;
  color: #505050;
  font-weight: 700;
}

.journal-print-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #1f1f1f;
}

.journal-print-table th,
.journal-print-table td {
  padding: 10px 12px;
  border-left: 1px solid #1f1f1f;
  border-right: 1px solid #1f1f1f;
  vertical-align: top;
}

.journal-print-table th {
  border-bottom: 1px solid #1f1f1f;
  font-size: 1rem;
  font-weight: 900;
}

.journal-print-table tbody td {
  min-height: 38px;
}

.journal-print-table small {
  display: block;
  color: #666;
  font-size: 0.82rem;
}

.journal-print-table tfoot td {
  border-top: 1px solid #1f1f1f;
  font-weight: 900;
}

.journal-unbalanced-stamp {
  width: max-content;
  margin: 24px auto 0;
  padding: 10px 18px;
  border: 5px solid #ff0808;
  color: #ff0808;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0;
}

.customer-board,
.customer-view-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.customer-board > header,
.customer-view-card > header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: var(--surface-alt);
  border-bottom: 1px solid var(--line);
}

.customer-board h2,
.customer-view-card h2 {
  margin: 0;
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 800;
}

.customer-search {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.customer-search span {
  color: var(--muted);
  font-weight: 700;
  white-space: nowrap;
}

.customer-search .form-control {
  width: min(18rem, 28vw);
}

.customer-table-wrap {
  overflow-x: auto;
}

.customer-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}

.customer-table th,
.customer-table td {
  padding: 1rem 1.1rem;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}

.customer-table th {
  background: var(--surface);
  color: var(--muted);
  font-weight: 800;
}

.customer-table td:first-child,
.customer-table td:nth-child(2),
.customer-table th:first-child,
.customer-table th:nth-child(2) {
  width: 6rem;
  text-align: center;
}

.customer-table td:last-child,
.customer-table th:last-child {
  width: 6rem;
}

.customer-table tbody tr:hover {
  background: rgba(248, 126, 26, 0.04);
}

.customer-table td strong {
  display: block;
  color: var(--ink);
  font-weight: 800;
}

.customer-table td small {
  display: block;
  color: var(--muted);
  margin-top: 0.2rem;
}

.customer-table tfoot td {
  background: var(--surface-alt);
  color: var(--muted);
  font-weight: 800;
}

.customer-money-link {
  color: var(--brand);
  font-weight: 800;
}

.customer-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.75rem;
  border-radius: 0.35rem;
  padding: 0.3rem 0.7rem;
  font-size: 0.86rem;
  font-weight: 800;
}

.customer-status.paid {
  color: #fff;
  background: #0ac75a;
}

.customer-status.cancelled {
  color: #fff;
  background: #df4b4b;
}

.customer-empty {
  color: var(--muted);
  font-weight: 700;
  text-align: center;
}

.customer-form-grid {
  display: grid;
  grid-template-columns: minmax(16rem, 2fr) minmax(10rem, 0.8fr) minmax(10rem, 0.8fr);
  gap: 1.25rem;
}

.customer-form-grid .wide,
.customer-email-field,
.customer-check,
.customer-image-field {
  grid-column: 1 / -1;
}

.customer-form-grid textarea.form-control {
  min-height: 8rem;
}

.customer-check {
  align-items: center;
  margin-top: 0.25rem;
}

.bank-account-form-card form {
  display: grid;
  gap: 1.5rem;
}

.bank-account-form-grid {
  align-items: start;
}

.bank-account-form-actions,
.bank-account-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}

.bank-account-toolbar {
  justify-content: flex-end;
  padding: 1.25rem 1.5rem;
  background: var(--surface-alt);
}

.bank-account-toolbar .btn {
  min-height: 38px;
  color: var(--muted);
}

.bank-account-count {
  margin-right: auto;
  min-width: 54px;
  min-height: 38px;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  color: var(--muted);
  font-weight: 700;
}

.receipt-form-body {
  background: var(--surface-alt);
}

.receipt-form-paper,
.receipt-print-card {
  max-width: 1120px;
  margin: 0 auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 2rem;
  box-shadow: var(--shadow-sm);
}

.receipt-form-head,
.receipt-print-heading {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) minmax(22rem, 0.9fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 1.5rem;
}

.receipt-form-head h3,
.receipt-print-heading h1 {
  margin: 0 0 0.75rem;
  color: var(--ink);
  font-size: 2.4rem;
  font-weight: 900;
  letter-spacing: 0;
}

.receipt-form-meta,
.receipt-payer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(12rem, 1fr));
  gap: 1rem;
}

.receipt-payer-grid,
.receipt-description-field {
  margin-bottom: 1.25rem;
}

.receipt-line-table-wrap {
  overflow-x: auto;
  margin: 1.25rem 0 1rem;
}

.receipt-line-table {
  width: 100%;
  min-width: 1080px;
  border-collapse: separate;
  border-spacing: 0 0.5rem;
}

.receipt-line-table th {
  color: var(--muted);
  font-weight: 800;
  padding: 0 0.35rem;
}

.receipt-line-table td {
  padding: 0 0.35rem;
  vertical-align: top;
}

.receipt-line-table .form-control,
.receipt-line-table .form-select {
  min-height: 3.25rem;
}

.receipt-line-table textarea.form-control {
  min-height: 3.25rem;
  resize: vertical;
}

.receipt-line-number {
  width: 2.5rem;
  padding-top: 0.9rem !important;
  color: var(--ink);
  font-weight: 900;
  text-align: center;
}

.receipt-form-total {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
  font-size: 1.25rem;
}

.receipt-form-total span {
  color: var(--muted);
  font-weight: 800;
}

.receipt-form-total strong {
  color: var(--brand);
  font-size: 1.6rem;
  font-weight: 900;
}

.receipt-meta-grid {
  display: grid;
  grid-template-columns: minmax(8rem, 0.75fr) minmax(12rem, 1fr);
  gap: 0.8rem 1.5rem;
  padding-left: 1.5rem;
  border-left: 1px solid var(--ink);
}

.receipt-meta-grid div {
  display: grid;
  gap: 0.25rem;
}

.receipt-meta-grid strong {
  color: var(--ink);
  font-weight: 900;
}

.receipt-meta-grid span {
  color: var(--ink);
}

.receipt-business-side {
  grid-row: 1 / span 2;
  grid-column: 2;
}

.receipt-print-description {
  margin: 2rem 0 1.25rem;
  color: var(--ink);
  font-weight: 800;
}

.receipt-print-table {
  width: 100%;
}

.receipt-print-table th,
.receipt-print-table td {
  border: 1px solid var(--ink);
}

.reconciliation-content {
  display: grid;
  gap: 1.2rem;
}

.reconciliation-board header {
  align-items: center;
  min-height: 5.5rem;
}

.reconciliation-form-body {
  background: var(--surface-alt);
}

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

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

.reconciliation-table th,
.reconciliation-table td {
  vertical-align: middle;
}

.reconciliation-print-card {
  max-width: 1120px;
  margin: 0 auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 2.25rem;
  box-shadow: var(--shadow-sm);
}

.reconciliation-print-heading {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) minmax(22rem, 0.85fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 2rem;
}

.reconciliation-print-heading h1 {
  margin: 0 0 0.75rem;
  color: var(--ink);
  font-size: 2.35rem;
  font-weight: 900;
  letter-spacing: 0;
}

.reconciliation-print-heading strong {
  color: var(--ink);
}

.reconciliation-meta-grid {
  display: grid;
  grid-template-columns: minmax(8rem, 0.8fr) minmax(12rem, 1fr);
  gap: 0.75rem 1.4rem;
  padding-left: 1.5rem;
  border-left: 1px solid var(--ink);
}

.reconciliation-meta-grid div {
  display: grid;
  gap: 0.25rem;
}

.reconciliation-business-side {
  grid-row: 1 / span 2;
  grid-column: 2;
}

.reconciliation-print-table {
  width: min(100%, 760px);
  margin-left: auto;
}

.reconciliation-print-table th,
.reconciliation-print-table td {
  border: 1px solid var(--ink);
  padding: 0.95rem 1rem;
}

.reconciliation-print-table th {
  width: 55%;
  color: var(--ink);
  font-weight: 900;
}

.reconciliation-print-description {
  margin: 2rem 0 0;
  color: var(--ink);
  font-weight: 700;
  white-space: pre-line;
}

.wht-content {
  display: grid;
  gap: 1.2rem;
}

.wht-board header {
  align-items: center;
  min-height: 5.5rem;
}

.wht-form-body {
  background: var(--surface-alt);
}

.wht-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

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

.wht-table th,
.wht-table td {
  vertical-align: middle;
}

.wht-print-card {
  max-width: 1120px;
  margin: 0 auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 2.25rem;
  box-shadow: var(--shadow-sm);
}

.wht-print-heading {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) minmax(22rem, 0.85fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 2rem;
}

.wht-print-heading h1 {
  margin: 0 0 0.75rem;
  color: var(--ink);
  font-size: 2.35rem;
  font-weight: 900;
  letter-spacing: 0;
}

.wht-meta-grid {
  display: grid;
  grid-template-columns: minmax(8rem, 0.8fr) minmax(12rem, 1fr);
  gap: 0.75rem 1.4rem;
  padding-left: 1.5rem;
  border-left: 1px solid var(--ink);
}

.wht-meta-grid div {
  display: grid;
  gap: 0.25rem;
}

.wht-business-side {
  grid-row: 1 / span 2;
  grid-column: 2;
}

.wht-print-table {
  width: 100%;
  margin-top: 1rem;
}

.wht-print-table th,
.wht-print-table td {
  border: 1px solid var(--ink);
  padding: 0.95rem 1rem;
  color: var(--ink);
}

.wht-print-table th {
  font-weight: 900;
}

.profit-loss-content {
  display: grid;
  gap: 1.2rem;
}

.profit-loss-form-body {
  background: var(--surface-alt);
}

.profit-loss-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

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

.profit-loss-paper {
  max-width: 1120px;
  margin: 0 auto;
  padding: 4rem 3.5rem 3rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow-sm);
  color: var(--ink);
}

.profit-loss-paper > header {
  text-align: center;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 0.75rem;
  margin-bottom: 2.5rem;
}

.profit-loss-paper > header strong {
  display: block;
  margin-bottom: 1.25rem;
  font-size: 1.25rem;
}

.profit-loss-paper h1 {
  margin: 0 0 1.25rem;
  font-size: 2rem;
  font-weight: 900;
}

.profit-loss-paper h2 {
  margin: 0 0 2rem;
  font-size: 1.3rem;
  font-weight: 900;
}

.profit-loss-column-name {
  text-align: right;
  font-size: 1.2rem;
  font-weight: 900;
}

.profit-loss-lines {
  display: grid;
  gap: 0.35rem;
}

.profit-loss-lines h3 {
  margin: 1.25rem 0 0.65rem;
  font-size: 1.15rem;
  font-weight: 900;
}

.profit-loss-row,
.profit-loss-total,
.profit-loss-net {
  display: grid;
  grid-template-columns: 1fr minmax(8rem, 12rem);
  align-items: baseline;
  gap: 1rem;
  min-height: 2.1rem;
}

.actual-budget-headings,
.actual-budget-row {
  display: grid;
  grid-template-columns: 1fr repeat(4, minmax(5.8rem, 7.5rem));
  align-items: baseline;
  gap: 0.8rem;
}

.actual-budget-headings {
  margin-top: 1.6rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--ink);
  font-weight: 900;
  text-align: right;
}

.actual-budget-headings span:first-child {
  grid-column: 2;
}

.actual-budget-row span {
  padding-left: calc(var(--depth, 1) * 1.4rem);
}

.actual-budget-row strong {
  text-align: right;
}

.actual-budget-row .profit-loss-amount-button {
  min-width: 0;
}

.actual-budget-lines {
  display: grid;
  gap: 0.45rem;
}

.actual-budget-line-row {
  display: grid;
  grid-template-columns: 38px minmax(12rem, 1fr) minmax(8rem, 0.45fr) 38px;
  gap: 0.45rem;
  align-items: center;
}

.actual-budget-sort-handle,
.actual-budget-remove-line {
  width: 38px;
  min-height: 38px;
  padding: 0;
  display: inline-grid;
  place-items: center;
}

.actual-budget-add-line {
  width: fit-content;
  margin-top: 0.6rem;
}

.balance-column-row {
  grid-template-columns: 38px minmax(9rem, 0.45fr) minmax(12rem, 1fr) 38px;
}

.cash-flow-column-row,
.equity-change-column-row,
.trial-balance-column-row {
  display: grid;
  grid-template-columns: 38px minmax(8.5rem, 0.35fr) minmax(8.5rem, 0.35fr) minmax(11rem, 1fr) 38px;
  gap: 0.45rem;
  align-items: center;
}

.balance-sheet-paper {
  --balance-columns: 1;
}

.balance-sheet-headings,
.balance-sheet-row,
.balance-sheet-total {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) repeat(var(--balance-columns), minmax(6.5rem, 8rem));
  align-items: baseline;
  gap: 0.8rem;
}

.balance-sheet-headings {
  margin-top: 1.5rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--ink);
  text-align: right;
}

.balance-sheet-lines h3 {
  margin: 2rem 0 0.8rem;
  font-size: 1rem;
  font-weight: 900;
}

.balance-sheet-row {
  min-height: 1.9rem;
}

.balance-sheet-row span {
  padding-left: calc(var(--depth, 1) * 1.4rem);
}

.balance-sheet-row.is-group span,
.balance-sheet-total span {
  font-weight: 900;
}

.balance-sheet-row strong,
.balance-sheet-total strong {
  color: #3c90ca;
  text-align: right;
  font-weight: 800;
}

.balance-sheet-total {
  margin-top: 0.35rem;
  padding-top: 0.45rem;
  border-top: 1px solid var(--ink);
  font-weight: 900;
}

.balance-sheet-total + .balance-sheet-total {
  margin-top: 1.2rem;
}

.cash-flow-subhead,
.equity-change-subhead {
  margin: 0.7rem 0 0.35rem;
  padding-left: 1.4rem;
  font-weight: 900;
}

.cash-flow-total,
.equity-change-total {
  margin-top: 0.7rem;
}

.trial-balance-paper {
  --trial-columns: 1;
  --trial-value-columns: 2;
}

.trial-balance-headings,
.trial-balance-row,
.trial-balance-separator,
.trial-balance-grand-total {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) repeat(var(--trial-value-columns), minmax(4.5rem, 6rem));
  align-items: baseline;
  gap: 0.55rem;
}

.trial-balance-headings {
  margin-top: 1.1rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--ink);
  text-align: right;
}

.trial-balance-headings strong {
  grid-column: span 2;
  text-align: center;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 0.25rem;
}

.trial-balance-headings em {
  font-style: normal;
  font-weight: 800;
  font-size: 0.78rem;
}

.trial-balance-lines h3 {
  margin: 1.45rem 0 0.45rem;
  font-size: 0.96rem;
  font-weight: 900;
}

.trial-balance-row {
  min-height: 1.55rem;
  font-size: 0.9rem;
}

.trial-balance-row span {
  padding-left: calc(var(--depth, 1) * 1.25rem);
}

.trial-balance-row strong,
.trial-balance-grand-total strong {
  color: #3c90ca;
  text-align: right;
  font-weight: 800;
}

.trial-balance-separator {
  margin: 1.4rem 0 1.1rem;
  padding: 0.45rem 0;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-weight: 900;
}

.trial-balance-grand-total {
  margin-top: 1.2rem;
  padding-top: 0.5rem;
  border-top: 2px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}

.general-ledger-summary-headings,
.general-ledger-summary-row,
.general-ledger-summary-separator,
.general-ledger-summary-total {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) repeat(5, minmax(5.6rem, 7.25rem));
  align-items: baseline;
  gap: 0.6rem;
}

.general-ledger-summary-headings {
  margin-top: 1.4rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--ink);
  text-align: right;
}

.general-ledger-summary-headings strong {
  font-size: 0.78rem;
  line-height: 1.2;
}

.general-ledger-summary-lines h3 {
  margin: 1.45rem 0 0.45rem;
  font-size: 0.96rem;
  font-weight: 900;
}

.general-ledger-summary-row {
  min-height: 1.55rem;
  font-size: 0.9rem;
}

.general-ledger-summary-row span {
  padding-left: calc(var(--depth, 1) * 1.25rem);
}

.general-ledger-summary-row strong,
.general-ledger-summary-total strong {
  color: #3c90ca;
  text-align: right;
  font-weight: 800;
}

.general-ledger-summary-row strong:first-of-type,
.general-ledger-summary-row strong:last-of-type {
  color: var(--ink);
  font-weight: 700;
}

.general-ledger-summary-separator {
  margin: 1.4rem 0 1.1rem;
  padding: 0.45rem 0;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-weight: 900;
}

.general-ledger-summary-total {
  margin-top: 1.2rem;
  padding-top: 0.5rem;
  border-top: 2px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}

.general-ledger-transaction-headings,
.general-ledger-transaction-row {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) repeat(3, minmax(5.5rem, 7rem));
  align-items: baseline;
  gap: 0.7rem;
}

.general-ledger-transaction-headings {
  margin-top: 1.4rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--ink);
  text-align: right;
}

.general-ledger-transaction-headings strong {
  font-size: 0.82rem;
}

.general-ledger-transaction-lines h3 {
  margin: 1.45rem 0 0.6rem;
  font-size: 0.98rem;
  font-weight: 900;
}

.general-ledger-transaction-row {
  min-height: 1.75rem;
  font-size: 0.9rem;
}

.general-ledger-transaction-row span {
  padding-left: 1.25rem;
}

.general-ledger-transaction-row strong {
  color: #3c90ca;
  text-align: right;
  font-weight: 800;
}

.general-ledger-transaction-row strong:last-child {
  color: var(--ink);
}

.general-ledger-transaction-row.is-opening strong:last-child {
  font-weight: 900;
}

.profit-loss-row span {
  padding-left: calc(var(--depth, 1) * 1.4rem);
}

.profit-loss-row.is-group span,
.profit-loss-total span,
.profit-loss-net span {
  font-weight: 900;
}

.profit-loss-total {
  margin-top: 0.25rem;
  font-weight: 900;
}

.profit-loss-total .profit-loss-amount-button {
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}

.profit-loss-net {
  margin-top: 2rem;
  padding: 0.7rem 0;
  border-top: 1px solid var(--ink);
  border-bottom: 1px solid var(--ink);
  font-size: 1.15rem;
  font-weight: 900;
}

.profit-loss-amount-button {
  width: 100%;
  border: 0;
  background: transparent;
  /* Keep report drill-down values aligned with the blue summary links. */
  color: #3c90ca;
  font: inherit;
  font-weight: 900;
  text-align: right;
  padding: 0.2rem 0.25rem;
}

.profit-loss-amount-button:hover {
  color: #2563eb;
  text-decoration: underline;
}

.profit-loss-paper footer {
  margin-top: 2rem;
  color: var(--muted);
}

@media (max-width: 991.98px) {
  .profit-loss-form-grid {
    grid-template-columns: 1fr;
  }

  .profit-loss-paper {
    padding: 2rem 1.25rem;
  }
}

@media (max-width: 991.98px) {
  .wht-form-grid,
  .wht-print-heading {
    grid-template-columns: 1fr;
  }

  .wht-meta-grid {
    grid-template-columns: 1fr;
    padding-left: 0;
    border-left: 0;
  }

  .wht-business-side {
    grid-row: auto;
    grid-column: auto;
  }
}

@media (max-width: 991.98px) {
  .reconciliation-form-grid,
  .reconciliation-print-heading {
    grid-template-columns: 1fr;
  }

  .reconciliation-meta-grid {
    grid-template-columns: 1fr;
    padding-left: 0;
    border-left: 0;
  }

  .reconciliation-business-side {
    grid-row: auto;
    grid-column: auto;
  }
}

@media print {
  body.dashboard-page * {
    visibility: hidden;
  }

  #receiptPrintable,
  #receiptPrintable *,
  #paymentPrintable,
  #paymentPrintable *,
  #transferPrintable,
  #transferPrintable *,
  #reconciliationPrintable,
  #reconciliationPrintable *,
  #whtPrintable,
  #whtPrintable *,
  #profitLossPrintable,
  #profitLossPrintable * {
    visibility: visible;
  }

  #receiptPrintable,
  #paymentPrintable,
  #transferPrintable,
  #reconciliationPrintable,
  #whtPrintable,
  #profitLossPrintable {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    max-width: none;
    box-shadow: none;
    border: 0;
  }
}

.payment-form-body {
  background: var(--surface-alt);
}

.payment-form-paper,
.payment-print-card {
  max-width: 1120px;
  margin: 0 auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 2rem;
  box-shadow: var(--shadow-sm);
}

.payment-form-head,
.payment-print-heading {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) minmax(22rem, 0.9fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 1.5rem;
}

.payment-form-head h3,
.payment-print-heading h1 {
  margin: 0 0 0.75rem;
  color: var(--ink);
  font-size: 2.4rem;
  font-weight: 900;
  letter-spacing: 0;
}

.payment-form-meta,
.payment-payer-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(12rem, 1fr));
  gap: 1rem;
}

.payment-payer-grid,
.payment-description-field {
  margin-bottom: 1.25rem;
}

.payment-line-table-wrap {
  overflow-x: auto;
  margin: 1.25rem 0 1rem;
}

.payment-line-table {
  width: 100%;
  min-width: 1080px;
  border-collapse: separate;
  border-spacing: 0 0.5rem;
}

.payment-line-table th {
  color: var(--muted);
  font-weight: 800;
  padding: 0 0.35rem;
}

.payment-line-table td {
  padding: 0 0.35rem;
  vertical-align: top;
}

.payment-line-table .form-control,
.payment-line-table .form-select {
  min-height: 3.25rem;
}

.payment-line-table textarea.form-control {
  min-height: 3.25rem;
  resize: vertical;
}

.payment-line-number {
  width: 2.5rem;
  padding-top: 0.9rem !important;
  color: var(--ink);
  font-weight: 900;
  text-align: center;
}

.payment-form-total {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
  font-size: 1.25rem;
}

.payment-form-total span {
  color: var(--muted);
  font-weight: 800;
}

.payment-form-total strong {
  color: var(--brand);
  font-size: 1.6rem;
  font-weight: 900;
}

.payment-meta-grid {
  display: grid;
  grid-template-columns: minmax(8rem, 0.75fr) minmax(12rem, 1fr);
  gap: 0.8rem 1.5rem;
  padding-left: 1.5rem;
  border-left: 1px solid var(--ink);
}

.payment-meta-grid div {
  display: grid;
  gap: 0.25rem;
}

.payment-meta-grid strong {
  color: var(--ink);
  font-weight: 900;
}

.payment-meta-grid span {
  color: var(--ink);
}

.payment-business-side {
  grid-row: 1 / span 2;
  grid-column: 2;
}

.payment-print-description {
  margin: 2rem 0 1.25rem;
  color: var(--ink);
  font-weight: 800;
}

.payment-print-table {
  width: 100%;
}

.payment-print-table th,
.payment-print-table td {
  border: 1px solid var(--ink);
}

.transfer-form-body {
  background: var(--surface-alt);
}

.transfer-form-paper,
.transfer-print-card {
  max-width: 1120px;
  margin: 0 auto;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 2rem;
  box-shadow: var(--shadow-sm);
}

.transfer-form-top {
  display: grid;
  grid-template-columns: minmax(12rem, 0.35fr) minmax(14rem, 0.5fr);
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.transfer-bank-grid {
  display: grid;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.transfer-bank-grid fieldset {
  padding: 0;
  border: 0;
}

.transfer-bank-grid legend {
  margin-bottom: 0.75rem;
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 900;
}

.transfer-inline-fields {
  display: grid;
  grid-template-columns: minmax(12rem, 0.6fr) minmax(10rem, 0.5fr) minmax(14rem, 0.8fr);
  gap: 0.75rem;
}

.transfer-print-heading {
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) minmax(22rem, 0.9fr);
  gap: 2rem;
  align-items: start;
  margin-bottom: 2rem;
}

.transfer-print-heading h1 {
  margin: 0 0 0.75rem;
  color: var(--ink);
  font-size: 2.4rem;
  font-weight: 900;
  letter-spacing: 0;
}

.transfer-meta-grid {
  display: grid;
  grid-template-columns: minmax(8rem, 0.75fr) minmax(12rem, 1fr);
  gap: 0.8rem 1.5rem;
  padding-left: 1.5rem;
  border-left: 1px solid var(--ink);
}

.transfer-meta-grid div {
  display: grid;
  gap: 0.25rem;
}

.transfer-meta-grid strong {
  color: var(--ink);
  font-weight: 900;
}

.transfer-business-side {
  grid-row: 1 / span 2;
  grid-column: 2;
}

.transfer-print-description {
  margin: 2rem 0 1.25rem;
  color: var(--ink);
  font-weight: 800;
}

.transfer-print-table {
  width: 100%;
}

.transfer-print-table th,
.transfer-print-table td {
  border: 1px solid var(--ink);
}

.customer-view-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-left: auto;
}

.customer-profile-grid,
.customer-address-grid {
  display: grid;
  gap: 1rem;
  padding: 1.5rem;
}

.customer-profile-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.customer-profile-grid article,
.customer-address-grid article {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 1rem;
  background: var(--surface);
}

.customer-profile-grid span {
  display: block;
  color: var(--muted);
  font-weight: 800;
  margin-bottom: 0.35rem;
}

.customer-profile-grid strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.customer-address-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-top: 0;
}

.customer-address-grid h3 {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 800;
  margin: 0 0 0.75rem;
}

.customer-address-grid p {
  color: var(--muted);
  margin: 0;
  min-height: 4rem;
}

.sales-quote-form-grid,
.sales-order-form-grid,
.sales-invoice-form-grid,
.credit-note-form-grid {
  display: grid;
  grid-template-columns: minmax(10rem, 0.8fr) minmax(15rem, 1fr) minmax(12rem, 1fr);
  gap: 1rem;
}

.sales-invoice-form-grid,
.credit-note-form-grid {
  grid-template-columns: minmax(13rem, 0.75fr) minmax(20rem, 1.1fr) minmax(16rem, 0.9fr);
  align-items: end;
}

.delivery-note-form-grid {
  display: grid;
  grid-template-columns: minmax(12rem, 0.75fr) minmax(16rem, 0.9fr) minmax(16rem, 0.9fr);
  gap: 1rem;
  align-items: end;
}

.delivery-note-form-grid .delivery-customer-field,
.delivery-note-form-grid .delivery-order-field,
.delivery-note-form-grid .delivery-invoice-field {
  grid-column: span 1;
}

.delivery-note-form-grid .delivery-address-field,
.delivery-note-form-grid .delivery-description-field {
  grid-column: 1 / -1;
  max-width: 72rem;
}

.sales-invoice-form-grid .invoice-issue-field,
.credit-note-form-grid .invoice-issue-field {
  grid-column: 1;
}

.sales-invoice-form-grid .invoice-due-field,
.credit-note-form-grid .invoice-due-field {
  grid-column: 2;
}

.sales-invoice-form-grid .invoice-reference-field,
.credit-note-form-grid .invoice-reference-field {
  grid-column: 3;
}

.sales-invoice-form-grid .invoice-customer-field,
.sales-invoice-form-grid .invoice-order-field,
.sales-invoice-form-grid .invoice-billing-field,
.sales-invoice-form-grid .invoice-description-field,
.credit-note-form-grid .invoice-customer-field,
.credit-note-form-grid .invoice-order-field,
.credit-note-form-grid .invoice-billing-field,
.credit-note-form-grid .invoice-description-field {
  grid-column: 1 / -1;
  max-width: 46rem;
}

.sales-invoice-form-grid .invoice-description-field,
.credit-note-form-grid .invoice-description-field {
  max-width: 72rem;
}

.sales-quote-form-grid .wide,
.sales-order-form-grid .wide,
.sales-invoice-form-grid .wide,
.credit-note-form-grid .wide {
  grid-column: 1 / -1;
}

.sales-lines-editor {
  margin-top: 1.5rem;
  overflow-x: auto;
}

.sales-line-head,
.sales-line-row {
  display: grid;
  grid-template-columns: 44px minmax(230px, 1.6fr) 90px 130px 130px 120px 44px;
  gap: 0.5rem;
  align-items: center;
  min-width: 880px;
  margin-bottom: 0.55rem;
}

.sales-lines-editor.invoice-lines .sales-line-head,
.sales-lines-editor.invoice-lines .sales-line-row {
  grid-template-columns: 44px minmax(190px, 1fr) minmax(230px, 1.3fr) 90px 130px 130px 120px 44px;
  min-width: 1120px;
}

.sales-lines-editor.delivery-lines .sales-line-head,
.sales-lines-editor.delivery-lines .sales-line-row {
  grid-template-columns: 44px minmax(320px, 1fr) 140px 44px;
  min-width: 620px;
}

.sales-line-head {
  color: var(--muted);
  font-weight: 900;
}

.sales-line-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  font-weight: 800;
}

.sales-line-row textarea {
  min-height: 58px;
}

.sales-account-picker {
  display: grid;
  gap: 0.3rem;
}

.sales-account-picker .form-select {
  min-height: 42px;
}

.sales-account-group {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  min-height: 1rem;
  padding-left: 0.1rem;
}

.sales-line-total {
  color: var(--muted);
  font-weight: 800;
}

.sales-remove-line {
  min-height: 42px;
  border-color: var(--line);
}

.sales-lines-editor.hide-line-number .sales-line-number-column,
.sales-lines-editor.hide-line-number .sales-line-number {
  visibility: hidden;
}

.sales-lines-editor.delivery-lines.hide-line-number .sales-line-head,
.sales-lines-editor.delivery-lines.hide-line-number .sales-line-row {
  grid-template-columns: 44px minmax(320px, 1fr) 140px 44px;
}

.sales-lines-editor.hide-discount .sales-discount-column {
  display: none;
}

.sales-lines-editor.hide-discount .sales-line-head,
.sales-lines-editor.hide-discount .sales-line-row {
  grid-template-columns: 44px minmax(260px, 1.8fr) 90px 130px 120px 44px;
}

.sales-lines-editor.invoice-lines.hide-description .sales-line-head,
.sales-lines-editor.invoice-lines.hide-description .sales-line-row {
  grid-template-columns: 44px minmax(230px, 1.2fr) 90px 130px 130px 120px 44px;
}

.sales-lines-editor.invoice-lines.hide-discount .sales-line-head,
.sales-lines-editor.invoice-lines.hide-discount .sales-line-row {
  grid-template-columns: 44px minmax(210px, 1.1fr) minmax(260px, 1.4fr) 90px 130px 120px 44px;
}

.sales-lines-editor.invoice-lines.hide-description.hide-discount .sales-line-head,
.sales-lines-editor.invoice-lines.hide-description.hide-discount .sales-line-row {
  grid-template-columns: 44px minmax(280px, 1.4fr) 90px 130px 120px 44px;
}

.sales-lines-editor.hide-description .sales-line-head > :nth-child(3),
.sales-lines-editor.hide-description .sales-line-row > textarea {
  display: none;
}

.sales-options-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.5rem;
  margin-top: 1.5rem;
}

.sales-options-grid label {
  color: var(--muted);
  font-weight: 800;
}

.invoice-options-grid {
  grid-template-columns: 1fr;
  max-width: 48rem;
}

.invoice-options-grid label {
  display: block;
}

.sales-options-grid .form-control,
.sales-options-grid .form-select {
  max-width: 20rem;
}

.sales-form-totals {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 1.5rem 0;
}

.sales-form-totals span {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-alt);
  color: var(--muted);
  font-weight: 800;
}

.sales-form-totals strong {
  color: var(--ink);
}

.sales-quote-print-heading,
.sales-order-print-heading,
.sales-invoice-print-heading,
.credit-note-print-heading,
.delivery-note-print-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.7fr);
  gap: 2rem;
  margin-bottom: 4rem;
}

.sales-quote-print-heading h1,
.sales-order-print-heading h1,
.sales-invoice-print-heading h1,
.credit-note-print-heading h1,
.delivery-note-print-heading h1 {
  margin: 0 0 1.5rem;
  font-size: 2.7rem;
  font-weight: 900;
}

.sales-quote-print-heading p,
.sales-order-print-heading p,
.sales-invoice-print-heading p,
.credit-note-print-heading p,
.delivery-note-print-heading p {
  margin: 0.35rem 0 0;
}

.sales-quote-print-meta,
.sales-order-print-meta,
.sales-invoice-print-meta,
.credit-note-print-meta,
.delivery-note-print-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem 1.25rem;
  border-left: 1px solid #1f1f1f;
  padding-left: 1.5rem;
}

.sales-quote-print-meta div,
.sales-order-print-meta div,
.sales-invoice-print-meta div,
.credit-note-print-meta div,
.delivery-note-print-meta div {
  display: grid;
  gap: 0.25rem;
}

.sales-quote-print-meta .business-side,
.sales-order-print-meta .business-side,
.sales-invoice-print-meta .business-side,
.credit-note-print-meta .business-side,
.delivery-note-print-meta .business-side {
  grid-row: 1 / span 3;
  grid-column: 2;
}

.sales-quote-description,
.sales-order-description,
.sales-invoice-description,
.credit-note-description,
.delivery-note-description {
  margin-bottom: 1.25rem;
  font-weight: 800;
}

.sales-quote-print-table th:first-child,
.sales-quote-print-table td:first-child,
.sales-order-print-table th:first-child,
.sales-order-print-table td:first-child,
.sales-invoice-print-table th:first-child,
.sales-invoice-print-table td:first-child,
.credit-note-print-table th:first-child,
.credit-note-print-table td:first-child,
.delivery-note-print-table th:first-child,
.delivery-note-print-table td:first-child {
  width: 3rem;
}

@media print {
  @page {
    margin: 0.5in;
  }

  body.dashboard-page {
    background: #fff !important;
  }

  .sidebar,
  .topbar,
  .manager-breadcrumb,
  .journal-view-toolbar,
  .alert {
    display: none !important;
  }

  .app-layout,
  .main-panel,
  .business-workspace,
  .workspace-content,
  .journal-view-shell {
    display: block !important;
    width: 100% !important;
    min-height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: #fff !important;
  }

  .journal-print-card {
    width: 100% !important;
    min-height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
  }
}

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

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

  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: 280px;
    z-index: 40;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
  }

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

  .content-wrap,
  .topbar {
    padding-left: 18px;
    padding-right: 18px;
  }

  .hero-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  .business-table-toolbar,
  .business-table-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .business-search {
    flex-basis: auto;
    width: 100%;
  }

  .business-table-controls,
  .business-pagination {
    justify-content: space-between;
    width: 100%;
  }

  .workspace-shell,
  .summary-grid,
  .account-form-grid,
  .manager-chart-grid,
  .manager-form-body {
    grid-template-columns: 1fr;
  }

  .manager-chart-panel header,
  .manager-form-card footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .manager-chart-actions,
  .manager-group-selects {
    width: 100%;
  }

  .manager-chart-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .manager-group-selects {
    grid-template-columns: 1fr;
  }

  .manager-group-selects span {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .journal-board > header,
  .journal-form-grid {
    grid-template-columns: 1fr;
  }

  .journal-board > header {
    align-items: flex-start;
    flex-direction: column;
  }

  .journal-summary-strip {
    grid-template-columns: 1fr;
  }

  .customer-board > header,
  .customer-view-card > header,
  .customer-search,
  .customer-view-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .customer-search,
  .customer-search .form-control,
  .customer-view-actions {
    width: 100%;
  }

  .customer-form-grid,
  .customer-profile-grid,
  .customer-address-grid,
	  .sales-quote-form-grid,
	  .sales-order-form-grid,
	  .sales-invoice-form-grid,
	  .credit-note-form-grid,
	  .delivery-note-form-grid,
  .sales-options-grid,
  .sales-form-totals,
	  .sales-quote-print-heading,
	  .sales-order-print-heading,
	  .sales-invoice-print-heading,
	  .credit-note-print-heading,
	  .delivery-note-print-heading,
  .receipt-form-head,
  .receipt-print-heading,
  .receipt-form-meta,
  .receipt-payer-grid,
  .payment-form-head,
  .payment-print-heading,
  .payment-form-meta,
  .payment-payer-grid,
  .transfer-form-top,
  .transfer-inline-fields,
  .transfer-print-heading {
    grid-template-columns: 1fr;
  }

  .sales-invoice-form-grid .invoice-issue-field,
  .sales-invoice-form-grid .invoice-due-field,
  .sales-invoice-form-grid .invoice-reference-field,
	  .sales-invoice-form-grid .invoice-customer-field,
	  .sales-invoice-form-grid .invoice-order-field,
	  .sales-invoice-form-grid .invoice-billing-field,
	  .sales-invoice-form-grid .invoice-description-field,
	  .credit-note-form-grid .invoice-issue-field,
	  .credit-note-form-grid .invoice-due-field,
	  .credit-note-form-grid .invoice-reference-field,
	  .credit-note-form-grid .invoice-customer-field,
	  .credit-note-form-grid .invoice-order-field,
	  .credit-note-form-grid .invoice-billing-field,
	  .credit-note-form-grid .invoice-description-field,
	  .delivery-note-form-grid .delivery-date-field,
	  .delivery-note-form-grid .delivery-reference-field,
	  .delivery-note-form-grid .delivery-customer-field,
	  .delivery-note-form-grid .delivery-order-field,
	  .delivery-note-form-grid .delivery-invoice-field,
	  .delivery-note-form-grid .delivery-address-field,
	  .delivery-note-form-grid .delivery-description-field {
    grid-column: 1;
    max-width: none;
  }

	  .sales-quote-print-meta,
	  .sales-order-print-meta,
	  .sales-invoice-print-meta,
	  .credit-note-print-meta,
	  .delivery-note-print-meta {
    grid-template-columns: 1fr;
    border-left: 0;
    border-top: 1px solid var(--line);
    padding-left: 0;
    padding-top: 1rem;
  }

  .receipt-meta-grid,
  .payment-meta-grid {
    grid-template-columns: 1fr;
    border-left: 0;
    border-top: 1px solid var(--line);
    padding-left: 0;
    padding-top: 1rem;
  }

  .receipt-business-side,
  .payment-business-side {
    grid-row: auto;
    grid-column: auto;
  }

  .transfer-meta-grid {
    grid-template-columns: 1fr;
    border-left: 0;
    border-top: 1px solid var(--line);
    padding-left: 0;
    padding-top: 1rem;
  }

  .transfer-business-side {
    grid-row: auto;
    grid-column: auto;
  }

  .sales-quote-print-meta .business-side,
  .sales-order-print-meta .business-side,
  .sales-invoice-print-meta .business-side,
  .delivery-note-print-meta .business-side {
    grid-row: auto;
    grid-column: auto;
  }

  .journal-summary-strip article {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .journal-line-head,
  .journal-line-row {
    grid-template-columns: 44px minmax(180px, 1fr) 110px 110px 44px;
  }

  .journal-line-editor.show-description .journal-line-head,
  .journal-line-editor.show-description .journal-line-row {
    grid-template-columns: 44px minmax(170px, 1fr) minmax(150px, 0.9fr) 105px 105px 44px;
  }

  .journal-line-editor.show-qty .journal-line-head,
  .journal-line-editor.show-qty .journal-line-row {
    grid-template-columns: 44px minmax(170px, 1fr) 76px 105px 105px 44px;
  }

  .journal-line-editor.show-description.show-qty .journal-line-head,
  .journal-line-editor.show-description.show-qty .journal-line-row {
    grid-template-columns: 44px minmax(160px, 1fr) minmax(140px, 0.9fr) 70px 100px 100px 44px;
  }

  .journal-totals {
    grid-template-columns: minmax(180px, 1fr) 110px 110px 44px;
    margin-left: 52px;
  }

  .workspace-menu {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .workspace-header,
  .module-panel-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .module-table-placeholder {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .auth-page {
    padding: 76px 16px 24px;
  }

  .content-wrap {
    padding: 18px;
  }

  .auth-card .card-body {
    padding: 24px !important;
  }

  .auth-theme-toggle {
    top: 16px;
    right: 16px;
  }

  .business-manager {
    padding: 16px;
  }
}

/* KIWI workspace identity. Existing document and transaction structures remain intact. */
@media screen {
  body.dashboard-page {
    background:
      radial-gradient(circle at 92% 1%, rgba(100, 197, 172, 0.08), transparent 28rem),
      var(--soft);
  }

  .app-layout {
    grid-template-columns: 284px minmax(0, 1fr);
  }

  .sidebar {
    z-index: 30;
    padding: 20px 15px 18px;
    border-right: 1px solid rgba(190, 229, 220, 0.13);
    background:
      radial-gradient(circle at 100% 0%, rgba(70, 181, 155, 0.17), transparent 18rem),
      linear-gradient(165deg, var(--sidebar), #10363a 68%, #0b292f);
    box-shadow: 12px 0 28px rgba(14, 47, 50, 0.07);
  }

  .sidebar-brand {
    margin: 0 6px 21px;
    padding: 4px 0;
    color: #f5fffd;
    font-size: 0.98rem;
    letter-spacing: -0.01em;
  }

  .sidebar-brand:hover,
  .sidebar-brand:focus-visible {
    color: #f5fffd;
  }

  .sidebar-brand small {
    color: #9dc2bf;
    font-size: 0.68rem;
    letter-spacing: 0.07em;
    text-transform: uppercase;
  }

  .sidebar-brand .brand-logo {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 13px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  }

  .sidebar-business-switcher {
    gap: 6px;
    margin: 0 3px 17px;
    padding: 12px;
    border-color: rgba(185, 229, 218, 0.15);
    border-radius: 13px;
    background: rgba(226, 255, 248, 0.06);
  }

  .sidebar-business-switcher label {
    color: #9ac4bb;
  }

  .sidebar-business-switcher .form-select {
    min-height: 39px;
    border-color: transparent;
    border-radius: 9px;
    background-color: #f4fbf8;
    color: #163c3d;
    font-size: 0.88rem;
    font-weight: 700;
  }

  .sidebar-nav {
    display: grid;
    align-content: start;
    gap: 2px;
    min-height: 0;
    padding: 0 3px 12px 0;
    scrollbar-color: rgba(183, 225, 214, 0.35) transparent;
    scrollbar-width: thin;
  }

  .sidebar-nav a {
    min-height: 40px;
    gap: 10px;
    padding: 8px 11px;
    border-left: 3px solid transparent;
    border-radius: 9px;
    color: #c1d8d5;
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.25;
    transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
  }

  .sidebar-nav a i {
    width: 18px;
    flex: 0 0 18px;
    color: #89b7ae;
    text-align: center;
  }

  .sidebar-nav a:hover,
  .sidebar-nav a.active,
  .workspace-menu nav a:hover,
  .workspace-menu nav a.active {
    border-left-color: #65e0c3;
    background: rgba(124, 225, 195, 0.14);
    color: #f3fffb;
    box-shadow: none;
  }

  .sidebar-nav a:hover i,
  .sidebar-nav a.active i {
    color: #6fe3c8;
  }

  .sidebar-nav a span,
  .workspace-menu nav a span {
    border-color: rgba(171, 226, 210, 0.2);
    background: rgba(201, 250, 231, 0.1);
    color: #c7ece0;
  }

  .sidebar-footer {
    border-color: rgba(185, 229, 218, 0.14);
    background: rgba(226, 255, 248, 0.06);
  }

  .sidebar-footer p,
  .sidebar-footer small {
    color: #a9c8c4;
  }

  .accounting-nav {
    padding-top: 0;
    border-top: 0;
  }

  .accounting-nav .customize-modules-link,
  .accounting-nav .workspace-back-link {
    margin-top: 7px;
    padding-top: 11px;
    border-top: 1px solid rgba(198, 238, 224, 0.14);
    border-radius: 9px;
    color: #c1d8d5;
  }

  .kiwi-nav-group {
    display: grid;
    gap: 2px;
  }

  .kiwi-nav-group + .kiwi-nav-group {
    margin-top: 9px;
  }

  .kiwi-nav-group-title {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
    padding: 7px 11px 5px;
    border: 0;
    background: transparent;
    color: #90b7b3;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-align: left;
    text-transform: uppercase;
  }

  details.kiwi-nav-group > .kiwi-nav-group-title {
    cursor: pointer;
  }

  .kiwi-nav-group-title::marker {
    color: #83b8a9;
  }

  .kiwi-nav-group[open] > .kiwi-nav-group-title {
    color: #d9fff0;
  }

  .kiwi-nav-group-count {
    margin-left: auto;
    color: #86bcb1;
    font-size: 0.65rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
  }

  .kiwi-nav-group-title > .fa-chevron-down {
    font-size: 0.62rem;
    transition: transform 0.16s ease;
  }

  .kiwi-nav-group[open] > .kiwi-nav-group-title > .fa-chevron-down {
    transform: rotate(180deg);
  }

  button.kiwi-nav-group-title {
    cursor: pointer;
  }

  button.kiwi-nav-group-title:hover {
    color: #e2fff3;
  }

  .kiwi-nav-links {
    display: grid;
    gap: 2px;
  }

  details.kiwi-nav-group:not([open]) > .kiwi-nav-links {
    display: none;
  }

  .kiwi-nav-search {
    width: 100%;
    margin: 2px 0 10px;
  }

  .kiwi-nav-search input,
  input.kiwi-nav-search {
    width: 100%;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid rgba(185, 229, 218, 0.22);
    border-radius: 9px;
    outline: 0;
    background: rgba(245, 255, 251, 0.1);
    color: #f5fffd;
    font-size: 0.84rem;
  }

  .kiwi-nav-search input::placeholder,
  input.kiwi-nav-search::placeholder {
    color: #abc9c4;
  }

  .main-panel,
  .business-workspace,
  .manager-chart-content {
    min-width: 0;
    background: transparent;
  }

  .topbar {
    min-height: 76px;
    padding: 13px 30px;
    border-bottom-color: var(--line);
    background: var(--topbar);
    box-shadow: 0 5px 20px rgba(18, 52, 52, 0.025);
  }

  .topbar h1 {
    color: var(--ink);
    font-size: clamp(1.15rem, 1.5vw, 1.45rem);
    font-weight: 800;
    letter-spacing: -0.035em;
  }

  .topbar .eyebrow {
    margin-bottom: 2px !important;
    color: var(--brand-dark);
    font-size: 0.63rem;
  }

  .topbar-logo {
    box-shadow: var(--shadow-sm);
  }

  .theme-toggle,
  .user-menu {
    min-height: 39px;
    border-color: var(--line);
    border-radius: 10px;
    background: var(--surface);
    color: var(--ink);
    box-shadow: none;
  }

  .theme-toggle:hover,
  .user-menu:hover {
    transform: none;
    border-color: var(--brand);
    color: var(--brand-dark);
  }

  .avatar {
    background: #d8eee6;
    color: #075b53;
  }

  .workspace-content,
  .content-wrap {
    padding: 26px 32px 40px;
  }

  .workspace-header {
    align-items: end;
    margin: 0 0 22px;
    padding: 5px 0 18px;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
  }

  .workspace-header h2 {
    margin-top: 4px;
    color: var(--ink);
    font-size: clamp(1.55rem, 2.2vw, 2.05rem);
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 1.12;
  }

  .section-kicker,
  .eyebrow {
    color: var(--brand-dark);
  }

  .workspace-section-title {
    min-height: 56px;
    margin-bottom: 18px;
    padding: 8px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .workspace-section-title span {
    color: var(--brand);
  }

  .kiwi-page-intro,
  .kiwi-report-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 22px;
    padding: 20px 24px;
    border: 1px solid #c8e5db;
    border-radius: 18px;
    background:
      radial-gradient(circle at right top, rgba(152, 224, 191, 0.24), transparent 17rem),
      linear-gradient(110deg, #e8f6ef, #f6fbf9);
    color: #204f49;
  }

  .kiwi-page-intro h2,
  .kiwi-page-intro h3,
  .kiwi-report-intro h2,
  .kiwi-report-intro h3 {
    margin: 0 0 6px;
    color: #133e3d;
    font-weight: 800;
    letter-spacing: -0.03em;
  }

  .kiwi-page-intro p,
  .kiwi-report-intro p {
    margin: 0;
    color: #426b67;
  }

  .hero-panel.kiwi-page-intro {
    border-color: #174e4c;
    background:
      radial-gradient(circle at 92% 12%, rgba(99, 224, 183, 0.24), transparent 24rem),
      linear-gradient(125deg, #113d41, #0e625c);
    color: #f4fffa;
  }

  .hero-panel.kiwi-page-intro :is(h2, h3) {
    color: #f4fffa;
  }

  .hero-panel.kiwi-page-intro p {
    color: #d2eee4;
  }

  .hero-panel.kiwi-page-intro .section-kicker {
    color: #a2f0cf;
  }

  .kiwi-quick-links,
  .kiwi-report-jump {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 20px;
  }

  .kiwi-quick-links a,
  .kiwi-report-jump a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 7px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    color: var(--brand-dark);
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    box-shadow: var(--shadow-sm);
  }

  .kiwi-quick-links a:hover,
  .kiwi-report-jump a:hover {
    border-color: var(--brand);
    background: var(--surface-alt);
  }

  .kiwi-report-intro .kiwi-report-jump {
    justify-content: flex-end;
    margin: 0;
  }

  .kiwi-quick-links a {
    min-width: 190px;
    padding: 11px 14px;
  }

  .kiwi-quick-links a > span {
    display: grid;
    gap: 1px;
  }

  .kiwi-quick-links a strong {
    color: var(--ink);
    font-size: 0.86rem;
    line-height: 1.2;
  }

  .kiwi-quick-links a small {
    color: var(--muted);
    font-size: 0.73rem;
    font-weight: 500;
    line-height: 1.25;
  }

  .hero-panel {
    border-radius: 20px;
    background:
      radial-gradient(circle at 90% 25%, rgba(125, 231, 188, 0.2), transparent 26rem),
      linear-gradient(120deg, #123e43, #11635e);
  }

  .metric-card,
  .panel-card,
  .module-panel,
  .journal-board,
  .customer-board,
  .customer-view-card,
  .manager-chart-panel,
  .manager-form-card,
  .reports-catalog-card,
  .statement-card {
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
  }

  .metric-card,
  .panel-card,
  .module-panel {
    padding: 20px;
  }

  .manager-chart-panel,
  .manager-form-card,
  .journal-board,
  .customer-board,
  .customer-view-card,
  .reports-catalog-card,
  .statement-card {
    overflow: hidden;
  }

  .manager-breadcrumb,
  .reports-breadcrumb {
    min-height: 0;
    margin: 0 0 18px;
    padding: 8px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--muted);
    font-size: 0.88rem;
  }

  .manager-chart-panel header,
  .manager-form-card header,
  .journal-board > header,
  .customer-board > header,
  .customer-view-card > header {
    min-height: 64px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
  }

  .manager-chart-panel h3,
  .manager-form-card h2,
  .journal-view-toolbar h2 {
    color: var(--ink);
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: -0.025em;
  }

  .manager-form-card footer,
  .manager-chart-modal .modal-header,
  .manager-chart-modal .modal-footer,
  .bank-account-toolbar {
    background: var(--surface-alt);
  }

  .manager-chart-actions .btn,
  .manager-secondary-button,
  .manager-row-edit-btn {
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface);
    color: var(--brand-dark);
    box-shadow: none;
    font-weight: 700;
  }

  .manager-chart-actions .btn:hover,
  .manager-secondary-button:hover,
  .manager-row-edit-btn:hover {
    transform: none;
    border-color: var(--brand);
    background: var(--surface-alt);
    box-shadow: none;
    color: var(--brand-dark);
  }

  .manager-chart-heading,
  .journal-table th,
  .customer-table th,
  .business-table thead th,
  .summary-transactions-table th {
    background: var(--surface-alt);
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
  }

  .manager-chart-row:nth-child(even),
  .journal-table tbody tr:nth-child(even),
  .customer-table tbody tr:nth-child(even),
  .business-table tbody tr:nth-child(even),
  .summary-transactions-table tbody tr:nth-child(even) {
    background: rgba(99, 181, 154, 0.035);
  }

  .manager-chart-row:hover,
  .journal-table tbody tr:hover,
  .customer-table tbody tr:hover,
  .business-table tbody tr:hover,
  .summary-transactions-table tbody tr:hover {
    background: rgba(54, 168, 140, 0.09);
  }

  .table,
  .journal-table,
  .customer-table,
  .business-table,
  .summary-transactions-table {
    font-variant-numeric: tabular-nums;
  }

  .table > :not(caption) > * > * {
    padding: 12px 13px;
  }

  .summary-grid {
    gap: 20px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .summary-grid h3 {
    margin: 0 0 12px;
    color: var(--ink);
    text-align: left;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  .statement-card {
    margin-bottom: 16px;
  }

  .statement-card header {
    min-height: 61px;
    padding: 15px 18px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-alt);
    color: var(--ink);
    font-size: 1rem;
    font-weight: 800;
  }

  .statement-card-body {
    padding: 14px 18px 17px;
  }

  .statement-line {
    min-height: 31px;
    font-size: 0.88rem;
    font-weight: 600;
  }

  .statement-line.group-line {
    font-weight: 800;
  }

  .statement-line span.has-value,
  .summary-value-button,
  .customer-money-link,
  .profit-loss-amount-button,
  .general-ledger-transaction-row strong:not(:last-child) {
    color: var(--brand-dark);
    font-variant-numeric: tabular-nums;
  }

  .summary-value-button:hover,
  .profit-loss-amount-button:hover,
  .customer-money-link:hover {
    color: var(--brand);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
  }

  .reports-catalog-grid {
    gap: 16px;
  }

  .reports-catalog-card {
    scroll-margin-top: 100px;
  }

  .reports-catalog-card header {
    min-height: 66px;
    padding: 18px 21px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink);
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: -0.02em;
  }

  .reports-catalog-card header i {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin-right: 9px;
    border-radius: 10px;
    background: var(--surface-muted);
    color: var(--brand-dark);
    font-size: 0.88rem;
  }

  .reports-catalog-card header h3 {
    display: inline;
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 800;
  }

  .reports-catalog-list a {
    display: flex;
    align-items: center;
    min-height: 45px;
    padding: 11px 21px;
    border-bottom: 1px solid var(--line);
    color: var(--brand-dark);
    font-size: 0.86rem;
    font-weight: 650;
  }

  .reports-catalog-list a:hover,
  .reports-catalog-list a:focus-visible {
    background: var(--surface-alt);
    color: var(--brand-dark);
  }

  .report-card,
  .settings-grid article,
  .account-stat-grid article {
    border: 1px solid var(--line);
    border-radius: 15px;
    box-shadow: var(--shadow-sm);
  }

  .report-card:hover,
  a.settings-action-card:hover {
    border-color: #a7d8c5;
    box-shadow: 0 12px 28px rgba(11, 99, 89, 0.11);
  }

  .account-group-row,
  .business-table-toolbar,
  .module-preference-item {
    border-color: var(--line);
    border-radius: 12px;
    background: var(--surface);
  }

  .module-preference-item:hover {
    border-color: var(--brand);
  }

  .form-control,
  .form-select,
  .input-group-text {
    border-color: var(--line);
    border-radius: 10px;
    background-color: var(--surface);
    color: var(--ink);
  }

  .form-control:focus,
  .form-select:focus {
    border-color: var(--brand);
    background-color: var(--surface);
    color: var(--ink);
    box-shadow: 0 0 0 0.22rem var(--focus-ring);
  }

  .form-check-input:checked {
    border-color: var(--brand);
    background-color: var(--brand);
  }

  .form-check-input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 0.22rem var(--focus-ring);
  }

  .transaction-line-options,
  .transaction-extra-details {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-alt);
    color: var(--ink);
  }

  .transaction-line-options {
    min-width: 142px;
    padding: 8px 10px;
  }

  .transaction-extra-details {
    padding: 10px 13px;
  }

  .transaction-line-options summary,
  .transaction-extra-details summary {
    color: var(--brand-dark);
    cursor: pointer;
    font-size: 0.79rem;
    font-weight: 800;
    line-height: 1.35;
  }

  .transaction-line-options summary::marker,
  .transaction-extra-details summary::marker {
    color: var(--brand);
  }

  .transaction-line-options[open],
  .transaction-extra-details[open] {
    border-color: #9fd4c4;
    background: var(--surface);
  }

  .transaction-line-options[open] {
    width: 230px;
    max-width: 55vw;
  }

  .transaction-line-options[open] summary,
  .transaction-extra-details[open] summary {
    padding-bottom: 7px;
    border-bottom: 1px solid var(--line);
  }

  .transaction-line-options label {
    display: grid;
    gap: 4px;
    color: var(--muted);
    font-size: 0.78rem;
  }

  .transaction-line-options .form-control,
  .transaction-line-options .form-select {
    min-height: 38px;
    font-size: 0.82rem;
  }

  .customer-status.paid {
    background: #146f4b;
    color: #fff;
  }

  .customer-status.cancelled {
    background: #a93642;
    color: #fff;
  }

  .btn {
    border-radius: 9px;
    font-weight: 700;
    transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
  }

  .btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #087b72;
    --bs-btn-border-color: #087b72;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #05665e;
    --bs-btn-hover-border-color: #05665e;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #075b54;
    --bs-btn-active-border-color: #075b54;
  }

  .btn-light {
    --bs-btn-color: var(--ink);
    --bs-btn-bg: var(--surface);
    --bs-btn-border-color: var(--line);
    --bs-btn-hover-color: var(--brand-dark);
    --bs-btn-hover-bg: var(--surface-alt);
    --bs-btn-hover-border-color: var(--brand);
  }

  .btn-outline-primary {
    --bs-btn-color: var(--brand-dark);
    --bs-btn-border-color: var(--brand);
    --bs-btn-hover-bg: var(--brand);
    --bs-btn-hover-border-color: var(--brand);
  }

  .text-primary,
  .text-info {
    color: var(--brand-dark) !important;
  }

  .bg-primary-subtle,
  .bg-info-subtle {
    background-color: rgba(39, 151, 123, 0.12) !important;
  }

  .bg-success-subtle {
    background-color: rgba(35, 148, 99, 0.13) !important;
  }

  .text-bg-primary {
    background-color: #087b72 !important;
  }

  .auth-page {
    background:
      radial-gradient(circle at 12% 14%, rgba(128, 219, 179, 0.2), transparent 30%),
      radial-gradient(circle at 93% 88%, rgba(51, 140, 131, 0.13), transparent 32%),
      linear-gradient(145deg, #eaf6f0, #f9fcfa 55%, #ecf4f3);
  }

  .auth-card .card {
    border-radius: 20px;
    box-shadow: 0 24px 54px rgba(13, 75, 71, 0.11);
  }

  .brand-logo {
    box-shadow: var(--shadow-sm);
  }

  .theme-toggle:focus-visible,
  .sidebar a:focus-visible,
  .kiwi-nav-group-title:focus-visible,
  .kiwi-nav-search input:focus-visible,
  input.kiwi-nav-search:focus-visible {
    outline: 3px solid #8cf0d2;
    outline-offset: 2px;
  }

  :is(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--brand);
    outline-offset: 2px;
  }

  .sidebar :is(a, button, input, select):focus-visible {
    outline-color: #8cf0d2;
  }

  :is(.transaction-line-options, .transaction-extra-details) summary:focus-visible {
    outline: 3px solid var(--focus-ring);
    outline-offset: 3px;
  }
}

[data-theme="dark"] .kiwi-page-intro,
[data-theme="dark"] .kiwi-report-intro {
  border-color: #37685f;
  background: linear-gradient(110deg, #21453e, #1b3b3c);
  color: #e0f5ec;
}

[data-theme="dark"] .auth-page {
  background:
    radial-gradient(circle at 10% 10%, rgba(65, 179, 146, 0.17), transparent 29%),
    radial-gradient(circle at 94% 88%, rgba(60, 165, 161, 0.14), transparent 30%),
    linear-gradient(145deg, #0b2026, #142e32 56%, #0b282d);
}

[data-theme="dark"] .kiwi-page-intro :is(h2, h3, p),
[data-theme="dark"] .kiwi-report-intro :is(h2, h3, p) {
  color: #e0f5ec;
}

[data-theme="dark"] .btn-primary {
  --bs-btn-color: #082e2e;
  --bs-btn-bg: #5ed9c5;
  --bs-btn-border-color: #5ed9c5;
  --bs-btn-hover-color: #082e2e;
  --bs-btn-hover-bg: #82e6d4;
  --bs-btn-hover-border-color: #82e6d4;
}

[data-theme="dark"] .sidebar-business-switcher .form-select {
  background-color: #e6f5ef;
  color: #163c3d;
}

[data-theme="dark"] .statement-card header,
[data-theme="dark"] .reports-catalog-card header {
  background: var(--surface-alt);
}

@media screen and (max-width: 991px) {
  .app-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .sidebar {
    width: min(320px, calc(100vw - 32px));
    box-shadow: 22px 0 55px rgba(7, 32, 34, 0.27);
  }

  .workspace-content,
  .content-wrap {
    padding: 22px 20px 32px;
  }

  .topbar {
    padding: 12px 20px;
  }

  .kiwi-page-intro,
  .kiwi-report-intro {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media screen and (max-width: 575px) {
  .workspace-content,
  .content-wrap {
    padding: 18px 14px 28px;
  }

  .workspace-header h2 {
    font-size: 1.55rem;
  }

  .summary-grid,
  .reports-catalog-grid {
    grid-template-columns: 1fr;
  }

  .kiwi-page-intro,
  .kiwi-report-intro {
    padding: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar-nav a,
  .btn,
  .theme-toggle {
    transition-duration: 0.01ms;
  }
}

/* Keep page and dialog headers to their primary title. */
.topbar .eyebrow,
.workspace-content .eyebrow,
.content-wrap .eyebrow,
.modal-header .eyebrow {
  display: none;
}