/*
 * استایل‌های مربوط به CKEditor
 * شامل: ادیتور، انیمیشن‌های بارگذاری، و تنظیمات CKEditor
 */

/* استایل‌های ادیتور با ارتفاع ثابت */
.ck {
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    height: 250px; /* ارتفاع ثابت */
    background: white;
    transition: border-color 0.3s ease;
    overflow: hidden; /* جلوگیری از overflow خارجی */
}

    .ck:focus-within {
        border-color: #3498db;
        box-shadow: 0 0 10px rgba(52, 152, 219, 0.2);
    }

    /* تنظیمات CKEditor با ارتفاع ثابت و اسکرول */
    .ck .ck-editor__editable {
        border: none !important;
        height: 100% !important; /* ارتفاع ثابت */
        max-height: 100% !important;
        overflow-y: auto !important; /* اسکرول عمودی */
        overflow-x: hidden !important; /* بدون اسکرول افقی */
    }

        /* استایل اسکرول بار */
        .editor .ck-editor__editable::-webkit-scrollbar {
            width: 8px;
        }

        .editor .ck-editor__editable::-webkit-scrollbar-track {
            background: #f1f1f1;
            border-radius: 4px;
        }

        .editor .ck-editor__editable::-webkit-scrollbar-thumb {
            background: #c1c1c1;
            border-radius: 4px;
        }

            .editor .ck-editor__editable::-webkit-scrollbar-thumb:hover {
                background: #a8a8a8;
            }

    /* انیمیشن‌های بارگذاری ادیتور */
    .editor.loading {
        opacity: 0.8;
        pointer-events: none;
        position: relative;
    }

        .editor.loading::after {
            content: "در حال بارگذاری...";
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0,0,0,0.7);
            color: white;
            padding: 10px 20px;
            border-radius: 5px;
            font-size: 14px;
        }

    .editor.loaded {
        opacity: 1;
        animation: fadeIn 0.5s ease-in;
    }

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ناحیه ادیتورهای جدید */
#new-editors {
    margin-top: 30px;
    padding: 20px;
    background: #e9ecef;
    border-radius: 8px;
    min-height: 50px;
}

    #new-editors:empty::before {
        content: "ادیتورهای جدید اینجا اضافه می‌شوند...";
        color: #6c757d;
        font-style: italic;
        display: block;
        text-align: center;
        padding: 20px;
    }

/* Responsive برای ادیتور */
@media (max-width: 768px) {
    .editor {
        height: 200px; /* ارتفاع کمتر در موبایل */
        padding: 15px;
    }

        .editor .ck-editor__editable {
            height: 150px !important;
            max-height: 150px !important;
        }
}