/* ==========================================================================
   Custom site styles — local override, loaded last in <head>.
   1) Code: rely entirely on the theme's shipped Rouge themes (GitHub for light,
      Native for dark) — the modern, standard highlighting. We add only a couple
      of neutral tweaks (inline-code chip) and never override token colors.
   2) LaTeX-style environment boxes (theorem / lemma / definition / example /
      note / question / proof / remark / … ) and an algorithm box, theme-aware.
   Theme-aware via the `data-theme` attribute set on <html> by theme.js.
   ========================================================================== */

/* ---- Code --------------------------------------------------------------- */
/* No token-color overrides here: the gem ships jekyll-pygments-themes-github
   (light) and -native (dark), which own the code-block colors and container.
   We only refine inline code so it reads as a subtle chip, not loud accent. */

:root {
  --global-code-bg-color: #f6f8fa; /* light: soft neutral, not pink */
}
html[data-theme="dark"] {
  --global-code-bg-color: #1b1f24; /* dark: deep slate */
}

:not(pre) > code {
  padding: 0.12em 0.4em;
  border-radius: 4px;
  background-color: var(--global-code-bg-color);
  color: var(--global-theme-color);
  font-size: 0.88em;
}

/* ---- Distill sidenotes (aside) ------------------------------------------ */
/* Distill themes `d-article p/li/hN` with --global-text-color but NOT <aside>.
   Asides whose text is not wrapped in <p> keep distill's fixed dark gray,
   which is invisible in dark mode. Make all aside text theme-aware. */
d-article aside,
d-article aside p,
d-article aside li {
  color: var(--global-text-color) !important;
}

/* ---- LaTeX-style environment boxes -------------------------------------- */
/* Semi-transparent accent tints so they read well in light AND dark mode.   */

.theorem,
.lemma,
.definition,
.example,
.note,
.question {
  display: block;
  margin: 1.25rem 0;
  padding: 0.85rem 1.1rem;
  border-left: 4px solid;
  border-radius: 6px;
  text-align: justify;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease;
}
.theorem:hover,
.lemma:hover,
.example:hover,
.question:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}
.theorem > *:last-child,
.lemma > *:last-child,
.definition > *:last-child,
.example > *:last-child,
.note > *:last-child,
.question > *:last-child {
  margin-bottom: 0;
}

/* Theorem — blue, italic (classic look) */
.theorem {
  background-color: rgba(74, 144, 226, 0.12);
  border-left-color: #4a90e2;
  font-style: italic;
}
.theorem::before {
  content: "Theorem. ";
  font-weight: 700;
  font-style: normal;
}

/* Lemma — cyan, italic */
.lemma {
  background-color: rgba(0, 183, 234, 0.12);
  border-left-color: #00b7ea;
  font-style: italic;
}
.lemma::before {
  content: "Lemma. ";
  font-weight: 700;
  font-style: normal;
}

/* Definition — indigo */
.definition {
  background-color: rgba(99, 102, 241, 0.1);
  border-left-color: #6366f1;
  line-height: 1.55;
}
.definition::before {
  content: "Definition. ";
  font-weight: 700;
}

/* Example & Note — warm orange */
.example {
  background-color: rgba(252, 98, 56, 0.1);
  border-left-color: #fc6238;
}
.example::before {
  content: "Example. ";
  font-weight: 700;
}
.note {
  background-color: rgba(252, 98, 56, 0.1);
  border-left-color: #fc6238;
}
.note::before {
  content: "Note. ";
  font-weight: 700;
}
.example em,
.example i,
.note em {
  font-style: italic !important;
}

/* Question — violet */
.question {
  background-color: rgba(168, 85, 247, 0.12);
  border-left-color: #a855f7;
}
.question::before {
  content: "Question. ";
  font-weight: 700;
}

/* Inline label-only environments (no box), matching the old site */
.proof,
.remark {
  display: block;
  margin: 0.75rem 0;
}
.proof::before {
  content: "Proof. ";
  font-style: italic;
}
.proof::after {
  content: "\25FC";
  float: right;
}
.remark::before {
  content: "Remark. ";
  font-weight: 700;
}

/* ---- Algorithm box (used by the GAIL post) ------------------------------ */
.algorithm-box {
  margin: 1.5rem 0;
  padding: 0.5rem 1.25rem 1rem;
  border: 1px solid var(--global-divider-color, rgba(0, 0, 0, 0.1));
  border-top: 3px solid var(--global-theme-color);
  border-radius: 6px;
  background-color: var(--global-code-bg-color);
}
.algorithm-box h4 {
  margin: 0.75rem 0 0.25rem;
  font-weight: 700;
}
.algorithm-box ol {
  margin: 0.5rem 0 0 1.25rem;
  padding: 0;
}
.algorithm-box li {
  margin: 0.35rem 0;
  line-height: 1.5;
}

/* ---- Small niceties ------------------------------------------------------ */

/* Old-site call-to-action button, kept for posts that use it */

/* Slightly warmer blockquotes so long-form posts feel less bland */
blockquote {
  border-left: 3px solid var(--global-theme-color);
  background-color: var(--global-code-bg-color);
  border-radius: 0 6px 6px 0;
}
