:root {
    --md-primary-fg-color:        #121212;
}

/* Hide navigation and drawer on mobile devices */
@media screen and (max-width: 76.1875em) {
    /* Hide burger menu button */
    .md-header__button[for="__drawer"] {
        display: none !important;
    }
    
    /* Hide drawer (slide-out menu) */
    .md-overlay {
        display: none !important;
    }
    
    #__drawer {
        display: none !important;
    }
    
    /* Hide both sidebars */
    .md-sidebar--primary,
    .md-sidebar--secondary {
        display: none !important;
    }
    
    /* Make content full-width */
    .md-content {
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    
    .md-main__inner {
        margin-left: 0;
        margin-right: 0;
    }
}

/* Icon styling in standard menu */
.md-nav__icon {
    font-size: 1.2rem;
    margin-right: 0.5rem;
    width: 20px;
    text-align: center;
    display: inline-block;
}

/* Improve styles for custom menu items */
.md-nav__item .md-nav__link {
    display: flex;
    align-items: center;
    padding: 0.6rem 1rem;
}

.md-nav__item .md-nav__link:hover {
    background-color: var(--md-default-fg-color--lightest);
}

/* Smooth appearance of navigation tabs */
.md-tabs__list {
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.4s ease-out, transform 0.4s ease-out;
}

/* Show tabs after loading */
.md-tabs__list.loaded {
    opacity: 1;
    transform: translateY(0);
}

/* Smooth appearance of navigation items */
.md-nav__item {
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}

/* Show navigation items with delay */
.md-nav__item.loaded {
    opacity: 1;
    transform: translateX(0);
}

/* Delay for each item */
.md-nav__item:nth-child(1).loaded { transition-delay: 0.1s; }
.md-nav__item:nth-child(2).loaded { transition-delay: 0.2s; }
.md-nav__item:nth-child(3).loaded { transition-delay: 0.3s; }
.md-nav__item:nth-child(4).loaded { transition-delay: 0.4s; }
.md-nav__item:nth-child(5).loaded { transition-delay: 0.5s; }

/* Styles for page links (not in menu) */
.md-content a:not(.md-nav__link):not(.md-tabs__link) {
    color: var(--md-primary-fg-color);
    text-decoration: underline;
}

.md-content a:not(.md-nav__link):not(.md-tabs__link):hover {
    color: var(--md-accent-fg-color);
    text-decoration: underline;
}

/* Ensure link readability in dark theme */
[data-md-color-scheme="slate"] .md-content a:not(.md-nav__link):not(.md-tabs__link) {
    color: #8cc8ff;
}

[data-md-color-scheme="slate"] .md-content a:not(.md-nav__link):not(.md-tabs__link):hover {
    color: #b3d9ff;
}

/* Fix horizontal scrolling on mobile devices */
html, body {
    overflow-x: hidden;
    max-width: 100%;
}

/* Optimized styles for header on mobile devices */
/* Use built-in Material theme capabilities with minimal overrides */
@media screen and (max-width: 76.1875em) {
       
    /* Ensure proper header element display */
    .md-header__title {
        flex: 1;
        min-width: 0;
        overflow: hidden;
    }
    
    .md-header__button {
        flex-shrink: 0;
    }
}
.md-header__inner {
    width: 100%;
    max-width: none;
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Additional optimization for navigation.top usage */
@media screen and (min-width: 76.25em) {
    .md-header__inner {
        max-width: 100%;
    }
}

.md-header__button.md-logo {
    display: contents;
}

/* Prevent content overflow */
.md-container {
    max-width: 100%;
    overflow-x: hidden;
}

.md-main {
    max-width: 100%;
    overflow-x: hidden;
}

.md-content {
    max-width: 100%;
    overflow-x: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Fix for tables */
.md-typeset table {
    width: 100%;
    max-width: 100%;
    table-layout: auto;
    overflow-x: visible;
    display: table;
    white-space: normal;
}

.md-typeset table th,
.md-typeset table td {
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: none;
    white-space: normal;
}

/* Fix for code */
.md-typeset pre {
    max-width: 100%;
    overflow-x: auto;
    word-wrap: break-word;
    white-space: pre-wrap;
}

.md-typeset code {
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
}

/* Fix for images */
.md-typeset img {
    max-width: 100%;
    height: auto;
}

/* Fix for navigation */
.md-nav {
    max-width: 100%;
    overflow-x: hidden;
}

.md-nav__list {
    max-width: 100%;
    overflow-x: hidden;
}
/* Fix for table alignment */
.md-typeset table td {
    align-content: center;
}

.md-typeset table:not([class]) td,
.md-typeset table:not([class]) th {
    padding: 0.5em 0.7em;
}

.md-typeset table:not([class]) {
    font-size: 0.9em;
}

.md-typeset ol li, .md-typeset ul li {
    margin-bottom: 0;
}


/* Fix for h1 margin */
.md-typeset h1 {
    margin-bottom: 1em;
}

.md-typeset h2 {
    margin-top: 1em;
}
.md-typeset h3 {
    margin-top: 1em;
}

thead:not(:has(th:not(:empty))) { 
    display: none; 
}

/* Additional fixes for mobile devices */
@media screen and (max-width: 76.1875em) {
    .md-container {
        padding-left: 0;
        padding-right: 0;
    }
    
    .md-main__inner {
        max-width: 100%;
        overflow-x: hidden;
    }
    
    .md-content__inner {
        max-width: 100%;
        overflow-x: hidden;
    }
    
    .md-typeset table th,
    .md-typeset table td {
        padding: 0.5rem 0.3rem;
    }

    .md-typeset table:not([class]) td,
    .md-typeset table:not([class]) th {
        padding: 0.5em 0.5em;
    }
}

/* Additional responsive styles for mobile devices */
@media screen and (max-width: 59.9375em) {
    /* Reduce padding on very small screens */
    .md-content {
        padding: 1rem 0.5rem;
    }
    
    /* Improve table display on mobile */
    .md-typeset table {
        font-size: 0.8rem;
        table-layout: fixed;
        width: 100%;
    }
    
    .md-typeset table th,
    .md-typeset table td {
        padding: 0.3rem 0.2rem;
        word-break: break-word;
    }
    .md-typeset table:not([class]) td,
    .md-typeset table:not([class]) th {
        padding: 0.3em 0.5em;
    }
    
    /* Improve code display on mobile */
    .md-typeset pre {
        font-size: 0.8rem;
        padding: 0.5rem;
    }
    
    /* Improve navigation display */
    .md-nav__item {
        padding: 0.2rem 0;
    }
    
    .md-nav__link {
        padding: 0.4rem 0.8rem;
    }
}

/* Language flag styles moved to separate file language-flags.css */

/* Styles for very small screens (up to 480px) */
@media screen and (max-width: 30em) {
    .md-content {
        padding: 0.5rem 0.3rem;
    }
    
    .md-typeset h1 {
        font-size: 1.5rem;
    }
    
    .md-typeset h2 {
        font-size: 1.3rem;
    }
    
    .md-typeset h3 {
        font-size: 1.1rem;
    }
    
    /* Improve button and link display */
    .md-typeset a {
        word-break: break-word;
    }
    
    /* Improve list display */
    .md-typeset ul, .md-typeset ol {
        padding-left: 1rem;
    }
    
    /* Header optimization for very small screens */
    .md-header__inner {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .md-header__button {
        padding: 0.4rem;
        min-width: 2.4rem;
    }
    
}

/* Add left margin to logo to match right margin of GitHub widget */
.md-header__button.md-logo {
    margin-left: 3rem;
}

.md-icon {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
}