/* Copyright (C) 2016 NooBaa */

delete-button {
    display: block;
    position: relative;

    .message-wrapper {
        direction: rtl;
        display: block;
        overflow-x: hidden;
        position: absolute;
        top: 0;
        right: 0;
        background-color: rgb(var(--color05));
        max-width: 0;
        box-shadow: 0px 2px 4px rgba(var(--shadow2));
        transition: max-width 200ms ease-in-out;

    }

    .message-text {
        white-space: nowrap;
        display: block;
        padding-right: 24px + 2 * @gutter;
        padding-left: @gutter;
        line-height: 44px;
    }

    .btn {
        position: relative;
        background: red;
    }

    .icon-btn:focus > svg-icon {
        fill: rgb(var(--color20));
    }

    .active {
        .message-wrapper {
            max-width: 300px;
        }
    }
}
