.blog-post .blog-content h2 {
    margin-top: 2.5rem;
}

.blog-post .blog-content h3 {
    margin-top: 2rem;
}

.blog-post .blog-content h4 {
    margin-top: 1.5rem;
}

/* Перечень чекбоксов */

.contains-task-list {
    list-style: none;
    padding-left: 0;
}

    .contains-task-list li {
        padding: var(--size-spacing-2) 0;
    }





.blog-post .blog-content table {
    border-collapse: collapse;
    width: 100%;
}

.blog-post .blog-content th,
.blog-post .blog-content td {
    border: 1px solid #ccc;
    padding: 8px;
}

.blog-post .blog-content th {
    background: #f5f5f5;
    text-align: left;
}




.blog-content {
    --color-code-background: rgb(var(--color-red-700-rgb));
}


    .blog-content blockquote {
        margin: var(--size-spacing-16) 0;
        padding: var(--size-spacing-12) var(--size-spacing-16);
        border-left: 4px solid var(--color-mask-shade-10);
        background-color: var(--color-mask-shade-5);
        border-radius: var(--size-radius-base);
    }

        .blog-content blockquote p {
            font-style: italic;
            color: rgb(var(--color-neutral-500-rgb));
        }


    /* CODE */

    .blog-content code:not(pre code) {
        color: var(--color-code-background); /* текст, например красный/фиолетовый */
        padding: var(--size-spacing-2) var(--size-spacing-4); /* небольшой отступ */
        font-family: Consolas, "Courier New", monospace; /* моноширинный шрифт */
        font-size: 0.95em; /* чуть меньше обычного текста */
    }

.blog-content p code {
    background-color: #f5f5f5; /* светлый фон */
    border-radius: var(--size-radius-xs); /* скругление */
}



    .blog-content .code-block {
        display: flex;
        flex-direction: column;
        gap: var(--size-spacing-16);
        padding: var(--size-spacing-16);
        background-color: rgb(var(--color-secondary-100-rgb));
        border-radius: var(--size-radius-xl);
    }

    .blog-content .code-header {
        font-size: 0.85em;
        font-weight: 500;
        color: rgb(var(--color-neutral-300-rgb));
    }

    .blog-content .code-block pre {
        margin: 0;
        border-radius: 0 0 6px 6px;
        overflow-x: auto;
        padding: 12px;
        font-family: Consolas, "Courier New", monospace;
        font-size: 0.95em;
    }


.blog-content img{
    width: 100%;
}