/* Custom CSS for varm Documentation */
/*
 * Overrides for Sphinx-Immaterial to achieve an "IBM/Carbon-like" aesthetic.
 * Focus: Square corners, industrial feel, specific typography weights.
 */

:root {
    /* Enforce IBM Plex Fonts globally (already set in conf.py, but reinforcing) */
    --md-text-font: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
    --md-code-font: "IBM Plex Mono", SFMono-Regular, Consolas, Menlo, monospace;

    /* Carbon-like Spacing & Radius */
    --md-border-radius: 0px;
    /* Square everything */
    --md-admonition-radius: 0px;
    --button-radius: 0px;

    /* Content Width */
    --md-typeset-a-color: #0f62fe;
    /* Carbon Blue 60 */
}

/* Link styling */
.md-typeset a {
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-bottom 0.2s ease;
}

.md-typeset a:hover {
    border-bottom: 1px solid #0f62fe;
}

/* ---------------------------------------------------------------------------
 * Typography Overrides
 * --------------------------------------------------------------------------- */

/* Make headers feel more "engineered" */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    /* SemiBold */
    letter-spacing: -0.5px;
}

/* ---------------------------------------------------------------------------
 * UI Element "Squaring" (Removing Material Roundness)
 * --------------------------------------------------------------------------- */

/* Buttons */
.md-button {
    border-radius: 0;
    text-transform: none;
    /* Carbon doesn't scream uppercase */
    font-weight: 500;
    transition: background-color 0.2s ease;
}

/* Search Bar */
.md-search__input {
    border-radius: 0;
}

/* Sidebar Navigation Items */
.md-nav__link {
    border-radius: 0;
}

/* Code Blocks */
.highlight {
    border-radius: 0;
}

/* ---------------------------------------------------------------------------
 * Sidebar Navigation Enhancements
 * --------------------------------------------------------------------------- */

/* Make Toctree captions (Section Titles) prominent */
.md-nav__item--nested>label.md-nav__link,
.md-nav__link[for^="__nav_"] {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.65rem;
    padding-top: 1.5em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    margin-bottom: 0.5em;
    display: block;
}

[data-md-color-scheme="default"] .md-nav__item--nested>label.md-nav__link,
[data-md-color-scheme="default"] .md-nav__link[for^="__nav_"] {
    color: #161616;
    /* Carbon Gray 100 */
    border-bottom-color: #e0e0e0;
}

[data-md-color-scheme="slate"] .md-nav__item--nested>label.md-nav__link,
[data-md-color-scheme="slate"] .md-nav__link[for^="__nav_"] {
    color: #ffffff;
    border-bottom-color: #393939;
}

/* Remove hover effect on these "headers" to make them feel structural */
.md-nav__item--nested>label.md-nav__link:hover {
    background-color: transparent;
    cursor: default;
}

/* Admonitions (Note, Warning, etc.) */
.md-typeset .admonition,
.md-typeset details {
    border-radius: 0;
    border-left-width: 4px;
    /* Thicker left border like Carbon */
    box-shadow: none;
    border-right: 1px solid #e0e0e0;
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}

[data-md-color-scheme="slate"] .md-typeset .admonition,
[data-md-color-scheme="slate"] .md-typeset details {
    border-right-color: #393939;
    border-top-color: #393939;
    border-bottom-color: #393939;
}

/* ---------------------------------------------------------------------------
 * Color & Theme Tweaks
 * --------------------------------------------------------------------------- */

/* Admonition Severity Colors (closer to Carbon tokens) */
.md-typeset .note {
    border-left-color: #0f62fe;
    /* Carbon Blue 60 */
}

.md-typeset .warning {
    border-left-color: #f1c21b;
    /* Carbon Yellow 20 (text is often dark, border yellow) */
}

.md-typeset .danger,
.md-typeset .error {
    border-left-color: #da1e28;
    /* Carbon Red 60 */
}

.md-typeset .tip,
.md-typeset .hint {
    border-left-color: #42be65;
    /* Carbon Green 50 */
}

/* Header Gradient Override - making it solid and industrial */
/* Force Industrial Black header in ALL modes */
[data-md-color-scheme="default"] .md-header,
[data-md-color-scheme="slate"] .md-header {
    background-color: #161616;
    /* Carbon Gray 100 */
}

/* 
 * CRITICAL: High Contrast Header Elements
 * Ensure all text/icons in the header are WHITE because the background is forced BLACK.
 */
[data-md-color-scheme="default"] .md-header {
    color: #ffffff;
}

[data-md-color-scheme="default"] .md-header .md-header__button,
[data-md-color-scheme="default"] .md-header .md-header__title,
[data-md-color-scheme="default"] .md-header .md-header__option,
[data-md-color-scheme="default"] .md-tabs__link {
    color: #ffffff;
}

[data-md-color-scheme="default"] .md-header .md-header__button svg,
[data-md-color-scheme="default"] .md-header .md-icon svg {
    fill: currentColor;
}

/* Handle hover states for header buttons in light mode */
[data-md-color-scheme="default"] .md-header .md-header__button:hover {
    opacity: 0.7;
}

/* Sidebar background tweaking */
[data-md-color-scheme="default"] .md-sidebar {
    background-color: #f4f4f4;
    /* Carbon Gray 10 */
}

/* ---------------------------------------------------------------------------
 * varm Doctest Styling
 * --------------------------------------------------------------------------- */

/* Success state for code-with-test directive */
.varm-doctest-success {
    position: relative;
    border-left: 4px solid #42be65;
    /* Carbon Green 50 */
}

.varm-doctest-success>.highlight {
    border-left: none;
}

/* Success indicator icon */
.varm-doctest-success::after {
    content: "";
    position: absolute;
    right: 12px;
    top: 8px;
    width: 20px;
    height: 20px;
    background-color: #42be65;
    /* Carbon Green 50 */
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
}

/* Failure state - will be triggered by build failure (no HTML rendering) */
/* Note: Build failures halt the build, so no CSS needed for failure state */

/* Code block container for doctest */
.code-with-test-container {
    margin-bottom: 1em;
}

/* Ensure code blocks inside containers maintain proper styling */
.code-with-test-container .highlight {
    margin-top: 0;
    border-radius: 0;
}