@use "../../../../styles/abstracts/variables";

.active__trade{
    display: grid;
    grid-template-columns: 180px 150px 130px 150px 100px;
    grid-gap: 10px;
    padding: 1rem .7rem;
    border-bottom: 1px solid #23252C;
    align-items: center;

    h4{
        font-size: .87rem;
    }

    &--active{
        background: variables.$col-success-color;
        color: variables.$col-success-bg;
        display: inline;
        width: 70%;
        text-align: center;
        padding: .4rem .2rem;
        border-radius: 50px;
        font-weight: 500;
        font-size: .82rem !important;
    }

    &--on-going{
        @extend .active__trade--active;
        background: variables.$col-danger-bg;
        color: #000;
    }

    &--btn{
        background: variables.$col-primary-btn;
        color: #000;
        padding: .5rem 0rem;
        border-radius: 10px;
        font-weight: 600;
        font-size: .85rem;
        text-align: center;
        cursor: pointer;
    }
}