/* Dark Mode Quill Toolbar in MudHtmlEditor robust überschreiben */

/* Textfarbe für Toolbar-Controls */
.ql-toolbar,
.ql-toolbar .ql-formats button,
.ql-toolbar .ql-picker,
.ql-toolbar .ql-picker-label,
.ql-toolbar .ql-picker-item {
    color: var(--mud-palette-text-primary) !important;
}

/* SVG-Icons: Stroke/Fill überschreiben */
.ql-snow .ql-stroke,
.ql-snow .ql-fill {
    stroke: var(--mud-palette-text-primary) ;
}
.mud-html-editor .ql-toolbar .ql-fill,
.mud-html-editor .ql-toolbar .ql-thin {
    fill: var(--mud-palette-text-primary) !important;
}



/* Quill setzt bei einigen Buttons sowohl stroke als auch fill – beides abdecken */
.mud-html-editor .ql-toolbar .ql-formats button svg *,
.mud-html-editor .ql-toolbar .ql-picker-label svg *,
.mud-html-editor .ql-toolbar .ql-picker-item svg * {
    stroke: var(--mud-palette-text-primary) !important;
    fill: var(--mud-palette-text-primary) !important;
}

/* Hover/Aktiv */
.mud-html-editor .ql-toolbar .ql-formats button:hover,
.mud-html-editor .ql-toolbar .ql-picker-label:hover,
.mud-html-editor .ql-toolbar .ql-picker-item:hover {
    color: var(--mud-palette-primary) !important;
}
.mud-html-editor .ql-toolbar .ql-formats button:hover svg *,
.mud-html-editor .ql-toolbar .ql-picker-label:hover svg *,
.mud-html-editor .ql-toolbar .ql-picker-item:hover svg * {
    stroke: var(--mud-palette-primary) !important;
    fill: var(--mud-palette-primary) !important;
}

/* Container-Hintergrund/Rahmen im Dark Mode */
.mud-html-editor .ql-toolbar {
    background-color: var(--mud-palette-background) !important;
    border-color: var(--mud-palette-lines-default) !important;
}
.mud-html-editor .ql-container {
    border-color: var(--mud-palette-lines-default) !important;
    color: var(--mud-palette-text-primary) !important;
    background-color: var(--mud-palette-surface) !important;
}

/* Picker-Dropdown */
.mud-html-editor .ql-picker-options {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
    border-color: var(--mud-palette-lines-default) !important;
}

/* Im Dark-Theme die Quill Snow-Toolbar auf hell umstellen */
.ql-snow .ql-toolbar {
    background-color: var(--mud-palette-background) !important;
    color: var(--mud-palette-text-primary) !important;
    border-color: var(--mud-palette-lines-default) !important;
}

/* Text von Buttons/Picker */
.ql-snow .ql-toolbar .ql-formats button,
.ql-snow .ql-toolbar .ql-picker,
.ql-snow .ql-toolbar .ql-picker-label,
.ql-snow .ql-toolbar .ql-picker-item {
    color: var(--mud-palette-text-primary) !important;
}

/* SVG-Icons: Stroke/Fill auf weiß */
.ql-snow .ql-toolbar .ql-stroke {
    stroke: var(--mud-palette-text-primary) !important;
}
.ql-snow .ql-toolbar .ql-fill,
.ql-snow .ql-toolbar .ql-thin {
    fill: var(--mud-palette-text-primary) !important;
}

/* Fallback: alle SVG-Childs überschreiben */
.ql-snow .ql-toolbar svg * {
    stroke: var(--mud-palette-text-primary) !important;
    fill: var(--mud-palette-text-primary) !important;
}

/* Hover/Aktiv-Zustände */
.ql-snow .ql-toolbar .ql-formats button:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover {
    color: var(--mud-palette-primary) !important;
}
.ql-snow .ql-toolbar svg *:hover {
    stroke: var(--mud-palette-primary) !important;
    fill: var(--mud-palette-primary) !important;
}

/* Editor-Container */
.ql-snow .ql-container {
    border-color: var(--mud-palette-lines-default) !important;
    color: var(--mud-palette-text-primary) !important;
    background-color: var(--mud-palette-surface) !important;
}

/* Picker-Dropdowns */
.ql-snow .ql-picker-options {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
    border-color: var(--mud-palette-lines-default) !important;
}

.ql-snow.ql-toolbar button:hover .ql-stroke, .ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke, .ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke, .ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter, .ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter, .ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter, .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
    stroke: #06c;
    
    color: #06c;
}

.ql-bold ql-active {
    stroke: #f00;
}

.ql-editor.ql-blank::before {
    color:#ffffff90
}

.ql-container {
    font-size: 16px;
    font-family: Roboto, Helvetica, Arial, sans-serif
}