/* === pages-category.css === */
/* === ВИТРИНА КАТЕГОРИЙ БАЗЫ ЗНАНИЙ И КАРТОЧКИ ДОКУМЕНТОВ ===
   v5 (2026-10-06):
     - У .page-card__title / .page-card__excerpt / .page-card__cta сняты
       border / border-radius / box-shadow / background.
     - ВАЖНО: theme-main.css подключается ПОСЛЕ этого файла, а его
       правило html body [class*="card"]:not(.cat-card) имеет специфичность
       (0,2,2). Прошлые попытки использовать (0,2,2) или (0,2,4) не побеждали:
       при равных классах выигрывал theme-main (позже в <head>). Теперь наши
       селекторы имеют (0,3,2)+ — три класса гарантированно перебивают theme-main. */

/* ---------- Сетка ---------- */
.pages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-bottom: 48px;
}

/* ---------- Карточка документа ---------- */
html body a.page-card,
html body .page-card,
html body.light-theme .page-card,
html body:not(.light-theme) .page-card {
    background: var(--bg-card, #ffffff) !important;
    background-color: var(--bg-card, #ffffff) !important;
    border: 1px solid var(--border-color, rgba(0, 0, 0, 0.08)) !important;
    border-radius: var(--radius-lg, 16px) !important;
    box-shadow: 0 2px 8px rgba(23, 24, 47, 0.04) !important;
    padding: 22px !important;
    display: flex !important;
    flex-direction: column !important;
    text-decoration: none !important;
    color: inherit !important;
    position: relative !important;
    overflow: hidden !important;
    transform: none !important;
    outline: 0 !important;
    transition: transform .25s var(--ease-spring, ease),
                border-color .25s ease,
                box-shadow .25s ease,
                background-color .25s ease !important;
}

html body a.page-card:hover,
html body .page-card:hover,
html body a.page-card:focus-visible,
html body .page-card:focus-visible {
    border-color: var(--primary, #6C63FF) !important;
    box-shadow: 0 10px 26px rgba(108, 99, 255, 0.14),
                0 2px 8px rgba(23, 24, 47, 0.06) !important;
    transform: translateY(-2px) !important;
    background: var(--bg-card, #ffffff) !important;
}

html body .page-card::before,
html body .page-card::after {
    content: none !important;
    display: none !important;
}

html body:not(.light-theme) .page-card,
html body:not(.light-theme) a.page-card {
    background: var(--bg-card, #3a3a3a) !important;
    background-color: var(--bg-card, #3a3a3a) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28) !important;
}
html body:not(.light-theme) .page-card:hover,
html body:not(.light-theme) a.page-card:hover {
    border-color: rgba(0, 243, 255, 0.35) !important;
    box-shadow: 0 10px 26px rgba(0, 243, 255, 0.15),
                0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

/* ================================================================
   ДЕТИ КАРТОЧКИ — БЕЗ ОБВОДКИ, СКРУГЛЕНИЯ И ФОНА
   ----------------------------------------------------------------
   theme-main.css: html body [class*="card"]:not(.cat-card) → (0,2,2)
   Наши селекторы: html body.light-theme a.page-card .page-card__title
     классы: .light-theme + a.page-card + .page-card__title  = 3
     теги:   html + body + a                                 = 3
     → (0,3,3) — гарантированно выше theme-main.
   ================================================================ */

/* --- Светлая тема --- */
html body.light-theme a.page-card .page-card__title,
html body.light-theme a.page-card .page-card__excerpt,
html body.light-theme a.page-card .page-card__cta,
html body.light-theme a.page-card .page-card__meta,
html body.light-theme .page-card .page-card__title,
html body.light-theme .page-card .page-card__excerpt,
html body.light-theme .page-card .page-card__cta,
html body.light-theme .page-card .page-card__meta {
    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    outline: 0 !important;
}

/* --- Тёмная тема --- */
html body:not(.light-theme) a.page-card .page-card__title,
html body:not(.light-theme) a.page-card .page-card__excerpt,
html body:not(.light-theme) a.page-card .page-card__cta,
html body:not(.light-theme) a.page-card .page-card__meta,
html body:not(.light-theme) .page-card .page-card__title,
html body:not(.light-theme) .page-card .page-card__excerpt,
html body:not(.light-theme) .page-card .page-card__cta,
html body:not(.light-theme) .page-card .page-card__meta {
    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    outline: 0 !important;
}

/* --- Универсальный фолбэк --- */
html body a.page-card .page-card__title,
html body a.page-card .page-card__excerpt,
html body a.page-card .page-card__cta,
html body a.page-card .page-card__meta,
html body .page-card .page-card__title,
html body .page-card .page-card__excerpt,
html body .page-card .page-card__cta,
html body .page-card .page-card__meta {
    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    outline: 0 !important;
}

/* --- Совсем жёсткий фолбэк на случай экзотических обёрток --- */
html body [class*="card"].page-card__title,
html body [class*="card"].page-card__excerpt,
html body [class*="card"].page-card__cta,
html body [class*="card"].page-card__meta,
html body.light-theme [class*="card"].page-card__title,
html body.light-theme [class*="card"].page-card__excerpt,
html body.light-theme [class*="card"].page-card__cta,
html body.light-theme [class*="card"].page-card__meta,
html body:not(.light-theme) [class*="card"].page-card__title,
html body:not(.light-theme) [class*="card"].page-card__excerpt,
html body:not(.light-theme) [class*="card"].page-card__cta,
html body:not(.light-theme) [class*="card"].page-card__meta {
    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    outline: 0 !important;
}

/* ---------- Иконка карточки ---------- */
html body.light-theme a.page-card .page-card__icon,
html body.light-theme .page-card .page-card__icon,
html body:not(.light-theme) a.page-card .page-card__icon,
html body:not(.light-theme) .page-card .page-card__icon,
html body a.page-card .page-card__icon,
html body .page-card .page-card__icon {
    width: 52px !important;
    height: 52px !important;
    border-radius: var(--radius-md, 12px) !important;
    border: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    margin: 0 0 18px 0 !important;
    background: rgba(108, 99, 255, 0.10) !important;
    color: var(--primary, #6C63FF) !important;
    -webkit-text-fill-color: var(--primary, #6C63FF) !important;
    box-shadow: none !important;
    transition: background-color .25s ease, color .25s ease !important;
}
html body .page-card .page-card__icon svg,
html body .page-card .page-card__icon i {
    width: 22px !important;
    height: 22px !important;
    color: currentColor !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}
html body .page-card:hover .page-card__icon {
    background: rgba(108, 99, 255, 0.16) !important;
}
html body:not(.light-theme) a.page-card .page-card__icon,
html body:not(.light-theme) .page-card .page-card__icon {
    background: rgba(0, 243, 255, 0.12) !important;
    color: var(--neon-cyan, #94adae) !important;
    -webkit-text-fill-color: var(--neon-cyan, #94adae) !important;
}
html body:not(.light-theme) .page-card:hover .page-card__icon {
    background: rgba(0, 243, 255, 0.18) !important;
}

/* ---------- Заголовок карточки ---------- */
html body.light-theme a.page-card .page-card__title,
html body.light-theme .page-card .page-card__title,
html body:not(.light-theme) a.page-card .page-card__title,
html body:not(.light-theme) .page-card .page-card__title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--text-primary, #17182f) !important;
    -webkit-text-fill-color: var(--text-primary, #17182f) !important;
    margin: 0 0 10px 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

/* ---------- Описание карточки ---------- */
html body.light-theme a.page-card .page-card__excerpt,
html body.light-theme .page-card .page-card__excerpt,
html body:not(.light-theme) a.page-card .page-card__excerpt,
html body:not(.light-theme) .page-card .page-card__excerpt {
    font-size: 14px !important;
    color: var(--text-secondary, #4a5568) !important;
    -webkit-text-fill-color: var(--text-secondary, #4a5568) !important;
    line-height: 1.6 !important;
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
    flex: 1 1 auto !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

/* ---------- CTA («Читать документ») ---------- */
html body.light-theme a.page-card .page-card__cta,
html body.light-theme .page-card .page-card__cta,
html body:not(.light-theme) a.page-card .page-card__cta,
html body:not(.light-theme) .page-card .page-card__cta {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.6px !important;
    text-transform: uppercase !important;
    color: var(--primary, #6C63FF) !important;
    -webkit-text-fill-color: var(--primary, #6C63FF) !important;
    text-shadow: none !important;
    margin-top: auto !important;
    padding: 0 !important;
    transition: color .2s ease, gap .2s ease !important;
}
html body .page-card .page-card__cta svg,
html body .page-card .page-card__cta .icon {
    width: 14px !important;
    height: 14px !important;
    color: currentColor !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}
html body .page-card:hover .page-card__cta,
html body .page-card:focus-visible .page-card__cta {
    color: var(--neon-purple, #bf00ff) !important;
    -webkit-text-fill-color: var(--neon-purple, #bf00ff) !important;
    gap: 12px !important;
}
html body:not(.light-theme) a.page-card .page-card__cta,
html body:not(.light-theme) .page-card .page-card__cta {
    color: var(--neon-cyan, #94adae) !important;
    -webkit-text-fill-color: var(--neon-cyan, #94adae) !important;
}
html body:not(.light-theme) .page-card:hover .page-card__cta,
html body:not(.light-theme) .page-card:focus-visible .page-card__cta {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* ---------- meta (если появится) ---------- */
html body .page-card .page-card__meta {
    display: flex;
    gap: 16px;
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 16px;
}
html body .page-card .page-card__meta span {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* ---------- Пагинация ---------- */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.pagination__link {
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border-radius: var(--radius-md);
    background: var(--bg-elevated);
    border: 1px solid rgba(0, 243, 255, 0.1);
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s var(--ease-spring);
}
.pagination__link:hover {
    background: rgba(0, 243, 255, 0.1);
    border-color: rgba(0, 243, 255, 0.3);
    color: var(--neon-cyan);
    transform: translateY(-2px);
    box-shadow: var(--glow-cyan);
}
.pagination__link--active {
    background: linear-gradient(135deg, var(--neon-cyan), var(--brand-violet));
    border-color: transparent;
    color: #fff;
    box-shadow: 0 0 12px rgba(0, 243, 255, 0.4);
    pointer-events: none;
}

/* ---------- Пустое состояние ---------- */
.pages-empty {
    text-align: center;
    padding: 60px 20px;
    color: var(--text-muted);
}
.pages-empty i {
    font-size: 48px;
    margin-bottom: 16px;
    color: var(--neon-pink);
    opacity: 0.5;
}
.pages-empty p {
    font-size: 18px;
}

/* ---------- Адаптив ---------- */
@media (max-width: 1024px) {
    .pages-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}
@media (max-width: 640px) {
    .pages-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    html body .page-card,
    html body a.page-card {
        padding: 18px !important;
    }
    html body .page-card .page-card__icon {
        width: 46px !important;
        height: 46px !important;
        font-size: 20px !important;
        margin-bottom: 14px !important;
    }
    html body .page-card .page-card__title {
        font-size: 17px !important;
    }
}