.docs-left { position: sticky; top: 24px; align-self: flex-start; }
.docs-article { max-height: calc(100vh - 220px); overflow: auto; padding-right: 8px; }
.docs-article::-webkit-scrollbar { width: 8px; }
.docs-article::-webkit-scrollbar-thumb { background: #cfd7e6; border-radius: 6px; }
.docs-article:hover::-webkit-scrollbar-thumb { background: #b9c4d8; }
/* Docs hero */
.docs-hero {
  background: linear-gradient(135deg, #12151d 0%, #1b1f2a 60%, #0f1117 100%);
  color: #fff;
}
.docs-top-cta { color: #dbe3f2; border-color: #dbe3f2; }
.docs-top-cta:hover { color: #0b1220; background: #dbe3f2; border-color: #dbe3f2; }
.docs-hero .docs-search {
  max-width: 860px;
}
.docs-search-input {
  background: #1a1f2b;
  border: 1px solid #2c3448;
  color: #e8eaed;
  height: 56px;
  padding-left: 3rem;
}
.docs-search-input::placeholder { color: #a9b1c1; }
.docs-search-icon {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: #a9b1c1;
}

/* Breadcrumb bar */
.docs-breadcrumb {
  background: #fff;
  border-bottom: 1px solid #eef0f3;
}

/* Full-bleed breadcrumb bar with container-aligned content */
.docs-breadcrumb { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding-left: calc(50vw - 50%); padding-right: calc(50vw - 50%); }

/* Stretch hero edge-to-edge while keeping inner content aligned to container */
.docs-hero { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding-left: calc(50vw - 50%); padding-right: calc(50vw - 50%); }

/* Sidebar */
.docs-sidebar .list-group-item {
  border: 0;
  border-radius: 8px;
  margin-bottom: 6px;
}
.docs-sidebar .list-group-item.active,
.docs-sidebar .list-group-item:hover {
  background: #eef4ff;
  color: #0b5ed7;
}

/* Sub navigation inside a page */
.docs-subnav {
  padding: 12px;
  background: #ffffff;
  border: 1px solid #eef0f3;
  border-radius: 12px;
}
.docs-subnav a {
  display: block;
  padding: 6px 8px;
  border-radius: 8px;
  color: #0b5ed7;
  text-decoration: none;
}
.docs-subnav a:hover { background: #eef4ff; }

/* Cards */
.docs-card {
  background: #ffffff;
  border: 1px solid #eef0f3;
  border-radius: 12px;
  padding: 18px 20px;
}
.docs-card:hover {
  box-shadow: none;
  transform: none;
}
.docs-card h5 { margin-bottom: .25rem; }
.docs-card .meta {
  font-size: .85rem; color: #667085;
}
.docs-popularity {
  display: inline-flex; gap: 4px; vertical-align: middle;
}
.docs-popularity i { width: 8px; height: 8px; border-radius: 50%; background: #d0d5dd; display: inline-block; }
.docs-popularity i.active { background: #0b5ed7; }

.docs-kicker { font-size: .85rem; color: #667085; }