﻿/* zFlex/ASPxButton.css */

/* Flex Theme */
/* Common */
.dxbButton_flexTheme,
.dxucButton_Material {
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    /*margin-top: 3px;*/
    margin-right: 3px;
    transition: background-color 0.2s ease 0s;
}

/* Disabled State */
.dxbDisabled_flexTheme {
    opacity:0.5;
}

.BtnOrange.dxbDisabled_flexTheme,
.dxucButton_Material.dxucDisabled_Material {
    opacity: 1 !important;
    background-color: #F3BA7C !important;
    color: #ffffff !important;
    cursor: default;
}

.BtnGray.dxbDisabled_flexTheme {
    opacity: 1 !important;
    background-color: #E1E1E1 !important;
    color: #888888 !important;
    border: 1px solid #bbbbbb !important;
    cursor: default;
}

/* Button Orange */
.BtnOrange.dxbButton_flexTheme,
.dxucButton_Material {
    color: white;
    background-color: #f07d00;
    padding: 8px 25px 8px 25px;
}

.BtnOrange.dxbButtonHover_flexTheme,
.BtnOrange.dxbButtonHover_Material,
.dxucButton_Material:hover {
    background-color: #e46703;
}

.BtnOrange.dxbButtonPressed_flexTheme,
.BtnOrange.dxbButtonPressed_Material,
.dxucButton_Material:active {
    background-color: #c45903;
}

/* Button Gray */
.BtnGray.dxbButton_flexTheme {
    color: #373737;
    background-color: #e1e1e1;
    padding: 7px 24px 7px 24px !important;
    border: solid 1px #888888;
}

.BtnGray.dxbButtonHover_flexTheme {
    background-color: #d1d1d1;
}

.BtnGray.dxbButtonPressed_flexTheme {
    background-color: #b3b3b3;
}

/* Button Green */
.BtnGreen.dxbButton_flexTheme {
    color: white;
    background-color: #74c233;
    padding: 8px 25px 8px 25px;
}

.BtnGreen.dxbButtonHover_flexTheme {
    background-color: #5fa029;
}

.BtnGreen.dxbButtonPressed_flexTheme {
    background-color: #45761c;
}

/* Material Theme (Default skin) */
/* Common Material */
.dxbButton_Material {
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    margin-top: 3px;
    margin-right: 3px;
    transition: background-color 0.2s ease 0s;
    box-shadow: none !important;
    text-transform: none !important;
}

/* Disabled State Material (Default skin) */
.dxbDisabled_Material,
.dxucButton_Material.dxucDisabled_Material {
    opacity:0.5;
}
.dxucButton_Material.dxucDisabled_Material:hover,
.dxucButton_Material.dxucDisabled_Material:active {
    color: white;
    background-color: #f07d00;
}
.dxucButton_Material a,
.dxucButton_Material.dxucDisabled_Material a {
    color:white;
    text-decoration:none;
    outline:none;
}
/* Hide Material Ripple Container */
.dxbButton_Material .dxRippleContainer {
    display: none !important;
}

/* Button Gray Material (Default skin) */
.BtnGray.dxbButton_Material {
    color: #373737;
    background-color: #e1e1e1;
    /*padding: 7px 24px 7px 24px;*/
    border: solid 1px #888888;
}

.BtnGray.dxbButtonHover_Material {
    background-color: #d1d1d1;
}

.BtnGray.dxbButtonPressed_Material {
    background-color: #b3b3b3;
}

/* Narrow Buttons */
.BtnGray.BtnGrayNarrow {
    padding: 4px 15px 4px 15px !important;
}

.BtnOrange.BtnOrangeNarrow,
.BtnGreen.BtnGreenNarrow {
    padding: 5px 16px 5px 16px !important;
}

/* hamburger Button */
.Hamburger.dxbButton_flexTheme {
    padding: 0px 18px 0px 13px;
    margin-top: 0px;
    margin-right: 0px;
}

/* button outline styles for ST */
.dxbButtonChecked_flexTheme {
    box-shadow: 0px 0px 1px 2px #5B9DD9; /*Chrome default outline color*/
}

.dxbButtonChecked_Material {
    box-shadow: 0px 0px 1px 2px #5B9DD9 !important;
}
/* /button outline styles */

/* radiobutton button style */
.SelectableButtons.flexTheme.BtnGray,
.SelectableButtons.BtnGray.dxbButton_flexTheme {
    background-color: transparent;
    border: none;
    outline: none;
    box-shadow: none !important;
}

    .SelectableButtons.flexTheme.BtnGray img,
    .SelectableButtons.BtnGray.dxbButton_flexTheme img {
        background-position: -415px -294px;
        width: 20px;
        height: 20px;
        background-image: url(../Editors/sprite.svg);
        background-repeat: no-repeat;
    }

    .SelectableButtons.flexTheme.BtnGray.dxbButtonChecked_Material img,
    .SelectableButtons.BtnGray.dxbButton_flexTheme.dxbButtonChecked_flexTheme img {
        background-position: -415px -315px;
        width: 20px;
        height: 20px;
        background-image: url(../Editors/sprite.svg);
    }

.SelectableButtons.dxbButton_Material div.dxb {
    padding: 6px 13px 4px 0px;
    border: 1px dotted transparent;
    text-align: left;
}

.SelectableButtons.BtnGray.dxbButton_flexTheme {
    padding: 7px 24px 7px 0px !important;
}
/* disabled SelectableButtons */
.SelectableButtons.BtnGray.dxbDisabled_flexTheme {
    background-color: transparent !important;
    border: 0px solid #bbbbbb !important;
}

    .SelectableButtons.BtnGray.dxbDisabled_flexTheme img {
        background-position: -394px -294px;
        width: 20px;
        height: 20px;
        background-image: url(../Editors/sprite.svg);
        background-repeat: no-repeat;
    }

.SelectableButtons.BtnGray.dxbButton_flexTheme.dxbButtonChecked_flexTheme.dxbDisabled_flexTheme img {
    background-position: -394px -273px;
    width: 20px;
    height: 20px;
    background-image: url(../Editors/sprite.svg);
    background-repeat: no-repeat;
}
/* radiobutton button style */

/* move left/right button style */
/* move left button */
.moveLeftButton.flexTheme.BtnGray,
.moveLeftButton.BtnGray.dxbButton_flexTheme {
    background-color: transparent;
    border: none;
    outline: none;
    box-shadow: none !important;
}

    .moveLeftButton.flexTheme.BtnGray img,
    .moveLeftButton.BtnGray.dxbButton_flexTheme img {
        width: 26px;
        height: 27px;
        background-image: url(../Icons/24x24/move_left_normal_24.svg);
        background-repeat: no-repeat;
    }

    .moveLeftButton.flexTheme.BtnGray.dxbButtonChecked_Material img,
    .moveLeftButton.BtnGray.dxbButton_flexTheme.dxbButtonChecked_flexTheme img {
        width: 26px;
        height: 27px;
        background-image: url(../Icons/24x24/move_left_normal_24.svg);
    }

.moveLeftButton.dxbButton_Material div.dxb {
    padding: 6px 13px 4px 0px;
    border: 1px dotted transparent;
    text-align: left;
}

.moveLeftButton.BtnGray.dxbButton_flexTheme {
    padding: 4px 10px 4px 10px !important;
    margin-right: 0px !important;
}

/* move right button */
.moveRightButton.flexTheme.BtnGray,
.moveRightButton.BtnGray.dxbButton_flexTheme {
    background-color: transparent;
    border: none;
    outline: none;
    box-shadow: none !important;
}

    .moveRightButton.flexTheme.BtnGray img,
    .moveRightButton.BtnGray.dxbButton_flexTheme img {
        width: 26px;
        height: 27px;
        background-image: url(../Icons/24x24/move_right_normal_24.svg);
        background-repeat: no-repeat;
    }

    .moveRightButton.flexTheme.BtnGray.dxbButtonChecked_Material img,
    .moveRightButton.BtnGray.dxbButton_flexTheme.dxbButtonChecked_flexTheme img {
        width: 26px;
        height: 27px;
        background-image: url(../Icons/24x24/move_right_normal_24.svg);
    }

.moveRightButton.dxbButton_Material div.dxb {
    padding: 6px 13px 4px 0px;
    border: 1px dotted transparent;
    text-align: left;
}

.moveRightButton.BtnGray.dxbButton_flexTheme {
    padding: 4px 10px 4px 10px !important;
    margin-right: 0px !important;
}
/* /move left/right button style */

/* expand/collapse */
.flex-expand {
    color: #373737 !important;
    background-image: url(../Icons/16x16/expand_16.svg);
    width: 16px;
    height: 20px;
    color: transparent !important;
}
.flex-collapse {
    color: #373737 !important;
    background-image: url(../Icons/16x16/collapse_16.svg);
    width: 16px;
    height: 20px;
}
/* /expand/collapse */
/* show/hide */
.flex-show {
    color: #373737 !important;
    background-image: url(../Icons/24x24/show_24.svg);
    width: 28px;
    height: 25px;
}
.flex-hide {
    color: #373737 !important;
    background-image: url(../Icons/24x24/hide_24.svg);
    width: 28px;
    height: 25px;
}
/* /show/hide */

/* checkbox styles */
.dxWeb_edtCheckBoxCheckedDisabled_Material {
    background-image: url(../Icons/16x16/checkbox_disabled.svg);
    background-position: 0px 0px;
    width: 18px;
    height: 18px;
}

.dxichCellSys { /* checkbox text alignment */
    vertical-align: top;
}
/* /checkbox styles */

/* radiobutton styles */
.dxeIRBFocused_Material::after {
    display: none !important; /* disable ripple */
} 
/* /radiobutton styles */

/* grid/treelist/pivot filterBuilder popup button */
/*gary*/
.dxgvFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"],
.dxtlFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"],
.dxpgFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"] {
    color: #373737;
    background-color: #e1e1e1;
    border: solid 1px #888888;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    transition: background-color 0.2s ease 0s;
}

    .dxgvFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"].dxbButtonHover_Material,
    .dxtlFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"].dxbButtonHover_Material,
    .dxpgFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"].dxbButtonHover_Material {
        background-color: #d1d1d1;
    }

    .dxgvFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"].dxbButtonPressed_Material,
    .dxtlFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"].dxbButtonPressed_Material,
    .dxpgFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCCANCELBTN"].dxbButtonPressed_Material {
        background-color: #b3b3b3;
    }
/*orange*/
.dxgvFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"],
.dxtlFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"],
.dxpgFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"] {
    color: white;
    background-color: #f07d00;
    border: solid 1px #f07d00;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    transition: background-color 0.2s ease 0s;
}

    .dxgvFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"].dxbButtonHover_Material,
    .dxtlFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"].dxbButtonHover_Material,
    .dxpgFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"].dxbButtonHover_Material {
        background-color: #e46703;
    }

    .dxgvFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"].dxbButtonPressed_Material,
    .dxtlFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"].dxbButtonPressed_Material,
    .dxpgFilterBuilderButtonArea_Material div[ID$="DXPFCForm_FCOKBTN"].dxbButtonPressed_Material {
        background-color: #c45903;
    }
/* /grid/treelist/pivot filterBuilder popup button */

/* grid filter buttons */
/* buttons inside filter popup */
.dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_O"] { /*ok button*/
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    margin-right: 3px;
    transition: background-color 0.2s ease 0s;
    background-color: #f07d00;
    border: solid 1px #f07d00;
    color: white;
    cursor: pointer;
}
    .dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_O"]:hover {
        background-color: #e46703;
        border: solid 1px #e46703;
    }
    .dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_O"]:active {
        background-color: #c45903;
        border: solid 1px #c45903;
    }
    .dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_O"].dxbDisabled_Material {
        opacity: 1 !important;
        background-color: #F3BA7C !important;
        color: #ffffff !important;
        border: solid 1px #F3BA7C;
        cursor: default;
    }

.dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_C"] { /*cancel button*/
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto';
    font-weight: normal;
    margin-right: 3px;
    transition: background-color 0.2s ease 0s;
    color: #373737;
    background-color: #e1e1e1;
    border: solid 1px #888888;
    cursor: pointer;
}
    .dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_C"]:hover {
        background-color: #d1d1d1;
    }
    .dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_C"]:active {
        background-color: #b3b3b3;
    }
    .dxpc-footer.headerFilterPopupFooter .dxbButton_Material[ID$="_C"].dxbDisabled_Material {
        opacity: 1 !important;
        background-color: #E1E1E1 !important;
        color: #888888 !important;
        border: 1px solid #bbbbbb !important;
        cursor: default;
    }
/* popup buttons */
.dxgvControl_Material .dxpcLite_Material .headerFilterPopupFooter .dxpc-footerContent > table {
    margin: 10px 5px 10px 0px !important;
}
.headerFilterPopupFooter .dxHFBPS {
    width:20px !important;
}
/* /grid filter buttons */