body {
    /* Override per disabilitare la selezione del testo (specie nei dispositivi touch)*/

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    /*-khtml-user-select: none;*/ /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version */
}


.surface {
    background-color: #fafafa;
}


.selectable {
    -moz-user-select: text !important;
    /*-khtml-user-select: text !important;*/
    -webkit-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
}

.appBarTitle {
    font-family: 'Roboto';
    font-weight: 300;
    font-size: 32px;
}

.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.break {
    flex-basis: 100%;
    height: 0;
}


table.infoCardFixed {
    table-layout: fixed;
    width: 100%;
}
    /*Setting the table width is important!*/
    table.infoCardFixed td {
        overflow: hidden;
    }

        table.infoCardFixed td:nth-of-type(1) {
            width: 100%;
        }

        table.infoCardFixed td:nth-of-type(2) {
            width: 80px;
        }



.blurryDialog {
    backdrop-filter: blur(10px);
}



.headerSmall {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    margin-left: auto;
    margin-right: auto;
}

.mud-table-cell-custom-group {
    font-weight: 500;
}

/*.components-reconnect-show, .components-reconnect-failed, .components-reconnect-rejected {*/
    /* Per disabilitare l'overlay "Attempting to reconnect..." */

    /*display: none;
}*/



.my-reconnect-modal > div {
    overflow: hidden;
    background-color: var(--mud-palette-appbar-background);
}

.components-reconnect-hide > div {
    display: none;
}

.components-reconnect-show > div {
    display: none;
}

.components-reconnect-show > .show {
    display: block;
}

.components-reconnect-failed > div {
    display: none;
}

.components-reconnect-failed > .failed {
    
    display: none; /* non visualizzo lo stato di connessione fallita*/
}

.components-reconnect-refused > div {
    display: none;
}

.components-reconnect-refused > .refused {

    display: none; /* non visualizzo lo stato di connessione rifiutata*/

}



.square {
    aspect-ratio: 1 / 1;
}


.attivo {
    transition: transform .2s;
    /* Animation */
}

    .attivo:hover {
        transform: scale(1.02);
    }


.fab {
    position: fixed;
    bottom: 20px;
    right: 20px;
}


.fabSmall {
    position: fixed;
    bottom: 10px;
    right: 10px;
}

.mud-dialog .mud-dialog-content {
    /* Imposto l'override per nascondere il bordo quando il DialogContent è selezionato */

    outline: none !important;
}

/*var(--mud-palette-primary)*/


.pulsating {
    /*background: rgba(var(--mud-palette-primary), 1);
    box-shadow: 0 0 0 0 rgba(var(--mud-palette-primary), 1);*/
    animation: pulsating-pri 2s infinite;
}

@keyframes pulsating-pri {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(51, 153, 255, 0.7);
        /*box-shadow: 0 0 0 0 rgba(var(--glow-color), 0.7);*/
        /*box-shadow: 0 0 0 0 rgb(from var(--mud-palette-primary) r g b / 0.7);*/
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(51, 153, 255, 0);
        /*box-shadow: 0 0 0 10px rgba(var(--glow-color), 0);*/
        /*box-shadow: 0 0 0 0 rgb(from var(--mud-palette-primary) r g b / 0);*/
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(51, 153, 255, 0);
        /*box-shadow: 0 0 0 0 rgba(var(--glow-color), 0);*/
        /*box-shadow: 0 0 0 0 rgb(from var(--mud-palette-primary) r g b / 0);*/
    }
}


.tblSelected {
    background-color: var(--mud-palette-primary) !important;
}

    .tblSelected > td {
        color: white !important;
    }

        .tblSelected > td .mud-input {
            color: white !important;
        }

.smalltbl .mud-table-cell {
    font-size: 0.75rem;
}


.toolbar-checkbox {
}

    .toolbar-checkbox > .mud-input-control-input-container > label > p {
        font-size: small;
        font-weight: normal;
    }

    .toolbar-checkbox > .mud-input-control-input-container > label > span > svg {
    }


.hotkeyBadge {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 3px 8px 3px 8px;
    color: var(--mud-palette-appbar-text);
    border-radius: 0 var(--mud-default-borderradius) 0 0;
    background-color: var(--mud-palette-text-primary);
    /*background-color: var(--mud-palette-primary);*/
}