/* styles.css */

/* --- Global Typography --- */

/* ----- Fonts ----- */

@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,400;0,700;1,400&family=Source+Sans+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=Source+Serif+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap');

:root {
  /* Set Bootstrap variables to use fonts */
  --bs-body-font-family: "Source Serif Pro", "DejaVu Serif", serif;
  --bs-font-sans-serif: "Source Sans Pro", "DejaVu Sans", sans-serif;
  --bs-font-monospace: "Source Code Pro", "DejaVu Sans Mono", monospace;
}

body {
  font-family: var(--bs-body-font-family);
  line-height: 1.6;
}

/* Ensure headings use the Sans font for contrast */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--bs-font-sans-serif);
    line-height: 1.2;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
}

/* Ensure the SVG text picks up the font if the system doesn't have it embedded */
svg text {
    font-family: "Source Sans Pro", sans-serif !important;
}

/* --- Global Size Scaling --- */

/* html { */
    /* 100% usually equals 16px. 
       Consider 110% or 115% for long-form reading on screens. */
    /* font-size: 115%;  */
/* } */

/* --- Fenced environments --- */

/* --- Outer Container Styling (Borders and Layout) --- */
/* This rule applies the border to the main container div. */
div.theorem,
div.lemma,
div.corollary,
div.proposition,
div.conjecture,
div.definition,
div.example,
div.exercise,
div.solution,
div.remark {
    margin: 0.5em 0;
    border-left: 4px solid; /* Keep the colored border here */
}

/* --- Inner Body Styling (Background and Padding) --- */
/* This rule targets the inner *-body class to apply the background. */
.theorem-body,
.lemma-body,
.corollary-body,
.proposition-body,
.conjecture-body,
.definition-body,
.example-body,
.exercise-body,
.solution-body,
.remark-body {
    padding: 0.5em; /* Padding for the text content */
    font-family: "Source Sans Pro", sans-serif;
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-body-color);
    font-size: 0.95rem; 
    line-height: 1.55;
}

/* Smaller Code Blocks */
pre, code {
    font-family: var(--bs-font-monospace);
    font-size: 0.9em; 
}


/* Specific border colors for each theorem-like environment */
div.theorem { border-left-color: #795548; }
div.lemma { border-left-color: #FFC107; }
div.corollary { border-left-color: #E91E63; }
div.proposition { border-left-color: #3F51B5; }
div.definition { border-left-color: #2196F3; }
div.example { border-left-color: #9C27B0; }
div.exercise { border-left-color: #00BCD4; }
div.solution { border-left-color: #FF9800; }
div.remark { border-left-color: #607D8B; }


/* Proof Environment (Works differently)*/
div.proof {
    margin: 0.25em 0;
    padding: 0.50em;
    display: block;
    border-left: 2px solid #333;
    font-family: "Source Serif Pro", serif;
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
}

/* SVG Containers for side-by-side image and text */
.svg-container {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 1em;
    margin: 0.5rem 0;
}
.svg-container > img, .svg-container > svg {
    max-width: var(--svg-width, 300px);
    height: auto;
    display: block;
}
.svg-caption {
    flex: 1 1 var(--svg-width);
    word-break: break-word;
}

/* - Custom CSS for inline h5 headings - */
h5.anchored {
    font-weight: bold;
    display: inline;
    margin: 0;
    padding: 0;
}
h5.anchored .anchorjs-link {
    display: none;
}
h5.anchored::after {
    content: ":";
    margin-right: 0.5em;
}
h5.anchored + p {
    display: inline;
    margin: 0;
    padding: 0;
}


/* --- Custom List --- */
/* defines the custom-list div environment */
/* ::: {.custom-list}
- [(myentry)]{data-bullet="(myentry)"} aaa
- [(another_entry)]{data-bullet="(another_entry)"} bbb
::: */


.custom-list ul {
  list-style: none;
  padding-left: 0;
}

.custom-list li::before {
  content: attr(data-bullet);
  padding-right: 0.5em;
  font-weight: bold;
}