/* Alert callout styles for GitHub GFM > [!NOTE] / [!TIP] / etc. */
.markdown-alert {
  padding: 1.25rem;
  margin-bottom: 16px;
  border: 1px solid color-mix(in srgb, var(--workshop-alert-color) 16%, var(--workshop-page-bg));
  border-radius: 12px;
  background-color: color-mix(in srgb, var(--workshop-alert-color) 5%, var(--workshop-page-bg));
  color: var(--workshop-text);
}
.markdown-alert > :first-child { margin-top: 0; }
.markdown-alert > :last-child { margin-bottom: 0; }
.markdown-alert-title {
  display: flex;
  align-items: center;
  font-size: 1em;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 4px;
}
.markdown-alert-title svg { margin-right: 8px; }
.markdown-alert-note {
  --workshop-alert-color: #0969da;
}
.markdown-alert-note .markdown-alert-title { color: var(--workshop-alert-color); }
.markdown-alert-tip {
  --workshop-alert-color: #1a7f37;
}
.markdown-alert-tip .markdown-alert-title { color: var(--workshop-alert-color); }
.markdown-alert-important {
  --workshop-alert-color: #5f489a;
}
.markdown-alert-important .markdown-alert-title { color: var(--workshop-alert-color); }
.markdown-alert-warning {
  --workshop-alert-color: #9a6700;
}
.markdown-alert-warning .markdown-alert-title { color: var(--workshop-alert-color); }
.markdown-alert-caution {
  --workshop-alert-color: #cf222e;
}
.markdown-alert-caution .markdown-alert-title { color: var(--workshop-alert-color); }

@media (prefers-color-scheme: dark) {
  html[data-color-mode="auto"] .markdown-alert-note { --workshop-alert-color: #75cfff; }
  html[data-color-mode="auto"] .markdown-alert-tip { --workshop-alert-color: #7dd54d; }
  html[data-color-mode="auto"] .markdown-alert-important { --workshop-alert-color: #c3b5e4; }
  html[data-color-mode="auto"] .markdown-alert-warning { --workshop-alert-color: #eaa734; }
  html[data-color-mode="auto"] .markdown-alert-caution { --workshop-alert-color: #ff554d; }
}
html[data-color-mode="dark"] .markdown-alert-note { --workshop-alert-color: #75cfff; }
html[data-color-mode="dark"] .markdown-alert-tip { --workshop-alert-color: #7dd54d; }
html[data-color-mode="dark"] .markdown-alert-important { --workshop-alert-color: #c3b5e4; }
html[data-color-mode="dark"] .markdown-alert-warning { --workshop-alert-color: #eaa734; }
html[data-color-mode="dark"] .markdown-alert-caution { --workshop-alert-color: #ff554d; }
