/**
 * Centralized Quill Editor Styles
 * Protects toolbar icons and prevents global CSS interference
 */

/* Protect Quill toolbar icons from global CSS overrides */
.ql-toolbar svg,
.ql-toolbar .ql-stroke,
.ql-toolbar .ql-fill,
.ql-toolbar .ql-picker-label svg,
.ql-toolbar button svg {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
}

.ql-toolbar .ql-picker-label svg {
    width: 14px !important;
    height: 14px !important;
}

/* Disable global hover "tile" effect for Quill editors */
[id*="-editor"]:hover,
[id*="-editor"].border:hover,
#editor:hover,
#editor.border:hover,
[id^="speaker-topic-editor-"]:hover,
[id^="speaker-topic-editor-"].border:hover {
    box-shadow: none !important;
    transform: none !important;
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
}

/* Ensure Quill editor containers have proper styling */
.ql-container {
    font-family: 'Open Sans', sans-serif;
}

/* ================================
   Quill content typography
   -------------------------------
   Purpose: ensure formatting is visible even when global design overrides
   apply !important typography rules (which can flatten Quill headers).
   These rules are scoped to the editor only.
   ================================ */

.ql-editor h1 {
    font-size: 2rem !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    margin: 0.75rem 0 0.5rem !important;
}

.ql-editor h2 {
    font-size: 1.5rem !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    margin: 0.75rem 0 0.5rem !important;
}

.ql-editor h3 {
    font-size: 1.25rem !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    margin: 0.75rem 0 0.5rem !important;
}

.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
    font-size: 1.125rem !important;
    line-height: 1.35 !important;
    font-weight: 500 !important;
    margin: 0.75rem 0 0.5rem !important;
}

.ql-editor blockquote {
    border-left: 4px solid #d1d5db !important; /* gray-300 */
    padding-left: 1rem !important;
    margin: 1rem 0 !important;
    color: #374151 !important; /* gray-700 */
}

.ql-editor ul,
.ql-editor ol,
.ql-editor li {
    font-size: 1rem !important;
    line-height: 1.75 !important;
}

.ql-editor em,
.ql-editor i {
    font-style: italic !important;
}

/* Protect Quill toolbar from button system styles */
.ql-toolbar .ql-picker,
.ql-toolbar button {
    /* Exclude from global button styles */
}