.app-button {
    background-color: var(--wm-btn-background);
    border-width: var(--wm-btn-border-width);
    border-style: var(--wm-btn-border-style);
    border-color: var(--wm-btn-border-color);
    border-radius: var(--wm-btn-radius);
    ripple-color: var(--wm-btn-ripple-color);
    box-shadow: var(--wm-btn-shadow);
    flex-direction: column;
    overflow: hidden;
    min-width: var(--wm-btn-min-width);
    min-height: var(--wm-btn-min-height);
    padding: var(--wm-btn-padding);
    cursor: var(--wm-btn-cursor);
    color: var(--wm-btn-color);
    opacity: var(--wm-btn-opacity);
}

.app-button-text {
    font-size: var(--wm-btn-font-size);
    font-family: var(--wm-btn-font-family);
    font-weight: var(--wm-btn-font-weight);
    line-height: var(--wm-btn-line-height);
    letter-spacing: var(--wm-btn-letter-spacing);
    text-transform: var(--wm-btn-text-transform);
    white-space: nowrap;
    color: var(--wm-btn-color);
}

.app-button-content {
    display: flex;
    flex-grow: 1;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    gap: var(--wm-btn-gap);
}


.app-button-icon {
    padding: var(--wm-btn-icon-padding);
}

.app-button-icon .app-icon{
    color: var(--wm-btn-icon-color);
}

.app-button-icon .app-icon-shape {
    min-width: var(--wm-btn-icon-size);
    width: var(--wm-btn-icon-size);
    height: var(--wm-btn-icon-size);
    font-size: var(--wm-btn-icon-size);
    line-height: var(--wm-btn-icon-size);
}

.app-button-skeleton {
    width: var(--wm-btn-skeleton-width);
    height: var(--wm-btn-skeleton-height);
}

.btn-block.app-button {
    width: 100%;
}

.app-button-disabled .app-button {
    color: var(--wm-btn-color);
    background-color: var(--wm-btn-background);
    border-color: var(--wm-btn-border-color);
    opacity: var(--wm-btn-opacity);
    cursor: var(--wm-btn-cursor);
    box-shadow: var(--wm-btn-shadow);
}

@import (optional) url('../variables/button.variant.less');