@import '../../../../_common/scss/_main';

.OrderInfoOrder {
    &__item {
        color: $primary-text-color;

        &__wrap {
            white-space: nowrap;
        }

        &__icon {
            position: relative;
            &.icon-Group {
                top: 2px;
            }
            &.icon-Individual {
                top: 1px;
            }
        }
    }

    &__link {
        margin-top: $gutter;
        display: block;
        &:hover, &:active {
            text-decoration: none;
        }

        &__points {
            justify-content: flex-start;
            align-items: flex-start;

            &__trophy.icon-trophy {
                font-size: 24px;
            }

            &__copy {
                position: relative;
                font-size: $font-size-h6;
            }

            &__rightArrow {
                padding-left: $gutter-small;

                &:before {
                    content: '';
                    display: inline-block;
                    position: absolute;
                    top: 7px;
                    z-index: 1;
                    @include triangle('right', 4px, $primary-color);
                }
            }

            // this odometer component could use some work
            .odometer {
                line-height: $font-line-height-h3;

                .odometer-digit {
                    height: inherit;
                    line-height: $font-line-height-h3;

                    &:after {
                        background-image: none;
                    }

                    .odometer-digit-spacer {
                        height: inherit;
                        line-height: $font-line-height-h3;
                    }
                }
            }
        }
    }

    &__item,
    &__link {
        margin-bottom: 0;
        line-height: $font-line-height-h3;
    }

    &__points {
        margin-top: $gutter;
    }
}