:root {
    --toolbar: #f1f4f4;
    --code-bg: #F2F4F4;
    --blue: #8854C0;
}

.text-editor {
    padding: 15px 10px;
    width: 85%;
}

#text-editor-save-cancel {
    padding: 10px;
    width: 90%;
    margin-top: 0% !important;
}


.ql-font-roboto {
    font-family: 'Roboto', sans-serif;
}

.text-editor .ql-editor {
    min-height: 7em;
    background-color: white;
    font-size: 13px;
}

#post-toolbar {
    background-color: rgb(249, 249, 249);
}

#post-editor .post-editor-below .text-editor .ql-editor {
    min-height: 4em;
    background-color: white;
    font-size: 13px;
}

#post-editor .post-editor-below .text-editor {
    width: 100%;
    margin-left: 0 !important;
}

#post-editor .post-btn {
    font-size: 14px;
    background-color: #8854C0;
    color: white;
    padding: 3px 15px;
    border-radius: 3px;
}

#post-editor .post-btn:focus {
    box-shadow: none;
}

#post-editor .post-btn:active {
    transform: scale(0.98);
}

.ql-font-hind-siliguri {
    font-family: 'Hind Siliguri', sans-serif;
}

.ql-font-inter {
    font-family: 'Inter', sans-serif;
}

.ql-font-ubuntu {
    font-family: 'Ubuntu', sans-serif;
}

.ql-font-poppins {
    font-family: 'Poppins', sans-serif;
}

.ql-font-open-sans {
    font-family: 'Open Sans', sans-serif;
}


.ql-size-10px {
    font-size: 10px;
}

.ql-size-12px {
    font-size: 12px;
}

.ql-size-14px {
    font-size: 14px;
}

.ql-size-16px {
    font-size: 16px;
}

.ql-size-18px {
    font-size: 18px;
}

.ql-size-20px {
    font-size: 20px;
}

.ql-snow .ql-editor pre.ql-syntax {
    background-color: var(--code-bg) !important;
    color: rgb(99, 99, 99) !important;
    overflow: visible;
}

#toolbar {
    background-color: var(--toolbar);
    border-top-left-radius: 0.4em;
    border-top-right-radius: 0.4em;
    border-bottom: none;
}