/* Supplementary CSS that does not need Sass preprocessing. */

.tag {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-radius: 3px;
  margin-right: 0.4rem;
  vertical-align: middle;
}

.tag-beginner   { background: #e8f4ea; color: #2d6a4f; }
.tag-intermediate { background: #e7eef9; color: #1d4e89; }
.tag-advanced    { background: #fde7e3; color: #9b2226; }

.tag-mlm, .tag-mlm-moderator, .tag-mlm-two-intercept, .tag-mlm-moderated {
  background: #e7eef9; color: #1d4e89;
}

.tag-sem, .tag-sem-wide, .tag-sem-moderation, .tag-sem-moderated {
  background: #fef0e1; color: #9b5d2a;
}

dl {
  margin: 0.5rem 0 1.25rem 0;
}

dt {
  font-weight: 600;
  color: #2C3E50;
  margin-top: 0.6rem;
}

dd {
  margin-left: 1.25rem;
  color: #495057;
}

.script-listing {
  font-family: SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.85rem;
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 6px;
  padding: 1rem 1.25rem;
  margin: 1rem 0;
}

.script-listing strong { color: #2C3E50; }

section.level2 {
  border-top: 1px solid #e9ecef;
  padding-top: 1.5rem;
  margin-top: 2.5rem;
}

.ref-item {
  background: #fdfdfb;
  border-left: 3px solid #4C72B0;
  padding: 0.85rem 1.1rem 0.6rem 1.1rem;
  margin: 0.85rem 0;
  border-radius: 0 4px 4px 0;
}

.ref-item p:first-child { margin-top: 0; }
.ref-item p:last-child  { margin-bottom: 0; }
