/* ChangeLogTemplate.css - basic layout & look */
.changelog-page {
    padding: 18px 8px;
}

/* timeline scroll area */
.timeline-container {
    height: 75vh; /* change to taste */
    overflow: auto;
    padding-right: 8px;
}

/* each card anchor used for intersection observer highlight */
.release-anchor {
    scroll-margin-top: 12px;
}

/* release card header */
.release-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
}

    .release-header .version {
        font-size: 1.4rem;
        font-weight: 600;
    }

    .release-header .date {
        font-size: 0.9rem;
        color: #666;
    }

/* sections inside card */
.section-title {
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 1rem;
    font-weight: 600;
}

.section-sep {
    margin: 16px 0;
    border: none;
    border-top: 1px dashed #e6e6e6;
}

/* right sidebar */
.versions-sidebar {
    position: sticky;
    top: 20px;
    height: 75vh; /* same as timeline-container */
    overflow-y: auto;
    padding-left: 12px;
    border-left: 1px solid #f0f0f0;
}

.versions-header {
    padding: 8px 0;
    margin-bottom: 6px;
}

.versions-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-bottom: 8px;
}

.version-item {
    text-align: left;
    padding: 8px 10px;
    border-radius: 8px;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background .15s ease;
}

    .version-item:hover {
        background: rgba(0,0,0,0.03);
    }

    .version-item.active {
        background: rgba(24, 144, 255, 0.12);
        box-shadow: 0 1px 0 rgba(0,0,0,0.02) inset;
    }

    .version-item .ver {
        font-weight: 600;
    }

    .version-item .ver-date {
        font-size: 0.8rem;
        color: #666;
    }

/* small utilities */
.list-disc {
    list-style: disc;
}

.pl-6 {
    padding-left: 1.5rem;
}

.mb-2 {
    margin-bottom: 0.5rem;
}

.mb-4 {
    margin-bottom: 1rem;
}

.font-semibold {
    font-weight: 600;
}