//Product list

.product-list {
    top: -@reflex-cell-spacing-md;

    &--shadow {
        border-radius: @global-radius / 2;
        box-shadow: 0 0 4px 1px rgba(@font-color, .1);
        transition: all .3s ease;

        &:hover {
            box-shadow: 0 0 4px 2px rgba(@font-color, .2);
        }
    }
}

.product-list__condensed-title {
    width: ~"calc(100% - 40px)";
}

.product-list-products-counter {
    font-size: 14px;
    font-weight: 500;
    margin-top: 0.5em;
    margin-left: 0.5em;
}

//The List view
.product-list__list-item {
    border: 1px solid @white;
    transition: 0.2s all ease-out;
}

.product-list__list-item__left {
    border-top: 1px solid @gray-light;
}

.product-list__list-item__right {
    border-top: 1px solid @gray-light;
    padding: @reflex-cell-spacing-lg;
}

@media (max-width: @reflex-sm) {
    .product-list__list-item__right {
        border: none;
    }
}

.product-list__list-item__price-actions {
    float: right;
    text-align: right;
}

//The Grid view
.product-list__grid-item {
    transition: 0.2s all ease-out;
}

.product-list__grid-item__image {
    border: 1px solid @gray-light;
    background-color: @white;
    transition: 0.2s all ease-out;
}

.product-list__grid-item__price-info {
    border-right: 1px solid @gray-light;
    border-left: 1px solid @gray-light;
    padding: @reflex-cell-spacing-lg;
    padding-bottom: 0;
    background-color: @white;
    text-align: center;
    height: 100%;
    transition: 0.2s all ease-out;
}

.product-list__grid-item__footer {
    border-right: 1px solid @gray-light;
    border-left: 1px solid @gray-light;
    border-bottom: 1px solid @gray-light;
    padding: @reflex-cell-spacing-lg;
    background-color: @white;
    text-align: center;
    transition: 0.2s all ease-out;
}

//The details view
.product-list__details-item {
    height: 100%;
    border-top: 1px solid @gray-light;
    padding: @reflex-cell-spacing-sm 0;
    transition: 0.2s all ease-out;
    flex-direction: row;
    align-items: center;
}

.product-list__details-item__left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.product-list__details-item__right {
    display: flex;
    height: 100%;
    padding-right: @reflex-cell-spacing-md;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    position: unset;
}

.product-list__details-price {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 110px;
    align-items: flex-end;
    margin-right: @reflex-cell-spacing-md;
}

.product-list__details-favorites {
    align-self: center;
    margin-left: @reflex-cell-spacing-md;
}

.product-list__details-actions {
    min-width: 140px;
}

.product-list__details-image {
    min-width: 75px;
}

//Facets
.facets-container__box {
    border: 1px solid @gray-light;
    background-color: @white;
}

.facets-container__header {
    padding: @reflex-cell-spacing-lg @reflex-cell-spacing-md;
    border-top: 1px solid @gray-light;
    margin-bottom: 0;
}


.facets {

    &-container {

        &__list {
            padding: @reflex-cell-spacing-md;
            overflow-y: auto;

            &.is-open {
                max-height: none !important;
            }

            &--more {
                overflow: hidden;
            }
        }

        &__more {
            position: relative;
            padding: @reflex-cell-spacing 0;

            &.is-toggled {
                &::before {
                    opacity: 0;
                }
            }

            &::before {
                content: '';
                position: absolute;
                bottom: 100%;
                left: 0;
                width: 100%;
                height: 100px;
                z-index: @z-index-1;
                background-image: linear-gradient(to top, @white, transparent);
                pointer-events: none;
                transition: all .3s ease;
            }

            &-button {
                .is-toggled & {
                    i {
                        transform: rotate(180deg);
                    }
                }
            }
        }
    }
}


//checbox facets

.checkbox-facet {
    display: flex;
    margin-bottom: @reflex-cell-spacing-md;
}

input[type="checkbox"].form__control + label.checkbox-facet {
    display: flex;
}

.checkbox-facet__label {
    word-break: break-all;
    display: inline-block;
    padding: 0 6px 0 4px;
}

.checkbox-facet__count {
    color: @gray-light;
}

@media (min-width: @reflex-md) {
    .facets-container-trigger {
        display: none !important;
    }

    .facets-container--top,
    .facets-container--top.expandable--collapsed {
        display: flex !important;
    }

    .facets-container--left,
    .facets-container--left.expandable--collapsed {
        display: block !important;
    }
}

.product-list__details-units-selector--separated {
    margin-right: @reflex-cell-spacing-md;
}


//mobile view


@media (max-width: 730px) {
    .product-list__details-item {
        flex-direction: column;
        align-items: unset;
    }

    .product-list__details-favorites {
        position: absolute;
        top: @reflex-cell-spacing-md;
        right: @reflex-cell-spacing-md;
        margin: 0;
    }

    .product-list__details-price {
        order: 2;
        margin-right: 0;
        margin-bottom: @reflex-cell-spacing-md;
    }

    .product-list__details-info {
        padding-right: 35px; //favorite icon margin
    }

    .product-list__details-units-selector--separated {
        order: 3;
        margin-right: @reflex-cell-spacing-md;
    }

    .product-list__details-right-bottom-section {
        flex-wrap: wrap;
        justify-content: flex-end;

        &::after {
            content: "";
            width: 100%;
            order: 2;
        }
    }

    .product-list__details-actions {
        min-width: unset;
        order: 4;
    }
}



//Tiles view
.favorites--for-tiles-view {
    top: 0;
    position: absolute;
    right: 0;
    margin: 0.5em;
}