/* ==========================================================================
   CKEditor 5 RTL & Content Normalization (Editor + Frontend View)
   Bulletproof Version for Aparat & Video Embeds (Desktop & Mobile)
   ========================================================================== */

/* والد محتوا در ادیتور و فرانت‌اند */
.ck.ck-content,
.ck-content,
.article-content,
.news-content {
    direction: rtl;
    text-align: right;
    font-family: inherit;
    line-height: 1.9;
    font-size: 15px;
    color: var(--dash-text-main, #1e293b);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* هدینگ‌ها، پاراگراف‌ها، لیست‌ها و سایر المان‌های متنی */
.ck.ck-content h1,
.ck.ck-content h2,
.ck.ck-content h3,
.ck.ck-content h4,
.ck.ck-content p,
.ck.ck-content li,
.ck.ck-content blockquote,
.ck.ck-content table,
.ck-content h1,
.ck-content h2,
.ck-content h3,
.ck-content h4,
.ck-content p,
.ck-content li,
.ck-content blockquote,
.ck-content table,
.article-content h1,
.article-content h2,
.article-content h3,
.article-content h4,
.article-content p,
.article-content li,
.article-content blockquote,
.article-content table,
.news-content h1,
.news-content h2,
.news-content h3,
.news-content h4,
.news-content p,
.news-content li,
.news-content blockquote,
.news-content table {
    direction: rtl;
    text-align: right;
}

/* فاصله داخلی مناسب و حداقل ارتفاع ادیتور */
.ck.ck-editor__main > .ck-editor__editable {
    min-height: 340px;
    padding: 1.25rem 1.5rem !important;
}

/* --------------------------------------------------------------------------
   تصاویر، فیگورها و تراز در ساختار RTL
   -------------------------------------------------------------------------- */
.ck.ck-content figure.image,
.ck-content figure.image,
.article-content figure.image,
.news-content figure.image {
    margin: 1.5rem auto;
    display: table;
    clear: both;
    text-align: center;
    max-width: 100%;
}

.ck.ck-content figure.image img,
.ck-content figure.image img,
.article-content figure.image img,
.news-content figure.image img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    border-radius: var(--dash-radius-md, 8px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* زیرنویس عکس */
.ck.ck-content figure.image figcaption,
.ck-content figure.image figcaption,
.article-content figure.image figcaption,
.news-content figure.image figcaption {
    font-size: 0.85rem;
    color: var(--dash-text-muted, #64748b);
    text-align: center;
    padding: 0.5rem;
    caption-side: bottom;
    display: table-caption;
}

/* ترازهای تصویر */
.ck.ck-content figure.image.image-style-align-center,
.ck-content figure.image.image-style-align-center,
.article-content figure.image.image-style-align-center,
.news-content figure.image.image-style-align-center {
    margin-left: auto;
    margin-right: auto;
}

.ck.ck-content figure.image.image-style-align-right,
.ck.ck-content figure.image.image-style-side,
.ck-content figure.image.image-style-align-right,
.ck-content figure.image.image-style-side,
.article-content figure.image.image-style-align-right,
.article-content figure.image.image-style-side,
.news-content figure.image.image-style-align-right,
.news-content figure.image.image-style-side {
    float: right;
    margin: 0.5rem 0 1.25rem 1.5rem;
}

.ck.ck-content figure.image.image-style-align-left,
.ck-content figure.image.image-style-align-left,
.article-content figure.image.image-style-align-left,
.news-content figure.image.image-style-align-left {
    float: left;
    margin: 0.5rem 1.5rem 1.25rem 0;
}

/* --------------------------------------------------------------------------
   جداول، نقل‌قول‌ها و کدها در محیط RTL
   -------------------------------------------------------------------------- */
.ck.ck-content blockquote,
.ck-content blockquote,
.article-content blockquote,
.news-content blockquote {
    border-right: 4px solid var(--dash-primary, #0f766e) !important;
    border-left: none !important;
    padding: 0.75rem 1.25rem 0.75rem 0.75rem !important;
    margin: 1.5rem 0;
    background: var(--dash-surface-subtle, #f8fafc);
    border-radius: 4px 0 0 4px;
    color: var(--dash-text-muted, #475569);
    font-style: italic;
}

/* لیست‌ها */
.ck.ck-content ul,
.ck.ck-content ol,
.ck-content ul,
.ck-content ol,
.article-content ul,
.article-content ol,
.news-content ul,
.news-content ol {
    padding-right: 1.75rem;
    padding-left: 0;
    margin-bottom: 1.25rem;
}

.ck.ck-content li,
.ck-content li,
.article-content li,
.news-content li {
    margin-bottom: 0.35rem;
}

/* جداول */
.ck.ck-content .table,
.ck-content .table,
.article-content table,
.news-content table {
    margin: 1.5rem auto;
    width: 100%;
    border-collapse: collapse;
    overflow-x: auto;
    display: block;
}

.ck.ck-content table th,
.ck.ck-content table td,
.ck-content table th,
.ck-content table td,
.article-content table th,
.article-content table td,
.news-content table th,
.news-content table td {
    padding: 0.75rem 1rem;
    border: 1px solid var(--dash-border, #e2e8f0);
    text-align: right;
}

.ck.ck-content table th,
.ck-content table th,
.article-content table th,
.news-content table th {
    background-color: var(--dash-surface-subtle, #f1f5f9);
    font-weight: 600;
}

/* قطعه کدها */
.ck.ck-content pre,
.ck.ck-content code,
.ck-content pre,
.ck-content code,
.article-content pre,
.article-content code,
.news-content pre,
.news-content code {
    direction: ltr !important;
    text-align: left !important;
    font-family: Consolas, "Courier New", monospace !important;
}

.ck.ck-content pre,
.ck-content pre,
.article-content pre,
.news-content pre {
    background-color: #0f172a;
    color: #f8fafc;
    padding: 1rem 1.25rem;
    border-radius: 8px;
    overflow-x: auto;
    margin: 1.25rem 0;
}

/* ==========================================================================
   Video & Media Embeds (Aparat & Iframe Universal Fix)
   حل قطعی نوار باریک دسکتاپ و کادر سیاه موبایل
   ========================================================================== */

/* ۱. تمام ویجت‌ها و باکس‌های والد مدیا */
.ck.ck-content .media,
.ck-content .media,
.article-content .media,
.news-content .media,
.ck.ck-content .ck-media-embed,
.ck-content .ck-media-embed,
.article-content .ck-media-embed,
.news-content .ck-media-embed,
.ck.ck-content .raw-html-embed,
.ck-content .raw-html-embed,
.article-content .raw-html-embed,
.news-content .raw-html-embed,
.ck.ck-content figure.media,
.ck-content figure.media,
.article-content figure.media,
.news-content figure.media {
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    margin: 1.5rem auto !important;
    display: block !important;
    overflow: hidden !important;
    background: transparent !important;
}

/* ۲. کانتینر اختصاصی آپارات (در صورت وجود) */
.ck.ck-content .h_iframe-aparat_embed_frame,
.ck-content .h_iframe-aparat_embed_frame,
.article-content .h_iframe-aparat_embed_frame,
.news-content .h_iframe-aparat_embed_frame {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    padding: 0 !important;
    margin: 1.5rem auto !important;
    overflow: hidden !important;
    background: #000 !important;
    border-radius: var(--dash-radius-md, 8px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);
}

/* خنثی‌سازی قطعی کدهای مخرب داخلی آپارات (span و style داخلی) */
.ck.ck-content .h_iframe-aparat_embed_frame > span,
.ck-content .h_iframe-aparat_embed_frame > span,
.ck-content .h_iframe-aparat_embed_frame > .ratio,
.article-content .h_iframe-aparat_embed_frame > span,
.article-content .h_iframe-aparat_embed_frame > .ratio,
.news-content .h_iframe-aparat_embed_frame > span,
.news-content .h_iframe-aparat_embed_frame > .ratio,
.ck.ck-content .h_iframe-aparat_embed_frame style,
.ck-content .h_iframe-aparat_embed_frame style,
.article-content .h_iframe-aparat_embed_frame style,
.news-content .h_iframe-aparat_embed_frame style {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ۳. استایل فراگیر برای تمام آی‌فریم‌ها (چه داخل کلاس آپارات، چه خارج آن) */
.ck.ck-content iframe:not(.map-frame),
.ck-content iframe:not(.map-frame),
.article-content iframe:not(.map-frame),
.news-content iframe:not(.map-frame),
.ck.ck-content .h_iframe-aparat_embed_frame iframe,
.ck-content .h_iframe-aparat_embed_frame iframe,
.article-content .h_iframe-aparat_embed_frame iframe,
.news-content .h_iframe-aparat_embed_frame iframe {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    border: 0 !important;
    margin: 0 auto !important;
    border-radius: var(--dash-radius-md, 8px);
    background: #000 !important;
}

/* اگر iframe مستقیماً داخل تگ آپارات قرار گرفت، کل کادر 16:9 را پر کند */
.ck.ck-content .h_iframe-aparat_embed_frame iframe,
.ck-content .h_iframe-aparat_embed_frame iframe,
.article-content .h_iframe-aparat_embed_frame iframe,
.news-content .h_iframe-aparat_embed_frame iframe {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* ۴. استایل داخل ادیتور (Admin Dashboard) */
.ck.ck-editor__editable .raw-html-embed,
.ck.ck-editor__editable .ck-widget.raw-html-embed,
.ck.ck-editor__editable .media,
.ck.ck-editor__editable .ck-media-embed {
    width: 100% !important;
    max-width: 100% !important;
    margin: 1.5rem auto !important;
    display: block !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: transparent !important;
}

.ck.ck-editor__editable .h_iframe-aparat_embed_frame {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    margin: 1rem auto !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #000 !important;
}

.ck.ck-editor__editable .h_iframe-aparat_embed_frame > span,
.ck.ck-editor__editable .h_iframe-aparat_embed_frame style {
    display: none !important;
}

.ck.ck-editor__editable .h_iframe-aparat_embed_frame iframe,
.ck.ck-editor__editable .raw-html-embed iframe,
.ck.ck-editor__editable .ck-media-embed iframe {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 16 / 9 !important;
    border: 0 !important;
}

/* --------------------------------------------------------------------------
   HTML5 video
   -------------------------------------------------------------------------- */
.ck.ck-content video,
.ck-content video,
.article-content video,
.news-content video {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    margin: 1.5rem 0;
    background: #000;
    border-radius: var(--dash-radius-md, 8px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.ck.ck-content video source,
.ck-content video source,
.article-content video source,
.news-content video source {
    display: block;
}

/* --------------------------------------------------------------------------
   Media Queries (Responsive Mobile & Tablet)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    .ck.ck-editor__main > .ck-editor__editable {
        padding: 0.75rem !important;
    }

    .ck.ck-content figure.image.image-style-align-right,
    .ck.ck-content figure.image.image-style-align-left,
    .ck-content figure.image.image-style-align-right,
    .ck-content figure.image.image-style-align-left,
    .article-content figure.image.image-style-align-right,
    .article-content figure.image.image-style-align-left,
    .news-content figure.image.image-style-align-right,
    .news-content figure.image.image-style-align-left {
        float: none !important;
        margin: 1rem auto !important;
        display: block !important;
    }

    .ck.ck-content .h_iframe-aparat_embed_frame,
    .ck-content .h_iframe-aparat_embed_frame,
    .article-content .h_iframe-aparat_embed_frame,
    .news-content .h_iframe-aparat_embed_frame,
    .ck.ck-content iframe,
    .ck-content iframe,
    .article-content iframe,
    .news-content iframe,
    .ck.ck-content video,
    .ck-content video,
    .article-content video,
    .news-content video {
        margin: 1rem auto !important;
        border-radius: 6px !important;
        aspect-ratio: 16 / 9 !important;
        width: 100% !important;
    }
}