/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* row: */

.blog-post__row {
    display: flex;
    gap: 60px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* content side: */

.blog-post__content {
    flex-grow: 1;
}

.blog-post__content h2 {
    margin-bottom: 20px;

    color: var(--blue-dk);
}
.blog-post__content h3 {
    margin-bottom: 12px;

    color: var(--purple-dk);
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* toc (sidebar): */

.blog-post__sidebar {
    flex: 0 0 26%;
}

.blog-post__sidebar .sidebar-nav-container {
    margin: 16px 0;
}

/*sublists*/

ul.sidebar-nav__sub-list {
    padding-left: 16px;
    padding-bottom: 8px;

    list-style: none;

    background: var(--blue-dk);
}

li.sidebar-nav__item.has-subitems > a.sidebar-nav__link {
    padding-bottom: 0;
}
ul.sidebar-nav__sub-list li.sidebar-nav__sub-item a.sidebar-nav__link {
    padding: 12px 16px;
}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* pagination: */

nav.blog-post__pagination {
    margin-top: 36px;
    display: flex;
    gap: 16px;
    justify-content: center;
    align-items: center;
}

nav.blog-post__pagination a {
    display: block;
    padding: 16px 20px;

    background: var(--blue-dk);
    border-radius: var(--box-border-radius-sm);

    font-size: 18px;
    color: var(--white);
}
nav.blog-post__pagination a:hover {
    background: var(--purple-dk);
}