.oe_form_field_html_text {
    .note-editable {
        min-height: 180px;
        font: initial !important;
        font-family: inherit !important;
        line-height: initial !important;
        color: initial !important;
        p, div {
            font-family: 'Lucida Grande', Helvetica, Verdana, Arial, sans-serif;
            font-size: 13px;
        }
        a, a:hover {
            color: initial;
        }
        ul > li > p {
            margin: 0px;
        }
    }
    .o_readonly {
        min-height: 1em;
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        word-wrap: break-word;
        ul > li > p {
            margin: 0px;
        }
    }
}
.oe_form_field_html iframe {
    display: block;
    width: 100%;
    border: 0;
    padding: 0;
    margin: 0;
    min-height: 300px;
    min-height: -webkit-calc(100vh - 170px);
    min-height: calc(100vh - 170px);
}
.o_field_widgetTextHtml_fullscreen {
    .oe_form_field_html.o_form_fullscreen_ancestor iframe {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        min-height: 100% !important;
        z-index: 1001 !important;
        border: 0;
    }
    * {
        display: none;
    }
    .o_form_fullscreen_ancestor {
        display: block !important;
        position: static !important;
        top: 0 !important;
        left: 0 !important;
        width: auto !important;
        overflow: hidden !important;
        transform: none !important;
    }
}

.openerp .oe_form .oe_form_field_html_translate textarea {
    min-width: 60px;
    width: 100%;
    color: #4c4c4c;
    font: normal 13px "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;
}
.openerp .oe_form_readonly .oe_form .oe_form_field_html_translate textarea {
    border: 0;
    background: #fff;
}
.openerp .oe_form_editable .oe_form .oe_form_field_html_translate {
    > button {
        float: right;
        margin: -6px -3px 0 0;
    }
    > .note-editable {
        border: 1px solid #ccc;
        min-height: 22px;
        border-radius: 3px;
    }
    .note-editable [contentEditable='true']:hover {
        box-shadow: #DDCC33 0 0 5px 2px inset;
    }
}

// FIX (to improve in next versions)
// ---------------------------------
// The web_editor.colorpicker defines a series of color buttons which toggle the bg-* and text-* classes.
// The problem is that themes can define new buttons whose bg-* and text-* classes only exist in the frontend.
// So these buttons should not be displayed in the backend. Only solution for the current implementation is
// to add this ugly rule (in this backend file) which hides every button and redisplayed the default ones.
.note-editor {
    .colorpicker .o_colorpicker_section > button {
        display: none;

        &[data-color="alpha"], &[data-color="beta"], &[data-color="gamma"], &[data-color="delta"], &[data-color="epsilon"],
        &[data-color="white"], &[data-color="gray-lighter"], &[data-color="gray-light"], &[data-color="gray"], &[data-color="gray-dark"], &[data-color="gray-darker"], &[data-color="black"],
        &[data-color="primary"], &[data-color="success"], &[data-color="info"], &[data-color="warning"], &[data-color="danger"] {
            display: block;
        }
    }
}