/* Set dropdown font-families */
.ql-toolbar .ql-font span[data-label='Sailec Light']::before {
  font-family : 'Sailec Light';
}

.ql-toolbar .ql-font span[data-label='Sofia Pro']::before {
  font-family : 'Sofia';
}

.ql-toolbar .ql-font span[data-label='Slabo 27px']::before {
  font-family : 'Slabo 27px';
}

.ql-toolbar .ql-font span[data-label='Roboto Slab']::before {
  font-family : 'Roboto Slab';
}

.ql-toolbar .ql-font span[data-label='Inconsolata']::before {
  font-family : 'Inconsolata';
}

.ql-toolbar .ql-font span[data-label='Ubuntu Mono']::before {
  font-family : 'Ubuntu Mono';
}

/* Set content font-families */
.ql-font-sofia {
  font-family : 'Sofia';
}

.ql-font-slabo {
  font-family : 'Slabo 27px';
}

.ql-font-roboto {
  font-family : 'Roboto Slab';
}

.ql-font-inconsolata {
  font-family : 'Inconsolata';
}

.ql-font-ubuntu {
  font-family : 'Ubuntu Mono';
}

.ql-toolbar {
  border-color : #D8D6DE !important;
}

.ql-toolbar .ql-formats:focus, .ql-toolbar .ql-formats *:focus {
  outline : 0;
}

.ql-toolbar .ql-formats .ql-picker-label:hover, .ql-toolbar .ql-formats .ql-picker-label:focus, .ql-toolbar .ql-formats button:hover, .ql-toolbar .ql-formats button:focus {
  color : #7367F0 !important;
}

.ql-toolbar .ql-formats .ql-picker-label:hover .ql-stroke, .ql-toolbar .ql-formats .ql-picker-label:focus .ql-stroke, .ql-toolbar .ql-formats button:hover .ql-stroke, .ql-toolbar .ql-formats button:focus .ql-stroke {
  stroke : #7367F0 !important;
}

.ql-toolbar .ql-formats .ql-picker-label:hover .ql-fill, .ql-toolbar .ql-formats .ql-picker-label:focus .ql-fill, .ql-toolbar .ql-formats button:hover .ql-fill, .ql-toolbar .ql-formats button:focus .ql-fill {
  fill : #7367F0 !important;
}

.ql-toolbar .ql-formats .ql-picker-label.ql-active, .ql-toolbar .ql-formats button.ql-active {
  color : #7367F0 !important;
}

.ql-toolbar .ql-formats .ql-picker-item.ql-selected {
  color : #7367F0 !important;
}

.ql-toolbar .ql-formats .ql-picker-options .ql-picker-item:hover {
  color : #7367F0 !important;
}

.ql-toolbar .ql-formats .ql-picker-options .ql-active {
  color : #7367F0 !important;
}

.ql-bubble .ql-picker {
  color : #FFFFFF !important;
}

.ql-bubble .ql-stroke {
  stroke : #FFFFFF !important;
}

.ql-bubble .ql-fill {
  fill : #FFFFFF !important;
}

.ql-container {
  border-color : #D8D6DE !important;
  font-family : 'Montserrat', Helvetica, Arial, serif;
}

.ql-editor a {
  color : #7367F0;
}

.ql-picker {
  color : #5E5873 !important;
}

.ql-stroke {
  stroke : #5E5873 !important;
}

.ql-active .ql-stroke {
  stroke : #7367F0 !important;
}

.ql-active .ql-fill {
  fill : #7367F0 !important;
}

.ql-fill {
  fill : #5E5873 !important;
}

.ql-toolbar, .ql-container {
  border-top-left-radius : 0.357rem;
  border-top-right-radius : 0.357rem;
}

.ql-toolbar + .ql-container, .ql-container + .ql-toolbar {
  border-bottom-left-radius : 0.357rem;
  border-bottom-right-radius : 0.357rem;
  border-top-left-radius : unset;
  border-top-right-radius : unset;
}

.dark-layout .quill-toolbar, .dark-layout .ql-toolbar {
  background-color : #283046;
  border-color : #3B4253 !important;
}

.dark-layout .quill-toolbar .ql-picker, .dark-layout .ql-toolbar .ql-picker {
  color : #FFFFFF !important;
}

.dark-layout .quill-toolbar .ql-stroke, .dark-layout .ql-toolbar .ql-stroke {
  stroke : #FFFFFF !important;
}

.dark-layout .quill-toolbar .ql-fill, .dark-layout .ql-toolbar .ql-fill {
  fill : #FFFFFF !important;
}

.dark-layout .quill-toolbar .ql-picker-options, .dark-layout .quill-toolbar .ql-picker-label, .dark-layout .ql-toolbar .ql-picker-options, .dark-layout .ql-toolbar .ql-picker-label {
  background-color : #283046;
}

.dark-layout .quill-toolbar .ql-picker-options .ql-active, .dark-layout .quill-toolbar .ql-picker-label .ql-active, .dark-layout .ql-toolbar .ql-picker-options .ql-active, .dark-layout .ql-toolbar .ql-picker-label .ql-active {
  color : #7367F0 !important;
}

.dark-layout .ql-active .ql-stroke {
  stroke : #7367F0 !important;
}

.dark-layout .ql-active .ql-fill {
  fill : #7367F0 !important;
}

.dark-layout .ql-bubble .ql-toolbar {
  background : #3B4253;
  border-radius : 2rem;
}

.dark-layout .ql-container {
  border-color : #3B4253 !important;
  background-color : #283046;
}

.dark-layout .ql-editor .ql-syntax {
  background-color : #161D31;
}

.dark-layout .ql-editor.ql-blank:before {
  color : #B4B7BD;
}

[data-textdirection='rtl'] .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) i, [data-textdirection='rtl'] .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  right : auto !important;
  left : 0;
}