/* styles.css */

/* - 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);
}


/* 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;
}