/**
 * For styles that are used in more than one place throughout the application.
 *
 * 1. Buttons
 *
 */

// 1. Buttons -------------------------------------------------------------------------------------

.at-Button--success {
    .at-mixin-Button();
    .at-mixin-ButtonColor('at-color-success', 'at-color-default');

    &[disabled] {
        background: @at-color-disabled;
    }
}

.at-Button--add {
    &:extend(.at-Button--success all);
    &:before {
        content: "+";
        font-size: 20px;
    }
    border-color: transparent;
    margin-left: @at-space-2x;
}

.at-Button--info {
    .at-mixin-Button();
    .at-mixin-ButtonColor('at-color-info', 'at-color-default');
}

.at-Button--error {
    .at-mixin-Button();
    .at-mixin-ButtonColor('at-color-error', 'at-color-default');
}

.at-ButtonHollow--default {
    .at-mixin-Button();
    .at-mixin-ButtonHollow(
        'at-color-default',
        'at-color-button-border-default',
        'at-color-button-text-default'
    );
}

.at-ButtonIcon {
    padding: 4px @at-padding-button-horizontal;
    font-size: @at-font-size-body;
}

.at-Button--expand {
    width: 100%;
}