:root {
    --defaultbackgrouncolor:rgb(255, 255, 255);
    --backgrouncolor:var(--appcolor);
    /*rgb(102, 102, 102);*/
    --selectedrow:#CF979D;
    --hoverrow:    #D8B4B8;

    --labelcolor:rgb(255, 255, 255);
    --defaultordericon:rgb(255, 255, 255);
    --selectedordericon:#E5AE0C;
    --footerbackground:#f7f7f7;
    --headerricerca:#E5AE0C;


    --grigio:rgb(204, 204, 204);
    --red: rgb(174, 42, 42);
    --green:rgb(20, 91, 5);
    --disabled:rgb(128,128,128);
}

::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.25);
    border-radius: 6px;
}
/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(0,0,0,0.25) transparent;
}
div.tabella{

}
/***********************************
sezione div filtro 
************************************/
div.tabella .filtra{
    background: var(--backgrouncolor) !important;
    border: 1px solid var(--backgrouncolor);
    border-radius: 4px;
}

div.tabella .input-group-btn button{
    background: var(--backgrouncolor) !important;
    color:var(--labelcolor) !important;
}

div.tabella .filtra i.cerca{
    position: absolute;
    color: var(--grigio);
    top: 14px;
    font-size: 20px;
    z-index: 9;

}

div.tabella .filtra i.resetcerca{
    position: absolute;
    color: var(--grigio);
    top: 14px;
    right: 60px;
    cursor: pointer;
    font-size: 20px;
    z-index: 999;
}
div.tabella .filtra-testo{
    padding:24px !important;
}

.filtra i.filtra{
    margin-right: 5px
}

div.tabella .filta div.filtra-btn{
    width:1% !important;
}

div.tabella .table-responsive{
    border-radius: 4px;
}

div.tabella.border .table-responsive{
    border:1px solid lightgray;
}

div.tabella .table-responsive .table {
    border-collapse: separate;
    margin-bottom: 0px;
    /*    color:#595959*/
}

/***********************************
sezione table 
************************************/
div.tabella table{
    position: relative
}
div.tabella table tr{
    font-size: 1.3rem;
}

/***********************************
sezione table header
************************************/
div.tabella table thead,table thead{
    background: var(--backgrouncolor) !important;
    position: sticky;
    z-index: 2;
    top: 0;
    height: 50px;
}

div.tabella table thead tr th ,table thead tr th {
    color:var(--labelcolor) ;
    background: inherit !important;
    border: 0.5px solid #ddd;
    height:46px;
}

div.tabella table thead tr th .th-content {
    display: flex;
    gap: 5px;
    align-items: center;
    margin: 0 4px;
    height: 100%
}


div.tabella table thead tr th a.reorder{  /*icona orine non selezionata*/
    color:var(--labelcolor)  !important;
    cursor: pointer;
    font-size: 2.5rem;
}

div.tabella table thead tr th a.active{ /*icona orine selezionata*/
    color:var(--selectedordericon)  !important;
}

div.tabella table thead tr th span {
    flex:1;
}

div.tabella table thead tr th i.search {
    text-decoration: underline;
    color:var(--headerricerca);
}

div.tabella table thead tr th:nth-last-child(-1n+2){
    border-right: none !important
}

div.tabella table thead tr th:nth-last-child(-1n+1){
    border-left: none !important
}

/***********************************
sezione table body
************************************/

div.tabella table tbody tr.selected{
    background: var(--selectedrow) ;
}

div.tabella table tbody tr.cancella{
    opacity: 1 !important;
}

div.tabella table tbody tr.norecord:hover  {
    background: var(--defaultbackgrouncolor) !important;
    color:red !important;
    opacity: 1 !important;
}

div.tabella table tbody tr:not(.norecord):hover ,table tbody tr:hover {
    background: var(--hoverrow) !important;
}

div.tabella table tbody tr.norecord:hover >td  {
    color:red;
}

div.tabella table>tbody>tr:not(.norecord):hover>td>a.btn ,div.tabella table>tbody>tr.selected >td> a.btn  {
    color:var(--appcolor);
}


div.tabella  table tbody tr td i{
    font-size: 18px;
}

div.tabella  table tbody tr td i.red{
    color: var(--red) !important;
}

div.tabella  table tbody tr td a,div.tabella table tbody tr td span{
    display: block;           /* oppure inline-block */
    width: 100%;
    min-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.tabella table tbody tr td a.btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: linear-gradient(to bottom, #f2f2f2, var(--appcoloralpha2));
    border: 1px solid var(--appcolor);
    border-radius: 4px;
    box-shadow: 0 2px 3px rgba(0,0,0,0.2);
    transition: all 0.15s ease;
    color: var(--appcolor);
    min-height: unset;
  margin: unset;
}
div.tabella table tbody tr td a.btn i{
    font-size: 14px;
}

div.tabella table tbody tr td a.btn:active {
    background: linear-gradient(to bottom, #cccccc, #e6e6e6);
    box-shadow: inset 0 2px 3px rgba(0,0,0,0.2);
}
/***********************************
sezione div  footer
************************************/
div.tabella .footer{
    background: var(--footerbackground) ;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px
}

div.tabella .footer .skippages{
    display:inline-flex;
    margin:0;
    padding:0;
    list-style:none;
    align-items: center;
}


div.tabella .footer .skippages li span {
    cursor: pointer;
    width: 25px;
    font-size: 20px;
    display: block;
}

div.tabella .footer .skippages li span a {
    background:inherit;
    border:0;
    padding:6px 0;
}

div.tabella .footer label.pageskip,div.tabella .footer label.pagecounter{
    font-size:12px;
    font-weight:normal;
    margin:0 5px 0 5px
}

div.tabella .footer input.pageskip{
    min-height:30px;
    height:30px;
    font-size:14px;
    width:50px;
    border:1px solid lightgray;
    text-align:center;
    border-radius:8px;
}

div.tabella .footer .recordscounter{
    text-align: center;
}

div.tabella .footer .skippage{
    color:var(--backgrouncolor)  !important;
}

div.tabella .footer .skippage.disabled{
    color:var(--disabled) !important;
}


/***********************************
sezione media
************************************/
@media screen and (max-width: 767px) {
    div.tabella .table-responsive{
        margin-bottom: 0px;
    }
}

@media screen and (max-width: 330px) {
    div.tabella .footer nav ul li a{
        padding: 6px;
    }
}




.boxconferma {
    position: fixed;
    inset: 0;
    z-index: 99999;
    font-family: sans-serif;
}


.boxconferma .overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
}

.boxconferma .body {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    padding: 20px;
    min-width: 280px;
    border-radius: 6px;
    text-align: center;
    height: auto;
}

.boxconferma .actions {
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.boxconferma .actions button {
    flex: 1;
    padding: 8px;
    cursor: pointer;
}


body .modal-backdrop.fade.in~ .modal-backdrop.fade.in  {
    background-color: transparent;
    opacity: 0 !important;
    transition: none !important;
    animation: none !important;
    z-index: 0;

}

/*.cd-confirm {
    background: #d9534f;
    color: white;
    border: none;
}

.cd-cancel {
    background: #ccc;
    border: none;*/
/*}*/