/* Custom CSS for MkDocs Material Theme - Intelligent Textbooks */
/* Generated by install-mkdocs-template skill */

/* ============================================
   PRIMARY COLOR CONFIGURATION
   ============================================
   Change these RGB values to customize your brand color.
   Default is Anthropic brown (RGB: 218, 120, 87)
*/

:root {
    --md-primary-fg-color: rgb(212, 81, 60);
    --md-primary-fg-color--light: rgb(228, 140, 107);
    --md-primary-fg-color--dark: rgb(198, 100, 67);
}

/* ============================================
   HEADER LOGO SIZING
   ============================================
*/

.md-header__button.md-logo {
    margin: 0;
    padding: 0;
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
    height: 50px;
    width: 50px;
}

/* ============================================
   IFRAME CONTAINER FOR MICROSIMS
   ============================================
*/

.iframe-container {
    width: 100%;
    position: relative;
    overflow: hidden;
}

iframe {
    width: 100%;
    /* border: solid 2px var(--md-primary-fg-color); */
    border: solid 2px blue;
}

/* ============================================
   LIST STYLING UTILITIES
   ============================================
   Use <div class="upper-alpha" markdown> to wrap ordered lists
   for A, B, C, D styling. Requires md_in_html extension.
*/

.upper-alpha ol {
    list-style-type: upper-alpha;
}

.lower-alpha ol {
    list-style-type: lower-alpha;
}

.upper-roman ol {
    list-style-type: upper-roman;
}

.lower-roman ol {
    list-style-type: lower-roman;
}

/* ============================================
   PROMPT ADMONITION WITH COPY BUTTON
   ============================================
   For copyable prompt blocks. Usage:
   !!! prompt "Prompt Title"
       Your prompt text here
*/

.admonition.prompt {
    position: relative;
}

.admonition.prompt .copy-button {
    position: absolute;
    top: 4px;
    right: 6px;
    background-color: #0056d6;
    color: white;
    border: none;
    border-radius: 5px;
    padding: 0.3rem 0.3rem;
    cursor: pointer;
    font-size: 0.7rem;
}

.admonition.prompt .copy-button:hover {
    background-color: #0041a4;
}

/* ============================================
   CUSTOM ADMONITION COLORS
   ============================================
*/

/* Example admonition (green) */
.md-typeset .admonition.example,
.md-typeset details.example {
    border-color: #00c853;
}

.md-typeset .example > .admonition-title,
.md-typeset .example > summary {
    background-color: rgba(0, 200, 83, 0.1);
}

.md-typeset .example > .admonition-title::before,
.md-typeset .example > summary::before {
    background-color: #00c853;
}

/* Exercise admonition (purple) */
.md-typeset .admonition.exercise,
.md-typeset details.exercise {
    border-color: #7c4dff;
}

.md-typeset .exercise > .admonition-title,
.md-typeset .exercise > summary {
    background-color: rgba(124, 77, 255, 0.1);
}

.md-typeset .exercise > .admonition-title::before,
.md-typeset .exercise > summary::before {
    background-color: #7c4dff;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================
*/

@media screen and (max-width: 76.1875em) {
    /* Adjustments for tablet and smaller */
    .md-header__button.md-logo img,
    .md-header__button.md-logo svg {
        height: 40px;
        width: 40px;
    }
}

@media screen and (max-width: 600px) {
    /* Adjustments for mobile */
    iframe {
        height: 400px;
    }
}

/* ============================================
   PRINT STYLES
   ============================================
*/

@media print {
    .md-header,
    .md-sidebar,
    .md-footer {
        display: none;
    }

    .md-content {
        margin: 0;
        padding: 1rem;
    }
}