/* ============================================================
   Mabak — Bootstrap 5.3 theme override (Ledger Navy palette)
   Load AFTER the Bootstrap CDN stylesheet. No build step.

   <link rel="stylesheet" href=".../bootstrap@5.3.3/dist/css/bootstrap.min.css">
   <link rel="stylesheet" href="/css/mabak-app.css">

   Part 1 re-skins native Bootstrap classes (no markup changes).
   Part 2 adds the few components Bootstrap doesn't ship.
   ============================================================ */

/* ---------- 1. Palette ---------- */
:root {
  --mbk-navy-50:  #DFE8F3;
  --mbk-navy-100: #BFCFE3;
  --mbk-navy-300: #8AA3C2;
  --mbk-navy-500: #3D6193;
  --mbk-navy-700: #1F3A5F;
  --mbk-navy-900: #122540;

  --mbk-success: #1E7A54;
  --mbk-warning: #B6761A;
  --mbk-danger:  #B3352F;
  --mbk-info:    #1F8A8A;

  --mbk-success-bg: #EAF5F0;
  --mbk-warning-bg: #FBF3E7;
  --mbk-danger-bg:  #FBEFEE;
  --mbk-info-bg:    #E9F5F5;

  --mbk-gray-50:  #E9ECF1;
  --mbk-gray-100: #F3F5F8;
  --mbk-gray-200: #D7DCE4;
  --mbk-gray-300: #BEC6D2;
  --mbk-gray-500: #8B93A0;
  --mbk-gray-600: #67707E;
  --mbk-gray-700: #4A515B;
  --mbk-gray-900: #1B1F24;
}

/* ---------- 2. Global tokens ---------- */
:root {
  --bs-primary: var(--mbk-navy-700);
  --bs-primary-rgb: 31, 58, 95;
  --bs-secondary: #4A515B;
  --bs-secondary-rgb: 74, 81, 91;
  --bs-success: #1E7A54;
  --bs-success-rgb: 30, 122, 84;
  --bs-warning: #B6761A;
  --bs-warning-rgb: 182, 118, 26;
  --bs-danger: #B3352F;
  --bs-danger-rgb: 179, 53, 47;
  --bs-info: #1F8A8A;
  --bs-info-rgb: 31, 138, 138;
  --bs-light: #E9ECF1;
  --bs-light-rgb: 233, 236, 241;
  --bs-dark: #122540;
  --bs-dark-rgb: 18, 37, 64;

  --bs-body-bg: #E9ECF1;
  --bs-body-color: #1B1F24;
  --bs-body-color-rgb: 27, 31, 36;
  --bs-border-color: #D7DCE4;
  --bs-border-color-translucent: rgba(18, 37, 64, .14);
  --bs-secondary-color: #67707E;
  --bs-emphasis-color: #122540;

  --bs-body-font-family: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --bs-body-font-size: .875rem;
  --bs-font-monospace: 'IBM Plex Mono', ui-monospace, monospace;

  --bs-border-radius: .25rem;
  --bs-border-radius-sm: .1875rem;
  --bs-border-radius-lg: .375rem;

  --bs-link-color: #1F3A5F;
  --bs-link-color-rgb: 31, 58, 95;
  --bs-link-hover-color: #122540;
  --bs-link-hover-color-rgb: 18, 37, 64;

  --bs-code-color: #93241F;
  --bs-focus-ring-color: rgba(61, 97, 147, .18);
  --bs-focus-ring-width: 3px;

  --bs-box-shadow-sm: 0 2px 6px rgba(18, 37, 64, .1);
  --bs-box-shadow: 0 12px 32px rgba(18, 37, 64, .18);
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--mbk-navy-900);
  font-weight: 600;
}

/* ---------- 3. Buttons ---------- */
.btn {
  --bs-btn-padding-y: .6875rem;
  --bs-btn-padding-x: 1.125rem;
  --bs-btn-font-size: .8125rem;
  --bs-btn-font-weight: 500;
}
.btn-sm { --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .75rem; --bs-btn-font-size: .71875rem; }
.btn-page-action { --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .75rem; --bs-btn-font-size: .875rem; }
.btn-lg { --bs-btn-padding-y: .875rem; --bs-btn-padding-x: 1.375rem; --bs-btn-font-size: .90625rem; }

.btn-primary {
  --bs-btn-bg: var(--mbk-navy-700);
  --bs-btn-border-color: var(--mbk-navy-700);
  --bs-btn-hover-bg: var(--mbk-navy-900);
  --bs-btn-hover-border-color: var(--mbk-navy-900);
  --bs-btn-active-bg: var(--mbk-navy-900);
  --bs-btn-active-border-color: var(--mbk-navy-900);
  --bs-btn-disabled-bg: var(--mbk-navy-300);
  --bs-btn-disabled-border-color: var(--mbk-navy-300);
  --bs-btn-focus-shadow-rgb: 61, 97, 147;
}
.btn-outline-primary {
  --bs-btn-bg: #fff;
  --bs-btn-color: var(--mbk-navy-700);
  --bs-btn-border-color: var(--mbk-navy-300);
  --bs-btn-hover-bg: var(--mbk-navy-50);
  --bs-btn-hover-color: var(--mbk-navy-700);
  --bs-btn-hover-border-color: var(--mbk-navy-300);
  --bs-btn-active-bg: var(--mbk-navy-100);
  --bs-btn-active-color: var(--mbk-navy-900);
  --bs-btn-active-border-color: var(--mbk-navy-300);
  --bs-btn-focus-shadow-rgb: 61, 97, 147;
}
.btn-outline-secondary {
  --bs-btn-bg: #fff;
  --bs-btn-color: var(--mbk-gray-700);
  --bs-btn-border-color: var(--mbk-navy-100);
  --bs-btn-hover-bg: var(--mbk-gray-100);
  --bs-btn-hover-color: var(--mbk-gray-900);
  --bs-btn-hover-border-color: var(--mbk-navy-300);
  --bs-btn-active-bg: var(--mbk-gray-200);
  --bs-btn-active-color: var(--mbk-gray-900);
  --bs-btn-active-border-color: var(--mbk-navy-300);
  --bs-btn-focus-shadow-rgb: 61, 97, 147;
}
.btn-danger {
  --bs-btn-bg: var(--mbk-danger);
  --bs-btn-border-color: var(--mbk-danger);
  --bs-btn-hover-bg: #93241F;
  --bs-btn-hover-border-color: #93241F;
  --bs-btn-active-bg: #93241F;
  --bs-btn-active-border-color: #93241F;
  --bs-btn-focus-shadow-rgb: 179, 53, 47;
}
.btn-success {
  --bs-btn-bg: var(--mbk-success);
  --bs-btn-border-color: var(--mbk-success);
  --bs-btn-hover-bg: #155F41;
  --bs-btn-hover-border-color: #155F41;
  --bs-btn-active-bg: #155F41;
  --bs-btn-active-border-color: #155F41;
  --bs-btn-focus-shadow-rgb: 30, 122, 84;
}
.btn-link {
  --bs-btn-color: var(--mbk-navy-700);
  --bs-btn-hover-color: var(--mbk-navy-900);
  --bs-btn-focus-shadow-rgb: 61, 97, 147;
}

/* ---------- 4. Forms ---------- */
.form-control, .form-select {
  --bs-border-color: var(--mbk-navy-100);
  padding: .625rem .6875rem;
  font-size: .84375rem;
}
.form-select { padding-right: 2rem; }
.form-select-sm { padding-top: .375rem; padding-bottom: .375rem; padding-left: .5rem; padding-right: 1.875rem; }
.form-control:focus, .form-select:focus {
  border-color: var(--mbk-navy-500);
  box-shadow: 0 0 0 3px rgba(61, 97, 147, .18);
}
.form-control::placeholder { color: var(--mbk-gray-500); }
.form-control:disabled, .form-select:disabled {
  background-color: var(--mbk-gray-200);
  border-color: var(--mbk-gray-200);
  color: var(--mbk-gray-500);
  cursor: not-allowed;
}
.form-select:disabled {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%239AA1AC' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
/* a disabled field's own label and help text dim with it */
.form-label:has(+ .form-control:disabled),
.form-label:has(+ .form-select:disabled),
.form-control:disabled ~ .form-text { color: var(--mbk-gray-500); }

/* read-only: a printed value, not a control */
.form-control[readonly] {
  background-color: var(--mbk-gray-100);
  border-color: transparent;
  padding-left: 0;
  color: var(--mbk-gray-900);
}
.form-control[readonly]:focus { box-shadow: none; border-color: transparent; }
.form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%234A515B' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.form-label {
  font-size: .75rem;
  font-weight: 500;
  color: var(--mbk-gray-700);
  margin-bottom: .375rem;
}
.form-text {
  font-size: .71875rem;
  color: var(--mbk-gray-600);
}
.col-form-label { color: var(--mbk-gray-700); font-weight: 500; }

.input-group-text {
  background-color: var(--mbk-navy-50);
  border-color: var(--mbk-navy-100);
  color: var(--mbk-gray-700);
  font-family: var(--bs-font-monospace);
  font-size: .8125rem;
}

.form-check-input { border-color: var(--mbk-navy-300); }
.form-check-input:checked {
  background-color: var(--mbk-navy-700);
  border-color: var(--mbk-navy-700);
}
.form-check-input:focus {
  border-color: var(--mbk-navy-500);
  box-shadow: 0 0 0 3px rgba(61, 97, 147, .18);
}
.form-check-input:focus:not(:checked) {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%233D6193'/%3e%3c/svg%3e");
}
.form-switch .form-check-input:not(:checked):focus {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%233D6193'/%3e%3c/svg%3e");
}
.form-check-label { font-size: .8125rem; }

.was-validated .form-control:valid, .form-control.is-valid { border-color: var(--mbk-success); }
.was-validated .form-control:invalid, .form-control.is-invalid { border-color: var(--mbk-danger); }
.valid-feedback { color: var(--mbk-success); font-size: .71875rem; }
.invalid-feedback { color: var(--mbk-danger); font-size: .71875rem; }

/* Segmented control — native .btn-group + .btn-check markup */
.btn-group .btn-check + .btn-outline-primary {
  --bs-btn-color: var(--mbk-gray-700);
  --bs-btn-border-color: var(--mbk-navy-100);
  --bs-btn-bg: #fff;
  --bs-btn-hover-bg: var(--mbk-navy-50);
  --bs-btn-active-bg: var(--mbk-navy-700);
  --bs-btn-active-border-color: var(--mbk-navy-700);
  --bs-btn-active-color: #fff;
}

/* ---------- 5. Cards ---------- */
.card {
  --bs-card-bg: #fff;
  --bs-card-border-color: var(--mbk-gray-300);
  --bs-card-cap-bg: var(--mbk-navy-50);
  --bs-card-border-radius: .375rem;
  --bs-card-spacer-y: 1.5rem;
  --bs-card-spacer-x: 1.5rem;
  --bs-card-cap-padding-y: .9375rem;
  --bs-card-cap-padding-x: 1.5rem;
}
.card-header {
  font-weight: 600;
  color: var(--mbk-navy-900);
  font-size: .875rem;
}

/* ---------- 6. Tables ---------- */
.table {
  --bs-table-bg: #fff;
  --bs-table-color: var(--mbk-gray-900);
  --bs-table-border-color: #F2F4F7;
  --bs-table-hover-bg: var(--mbk-navy-50);
  --bs-table-active-bg: var(--mbk-navy-50);
  --bs-table-striped-bg: var(--mbk-gray-100);
  font-size: .8125rem;
}
.table > thead {
  --bs-table-bg: var(--mbk-navy-100);
  --bs-table-color: var(--mbk-navy-700);
  border-bottom: 1px solid var(--mbk-gray-300);
}
.table > thead th {
  font-family: var(--bs-font-monospace);
  font-size: .625rem;
  font-weight: 500;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: .625rem 1rem;
}
.table > tbody td, .table > tbody th { padding: .75rem 1rem; vertical-align: middle; }
.table > tfoot {
  --bs-table-bg: var(--mbk-gray-100);
  border-top: 1px solid var(--mbk-gray-300);
  font-weight: 600;
  color: var(--mbk-navy-900);
}
.table > tfoot td { padding: .75rem 1rem; }

/* ---------- 7. Badges ---------- */
.badge {
  --bs-badge-padding-y: .3125rem;
  --bs-badge-padding-x: .5625rem;
  --bs-badge-font-size: .65625rem;
  --bs-badge-font-weight: 500;
  --bs-badge-border-radius: var(--bs-border-radius-sm);
}

/* Solid amber badge needs a darker ground for 4.5:1 white text */
.badge.text-bg-warning { background-color: #8A5810 !important; color: #fff !important; }

/* ---------- 8. Alerts ---------- */
.alert { --bs-alert-border-radius: .3125rem; font-size: .78125rem; }
.alert-success { --bs-alert-color: #1B1F24; --bs-alert-bg: var(--mbk-success-bg); --bs-alert-border-color: #A6D3BE; }
.alert-warning { --bs-alert-color: #1B1F24; --bs-alert-bg: var(--mbk-warning-bg); --bs-alert-border-color: #DFC392; }
.alert-danger  { --bs-alert-color: #1B1F24; --bs-alert-bg: var(--mbk-danger-bg);  --bs-alert-border-color: #E7B2AE; }
.alert-info    { --bs-alert-color: #1B1F24; --bs-alert-bg: var(--mbk-info-bg);    --bs-alert-border-color: #A6D3D3; }

/* ---------- 9. Nav, tabs, pagination, breadcrumb ---------- */
.nav {
  --bs-nav-link-color: var(--mbk-gray-700);
  --bs-nav-link-hover-color: var(--mbk-navy-700);
  --bs-nav-link-font-size: .8125rem;
  --bs-nav-link-disabled-color: var(--mbk-gray-500);
}
.nav-tabs {
  --bs-nav-tabs-border-color: var(--mbk-gray-200);
  --bs-nav-tabs-link-active-color: var(--mbk-navy-700);
  --bs-nav-tabs-link-active-bg: transparent;
  --bs-nav-tabs-link-active-border-color: transparent transparent var(--mbk-navy-700);
  --bs-nav-tabs-link-hover-border-color: transparent;
  --bs-nav-tabs-border-width: 2px;
}
.nav-tabs .nav-link { font-weight: 500; }
.nav-pills {
  --bs-nav-pills-link-active-bg: var(--mbk-navy-700);
  --bs-nav-pills-border-radius: var(--bs-border-radius);
}
.pagination {
  --bs-pagination-color: var(--mbk-gray-700);
  --bs-pagination-border-color: var(--mbk-navy-100);
  --bs-pagination-hover-color: var(--mbk-navy-700);
  --bs-pagination-hover-bg: var(--mbk-gray-50);
  --bs-pagination-hover-border-color: var(--mbk-navy-300);
  --bs-pagination-active-bg: var(--mbk-navy-700);
  --bs-pagination-active-border-color: var(--mbk-navy-700);
  --bs-pagination-focus-bg: var(--mbk-navy-50);
  --bs-pagination-focus-box-shadow: 0 0 0 3px rgba(61, 97, 147, .18);
  --bs-pagination-font-size: .75rem;
  --bs-pagination-padding-y: .4375rem;
  --bs-pagination-padding-x: .6875rem;
}
.breadcrumb {
  --bs-breadcrumb-divider-color: var(--mbk-gray-500);
  --bs-breadcrumb-item-active-color: var(--mbk-gray-700);
  --bs-breadcrumb-font-size: .71875rem;
  --bs-breadcrumb-margin-bottom: 0;
}
.breadcrumb-item a { color: var(--mbk-gray-600); text-decoration: none; }
.breadcrumb-item a:hover { color: var(--mbk-navy-700); }

/* ---------- 10. Progress, dropdown, modal ---------- */
.progress {
  --bs-progress-bg: var(--mbk-navy-100);
  --bs-progress-bar-bg: var(--mbk-navy-700);
  --bs-progress-height: .5rem;
  --bs-progress-border-radius: 1rem;
}
.dropdown-menu {
  --bs-dropdown-border-color: var(--mbk-gray-200);
  --bs-dropdown-link-active-bg: var(--mbk-navy-700);
  --bs-dropdown-link-hover-bg: var(--mbk-gray-100);
  --bs-dropdown-font-size: .8125rem;
  box-shadow: var(--bs-box-shadow-sm);
}
.modal-content { box-shadow: var(--bs-box-shadow); }

/* ============================================================
   Part 2 — components Bootstrap does not ship
   ============================================================ */

/* Tabular money figures: <td class="num">1,240.00</td> */
.num {
  font-family: var(--bs-font-monospace);
  font-variant-numeric: tabular-nums;
}

/* Soft badges: <span class="badge badge-soft-success">Under budget</span> */
.badge-soft-success { color: var(--mbk-success); background-color: var(--mbk-success-bg); border: 1px solid #A6D3BE; }
.badge-soft-warning { color: #8A5810;          background-color: var(--mbk-warning-bg); border: 1px solid #DFC392; }
.badge-soft-danger  { color: #93241F;          background-color: var(--mbk-danger-bg);  border: 1px solid #E7B2AE; }
.badge-soft-info    { color: #166F6F;          background-color: var(--mbk-info-bg);    border: 1px solid #A6D3D3; }
.badge-soft-neutral { color: var(--mbk-gray-700); background-color: var(--mbk-gray-100);  border: 1px solid var(--mbk-gray-200); }
.badge-code { font-family: var(--bs-font-monospace); color: var(--mbk-gray-700); background-color: var(--mbk-gray-100); border: 1px solid var(--mbk-gray-200); }

/* Eyebrow label above a figure */
.eyebrow {
  font-family: var(--bs-font-monospace);
  font-size: .625rem;
  font-weight: 500;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--mbk-gray-600);
}

/* Dark sidebar: <nav class="sidebar"><a class="nav-link active"> */
.sidebar { background-color: var(--mbk-navy-900); border-radius: var(--bs-border-radius-lg); }
.sidebar .nav-link {
  color: var(--mbk-navy-300);
  font-size: .78125rem;
  padding: .5625rem .625rem;
  border-radius: var(--bs-border-radius);
}
.sidebar .nav-link:hover { color: #fff; background-color: var(--mbk-navy-700); }
.sidebar .nav-link.active { color: #fff; background-color: var(--mbk-navy-700); font-weight: 500; }
.sidebar .sidebar-brand { color: #fff; font-weight: 600; font-size: .8125rem; }
.sidebar .sidebar-heading { color: #6B7F9B; }
.sidebar hr { border-color: rgba(255, 255, 255, .12); opacity: 1; }

/* Emphasis stat tile: <div class="card card-emphasis"> */
.card-emphasis { background-color: var(--mbk-navy-700); border-color: var(--mbk-navy-700); color: #fff; }
.card-emphasis h1, .card-emphasis h2, .card-emphasis h3,
.card-emphasis h4, .card-emphasis h5, .card-emphasis h6,
.card-emphasis .h1, .card-emphasis .h2, .card-emphasis .h3,
.card-emphasis .h4, .card-emphasis .h5, .card-emphasis .h6,
.card-emphasis .card-header { color: #fff; }
.card-emphasis .eyebrow { color: rgba(255, 255, 255, .6); }
.card-emphasis .text-muted { color: rgba(255, 255, 255, .72) !important; }
.card-emphasis .progress { --bs-progress-bg: rgba(255, 255, 255, .18); }

/* Dropzone */
.dropzone {
  border: 1px dashed var(--mbk-navy-300);
  background-color: var(--mbk-gray-100);
  border-radius: .3125rem;
  padding: 1.125rem;
  text-align: center;
}

/* Money outcome colors */
.text-over  { color: var(--mbk-danger) !important; font-weight: 500; }
.text-under { color: var(--mbk-success) !important; font-weight: 500; }

/* Text colors */
.text-subtle-on-dark { color: var(--mbk-navy-300); }

/* Collapsible card header: <div class="card-header" data-bs-toggle="collapse"> */
.card-header[data-bs-toggle="collapse"] { cursor: pointer; }
.card-header[data-bs-toggle="collapse"] svg,
.card-header[data-bs-toggle="collapse"] .fa-chevron-up { transition: transform .15s ease-in-out; }
.card-header[aria-expanded="false"] svg,
.card-header[aria-expanded="false"] .fa-chevron-up { transform: rotate(180deg); }


/* ============================================================
   Part 3 — application frame (header / scrolling main / footer)
   ============================================================ */

/* <body class="app-shell"> — viewport-height column, only .app-main scrolls */
.app-shell {
  height: 100dvh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background-color: var(--mbk-gray-50);
}
.app-header { flex: 0 0 auto; background-color: var(--mbk-navy-900); }
.app-main   { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.app-footer {
  flex: 0 0 auto;
  background-color: #fff;
  border-top: 1px solid var(--mbk-gray-300);
  font-size: .71875rem;
  color: var(--mbk-gray-500);
}
.app-footer a { color: var(--mbk-gray-600); text-decoration: none; }
.app-footer a:hover { color: var(--mbk-navy-700); }

/* header nav matches .sidebar so both navs agree */
.app-header .navbar-brand { color: #fff; font-weight: 600; font-size: .9375rem; letter-spacing: .02em; }
.app-header .nav-link {
  color: var(--mbk-navy-300);
  font-size: .8125rem;
  font-weight: 500;
  padding: .5rem .75rem;
  border-radius: var(--bs-border-radius);
}
.app-header .nav-link:hover,
.app-header .nav-link:focus { color: #fff; background-color: var(--mbk-navy-700); }
.app-header .nav-link.active,
.app-header .show > .nav-link { color: #fff; background-color: var(--mbk-navy-700); }
.app-header .navbar-toggler {
  border-color: rgba(255, 255, 255, .2);
  padding: .3125rem .5rem;
}
.app-header .navbar-toggler:focus { box-shadow: 0 0 0 3px rgba(61, 97, 147, .35); }

/* account button: <button class="btn account-btn"> */
.account-btn {
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-bg: transparent;
  --bs-btn-hover-bg: var(--mbk-navy-700);
  --bs-btn-active-bg: var(--mbk-navy-700);
  --bs-btn-border-color: transparent;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-border-color: transparent;
  --bs-btn-padding-y: .375rem;
  --bs-btn-padding-x: .5rem;
  --bs-btn-font-size: .8125rem;
  --bs-btn-focus-shadow-rgb: 61, 97, 147;
}
.avatar-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background-color: var(--mbk-navy-500);
  color: #fff;
  font-family: var(--bs-font-monospace);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .02em;
  flex: 0 0 auto;
}

/* Info strip: one bar of labelled figures, replaces a row of stat cards.
   <div class="info-strip"><div><p class="eyebrow">…</p><span class="num">…</span></div>… */
.info-strip {
  display: flex;
  flex-wrap: wrap;
  background-color: #fff;
  border: 1px solid var(--mbk-gray-300);
  border-radius: var(--bs-border-radius);
}
.info-strip > div {
  flex: 1 1 50%;
  min-width: 0;
  padding: .5rem .875rem;
  border-left: 1px solid var(--mbk-gray-200);
}
.info-strip > div:first-child { border-left: 0; }
.info-strip .eyebrow { display: block; margin-bottom: .0625rem; }
.info-strip .info-figure {
  font-family: var(--bs-font-monospace);
  font-variant-numeric: tabular-nums;
  font-size: .9375rem;
  font-weight: 500;
  color: var(--mbk-navy-900);
  white-space: nowrap;
}
.info-strip .info-note { font-size: .6875rem; color: var(--mbk-gray-600); white-space: nowrap; }
@media (min-width: 768px) {
  .info-strip > div { flex: 1 1 0; }
}
@media (max-width: 767.98px) {
  .info-strip > div:nth-child(odd) { border-left: 0; }
  .info-strip > div:nth-child(n+3) { border-top: 1px solid var(--mbk-gray-200); }
}

/* Dense table for long cost-code lists: <table class="table table-dense"> */
.table-dense > thead th { padding: .4375rem .75rem; }
.table-dense > tbody td, .table-dense > tbody th { padding: .375rem .75rem; }
.table-dense > tfoot td { padding: .4375rem .75rem; }