@import '../environment';

main
{
    td.level .value
    {
        @include antialiasing;
        @include font-dimensions(14px, steps(3), 0.6px);

        display: block;
        width: steps(3);
        height: steps(3);
        border-radius: 50%;

        color: $color-background-lightest;
        background: $color-brand-darker;
        text-align: center;
    }

    td.discount
    {
        dt, dd
        {
            display: inline-block;
            vertical-align: top;
        }

        dt
        {
            width: 27%;
            padding-top: 2px;
            padding-bottom: 8px;

            font-weight: bold;
            white-space: nowrap;
        }

        dd
        {
            @include baseline-box(14px, steps(2), 0.6px);

            width: 73%;

            color: $color-text-normal;
        }
    }

    @include for-at-least-tablets
    {
        td.level
        {
            width: 16%;
        }

        td.agreement
        {
            width: 20%;
        }

        td.bonus
        {
            width: 19%;

            white-space: nowrap;
        }

        td.discount
        {
            min-width: steps(24);

            dt
            {
                padding-top: 0;
                padding-bottom: 0;
            }
        }
    }
}
