/*================================================================================
	Item Name: Stack - Responsive Admin Theme
	Version: 1.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
.input-validation-error { border-color: #e83e8c !important; }

/* Left menu background*/
.main-menu { background-image: url(../../images/left-menu-background.jpg) !important; }
    .main-menu.menu-dark .navigation { background: unset; }
        .main-menu.menu-dark .navigation > li.hover > a, .main-menu.menu-dark .navigation > li:hover > a, .main-menu.menu-dark .navigation > li.active > a { background-color: #404e67; border-left: 2px solid #00B5B8; }
    .main-menu .main-menu-content { opacity: 0.95; background-image: linear-gradient(45deg,#1a2a6c,#404E67) !important; }
/**/

/* Profile image */
.img-wrap { position: relative; display: inline-block; border: 1px solid #ccd6e6; font-size: 0; height: 80px; width: 80px; overflow: hidden; /*border-radius: 50%; for circle*/ }
    .img-wrap img { height: 100%; width: 100%; }

    .img-wrap .close { position: absolute; top: 2px; right: 2px; /*top: 7px;
        right: 12px; for circle*/ z-index: 100; background-color: #FFF; padding: 3px 2px 5px; color: #000; font-weight: bold; cursor: pointer; opacity: .2; text-align: center; font-size: 22px; line-height: 10px; border-radius: 50%; }
    .img-wrap:hover .close { opacity: 1; }
/**/

.mvc-grid-pager, .mvc-grid-empty-row { text-align: left !important; }
    .mvc-grid-pager .active, .mvc-grid-pager .active:focus, .mvc-grid-pager .active:hover { color: #fff !important; background-color: #00B5B8 !important; border-color: #00B5B8 !important; }
    .mvc-grid-pager button { /*position: relative;
        display: block;*/ padding: 0.5rem 0.75rem; /*margin-left: -1px;*/ line-height: 1.25; color: #00B5B8 !important; background-color: #fff !important; border: 1px solid #ddd !important; }

/**/
.grid-search { text-align: right; padding-right: 0px; margin-top: 10px; }

@media (max-width: 767.98px) {
    .header-navbar .navbar-header .navbar-brand { top: -14%; }
    .grid-search { text-align: left; padding-right: unset; padding-left: 19px; }
}
/**/

/*Grid tables css*/
.selected, .table-hover tbody tr:hover { background-color: rgba(0, 0, 0, 0.04); }

.table-hover tr { cursor: pointer; }

.exclude-cell-click { cursor: default; }
/**/

/*Form action button css*/
.form-actions button .ft-chevron-left { position: relative; top: 1px; }
/**/

/* For validation error message design */
.custom-error { font-size: 13px; color: red; }
/* End */

.error-code { font-size: 10rem; }
/**/

.card .card-content-not-selected { border: 1px solid #FF7588; }

.card-footer { padding: 0.5rem 1.5rem; }

.badge { margin-bottom: 1px; }

.overtimeTag { float: left; width: 89px; height: 27px; line-height: 27px; text-align: center; background: #fe5f00; border-radius: 2px; color: #fff; margin-left: 15px; }

.timesheet-notification { padding: 0.5rem 0 0 }

.no-timesheet-notification { text-transform: unset !important; }


.custom-control-label::before { width: 1.2rem; height: 1.2rem; top:0.115rem;}
.custom-control-label::after { width: 1.2rem; height: 1.2rem; background-size: 60% 60%; top:0.115rem; }

.legend-inner {
    float: right;
    white-space: nowrap;
}

.legend-inner-span {
    line-height: 30px;
    vertical-align: text-bottom;
    padding-right: 10px
}


@media only screen and (min-device-width: 768px) and (max-device-width: 991px) {
    .navbar-nav-custom {
        height: 56px;
        margin-right: auto;
        display: -webkit-box
    }

    .navbar-container {
        height: 56px;
    }
}

@media (min-width: 361px) {
    .navbar-nav {
        height: 56px !important;
        flex-direction: unset !important;
    }

    .main-menu-content {
        height: 100% auto !important;
    }
}

@media only screen and (max-width: 767px) {
        #HrContact {
            display: block !important;
            background-color: #404E67
        }
    }

@media only screen and (max-width: 404px) {
    #btnGridDeleteTop {
        margin: 2.5px;
    }

    #btnGridAddNewTop {
        margin:2.5px;
    }

    #gridInfo{
        margin:5px;
    }
}


.dx-header-row {
    background-color: #f7f7f7 !important;
}

.dx-header-row td {
    color: black;
}
.dx-datagrid-headers .dx-datagrid-table .dx-row > td {
    border-bottom: unset;
}
/*-------------*/
.dx-datagrid table tr.dx-data-row td {
    padding: 4px 8px 6px !important
}
.dx-datagrid table tr.dx-header-row td {
    white-space: normal !important;
}
.dx-item-content{
    display: unset !important;
}
.dx-datagrid-form-buttons-container {
    display: none;
}
.dx-datagrid-pager { border: 0px !important;}
.dx-datagrid-nowrap, .dx-datagrid-nowrap .dx-header-row > td > .dx-datagrid-text-content { white-space:normal; }
.dx-list .dx-empty-message, .dx-list-item { padding: 9px 0 8px;}

.dx-datagrid-bottom-load-panel { text-align:left;}

.dx-widget {
    font-family: "Open Sans";
    font-size:13px;
    color: #2e405c;
}
/*.dxDataGrid {
    height: calc(100vh - 140px);
}
*/