.markup blockquote.attention-header {
  padding: 0.5em 0.75em;
  color: var(--color-text);
  border-inline-start-color: var(--attention-color);
}

.attention-title {
  align-items: center;
  display: flex;
  color: var(--attention-color);

  svg {
    margin: auto 0.5em auto 0;
  }
}

.attention-note {
  --attention-color: var(--color-thin-blue);
}
.attention-tip {
  --attention-color: var(--color-thin-green);
}
.attention-important {
  --attention-color: var(--color-thin-violet);
}
.attention-warning {
  --attention-color: var(--color-warning-text);
}
.attention-caution {
  --attention-color: var(--color-thin-red);
}