// @import "../core/core";

//  = SIMPLE LISTS
//  ---------------------------------------------------------------------------
@mixin dc-list {
    margin: 0 0 $dc-space150;
    padding: 0;
    list-style-type: none;
}

@mixin dc-list--is-ordered {
    padding-left: $dc-space150;
    list-style-type: decimal;
}

@mixin dc-list--is-unordered {
    padding-left: $dc-space150;
    list-style-type: disc;
}

@mixin dc-dt {
    font-family: $dc-base-font-family;
}

@mixin dc-list__item--is-interactive {

    &:hover {
        border-top-color: $dc-blue60;
        border-bottom-color: $dc-blue60;
        background: $dc-blue70;
        cursor: pointer;

        + .dc-list__item--is-interactive {
            border-top-color: $dc-blue60;
        }
    }
}


//  = SCROLLABLE LIST
//  ---------------------------------------------------------------------------

@mixin dc-list--is-scrollable {
    height: $dc-space350 * 3;
    border: 1px solid $dc-gray60;
    border-radius: 2px;
    background: $dc-white;
    overflow-y: scroll;
}

@mixin dc-list__item {
    margin-top: -1px;
    padding: $dc-space50 $dc-space75;
    border-top: 1px solid $dc-gray70;
    border-bottom: 1px solid $dc-gray70;
}

@mixin dc-list__inner {
    display: flex;
    align-items: stretch;
    margin: -$dc-space50 #{-$dc-space75};

    > * {
        min-width: 0;
    }
}

@mixin dc-list__img {
    flex: 0 0 auto;
}

@mixin dc-list__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
}

@mixin dc-list__title {
    line-height: $dc-space150;
}

@mixin dc-list__action {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    justify-content: center;
    width: $dc-touch-size;
    font-size: 1.6rem;
    text-align: center;
}

@mixin dc-list-selectors {

    //  = SIMPLE LISTS
    //  ---------------------------------------------------------------------------
    .dc-list {
        @include dc-list;
    }

    .dc-list--is-ordered {
        @include dc-list--is-ordered;
    }

    .dc-list--is-unordered {
        @include dc-list--is-unordered;
    }

    .dc-dt {
        @include dc-dt;
    }

    .dc-list__item--is-interactive {
        @include dc-list__item--is-interactive;
    }

    //  = SCROLLABLE LIST
    //  ---------------------------------------------------------------------------

    .dc-list--is-scrollable {
        @include dc-list--is-scrollable;
    }

    .dc-list__item {
        @include dc-list__item;
    }

    .dc-list__inner {
        @include dc-list__inner;
    }

    .dc-list__img {
        @include dc-list__img;
    }

    .dc-list__body {
        @include dc-list__body;
    }

    .dc-list__title {
        @include dc-list__title;
    }

    .dc-list__action {
        @include dc-list__action;
    }
}