@keyframes blink {
    0% {
        background-color: red;
    }
    50% {
        background-color: transparent;
    }
    100% {
        background-color: red;
    }
}



.travel-float-control{
    border-left: double 6px;
    height: 100%;
    margin-right: 2px;
    width: 6px;
    user-select: none;
}

.travel-float-control:hover{
    background-color: white;
    cursor: w-resize;
}
/* END  */

.travel-header-tools{
    background-color: rgb(12, 90, 151);
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    color: white;
    padding-bottom: 8px;
}

.travel-header-tools.history{
    padding-bottom: 0px;
}
#travel-col-container {
    transition: width 1.2s;
}

.btn-filter-rc{
    border: solid 1px gray;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 1px;
    padding-bottom: 1px;
    font-size: 12px;
    border-radius: 4px;
    text-align: center;
    margin-bottom: 2px;
    user-select: none;
    box-shadow: 0px 3px 5px 0px rgba(208, 208, 208, 0.75);
}

.filter-collect-delivery:not(.active):hover{
    background-color: #e2e2e2;
    color: white;
    border-radius: 4px;
    opacity: 0.6;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}
.filter-collect-delivery.active:hover{
    background-color: #51fdb5;
    color: white;
    border-radius: 4px;
    opacity: 0.6;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}


.collect-header-tools{
    background-color:  rgb(114, 206, 74);
    color: white;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding-top: 8px;
}

.delivery-header-tools{
    background-color:  rgb(50, 172, 212);
    color: white;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding-top: 8px;

}
.elaboration-collect-delivery{
    display: none;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.travel-tools-btn{
    padding: 4px;
    border: solid 1px white;
    border-radius: 4px;
}
.travel-tools-btn:hover{
    background-color: white;
    color: rgb(112, 125, 157);
    cursor: pointer;
}

.kg-pat-box{
    background-color: #92cdef5b; 
    border-radius: 4px;
    display: inline-block;
    padding: 3px;
    
    min-width: 110px;
    min-height: 30px;
    margin-bottom: 2px;
    font-weight: bold;
    font-size: 14px;
}
.kg-pat-text, .kg-colli-text, .kg-pedane-text, .kg-kg-text{
    border: dotted 1px rgb(93, 93, 93);
    border-radius: 3px;
    margin-left: 2px;
    padding-left: 2px;
    padding-right: 2px;
    float: left;
}

.toggle-lock.travel-tools-btn.locked-only{
    background-color: #ff8e1d;
    color: white;

}

.new-map-window.travel-tools-btn.on{
    background-color: #ff8e1d;
    color: white;
}


.melting-collect-delivery{
    padding: 4px;
    border: solid 1px gray;
    border-radius: 4px;
    font-size: 2em;
    margin-top: 25%;
}

.melting-collect-delivery:hover{
    background-color: white;
    color: rgb(112, 125, 157);
}
.geo-grouping-cd{
    padding: 4px;
    border: solid 1px gray;
    border-radius: 4px;
    font-size: 2em;
    user-select: none;
}
.geo-grouping-cd:hover{
    background-color: white;
    color: rgb(112, 125, 157);
}
.geo-grouping-cd.mix-active{
    background-color: #ff8e1d;
    color: white;
}
.geo-localization-cd{
    padding: 4px;
    border: solid 1px gray;
    border-radius: 4px;
    font-size: 2em;
    user-select: none;
}
.geo-localization-cd:hover{
    background-color: white;
    color: rgb(112, 125, 157);
}
.travel-float-header{
    background-color: rgb(12, 90, 151);
    color: white;
    padding: 4px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
    text-align: center;
}
.travel-unit{
    user-select: none;
    cursor: pointer;
    border-bottom: dotted 1px gray;
    margin-bottom: 3px;
}
.travel-unit.locked{
    background-color: rgba(69, 202, 102, 0.569);
    border-radius: 6px;

}
.travel-unit.just-saved{
    background-color: rgb(255, 255, 182);
    font-style: italic;
}
.travel-unit.just-saved.locked{
    background-color: rgba(128, 211, 73, 0.569);
    border-radius: 6px;
}
.travel-unit.details{
    border-right: dotted 3px gray;
    border-left: dotted 3px gray;
    border-top: dotted 3px gray;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    margin-left: -2px;
    margin-right: -2px;
    margin-top: 5px;
}

.material-symbols-outlined.vgg-icons{
    font-size: 24px !important;
}

.lock-travel-button:hover{
    background-color: white;
    border-radius: 6px;
}
.edit-travel-button:hover{
    background-color: white;
    border-radius: 6px;
}
.view-travel-route:hover{
    background-color: white;
    border-radius: 6px;
}
.elaborate-profit:hover{
    background-color: white;
    color: gray;
    border-radius: 6px;
}
.elaborate-profit.disabled{
    color: rgb(231, 231, 231);

}
.vgg-profit-total{
    background-color: white;
    float: left;
    color: rgb(12, 90, 151);;
    font-size: 22px;
    border-radius: 4px;
    width: 140px;
    text-align: right;
    padding-right: 10px;
    margin-right: 5px;
    font-family: sans-serif;
    font-weight: bold;
}

.row.selectable.locked:hover{
    background-color:rgba(69, 202, 102, 0.445);;
}

.travel-unit.locked.really{
    background-color: #ff8e1d;
    border-radius: 6px;
    /* box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75); */
}
.travel-unit.locked.really:hover{
    background-color: #ff8e1d97;
    border-radius: 6px;
    /* box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75); */
}



.collection-unit{
    background-color: var(--collect-background);
    user-select: none;
    cursor: pointer;
    border-bottom: dotted 1px gray;
}

.collection-unit.locked{
    background-color: rgba(69, 202, 102, 0.569);
    border-radius: 6px;
    /* box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75); */

}
.collection-unit.locked.really{
    background-color: #ff8e1d;
    border-radius: 6px;
    /* box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75); */
    
}
.collection-unit.reload{
    background-color: rgb(255, 255, 182);
}
.delivery-unit.locked{
    background-color: rgba(69, 202, 102, 0.569);
    border-radius: 6px;
}
.collect-field.company-name{
    font-size: calc(var(--font-size-base));
    font-weight: bold;
}
.collect-field.city{
    font-size: calc(var(--font-size-base) );
    font-style: italic;
}
.delivery-unit.locked.really{
    background-color: #ff8e1d;
    border-radius: 6px;
}
.delivery-unit.reload{
    background-color: rgb(255, 255, 182);
}
.delivery-field.company-name{
    font-size: calc(var(--font-size-base));
    font-weight: bold;
}

.vgg-profit{
    text-align: right;
}
.vgg-profit.margine{
    font-weight: bold;

}
.vgg-profit.margine.elaborating{
    font-weight: unset;
    color: lightgray;
}
.vgg-profit.distanza.elaborating{
    font-weight: unset;
    color: lightgray;
}

.vgg-profit-col.margine{
    background-color: rgba(207, 225, 232, 0.589);
    border-radius: 3px;
}
.vgg-profit-col.distanza{
    background-color: rgba(207, 225, 232, 0.589);
    border-radius: 3px;
}

.delivery-unit{
    background-color: var(--delivery-background);
    user-select: none;
    border-bottom: dotted 1px gray;

    cursor: pointer;

}
.collection-unit.dragging{
    position: absolute;
    background-color: lightblue;
    border: dotted 2px gray;
    border-radius: 6px;
    width: 40%;
    display: block;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}
.delivery-unit.dragging{
    position: absolute;
    background-color: lightblue;
    border: dotted 2px gray;
    border-radius: 6px;
    width: 40%;
    display: block;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}

/* CAmpi di Input in Leggera evidenza */
.form-control.hi-input{
    font-weight: bold;
    background-color: #f1f9ff;
}


.ragione-consegna-ritiro-opposite{
    font-size: 12px;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* Sezione dei Tragitti del Viaggio */
.travel-path-container{
    display: flex;
    margin-bottom: 25px;
    padding-top: 8px;
    min-height: 55px;

    border-left: dotted 3px gray;
    border-right: dotted 3px gray;
    border-bottom:dotted 3px gray;
    border-bottom-right-radius:4px ;
    border-bottom-left-radius:4px ;
}
.travel-path-container.over{
    border: dotted 3px lime;
    background-color: rgba(0, 255, 0, 0.06);
}

.travel-path-footer{
    color: lightgray;
    font-size: 18px;
    padding: 10px;
    text-align: center;
    margin: 3px;

}
.travel-path-footer.enabled{
    color: black;
    background: repeating-linear-gradient(45deg, #80bffe8a, #80bffe8a 10px, #d0e4f988 10px, #d0e4f988 20px);
}

/* Unità del tragitto */
.segment-divisor.enabled{
    align-items: center;
    user-select: none;
    cursor: pointer;
    display: inline;
    background-color: #80bffe;
    width: 15px;
    /* Crea un tratteggio obliquo di background di molte barre*/
    background:repeating-linear-gradient(45deg,#80bffe, #80bffe 10px, #d0e4f9 10px,#d0e4f9 20px);
}
.segment-divisor.hor{
    width: 100%;
    height: 15px;
    margin-bottom: 3px;
    margin-top: 1px;
    margin-bottom: 1px;
}
.segment-divisor.ver{
    width: 15px;
    height: 100%;
    margin-right: 3px;
    margin-right: 3px;
    margin-bottom: 8px;
}

/* .segment-divisor.enabled:hover{
    background:repeating-linear-gradient(45deg,#80bffeb5, #80bffeb5 10px, 
        #d0e4f9b5 10px,#d0e4f9b5 20px);
}    */

.segment-divisor.enabled:hover{
    background: repeating-linear-gradient(45deg, #80bf80b5, #80bf80b5 10px, 
        #d0f9d0b5 10px, #d0f9d0b5 20px);
}

.segment-divisor.disabled{
    display: none;
}
.segment-unit{
    float: left;
    border: solid 1px gray;
    border-radius: 6px;
    font-size: 12px;
    margin-right: 3px;
    padding-left: 6px !important;
    padding-right: 6px !important;

    margin-bottom: 2px;

    background-color: #f3f3f3;
    user-select: none;
}
.segment-unit.type-RIT{
    background-color: var(--collect-background);
}
.segment-unit.type-CON{
    background-color: var(--delivery-background);
}

.collect-time, .delivery-time{
    font-size: 12px;
    font-style: italic;
    background-color: rgb(242, 255, 99);
    border-radius: 4px;
    padding: 2px;
    text-align: center;
}
.segment-unit.dragging{
    position: absolute;
    background-color: lightblue;
    border: dotted 2px gray;
    border-radius: 6px;
    width: 40%;
    display: block;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}
.segment-unit.enabled:hover{
    background-color: white;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}

.segment-tipo{
    font-weight: bold;
}

/* BOX primari di ritiro e consegna */
.segment-box-ritiro{
    border: solid 2px #1f1f1f;
    border-radius: 4px;
    margin-top: 3px;
    background-color: white;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
    background-color: var(--delivery-background);
}
.segment-box-consegna{
    border: solid 2px #1f1f1f;
    border-radius: 4px;
    margin-top: 5px;
    background-color: white;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
    background-color: var(--collect-background);
}

.segment-ragione.ritiro{
    font-weight: bold;
}
.segment-citta.ritiro{
    margin-top: 4px;
    font-style: italic;
    padding-bottom: 5px;
}

.segment-ragione.consegna{
    font-weight: bold;
    border-radius: 4px;
}
.segment-citta.consegna{
    margin-top: 4px;
    font-style: italic;
    padding-bottom: 5px;
}

.segment-indirizzo.ritiro{
    font-size: 12px;
    font-weight: unset;
}
.direction-attribute{
    position: relative;
}
.direction-attribute.primary{
    /* padding-right: 12px;
    padding-left: 12px; */
    font-size: 14px;
    font-weight: bold;
    background-color: rgb(170, 170, 170);
    color: white;
    border-radius: 3px;
    display: inline-block;
    text-align: center;
    width: 100%;
}
.direction-attribute.primary.collect{
    background-color: rgb(114, 206, 74);
}
.direction-attribute.primary.delivery{
    background-color: rgb(50, 172, 212);
}


.header-segment .pat{
    font-size: 12px;
    width: 50%;
    float:left;
   
    text-align: center;
    background-color: aliceblue;
    padding: 2px;
    border-radius: 4px;

}
.header-segment .pedane{
    font-size: 12px;
    width: 50%;
    float:left;
   
    text-align: center;
    background-color: rgb(249, 253, 255);
    padding: 2px;
    border-radius: 4px;

}

.header-segment .kg{
    text-align: center;
    background-color: rgb(208, 248, 225);
    padding: 2px;
    border-radius: 4px;
}
.header-segment .current-weight{
    font-weight: bold;
    background-color: #fef326;
    border-radius: 4px;
    padding: 2px;

    min-width: 55px;
    text-align: right;
    
}
.header-segment .current-weight.danger{
    color: white;
    background-color: red;
    animation: blink 1s infinite;
}
.header-segment .current-pat.danger{
    color: white;
    background-color: red;
    animation: blink 1s infinite;
}


.header-segment .current-pat{
    font-weight: bold;
    background-color: #fecf26;
    border-radius: 4px;
    padding: 2px;

    min-width: 55px;
    text-align: right;
    
}

.direction-attribute-text{
    margin-bottom: 10px;
}
.direction-attribute.secondary{
    font-style: italic;
    border-radius: 5px;
   
}
.segment-box-consegna-of-ritiro{
    border: solid 2px #bebebe;
    border-radius: 4px;
    margin-top: 6px;
}

.segment-box-ritiro-of-consegna{
    border: solid 2px #bebebe;
    border-radius: 4px;
    margin-top: 6px;
}
.segment-ragione.ritiro-of-consegna{
    font-weight: 600 ;
}

.segment-ragione.consegna-of-ritiro{
    font-weight: 600 ;
    padding-top: 5px;
    padding-bottom: 5px;

}

.segment-order{
    color: #0000ff;
}
.order-info-travel{
    position: absolute;
    bottom: 0px;
    right: -6px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-top: -20px;
    width: 76px;
}
.order-info-travel:hover{
    background-color: rgba(184, 184, 184, 0.684);
    cursor: pointer;
    border-radius: 5px;
}

.header-segment{
    background-color: #d7d7d777;
    border-radius: 3px;
    padding-top: 4px;
    padding-bottom: 4px;
}

#ritiri-container.over{
    border: dotted 3px lime;
    background-color: rgba(0, 255, 0, 0.06);
}

#consegne-container{
    border-radius: 6px;
}
#consegne-container.over{
    border: dotted 3px lime;
    background-color: rgba(0, 255, 0, 0.06);
}
.path-travel-tools{
    
    background-color: #cfcfcf;
    
    padding-left: 12px;
    padding-top: 3px;
    border-right: dotted 3px gray;
    border-left: dotted 3px gray;
}
.icon-note-path{
    border: solid 1px gray;
    padding: 3px;
    border-radius: 4px;
}
.icon-note-path:hover{
    background-color: white;
    cursor: pointer;
}
.note-rc{
    display: none;
}
.note-alert{
    margin-top: -3px;
    border-bottom: 3px dotted orangered;
    margin-bottom: 2px;
}

.head_cluster{
    background-color: #d8d8d8;
    padding: 6px;
    border-radius: 4px;
    margin-bottom: 6px;
    margin-left: -11px;
    margin-right: -11px;
}

.explain-algorithms{
    padding-top: 12px;
    padding-bottom: 12px;
}
.data-ritiro{
    background-color: white;
    border-radius: 3px;
    padding-left: 2px;
    padding-right: 2px;
    text-align: center;
    min-width: 110px;
    margin-bottom: 1px;
}

.box-zona{
    font-style: italic; 
    float: left;
    font-size: 12px;
    /* display: flow-root; */
}

.box-data-cons{
    font-weight: unset;
    float: left;
    margin-right : 12px;
    background-color: white;
    border-radius: 3px;
    padding-left: 2px;
    padding-right: 2px;
}
.box-data-rit{
    font-weight: bold;
    float: left;
    margin-right : 12px;
}

.box-idordine{
    text-align: right;
    font-size: 11px;
    /* position: absolute; */
    right: 5px;
    margin-top: 3px;
}
.box-idordine-travel{
    font-size: 12px;
}
.next-distance-box{
    background-color: #fef326;
    border-radius: 4px;
    font-size: 12px;
    padding: 4px;
    padding-left: 6px;
    padding-right: 6px;
    margin-top: 6px;
    margin-bottom: 6px;
}

.travel-maps-call{
    text-align: center;
    background-color: #d8d8d8;
    padding: 6px;
    border-radius: 4px;
    margin-bottom: 6px;
    margin-left: -11px;
    margin-right: -11px;
    cursor: pointer;
}
.travel-maps-call:hover{
    background-color: #dbdbdb;

    font-weight: bold;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
    
}
.order-travel.hor{
    position: relative; 
    height: 20px;
    /* float: right; */
    width: 92%;
    margin-top: 8px;
}
#selector-zones-content{
    position: absolute;
    background-color: #e1e1e1eb;
    width: 300px;
    border-radius: 4px;
    z-index: 1000;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75);
}

.order-image-vettore{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    font-style: italic;
    background-color: rgb(238, 238, 238);
    padding: 3px;
    border-radius: 3px;
    width: 150px;
}
.travel-sequel{
    font-style: italic;
}
.current-weight{
    background-color: #fef326;
    border-radius: 4px;
    padding: 3px;
}

.payload-ratio-segment-container{
    position: relative;
    width: 6px;
    border: solid 1px darkgray;
    border-radius: 3px;
    height: 110%;
}

.truck-max-weight{
    border: dotted 1px rgb(78, 78, 78);
    font-weight: bold;
    padding: 4px;
    border-radius: 4px;
}
.truck-max-pat{
    border: dotted 1px rgb(78, 78, 78);
    font-weight: bold;
    padding: 4px;
    border-radius: 4px;
}

.truck-max-weight.danger{
    color: white;
    font-size: 2em;
    animation: blink 1s infinite;
}
.truck-max-pat.danger{
    color: white;
    font-size: 2em;
    animation: blink 1s infinite;
}
.max-payload-weight{
    border-radius: 4px;
    padding: 4px;
}
.max-payload-pat{
    border-radius: 4px;
    padding: 4px;
}
.max-payload-weight.danger{
    color: white;
    font-size: 2em;
    animation: blink 1s infinite;
}
.max-payload-pat.danger{
    color: white;
    font-size: 2em;
    animation: blink 1s infinite;
}
.kg-circle-label{
    background-color: #fef326;
    border-radius: 6px;
    position: relative;
    width: 10px;
    height: 10px;
    border: solid 1px gray;
    font-size: 8px;
    margin-left: -2px;
}
.pat-circle-label{
    background-color: #fecf26;
    border-radius: 6px;
    position: relative;
    width: 10px;
    height: 10px;
    border: solid 1px gray;
    font-size: 8px;
}
.kg-circle-text{
    margin-top: -3px;
    padding-left: 2px;
    font-weight: bold;
}
.pat-circle-text{
   margin-top: -3px;
   padding-left: 2px;
   font-weight: bold;
}

.truck-select.enabled{
    border: solid 1px #1f1f1f;
    padding: 3px;
    border-radius: 5px;

}
.truck-select.enabled:hover{
    background-color: #f3f3f3;
    cursor: pointer;
}


.lock-short-user{
    float: left;
    margin-left: 4px;
    background-color: gray  ;
    color: white;
    font-size: 12px;
    font-weight: bold;
    border-radius: 4px;
    text-align: center;

    width: 20px;
    margin-right: -20px;
    margin-top: 4px;
}

.profit-success{
    background-color: limegreen;
    color: white;
    border-radius: 4px;
}
.profit-danger{
    background-color: red;
    color: white;
    border-radius: 4px;
}
.profit-warning{
    background-color: orange;
    color: white;
    border-radius: 4px;
}
.profit-error{
    border: dotted 3px red;
    border-radius: 3px;
    color: red;
}
.profit-invalidate{
    border-radius: 4px;
    background-color: yellow;
}

@keyframes rotate {
    0% {
        transform: rotateY(0deg);
    }
    100% {
        transform: rotateY(360deg);
    }
}

.profit-elaborating{
    display: inline-block;
    animation: rotate 2s linear infinite;
    color: gray;
}

.link-margine-profit{
    border: solid 1px gray;
    border-radius: 3px;
    padding: 3px;
    padding-left: 8px;

}
.link-margine-profit:hover{
    background-color: #f3f3f3;
    cursor: pointer;
}

.profit-note{
    font-family: 'Courier New', Courier, monospace;
    font-size: 11px;
}

.order-map-point{
    position: absolute;
    margin-top: -36px;
    background-color: rgb(0, 102, 255);
    color: white;
    border-radius: 6px;
    padding: 6px;
    text-align: center;
    width: 40px;
    font-size: 14px;
    font-weight: bold;

}
.vgg-profit-origin{
    border-radius: 25px;
    width: 16px;
    padding: 1px;
    font-size: 9px;
    margin-left: -15px;
    margin-top: 18px;
    text-align: center;
}
.vgg-profit-origin.big{
    position: relative;
    width: 100%;
    font-size: 16px;
    font-weight: bold;
}
.vgg-profit-origin.chronos{
    background-color: greenyellow;
}
.vgg-profit-origin.arco{
    background-color: #ff8e1d;
}

.row.footer-segment.NOTE{
    margin-top: -20px;

}

.header-segment.primary.NOTE{
    background-color: unset!important;
}
.segment-note{
    font-weight: bold;
}
.segment-add-note{
    text-align: center;
}
.add-note-passage{
    font-size: 14px;

}
.pop-up-header{
    background-color: #d8d8d8;
    padding-top: 6px;
    padding-bottom: 6px;
    border-top-left-radius: 6px ;
    border-top-right-radius: 6px ;
}
#popover-menu-container{
    position: absolute;
    width: 40%;
  
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 10px;

    z-index: 2000;
    background-color: white;
    border-radius: 6px;
    box-shadow: 0px 6px 5px 0px rgba(123, 123, 123, 0.75); 
}
.list-group-item.remove-travel{
    background-color: #ff8e1d;
    color: rgb(46, 46, 46);
    font-weight: bold;
    cursor: pointer;
}
.list-group-item.remove-travel:hover{
    background-color: #ffdcb9;
    color: black;
}
.list-group-item.locked-travel{
    background-color: rgba(69, 202, 102, 0.469);
    font-weight: bold;
    cursor: pointer;
}
.list-group-item.locked-travel:hover{
    background-color: rgba(132, 195, 148, 0.277);

}

.list-group-item.internal-travel{
    background-color: #f0f0f0;
    border-left: 5px solid #007bff;
    font-weight: bold;
}
.list-group-item.internal-travel:hover{
    background-color: #e0e0e0;
}


input.form-control.passage{
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    background-color:cadetblue;
    color: white;

}
input.form-control.passage.inactive{
    background-color:unset;
    color: black;
}


.segment-passage-point{
    background-color: cadetblue;
    color: white;
    border-radius: 6px;
    padding: 2px;
    font-weight: bold;
}
.segment-passaggio{
    text-align: center;
    border-radius: 25px;
    width: 25px;
    background-color: cadetblue;
    color: white;
    font-weight: bold;
        display: inline-block;
}
.segment-passaggio.scarico{
    background-color: rgb(103, 95, 160);

}

.popup-text-reference{
    display: none;
    border : solid 1px gray;
    background-color: #f3f3f3;
    border-radius: 6px;
    padding: 4px;
}

.flash-effect {
    animation: flash 3s ease-in-out;
}
.flash-sede-effect {
    animation: flash-sede 3s ease-in-out;
}

@keyframes flash {
    0%, 100% { background-color: transparent; }
    12% { background-color: yellow; }
    24% { background-color: transparent; }
    36% { background-color: yellow; }
    48% { background-color: transparent; }
    60% { background-color: yellow; }
    72% { background-color: transparent; }
}

@keyframes flash-sede {
    0%, 100% { background-color: transparent; }
    12% { background-color: rgb(107, 202, 107); }
    24% { background-color: transparent; }
    36% { background-color: rgb(107, 202, 107); }
    48% { background-color: transparent; }
    60% { background-color: rgb(107, 202, 107); }
    72% { background-color: transparent; }
}

.material-symbols-outlined.icon-sede{
    font-size: 2em;
    float: right;
    margin-top: -14px;
    position: relative;
    border: solid 1px gray;
    border-radius: 4px;
    padding: 2px;

}
.position-index-tragitto{
    border: solid 1px gray;
    padding: 3px;
    border-radius: 5px;
    position: absolute;
    float: right;
    margin-top: 16px;
    right: 20px;
    z-index: 1000;
    background-color: #f3f3f3;
    
}
#tragitto-order-input{
    text-align: center;
}

.sede-container{
    border-radius: 5px;
    padding: 2px;
}