/*
 * VueQuill Content Display Styles
 * Applied globally to all pages that render Quill editor content
 * Targets: .article-content__body, .about-item__text, .faq-item__answer
 */

/* === Preserve Quill inline styles (background-color, color) === */

/* === Quill Alignment === */
.article-content__body .ql-align-center,
.about-item__text .ql-align-center,
.faq-item__answer .ql-align-center {
    text-align: center;
}

.article-content__body .ql-align-right,
.about-item__text .ql-align-right,
.faq-item__answer .ql-align-right {
    text-align: right;
}

.article-content__body .ql-align-left,
.about-item__text .ql-align-left,
.faq-item__answer .ql-align-left {
    text-align: left;
}

.article-content__body .ql-align-justify,
.about-item__text .ql-align-justify,
.faq-item__answer .ql-align-justify {
    text-align: justify;
}

/* === Quill Indentation (RTL) === */
.article-content__body .ql-indent-1,
.about-item__text .ql-indent-1,
.faq-item__answer .ql-indent-1 {
    padding-right: 3em;
}

.article-content__body .ql-indent-2,
.about-item__text .ql-indent-2,
.faq-item__answer .ql-indent-2 {
    padding-right: 6em;
}

.article-content__body .ql-indent-3,
.about-item__text .ql-indent-3,
.faq-item__answer .ql-indent-3 {
    padding-right: 9em;
}

.article-content__body .ql-indent-4,
.about-item__text .ql-indent-4,
.faq-item__answer .ql-indent-4 {
    padding-right: 12em;
}

.article-content__body .ql-indent-5,
.about-item__text .ql-indent-5,
.faq-item__answer .ql-indent-5 {
    padding-right: 15em;
}

/* === Quill Font Sizes === */
.article-content__body .ql-size-small,
.about-item__text .ql-size-small,
.faq-item__answer .ql-size-small {
    font-size: 0.75em;
}

.article-content__body .ql-size-large,
.about-item__text .ql-size-large,
.faq-item__answer .ql-size-large {
    font-size: 1.5em;
}

.article-content__body .ql-size-huge,
.about-item__text .ql-size-huge,
.faq-item__answer .ql-size-huge {
    font-size: 2.5em;
}

/* === Quill Font Families === */
.article-content__body .ql-font-serif,
.about-item__text .ql-font-serif,
.faq-item__answer .ql-font-serif {
    font-family: Georgia, 'Times New Roman', serif;
}

.article-content__body .ql-font-monospace,
.about-item__text .ql-font-monospace,
.faq-item__answer .ql-font-monospace {
    font-family: Monaco, 'Courier New', monospace;
}

/* === Quill RTL === */
.article-content__body .ql-direction-rtl,
.about-item__text .ql-direction-rtl,
.faq-item__answer .ql-direction-rtl {
    direction: rtl;
    text-align: inherit;
}

/* === Quill Video Embeds === */
.article-content__body .ql-video,
.about-item__text .ql-video,
.faq-item__answer .ql-video {
    display: block;
    max-width: 100%;
    width: 100%;
    aspect-ratio: 16/9;
    margin: 2em auto;
    border-radius: 12px;
}

/* === Quill Editor Artifacts (hide if leaked into content) === */
.article-content__body .ql-clipboard,
.article-content__body .ql-tooltip,
.about-item__text .ql-clipboard,
.about-item__text .ql-tooltip,
.faq-item__answer .ql-clipboard,
.faq-item__answer .ql-tooltip {
    display: none !important;
}

/* === Quill Text Formatting === */
.article-content__body strong,
.about-item__text strong,
.faq-item__answer strong {
    font-weight: 700;
}

.article-content__body em,
.about-item__text em,
.faq-item__answer em {
    font-style: italic;
}

.article-content__body u,
.about-item__text u,
.faq-item__answer u {
    text-decoration: underline;
}

.article-content__body s,
.about-item__text s,
.faq-item__answer s {
    text-decoration: line-through;
}

.article-content__body sub,
.about-item__text sub,
.faq-item__answer sub {
    vertical-align: sub;
    font-size: 0.75em;
}

.article-content__body sup,
.about-item__text sup,
.faq-item__answer sup {
    vertical-align: super;
    font-size: 0.75em;
}

/* === Quill Lists === */
.article-content__body ol,
.article-content__body ul,
.about-item__text ol,
.about-item__text ul,
.faq-item__answer ol,
.faq-item__answer ul {
    padding-right: 1.5em;
    margin: 1em 0;
}

.article-content__body li,
.about-item__text li,
.faq-item__answer li {
    margin-bottom: 0.5em;
}

/* === Quill Blockquote === */
.about-item__text blockquote,
.faq-item__answer blockquote {
    border-right: 4px solid #c9a227;
    padding: 10px 20px;
    margin: 1em 0;
    opacity: 0.85;
}

/* === Quill Images === */
.about-item__text img,
.faq-item__answer img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 1em auto;
    display: block;
}

/* === Quill Links === */
.about-item__text a,
.faq-item__answer a {
    text-decoration: underline;
    text-decoration-color: #c9a227;
}

/* === Quill Code === */
.about-item__text pre,
.faq-item__answer pre {
    background: #1e293b;
    color: #e2e8f0;
    padding: 15px;
    border-radius: 8px;
    overflow-x: auto;
    margin: 1em 0;
}

.about-item__text code,
.faq-item__answer code {
    background: rgba(255, 255, 255, 0.1);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.9em;
}

.about-item__text pre code,
.faq-item__answer pre code {
    background: transparent;
    padding: 0;
}
