markdown-area {
    display: block;
    .editor-toolbar {
        display:flex;
        gap: var(--margin-xs);
        padding: var(--margin-xs);
        opacity: 1;
        &:hover {
            opacity: 1;
        }
        a {
            display: inline-flex;
            text-align: center;
            text-decoration: none !important;
            color: var(--neutral-color-3);
            margin: 0;
            border: 1.5px solid transparent;
            border-radius: 3px;
            cursor: pointer;
            justify-content: center;
            align-items: center;
            box-sizing: border-box;
            width: 3.5ch;
            height: 3.5ch;
            &.active {
                color: var(--neutral-color-5);
            }
        }
    }
}

markdown-area[aria-disabled="true"], markdown-area[aria-disabled="true"] .CodeMirror {
    pointer-events: none;
}

markdown-area .editor-toolbar .fa:before{
    font-family: "Material Design Icons";
    font-size: 1.5em;
    font-weight: normal;
}

markdown-area .editor-toolbar .fa-bold:before {
    content: "\F0264";
}
markdown-area .editor-toolbar .fa-italic:before {
    content: "\F0277";
}
markdown-area .editor-toolbar .fa-header:before {
    content: "\F026B";
}
markdown-area .editor-toolbar .fa-quote-left:before {
    content: "\F11A7";
}
markdown-area .editor-toolbar .fa-list-ul:before {
    content: "\F0279";
}
markdown-area .editor-toolbar .fa-list-ol:before {
    content: "\F027B";
}
markdown-area .editor-toolbar .fa-link:before {
    content: "\F0337";
}

markdown-area .editor-toolbar .fa-picture-o:before {
    content: "\F02EB";
}
markdown-area .editor-toolbar .fa-eye:before {
    content: "\F06D0";
}
markdown-area .editor-toolbar .fa-columns:before {
    content: "\F08DF";
}
markdown-area .editor-toolbar .fa-arrows-alt:before {
    content: "\F0293";
}
markdown-area .editor-toolbar .fa-question-circle:before {
    content: "\F02D7";
}