// /**
//  * Copyright © Magento, Inc. All rights reserved.
//  * See COPYING.txt for license details.
//  */

//
//  Common
//  _____________________________________________

& when (@media-common = true) {
    .toolbar {
        &.wishlist-toolbar {
            .limiter {
                float: right;
            }
            .main .pages {
                display: inline-block;
                position: relative;
                z-index: 0;
            }
            .toolbar-amount,
            .limiter {
                display: inline-block;
                z-index: 1;
            }
        }
    }

    .form.wishlist.items {
        .actions-toolbar {
            &:extend(.abs-reset-left-margin all);
        }
    }

    .product-social-links,
    .block-bundle-summary,
    .product-item,
    .table-comparison {
        .action.towishlist {
            &:extend(.abs-actions-addto all);
            .lib-icon-font-symbol(
            @_icon-font-content: @icon-wishlist-full,
            @_icon-font-position: before
            );
        }
    }

    .account .table-wrapper .data.table.wishlist {
        .lib-table-bordered(
        @_table_type: horizontal
        );

        thead > tr > th {
            border-bottom: 0;
        }

        tbody > tr:last-child > td {
            border-bottom: 1px solid @table__border-color;
        }

        .product.name {
            display: inline-block;
            margin-bottom: @indent__s;
        }

        .box-tocart {
            margin: @indent__s 0;

            .qty {
                vertical-align: middle;
                &:extend(.abs-input-qty all);
            }
        }

        .col {
            &.item {
                width: 50%;
            }

            &.photo {
                max-width: 150px;
            }

            &.selector {
                max-width: 15px;
            }
        }

        textarea {
            margin: @indent__s 0;
        }

        .input-text.qty {
            margin-bottom: @indent__s;
        }

        .action.primary {
            vertical-align: top;
        }

        .price {
            font-weight: @font-weight__bold;
        }
    }

    .link.wishlist {
        .counter {
            .lib-css(color, @text__color__muted);
            white-space: nowrap;

            &:before {
                content: '(';
            }

            &:after {
                content: ')';
            }
        }
    }

    .block-wishlist {
        .block-title {
            &:extend(.abs-block-widget-title all);
        }

        .counter {
            &:extend(.abs-block-items-counter all);
        }

        .product-item-name {
            margin-right: @indent__m;
        }
    }

    .products-grid.wishlist {
        .product {
            &-item {
                margin-left: 2%;
                width: calc(~'(100% - 4%) / 3');

                &:nth-child(3n + 1) {
                    margin-left: 0;
                }

                &-photo {
                    display: block;
                    margin-bottom: @indent__s;
                }

                &-name {
                    margin-top: 0;
                }

                .price-box {
                    margin: 0;
                }

                .comment-box {
                    .label {
                        &:extend(.abs-visually-hidden all);
                    }
                }

                &-comment {
                    display: block;
                    height: 42px;
                    margin: @indent__s 0;
                }

                &-actions {
                    > * {
                        margin-right: 15px;

                        &:last-child {
                            margin-right: 0;
                        }
                    }
                }

                .box-tocart {
                    input.qty {
                        &:extend(.abs-input-qty all);
                    }

                    .tocart {
                        &:extend(.abs-revert-secondary-size all);
                    }
                }
            }
        }
    }
    .products-grid.wishlist {
        .product-item-actions {
            .action {
                &.edit,
                &.delete {
                    .lib-icon-font(
                    @icon-edit,
                    @_icon-font-size: 18px,
                    @_icon-font-line-height: 20px,
                    @_icon-font-text-hide: true,
                    @_icon-font-color: @minicart-icons-color,
                    @_icon-font-color-hover: @primary__color,
                    @_icon-font-color-active: @minicart-icons-color
                    );
                }

                &.delete {
                    .lib-icon-font-symbol(
                    @_icon-font-content: @icon-trash
                    );
                }
            }
        }
    }
}

//
//  Mobile
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
    .products-grid.wishlist {
        .product-item {
            border-bottom: 1px solid @secondary__color;
            margin: 0;
            width: 100%;

            &:first-child {
                border-top: 1px solid @secondary__color;
            }
        }
    }
}

.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
    .products-grid.wishlist {
        margin-bottom: @indent__l;
        margin-right: 0;

        .product {
            &-item {
                padding: @indent__base 0 @indent__base 0;
                position: relative;

                &-photo {
                    float: left;
                    margin-right: @indent__base;
                }

                &-name {
                    .lib-font-size(16);
                }

                &-actions {
                    display: block;
                    float: left;

                    .action {
                        margin-right: 15px;

                        &:last-child {
                            margin-right: 0;
                        }

                        &.edit,
                        &.delete {
                            margin-top: 7px;
                        }
                    }
                }

                &-name,
                &-description,
                .price-box,
                &-tooltip {
                    margin-left: 95px;
                }

                .box-tocart {
                    float: left;
                    margin-right: @indent__base;

                    .stock {
                        margin-top: 7px;
                    }
                }

                .giftregisty-dropdown,
                .field.qty {
                    display: none;
                }
            }

            &-image-container {
                max-width: 80px;
            }
        }
    }

    .wishlist-index-index {
        .product {
            &-item {
                width: 100%;

                &-info {
                    width: auto;
                }
            }
        }
    }

    .cart.table-wrapper {
        .towishlist {
            .lib-icon-font(
            @icon-wishlist-full,
            @_icon-font-size: 18px,
            @_icon-font-line-height: 20px,
            @_icon-font-text-hide: true,
            @_icon-font-color: @minicart-icons-color,
            @_icon-font-color-hover: @primary__color,
            @_icon-font-color-active: @minicart-icons-color
            );
            &:before {
                overflow: visible;
            }
        }
    }
}

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
    .wishlist-index-index {
        .products-grid {
            .product-item-actions {
                margin: 0;
            }
        }
    }
}

//
//  Desktop
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
    .products-grid.wishlist {
        .product {
            &-item {
                &-info {
                    &:hover {
                        .product-item-inner {
                            display: block;
                        }
                    }
                }

                &-tooltip {
                    display: inline-block;
                }

                &-actions {
                    margin: @indent__s 0 0;

                    > * {
                        display: inline-block;
                        margin-bottom: 7px;
                        margin-top: 7px;
                    }
                }

                .fieldset {
                    display: table;

                    .field.qty,
                    .product-item-actions {
                        display: table-cell;
                        vertical-align: bottom;
                    }

                    .field.qty {
                        padding-right: @indent__s;
                    }
                }

                .box-tocart {
                    .actions-primary {
                        margin: 0;
                    }

                    .stock {
                        margin: @indent__base 0 0;
                    }
                }

                .tocart {
                    width: auto;
                }
            }
        }
    }

    .wishlist-index-index {
        .product-item-info {
            width: auto;
        }
    }

    .wishlist-index-index {
        .product-item-inner {
            @_shadow: 3px 4px 4px 0 rgba(0, 0, 0, .3);

            .lib-css(background, @color-white);
            .lib-css(border, @border-width__base solid @color-gray-light2);
            .lib-css(box-shadow, @_shadow);
            border-top: none;
            left: 0;
            margin: 9px 0 0 -1px;
            padding: 0 9px 9px;
            position: absolute;
            right: -1px;
            z-index: 2;

            .comment-box {
                margin-top: -18px;
            }
        }
    }
}

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__l) {
    .wishlist-index-index {
        .products-grid {
            .product-items {
                margin: 0;
            }

            .product-item {
                margin-bottom: @indent__base;
                margin-left: calc(~'(100% - 4 * 24.439%) / 3');
                padding: 0;
                width: 24.439%;

                &:nth-child(4n + 1) {
                    margin-left: 0;
                }
            }
        }
    }
}
