/* Quill Editor Custom Styles */
.quill-editor-container {
    margin-bottom: 1rem;
}

.ql-editor {
    min-height: 200px;
    font-family: inherit;
}

.ql-editor[dir="rtl"] {
    text-align: right;
    direction: rtl;
}

.ql-editor[dir="ltr"] {
    text-align: left;
    direction: ltr;
}

/* Quill Alignment Classes - Must take precedence over direction-based alignment */
.ql-editor .ql-align-left,
.ql-editor p.ql-align-left,
.ql-editor h1.ql-align-left,
.ql-editor h2.ql-align-left,
.ql-editor h3.ql-align-left,
.ql-editor h4.ql-align-left,
.ql-editor h5.ql-align-left,
.ql-editor h6.ql-align-left,
.ql-editor li.ql-align-left,
.ql-editor blockquote.ql-align-left,
.ql-editor div.ql-align-left {
    text-align: left !important;
}

.ql-editor .ql-align-center,
.ql-editor p.ql-align-center,
.ql-editor h1.ql-align-center,
.ql-editor h2.ql-align-center,
.ql-editor h3.ql-align-center,
.ql-editor h4.ql-align-center,
.ql-editor h5.ql-align-center,
.ql-editor h6.ql-align-center,
.ql-editor li.ql-align-center,
.ql-editor blockquote.ql-align-center,
.ql-editor div.ql-align-center {
    text-align: center !important;
}

.ql-editor .ql-align-right,
.ql-editor p.ql-align-right,
.ql-editor h1.ql-align-right,
.ql-editor h2.ql-align-right,
.ql-editor h3.ql-align-right,
.ql-editor h4.ql-align-right,
.ql-editor h5.ql-align-right,
.ql-editor h6.ql-align-right,
.ql-editor li.ql-align-right,
.ql-editor blockquote.ql-align-right,
.ql-editor div.ql-align-right {
    text-align: right !important;
}

.ql-editor .ql-align-justify,
.ql-editor p.ql-align-justify,
.ql-editor h1.ql-align-justify,
.ql-editor h2.ql-align-justify,
.ql-editor h3.ql-align-justify,
.ql-editor h4.ql-align-justify,
.ql-editor h5.ql-align-justify,
.ql-editor h6.ql-align-justify,
.ql-editor li.ql-align-justify,
.ql-editor blockquote.ql-align-justify,
.ql-editor div.ql-align-justify {
    text-align: justify !important;
}

/* Per-line/block direction support - Only apply when no alignment class is present */
.ql-editor p[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h1[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h2[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h3[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h4[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h5[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h6[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor li[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor blockquote[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor pre[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor div[dir="rtl"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify) {
    text-align: right;
    direction: rtl;
}

.ql-editor p[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h1[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h2[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h3[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h4[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h5[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor h6[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor li[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor blockquote[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor pre[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify),
.ql-editor div[dir="ltr"]:not(.ql-align-left):not(.ql-align-center):not(.ql-align-right):not(.ql-align-justify) {
    text-align: left;
    direction: ltr;
}

/* Toolbar RTL fixes */
.ql-snow .ql-toolbar[dir="rtl"] button,
.ql-snow[dir="rtl"] .ql-toolbar button {
    float: right;
}

/* Image resize handles */
.ql-editor .image-resizer {
    border: 1px dashed #999;
}

/* Loading state */
.quill-editor-container.loading::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Font Styles - English Fonts */
.ql-font-arial {
    font-family: Arial, sans-serif;
}

.ql-font-helvetica {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.ql-font-times-new-roman {
    font-family: "Times New Roman", Times, serif;
}

.ql-font-georgia {
    font-family: Georgia, serif;
}

.ql-font-verdana {
    font-family: Verdana, Geneva, sans-serif;
}

.ql-font-courier-new {
    font-family: "Courier New", Courier, monospace;
}

.ql-font-impact {
    font-family: Impact, Charcoal, sans-serif;
}

.ql-font-comic-sans {
    font-family: "Comic Sans MS", cursive, sans-serif;
}

.ql-font-tahoma {
    font-family: Tahoma, Geneva, sans-serif;
}

.ql-font-trebuchet {
    font-family: "Trebuchet MS", Helvetica, sans-serif;
}

.ql-font-roboto {
    font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
}

.ql-font-open-sans {
    font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
}

/* Font Styles - Arabic Fonts with RTL Support */
.ql-font-arial-arabic {
    font-family: Arial, "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-tahoma-arabic {
    font-family: Tahoma, "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-simplified-arabic {
    font-family: "Simplified Arabic", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-traditional-arabic {
    font-family: "Traditional Arabic", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-arabic-typesetting {
    font-family: "Arabic Typesetting", "Segoe UI", Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-segoe-ui-arabic {
    font-family: "Segoe UI", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-andalus {
    font-family: Andalus, "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-aldhabi {
    font-family: Aldhabi, "Arabic Typesetting", "Segoe UI", serif;
    direction: rtl;
    text-align: right;
}

.ql-font-arabic-transparent {
    font-family: "Arabic Transparent", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-sakkal-majalla {
    font-family: "Sakkal Majalla", "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-cairo {
    font-family: "Cairo", "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
    text-align: right;
}

.ql-font-tajawal {
    font-family: "Tajawal", "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
    text-align: right;
}

/* Font dropdown styling */
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
    content: 'Font';
    font-weight: normal;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="arial"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="arial"]::before {
    content: 'Arial';
    font-family: Arial, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="helvetica"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="helvetica"]::before {
    content: 'Helvetica';
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="times-new-roman"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="times-new-roman"]::before {
    content: 'Times New Roman';
    font-family: "Times New Roman", Times, serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="georgia"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="georgia"]::before {
    content: 'Georgia';
    font-family: Georgia, serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="verdana"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="verdana"]::before {
    content: 'Verdana';
    font-family: Verdana, Geneva, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="courier-new"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="courier-new"]::before {
    content: 'Courier New';
    font-family: "Courier New", Courier, monospace;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="impact"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="impact"]::before {
    content: 'Impact';
    font-family: Impact, Charcoal, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="comic-sans"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="comic-sans"]::before {
    content: 'Comic Sans MS';
    font-family: "Comic Sans MS", cursive, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="tahoma"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="tahoma"]::before {
    content: 'Tahoma';
    font-family: Tahoma, Geneva, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="trebuchet"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="trebuchet"]::before {
    content: 'Trebuchet MS';
    font-family: "Trebuchet MS", Helvetica, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="roboto"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="roboto"]::before {
    content: 'Roboto';
    font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="open-sans"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="open-sans"]::before {
    content: 'Open Sans';
    font-family: "Open Sans", "Helvetica Neue", Arial, sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="arial-arabic"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="arial-arabic"]::before {
    content: 'Arial (عربي)';
    font-family: Arial, "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="tahoma-arabic"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="tahoma-arabic"]::before {
    content: 'Tahoma (عربي)';
    font-family: Tahoma, "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="simplified-arabic"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="simplified-arabic"]::before {
    content: 'Simplified Arabic';
    font-family: "Simplified Arabic", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="traditional-arabic"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="traditional-arabic"]::before {
    content: 'Traditional Arabic';
    font-family: "Traditional Arabic", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="arabic-typesetting"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="arabic-typesetting"]::before {
    content: 'Arabic Typesetting';
    font-family: "Arabic Typesetting", "Segoe UI", Arial, sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="segoe-ui-arabic"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="segoe-ui-arabic"]::before {
    content: 'Segoe UI (عربي)';
    font-family: "Segoe UI", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="andalus"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="andalus"]::before {
    content: 'Andalus';
    font-family: Andalus, "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="aldhabi"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="aldhabi"]::before {
    content: 'Aldhabi';
    font-family: Aldhabi, "Arabic Typesetting", "Segoe UI", serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="arabic-transparent"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="arabic-transparent"]::before {
    content: 'Arabic Transparent';
    font-family: "Arabic Transparent", "Arabic Typesetting", Arial, sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="sakkal-majalla"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="sakkal-majalla"]::before {
    content: 'Sakkal Majalla';
    font-family: "Sakkal Majalla", "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="cairo"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="cairo"]::before {
    content: 'Cairo (عربي)';
    font-family: "Cairo", "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="tajawal"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="tajawal"]::before {
    content: 'Tajawal (عربي)';
    font-family: "Tajawal", "Arabic Typesetting", "Segoe UI", sans-serif;
    direction: rtl;
}