html {
    touch-action: manipulation;
    zoom: 100%;
}

.header_table{
    width: 100%;
    padding: 0;
}
.header_info{
    padding: 0px;
    font-size: 0.8vw;
    margin: 0;
    font-weight:bold;
    width: 100%;
    display: flex;
    color: rgb(151, 151, 151);
    line-height:1.5;
    white-space: nowrap;

}
#date_table{
    margin-top: 2vh;
    width: 100%;

}
.nav_table{
    direction: rtl;
    height: 80%;
    margin: 0;
    padding: 0;

}
p {
    margin: 0;
}

.nav_icon{
    width: 4vh;
    cursor: pointer;
    margin-top: 2vh;
    display: flex;
    padding: .5vh;
    margin-right: .5vh;
    max-height: 4vh;
}
.nav_icon:hover{
    opacity: 0.6;

}

.line{  
    border-right: .3vh solid rgb(151, 151, 151);
}
th{
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
}
#logo{
}
#logo:hover{
    opacity: 0.8;
}

.progress-bar{
    position: relative;
    width: 8vw;
    height: 1.3vw;
    background-color: #4890fd ;
    border-radius: 1vw;
    color: #4890FD;
    margin-top: 2vh;

}

.progress-bar::before{
    content: attr(data-label);
    font-size: .6vw;
    display: flex;
    align-items: center;
    position: absolute;
    left: .2vw;
    top: .15vw;
    width: calc(var(--width, 0) * 1%);
    min-width: .1rem;
    max-width: calc(100% - 1.1em);
    background-color: rgb(255, 255, 255);
    border-radius: 1vw;
    padding: .15vw;
    padding-top: .2vw;
    padding-left: .2vw;
}
.progress-bar:hover{
    background-color:#68a3fc;
}
[data-tooltip] {
    position: relative; /* Set the tooltip relative to the <th> element */
}
[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    padding: .1em;
    z-index: 1; 
    position: absolute;
    margin: auto;
    top: 0px;
    left: 0%;
    color:rgb(173, 173, 173);
    border-radius: 1.5vh;
    font-weight: bold;
    font-size: 1.8vh;
    font-family: Arial, Helvetica, sans-serif;
    direction: rtl;
    float: left;
  }
  .new-badge {
    position: absolute;
    background-color: #4890fd;
    color: white;
    font-size: 0.7vw;
    padding: 2px 6px;
    border-radius: 10px;
    top: -8px;
    right: 6px;
    font-weight: bold;
    transform: rotate(-10deg);
    transition: opacity 0.3s ease;
}
.line {
    position: relative;
}
.line:hover .new-badge {
    opacity: 0;
}