/* ---------------------------------------------------------------------------
   Object-Oriented Programming using C++ — site style overrides
   ---------------------------------------------------------------------------
   Deliberately minimal. MkDocs Material is already accessible and well
   designed; these rules exist only for things the course needs specifically.
   Do not add decorative rules here — the theme's defaults are better tested.
   --------------------------------------------------------------------------- */

/* Source-code blocks: let long example lines scroll instead of being clipped or
   silently truncated, so no part of an example is ever hidden from a reader. */
.md-typeset pre > code {
  white-space: pre;
  overflow-x: auto;
}

/* Inline code: keep identifiers visually distinct from surrounding prose, which
   matters a great deal in a course that discusses `const` and `std::` inline. */
.md-typeset code {
  word-break: break-word;
}

/* Tables: wide tables of modules, operators and error messages are common in
   this course. Allow horizontal scrolling rather than squashing the columns. */
.md-typeset table:not([class]) {
  display: block;
  overflow-x: auto;
  max-width: 100%;
}

/* Admonitions carry much of this course's "watch out" content; a slightly
   stronger left border helps them stand out when skimming. */
.md-typeset .admonition,
.md-typeset details {
  border-left-width: 0.3rem;
}

/* Keyboard key hints (used in the setup pages) must remain legible in both the
   light and dark palettes. */
.md-typeset kbd {
  font-size: 0.85em;
}

/* ---------------------------------------------------------------------------
   The five callouts
   ---------------------------------------------------------------------------
   The course uses five kinds of callout, and no others:

     !!! important      "Read this before you start"      must-know information
     !!! tip            "Predict before you run"          something that helps
     !!! warning        "Destructors must not throw"      something that hurts
     !!! common-mistake "Copying an owning class"        a defect students make
     !!! challenge      "Extend it once it works"        optional extra work

   `tip` and `warning` are Material's own types. `important` is restyled here to
   look different from `tip`, and `common-mistake` and `challenge` are new types
   defined by this stylesheet — Material has no equivalent for either.

   Each type reuses an icon the theme already ships, through the theme's own CSS
   variables, so nothing here embeds icon artwork of its own. If a variable name
   ever changes upstream, the callout still renders: only its icon is lost.
   -------------------------------------------------------------------------- */

/* Important — must-know, not merely helpful. Indigo, with the information icon. */
.md-typeset .admonition.important,
.md-typeset details.important {
  border-color: #3f51b5;
}
.md-typeset .important > .admonition-title,
.md-typeset .important > summary {
  background-color: rgba(63, 81, 181, 0.1);
}
.md-typeset .important > .admonition-title::before,
.md-typeset .important > summary::before {
  background-color: #3f51b5;
  -webkit-mask-image: var(--md-admonition-icon--info);
  mask-image: var(--md-admonition-icon--info);
}

/* Common mistake — the defect students actually make, and how it shows up.
   The bug icon is Material's own; the red is chosen to read as "this is wrong". */
.md-typeset .admonition.common-mistake,
.md-typeset details.common-mistake {
  border-color: #c62828;
}
.md-typeset .common-mistake > .admonition-title,
.md-typeset .common-mistake > summary {
  background-color: rgba(198, 40, 40, 0.1);
}
.md-typeset .common-mistake > .admonition-title::before,
.md-typeset .common-mistake > summary::before {
  background-color: #c62828;
  -webkit-mask-image: var(--md-admonition-icon--bug);
  mask-image: var(--md-admonition-icon--bug);
}

/* Challenge — optional work for a reader who wants more. Purple, with the
   theme's example icon, because it always asks the reader to build something. */
.md-typeset .admonition.challenge,
.md-typeset details.challenge {
  border-color: #6a1b9a;
}
.md-typeset .challenge > .admonition-title,
.md-typeset .challenge > summary {
  background-color: rgba(106, 27, 154, 0.1);
}
.md-typeset .challenge > .admonition-title::before,
.md-typeset .challenge > summary::before {
  background-color: #6a1b9a;
  -webkit-mask-image: var(--md-admonition-icon--example);
  mask-image: var(--md-admonition-icon--example);
}

/* The dark palette needs lighter tints: the light-palette colours above are too
   dark to read against a dark page. Same five callouts, same meaning. */
[data-md-color-scheme="slate"] .md-typeset .admonition.important,
[data-md-color-scheme="slate"] .md-typeset details.important {
  border-color: #9fa8da;
}
[data-md-color-scheme="slate"] .md-typeset .important > .admonition-title,
[data-md-color-scheme="slate"] .md-typeset .important > summary {
  background-color: rgba(159, 168, 218, 0.12);
}
[data-md-color-scheme="slate"] .md-typeset .important > .admonition-title::before,
[data-md-color-scheme="slate"] .md-typeset .important > summary::before {
  background-color: #9fa8da;
}
[data-md-color-scheme="slate"] .md-typeset .admonition.common-mistake,
[data-md-color-scheme="slate"] .md-typeset details.common-mistake {
  border-color: #ef9a9a;
}
[data-md-color-scheme="slate"] .md-typeset .common-mistake > .admonition-title,
[data-md-color-scheme="slate"] .md-typeset .common-mistake > summary {
  background-color: rgba(239, 154, 154, 0.12);
}
[data-md-color-scheme="slate"] .md-typeset .common-mistake > .admonition-title::before,
[data-md-color-scheme="slate"] .md-typeset .common-mistake > summary::before {
  background-color: #ef9a9a;
}
[data-md-color-scheme="slate"] .md-typeset .admonition.challenge,
[data-md-color-scheme="slate"] .md-typeset details.challenge {
  border-color: #ce93d8;
}
[data-md-color-scheme="slate"] .md-typeset .challenge > .admonition-title,
[data-md-color-scheme="slate"] .md-typeset .challenge > summary {
  background-color: rgba(206, 147, 216, 0.12);
}
[data-md-color-scheme="slate"] .md-typeset .challenge > .admonition-title::before,
[data-md-color-scheme="slate"] .md-typeset .challenge > summary::before {
  background-color: #ce93d8;
}

/* ---------------------------------------------------------------------------
   Keyboard use
   ---------------------------------------------------------------------------
   Material ships a "skip to content" link and makes the navigation, search and
   on-page contents reachable by Tab. What it leaves to the browser is the focus
   indicator, which some browsers draw faintly or not at all. These rules make it
   unambiguous, in both palettes, without putting a ring around every mouse click. */
.md-typeset a:focus-visible,
.md-typeset summary:focus-visible,
.md-nav__link:focus-visible,
.md-header__button:focus-visible,
.md-search__input:focus-visible,
.md-footer a:focus-visible {
  outline: 2px solid var(--md-accent-fg-color);
  outline-offset: 0.15rem;
  border-radius: 0.1rem;
}

/* ---------------------------------------------------------------------------
   Motion
   ---------------------------------------------------------------------------
   There are no decorative animations here on purpose: this is a page of text to
   be read. The theme's transitions (the sidebar, back-to-top, search) are kept,
   but a reader who has asked their system for reduced motion gets none of them. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}