﻿button,
input[type=button],
input[type=submit] {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    background-color: #444445;
    border: none;
    border-bottom: 1px solid #444445;
    border-radius: 2px;
    border-top: 1px solid #777778;
    box-shadow: none;
    color: #ffffff;
    font-family: "Exo 2", sans-serif;
    font-size: 13px;
    height: 32px;
    padding: 0 10px;
    text-transform: uppercase;
    width: auto;
}

button.default,
input[type=button].default,
input[type=submit].default {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    background-color: #e7e7e3;
    border: none;
    border-bottom: 1px solid #d1d1ca;
    border-radius: 2px;
    border-top: 1px solid #E7E7E3;
    box-shadow: none;
    color: #000000;
    height: 32px;
    padding: 0 10px;
    text-transform: uppercase;
    width: auto;
}

button.default:hover,
input[type=button].default:hover,
input[type=submit].default:hover {
    background-color: #DCDCD5;
    border-bottom-color: #c7c7bd;
    border-top-color: #DCDCD5;
}

button.default:active,
input[type=button].default:active,
input[type=submit].default:active {
    background-color: #9CA270;
    border-bottom-color: #C7CAAE;
    border-top-color: #9CA270;
    color: #f8f8f5;
}

button.default:disabled,
input[type=button].default:disabled,
input[type=submit].default:disabled {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    color: #CCCCCC;
}

button.size48,
input[type=button].size48,
input[type=submit].size48 {
    border-right: 4px;
    font-size: 14px;
    height: 48px;
}

button.size72,
input[type=button].size72,
input[type=submit].size72 {
    border-bottom-width: 2px;
    border-radius: 4px;
    border-right: 4px;
    border-top-width: 2px;
    font-size: 20px;
    height: 72px;
}

button.primary.size72,
input[type=button].primary.size72,
input[type=submit].primary.size72 {
    border-bottom-width: 2px;
    border-radius: 4px;
    border-top-width: 2px;
    font-size: 32px;
}

button.primary.size112,
input[type=button].primary.size112,
input[type=submit].primary.size112 {
    border-bottom-width: 2px;
    border-radius: 4px;
    border-top-width: 2px;
    font-size: 66px;
    height: 112px;
}

button:hover,
input[type=button]:hover,
input[type=submit]:hover {
    background-color: #515151;
    border-bottom-color: #515151;
    border-top-color: #8D8D8D;
}

button:active,
input[type=button]:active,
input[type=submit]:active {
    background-color: #9CA270;
    border-bottom-color: #C7CAAE;
    border-top-color: #9CA270;
    /*padding-top: 1px; bug_278 */
}

button.danger,
input[type=button].danger,
input[type=submit].danger {
    background-color: #BC5454;
    border-bottom-color: #BC5454;
    border-top-color: #D38F8F;
}

button.danger:hover,
input[type=button].danger:hover,
input[type=submit].danger:hover {
    background-color: #C56C6C;
    border-bottom-color: #C56C6C;
    border-top-color: #D99F9F;
}

button.danger:active,
input[type=button].danger:active,
input[type=submit].danger:active {
    background-color: #C56C6C;
    border-bottom-color: #D99F9F;
    border-top-color: #C56C6C;
}

button.warning,
input[type=button].warning,
input[type=submit].warning {
    background-color: #AA8240;
    border-bottom-color: #AA8240;
    border-top-color: #C7AD82;
}

button.warning:hover,
input[type=button].warning:hover,
input[type=submit].warning:hover {
    background-color: #B6945B;
    border-bottom-color: #B6945B;
    border-top-color: #CFB894;
}

button.warning:active,
input[type=button].warning:active,
input[type=submit].warning:active {
    background-color: #B6945B;
    border-bottom-color: #CFB894;
    border-top-color: #B6945B;
}

button.primary,
input[type=button].primary,
input[type=submit].primary {
    background-color: #9CA270;
    border-bottom-color: #9CA270;
    border-top-color: #BEC2A1;
}

button.primary:hover,
input[type=button].primary:hover,
input[type=submit].primary:hover {
    background-color: #AAAF84;
    border-bottom-color: #AAAF84;
    border-top-color: #C7CAAE;
}

button.primary:active,
input[type=button].primary:active,
input[type=submit].primary:active {
    background-color: #9CA270;
    border-bottom-color: #BEC2A1;
    border-top-color: #9CA270;
}

button.send-email {
    background-image: url('/Images/icons/common/mailicon.svg');
    background-position: 8px 50%;
    background-repeat: no-repeat;
    padding-left: 40px;
}

button.go_back {
    background-image: url('/Images/icons/navigation/back_button.svg');
    background-position: 8px 50%;
    background-repeat: no-repeat;
    margin-top: 15px;
    padding-left: 40px;
    text-transform: uppercase;
}

button.pay_for_reservation {
    background-image: url('/Images/icons/payment/paymenticon.svg');
    background-position: 8px 50%;
    background-repeat: no-repeat;
    margin-top: 15px;
    padding-left: 40px;
    text-transform: uppercase;
}

button.pay_print {
    background: #444445 url('/Images/icons/common/print.svg') no-repeat 6px 2px;
    background-position: 8px 50%;
    background-repeat: no-repeat;
    margin-top: 15px;
    padding-left: 40px;
    text-transform: uppercase;
}

div.button-group {
    display: inline-block;
    white-space: nowrap;
}

div.button-group button,
div.button-group input[type=button],
div.button-group input[type=submit] {
    border-radius: 0;
    border-right: 1px solid #6C6C6D;
    display: inline-block;
}

div.button-group button:first-child,
div.button-group input[type=button]:first-child,
div.button-group input[type=submit]:first-child {
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
}

div.button-group button:last-child,
div.button-group input[type=button]:last-child,
div.button-group input[type=submit]:last-child {
    border-bottom-right-radius: 2px;
    border-right: none;
    border-top-right-radius: 2px;
}

div.button-group button.selected,
div.button-group input[type=button].selected,
div.button-group input[type=submit].selected {
    background-color: #9CA270;
    border-color: #9CA270;
}

div.dropdown-group.disabled span,
div.dropdown-group.disabled span:hover,
div.dropdown-group.disabled span:active,
button:disabled,
button:disabled:hover,
input[type=button]:disabled,
input[type=button]:disabled:hover,
input[type=submit]:disabled,
input[type=submit]:disabled:hover {
    background-color: #363637;
    border: 1px solid #565656;
    color: #7A7A7B;
    cursor: default;
}

div.dropdown-group span {
    -moz-box-shadow: none;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -webkit-box-shadow: none;
    background-color: #444445;
    border: none;
    border-radius: 2px;
    border-top: 1px solid #777778;
    box-shadow: none;
    cursor: pointer;
    display: block;
    height: 32px;
    overflow: hidden;
    padding: 4px 35px 4px 10px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
}

div.dropdown-group span:after {
    background: url('/Images/dropdown_arrow.png') no-repeat 50% 50%;
    border-left: 1px solid #6D6D6E;
    content: "";
    display: inline-block;
    height: 24px;
    padding: 3px 0;
    position: absolute;
    right: 15px;
    width: 30px;
}

div.dropdown-group.disabled span:after {
    background: url('/Images/dropdown_arrow_disabled.png') no-repeat 50% 50%;
    border-left: 1px solid #565656;
}

div.dropdown-group span:hover {
    background-color: #515151;
    border-top: 1px solid #8D8D8D;
}

div.dropdown-group.focus span,
div.dropdown-group span:active { border-top: 1px solid #9CA270; }

div.dropdown-group.right ul { left: auto; }

div.dropdown-group ul {
    margin-top: 3px;
    min-width: 150px;
}

div.dropdown-group ul li:first-child {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}

.split-button-wrapper ul {
    padding-left: 0;
    margin-bottom: 0;
}
.split-button-wrapper li {
    list-style-type: none;
}
.split-button-wrapper {
    display: flex;
    position: relative;
}
.split-button-wrapper .buttons-list button {
    /*width: 100%;*/
    border-radius: 2px 0 0 2px;
}
.split-button-wrapper .buttons-list .button-wrapper {
    display: none;
}

.split-button-wrapper .buttons-list .button-wrapper.selected {
    display: block;
}
.split-buttons-toggle {
    padding: 0;
    border-radius: 0 2px 2px 0;
}
.split-buttons-toggle:before {
    content: '';
    display: block;
    background-image: url('/Images/icons/common/dropdownicon.svg');
    background-repeat: no-repeat;
    background-position: center center;
    width: 30px;
    height: 30px;
    transition: 0.3s;
    /*margin-left: 57px;*/
}
.split-buttons-toggle.active {
    background-color: #9CA270;
    border-bottom-color: #9CA270;
    border-top-color: #C7CAAE;
}
.split-buttons-toggle.active:before {
    transform: rotate(-180deg);
}
.split-button-wrapper {
    height: 32px;
    /*overflow: hidden;*/  
}
.split-button-wrapper .button-list-wrapper {
    /*z-index: 2;*/
}
.split-button-wrapper .buttons-list {
    /*position: absolute;*/
}
.split-button-wrapper.open-list .button-list-wrapper,
.split-button-wrapper.open-list .split-buttons-toggle {
    z-index: 21;
}
.split-button-wrapper.open-list .buttons-toggles-wrapper {
    /*display: block;*/
    z-index: 20;
    opacity: 1;
    top: 35px;
}
.split-button-wrapper .buttons-toggles-wrapper {
    overflow: hidden;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    /*display: none;*/
    background-color: #272728;
    border-radius: 2px;
    transition: 0.3s;
    opacity: 0;
}
.split-button-wrapper .button-toggle {
    padding: 3px;
    cursor: pointer;
    padding-right: 20px;
}
    .split-button-wrapper .button-toggle:hover {
        background-color: #9CA270;
    }

.auto-height-button {
    height: auto;
    padding-top: 5px;
    padding-bottom: 5px;

}


.actions {
    display: flex;
    flex: 1;
    flex-direction: row-reverse;
}

    .actions button {
        width: 100%;
        max-width: 150px;
        margin-left: 10px;
    }

.actions.actions-left {
    justify-content: flex-end;
}

    .actions.actions-left button:last-child {
        margin-left: 0;
    }