/* Complifly Technical Documentation — audience and deprecation marking.
 *
 * Loaded via `extra_css` in mkdocs.yml. Paired with overrides/docs/main.html.
 *
 * Two jobs, both of them about a reader who arrived from a search engine rather
 * than from the front page:
 *
 *   1. Say who the page is for, and who it is not for, above the fold. The page
 *      contract already requires this in prose; by the time it is read the
 *      reader has usually committed.
 *   2. Say loudly when a page describes something on its way out, because a
 *      stale page read as current is worse than a missing one.
 */

/* --- audience strip ----------------------------------------------------- */

.cf-aud {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem 1.1rem;
  margin: 0 0 1.2rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-left: 3px solid var(--md-primary-fg-color);
  background: var(--md-code-bg-color);
  font-size: 0.68rem;
  line-height: 1.55;
  color: var(--md-default-fg-color--light);
}

.cf-aud__row { display: inline-flex; align-items: baseline; gap: 0.3rem; }

.cf-aud__lbl {
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  font-size: 0.6rem;
  color: var(--md-default-fg-color--lighter);
}
.cf-aud__lbl--x { color: #9c5511; }

.cf-aud__meta {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  color: var(--md-default-fg-color--lighter);
}

@media screen and (max-width: 44.9em) {
  .cf-aud__meta { margin-left: 0; }
}

/* --- deprecation banner -------------------------------------------------- */

.cf-dep {
  display: block;
  margin: 0 0 1.2rem;
  padding: 0.7rem 0.9rem;
  border: 1px solid #9c5511;
  border-left: 4px solid #9c5511;
  background: rgba(156, 85, 17, 0.08);
  font-size: 0.75rem;
  line-height: 1.6;
}

.cf-dep__tag {
  display: inline-block;
  margin-right: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.62rem;
  color: #9c5511;
}

.cf-dep__when { display: block; margin-top: 0.3rem; font-weight: 600; }