/**
 * Updates.lk Additional Styles
 * Includes: Pagination, Comment form fixes, Print styles, Accessibility
 */

/* ========================================
   PAGINATION
======================================== */
.pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 40px 0;
    flex-wrap: wrap;
}
.pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--card-bg);
    border: 1px solid var(--border);
    color: var(--text-muted);
    font-size: 0.9rem;
    transition: var(--transition);
    font-family: var(--font-body);
    padding: 0 12px;
    text-decoration: none;
}
.pagination .page-numbers:hover {
    background: var(--primary);
    border-color: var(--primary-light);
    color: #fff;
}
.pagination .current {
    background: var(--secondary);
    border-color: var(--secondary);
    color: #fff;
}
.pagination .prev,
.pagination .next {
    padding: 0 20px;
}
.pagination .dots {
    background: transparent;
    border-color: transparent;
}

/* ========================================
   COMMENTS FORM OVERRIDE
======================================== */
#commentform .submit {
    margin-top: 24px;
}
#commentform .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, var(--secondary), #c1121f);
    color: #fff;
    padding: 14px 28px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.95rem;
    border: none;
    cursor: pointer;
    transition: var(--transition);
    font-family: var(--font-body);
}
#commentform .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(230,57,70,0.4);
}
.comment-list { padding: 0; }
.comment-list li { list-style: none; }
.comment-body { margin: 0; }

/* ========================================
   ACCESSIBILITY
======================================== */
.skip-link:focus {
    position: fixed;
    top: 16px;
    left: 16px;
    z-index: 99999;
    background: var(--secondary);
    color: #fff;
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 700;
    text-decoration: none;
}
:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
    border-radius: 4px;
}
:focus:not(:focus-visible) {
    outline: none;
}

/* ========================================
   CATEGORY ARCHIVE HEADER ICONS
======================================== */
.cat-icon-past-papers::before  { content: '📄 '; }
.cat-icon-model-papers::before { content: '📝 '; }
.cat-icon-jobs::before         { content: '💼 '; }
.cat-icon-contacts::before     { content: '📞 '; }
.cat-icon-quizzes::before      { content: '🧠 '; }
.cat-icon-news::before         { content: '📰 '; }

/* ========================================
   GUTENBERG BLOCK FIXES
======================================== */
.wp-block-image img {
    border-radius: var(--radius);
}
.wp-block-quote {
    border-left: 4px solid var(--accent);
    background: var(--card-bg);
    border-radius: 0 var(--radius) var(--radius) 0;
    padding: 20px 24px;
    margin: 28px 0;
    font-style: italic;
    color: var(--text-muted);
}
.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
}
.wp-block-table th,
.wp-block-table td {
    padding: 12px 16px;
    border: 1px solid var(--border);
    text-align: left;
    font-size: 0.9rem;
}
.wp-block-table th {
    background: var(--surface);
    font-weight: 700;
    color: var(--text);
}
.wp-block-table td { color: var(--text-muted); }
.wp-block-table tr:nth-child(even) td { background: rgba(255,255,255,0.02); }

.wp-block-code,
pre {
    background: var(--dark2);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px 24px;
    overflow-x: auto;
    font-family: var(--font-mono);
    font-size: 0.875rem;
    color: #a5a0ff;
    margin: 24px 0;
}
.wp-block-separator {
    border: none;
    height: 1px;
    background: var(--border);
    margin: 40px 0;
}
.wp-block-buttons .wp-block-button__link {
    background: linear-gradient(135deg, var(--secondary), #c1121f) !important;
    border-radius: 50px !important;
    padding: 12px 24px !important;
    font-weight: 700 !important;
    color: #fff !important;
    border: none !important;
}

/* ========================================
   PRINT STYLES
======================================== */
@media print {
    #masthead, #colophon, .sidebar, .popup-overlay,
    .gdrive-btn, .pp-btn-view, .pp-btn-download,
    .hero-section, .newsletter-section, .features-strip,
    #back-to-top, .breadcrumb { display: none !important; }

    body {
        background: #fff !important;
        color: #000 !important;
        font-size: 12pt;
    }
    .entry-content { color: #000 !important; }
    a { color: #000 !important; text-decoration: underline; }
    .pp-info-strip, .pp-viewer-box, .mp-answer-key-box,
    .job-details-grid, .job-detail-card {
        background: #f5f5f5 !important;
        border: 1px solid #ddd !important;
        color: #000 !important;
    }
    h1, h2, h3 { color: #000 !important; }
}

/* ========================================
   LOADING SKELETON (for AJAX)
======================================== */
.skeleton {
    background: linear-gradient(90deg, var(--card-bg) 25%, var(--surface) 50%, var(--card-bg) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
    border-radius: var(--radius-sm);
}
@keyframes skeleton-loading {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ========================================
   GDRIVE FILE TYPE INDICATORS
======================================== */
.file-type-pdf    { color: #ff4444; }
.file-type-doc    { color: #4285f4; }
.file-type-image  { color: #34a853; }
.file-type-video  { color: #ea4335; }

/* ========================================
   CUSTOM SCROLLBAR FOR POPUP
======================================== */
.popup-body::-webkit-scrollbar { width: 4px; }
.popup-body::-webkit-scrollbar-track { background: var(--dark2); }
.popup-body::-webkit-scrollbar-thumb { background: var(--secondary); border-radius: 2px; }

/* ========================================
   DARK MODE (Already dark, but for system)
======================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    .hero-particles { display: none; }
}

/* ========================================
   HIGH CONTRAST MODE
======================================== */
@media (forced-colors: active) {
    .category-card { border: 2px solid ButtonText; }
    .btn { border: 2px solid ButtonText; }
}