.route-opt{
    background-color:Highlight;
    border-style:double;
    border-color:black;
}

.edit-remove-btn-img{
    width: 25px
}

.fontlarge {
    font-size: 20px;
}

.li_report:hover {
    background-color: yellow;
}

.div_color {
    padding: 10px 10px 10px 10px;
    background-color: lightgrey;
    border-color: black;
    border-width: 2px;
    border-style: solid;
}

/* .hoverTable{
    width:100%; 
    border-collapse:collapse; 
}
.hoverTable td{ 
    padding:7px; border:#4e95f4 1px solid;
} */
/* Define the default color for all the table rows */
/* .hoverTable tr{
    background: #b8d1f3;
} */
/* Define the hover highlight color for the table row */
.hoverTable tr:hover {
      background-color: #ffff99;
}



.tooltip2 {
    position: relative;
    display: inline-block;
    /* border-bottom: 1px dotted black; */
  }
  
  .tooltip2 .tooltiptext2 {
    visibility: hidden;
    width: 120px;
    /* background-color: #555; */
    background-color: rgb(186, 90, 115);  
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
  }
  
  .tooltip2 .tooltiptext2::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color:  rgb(186, 90, 115) transparent transparent transparent;
    /* border-color: #555 transparent transparent transparent; */
  }
  
  .tooltip2:hover .tooltiptext2 {
    visibility: visible;
    opacity: 1;
  }

  .tooltip3 {
    position: relative;
    display: inline-block;
    /* border-bottom: 1px dotted black; */
  }

  .tooltip3 .tooltiptext3 {
    visibility: hidden;
    width: 120px;
    /* background-color: #555; */
    background-color:lightgray;  
    color: black;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    transition: opacity 0.3s;
    font-size: larger;
  }
  
  .tooltip3 .tooltiptext3::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: lightgrey transparent transparent transparent;
    /* border-color: #555 transparent transparent transparent; */
  }
  
  .tooltip3:hover .tooltiptext3 {
    visibility: visible;
    opacity: 1;
  }
  .container {
    /* position: relative; */
    /* text-align: center; */
    color: white;
    margin: -15px;
  }
  /* Centered text */
.centered {
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translate(-50%, -50%);
  }


  .selected-status {
    background-color: #fff3cd; /* Light yellow background */
    border: 1px solid #ffeeba;
    padding: 10px;
    border-radius: 5px;
    color: #856404;
}

/* Icon spacing inside buttons */
.app-btn-icon {
  margin-right: 8px;
  vertical-align: middle;
}

/* Primary button style */
.app-btn-primary {
  background-color: #495e8d;
  border-color: #3e527b;
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  padding: 10px 15px;
  text-align: center;
}

.app-btn-primary:hover,
.app-btn-primary:focus {
  background-color: #3e527b;
  border-color: #34476b;
  color: #fff;
}

/* Secondary button style */
.app-btn-secondary {
  background-color: #fff;
  color: #495e8d;
  border: 1px solid #cfd3e0;
  border-radius: 6px;
  font-weight: 600;
  padding: 10px 15px;
  text-align: center;
}

.app-btn-secondary:hover,
.app-btn-secondary:focus {
  background-color: #f6f7fb;
  color: #3e527b;
  border-color: #b7bdd0;
}

/* Disabled state */
.app-btn-primary[disabled],
.app-btn-secondary[disabled] {
  opacity: 0.65;
  cursor: not-allowed;
}