/* Widen the left navigation sidebar */
.md-sidebar--primary {
    width: 16rem;
    left: 0;
}

.md-sidebar--primary .md-sidebar__scrollwrap {
    width: 16rem;
}

/* Remove right sidebar */
.md-sidebar--secondary {
    display: none;
}

/* Make content use full remaining width */
.md-main__inner {
    max-width: 100%;
    margin: 0;
    padding: 0;
}

.md-content {
    max-width: 100%;
}

/* Prevent table cells from wrapping */
.md-content table td,
.md-content table th {
    white-space: nowrap;
}

/* Allow description column to wrap since it's long text */
.md-content table td:nth-child(3),
.md-content table th:nth-child(3) {
    white-space: normal;
    min-width: 20rem;
}

/* Make tables scrollable horizontally if they overflow */
.md-content .md-typeset table {
    display: block;
    overflow-x: auto;
}

/* Make sub-navigation items smaller than parent */
.md-nav--primary .md-nav__item .md-nav .md-nav__link {
    font-size: 0.6rem;
}

/* Tablet and below */
@media screen and (max-width: 1200px) {
    .md-sidebar--primary {
        width: 14rem;
    }

    .md-nav__link {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
    }
}

/* Mobile - hide custom sidebar, use Material's built-in hamburger nav */
@media screen and (max-width: 960px) {
    .md-sidebar--primary {
        display: none;
    }

    /* But show it when the mobile nav is toggled open */
    [data-md-toggle="drawer"]:checked ~ .md-container .md-sidebar--primary {
        display: flex;
    }

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

    .md-nav__link {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
        font-size: 0.9rem;
    }
}

/* Small mobile */
@media screen and (max-width: 600px) {
    .md-content {
        margin-left: 0;
        padding: 0.5rem;
    }

    .md-nav__link {
        font-size: 0.8rem;
    }
}