// =============================================================================
// DISPLAY (Tools)
// =============================================================================


@mixin u-display($variant, $important: null) {

    @if $variant == "none" {

        display: none $important;

    }
    @else if $variant == "block" {

        display: block $important;

    }
    @else if $variant == "inlineBlock" {

        // ---------------------------------------------------------------------
        //
        // 1. Fix for Firefox bug: an image styled `max-width:100%` within an
        //    inline-block will display at its default size, and not limit its
        //    width to 100% of an ancestral container.
        //
        // ---------------------------------------------------------------------

        display: inline-block $important;
        max-width: 100% $important; // 1
    }
}

@mixin u-hidden($variant, $important: null) {

    @if $variant == "fully" {

        display: none $important;

    }
    @else if $variant == "visually" {

        border: 0 $important;
        clip: rect(1px, 1px, 1px, 1px) $important;
        height: 1px $important;
        overflow: hidden $important;
        padding: 0 $important;
        position: absolute $important;
        width: 1px $important;
    }
}