/* Boost.space AgentOS docs — layered on content/theme.css, which both sites share.
   Only what is specific to AgentOS lives here. */

/* AgentOS screenshots are cropped captures of the product at about 1.4x. At full column width a
   narrow dialog reads soft and oversized, so it keeps close to its natural size and centres. */
img[data-scalar-name="scalar-image"][src*="/img/agentos/"] {
  max-width: min(100%, 520px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Wide screens (a whole page or table) may use the column. */
img[data-scalar-name="scalar-image"][src*="/img/agentos/"][src*="-wide"] {
  max-width: 100% !important;
}

/* ---- Cards: the Overview's paths and guides, the Quickstart's next steps ----
   Plain divs and one anchor per card, styled like the roadmap's cards in content/theme.css, so the
   markdown twin agents read (<route>/index.md) gets one line of text per card. The grid keeps a
   card at least 220px wide and answers to the content column, not the window. */
.bs-cards {
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  margin: 14px 0 32px;
}
.bs-cards-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, max(250px, calc((100% - 10px) / 2))), 1fr)); }
a.bs-card {
  display: block;
  border: 1px solid var(--scalar-border-color);
  border-radius: 14px;
  background: var(--scalar-background-2);
  padding: 14px 16px 15px;
  text-decoration: none !important;
  transition: transform 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}
a.bs-card:hover {
  transform: translateY(-1px);
  border-color: rgba(120, 57, 238, 0.55);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}
.bs-card-eyebrow {
  margin-bottom: 6px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--scalar-color-accent);
}
.bs-card-title {
  margin-bottom: 4px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--scalar-color-1);
}
.bs-card-text {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--scalar-color-2);
}
/* Numbered cards: the Overview's three steps to a first agent at work. */
.bs-cards-steps { counter-reset: bs-step; }
.bs-cards-steps a.bs-card { position: relative; padding-left: 56px; }
.bs-cards-steps a.bs-card::before {
  counter-increment: bs-step;
  content: counter(bs-step);
  position: absolute;
  top: 14px;
  left: 16px;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #7839ee;
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
}

/* The line under a page title that says which docs these are, on the Overview and Support. */
.bs-docs-note {
  margin: -6px 0 22px;
  font-size: 13.5px;
  color: var(--scalar-color-3);
}
