.jdgridbox {
    /* border: solid 2px #3498db; */
    border: solid 2px #eee;
    padding: 5px;
    position: relative;    
}

.jdgridwait {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    background: rgba(51,51,51,0.4);
    text-align: center;
    z-index: 200;
    padding-top: 150px;
}

.jdgridwait > div {
    font-size: 26px;
}

.jdgridwait > div i {
    color:#3498db;
}

.jdgridtoolbar {
    background: #f5f5f5;
    padding: 10px 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.jdgridtoolbar > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    flex:1;    
}

.jdgridbtns{
    justify-content: flex-start;
}
.jdgridbtns > a, .jdgridbtns > div{
    margin-right: 5px;
}

.jdgridpager{
    justify-content: center;
}

.jdgridnumpage {
    width:30px;
    text-align: center;
}

.jdgridnbpage {
    width: 50px;
    font-size: 10px;
    height: 25px;
    border: 0;
    background-color: #f6f6f6;
  }

.jdgridrecords{
    justify-content: flex-end;
    font-size: 12px;
}

.jdgridnbbypage {
    font-size: 12px;
}


.jdgridpager > div > a {
    border: solid 1px #eee;
    padding: 3px 10px;
    margin: 0 3px;
}

.jdgridpager > div > a:not(.disabled):hover {
    background-color: #ccc;
    color:#fff;
}

.jdgridpager > div > a.disabled {
    color:#bbb;
}

.jdgridtbbox {
    width: 100%;
    overflow: auto;
    /* min-height: 600px;
    height: calc(100vh - 300px); */
    /* height: calc(100vh - 300px); */  /* RULE TO REVIEW TO AUTOMAT CORRECT HEIGHT */  
}
.jdgridtb {    
    min-width: 100%;
    border-collapse: collapse;
    margin-top:10px;
    table-layout: fixed;
    background-color: #fff;
}

.jdgridtberror {
    text-align: center;
    padding: 30px;
    color: #ff0000;
    font-size: 12px;
}

.jdfixed {
  position: fixed !important;
  top: 0;
  width: 100% !important;
  z-index: 999;
}

.jdgridtb thead{
  position: sticky;
  top: 0px;
  z-index: 100;
}

.jdgridtb th, .jdgridtb td {
    border: 1px solid #f4f4f4;
    padding: 5px;
    text-align: center;
    font-size:12px;
    overflow: hidden;
    background-color: #fff;
}
.jdgridtb tr.filterrow td {
    overflow: visible;
}

.jdgridtb tbody tr:nth-child(2n+1) > td {
    background-color: #f9f9f9;
}

.jdgridtb th {
    cursor: pointer;
    position:relative;
    user-select: none; 
    -moz-user-select: none;
    -webkit-text-select: none;
    -webkit-user-select: none;
    box-shadow: inset 1px -1px 0px #f4f4f4;
}

.jdgridtb th:active {
    cursor: grabbing;
}

.jdgridtb thead li {
    text-align: left;
}

.jdgridtb tbody tr:hover td {
    background-color: #d6f0f7;
}

.jdgridtb th:hover .separator {
    display: block;
}

.jdgridtb .separator {
    display: none;
    width: 4px;
    background-color:#1bbae1;			
    cursor: col-resize;    
    height: 100%;
    position: absolute;
    top: 0;
    right: 0px;
    z-index: 1;
    opacity: 0.6;
}

.jdgridsort {
    position: absolute;
    right: 5px;
    top: 10px;
    color: #3498db;
  }

.jdthover {
    box-shadow: -1px 3px 3px #888;
    background-color: #f5f5f5 !important;
}

.jdgridbox .jdmodaltbchk .modal-dialog{
    width:400px;
}

.jdgridbox .jdmodaltbchk .modal-body, .jdgridbox .modal-jdgrid-updaterec .modal-body {
    max-height: 70vh;
    overflow-y: scroll;
}

.jdpadinp{padding:5px 20px}

.jdmodaltbchk tr, .jdmodaltbchk tr {
    cursor: pointer;
}

.jdmodaltbchk tr > td:nth-child(1) {
    width: 40px;
}

.jdgridbox .jdinpselmul {
    background-color: #fff;
    font-size: 11px;
    color: #3498db;
    cursor: pointer;
}

.jdgridtb thead td {
    position:relative;
    box-shadow: 3px 1px 2px #eee;    
}

.jdgridtb thead > td > input {
    cursor: pointer;
}

.jdgridtb thead .jdgdtrange {
    white-space: nowrap;
    cursor: pointer;
}
.jdgridtb thead .jdgdtrange span {
    font-size: 10px;
}

.jdgridtb .jdclearfilter {
    position: absolute;
    top:16px;
    right:12px;
    z-index: 95;
    opacity: 0.6;
    
}

.jdgridtb thead td > i {
    position: absolute;
    right: 14px;
    top: 19px;
    font-size: 12px;
    color: #3498db;
    cursor: pointer;
}

.jdgridtb td .label {
    display: block;
    overflow: hidden;
}

.jdgridtb thead .chosen-container-single .chosen-single div b {
    background:none;
}

.jdgridtb thead select {
    appearance: none;
    -webkit-appearance: none;
}

.daterangepicker.dropdown-menu {
    z-index: 9999;
}

.jdstrfilterbar {font-size:11px;padding:5px;line-height: 30px;}
.jdgridfilterbar {font-size:90%;color:#078aca;display: inline;}
.jdgridfilterbar .fltrline {border: dotted 1px;padding: 4px 4px;}
.jdgridfilterbar .fltrfld {background-color: #eaf4e3;padding: 2px 4px;border-radius: 3px;}
.jdgridfilterbar .fltrval {background-color: #ffffac;padding: 2px 4px;box-shadow: 2px 1px 4px #ccc;}
.jdgridfilterbar .fltrandor {margin: 0 9px;padding: 2px 4px;border-radius: 50%;background-color: #f96c6c;color: #fff;font-size: 10px;}
.jdgridfilterbar .fltropegrp {margin: 0 9px;padding: 2px;border-radius: 50%;background-color: #7b87df;color: #fff;font-size: 10px;}

/* .jdgridtbbox thead tr > th:nth-child(1), .jdgridtbbox thead tr > td:nth-child(1), .jdgridtbbox tbody tr > td:nth-child(1) { */
.jdgridfreez {    
    position: sticky !important;
    left: 0px;
    z-index: 99;    
}
.jdshadowleft {
    box-shadow: 3px 0px 1px #eee;
}

.jdgridtb thead th:hover a.jdgridfreezbt, .jdgridtb thead th.jdgridfreez a.jdgridfreezbt {
    display: block;
}
.jdgridfreezbt {
    display: none;
    font-size: 10px;
    position:absolute;
    left:5px;
    bottom:0px;
    color:#ddd;
}

.jdviewsbar {
    padding: 5px;
    border-bottom: solid 1px #eee;
    /* background-color: #f5f5f5; */
}

.jdviewsbar .jdgtoprightbtns {
    float: right;
}

.jdviewsbar > a, .jdviewsbar > div {
    margin-right: 5px;
    display: inline-block;
}
.jdviewsbar > div.jdviewsbtns{
    display: block;
    padding: 5px 0;
}

.jdgloadcat:hover > i, .jdgloadview:hover > i {
    display: inline-block;
}

.jdgridbox textarea {
    min-height:100px;
}


.form-control.jdgliveinp {
    font-size: 12px;
}

.jdglivezone.display-none {
    display: none !important;
}

.jdgliveinp {
    background: transparent;
    border: none;
    text-align: center;
    padding: 5px;
    max-height: 100px;
    overflow: auto;
}

.jdgliveinp > * {
    margin: auto;
}

.jdgliveinp > img {
    width: 98%;
}

.jdgliveinp:hover {
    border: solid 1px #dbe1e8;
    background: #fff;
}

.jdgliveinp:focus {
    text-align: left;
    background: #fff;
    border: solid 1px #dbe1e8;
}

.jdgicosubgrid {
    font-size: 16px;
    color: #1bbae1;
    cursor: pointer;
}

.jdgsubgridtd {
    height: 500px;
    background: #e8f5fd !important;
    overflow: auto !important;
    padding: 10px;
}

.jdgsubgridtd > iframe {
    width: 100%;
    height: 100%;
}

.jdgfixfull {
    position: fixed;
    top: 0;
    background: #fff;
    left: 0;
    height: 100vh;
    overflow: hidden;
    z-index: 1050;
    right: 0;
}

.jdgfixfull .jdgridtbbox {
    height: calc(100vh - 165px) !important;
}

.jdgblcimg {
    position:relative;
}
.jdgblcimg > a {
    position: absolute;
    right:20px;
}
.jdgblcimg > img {
    max-width: 60%;
    max-width: 120px;
}

/* REPONSIVE */
@media screen and (max-width: 1000px) {
    .jdgridtoolbar {
        display: block;
    }
    .jdgridtoolbar > div{
        justify-content: center;
    }
    .jdgridpager{
        margin:10px;
    }
    /* gab retrait ?*/
    /* .jdgridbox.table-responsive{
        width:auto !important;
    } */
    .jdgridfreez{
        position:inherit !important;
    }
}




/* THEME COMPACT */
.jdgridbox.compact .jdgridtb th, 
.jdgridbox.compact .jdgridtb td {
    font-size: 11px;
    padding:3px 5px;
    border-bottom: 1px solid #e8e6e6;
}
.jdgridbox.compact .jdgridtb th {    
    padding:5px !important;
}

.jdgridbox.compact .form-control{
    font-size: 11px;
    height: 28px;
}

.jdgridbox.compact .jdgridtb .jdclearfilter {
    top:11px;
}

/* THE OLDSCHOOL */
.jdgridbox.oldschool .jdgridtb {
    font-size: 11px;
    font-family: Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

.jdgridbox.oldschool .jdgridtb th {
    background:linear-gradient(to bottom, #f5f5f5, #ebebeb);
    color: #0073ea;
    padding: 8px 4px;
}

.jdgridbox.oldschool .jdgridtb th:hover {
    background: linear-gradient(to bottom, #0073ea, #2e6fb3);
    color: #fff;
}

.jdgridbox.oldschool .jdgridtb .separator {
    background-color:#fff;
}

.jdgridbox.oldschool .jdgridtb td {
    border: solid 1px #ddd;    
}

.jdgridbox.oldschool .jdgridfreez {
    box-shadow: 1px 1px 0px 2px #ddd;
}

.jdgridbox.oldschool .jdshadowleft {
    box-shadow: 1px 1px 0px 2px #ddd;
}

.jdgridbox.oldschool .jdgridtb .filterrow td {
    background:linear-gradient(to bottom, #f7f7f7, #ebebeb);
}

.jdgridbox.oldschool .form-control{
    font-size: 11px;
    height: 28px;
}

.jdgridbox.oldschool .jdgridtb .jdclearfilter {
    top:11px;
}