/* DS2026 — Стили страницы статьи (стили списков/цитат скопированы из ds2025) */

/* ---- Обёртка ---- */
.entry-article { max-width: var(--content-width); }
body.page .entry-article { max-width: 100%; }

/* ---- Шапка ---- */
.entry-header  { margin-bottom: 1.25rem; }
.entry-title   { font-size: 2rem; font-weight: 700; line-height: 1.3; color: var(--color-text); margin-bottom: .5rem; }
.entry-meta    { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .85rem; color: var(--color-muted); }
.entry-updated { font-style: italic; }

/* ---- Миниатюра ---- */
.entry-thumbnail { margin-bottom: 0; border-radius: var(--radius); overflow: hidden; }
.entry-thumbnail img { width: 100%; height: auto; display: block; }

/* ---- Бейдж ---- */
.article-update-badge {
    font-size: 0.8rem;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--color-muted);
    margin-bottom: 10px;
}

/* ---- Контент ---- */
.entry-content { line-height: 1.8; font-size: 1rem; color: var(--color-text); }
.entry-content h2 {
    font-size: 1.45rem; font-weight: 700; margin: 2rem 0 .75rem;
    padding-bottom: .3rem; border-bottom: 1px solid var(--color-border);
}
.entry-content h3 { font-size: 1.18rem; font-weight: 600; margin: 1.5rem 0 .5rem; }
.entry-content h4 { font-size: 1.05rem; font-weight: 600; margin: 1.25rem 0 .4rem; }
.entry-content p  { margin-bottom: 1.25em; }

/* Ссылки — без подчёркивания, цвета как в ds2025 */
.entry-content a {
    color: #215dff;
    text-decoration: none;
}
.entry-content a:hover {
    color: #025097;
    background: #cdd8ff;
}

/* Картинки */
.entry-content img { max-width: 100%; height: auto; border-radius: var(--radius); margin: 1rem auto; display: block; }

/* ---- Списки — скопировано из ds2025/css/single.css ---- */
/* :not(.toc-list) — чтобы стили не попадали в TOC, который тоже внутри .entry-content */
.entry-content ul {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0;
}
.entry-content ul li {
    position: relative;
    padding: .8rem .8rem .8rem 2.5rem;
    margin-bottom: .5rem;
    line-height: 1.6;
    border-left: 3px solid transparent;
    transition: all .3s ease;
    background: #f6f6f6;
}
.entry-content ul li:hover {
    border-left-color: #c600ff;
    background: linear-gradient(90deg, rgba(202,90,254,.31) 0%, rgba(202,90,254,.15) 100%);
    transform: translateX(5px);
}
.entry-content ul li::before {
    content: '•';
    position: absolute; left: .8rem; top: .5rem;
    color: #dc9be8; font-size: 1.4rem; font-weight: bold;
    transition: all .3s ease;
}
.entry-content ul li:hover::before { color: #9e3fb0; transform: scale(1.2); }

.entry-content ol:not(.toc-list) {
    list-style: none;
    padding: 0; margin: 1.5rem 0;
    counter-reset: custom-counter;
}
.entry-content ol:not(.toc-list) li {
    position: relative;
    padding: 1rem .5rem 1rem 3.5rem;
    margin-bottom: .8rem;
    line-height: 1.6;
    background: linear-gradient(135deg, #f8f9fa 0%, #fff 100%);
    border-radius: 8px;
    border: 1px solid #0270e8;
    transition: all .3s ease;
}
.entry-content ol:not(.toc-list) li:hover {
    border-color: #007bff;
    box-shadow: 0 4px 15px rgba(0,123,255,.1);
    transform: translateY(-2px);
}
.entry-content ol:not(.toc-list) li::before {
    counter-increment: custom-counter;
    content: counter(custom-counter);
    position: absolute; left: 1rem; top: 50%;
    transform: translateY(-50%);
    width: 2rem; height: 2rem;
    background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);
    color: white; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: bold; font-size: .9rem;
    transition: all .3s ease;
}
.entry-content ol:not(.toc-list) li:hover::before {
    background: linear-gradient(135deg, #0056b3 0%, #004085 100%);
    transform: translateY(-50%) scale(1.1);
}

/* Анимация появления элементов списка */
@keyframes listItemAppear {
    from { opacity: 0; transform: translateX(-20px); }
    to   { opacity: 1; transform: translateX(0); }
}
.entry-content ul li,
.entry-content ol:not(.toc-list) li { animation: listItemAppear .5s ease forwards; }
.entry-content ul li:nth-child(1), .entry-content ol:not(.toc-list) li:nth-child(1) { animation-delay: .1s; }
.entry-content ul li:nth-child(2), .entry-content ol:not(.toc-list) li:nth-child(2) { animation-delay: .2s; }
.entry-content ul li:nth-child(3), .entry-content ol:not(.toc-list) li:nth-child(3) { animation-delay: .3s; }
.entry-content ul li:nth-child(4), .entry-content ol:not(.toc-list) li:nth-child(4) { animation-delay: .4s; }
.entry-content ul li:nth-child(5), .entry-content ol:not(.toc-list) li:nth-child(5) { animation-delay: .5s; }

/* Вложенные списки */
.entry-content ul ul, .entry-content ol:not(.toc-list) ol,
.entry-content ul ol:not(.toc-list), .entry-content ol:not(.toc-list) ul { margin: .5rem 0 .5rem 2rem; }
.entry-content ul ul li::before { content: '◦'; color: #6c757d; font-size: 1.2rem; }
.entry-content ol:not(.toc-list) ol li::before { background: linear-gradient(135deg, #6c757d 0%, #495057 100%); width: 1.8rem; height: 1.8rem; font-size: .8rem; }

.entry-content ul li strong,
.entry-content ol:not(.toc-list) li strong { color: #2c3e50; font-weight: 600; }
.entry-content ul li:focus,
.entry-content ol:not(.toc-list) li:focus { outline: 2px solid #007bff; outline-offset: 2px; }

@media (max-width: 768px) {
    .entry-content ul ul, .entry-content ol:not(.toc-list) ol,
    .entry-content ul ol:not(.toc-list), .entry-content ol:not(.toc-list) ul { margin-left: 1rem; }
    .entry-content ol:not(.toc-list) li::before { width: 1.8rem; height: 1.8rem; font-size: .8rem; }
}

/* ---- Цитата — скопировано из ds2025 ---- */
.entry-content blockquote {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 1.5rem;
    margin: 1.5rem 0;
    border-radius: 0 8px 8px 0;
    position: relative;
    box-shadow: 0 2px 10px rgba(0,0,0,.1);
    font-style: italic;
    color: #2c3e50;
}
.entry-content blockquote::before {
    content: '\201C';
    font-size: 3rem; color: #c1c1c1;
    position: absolute; left: 10px; top: -15px;
}
.entry-content blockquote::after {
    content: '\201D';
    font-size: 3rem;
    position: absolute; bottom: 0; right: 0;
    width: 30px; height: 44px; color: #c1c1c1;
}
.entry-content blockquote strong { color: #007bff; font-weight: 600; }
.entry-content blockquote p:last-child { margin-bottom: 0; }

/* ---- Таблица ---- */
.entry-content table { width: 100%; border-collapse: collapse; margin: 20px 0; }
.entry-content th, .entry-content td { padding: 15px; text-align: left; border: 1px solid #ddd; }
.entry-content th { background: #f8f9fa; font-weight: bold; }
.entry-content pre { white-space: break-spaces; }

/* ---- Спецблоки — скопировано из ds2025 ---- */
.blueblok { padding: 20px 20px 20px 50px; background: #f4f5ff; margin: 10px; font-size: .9em; border-left: solid 5px #4999de; }
.grinblok { padding: 20px 20px 20px 50px; background: #f2ffed; margin: 10px; font-size: .9em; border-left: solid 5px #369810; }
.redblok  { padding: 20px 20px 20px 50px; background: #ffebeb; margin: 10px; font-size: .9em; border-left: solid 5px #d8566e; }
.vstuplenie { font-size: 1.2rem; }
.podpisfoto { padding: 1px 10px; background: #efefef; font-size: .9em; font-style: italic; }

/* ---- TOC ---- */
.toc-container {
    background: var(--color-bg-alt); border: 1px solid var(--color-border);
    border-radius: var(--radius); padding: 1rem 1.25rem; margin: 0 0 1.75rem;
}
.toc-title {
    font-size: .95rem; font-weight: 600;
    display: flex; justify-content: space-between; align-items: center;
    cursor: pointer; user-select: none; margin-bottom: .6rem;
}
.toc-toggle { font-size: .75rem; color: var(--color-muted); }
.toc-list {
    list-style: decimal;
    margin: 0 0 0 1.2rem;
    padding: 0;
    font-size: .88rem;
}
.toc-list li {
    padding: 0;
    margin: 0;
    line-height: 1.4;
    background: none;
    border: none;
    animation: none;
    transform: none;
}
.toc-list li::before { display: none; }
.toc-list a {
    display: block;
    padding: 5px 0;
    color: var(--color-text);
    text-decoration: none;
    min-height: 24px;
}
.toc-list a:hover,
.toc-list a:focus { color: var(--color-primary); background: none; }

/* ---- Разделитель ---- */
.entry-divider { border: none; border-top: 1px solid var(--color-border); margin: 1.75rem 0; }

/* ---- Автор ---- */
.author-box {
    background: #fbfbfb; border: 1px solid var(--color-border);
    padding: 10px; margin: 20px 0; border-radius: var(--radius);
}
.author-box__label { font-size: .78rem; color: var(--color-muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .25rem; }
.author-box__name a { font-weight: 600; color: var(--color-text); font-size: 1rem; }
.author-box__name a:hover { color: var(--color-primary); }
.author-box__meta { font-size: .82rem; color: var(--color-muted); margin-top: .25rem; }

/* ---- Дата ---- */
.entry-pub-date { font-size: .82rem; color: var(--color-muted); margin-bottom: 1rem; }

/* ---- Prev/Next — как в ds2025 ---- */
.post-navigation { display: flex; justify-content: space-between; margin: 30px 0; flex-wrap: wrap; gap: .5rem; }
.post-navigation .nav-prev,
.post-navigation .nav-next { flex: 1; min-width: 0; }
.nav-prev a, .nav-next a {
    display: inline-block;
    padding: 10px 20px;
    background: #2150f9; color: white;
    text-decoration: none; border-radius: 5px;
    white-space: normal; word-break: break-word;
    width: 100%; box-sizing: border-box;
}
.nav-prev a { margin-right: 5px; }
.nav-next a { margin-left: 5px; }
.nav-prev a:hover, .nav-next a:hover { background: var(--color-hover); color: white; }

/* ---- Читайте также ---- */
.related-section { margin: 2rem 0 1.5rem; }
.related-title { font-size: 1.05rem; font-weight: 700; margin-bottom: .9rem; padding-bottom: .4rem; border-bottom: 2px solid var(--color-primary); }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.related-card { border: 1px solid #2150f9; overflow: hidden; }
.related-card a { display: flex; flex-direction: column; text-decoration: none; color: var(--color-text); }
.related-card img { width: 100%; height: 200px; object-fit: cover; }
.related-card__title { padding: 15px; text-align: center; text-transform: uppercase; font-size: .82rem; line-height: 1.4; }

/* ---- Вам будет интересно ---- */
.thematic-section { margin: 1.5rem 0; }
.thematic-title { font-size: 1rem; font-weight: 700; margin-bottom: .6rem; padding-bottom: .3rem; border-bottom: 1px solid var(--color-border); }
.thematic-list { list-style: none; margin: 0; padding: 0; }
.thematic-list li { padding: .35rem 0; border-bottom: 1px solid var(--color-border); }
.thematic-list li:last-child { border-bottom: none; }
.thematic-list a { color: var(--color-primary); font-size: .9rem; text-decoration: none; }
.thematic-list a:hover { color: #025097; background: #cdd8ff; }

@media (max-width: 768px) {
    .entry-title { font-size: 1.45rem; }
    .entry-content h2 { font-size: 1.22rem; }
    .related-grid { grid-template-columns: 1fr 1fr; }
    .post-navigation { flex-direction: column; }
    .nav-prev a, .nav-next a { margin: 0; }
}
@media (max-width: 480px) { .related-grid { grid-template-columns: 1fr; } }