/********************/
/*TEXT BUTTON LAYOUT*/
/********************/
.phoenix-button,
.phoenix-button.k-button {
    width: auto;
    height: 3rem;
    box-shadow: none;
    border-radius: 3px;
    font-weight: 500;
    text-transform: none;
    border: none;
    font-size: 1.6rem;
    line-height: 2rem;
    padding: 0 8px;
    margin: 0;
    align-items: center;
    display: inline-flex;
    vertical-align: middle;
    flex: 0 0 auto;
    background-color: unset;
    cursor: pointer;
    opacity: 1;
    white-space: nowrap;
}

.phoenix-button.k-button.k-state-active:hover,
.phoenix-button.k-button.k-state-selected:hover {
    color: inherit;
    border-color: inherit;
    background-color: inherit;
}
    
/************************/
/*STANDARD BUTTON - TEXT*/
/************************/
.phoenix-button.k-button.k-primary,
.phoenix-button.k-primary {
    color: var(--btn-font);
    background-color: var(--btn-active-background);
}

.phoenix-button.k-button.k-primary:hover,
.phoenix-button.k-primary:hover {
    color: var(--btn-font);
    background-color: var(--btn-hover-background);
    box-shadow: none;
    border: none;
}

.phoenix-button.k-button.k-primary.k-state-disabled,
.phoenix-button.k-primary.k-state-disabled,
.phoenix-button:disabled,
.phoenix-button:disabled:hover {
    color: var(--btn-font);
    background-color: var(--btn-inactive-background);
    cursor: default;
}

/*Override Kendo-Style*/
.k-button.k-primary:focus:active:not(.k-state-disabled):not([disabled]) {
    box-shadow: none;
}

/****************************************/
/*SPECIAL BUTTON PRIMARY - TEXT AND ICON*/
/****************************************/
button.phoenix-button.k-button.k-special-primary,
button.phoenix-button.k-special-primary {
    color: var(--btn-special-primary-font);
    background-color: var(--btn-special-primary-active-background);
    padding-left: 10px;
}

button.phoenix-button.k-button.k-special-primary span,
button.phoenix-button.k-special-primary span {
    background-color: var(--glyphicon-btn-special-primary);
}

button.phoenix-button.k-button.k-special-primary:hover,
button.phoenix-button.k-special-primary:hover {
    color: var(--btn-special-primary-font);
    background-color: var(--btn-special-primary-hover-background);
    box-shadow: none;
}

button.phoenix-button.k-button.k-special-primary.k-state-disabled,
button.phoenix-button.k-special-primary.k-state-disabled {
    background-color: var(--btn-special-primary-inactive-background);
}

/***************************************/
/*SPECIAL BUTTON ACCENT - TEXT AND ICON*/
/***************************************/
button.phoenix-button.k-button.k-special-accent,
button.phoenix-button.k-special-accent {
    color: var(--btn-special-accent-font);
    background-color: var(--btn-special-accent-active-background);
    /*padding-left: 10px;*/
}

button.phoenix-button.k-button.k-special-accent span.glyphicons,
button.phoenix-button.k-special-accent span.glyphicons,
button.phoenix-button.k-button.k-special-accent span.k-icon,
button.phoenix-button.k-special-accent span.k-icon {
    background-color: var(--glyphicon-btn-special-accent);
}

button.phoenix-button.k-button.k-special-accent:hover,
button.phoenix-button.k-special-accent:hover {
    color: var(--btn-special-accent-font);
    background-color: var(--btn-special-accent-hover-background);
    box-shadow: none;
}

button.phoenix-button.k-button.k-special-accent.k-state-disabled,
button.phoenix-button.k-special-accent.k-state-disabled {
    background-color: var(--btn-special-accent-inactive-background);
}

/**********************/
/*BUTTON GROUP BUTTONS*/
/**********************/
.phoenix-button-group,
.k-button-group,
.phoenix-button-group.k-button-group {
    background: unset;
}

.k-button-group .k-button,
.phoenix-button-group.k-button-group .k-button.phoenix-button,
.phoenix-button-group.k-button-group .k-button,
.phoenix-button-group.k-button-group .k-button.k-state-active,
.k-button-group .k-button.k-state-active {
    height: 3rem;
    box-shadow: none;
    border-radius: 3px;
    font-weight: 500;
    text-transform: none;
    border: none;
    font-size: 1.6rem;
    line-height: 2rem;
    padding: 8px 14px;
    margin: 0;
    align-items: center;
    display: inline-flex;
    vertical-align: middle;
    flex: 0 0 auto;
    cursor: pointer;
    opacity: 1;
    color: var(--btn-font);
    background-color: var(--btn-active-background);
    margin-right: 5px;
}

.phoenix-button-group.k-button-group .k-button.phoenix-button.k-button-icontext {
    padding-left: 3px;
}

.phoenix-button-group.k-button-group .k-button.k-state-active:not(.icon-only-button):hover,
.k-button-group .k-button.k-state-active:not(.icon-only-button):hover {
    background-color: var(--btn-hover-background);
    box-shadow: none;
    color: var(--btn-font);
    border: none;
}

.phoenix-button-group.k-button-group .k-button.k-state-disabled,
.k-button-group .k-button.k-state-disabled {
    background-color: var(--btn-inactive-background);
    box-shadow: none;
    color: var(--btn-font);
    border: none;
    cursor: default;
}

.phoenix-button-group.k-button-group .k-button,
.k-button-group {
    height: 3rem;
    box-shadow: none;
    border-radius: 3px;
    border: none;
    font-weight: 500;
    text-transform: none;
    font-size: 1.6rem;
    line-height: 2rem;
    padding: 8px 14px;
    margin: 0;
    align-items: center;
    display: inline-flex;
    vertical-align: middle;
    flex: 0 0 auto;
    cursor: pointer;
    opacity: 1;
    color: var(--btn-font);
    background-color: var(--btn-hover-background);
    margin-right: 5px;
}

/****************************/
/*DIALOG BUTTON GROUP BUTTONS*/
/****************************/
.k-dialog .k-dialog-buttongroup.k-justify-content-stretch {
    background-color: var(--footer-background);
    padding: 0 10px 0 10px;
    height: 4rem;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: min-content;
    grid-column-gap: 10px;
    justify-items: end;
    align-items: center;
    justify-content: end;
    border: none;
    border-radius: 0 0 2px 2px;
}

.k-dialog .k-dialog-buttongroup.k-justify-content-stretch .k-button {
    background-color: var(--btn-active-background);
    color: var(--btn-font);
    text-transform: none;
    border: none;
    border-radius: 3px;
    height: 30px;
    align-items: center;
    display: inline-flex;
    vertical-align: middle;
    padding: 8px 14px;
    opacity: 1;
    font-weight: 500;
    cursor: pointer;
}

.k-dialog .k-dialog-buttongroup.k-justify-content-stretch .k-button:hover {
    background-color: var(--btn-hover-background);
    box-shadow: none;
}

.k-dialog .k-dialog-buttongroup.k-justify-content-stretch .k-button:disabled {
    background-color: var(--btn-inactive-background);
    cursor: default;
}

/******************/
/*ICON ONLY BUTTON*/
/******************/
.phoenix-button-group.k-button-group .icon-only-button.k-button,
.phoenix-button-group.k-button-group .icon-only-button,
.icon-only-button.k-button,
.icon-only-button {
    border: none;
    padding: 0;
    margin: 0;
    font-size: large;
    height: 32px;
    width: 32px;
    text-decoration: none;
    text-decoration-color: transparent;
    border-radius: 0;
    opacity: 1;
    flex: 0 0 auto;
    cursor: pointer;
    min-width: 32px !important;
}

.phoenix-button-group.k-button-group .icon-only-button.k-button.sub-menu,
.phoenix-button-group.k-button-group .icon-only-button.sub-menu,
.icon-only-button.k-button.sub-menu,
.icon-only-button.sub-menu {
    height: 30px;
    width: 30px;
}

.phoenix-button-group.k-button-group .icon-only-button.k-button:active,
.phoenix-button-group.k-button-group .icon-only-button:active,
.phoenix-button-group.k-button-group .k-button .k-icon:active,
.icon-only-button.k-button:active,
.icon-only-button:active,
.k-button .k-icon:active {
    background: inherit;
}

.phoenix-button-group.k-button-group .icon-only-button.k-button:focus,
.phoenix-button-group.k-button-group .k-button:focus,
.phoenix-button-group.k-button-group .icon-only-button:focus,
.phoenix-button-group.k-button-group .icon-only-button.k-button:focus:active,
.phoenix-button-group.k-button-group .icon-only-button:focus:active,
.phoenix-button-group.k-button-group .k-button .k-icon:focus:active,
.phoenix-button-group.k-button-group .icon-only-button.k-button:focus:hover,
.phoenix-button-group.k-button-group .icon-only-button:focus:hover,
.phoenix-button-group.k-button-group .k-button .k-icon:focus:hover,
.icon-only-button.k-button:focus,
.k-button:focus,
.icon-only-button:focus,
.icon-only-button.k-button:focus:active,
.icon-only-button:focus:active,
.k-button .k-icon:focus:active,
.icon-only-button.k-button:focus:hover,
.icon-only-button:focus:hover,
.k-button .k-icon:focus:hover {
    box-shadow: none;
}

.phoenix-button-group.k-button-group .icon-only-button.k-button span,
.phoenix-button-group.k-button-group .icon-only-button span,
.icon-only-button.k-button span,
.icon-only-button span {
    background-color: var(--glyphicon-btn-active);
}

.phoenix-button-group.k-button-group icon-only-button.k-state-disabled span,
.phoenix-button-group.k-button-group .k-button.k-state-disabled span,
.phoenix-button-group.k-button-group span.glyphicons.btn-inactive,
.phoenix-button-group.k-button-group .icon-only-button.k-button.k-state-disabled span:hover,
.phoenix-button-group.k-button-group .icon-only-button.k-state-disabled span:hover,
.phoenix-button-group.k-button-group .k-button.k-state-disabled span:hover,
.phoenix-button-group.k-button-group span.glyphicons.btn-inactive:hover,
.icon-only-button.k-button.k-state-disabled span,
.icon-only-button.k-state-disabled span,
.k-button.k-state-disabled span,
span.glyphicons.btn-inactive,
.icon-only-button.k-button.k-state-disabled span:hover,
.icon-only-button.k-state-disabled span:hover,
.k-button.k-state-disabled span:hover,
span.glyphicons.btn-inactive:hover {
    background-color: var(--glyphicon-btn-inactive);
    cursor: default;
}

.phoenix-button-group.k-button-group .icon-only-button.k-button:hover span,
.phoenix-button-group.k-button-group .icon-only-button:hover span,
.icon-only-button.k-button:hover span,
.icon-only-button:hover span {
    background-color: var(--glyphicon-btn-hover);
}

/************************/
/*ICON ONLY BUTTON LARGE*/
/************************/
.icon-only-button-large.k-button,
.icon-only-button-large {
    background: inherit;
    border: none;
    padding: 0;
    margin: 0;
    font-size: larger;
    width: 36px;
    height: 36px;
    text-decoration: none;
    text-decoration-color: transparent;
    border-radius: 0;
    opacity: 1;
    cursor: pointer;
}

.icon-only-button-large.k-button:active,
.icon-only-button-large:active {
    background: inherit;
}

.icon-only-button-large.k-button:focus:active,
.icon-only-button-large:focus:active,
.icon-only-button-large.k-button:focus:hover,
.icon-only-button-large:focus:hover {
    box-shadow: none;
}

.icon-only-button-large.k-button span,
.icon-only-button-large span {
    background-color: var(--glyphicon-btn-active);
}

.icon-only-button-large.k-button.k-state-disabled span,
.icon-only-button-large.k-state-disabled span,
.k-button.k-state-disabled span {
    background-color: var(--glyphicon-btn-inactive);
    cursor: default;
}

.icon-only-button-large.k-button:hover span,
.icon-only-button-large:hover span {
    background-color: var(--glyphicon-btn-hover);
}

/******************************************************/
/*ICON ONLY BUTTON KENDO (USED CLOSE BUTTON IN TABS)*/
/******************************************************/
.icon-only-button-kendo.k-button {
    background: inherit;
    font-size: 1.8rem;
    overflow: visible;
    opacity: 1;
    width: 30px;
    box-shadow: none;
    padding: 0;
    cursor: pointer;
}

.unselected .icon-only-button-kendo.k-button.k-button-icon {
    color: var(--tab-inactive-font);
}

.selected .icon-only-button-kendo.k-button.k-button-icon {
    color: var(--tab-active-font);
}

/****************/
/*No Hovereffect*/
/****************/
.k-button,
.k-button:hover {
    background-color: inherit;
    box-shadow: none;
    color: unset;
}

.k-state-disabled .k-button-icon .k-icon,
.k-state-disabled.k-button-icon .k-icon {
    opacity: 1;
}

/*********************/
/*No Background-color*/
/*********************/
.k-button.k-state-disabled,
.k-button.k-state-disabled:active,
.k-button.k-state-disabled:focus,
.k-button.k-state-disabled:hover,
.k-button[disabled],
.k-button[disabled]:active,
.k-button[disabled]:focus,
.k-button[disabled]:hover,
.k-state-disabled .k-button,
.k-state-disabled .k-button:active,
.k-state-disabled .k-button:focus,
.k-state-disabled .k-button:hover {
    background-color: inherit;
}