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

.recent__transactions{
    @include mixins.dashPageComponent;
    @media only screen and (max-width: 1000px) {
        padding: 1.5rem 1.5rem;
    }

   &__header{
    padding-bottom: .5rem;
    h3{
        font-weight: 700;
        color: #FFF;
        @media only screen and (max-width: 1000px) {
            font-size: 1rem;
        }
    }

    p{
        font-size: .85rem;
        font-weight: 500;
        opacity: .9;
        padding-bottom: 1.2rem;
        padding-top: .3rem;
        @media only screen and (max-width: 1000px) {
            font-size: .8rem;
            padding-bottom: 1rem;
        }
    }
   }

    a{
        background: variables.$col-orange;
        border-radius: 6px;
        padding: .8rem 1.6rem;
        color: variables.$col-dark;
        font-family: variables.$font;
        font-weight: 600;
        font-size: .85rem;
        text-transform: capitalize;
        display: block;
        text-align: center;
        transition: all ease-in-out .5s;
        @media only screen and (max-width: 1000px) {
            padding: .8rem 1.6rem;
            font-size: .8rem;
        }
        &:hover {
            background-color: #e66a00;
            box-shadow: 0 0 6px rgba(255, 122, 0, 0.4);
        }
    }
}