@import (reference) "../../../Default/Bootstrap/variables.less";

@right-section-top-margin: @base-unit * 0.5;
@right-section-left-margin: @base-unit * 0.5;
@right-section-width: 26 * @base-unit;
@widget-listing-margin: @base-unit * 0.5;
@scrollbar-width: 1.25 * @base-unit;
@email-widget-width: 0.5 * (@right-section-width - @right-section-left-margin - @widget-listing-margin - @scrollbar-width);
@email-widget-height: 3 * @base-unit;
@header-actions-height: 3.5 * @base-unit;
@variant-selection-height: 2 * @base-unit;
@variant-selection-padding: @base-unit;
@variant-selection-size: @variant-selection-height + (2 * @variant-selection-padding);

.email-widget() {
    width: @email-widget-width;
    height: @email-widget-height;
    display: inline-block;
    float: left;
    cursor: move;
    font-family: @font-family-base !important;
    color: @color-gray-50;

    .cms-email-widget-icon {
        height: @email-widget-height;
        width: @email-widget-height;
        position: relative;
        float: left;

        img {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
    }

    .cms-email-widget-label {
        text-align: left !important;
        margin: 0;
        display: inline-block;
        line-height: @email-widget-height;
        font-size: @font-size-base;
        overflow: hidden;
        width: 8 * @base-unit;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}