/* File type/language chips */

:root{
  --chip-bg: rgba(var(--color-text), .06);
  --chip-fg: var(--grey-700); /* Use centralized token */
}

.chip{ display:inline-flex; align-items:center; height:22px; padding:0 8px; border-radius:999px; font-size:12px; line-height:22px; }
.chip + .chip{ margin-left: 6px; }

.chip-type{ font-weight: 700; letter-spacing:.02em; }
.chip-lang{ font-weight: 600; background: var(--chip-bg); color: rgb(var(--chip-fg)); }
.chip-ext{ font-weight: 600; background: var(--chip-bg); color: rgb(var(--chip-fg)); }

.chip-type--hcob, .chip-type--pab, .chip-type--btb{ background: rgba(var(--color-error), .15); color: rgb(var(--color-error)); border: 1px solid rgba(var(--color-error), .35); }
.chip-type--hcopl, .chip-type--bpl, .chip-type--fo, .chip-type--hasipl, .chip-type--seced{ background: rgba(var(--color-success), .15); color: rgb(var(--color-success)); border: 1px solid rgba(var(--color-success), .35); }
.chip-type--ed{ background: rgba(var(--color-primary), .15); color: rgb(var(--color-navy)); border: 1px solid rgba(var(--color-primary), .35); }
.chip-type--lect{ background: rgba(var(--color-text), .06); color: rgb(var(--grey-700)); border: 1px solid rgba(var(--color-text), .12); }