/* Clair / SpaceX-inspired application skin. Reference: /DESIGN.md.
 * This is a product adaptation: every record, navigation destination, table
 * geometry and status remains. No photograph is placed behind business data.
 * Loaded last, with page-family sheets following it. */
@font-face {
  font-family: 'D-DIN'; font-style: normal; font-weight: 400;
  font-display: swap; src: url("../fonts/d-din/D-DIN.513ab2a5980b.woff2") format('woff2');
}
@font-face {
  font-family: 'D-DIN'; font-style: normal; font-weight: 600 900;
  font-display: swap; src: url("../fonts/d-din/D-DIN-Bold.fb679b253199.woff2") format('woff2');
}
:root {
  color-scheme: dark;
  --sx-bg: #000; --sx-surface: #0a0a0a; --sx-raised: #111;
  --sx-text: #fff; --sx-muted: #b5b5bd; --sx-line: #3a3a3f;
  --sx-font: 'D-DIN', 'Arial Narrow', Arial, Verdana, sans-serif;
  --crs-font-body: var(--sx-font); --crs-font-mono: var(--sx-font);
  --crs-black: #000; --crs-charcoal: #fff; --crs-slate: #dedee4;
  --crs-gray-900: #f0f0fa; --crs-gray-700: #c7c7ce;
  --crs-gray-600: #b5b5bd; --crs-gray-500: #9999a2;
  --crs-gray-400: #64646e; --crs-gray-300: #3a3a3f;
  --crs-gray-200: #242427; --crs-gray-100: #000; --crs-white: #0a0a0a;
  --crs-red: #fff; --crs-red-dark: #d5d5df;
  --crs-red-light: #19191d; --crs-red-tint: #242427;
  --crs-money: #fff;
  --crs-success: #91d7b1; --crs-success-bg: #11281d;
  --crs-warning: #e9c67d; --crs-warning-bg: #2b2415;
  --crs-danger: #ffaaa9; --crs-danger-bg: #301b1e; --crs-info: #abcdf2;
  /* Legacy sheets also reference these tokens, always as `var(token, <light
     literal>)`. They were never re-mapped here, so every one of them silently
     fell back to its light-mode literal -- a white card, a #1f2937 label --
     on a black page. Completing the inversion fixes those at the source
     instead of per-selector. Only fallback users are affected. */
  --crs-gray-50: #0f0f11; --crs-gray-800: #dedee4; --crs-green: #8be0b1;
  --clair-bg: #000; --clair-card-bg: #0a0a0a; --clair-border: #3a3a3f;
  --clair-text: #fff; --clair-text-secondary: #c7c7ce; --clair-muted: #b5b5bd;
  --clair-primary: #f0f0fa;
  --crs-radius: 4px; --crs-radius-lg: 4px;
  --crs-shadow-sm: none; --crs-shadow-md: none; --crs-shadow-lg: none;
  --crs-control-h: 40px; --crs-trans: 180ms ease;
}
html { background: var(--sx-bg); scroll-padding-top: 88px; }
body.clair-spacex {
  background: var(--sx-bg) !important; color: var(--sx-text);
  font-family: var(--sx-font) !important; font-size: 16px; line-height: 1.5;
  letter-spacing: .02em; min-height: 100dvh; accent-color: #fff;
}
body.clair-spacex ::selection { background: #eee; color: #000; }
body.clair-spacex :is(h1,h2,h3,h4,h5,h6) {
  font-family: var(--sx-font) !important; color: var(--sx-text);
  font-weight: 700; letter-spacing: .04em; line-height: 1.15;
}
body.clair-spacex :is(h1,h2,h3,h4) { text-transform: uppercase !important; }
body.clair-spacex h1 { font-size: clamp(2rem, 3.2vw, 3.5rem); }
body.clair-spacex :is(p,li,td) { font-variant-numeric: tabular-nums; }
body.clair-spacex a { color: #f0f0fa; }
body.clair-spacex a:hover { color: #fff; }
body.clair-spacex :is(.text-dark,.text-body,.text-primary) { color: var(--sx-text) !important; }
body.clair-spacex :is(.text-muted,.text-secondary,small.text-muted,.help-block,.form-text) { color: var(--sx-muted) !important; }
body.clair-spacex .text-success { color: var(--crs-success) !important; }
body.clair-spacex .text-warning { color: var(--crs-warning) !important; }
body.clair-spacex .text-danger { color: var(--crs-danger) !important; }
body.clair-spacex .text-info { color: var(--crs-info) !important; }
body.clair-spacex :is(.bg-white,.bg-light) { background: var(--sx-surface) !important; }
body.clair-spacex hr { border-color: var(--sx-line); }
body.clair-spacex :is(code,pre,.text-monospace,.mono) { color: #e2e2ea; }
body.clair-spacex #content { background: var(--sx-bg); min-width: 0; }
body.clair-spacex #content:focus { outline: none; }
body.clair-spacex .sx-skip-link {
  position: fixed; top: 8px; left: 16px; z-index: 100001;
  padding: 12px 20px; background: #fff; color: #000;
  transform: translateY(-150%); border-radius: 4px;
}
body.clair-spacex .sx-skip-link:focus { transform: translateY(0); }
body.clair-spacex :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 2px solid #fff !important; outline-offset: 4px;
  box-shadow: none !important;
}
/* One restrained navigation bar; existing collapse and access gates stay. */
body.clair-spacex #header.navbar {
  min-height: 76px; padding: 12px clamp(16px, 2.5vw, 40px);
  padding-left: max(16px, env(safe-area-inset-left));
  padding-right: max(16px, env(safe-area-inset-right));
  background: #000 !important; border-bottom: 1px solid var(--sx-line);
  box-shadow: none !important; color: #fff;
}
body.clair-spacex #header .navbar-brand {
  color: #fff !important; gap: 12px; margin-right: 24px;
  font-family: var(--sx-font); text-transform: uppercase;
}
body.clair-spacex #header .brand-icon { filter: grayscale(1) brightness(0) invert(1); }
body.clair-spacex #header .brand-text {
  color: #fff; font-weight: 700; letter-spacing: .13em; font-size: 15px;
}
body.clair-spacex #header :is(.nav-link,.navbar-toggler,#logout_link) {
  color: #f0f0fa !important; font-family: var(--sx-font);
  text-transform: uppercase; font-weight: 700; letter-spacing: .075em;
  font-size: 12px; background: transparent; border-color: var(--sx-line);
}
body.clair-spacex #header .nav-link {
  padding: 12px 10px; border-radius: 0;
  border-bottom: 1px solid transparent; white-space: nowrap;
}
body.clair-spacex #header .nav-link:hover,
body.clair-spacex #header .nav-link[aria-current='page'] {
  border-bottom-color: #fff; background: transparent !important;
}
body.clair-spacex #header .nav-link i { font-size: 11px; color: #b5b5bd; }
/* Dark-theme colours for the navbar's "Commissions" group heading.
   Paradigm's teal (the login eyebrow's #a8d5df family) separates the
   label from the white links without competing with them; on #000 it
   clears WCAG AA comfortably at this size. */
body.clair-spacex #header .nav-group-label {
  font-family: var(--sx-font); color: #8bcad8; font-size: 10px;
  font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
body.clair-spacex #header .nav-group-commissions { border-left-color: var(--sx-line); border-right-color: var(--sx-line); }
body.clair-spacex #header .navbar-toggler { min-width: 44px; min-height: 44px; }
/* clair_theme.css's #header.navbar carries an unconditional
   `flex-wrap: wrap` (no media guard, no !important, but nothing else
   in the cascade overrides it), so the brand and the expanded nav still
   split onto two rows at every width, even above navbar-expand-xl's
   1200px unwrap point (Sep 16 2026: moved from lg/992px -- five
   always-visible top-level items overflowed the row at 1024px). Force
   one row at desktop widths only; below 1200px the collapsed-menu wrap
   is exactly what the hamburger drawer needs, so it is left alone. */
@media (min-width: 1200px) {
  body.clair-spacex #header.navbar { flex-wrap: nowrap; }
  body.clair-spacex #primaryNav.navbar-collapse { flex-wrap: nowrap; }
}
body.clair-spacex :is(.dropdown-menu,.dt-button-collection,.popover,.tooltip-inner) {
  background: #111 !important; color: #fff !important;
  border: 1px solid var(--sx-line) !important; border-radius: 4px;
  box-shadow: none !important;
}
body.clair-spacex :is(.dropdown-item,.dropdown-menu .dropdown-item) {
  color: #e3e3ea !important; background: transparent;
  font-size: 14px; padding-top: 10px; padding-bottom: 10px;
}
body.clair-spacex :is(.dropdown-item:hover,.dropdown-item:focus,.dropdown-item.active) {
  background: #262629 !important; color: #fff !important;
}
body.clair-spacex :is(.dropdown-header,.popover-header) {
  color: #b5b5bd !important; background: #111 !important; border-color: var(--sx-line);
}
body.clair-spacex .popover-body { color: #f0f0fa; }
body.clair-spacex .dropdown-divider { border-color: var(--sx-line); }
/* Controls keep their existing sizing/layout and submit semantics. */
body.clair-spacex :is(.btn,button.login_btn,input[type='submit'],.sales-card-action) {
  color: #fff; background: transparent; border: 1px solid #73737c;
  border-radius: 32px; min-height: 40px; padding: 10px 18px;
  font-family: var(--sx-font); font-size: 12px; font-weight: 700;
  line-height: 1.25; letter-spacing: .075em; text-transform: uppercase;
  box-shadow: none !important; transition: background .18s, color .18s, border-color .18s;
}
body.clair-spacex :is(.btn-primary,.btn-secondary,.btn-dark,.btn-outline-primary,.btn-outline-secondary,.btn-outline-dark) {
  background: transparent !important; color: #fff !important; border-color: #8b8b94 !important;
}
/* Selected segment. The rule above is !important and had no .active
   partner, so a chosen toggle rendered identically to an unchosen one:
   /sales/forecasting/ Granularity + Valuation, and Team Summary's
   TTM/YTD/Range. Inverted fill is this theme's existing selected look
   (.nav-pills .nav-link.active, .page-item.active .page-link).
   .crs-seg-btn keeps its own treatment -- it is not .btn-outline-*. */
body.clair-spacex :is(.btn-primary,.btn-secondary,.btn-dark,.btn-outline-primary,.btn-outline-secondary,.btn-outline-dark):is(.active,[aria-current]),
body.clair-spacex .btn-group > .btn:is(.active,[aria-current]) {
  background: #fff !important; color: #000 !important; border-color: #fff !important;
}
/* Selection has to survive the pointer leaving and the neighbour being
   hovered, and has to be visible to a keyboard user. */
body.clair-spacex .btn-group > .btn:is(.active,[aria-current]):hover,
body.clair-spacex :is(.btn-outline-primary,.btn-outline-secondary,.btn-outline-dark):is(.active,[aria-current]):hover {
  background: #fff !important; color: #000 !important; border-color: #fff !important;
}
/* A hovered UNselected neighbour stops short of the full inversion, so
   the two states stay distinguishable while the pointer is in the group. */
body.clair-spacex .btn-group > .btn:not(.active):not([aria-current]):not(:disabled):hover {
  background: #2b2b30 !important; color: #fff !important; border-color: #fff !important;
}
body.clair-spacex :is(.btn,.sales-card-action):not(:disabled):not(.disabled):hover,
body.clair-spacex :is(.btn-primary,.btn-secondary,.btn-dark):not(:disabled):hover {
  color: #000 !important; background: #fff !important; border-color: #fff !important;
}
body.clair-spacex :is(.btn-danger,.btn-outline-danger) { color: #ffaaa9 !important; border-color: #a16367 !important; background: #241417 !important; }
body.clair-spacex :is(.btn-success,.btn-outline-success) { color: #91d7b1 !important; border-color: #527c63 !important; background: #11281d !important; }
body.clair-spacex .btn-sm { padding: 7px 12px; min-height: 34px; font-size: 11px; }
body.clair-spacex :is(.btn:disabled,.btn.disabled) { opacity: .5; cursor: not-allowed; }
body.clair-spacex .btn-group > .btn { border-radius: 0; }
body.clair-spacex .btn-group > .btn:first-child { border-radius: 32px 0 0 32px; }
body.clair-spacex .btn-group > .btn:last-child { border-radius: 0 32px 32px 0; }
body.clair-spacex .btn-group > .btn:only-child { border-radius: 32px; }
body.clair-spacex :is(.form-control,.custom-select,textarea,select,input[type='text'],input[type='search'],input[type='email'],input[type='password'],input[type='number'],input[type='date'],input[type='url']) {
  background-color: #111 !important; color: #fff !important;
  border: 1px solid #55555e; border-radius: 4px; box-shadow: none !important;
  font-family: var(--sx-font); font-size: 16px; min-height: 40px;
}
body.clair-spacex :is(input,textarea)::placeholder { color: #a7a7b0 !important; opacity: 1; }
body.clair-spacex :is(input,textarea,select):disabled { color: #aaa !important; background: #1b1b1e !important; }
body.clair-spacex label { color: #e3e3ea; }
body.clair-spacex :is(.input-group-text,.custom-file-label) { background: #19191c; color: #ddd; border-color: #55555e; }
body.clair-spacex :is(.select2-container--default .select2-selection--single,.select2-container--default .select2-selection--multiple,.select2-dropdown) {
  background: #111 !important; border-color: #55555e !important; color: #fff;
}
body.clair-spacex :is(.select2-selection__rendered,.select2-results__option) { color: #f0f0fa !important; }
body.clair-spacex .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #333 !important; }
body.clair-spacex .select2-container--default .select2-results__option[aria-selected=true] { background: #262629; }
/* Surfaces and tables: no table width/overflow/colgroup changes here. */
body.clair-spacex :is(.card,.modal-content,.list-group-item) {
  background: var(--sx-surface); color: #f0f0fa;
  border-color: var(--sx-line); border-radius: 4px; box-shadow: none !important;
}
body.clair-spacex :is(.card-header,.card-footer,.modal-header,.modal-footer) {
  color: #fff; background: transparent; border-color: var(--sx-line);
}
body.clair-spacex .card-header { padding: 18px 20px; }
body.clair-spacex :is(.card-title,.card-header h3,.card-header h4) { letter-spacing: .075em; }
body.clair-spacex :is(.table,table.dataTable) { color: #f0f0fa; background: transparent; }
body.clair-spacex :is(.table td,.table th,table.dataTable td,table.dataTable th) { border-color: #303034 !important; }
body.clair-spacex :is(.table thead th,.dt-scroll-head thead th) {
  background: #18181b !important; color: #f0f0fa !important;
  font-family: var(--sx-font); font-weight: 700; letter-spacing: .055em;
}
body.clair-spacex :is(.table tfoot th,.table tfoot td,.dt-scroll-foot tfoot th,.dt-scroll-foot tfoot td) {
  background: #18181b !important; color: #fff !important;
}
body.clair-spacex .table-striped tbody tr:nth-of-type(odd) { background: #101012; }
body.clair-spacex .table-hover tbody tr:hover { background: #222225; color: #fff; }
body.clair-spacex table.dataTable tbody tr.selected > * { background: #303038 !important; color: #fff !important; box-shadow: none !important; }
body.clair-spacex :is(.dt-info,.dt-length,.dt-search,.dataTables_info,.dataTables_length,.dataTables_filter) { color: #b5b5bd !important; }
body.clair-spacex :is(.page-link,.pagination .page-link) { color: #ddd; background: #111; border-color: #3a3a3f; }
body.clair-spacex :is(.page-item.active .page-link,.page-link:hover) { color: #000; background: #eee; border-color: #eee; }
body.clair-spacex .page-item.disabled .page-link { color: #999; background: #111; border-color: #3a3a3f; }
body.clair-spacex :is(.nav-tabs,.nav-pills) { border-color: var(--sx-line); }
body.clair-spacex .nav-tabs .nav-link { color: #b5b5bd; background: transparent; border-color: transparent; }
body.clair-spacex .nav-tabs .nav-link.active { color: #fff; background: #111; border-color: #555 #555 #111; }
body.clair-spacex .nav-pills .nav-link.active { color: #000; background: #fff; }
body.clair-spacex .badge { font-weight: 400; letter-spacing: .025em; }
body.clair-spacex :is(.badge-primary,.badge-secondary,.badge-light,.badge-dark) { background: #252528; color: #eee; }
body.clair-spacex :is(.badge-success,.alert-success) { background: #11281d; color: #a5e3c0; border-color: #456a54; }
body.clair-spacex :is(.badge-warning,.alert-warning) { background: #2b2415; color: #f0d28f; border-color: #77633d; }
body.clair-spacex :is(.badge-danger,.alert-danger,.errorlist) { background: #301b1e; color: #ffb6b4; border-color: #986065; }
body.clair-spacex :is(.badge-info,.alert-info) { background: #152432; color: #bbd9fa; border-color: #4d697f; }
body.clair-spacex .close { color: #fff; text-shadow: none; opacity: .8; }
body.clair-spacex .progress { background: #29292e; }
body.clair-spacex .progress-bar { background: #ddd; color: #000; }
body.clair-spacex .breadcrumb { background: transparent; color: #b5b5bd; }
body.clair-spacex .breadcrumb-item.active { color: #b5b5bd; }
body.clair-spacex #page-loading-overlay { background: rgba(0,0,0,.94) !important; }
body.clair-spacex #page-loading-overlay > div { border-color: #38383f !important; border-top-color: #fff !important; }
body.clair-spacex #page-loading-overlay #loading-label { color: #f0f0fa !important; letter-spacing: .075em; text-transform: uppercase; }
body.clair-spacex :is(.footer,footer) { background: #000; color: #aaa; border-color: #3a3a3f; }
@media (max-width: 1199px) {
  body.clair-spacex #header .brand-text-full { display: none !important; }
  body.clair-spacex #header .brand-text-short { display: inline !important; font-size: 24px; letter-spacing: .15em; }
}
/* The flex-column body must not shrink an expanded header to its minimum. */
@media (max-width: 1199px) {
  body.clair-spacex #header.navbar { min-height: 64px; padding-top: 10px; padding-bottom: 10px; flex-shrink: 0; }
  body.clair-spacex #header.navbar:has(#primaryNav.show, #primaryNav.collapsing) {
    max-height: 100dvh;
    overflow-y: auto;
  }
  body.clair-spacex #primaryNav { background: #000; padding: 12px 0; }
  body.clair-spacex #header .nav-link { min-height: 44px; padding: 12px; }
}
@media (max-width: 768px), (pointer: coarse) {
  :root { --crs-control-h: 44px; }
  body.clair-spacex :is(.btn,.btn-sm,input[type='submit'],.page-link,.sidebar-toggle) { min-height: 44px; }
  body.clair-spacex :is(.form-control,.custom-select,select) { min-height: 44px; }
  body.clair-spacex .card-header { padding: 14px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  body.clair-spacex *, body.clair-spacex *::before, body.clair-spacex *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
}
@media print {
  :root { color-scheme: light; }
  body.clair-spacex, body.clair-spacex #content { background: #fff !important; color: #000 !important; }
  body.clair-spacex :is(.card,.table,td,th,p,h1,h2,h3,h4,a) { background: #fff !important; color: #000 !important; border-color: #aaa !important; }
  body.clair-spacex :is(#header,.sx-skip-link,#page-loading-overlay) { display: none !important; }
}

/* =====================================================================
   Live authenticated contrast repair (audit 2026-09-15).
   One root cause repeated across the app: legacy sheets predate the
   monochrome inversion and still (a) paint surfaces from tokens that now
   resolve LIGHT, (b) paint text from tokens that now resolve DARK, or
   (c) hard-code a light surface / dark ink outright. Each block below
   repaints only colour on the exact reported selectors -- no geometry,
   no position/sticky/width/z-index, no markup or behaviour.
   ===================================================================== */

/* Status badges. clair_theme.css marks its light-theme ink !important
   (#9A5604 / #236B43), which outranked this sheet's earlier non-important
   pale-on-dark intent, leaving dark ink on the dark badge fill. */
body.clair-spacex .badge-warning,
body.clair-spacex .cv3-page .badge-warning {
  background-color: var(--crs-warning-bg) !important;
  color: #f0d28f !important; border-color: #77633d !important;
}
body.clair-spacex .badge-success,
body.clair-spacex .cv3-page .badge-success {
  background-color: var(--crs-success-bg) !important;
  color: #a5e3c0 !important; border-color: #456a54 !important;
}
body.clair-spacex .badge-danger,
body.clair-spacex .cv3-page .badge-danger {
  background-color: var(--crs-danger-bg) !important;
  color: #ffb6b4 !important; border-color: #986065 !important;
}
body.clair-spacex .badge-info,
body.clair-spacex .cv3-page .badge-info {
  background-color: #152432 !important;
  color: #bbd9fa !important; border-color: #4d697f !important;
}
body.clair-spacex :is(.badge-primary, .badge-secondary, .badge-light, .badge-dark) {
  color: #e4e4e8 !important;
}

/* Trend chips and the KPI highlight tag: light-theme ink on the tinted
   dark chip. Tint and semantic direction (up = positive) are unchanged. */
body.clair-spacex .trend-chip-up { color: #8be0b1; border-color: rgb(139 224 177 / 35%); }
body.clair-spacex .trend-chip-down { color: #ffaaa9; border-color: rgb(255 170 169 / 35%); }
body.clair-spacex .trend-chip-flat { background: #1b1b1f; color: #c7c7ce; border-color: var(--sx-line); }
/* The Peak / Low / MoM pills stay pale chips with their own semantic ink
   (green peak, red low, amber current) -- they are self-consistent and
   readable. Only the tag's backing tint was dark enough to pull the pill's
   dark label under 4.5:1, so the tint is lightened rather than inverted. */
body.clair-spacex .kpi-hl-tag { background: rgb(15 23 42 / 4%); color: inherit; }

/* .alert-light is Bootstrap's near-white panel (help boxes on the finance
   pages and the invoice-line payment narrative). `.border` sets its own
   !important border colour, so the border is re-stated here. */
body.clair-spacex .alert-light {
  background-color: var(--sx-surface) !important;
  color: #e3e3ea !important;
  border-color: var(--sx-line) !important;
}
body.clair-spacex .alert-light :is(a, .alert-link) { color: #fff !important; text-decoration: underline; }
body.clair-spacex .alert-light :is(.text-muted, .text-secondary, small, .small) { color: #b5b5bd !important; }
body.clair-spacex .alert-light :is(strong, b, h1, h2, h3, h4, h5, h6) { color: #fff !important; }

/* Wide finance tables (Invoice Register, Orphans, A/R Doc-Drift,
   Bad-Debt Write-offs, Monthly Close history). clair_theme.css pins the
   first column and .table-col-sticky with a hard-coded #fff / #f2f2f2 /
   #e9ecef fill so the pinned cell stays opaque while the rest pans --
   correct mechanic, light-theme paint. Only the paint changes here:
   position, left, z-index and the separating shadow are untouched. */
body.clair-spacex .admin-wide-table :is(thead th:first-child, tbody td:first-child,
  tfoot td:first-child, tfoot th:first-child, th.table-col-sticky, td.table-col-sticky) {
  background: var(--sx-surface) !important;
  color: var(--sx-text);
  box-shadow: 1px 0 0 var(--sx-line);
}
body.clair-spacex .admin-wide-table.table-striped tbody tr:nth-of-type(odd)
  :is(td:first-child, td.table-col-sticky) {
  background: #141416 !important;
}
body.clair-spacex .admin-wide-table thead:is(.thead-dark, .thead-light)
  :is(th:first-child, th.table-col-sticky) {
  background: #18181b !important;
  color: #f0f0fa !important;
}
/* commission_layout.css paints this header band from --cv3-ink -- an INK
   token, which the inversion turned white, so a dark header band became a
   white one under near-white type. Restore the dark band. */
body.clair-spacex .cv3-page table.admin-wide-table thead.thead-dark th,
body.clair-spacex .cv3-page .table thead.thead-dark th,
body.clair-spacex .table thead.thead-dark th {
  background: #18181b !important;
  color: #f0f0fa !important;
  border-bottom-color: var(--sx-line) !important;
}
/* DataTables wraps a pinned header label in its own span, which inherits
   nothing from the th's colour when a legacy rule re-states it. */
body.clair-spacex :is(.table, table.dataTable) thead th :is(.dt-column-title, .dt-column-order),
body.clair-spacex .dt-scroll-head thead th :is(.dt-column-title, .dt-column-order) {
  color: #f0f0fa !important;
}
body.clair-spacex .admin-wide-table :is(td, th) :is(.text-muted, .small.text-muted) { color: #b5b5bd !important; }
body.clair-spacex .admin-wide-table :is(td, th) a { color: #f0f0fa; }
