/* Release badges, shared by every documentation site.

   Usage in Markdown (raw HTML, inline):
     <span class="backport" title="Published in 9.4.8 and every later 9.4 release">9.4.8+</span>
     <span class="backport partial" title="Partly published in ...: which part">9.4.8+</span>

   .backport          change also published in an older maintenance series,
                      from the version shown onward ("9.4.8+").
   .backport.partial  only part of the entry was published there; the title
                      attribute names the part (shown on hover). */

.md-typeset .backport {
  display: inline-block;
  padding: 0 0.45em;
  margin: 0 0.1em;
  border: 1px solid rgba(37, 54, 71, 0.28);
  border-radius: 1em;
  background-color: rgba(37, 54, 71, 0.06);
  color: #3c5166;
  font-size: 0.68rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.5;
  vertical-align: 0.08em;
  white-space: nowrap;
  cursor: help;
}

.md-typeset .backport.partial {
  border-style: dashed;
  background-color: transparent;
}

/* "New device" badge, for a changelog entry that adds support for a device
   never supported by an earlier firmware.

   Usage in Markdown (raw HTML, inline, right after the bold title):
     <span class="new-device" title="First available in firmware 3.0.20">New device</span>

   inline-block, not inline-flex: WeasyPrint (PDF) lays inline-flex out as a
   full-width block. Same pill shape as .backport, tinted with the brand teal and led by a dot
   so it reads as a status marker. #00677b on the light tint is above 4.5:1. */

.md-typeset .new-device {
  display: inline-block;
  padding: 0 0.55em 0 0.45em;
  margin: 0 0.15em;
  border: 1px solid rgba(0, 168, 204, 0.45);
  border-radius: 1em;
  background-color: rgba(0, 168, 204, 0.09);
  color: #00677b;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.5;
  vertical-align: 0.08em;
  white-space: nowrap;
  cursor: help;
}

.md-typeset .new-device::before {
  content: "";
  display: inline-block;
  margin-right: 0.35em;
  vertical-align: 0.1em;
  width: 0.45em;
  height: 0.45em;
  border-radius: 50%;
  background-color: #00a8cc;
}

/* "Migrated device" badge, for a device brought over from an earlier firmware
   format (firmware 1.4 to 3.0). Same pill as .new-device in the neutral slate
   of .backport, with a hollow dot so it reads as secondary to "New device".

   Usage:
     <span class="migrated-device" title="Migrated from firmware 1.4 in firmware 3.0.12">Migrated device</span> */

.md-typeset .migrated-device {
  display: inline-block;
  padding: 0 0.55em 0 0.45em;
  margin: 0 0.15em;
  border: 1px solid rgba(37, 54, 71, 0.28);
  border-radius: 1em;
  background-color: rgba(37, 54, 71, 0.05);
  color: #3c5166;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.5;
  vertical-align: 0.08em;
  white-space: nowrap;
  cursor: help;
}

.md-typeset .migrated-device::before {
  content: "";
  display: inline-block;
  margin-right: 0.35em;
  vertical-align: 0.1em;
  box-sizing: border-box;
  width: 0.5em;
  height: 0.5em;
  border: 1.5px solid #6b7f93;
  border-radius: 50%;
}

/* "Withdrawn device" badge, for a device removed for good from the hardware
   library, usually deprecated in favor of a replacement. Same pill, muted brick
   tone, led by a short bar. #9a3328 on the light tint is above 4.5:1.

   Usage:
     <span class="withdrawn-device" title="Withdrawn in firmware 3.0.16: replaced by the generic camera trigger">Withdrawn device</span> */

.md-typeset .withdrawn-device {
  display: inline-block;
  padding: 0 0.55em 0 0.45em;
  margin: 0 0.15em;
  border: 1px solid rgba(176, 58, 46, 0.35);
  border-radius: 1em;
  background-color: rgba(176, 58, 46, 0.06);
  color: #9a3328;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.5;
  vertical-align: 0.08em;
  white-space: nowrap;
  cursor: help;
}

.md-typeset .withdrawn-device::before {
  content: "";
  display: inline-block;
  margin-right: 0.35em;
  vertical-align: 0.3em;
  width: 0.5em;
  height: 1.5px;
  border-radius: 1px;
  background-color: #b03a2e;
}
