/* ==================== PAGINATION ==================== */
.pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 48px 0;
}

.page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 14px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--text-body);
    font-size: 0.85rem;
    font-weight: 600;
    transition: all var(--transition);
}
.page-link:hover, .page-link.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
    box-shadow: 0 4px 12px rgba(14,165,233,0.25);
}
.page-dots { display: flex; align-items: center; padding: 0 6px; color: var(--text-muted); }

/* ==================== RELATED POSTS ==================== */
.related-section {
    padding: 50px 0;
    background: var(--bg-light);
}

/* ==================== ALERTS ==================== */
.alert {
    padding: 16px 22px;
    border-radius: var(--radius);
    margin-bottom: 20px;
    font-size: 0.9rem;
    font-weight: 500;
}
.alert-success { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.alert-error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.alert-warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }

/* ==================== 404 / ERROR ==================== */
.error-page {
    text-align: center;
    padding: 100px 20px;
}
.error-page h1 {
    font-family: var(--font-heading);
    font-size: 7rem;
    font-weight: 700;
    color: var(--primary);
    letter-spacing: -4px;
}
.error-page h2 {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 600;
    margin: 10px 0 20px;
    color: var(--text-dark);
}
.error-page a {
    display: inline-block;
    background: var(--primary);
    color: #fff;
    padding: 14px 32px;
    border-radius: var(--radius);
    font-weight: 700;
    transition: all var(--transition);
}
.error-page a:hover { background: var(--primary-dark); }
