/*   ==================================================
              product-category grid
    ================================================== */
.meafe-product-cat-grid-wrapper {

    .meafe-prod-cat-grid-innerwrapper {
        .meafe-cat-grid-wrapper {
            .meafe-cat-grid-item {
                .meafe-entry-media {

                    svg,
                    img {
                        vertical-align: middle;
                    }
                }

                .product-cat-meta {
                    .category-title {
                        font-weight: 500;
                        font-size: 20px;
                        line-height: 1.5em;
                        margin-bottom: 0;
                        transition: all 0.235s ease-in-out;

                        .cat-count {
                            font-size: 14px;
                            font-weight: 400;
                            font-style: italic;
                            display: inline-flex;
                            margin-left: 4px;
                        }
                    }

                    .product-btn-wrapper {
                        margin-top: 16px;
                        font-size: 16px;
                        font-weight: 500;
                        line-height: 1.85em;

                        .product-btn {
                            transition: all 0.235s ease-in-out;
                            display: inline-flex;
                        }

                        .product-btn-icon {
                            display: inline-flex;
                            margin-left: 6.25px;
                            transition: all 0.235s ease-in-out;
                            color: #f29f05;
                        }

                        &:hover {
                            .product-btn-icon {
                                margin-left: 8px;
                            }

                            .product-btn {
                                color: #f29f05;
                            }
                        }
                    }
                }
            }
        }
    }

    &.layout-1 {
        .meafe-cat-grid-wrapper {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: -15px 0;

            @media (min-width: 575px) {
                flex-direction: row;
                flex-wrap: wrap;
                margin: -15px;
                align-items: flex-start;
            }

            .meafe-cat-grid-item {
                max-width: 100%;
                padding: 15px 0;

                @media (min-width: 575px) {
                    flex: 50%;
                    padding: 15px;
                    max-width: 50%;
                }

                @media (min-width: 768px) {
                    flex: 33.33%;
                    max-width: 33.33%;
                }

                a {
                    display: block;
                    position: relative;
                }

                .meafe-entry-media {
                    height: 370px;
                    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.03);

                    svg,
                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: 16px;
                    }
                }

                .product-cat-meta {
                    position: absolute;
                    bottom: 0;
                    width: 100%;
                    left: 0;
                    background: linear-gradient(0deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
                    padding: 40px 24px 24px;
                    border-radius: 0 0 16px 16px;

                    .category-title {
                        color: #fff;

                        &:hover {
                            color: #547c0e;
                        }
                    }

                    .product-btn-wrapper {
                        color: #ffffff;
                        display: flex;
                        align-items: center;

                    }
                }
            }
        }

    }

    &.layout-2 {
        .meafe-cat-grid-wrapper {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: 0;
            grid-gap: 30px;

            @media (min-width: 769px) {
                flex-direction: row;
                flex-wrap: wrap;
                align-items: flex-start;

            }

            .meafe-cat-grid-big-wrapper {
                max-width: 100%;
                display: flex;
                flex-direction: column;
                grid-gap: 30px;

                @media (min-width: 769px) {
                    flex: calc(50% - 15px);
                    max-width: calc(50% - 15px);

                }

                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }



            .meafe-cat-grid-small-wrapper {
                display: flex;
                flex-direction: column;
                align-items: center;
                grid-gap: 30px;

                @media (min-width: 500px) {
                    flex-direction: row;
                    flex-wrap: wrap;
                    align-items: flex-start;
                }

                .meafe-cat-grid-item {
                    max-width: 100%;
                    width: 100%;
                    padding: 0;

                    @media (min-width: 500px) {
                        flex: calc(50% - 15px);
                        max-width: calc(50% - 15px);
                    }


                }
            }

            .meafe-cat-grid-item {

                a {
                    display: block;
                    position: relative;
                }

                .meafe-entry-media {
                    margin: 0;
                    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.03);

                }

                .product-cat-meta {
                    position: absolute;
                    bottom: 0;
                    left: 0;
                    min-width: 164px;
                    background-color: #fff;
                    padding: 8px 16px;

                    .category-title {
                        color: #26291f;

                        &:hover {
                            color: #547c0e;
                        }

                        .cat-count {
                            display: block;
                        }
                    }

                    .product-btn-wrapper {
                        margin-top: 5px;
                        color: #26291f;
                        display: flex;
                        align-items: center;

                    }
                }
            }

            .meafe-cat-grid-end-wrapper {
                display: flex;
                flex-direction: column;
                width: 100%;
                grid-gap: 30px;

                @media (min-width: 769px) {
                    flex-direction: row;
                    flex-wrap: wrap;
                }

                .meafe-cat-grid-item {
                    @media (min-width: 769px) {
                        flex: calc(50% - 15px);
                        max-width: calc(50% - 15px);
                    }
                }

            }
        }
    }

    &.layout-3 {
        .meafe-cat-grid-wrapper {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin: -15px 0;

            @media (min-width: 360px) {
                flex-direction: row;
                flex-wrap: wrap;
                align-items: flex-start;
                margin: -15px;
                justify-content: center;
            }

            .meafe-cat-grid-item {
                max-width: 100%;
                padding: 15px 0;

                @media (min-width: 360px) {
                    flex: 50%;
                    max-width: 50%;
                    padding: 15px;
                }

                @media (min-width: 575px) {
                    flex: 33.33%;
                    max-width: 33.33%;
                }

                @media (min-width: 767px) {
                    flex: 25%;
                    max-width: 25%;
                }

                @media (min-width: 992px) {
                    flex: 20%;
                    max-width: 20%;
                }

                @media (min-width: 1200px) {
                    flex: 16.66%;
                    max-width: 16.66%;
                }

                a {
                    display: block;
                    position: relative;
                }

                .meafe-entry-media {
                    img {
                        box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.03);
                    }
                }

                .product-cat-meta {
                    padding: 16px 0 0;
                    border-radius: 0 0 16px 16px;

                    .category-title {
                        color: #26291f;

                        &:hover {
                            color: #547c0e;
                        }

                        .cat-count {
                            display: block;
                            margin: 4px 0 0 0;
                        }
                    }

                    .product-btn-wrapper {
                        color: #26291f;
                        display: flex;
                        align-items: center;

                    }
                }

            }
        }
    }
}

// alignment center
.meafe-product-cat-grid-content-align-center {
    .meafe-cat-grid-item {
        text-align: center;

        .product-btn-wrapper {
            justify-content: center;
        }

    }
}

// alignment left
.meafe-product-cat-grid-content-align-left {
    .meafe-cat-grid-item {
        text-align: left;

        .product-btn-wrapper {
            justify-content: flex-start;
        }

    }
}

// alignment right
.meafe-product-cat-grid-content-align-right {
    .meafe-cat-grid-item {
        text-align: right;

        .product-btn-wrapper {
            justify-content: right;
        }

    }
}