/* Course website styles. Custom admonition types for the house theory and example boxes
   (docs/authoring/STYLE.md §5): !!! definition, theorem, lemma, proposition, corollary, proof,
   algorithm, invariant, notation, example, real-world, pitfall. one block per type;
   icons are Material Design Icons (Apache-2.0). */

:root {
  --course-icon-book: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2M6 4h5v8l-2.5-1.5L6 12V4z'/></svg>");
  --course-icon-sigma: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M18 6H8.83l6 6-6 6H18v2H6v-2l6-6-6-6V4h12v2z'/></svg>");
  --course-icon-lemma: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2 2 7l10 5 10-5-10-5m0 13-10-5v4l10 5 10-5v-4l-10 5z'/></svg>");
  --course-icon-check: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2m-9 14-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z'/></svg>");
  --course-icon-flask: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 19a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1c0-.21-.07-.41-.18-.57L13 8.35V4h-2v4.35L5.18 18.43c-.11.16-.18.36-.18.57m1 3a3 3 0 0 1-3-3c0-.6.18-1.16.5-1.63L9 7.81V6a1 1 0 0 1-1-1V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v1a1 1 0 0 1-1 1v1.81l5.5 9.56c.32.47.5 1.03.5 1.63a3 3 0 0 1-3 3H6z'/></svg>");
  --course-icon-terminal: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 19V7H4v12h16m0-16a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16m-7 14v-2h5v2h-5m-3.42-4L5.57 9H8.4l3.3 3.3c.39.39.39 1.03 0 1.42L8.42 17H5.59l3.99-4z'/></svg>");
  --course-icon-code: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M14.6 16.6l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4m-5.2 0L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4z'/></svg>");
  --course-icon-lock: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 17a2 2 0 0 0 2-2 2 2 0 0 0-2-2 2 2 0 0 0-2 2 2 2 0 0 0 2 2m6-9a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V10a2 2 0 0 1 2-2h1V6a5 5 0 0 1 5-5 5 5 0 0 1 5 5v2h1m-6-5a3 3 0 0 0-3 3v2h6V6a3 3 0 0 0-3-3z'/></svg>");
  --course-icon-alert: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M13 14h-2V9h2m0 9h-2v-2h2M1 21h22L12 2 1 21z'/></svg>");
  --course-icon-abc: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M3 11h2V9H3v2m8-6h-2v14h2V5m4 4v2h6V9h-6m0 4v2h6v-2h-6M3 15h2v-2H3v2m0-8h2V5H3v2z'/></svg>");
}

.md-typeset .admonition.definition,
.md-typeset details.definition { border-color: rgb(68, 138, 255); }
.md-typeset .definition > .admonition-title,
.md-typeset .definition > summary { background-color: rgba(68, 138, 255, 0.1); }
.md-typeset .definition > .admonition-title::before,
.md-typeset .definition > summary::before {
  background-color: rgb(68, 138, 255);
  -webkit-mask-image: var(--course-icon-book);
  mask-image: var(--course-icon-book);
}

.md-typeset .admonition.notation,
.md-typeset details.notation { border-color: rgb(96, 125, 139); }
.md-typeset .notation > .admonition-title,
.md-typeset .notation > summary { background-color: rgba(96, 125, 139, 0.1); }
.md-typeset .notation > .admonition-title::before,
.md-typeset .notation > summary::before {
  background-color: rgb(96, 125, 139);
  -webkit-mask-image: var(--course-icon-abc);
  mask-image: var(--course-icon-abc);
}

.md-typeset .admonition.theorem,
.md-typeset details.theorem { border-color: rgb(124, 77, 255); }
.md-typeset .theorem > .admonition-title,
.md-typeset .theorem > summary { background-color: rgba(124, 77, 255, 0.1); }
.md-typeset .theorem > .admonition-title::before,
.md-typeset .theorem > summary::before {
  background-color: rgb(124, 77, 255);
  -webkit-mask-image: var(--course-icon-sigma);
  mask-image: var(--course-icon-sigma);
}

.md-typeset .admonition.proposition,
.md-typeset details.proposition { border-color: rgb(124, 77, 255); }
.md-typeset .proposition > .admonition-title,
.md-typeset .proposition > summary { background-color: rgba(124, 77, 255, 0.1); }
.md-typeset .proposition > .admonition-title::before,
.md-typeset .proposition > summary::before {
  background-color: rgb(124, 77, 255);
  -webkit-mask-image: var(--course-icon-sigma);
  mask-image: var(--course-icon-sigma);
}

.md-typeset .admonition.corollary,
.md-typeset details.corollary { border-color: rgb(149, 117, 205); }
.md-typeset .corollary > .admonition-title,
.md-typeset .corollary > summary { background-color: rgba(149, 117, 205, 0.1); }
.md-typeset .corollary > .admonition-title::before,
.md-typeset .corollary > summary::before {
  background-color: rgb(149, 117, 205);
  -webkit-mask-image: var(--course-icon-sigma);
  mask-image: var(--course-icon-sigma);
}

.md-typeset .admonition.lemma,
.md-typeset details.lemma { border-color: rgb(149, 117, 205); }
.md-typeset .lemma > .admonition-title,
.md-typeset .lemma > summary { background-color: rgba(149, 117, 205, 0.1); }
.md-typeset .lemma > .admonition-title::before,
.md-typeset .lemma > summary::before {
  background-color: rgb(149, 117, 205);
  -webkit-mask-image: var(--course-icon-lemma);
  mask-image: var(--course-icon-lemma);
}

.md-typeset .admonition.proof,
.md-typeset details.proof { border-color: rgb(0, 150, 136); }
.md-typeset .proof > .admonition-title,
.md-typeset .proof > summary { background-color: rgba(0, 150, 136, 0.1); }
.md-typeset .proof > .admonition-title::before,
.md-typeset .proof > summary::before {
  background-color: rgb(0, 150, 136);
  -webkit-mask-image: var(--course-icon-check);
  mask-image: var(--course-icon-check);
}

.md-typeset .admonition.algorithm,
.md-typeset details.algorithm { border-color: rgb(0, 131, 143); }
.md-typeset .algorithm > .admonition-title,
.md-typeset .algorithm > summary { background-color: rgba(0, 131, 143, 0.1); }
.md-typeset .algorithm > .admonition-title::before,
.md-typeset .algorithm > summary::before {
  background-color: rgb(0, 131, 143);
  -webkit-mask-image: var(--course-icon-code);
  mask-image: var(--course-icon-code);
}

.md-typeset .admonition.invariant,
.md-typeset details.invariant { border-color: rgb(0, 121, 107); }
.md-typeset .invariant > .admonition-title,
.md-typeset .invariant > summary { background-color: rgba(0, 121, 107, 0.1); }
.md-typeset .invariant > .admonition-title::before,
.md-typeset .invariant > summary::before {
  background-color: rgb(0, 121, 107);
  -webkit-mask-image: var(--course-icon-lock);
  mask-image: var(--course-icon-lock);
}

.md-typeset .admonition.example,
.md-typeset details.example { border-color: rgb(124, 179, 66); }
.md-typeset .example > .admonition-title,
.md-typeset .example > summary { background-color: rgba(124, 179, 66, 0.1); }
.md-typeset .example > .admonition-title::before,
.md-typeset .example > summary::before {
  background-color: rgb(124, 179, 66);
  -webkit-mask-image: var(--course-icon-flask);
  mask-image: var(--course-icon-flask);
}

.md-typeset .admonition.real-world,
.md-typeset details.real-world { border-color: rgb(255, 145, 0); }
.md-typeset .real-world > .admonition-title,
.md-typeset .real-world > summary { background-color: rgba(255, 145, 0, 0.1); }
.md-typeset .real-world > .admonition-title::before,
.md-typeset .real-world > summary::before {
  background-color: rgb(255, 145, 0);
  -webkit-mask-image: var(--course-icon-terminal);
  mask-image: var(--course-icon-terminal);
}

.md-typeset .admonition.pitfall,
.md-typeset details.pitfall { border-color: rgb(255, 82, 82); }
.md-typeset .pitfall > .admonition-title,
.md-typeset .pitfall > summary { background-color: rgba(255, 82, 82, 0.1); }
.md-typeset .pitfall > .admonition-title::before,
.md-typeset .pitfall > summary::before {
  background-color: rgb(255, 82, 82);
  -webkit-mask-image: var(--course-icon-alert);
  mask-image: var(--course-icon-alert);
}

/* Statements read like a book: upright title, slanted body for theorem-like boxes. */
.md-typeset .admonition.theorem > :not(.admonition-title),
.md-typeset .admonition.lemma > :not(.admonition-title),
.md-typeset .admonition.proposition > :not(.admonition-title),
.md-typeset .admonition.corollary > :not(.admonition-title) { font-style: italic; }
.md-typeset .admonition.theorem .arithmatex,
.md-typeset .admonition.lemma .arithmatex { font-style: normal; }

/* Proofs end with a tombstone. */
.md-typeset .admonition.proof > :last-child::after,
.md-typeset details.proof > :last-child::after { content: " \220E"; float: right; }

/* Real-world boxes: commands and captured output are the point; give them room. */
.md-typeset .admonition.real-world pre { max-height: 32rem; }

/* Pseudo-code and trace tables. */
.md-typeset table:not([class]) { font-size: 0.72rem; }
.md-typeset table:not([class]) td { vertical-align: top; }

/* Generated flashcards page. */
.course-flashcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); gap: 0.6rem; }
.md-typeset details.course-card { margin: 0; border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.3rem; padding: 0.5rem 0.7rem; background: var(--md-code-bg-color); }
.md-typeset details.course-card > summary { cursor: pointer; font-weight: 600; list-style: none; }
.md-typeset details.course-card > summary::-webkit-details-marker { display: none; }
.course-card-back { margin-top: 0.5rem; border-top: 1px dashed var(--md-default-fg-color--lighter); padding-top: 0.4rem; }
.course-card-tags { margin-top: 0.3rem; font-size: 0.65rem; opacity: 0.7; }

/* Generated quiz page (questions only). */
.course-quiz-q { border-left: 3px solid var(--md-accent-fg-color); padding: 0.3rem 0 0.3rem 0.8rem; margin: 1.2rem 0; }
.course-quiz-head { font-size: 0.7rem; opacity: 0.85; margin-bottom: 0.3rem; }
.course-quiz-prompt { font-family: var(--md-text-font-family); }
.course-quiz-prompt > p:first-child, .course-card-back > p:first-child { margin-top: 0; }
.course-quiz-choices { margin-top: 0.4rem; }
.course-quiz-keys, .course-quiz-format { font-size: 0.7rem; opacity: 0.8; margin-top: 0.3rem; }

/* Bibliography. */
.md-typeset ul li > span[id^="ref-"] { scroll-margin-top: 4rem; }