/* QUILLJS */
.x-quill{
    width: 100%;
    padding: 12px 16px;
    transition: all 0.3s ease;
    font-weight: 300;

    .ql-editor{
        background-color: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        color: #2d3748;
    }

    .ql-header[value="3"]::before {
        content: "H3";
        font-size: 11px;
        font-weight: 600;
        font-family: sans-serif;
        display: inline-block;
        line-height: 1;
    }
    .ql-header[value="3"].ql-active{
    color: #fff;
    }

    h1,h2,h3{
        text-transform: initial;
        font-weight: 500;
        font-family: var(--f-article, "Helvetica Neue", Arial, sans-serif);
    }
    h1{
        margin-bottom: 20px;
        font-size: 180%;
    }
    h2{
        margin-bottom: 15px;
        font-size: 130%;
    }
    h3{
        font-size: 110% !important;
        padding-bottom: 8px !important;
    }
    p{
        margin-bottom: 15px;
        font-size: 100%;
        
        strong{
            font-weight: 500;
        }
    }
    .ql-align-justify{
        text-align: justify;
    }
    blockquote{
        font-size: 105%;
        margin-bottom: 20px;
    }
    ul{
        margin-bottom: 15px;
        padding-left: 1.5em;
        
        li{
            position: relative;
            padding-left: 1.5em;
            padding-bottom: 10px;
        }
        li::before {
            content: '\2022';
            display: inline-block;
            white-space: nowrap;
            width: 1.2em;
            position: absolute;
            left: 0;
        }
    }
    ol{
        margin-bottom: 15px;
        padding-left: 30px;
        
        li{
            position: relative;
            padding-bottom: 10px;
            padding-left: 0px !important;
        }
        li::before {
            display: inline-block;
            white-space: nowrap;
            width: 1.2em;
            position: absolute;
            left: 0;
        }
    }
}