/*
 * Channel notice shown by assets/js/version.js.
 *
 * Rendered as the last child of #quarto-header, which is where Quarto places its
 * own announcement bar, so it reads as part of the top bar rather than as a block
 * of page content. Colours come from Bootstrap's alert variants so that both the
 * light (cosmo) and dark (darkly) themes are handled without hardcoding any.
 */
.a2cps-channel-notice {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.25rem 0.75rem;
  margin-bottom: 0;
  padding: 0.3rem 0.75rem;
  border-width: 0;
  border-radius: 0;
  font-size: 0.85rem;
  line-height: 1.4;
  text-align: center;
}

/* Outlined in the notice's own text colour, so it stays legible on every variant
   in both themes without a per-variant rule. */
.a2cps-channel-notice .a2cps-channel-action {
  flex: none;
  padding: 0 0.5rem;
  border: 1px solid currentColor;
  border-radius: 0.25rem;
  color: inherit;
  font-size: 0.8rem;
  text-decoration: none;
  white-space: nowrap;
}

.a2cps-channel-notice .a2cps-channel-action:hover,
.a2cps-channel-notice .a2cps-channel-action:focus {
  color: inherit;
  text-decoration: none;
  opacity: 0.75;
}