/* ============================================================
   ShipIt toolkit pages — product language
   Loaded by documentation.html, updates.html and store.html
   after styles.css.

   These pages are a product context: the accent stays on
   content — in-page links, labels, bullet dots, numbers, content
   buttons and the documentation sidebar. Two things follow the
   umbrella instead:

   1. Global chrome. The top nav and the footer use the neutral
      studio accent, matching privacy.html and 404.html. Both
      contexts share the single monochrome family in styles.css
      :root, which the [data-theme="light"] block flips, so the
      chrome needs no declarations of its own.
   2. Headings. Hero headings are solid; the accent never fills a
      heading. `.gradient-text` inherits the heading colour
      instead of painting itself in the accent.

   The shared primary button uses the sixth accent token
   (--accent-press) from styles.css :root.

   Every rule here changes colour only: no geometry, so no
   layout shift is possible from the language pass. (The
   release-row list repair that used to live here is now the
   default .check-list layout in styles.dev.css.)
   ============================================================ */

/* Content buttons keep the product accent, including the press state */
.button:active {
  background: var(--accent-press);
}

/* ------------------------------------------------------------
   Global chrome — umbrella (studio neutral)
   ------------------------------------------------------------ */
/* Scoped to the nav containers and the footer so the rule outranks
   `.nav-links a[aria-current="page"]` (0,2,1) and keeps the button
   label readable even when the store CTA is marked as current. */
.site-nav .nav-links .button,
.site-nav .mobile-nav-panel .button,
.site-footer .button {
  background: var(--accent);
  color: var(--accent-ink);
}

.site-nav .nav-links .button:hover,
.site-nav .mobile-nav-panel .button:hover,
.site-footer .button:hover {
  background: var(--accent-hover);
  color: var(--accent-ink);
}

.site-nav .nav-links .button:active,
.site-nav .mobile-nav-panel .button:active,
.site-footer .button:active {
  background: var(--accent-press);
  color: var(--accent-ink);
}

@media (hover: hover) and (pointer: fine) {
  .site-nav .nav-links .button:hover,
  .site-nav .mobile-nav-panel .button:hover,
  .site-footer .button:hover {
  }
}

/* ------------------------------------------------------------
   Headings are solid; the accent never fills them
   ------------------------------------------------------------ */
.gradient-text {
  color: inherit;
}
