@import url("https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css");

:root {
    --nav-size: 350px;
}

html,
body {
    overscroll-behavior: none;
}

nav {
    top: 0;
    left: 0;
    bottom: 0;
    position: fixed;
    overflow-y: auto;
    width: var(--nav-size);
}

main {
    margin-left: var(--nav-size);
}

a {
    text-decoration: none;
}

.list-group-item {
    background-color: transparent;
}

.list-group-item:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.article-header {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}

article {
    padding: 2rem 3rem;
    border-bottom: 1px solid var(--bs-gray-200);
}

.article-header h2 {
    margin: 0;
}

.article-header .icon {
    font-size: 32px;
    margin-right: 1rem;
    color: var(--bs-gray);
}

.article-content {
    margin-left: calc(32px + 1rem);
}