/* gsm.farmsimgame.com only. The look itself is fsg.css and docs.css (copies of
   FarmSimGame.com's); this adds what the Server Manager pages need on top. */

html { scroll-behavior: smooth; }

/* Brand: the Farm Sim Game logo with the product name next to it */
.gsm-brand { display: inline-flex; align-items: center; gap: .6rem; }
.gsm-brand img { display: block; height: 35px; width: auto; }
.gsm-brand span {
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--fsg-text-muted);
  padding-left: .6rem;
  border-left: 1px solid var(--fsg-border-strong);
  line-height: 1.2;
}
/* Phones: logo only, so the menu button stays on the same line as on FarmSimGame.com */
@media (max-width: 575.98px) { .gsm-brand span { display: none; } }

/* Home hero, as on FarmSimGame.com's home page (lime band, dark text) */
.home-hero { background: var(--fsg-accent); color: var(--fsg-on-accent); }
.home-hero h1 {
  font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.12;
  color: var(--fsg-on-accent);
}
.home-hero .fsg-kicker { color: var(--fsg-on-accent); opacity: .7; }
.home-hero .db-lead { color: var(--fsg-on-accent); opacity: .85; }
.home-hero .home-note { color: var(--fsg-on-accent); opacity: .7; }
.home-hero .btn-fsg {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--fsg-on-accent);
  --bs-btn-border-color: var(--fsg-on-accent);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #24394a;
  --bs-btn-hover-border-color: #24394a;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #24394a;
  --bs-btn-active-border-color: #24394a;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--fsg-on-accent);
  --bs-btn-disabled-border-color: var(--fsg-on-accent);
}
.home-hero .btn-outline-fsg {
  --bs-btn-color: var(--fsg-on-accent);
  --bs-btn-border-color: rgba(22, 35, 44, .45);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--fsg-on-accent);
  --bs-btn-hover-border-color: var(--fsg-on-accent);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--fsg-on-accent);
  --bs-btn-active-border-color: var(--fsg-on-accent);
}
.home-shot {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--fsg-radius);
  border: 1px solid rgba(22, 35, 44, .35);
  box-shadow: 0 12px 32px rgba(22, 35, 44, .35);
}
.home-note { color: var(--fsg-text-muted); font-size: .9rem; }
.home-h2 {
  font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2rem);
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--fsg-text-strong);
  margin-bottom: .6rem;
}
.home-checklist li { display: flex; gap: .6rem; }
.home-checklist li .bi { color: var(--fsg-accent-soft); flex: 0 0 auto; margin-top: .1rem; }

/* Download box */
.download-card { padding: 1rem 1.25rem; }
.download-card h3 { margin: 0 0 .15rem; }
.download-card p { margin: 0; }
.btn.disabled[data-download] { pointer-events: none; }

/* Partner link lists (Keys & DLC) */
.docs-content ul.buy {
  list-style: none;
  padding: 0;
  border: 1px solid var(--fsg-border);
  border-radius: var(--fsg-radius);
  background: var(--fsg-surface);
  overflow: hidden;
}
.docs-content ul.buy li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .25rem 1rem;
  margin: 0;
  padding: .6rem 1rem;
  border-top: 1px solid var(--fsg-border);
}
.docs-content ul.buy li:first-child { border-top: 0; }
.docs-content ul.buy li span { color: var(--fsg-text-muted); font-size: .9rem; }

/* Screenshots and captions in articles */
.docs-content figure { margin: 1.25rem 0; }
.docs-content figure .docs-img { margin: 0 0 .4rem; }

/* SHA-512 line wraps instead of scrolling */
.docs-code pre.sha code { white-space: pre-wrap; word-break: break-all; }

/* FAQ entries */
.docs-content .docs-details-body > :last-child { margin-bottom: .5rem; }
.docs-content .docs-details summary { line-height: 1.5; }

/* Changelog (filled in by site.js) */
.release h3 { font-size: 1.1rem; margin: 1.5rem 0 .5rem; }
.release h3 .text-body-secondary { font-size: .9rem; font-weight: 400; margin-left: .35rem; }

/* Legal pages: a panel like FarmSimGame.com's, with the docs text styles inside */
.legal-content .legal-heading { margin-top: 2.25rem; scroll-margin-top: calc(var(--fsg-nav-height) + 20px); }
.legal-content > .legal-heading:first-child { margin-top: .25rem; }
.legal-content .docs-table { background: var(--fsg-surface-alt); }