/* 
    Created on : 9 déc. 2021, 13:38:17
    Author     : Murelh
*/

#network-live-monitoring{
    max-height:150px;
    overflow-y: scroll;
}

#network-live-monitoring::-webkit-scrollbar{
    background:rgb(250,250,250);
    border: 2px solid #ffe3e6;
    width:8px;
    border-radius: 8px;
}

#network-live-monitoring::-webkit-scrollbar-thumb {
    background-color: #ff7784 ;
    border-radius: 4px;
}

.get-render{
    cursor:pointer;
}
.pointer{
    cursor:pointer;
}

.strong{
    font-weight:bold;
}

.ui-autocomplete{
    background-color: #293037;
    border-color: #30373f;
    color: #adb5bd;
    padding:0.1rem 0rem;
    border-color: rgba(0,0,0,0.25) !important;
    max-height:200px ;
    overflow:auto;
}

.ui-autocomplete .ui-menu-item{
    padding:8px 5px;

    transition: all 0.1s;
    border-bottom:1px solid;
    border-bottom-color: rgba(173, 181, 189,0.1);
}

.ui-autocomplete .ui-menu-item:nth-child(even){
    padding:3px;
    background-color: #293037;
}

.ui-autocomplete .ui-menu-item:hover{
    background-color: #2f373f;
}

.form-group .select2-container{
    display: block !important;
}

.logo{
    line-height: 1.5rem !important;
}

input[disabled]{
    background-color: #eee !important;
}

[disabled]{
    cursor:not-allowed !important;
}

.agreementcolumn-list{
    min-height:50%;
}

.agreementcolumn-list li:hover{
    background-color: rgba(255, 119, 132,0.51);
}

.dataTables_wrapper .dataTables_processing {
    position: absolute;
    top: 30%;
    left: 50%;
    width: 30%;
    margin: auto -15%;
    padding: 10px;
    text-align: center;
    font-size: 1.2em;
    color:rgba(250,250,250,0.9);
    background-color: #ff7784;
    box-shadow: 0px 0px 5px rgba(26,26,26,0.5);
    --border-size: 3px;
    --border-angle: 0turn;
    background-image: conic-gradient(
        from var(--border-angle),
        #ff7784,
        #ff7784
        ),
        conic-gradient(from var(--border-angle), #f55665 20%, #ff7784, #f03);
    background-size: calc(100% - (var(--border-size) * 2))
        calc(100% - (var(--border-size) * 2)),
        cover;
    background-position: center center;
    background-repeat: no-repeat;

    animation: bg-spin 3s linear infinite;

}

.drop-zone{
    border:3px dashed #ff7784;
    padding:1rem;
    display:inline-block;
    margin: 1rem auto;
    width:50%;
    min-height:5rem;
    text-align:center;
}

@keyframes bg-spin {
    to {
        color:rgba(255,255,255,1);
        --border-angle: 1turn;
    }
}
&:hover {
    animation-play-state: paused;
}


@property --border-angle {
    syntax: "<angle>";
    inherits: true;
    initial-value: 0turn;
}