.ql-editor.ql-blank::before {
    color: #FFFFFF;
    content: attr(data-placeholder);
    font-style: italic;
    left: 15px;
    pointer-events: none;
    position: absolute;
    right: 15px;
}
.ql-editor{
    white-space: wrap;
}
.ql-editor, #toolbar-container{
    background-color: var(--bs-body-bg);
}
.ql-stroke  {
    stroke: #FFF !important;
}
.ql-fill {
    fill: #FFF !important;
}
.ql-picker-options{
    background-color: var(--bs-body-bg) !important;
}
.ql-picker-label{
    color: #FFF !important;
}
.ql-picker-item{

    color: #FFF !important;
}
.ql-snow .ql-tooltip{
    background-color: var(--bs-body-bg);
    color: #FFF;
}
.ql-snow .ql-tooltip[data-mode=link]::before {
    content: "Írj be egy linket:";
}
.ql-snow .ql-tooltip.ql-editing input{
    background-color: var(--bs-body-bg);
}
#editor-resizer .toolbar .group .input-wrapper input{
    background-color: #FFF;
}
.ql-font-oswald {
    font-family: 'Oswald', sans-serif;
}
.ql-font-calibri {
    font-family: 'Calibri', sans-serif;
}
.ql-font-times-new-roman {
    font-family: 'Times New Roman', serif;
}
.ql-font-sans-serif {
    font-family: 'Sans-serif', sans-serif;
}
.ql-size .ql-picker-label[data-label]::before,
.ql-size .ql-picker-item[data-label]::before {
    content: attr(data-label) !important;
}
@keyframes editor-floatin {
    0% {
        transform: translate(-50%, -50px);
        opacity: 0;
    }
    100% {
        transform: translate(-50%, 0);
        opacity: 1;
    }
}
#editor-window {
    animation: ease-in-out 0.5s;
    animation-name: editor-floatin;
}
.hide-animation {
    animation: ease-in-out 0.5s;
    animation-name: editor-floatin;
    animation-direction: reverse;
}
.ql-toolbar {
    height: 4rem;
}