.products > .product{
    .product-outer {
        height: 100%;
    }
}

.products > .product,
.owl-item > .product {
    border-bottom: 1px solid lighten($border-color, 5%);

    @include media-breakpoint-up(md) {
        border-bottom-width: 0;
    }

    &::after {
        content: '';
        border-right: 1px solid lighten($border-color, 5%);
        display: block;
        position: absolute;
        top: 50%;
        right: 0;
        height: 70%;
        transform: translateY(-50%);
    }

    .product-inner {
        padding: 1em;
        position: relative;
    }

    .loop-product-categories {
        margin-bottom: .4em;
        font-size: .8em;
        line-height: 1.05em;
        height: 1.1em;
        display: block;
		overflow: hidden;

        a {
            color: lighten($link-color, 30%);

            &:hover,&:focus {
                color: $link-color;
            }
        }
    }

    .woocommerce-LoopProduct-link {
        display: block;
    }

    .price-add-to-cart {
		clear: both;
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center;
        height: 2.571em;
	}

    .product-thumbnail {
        margin-bottom: 0.714em;
        width: 100%;
        position: relative;
    }

    .onsale {
        font-size: 0.857em;
        text-align: center;
        line-height: 2.000em;
        min-width: 40px;
        background-color: #44b81b;
        color: $white;
        font-weight: 700;
        position: absolute;
        margin: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
    }

    .wp-post-image, .product-thumbnail > img {
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
    }

    .added_to_cart, .add-to-cart-wrap .button {
		float: right;
		background-color: transparent;
		text-indent: -99999px;
		padding: 0;
        border-width: 0;

		&:hover,&:focus {
			background-color: transparent;
		}

		&::before {
			@include fa-icon();
			border-radius: 50%;
			color: $white;
			font-size: 18px;
			padding: 0.5em 0.433em;
		}
	}

	.added_to_cart, .add-to-cart-wrap .button {
		&::before {
			content: "\f30b";
			padding: 0.5em 0.504em;
			float: right;
			text-indent: 0;
			line-height: 16px;
			@include fa-fas;
		}
	}

    .hover-area {
		display: none;
		border: none;
		position: relative;
		background-color: $white;

		.button {
			position: absolute;
			top: -20px;
			left: 50%;
			white-space: pre;
			transform: translateX(-50%);

			&:hover, &:active, &:focus {
				color: $white;
			}
		}

		.action-buttons {
			width: 100%;
			font-size: 0.929em;
			line-height: 1.385em;
			display: flex;
			justify-content: space-around;
			align-items: center;

			.clear {
				display: none;
			}

			div, a, span, p {
				margin: 0;
				padding: 0;
				color: lighten($body-color, 35%);

                &:hover {
    				color: $body-color;
    			}
			}

			> div, > a {
				padding-top: 0.571em;
			}
		}
	}

	.button {
		&.add_to_cart_button {
			&::before {
				content: "\61";
				font-family: "font-electro";
				padding: 8.94px 8px;
				font-weight: normal;
			}
		}

		&.product_type_variable {
			&::before {
				content: "\f0a6";
				padding: 0.5em 0.575em;
				@include fa-far;
			}
		}

		&.product_type_external {
			&::before {
				content: "\f360";
				padding: 0.5em 0.504em;
				float: right;
			    text-indent: 0;
				@include fa-fas;
			}
		}

		&.added {
			display: none;
		}
	}

    .price {
        font-size: 1.143em;
        line-height: 1em;
		font-weight: normal;

		ins {
			color: $danger;
            text-decoration: none;
		}

		del {
			color: lighten($body-color, 30%);
			font-size: 0.6em;
			line-height: 1.5em;
		}
    }

    .add-to-cart-wrap {
        display: none;

        &.show-in-mobile {
            display: block;
        }
    }

    .product-loop-body {
        display: none;

        .product-rating {
            margin-bottom: 1.667em;
            font-size: .857em;
            color: lighten($body-color, 25%);
        }

        .star-rating {
            display: inline-block;
        }

        .product-short-description {
            color: lighten($body-color, 25%);
            font-size: .857em;
            line-height: 1.75em;
            margin-bottom: 3em;
            height: 7em;
            overflow: hidden;

            ul {
                padding-left: 18px;
            }
        }

        .product-sku {
            font-size: .857em;
            color: lighten($body-color, 25%);
            margin-bottom: .5em;
        }
    }

    @include media-breakpoint-up(xl) {
        &:hover, &.hover {
            z-index: 999;
            position: relative;

            &:after {
                content: none !important;
            }

            .product-inner {
                position: absolute;
                width: 100%;
                height: auto;
                min-height: 100%;
                box-shadow: 0px 0px 6px 0px rgba(1, 1, 1, 0.3);
                background-color: $white;
            }

            .hover-area {
                display: block;
                padding-top: 0.214em;
                border-top: 1px solid lighten($border-color, 5%);
            }
        }

        &::after {
            height: 80%;
        }

        &.product-card::after {
            height: 70%;
        }

        .product-inner {
            padding: 1.429em 1.714em 1em 1.714em;
        }

        .loop-product-categories {
            margin-bottom: 1em;
            font-size: .857em;
            line-height: 1.05em;
            height: 1.05em;
        }

        .price-add-to-cart {
            margin-bottom: 0.5em;
        }

        .price {
            font-size: 1.429em;
        }

        .add-to-cart-wrap {
            display: block;
        }

        .hover-area {
            .action-buttons {
                flex-wrap: wrap;
            }
        }
    }
}

li.product,
.owl-item > .product {
    .added_to_cart, .add-to-cart-wrap .button {
		&::before {
			background-color: lighten($border-color, 5%);
        }
    }
}

ul.products {
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0;
    @include list-unstyled;

    &[data-view="grid-extended"],
    &[data-view="list-view"],
    &[data-view="list-view-small"] {
        .product-loop-body {
            display: block;
        }
    }

    &[data-view="grid-extended"] {
        .product-loop-header {
            .woocommerce-loop-product__title,
            .loop-product-categories {
                display: none;
            }
        }
    }

    > li.product {
        position: relative;

        &:nth-last-child(2),
        &:last-child {
            border-bottom-width: 0;
        }

        @include media-breakpoint-down(sm) {
            &:nth-child(even) {
                @include remove-after-border();
            }
        }

        @include media-breakpoint-only(md) {
            &:nth-child(3n), &:last-child {
                @include remove-after-border();
            }
        }
    }

    &.row-cols-xl-1 {
        > li.product {
            @include media-breakpoint-only(xl) {
                @include remove-after-border();
            }
        }
    }

    &.row-cols-xxl-1 {
        > li.product {
            @include media-breakpoint-up(xxl) {
                @include remove-after-border();
            }
        }
    }

    &.row-cols-xl-2 {
        > li.product {
            @include media-breakpoint-only(xl) {
                &:nth-child(2n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xxl-2 {
        > li.product {
            @include media-breakpoint-up(xxl) {
                &:nth-child(2n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xl-3 {
        > li.product {
            @include media-breakpoint-only(xl) {
                &:nth-child(3n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xxl-3 {
        > li.product {
            @include media-breakpoint-up(xxl) {
                &:nth-child(3n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xl-4 {
        > li.product {
            @include media-breakpoint-only(xl) {
                &:nth-child(4n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xxl-4 {
        > li.product {
            @include media-breakpoint-up(xxl) {
                &:nth-child(4n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xl-5 {
        > li.product {
            @include media-breakpoint-only(xl) {
                &:nth-child(5n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xxl-5 {
        > li.product {
            @include media-breakpoint-up(xxl) {
                &:nth-child(5n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xl-6 {
        > li.product {
            @include media-breakpoint-only(xl) {
                &:nth-child(6n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xxl-6 {
        > li.product {
            @include media-breakpoint-up(xxl) {
                &:nth-child(6n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xl-7 {
        > li.product {
            @include media-breakpoint-up(xl) {
                @include make-col(1.71428571);

                &:nth-child(7n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-xl-8 {
        > li.product {
            @include media-breakpoint-up(xl) {
                @include make-col(1.5);

                &:nth-child(8n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &.row-cols-lg-5 {
        > li.product:not(.product-card) {
            @include media-breakpoint-only (lg) {
                &:nth-child(5n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }

    &[data-view="list-view"],
    &[data-view="list-view-small"] {
        > li.product {
            @include make-col(12);

            &:not(:last-child) {
                border-bottom-width: 1px;
            }

            &::after {
                content: none;
            }

            .product-item {
                &__inner {
                    @include make-row();
                    padding: 20px 15px;
                    margin: 0;
                    position: relative;

                    > * {
                        @include make-col-ready();
                    }
                }

                &__header {
                    @include make-col(5)
                    text-align: center;

                    .loop-product-categories,
                    .woocommerce-loop-product__title {
                        display: none;
                    }
                }

                &__body {
                    @include make-col(7)

                    .woocommerce-loop-product__link {
                        > *:not(.woocommerce-loop-product__title) {
                            display: none;
                        }
                    }

                    @include media-breakpoint-up(md) {
                        .product-short-description {
                            margin-bottom: 1.5em;
                        }
                    }

                    @include media-breakpoint-up(lg) {
                        .product-short-description {
                            margin-bottom: 2em;
                        }
                    }
                }

                &__footer {
                    left: calc(40% + 7.5px);
                    position: absolute;
                    bottom: 10px;

                    .onsale {
                        left: 0;
                        top: 30px;
                        display: none;

                        @include media-breakpoint-up(md) {
                            display: block;
                        }
                    }

                    .hover-area,.add-to-cart-wrap {
                        display: none;
                    }

                    @include media-breakpoint-up(md) {
                        .action-buttons {
                            flex-direction: column;
                        }
                    }

                    @include media-breakpoint-up(xl) {
                        .action-buttons {
                            flex-direction: row;
                        }
                    }
                }

                &__thumbnail {
                    margin-bottom: 0;
                }

                @include media-breakpoint-up(md) {
                    &__footer {
                        position: static;
                        left: auto;
                        bottom: auto;

                        .hover-area,.add-to-cart-wrap {
                            display: block;
                        }
                    }

                    &__body {
                        .woocommerce-loop-product__link {
                            > *:not(.woocommerce-loop-product__title) {
                                display: block;
                            }
                        }
                    }

                    &__inner {
                        padding: 30px 15px;
                    }
                }
            }

            @include media-breakpoint-up(xl) {
                &:hover, &.hover {
                    .product-inner {
                        box-shadow: none;
                        position: relative;
                    }
                }

                .hover-area {
                    display: block;
                }
            }
        }
    }

    &[data-view="list-view"] {
        > li.product {
            .product-item {
                @include media-breakpoint-up(md) {
                    &__header {
                        @include make-col(4)
                    }

                    &__body {
                        @include make-col(5)
                    }

                    &__footer {
                        @include make-col(3)

                        .price-add-to-cart {
                            display: block;
                            height: auto;

                            .price {
                                margin-bottom: .714em;
                                display: block;
                            }
                        }

                        .add-to-cart-wrap {
                            a {
                                font-size: inherit;
                                float: none;
                                background-color: inherit;
                                display: block;
                                padding: 10px 25px;
                                text-align: center;
                                font-weight: 700;
                                text-indent: 0;
                                color: $white;
                                margin-bottom: 10px;
                                width: 100%;

                                &:hover,&:focus {
                                    background-color: $body-color;
                                }

                                &::before {
                                    display: none;
                                }
                            }

                            &.added .button {
                                display: none;
                            }

                            .added_to_cart {
                                border-radius: 1.375rem;
                            }
                        }
                    }
                }
            }

            .hover-area {
                border-top-width: 0;
                padding-top: 0;
            }
        }
    }

    &[data-view="list-view-small"] {
        > li.product {
            .product-item {
                @include media-breakpoint-up(md) {
                    &__header {
                        @include make-col(2)
                    }

                    &__body {
                        @include make-col(7)
                    }

                    &__footer {
                        @include make-col(3)
                    }
                }
            }

            .hover-area {
                border-top: 1px solid lighten($border-color, 5%);
                padding-top: .214em;
                margin-top: 1em;
            }
        }
    }
}

@include media-breakpoint-up(xxl) {
    ul.products[data-view="grid"].row-cols-xxl,
    ul.products[data-view="grid-extended"].row-cols-xxl {
        &-9 {
            > li.product {
                @include make-col(1.33333333);

                &:nth-child(9n), &:last-child {
                    @include remove-after-border();
                }
            }
        }

        &-10 {
            > li.product {
                @include make-col(1.2);

                &:nth-child(10n), &:last-child {
                    @include remove-after-border();
                }
            }
        }
    }
}

.woocommerce-loop-product__title {
    font-weight: bold;
    overflow: hidden;
    font-size: 0.857em;
    line-height: 1.167em;
    height: 2.334em;
    color: $product-title-color;

    @include media-breakpoint-up(lg) {
        font-size: 1em;
        line-height: 1.28572em;
        height: 2.57144em;
    }
}

.products.show-btn {
    > li.product {
        .price-add-to-cart {
            flex-wrap: wrap;
        }

        .button, .added_to_cart {
            margin-top: 0;
            color: $white;
            width: auto;
            text-indent: 0;
            font-weight: bold;
            font-size: 13px;
            padding: 0.5em 1.385em;
            border-radius: 1.4em;

            &:hover,&:focus {
                background-color: $body-color;
            }

            &:before {
                padding: 0;
                background: transparent;
                float: left;
                margin-top: 4px;
                margin-right: 8px;
            }
        }

        .added_to_cart {
            &:before {
                content: none;
            }
        }
    }
}