/**
 * @copyright   2010-2015, The Titon Project
 * @license     http://opensource.org/licenses/BSD-3-Clause
 * @link        http://titon.io
 */

@import "../common";

@include export("type-ahead") {
    #{$typeAhead-class} {
        position: absolute;
        top: 0;
        z-index: $typeAhead-zindex;
        opacity: 0;
        visibility: hidden;
        transition: opacity $typeAhead-transition, visibility $typeAhead-transition;

        // Fixes issues where menu does not display in iOS
        // Kind of hacky? Other solutions?
        -webkit-backface-visibility: hidden;

        ul {
            @include reset-list;
            min-width: 200px;
        }

        li {
            > a {
                padding: $small-padding;
                line-height: 100%;
                display: block;
                text-decoration: none;
            }

            > a:hover,
            &.is-active a {}
        }
    }

    #{$typeAhead-class-heading} {
        padding: $small-padding;
        line-height: 100%;
        display: block;
        text-decoration: none;
    }

    #{$typeAhead-class-highlight} {
        background: #fff;
        padding: 0;
    }

    #{$typeAhead-class-description} {
        display: block;
        font-size: .7rem;
    }

    #{$typeAhead-class-shadow} {
        position: relative;

        .is-shadow {
            color: gray;
        }

        .not-shadow {
            background: transparent;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
            zoom: 1;
        }
    }
}
