.bonuses-block-wrapper {
    margin: 10px 0;
}
.bonuses-block {
    display: flex;
    position: relative;
    flex-direction: row;
    margin: 1px 0;
    border-radius: 3px;
    justify-content: space-between;
    min-height: 50px;
    align-items: center;
    overflow: hidden;
    cursor: pointer;
} 

.bonuses-block:hover {
    background-color: #424262;
}
.bonuses-block:hover .bonuses-block-caption {
    color: #ffa500;
}

.bonuses-block-status {
    position: absolute;
    left: -5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    color: transparent!important;
}

body[dir='rtl'] .bonuses-block-status {
    left: unset;
    right: -5px;
}
.bonuses-block-caption {
    text-transform: uppercase;
    padding: 0.3125em 0.875em;
}

.bonuses-block-description-wrapper,
.bonuses-block-amount-wrapper {
    display: flex;
    flex-direction: column;
}

.bonuses-block-amount-wrapper {
    flex: 1 1 100px;
    width: 100px;
}

.bonuses-block-info {
    display: flex;
    flex: 1 1 auto;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
}

.bonuses-block-title {
    width: 20rem;
    color: #cecece;
    padding: 0.3125em 0.875em;
    white-space: nowrap;
}
.bonuses-block-description {
    color: #A4C2EA;
    padding: 0.3125em 0.875em;
    text-overflow: ellipsis;
}

.bonuses-block-money-wrapper {
    display: flex;
    align-items: center;
}

.bonuses-block-balance {
    padding: 0.3125em 0.875em;
    font-weight: 400;
    color: #cecece;
    background-color: transparent!important;
}

.bonuses-block-details {
    display: none;
    background-color: #2e2f44;
    border-radius: 3px;
}

.bonuses-block-details-status {
    color: #1ca800;
    display: block;
    font-size: 1.2em;
    text-align: center;
    padding: 0.5em 0;
    text-transform: uppercase;
}

.bonuses-block-details-status-active { color: #42B742; }
.bonuses-block-details-status-closed { color: #666; }
.bonuses-block-details-status-new { color: #2EBCBC; }

.bonuses-block-details-activity {
    width: 20rem;
    margin: 0 auto;
}
.bonuses-block-details-terms {
    padding: 2em 1em;
    margin: 1em 0.875rem;
    line-height: 1.6em;
    border-top: 5px solid #ffa500;
    border-bottom: 5px solid #ffa500;
    background-color: #171822;
    color: #c2c2c2;
    border-radius: 3px;
    columns: 3;
    column-gap: 5em;
}

.bonuses-block-details-terms h3 {
    color: #fff;
}
.bonus-total { fill: #fff; font-size: 0.8em; font-weight: 900; }
.bonus-total-sup { fill: #fff; font-size: 0.8em; font-weight: 900; }
.bonus-current { fill: #fff; font-size: 1em!important; font-weight: 100; }
.bonus-current-sup { fill: #fff; font-size: 0.8em; font-weight: 100; }
.bonus-aux { font-size: 0.7em; fill: #000; font-weight: 400; }
.bonus-currency { font-size: 0.5em; fill: #fff; }

.bonuses-block-details-button {
    min-width: 200px;
    border-radius: 3px;
    border: none;
    text-align: center;
    text-transform: uppercase;
    padding: 0.5em 2em;
    font-size: 1em;
    margin: 0.25em 0.5em;
    cursor: pointer;
}
.bonuses-block-details-button-cashback {
    background-color: #ffa500;
}

.bonuses-block-details-button-cashback:hover {
    background-color: #ff8e00;
    transition: 0.5s;
}

.bonuses-block-details-buttons {
    display: flex;
    justify-content: center;
    padding: 0.5em 0;
}

.bonuses-block-details-button-accept { background-color: #71a605; color: #fff; }
.bonuses-block-details-button-decline { background-color: #f82828; color: #fff; }
.bonuses-block-details-button-cancel { background-color: #4571cc; color: #fff; }


.user-bonuses-request-cashback-disabled { opacity: 0.3; cursor: not-allowed; }


.active {
    -moz-animation: active 2s linear infinite;
    animation: active 2s linear infinite;
}
@keyframes active {
    0% { background-color: #0b4200; }
    50% { background-color: #42B742; }
    100% { background-color: #0b4200; }
}

.new {
    -moz-animation: new 2s linear infinite;
    animation: new 2s linear infinite;
}
@keyframes new {
    0% { background-color: #1a6565; }
    50% { background-color: #43f8ff; }
    100% { background-color: #1a6565; }
}

.closed {
    background-color: #666;
}