.menu-button {
  ul {
    display: flex;
    justify-content: space-between;
    background-color: #fff;

    li {
      padding: 10px;
      width: 25%;
      text-align: center;
      border-right: 1px solid gainsboro;
      cursor: pointer;

      a {
        color: black;
        font-size: 15px;
        font-weight: 500;
        text-decoration: none;
      }

      &.active {
        background-color: black;

        a {
          color: #fff;
        }
      }
    }

    li:last-child {
      border-right: none;
    }
  }
}



.TICKET-BOX{margin-top: 2rem;
    background-color: #fff;
    padding: 2rem;
    border-radius: 6px;

    .flight-info-div{ border-bottom: 1px solid gainsboro;
        padding-bottom: 1rem;

        .div-both-set{display: flex;
            justify-content: space-between;
            align-items: center;
            .div-one{

                ul{
                    display: flex;
                    gap: 20px;

                    li{font-size: 17px;
                        display: flex;
                        gap: 6px;
                        align-items: center;
                        font-weight: 500;
                        color: #585757;
                        border-right: 1px solid gainsboro;
                        padding-right: 3rem;

                        i{font-size: 20px; color:black;}

                        span{font-size: 16px;font-weight: 500;
                            color: #585757;

                            i{font-size: 15px; padding-left: 10px; cursor: pointer;}
                        }
                    }
                }
            }

            .div-two{

                span{
                    background: #ff00001f;
                    padding: 5px 10px;
                    color: #b50d0d;
                    border-radius: 6px;
                    font-weight: 600;
                    font-size: 16px;

                }
            }

            .done{
            span{
                    background: #4caf5038;
                    padding: 5px 10px;
                    color: #4CAF50;
                    border-radius: 6px;
                    font-weight: 600;
                    font-size: 16px;

                }
            }
        }

        
    }


    .flight-place-info{margin-top: 1.6rem;
        display: flex;
        justify-content: space-between;
        gap: 10px;

            .flight-place-left{width: 15%;

                figure{    width: 100%;
                           height: 150px;
                           overflow: hidden;
                        border-radius: 10px;

                    img{
                        width: 100%;
                        height: 100%;
                    }
                }
            }


            .flight-place-right{
                width: 83%;


                .first-hadding-div{
                    display: flex;
                    justify-content: space-between;

                    .hadding-first{
                        display: flex;
                        gap: 10px;
                        align-items: center;

                        span{
                            font-size: 26px;
                            font-weight: 600;
                        }

                        i{
                            font-size: 20px;
                        }
                    }

                    .hadding-price{
                        span{
                            font-size: 26px;
                            font-weight: 600;
                        }
                    }
                }
            }
        }


        .time-div{margin-top: 1.3rem;

            .flight-row {
  display: flex;
  align-items: center;
  background: #f8f9fb;
  padding: 18px 24px;
  border-radius: 8px;
  gap: 60px;

}


.time-box {
  min-width: 90px;
}

.time {
  font-size: 20px;
  font-weight: 600;
  color: #111;
}

.date {
  font-size: 16px;
  color: #7a7a7a;
  margin-top: 4px;
}


.arrow-box {
  display: flex;
  align-items: center;
  gap: 6px;
}

.arrow-box .dot {
  width: 6px;
  height: 6px;
  background: #cfcfcf;
  border-radius: 50%;
}

.arrow-box .line {
  width: 50px;
  height: 2px;
  background: #cfcfcf;
}


.flight-box {
  min-width: 120px;
}

.flight-no {
  font-size: 20px;
  font-weight: 600;
  color: #111;
    display: flex;
    gap: 10px;
}

.plane {
  font-size: 14px;
  margin-right: 4px;
      width: 40px;
    display: block;
    height: 30px;

    img{
        width: 100%;
    height: 100%;
    }
}

.airline {
  font-size: 16px;
  color: #7a7a7a;
  margin-top: 4px;
}

.passenger-box {
  min-width: 180px;
}

.name {
  font-size: 20px;
  font-weight: 600;
  color: #111;
}

.count {
  font-size: 16px;
  color: #7a7a7a;
  margin-top: 4px;
}

        }
}



.addons-wrap {
  margin-top:1.5rem;
  
}

.addons-line .label {
  font-weight: 600;
  font-size: 20px;
}

.addons-line .value {
  font-weight: 400;
  color: #6b6f76;
  margin-left: 6px;
  font-size: 20px;
}


.earn-line {
  margin-top: 6px;
  font-size: 20px;
  line-height: 20px;
  color: #6b6f76;
  display: flex;
  align-items: center;
  gap: 4px;


 span{
    font-size: 20px;
    font-weight: 600;
 }
}

.earn-line strong {
  font-weight: 600;
  color: #c4a576;
  font-size: 20px;
}

.earn-line .amount {
  font-weight: 600;
   color: #c4a576;
}

.earn-line .chevron {
  margin-left: 6px;
  font-size: 18px;
   color: #c4a576;
  line-height: 1;
}