:root {
  --global-bc-height: 38px;
  --global-header-gap: 0px;
}

html {
  scroll-padding-top: calc(var(--global-bc-height) + 76px);
}

body.global-breadcrumb-enabled {
  padding-top: var(--global-bc-height) !important;
}

/*
 * Breadcrumb and main navigation occupy separate fixed/sticky rows.
 * The body padding positions the normal document flow; the explicit
 * top offset also keeps sticky/fixed headers below the breadcrumb
 * after the page has been scrolled.
 */
body.global-breadcrumb-enabled .topbar,
body.global-breadcrumb-enabled .v31-topbar {
  top: calc(var(--global-bc-height) + var(--global-header-gap)) !important;
}

.global-breadcrumb {
  position: fixed;
  z-index: 10000;
  top: 0;
  left: 0;
  right: 0;
  height: var(--global-bc-height);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 12px;
  background: color-mix(in srgb, var(--panel, #fff) 96%, transparent);
  color: var(--text, #172033);
  border-bottom: 1px solid var(--line, #dbe3ef);
  box-shadow: 0 2px 10px rgba(15, 23, 42, .06);
  font: 12px/1.2 Inter, "Segoe UI", Arial, sans-serif;
  white-space: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}

.global-breadcrumb a,
.global-breadcrumb span {
  flex: 0 0 auto;
}

.global-breadcrumb a {
  color: var(--muted, #64748b);
  text-decoration: none;
  padding: 5px 7px;
  border-radius: 6px;
}

.global-breadcrumb a:hover {
  background: var(--panel2, #f1f5f9);
  color: var(--accent, #2563eb);
}

.global-breadcrumb .bc-sep {
  color: var(--muted, #94a3b8);
  opacity: .7;
}

.global-breadcrumb .bc-current {
  font-weight: 750;
  color: var(--accent, #2563eb);
  padding: 5px 7px;
}

.global-breadcrumb .bc-section {
  font-weight: 700;
  color: var(--text, #172033);
}

@media (max-width: 700px) {
  :root {
    --global-bc-height: 34px;
  }

  html {
    scroll-padding-top: calc(var(--global-bc-height) + 68px);
  }

  .global-breadcrumb {
    padding: 0 7px;
    font-size: 11px;
  }

  .global-breadcrumb a,
  .global-breadcrumb .bc-current {
    padding: 4px 5px;
  }
}

@media print {
  body.global-breadcrumb-enabled {
    padding-top: 0 !important;
  }

  .global-breadcrumb {
    display: none !important;
  }

  body.global-breadcrumb-enabled .topbar,
  body.global-breadcrumb-enabled .v31-topbar {
    top: 0 !important;
  }
}