.queue-product-list {
    margin-bottom: 55px;

    .total-queue-box {
        background: #1D212D;
        padding: 10px 20px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%;

        .title {
            color: #Fff;
            font-size: var(--base-size);
            font-weight: 500;
        }

        .value {
            font-size: var(--small-size);
            color: rgba(255, 255, 255, 0.7);
            margin-bottom: 0;
        }
    }

    @media (max-width:1024px){
       .total-queue-box {
        padding: 10px;
       } 
    }
    @media (max-width:640px){
        margin-bottom: 0;
    }
}

/* //queue-details-section */
.queue-details-section {
    .queue-listing-box {
        display: flex;
        flex-wrap: wrap;
        /* padding-bottom: 20px; */
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        margin-bottom: 20px;
         flex-direction: column;
         /* gap: 30px; */

        .left-side {
            display: flex;           
            flex: 1;
            gap: 30px;
            flex-wrap: wrap;

            .inner-queue {
                display: flex;
            }
            .common-sign-box {
                max-width: 100px;
                padding: 10px;

                span {
                    display: flex;
                    height: 120px;
                    color: #fff;
                    align-items: center;
                    width: 100%;
                    font-size: var(--main-font-size);
                    font-weight: 600;
                }

            }

            .common-box {
                flex: 1 1 auto;
                max-width: 150px;
                .title {
                    font-size: 14px;
                    color: #fff;
                    margin-top: 10px;
                    text-align: center;
                }

                .imageBox {
                    height: 120px;
                    overflow: hidden;
                    border-radius: 10px;

                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: fill;
                    }
                }

                &.result-box {
                    .result-area {
                        height: auto;

                        .imageBox {
                            height: auto;
                        }
                    }
                }
            }
        }

        .right-side {
            max-width: 100%;
            .queue-date {
                 text-align: right;
                p {
                    color: #424651;
                    margin-bottom: 0;
                }
            }
        }
        @media (max-width:1024px){
          .left-side {
                flex-wrap: wrap;
                flex: 100%;
                .button-box{
                    width: 100%;
                 }

                .inner-queue {
                    /* flex-wrap: wrap; */

                }
            }   
        }

        @media (max-width:640px) {
            .left-side {
                flex-wrap: wrap;
                flex: 100%;

                .inner-queue {
                    flex-wrap: wrap;

                    .common-box {
                        max-width: calc(33.33% - 30px);
                        .imageBox{
                            height: 80px;
                        }
                        &.result-box {
                            max-width: 100%;
                            width: 100%;
                        }
                    }
                    .common-sign-box{
                        span{
                            height: 80px;
                            line-height: 80px;
                        }
                    }

                    .equal-sign {
                        max-width: 100%;
                         width: 100%;

                        span {
                            height: 30px;
                            line-height: 30px;
                            display: block;
                            text-align: center;
                        }
                    }
                }
            }
        }

    }
}