@import "../styles/base/fn.wxss";

.@{wuxClassNamePrefix}-toptips {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5000;

    &__content {
        padding: 5px;
        font-size: 14px;
        color: #FFFFFF;
        word-wrap: break-word;
        word-break: break-all;
        transition: background-color .3s;

        text {
            display: block;
            text-align: center;
            padding: 0 26px;
        }

        &--success {
            background-color: @balanced;
        }

        &--info {
            background-color: @positive;
        }

        &--warn {
            background-color: @energized;
        }

        &--cancel {
            background-color: @assertive;
        }
    }

    &__icon {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
    }
}