.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  margin-right: .55rem;
  border-radius: .55rem;
  background: #f4f4f5;
  color: #18181b;
  font-weight: 800;
}

/* 顶部导航栏固定：滚动时保持可见，与宿主项目外壳（如 Elvis9 主题）的固定导航行为一致 */
.page > header.navbar {
  position: sticky;
  top: 0;
  z-index: 1030;
}

.figo-theme-swatch { background: linear-gradient(135deg, #171717 0 33%, #737373 33% 66%, #f4f4f4 66%); }
body.d-flex.flex-column:not(.body-marketing) { background: var(--tblr-body-bg, #171717) !important; color: var(--tblr-body-color, #e5e5e5); }
.tox-tinymce, .tox .tox-toolbar, .tox .tox-toolbar__primary { border-color: #404040 !important; }
.tox .tox-toolbar, .tox .tox-toolbar__overflow, .tox .tox-edit-area { background: #202020 !important; }
.tox .tox-tbtn svg, .tox .tox-tbtn { color: #d4d4d4 !important; fill: currentColor !important; }

/* Keep active pagination readable in the neutral dark theme. The upstream
   inverted primary uses a light surface, so its white active text otherwise
   disappears against the active background. */
[data-bs-theme="dark"] .pagination .page-item.active > .page-link,
[data-bs-theme="dark"] .pagination .page-link.active {
  color: #18181b !important;
  background-color: #f4f4f5 !important;
  border-color: #f4f4f5 !important;
}

/* Marketing pages use the same neutral palette without washing the source
   artwork out with the inverted light primary color. */
[data-bs-theme="dark"] body.body-marketing .hero.bg-primary {
  background-color: rgba(23, 23, 23, .62) !important;
  --tblr-bg-opacity: 1 !important;
}

/* Tabler's dark mode hard-codes blue-tinted values for a few surface tokens
   (tertiary/secondary bg, dark, active bg, borders), so the neutral base gray
   remap cannot neutralize them. Dashboard pages get the approved values from
   base.css, but marketing pages only load this file — mirror the same tokens
   here so both shells share one neutral dark palette. body-bg and bg-surface
   are intentionally absent: they already derive from the neutral gray scale. */
:root[data-bs-theme="dark"][data-bs-theme-base="neutral"] {
  --tblr-dark: #262626;
  --tblr-dark-rgb: 38, 38, 38;
  --tblr-light: var(--tblr-gray-100);
  --tblr-light-rgb: 245, 245, 245;
  --tblr-secondary-bg: #242424;
  --tblr-secondary-bg-rgb: 36, 36, 36;
  --tblr-tertiary-bg: #262626;
  --tblr-tertiary-bg-rgb: 38, 38, 38;
  --tblr-active-bg: #333333;
  --tblr-border-color: #333333;
  --tblr-border-color-translucent: color-mix(in srgb, var(--tblr-white) 14%, transparent);
  --tblr-border-dark-color: #262626;
  --tblr-border-active-color: #525252;
  --tblr-dark-mode-border-color: #333333;
  --tblr-dark-mode-border-color-translucent: color-mix(in srgb, var(--tblr-white) 14%, transparent);
  --tblr-dark-mode-border-dark-color: #262626;
  --tblr-dark-mode-border-active-color: #525252;
}

/* Prevent the English source DOM from flashing before the local Chinese and
   Figo theme layer has completed. Compare previews do not load this script. */
html:not([data-figo-ready]) body[data-ui-layout],
html:not([data-figo-ready]) body.layout-boxed,
html:not([data-figo-ready]) body.layout-fluid,
html:not([data-figo-ready]) body.layout-horizontal,
html:not([data-figo-ready]) body.layout-vertical { visibility: hidden; }
body { overflow-x: clip; }

/* These two source pages use a full-width Bootstrap row inside the page body.
   Scope the gutter correction to those cases so other layouts keep their
   original spacing contract. */
.figo-case-job-listing .page-body .container-xl > .row.g-4,
.figo-case-search-results .page-body .container-xl > .row.g-4 {
  margin-right: 0;
}

/* Preserve the upstream mention appearance without a missing vendor avatar. */
.mention-avatar[style*="035f.jpg"] {
  background-image: none !important;
  background-color: var(--tblr-primary);
}

/* Keep the boxed shell intact when the top catalogue is wider than the
   viewport. The catalogue may scroll; the theme control remains inside the
   same container instead of being pushed outside it. */
@media (min-width: 1200px) {
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .container-xl > .row {
    flex-wrap: nowrap;
    min-width: 0;
  }
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .container-xl > .row > .col:first-child {
    min-width: 0;
    overflow: visible;
  }
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .navbar-nav,
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .nav-link,
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .nav-link-title { white-space: nowrap; }
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .navbar-nav {
    flex-wrap: nowrap;
    gap: 0;
  }
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .nav-link {
    padding-left: .38rem;
    padding-right: .38rem;
    font-size: .82rem;
  }
  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .container-xl > .row > .col-md-auto {
    flex: 0 0 auto;
    white-space: nowrap;
  }
}

/* The combo/sidebar shell has no .container-xl row, so the boxed-shell rules
   above cannot protect it. Keep its horizontal catalogue a single line and
   use the available width without allowing item text to wrap. */
@media (min-width: 768px) {
  #navbar-menu .navbar-nav,
  #navbar-menu .navbar-nav .nav-link,
  #navbar-menu .navbar-nav .nav-link-title { white-space: nowrap; }
  #navbar-menu .navbar-nav { min-width: 0; }
}

/* Combo shell: its sidebar consumes part of the viewport, so keep the same
   catalogue inside the remaining top bar instead of letting the last items
   disappear beyond the window. */
@media (min-width: 1200px) {
  body[data-ui-shell="combo"] #navbar-menu .navbar-nav {
    flex-wrap: nowrap;
  }
  body[data-ui-shell="combo"] #navbar-menu .nav-link {
    padding-left: .2rem;
    padding-right: .2rem;
    font-size: .72rem;
  }
  body[data-ui-shell="combo"] #navbar-menu .nav-link-icon {
    margin-right: .15rem;
  }
  body[data-ui-shell="combo"] header.navbar .navbar-nav.order-md-last {
    margin-right: 0;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }
  /* The combo shell has a fixed sidebar and a compact top-right action area.
     Keep the account text from widening that area beyond the viewport. */
  body[data-ui-shell="combo"] header.navbar .navbar-nav.order-md-last .d-none.d-xl-block {
    display: none !important;
  }
}

.brand-label {
  color: var(--tblr-body-color);
  font-weight: 650;
  letter-spacing: .02em;
}

[data-bs-theme="dark"] .brand-mark {
  background: #e4e4e7;
  color: #18181b;
}

/* Keep the final theme control visually separate from the catalogue items. */
@media (min-width: 768px) {
  #navbar-menu .row > .col:last-child {
    position: relative;
    z-index: 2;
    background: var(--tblr-bg-surface, var(--tblr-bg-surface-secondary, #1f1f1f));
    padding-left: 1rem;
    white-space: nowrap;
  }
}

/* 平板宽度保持外壳可收起，避免 md 展开规则造成横向溢出。 */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .page > header.navbar.navbar-expand-md .navbar-toggler,
  header.navbar.navbar-expand-md .navbar-toggler {
    display: block !important;
  }

  .page > header.navbar.navbar-expand-md .navbar-nav.order-md-last,
  header.navbar.navbar-expand-md .navbar-nav.order-md-last {
    display: none !important;
  }

  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu:not(.show),
  header.navbar-expand-md #navbar-menu:not(.show) {
    display: none !important;
  }

  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu.show,
  header.navbar-expand-md #navbar-menu.show {
    display: block !important;
  }

  .page > header.navbar-expand-md + header.navbar-expand-md #navbar-menu .navbar-nav,
  header.navbar-expand-md #navbar-menu .navbar-nav {
    flex-direction: column;
  }
}