@mixin limitGlyph($iconColor, $glyph: $glyph-icon-alert-triangle) {
    &:before {
        color: $iconColor;
        content: $glyph;
        font-family: symbolsfont;
        font-size: 0.8em;
        display: inline;
        margin-right: $interiorMarginSm;
    }

}

.s-limit-red { background: $colorLimitRedBg !important; }
.s-limit-yellow { background: $colorLimitYellowBg !important; }

// Handle limit when applied to a tr
tr[class*="s-limit"] {
    &.s-limit-red td:first-child {
        @include limitGlyph($colorLimitRedIc);
    }
    &.s-limit-yellow td:first-child {
        @include limitGlyph($colorLimitYellowIc);
    }
    &.s-limit-upr td:first-child:before { content: $glyph-icon-arrow-double-up; }
    &.s-limit-lwr td:first-child:before { content: $glyph-icon-arrow-double-down; }
}

// Handle limit when applied directly to a non-tr element
// Assume this is applied to the element that displays the limit value
:not(tr)[class*="s-limit"] {
    &.s-limit-red {
        @include limitGlyph($colorLimitRedIc);
    }
    &.s-limit-yellow {
        @include limitGlyph($colorLimitYellowIc);
    }
    &.s-limit-upr:before { content: $glyph-icon-arrow-double-up; }
    &.s-limit-lwr:before { content: $glyph-icon-arrow-double-down; }
}