/* Twiin attribute tags — palette and value→colour mapping mirrored from the
 * Confluence converter (CF_HEX). Used for Vereiste, Status, Functie, Rol,
 * Patroon, Niveau, Toepassing, Actor, Toetsingscategorie, Toetsingsvorm. */

.tw-tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  vertical-align: middle;
  margin: 2px 3px 2px 0;
  white-space: nowrap;
  text-decoration: none;
}

.tw-tag--grey   { background: #DFE1E6; color: #42526E; }
.tw-tag--red    { background: #FFEBE6; color: #DE350B; }
.tw-tag--yellow { background: #FFFAE6; color: #974F0C; }
.tw-tag--green  { background: #E3FCEF; color: #006644; }
.tw-tag--blue   { background: #DEEBFF; color: #0052CC; }
.tw-tag--purple { background: #EAE6FF; color: #403294; }
.tw-tag--teal   { background: #E6FCFF; color: #505F79; }
.tw-tag--orange { background: #FCA700; color: #172B4D; }
.tw-tag--lime   { background: #B3DF72; color: #172B4D; }
.tw-tag--pink   { background: #F797D2; color: #FFFFFF; }
.tw-tag--dark   { background: #42526E; color: #FFFFFF; }
.tw-tag--navy   { background: #0747A6; color: #FFFFFF; }
.tw-tag--amber  { background: #FFF0B3; color: #7A4F00; }
.tw-tag--coral  { background: #FFD5CC; color: #AE2E24; }
.tw-tag--sky    { background: #B3F5FF; color: #206B74; }