/* Reusable container modifier: 1240px max-width with 24px horizontal padding */
.content-wrap {
    padding-left: 20px;
    padding-right: 20px;
}

/* Reusable flex layout with main content and sidebar */
.sidebar-extra {
    gap: var(--grid-columns-gap);
    align-items: flex-start;
    flex-wrap: wrap;
}

.sidebar-extra > #primary {
    flex: 1;
    min-width: 0;
}

.sidebar-extra > #secondary {
    width: var(--sidebar-width);
    flex-shrink: 0;
}

@media (max-width: 1024px) {
    .sidebar-extra > #primary,
    .sidebar-extra > #secondary {
        width: 100%;
    }
}

/* Stack flex children vertically */
.flex-column {
    flex-direction: column;
}

.w-full {
    width: 100%;
}

.mb-0 {
    margin-bottom: 0;
}

#primary .article-single .entry-meta,
#primary .article-single .entry-image {
    margin-bottom: 2.5rem;
}

#primary .article-single .entry-meta > * {
    color: var(--e-global-color-primary);
}

.content-area-narrow {
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1025px) {
    .content-area-narrow {
        width: 66.666666%;
    }
}

.content-area-narrow .keydesign-card:not(:last-child) {
    margin-bottom: 3rem;
}

.content-area-narrow .keydesign-card .post-content {
    color: var(--e-global-color-text);
}

#primary .article-single .entry-content p {
    color: var(--e-global-color-text);
}

@media (max-width: 768px) {
    #primary .article-single .entry-meta,
    #primary .article-single .entry-image {
        margin-bottom: 2rem;
    }
}

.dot-separator {
    display: flex;
    flex-wrap: wrap;
}

.entry-meta.dot-separator > * {
    margin-bottom: 0.25em;
    margin-right: 0;
}

.dot-separator > *:not(:last-child)::after {
    content: '·';
    margin: 0 0.8em;
    color: var(--color-text);
}



/* Recent Blog Posts widget */
.vwt-recent-blog-posts {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vwt-recent-blog-posts__item {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border, #e5e5e5);
}

.vwt-recent-blog-posts__item:last-child {
    border-bottom: none;
}


.vwt-recent-blog-posts__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.vwt-recent-blog-posts__title {
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-heading, inherit);
    text-decoration: none;
}

.vwt-recent-blog-posts__title:hover {
    color: var(--e-global-color-primary);
}

.vwt-recent-blog-posts__date {
    font-size: 0.8rem;
    color: var(--color-text, #666);
}
