.ghostkit-button-wrapper {
    --gkt-button__gap: 15px;
    --gkt-button__gap-vertical: var(--gkt-button__gap);
    --gkt-button__align-items: flex-start;
    --gkt-button__justify-content: flex-start
}

.ghostkit-button {
    --gkt-button__padding-v: 0.75em;
    --gkt-button__padding-h: 1em;
    --gkt-button__line-height: 1em;
    --gkt-button__color: #fff;
    --gkt-button__background-color: var(--gkt-color-primary);
    --gkt-button__border-width: 0%;
    --gkt-button__border-color: var(--gkt-color-primary);
    --gkt-button__border-radius: var(--gkt-border-radius);
    --gkt-button__outline: none;
    --gkt-button__box-shadow: none;
    --gkt-button-hover__color: #fff;
    --gkt-button-hover__background-color: var(--gkt-color-dark-gray);
    --gkt-button-hover__border-width: var(--gkt-button__border-width);
    --gkt-button-hover__border-color: var(--gkt-button__border-color);
    --gkt-button-hover__box-shadow: var(--gkt-button__box-shadow);
    --gkt-button-focus__color: var(--gkt-button-hover__color);
    --gkt-button-focus__background-color: var(--gkt-button-hover__background-color);
    --gkt-button-focus__border-width: var(--gkt-button-hover__border-width);
    --gkt-button-focus__border-color: var(--gkt-button-hover__border-color);
    --gkt-button-focus__box-shadow: var(--gkt-button-hover__box-shadow);
    --gkt-button-xs__font-size: 0.8em;
    --gkt-button-sm__font-size: 0.85em;
    --gkt-button__font-size: 1em;
    --gkt-button-lg__font-size: 1.15em;
    --gkt-button-xl__font-size: 1.3em;
    --gkt-button-icon-only__padding-v: var(--gkt-button__padding-v);
    --gkt-button-icon-only__padding-h: var(--gkt-button__padding-v);
    --gkt-button--icon__offset: 10px;
    --gkt-button__transition-duration: var(--gkt-transition-duration);
    --gkt-button__transition-easing: var(--gkt-transition-easing)
}

.ghostkit-button-wrapper-inner {
    align-items: var(--gkt-button__align-items);
    clear: both;
    -moz-column-gap: var(--gkt-button__gap);
    column-gap: var(--gkt-button__gap);
    display: flex;
    flex-wrap: wrap;
    justify-content: var(--gkt-button__justify-content);
    row-gap: var(--gkt-button__gap-vertical)
}

.ghostkit-button {
    align-items: center;
    background-color: var(--gkt-button__background-color);
    border: var(--gkt-button__border-width) solid var(--gkt-button__border-color);
    border-radius: var(--gkt-button__border-radius);
    box-shadow: var(--gkt-button__box-shadow);
    color: var(--gkt-button__color);
    cursor: pointer;
    display: inline-flex;
    font-size: var(--gkt-button__font-size);
    justify-content: center;
    line-height: var(--gkt-button__line-height);
    margin: 0;
    outline: var(--gkt-button__outline);
    padding: var(--gkt-button__padding-v) var(--gkt-button__padding-h);
    text-align: center;
    text-decoration: none !important;
    transition: var(--gkt-button__transition-duration) background-color var(--gkt-button__transition-easing), var(--gkt-button__transition-duration) color var(--gkt-button__transition-easing), var(--gkt-button__transition-duration) border-color var(--gkt-button__transition-easing), var(--gkt-button__transition-duration) opacity var(--gkt-button__transition-easing), var(--gkt-button__transition-duration) box-shadow var(--gkt-button__transition-easing);
    white-space: nowrap
}

.ghostkit-button:hover {
    background-color: var(--gkt-button-hover__background-color);
    border: var(--gkt-button-hover__border-width) solid var(--gkt-button-hover__border-color);
    box-shadow: var(--gkt-button-hover__box-shadow);
    color: var(--gkt-button-hover__color)
}

.ghostkit-button:active,
.ghostkit-button:focus {
    background-color: var(--gkt-button-focus__background-color);
    border: var(--gkt-button-focus__border-width) solid var(--gkt-button-focus__border-color);
    box-shadow: var(--gkt-button-focus__box-shadow);
    color: var(--gkt-button-focus__color)
}

.ghostkit-button-icon-left {
    margin-right: var(--gkt-button--icon__offset)
}

.ghostkit-button-icon-right {
    margin-left: var(--gkt-button--icon__offset);
    order: 2
}

.ghostkit-button-icon-only {
    padding: var(--gkt-button-icon-only__padding-v) var(--gkt-button-icon-only__padding-h)
}

.ghostkit-button-icon-only .ghostkit-button-icon {
    margin: 0
}

.ghostkit-button-xs {
    font-size: var(--gkt-button-xs__font-size)
}

.ghostkit-button-sm {
    font-size: var(--gkt-button-sm__font-size)
}

.ghostkit-button-lg {
    font-size: var(--gkt-button-lg__font-size)
}

.ghostkit-button-xl {
    font-size: var(--gkt-button-xl__font-size)
}

.ghostkit-button-wrapper-align-left {
    --gkt-button__justify-content: flex-start
}

.ghostkit-button-wrapper-align-right {
    --gkt-button__justify-content: flex-end
}

.ghostkit-button-wrapper-align-center {
    --gkt-button__justify-content: center
}

.ghostkit-button-wrapper-gap-no {
    --gkt-button__gap: 0%
}

.ghostkit-button-wrapper-gap-sm {
    --gkt-button__gap: 15px
}

.ghostkit-button-wrapper-gap-md {
    --gkt-button__gap: 30px
}

.ghostkit-button-wrapper-gap-lg {
    --gkt-button__gap: 45px
}