/* Shared article content styles for admin preview and public news page */
.article-content {
    color: var(--text-secondary);
    font-family: var(--font-body, 'Commissioner', system-ui, sans-serif);
    font-size: 16px;
    line-height: 1.75;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow: hidden;
}
.article-content p,
.article-content ol,
.article-content ul,
.article-content pre,
.article-content blockquote,
.article-content h1, .article-content h2, .article-content h3,
.article-content h4, .article-content h5, .article-content h6 {
    margin: 0;
    color: var(--text-secondary);
}
.article-content h1 { font-size: 2em; font-weight: 700; margin-bottom: 20px; letter-spacing: -0.02em; line-height: 1.2; color: var(--text-primary); }
.article-content h2 { font-size: 1.6em; font-weight: 700; margin-bottom: 16px; letter-spacing: -0.01em; line-height: 1.3; color: var(--text-primary); }
.article-content h3 { font-size: 1.3em; font-weight: 600; margin-bottom: 14px; color: var(--text-primary); }
.article-content h4 { font-size: 1.1em; font-weight: 600; margin-bottom: 12px; color: var(--text-primary); }
.article-content h5, .article-content h6 { font-size: 1em; font-weight: 600; margin-bottom: 10px; color: var(--text-muted); }
.article-content p { line-height: 1.8; margin-bottom: 0; }
.article-content a { color: var(--link, var(--mud-palette-primary)); text-decoration: none; transition: color 0.2s; }
.article-content a:hover { color: var(--accent-hover); text-decoration: underline; }
.article-content ul, .article-content ol { padding-left: 24px; }
.article-content li { margin-bottom: 8px; line-height: 1.7; }
.article-content li::marker { color: var(--accent); }
.article-content blockquote {
    border-left: 3px solid var(--accent);
    background: var(--bg-hover);
    padding: 14px 20px;
    margin: 16px 0;
    border-radius: 0 8px 8px 0;
    color: var(--text-primary);
}
.article-content code {
    background: var(--accent-subtle);
    color: var(--accent);
    padding: 2px 6px;
    border-radius: 4px;
    font-family: "Fira Code", monospace;
    font-size: 0.9em;
}
.article-content pre {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    padding: 16px;
    overflow-x: auto;
    margin: 16px 0;
}
.article-content pre code { background: transparent; padding: 0; color: inherit; display: block; }
.article-content img { max-width: 100% !important; height: auto !important; border-radius: 10px; margin: 16px 0; display: block; }
.article-content strong { font-weight: 700; }
.article-content em { font-style: italic; }
.article-content u { text-decoration: underline; text-underline-offset: 3px; }
.article-content s { text-decoration: line-through; opacity: 0.7; }
.article-content hr { border: none; height: 1px; background: var(--border-light); margin: 24px 0; }
.article-content .ql-mention-link {
    color: var(--accent);
    text-decoration: none;
    background: var(--accent-subtle);
    padding: 1px 4px;
    border-radius: 3px;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.2s, background 0.2s;
}
.article-content .ql-mention-link:hover {
    color: var(--accent-hover);
    background: rgba(var(--mud-palette-primary-rgb), 0.15);
    text-decoration: underline;
}
.article-content .ql-callout {
    position: relative;
    background: var(--accent-subtle);
    border: 1px solid rgba(var(--mud-palette-primary-rgb), 0.15);
    border-left: 4px solid var(--accent);
    border-radius: 0 10px 10px 0;
    padding: 16px 20px;
    margin: 16px 0;
    color: var(--text-primary);
    line-height: 1.7;
}

/* Выравнивание и отступы: Quill ставит их классами, так что правила нужны любому тексту портала, не только новости.
   Внутри самого редактора (.ql-editor) те же классы оформляет Quill. */
.ql-align-center { text-align: center; }
.ql-align-right { text-align: right; }
.ql-align-justify { text-align: justify; }
.ql-indent-1:not(.ql-editor *) { padding-left: 3em; }
.ql-indent-2:not(.ql-editor *) { padding-left: 6em; }
.ql-indent-3:not(.ql-editor *) { padding-left: 9em; }
.ql-indent-4:not(.ql-editor *) { padding-left: 12em; }
.ql-indent-5:not(.ql-editor *) { padding-left: 15em; }
.ql-indent-6:not(.ql-editor *) { padding-left: 18em; }
.ql-indent-7:not(.ql-editor *) { padding-left: 21em; }
.ql-indent-8:not(.ql-editor *) { padding-left: 24em; }
/* Вложенный пункт списка сдвигается вместе с маркером. */
li.ql-indent-1:not(.ql-editor *) { padding-left: 0; margin-left: 3em; }
li.ql-indent-2:not(.ql-editor *) { padding-left: 0; margin-left: 6em; }
li.ql-indent-3:not(.ql-editor *) { padding-left: 0; margin-left: 9em; }
li.ql-indent-4:not(.ql-editor *) { padding-left: 0; margin-left: 12em; }
li.ql-indent-5:not(.ql-editor *) { padding-left: 0; margin-left: 15em; }
li.ql-indent-6:not(.ql-editor *) { padding-left: 0; margin-left: 18em; }
li.ql-indent-7:not(.ql-editor *) { padding-left: 0; margin-left: 21em; }
li.ql-indent-8:not(.ql-editor *) { padding-left: 0; margin-left: 24em; }

/* Ролик внутри текста новости: на месте маркера рендерится плеер. */
.article-content .portal-video {
    margin: 20px 0;
}
.article-content .portal-video media-player {
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
}