.sf-addition-product-content {

    width: 100%;

    display: grid;

    grid-template-columns: 1fr;

    position: relative;



    .woocommerce-tabs.wc-tabs-wrapper {



        .tabs {

            list-style: none;

            overflow: hidden;

            position: relative;

            margin: 0 5px;

            display: flex;

            flex-direction: row;

            justify-content: flex-start;

            border-bottom: 1.5px solid #dcdcdc;

            padding: 5px 0;

            height: 48px;



            > li.active {



                a {

                    color: #3f3c5a;

                    font-size: 20px;

                }

            }



            > li {

                padding: 0;

                display: inline-flex;

                position: relative;

                margin: 0 15px 0 0;



                a {

                    text-decoration: none;

                    word-break: break-all;

                    letter-spacing: 0.5px;

                    position: relative;

                    vertical-align: top;

                    margin: 0;

                    line-height: 20px;

                    display: flex;

                    flex-direction: row;

                    flex-wrap: nowrap;

                    align-items: center;

                    padding: 0;

                    text-align: left;

                    clear: none;

                    font-weight: 600;

                    color: #969696;

                    font-size: 16px;

                    font-family: 'Poppins';

                }

            }

        }



        #tab-reviews {

            display: grid;

            grid-template-columns: 1fr;

            grid-template-rows: 1fr;



            .review-comments-toolbar {

                display: flex;

                flex-direction: row;

                flex-wrap: nowrap;

                justify-content: space-between;

                margin: 0 5px;



                .review-product-rating{

                    display: flex;

                    flex-direction: row;

                    flex-wrap: nowrap;

                    width: fit-content;

                    padding: 7px 0;

                    justify-content: flex-start;

                    gap: 0.5em;



                    .rating {

                        color: #3f3c5a;

                        font-size: 20px;

                        font-weight: 600;

                    }



                    .star-rating:before {

                        top: 0;

                        left: 0;

                        position: absolute;

                        background-image: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/a1-star-g.svg);

                        content: '';

                        display: block;

                        height: 100%;

                        width: 100%;

                        background-size: contain;

                    }



                    .star-rating {

                        width: 6.5em !important;

                        letter-spacing: 2.5px !important;

                        font-size: 20px;

                        overflow: hidden;

                        position: relative;

                        height: 26px;

                        line-height: 18px;

                        margin: 0;



                        span:before {

                            background-image: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/a1-star-o.svg);

                            content: '';

                            background-size: contain;

                            top: 0;

                            position: absolute;

                            left: 0;

                            width: 100%;

                            height: 100%;

                        }



                        span {

                            float: left;

                            top: 0;

                            left: 0px;

                            position: absolute;

                            height: 100%;

                        }

                    }

                }



                .review_func {

                    display: flex;

                    gap: 0.75em;



                    > div {

                        cursor: pointer;

                        text-align: center;

                        width: fit-content;

                        padding: 5px 25px;

                        font-weight: 600;

                        align-content: center;

                        border-radius: 8px;

                    }



                    .reviews-galley-butt {

                        background: #dedced;

                        color: #3f3c5a;

                    }



                    .add-review-comm {

                        background: #3f3c5a;

                        color: #ffffff;

                    }

                }

            }



            .all-comment-outter-cont {

                position: relative;

                display: grid;

                grid-template-columns: 1fr;



                .all-comment-cont {

                    position: relative;

                    padding: 5px 0;

                    margin: 0 5px;

                    overflow-x: scroll;

                    scrollbar-width: none;

                    scrollbar-color: #bababa transparent;

                    scrollbar-gutter: stable;

                

                    .all-comment-media {

                        list-style-type: none;

                        display: flex;

                        flex-direction: row;

                        flex-wrap: nowrap;

                        margin: 0;

                        padding: 0;



                        .all-comment-video-item {

                            

                            a::before {

                                content: "";

                                background: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/play-butt-comm-trans.svg);

                                background-size: contain;

                                width: 100px;

                                aspect-ratio: 711 / 1000;

                                position: absolute;

                                top: 0;

                                right: 0;

                                z-index: 99;

                            }

                        }





                        > li {

                            margin: 8px 8px 4px 0;

                            z-index: 1;

                            position: relative;

                            

                            a {

                                color: #000000;

                                text-decoration: none;

                                cursor: pointer;

                            

                                img {

                                    object-fit: cover;

                                    padding: 0;

                                    position: relative;

                                    border-radius: 6px;

                                    display: block;

                                    max-width: unset;

                                    max-height: unset;

                                    height: unset !important;

                                    width: 100px !important;

                                    aspect-ratio: 711 / 1000 !important;

                                    z-index: 9;

                                }

                            }

                        }

                    }

                }

            }





            #reviews {

                display: grid;

                grid-template-rows: repeat(2, auto);

                grid-template-columns: 1fr;

                position: relative;

                width: 100%;



                #comments {

                    user-select: none;

                    display: grid;

                    grid-template-rows: auto;

                    grid-template-columns: 1fr;

                    width: calc(100% - 3em);

                    grid-area: 1 / 1 / 2 / 2;

                    overflow: hidden;

                    padding: 0 1.5em;



                    .woocommerce #reviews #comments ol.commentlist::after, .woocommerce #reviews #comments ol.commentlist::before {

                            content: " ";

                            display: none !important;

                    }



                    .commentlist {

                        padding: 0;



                        .review {

                            position: relative;

                            border-radius: 15px;

                            background: #fff !important;

                            box-shadow: 0 0px 5px 1px #e3e3e3;

                            overflow: hidden;

                            height: 260px;

                            max-height: 260px;

                            box-sizing: border-box;

                            padding: 0.5em !important;



                            .open-full-cont {

                                position: absolute;

                                bottom: 0px;

                                right: 0px;

                                left: 0;

                                width: calc(100% - 12px);

                                text-align: right;

                                z-index: 9999;

                                background: #ffffffde;

                                color: #1c1c1c;

                                padding: 6px 6px;

                                font-family: 'Poppins';

                                cursor: pointer;

                                backdrop-filter: blur(3px);

                                -webkit-backdrop-filter: blur(3px);

                                display: flex;

                                flex-direction: row-reverse;

                                flex-wrap: nowrap;

                                justify-content: space-between;



                                .open-full-butt.open_side_bar {

                                    cursor: pointer;

                                    padding: 0 15px;

                                    width: fit-content;

                                    color: #3f3c5a;

                                    font-weight: 600;

                                }

                            }



                            .comment_container {

                                display: grid;

                                grid-template-columns: 1fr;

                                grid-template-rows: auto;

                                align-items: stretch;

                                position: relative;



                                .comment-header {

                                    display: flex;

                                    flex-direction: row;

                                    flex-wrap: nowrap;

                                    align-items: center;

                                    width: 100%;



                                    .avatar {

                                        width: 65px;

                                        height: 65px;

                                        padding: 3px;

                                        background: transparent;

                                        border-radius: 50%;

                                        margin-right: 10px;

                                        line-height: 1;

                                        position: unset;

                                        border: unset;

                                    }



                                    .comment-meta {

                                        display: flex;

                                        flex-direction: column;

                                        height: 60px;

                                        justify-content: space-between;



                                        .review-product-rating {

                                            display: flex;

                                            flex-direction: row;

                                            flex-wrap: nowrap;

                                            width: fit-content;

                                            justify-content: flex-start;

                                            gap: 0.5em;



                                            .rating {

                                                display: none;

                                            }



                                            .star-rating::before {

                                                top: 0;

                                                left: 0;

                                                position: absolute;

                                                background-image: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/a1-star-g.svg);

                                                content: '';

                                                display: block;

                                                height: 100%;

                                                width: 100%;

                                                background-size: contain;

                                            }



                                            .star-rating {

                                                position: relative;

                                                height: 20px;

                                                width: 7.1em;



                                                span::before {

                                                    background-image: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/a1-star-o.svg);

                                                    content: '';

                                                    background-size: contain;

                                                    top: 0;

                                                    position: absolute;

                                                    left: 0;

                                                    width: 100%;

                                                    height: 100%;

                                                }



                                                span {

                                                    float: left;

                                                    top: 0;

                                                    left: 0px;

                                                    position: absolute;

                                                    height: 100%;

                                                }

                                            }

                                        }



                                        .comment-media-count {

                                            position: absolute;

                                            top: 0.25em;

                                            right: 0.75em;

                                            margin: 0;

                                            color: #828282;

                                        }



                                        .meta {

                                            display: flex;

                                            flex-direction: column;

                                            flex-wrap: nowrap;

                                            align-items: flex-start;

                                            margin: 0;

                                            justify-content: center;

                                            margin-left: 3px;



                                            .woocommerce-review__author {

                                                line-height: 1;

                                                margin-bottom: 5px;

                                                font-weight: 600;

                                                color: #000;

                                                font-size: 13px;

                                                font-family: 'Poppins';

                                            }



                                            .woocommerce-review__verified.verified {

                                                display: none;

                                            }



                                            .woocommerce-review__published-date {

                                                line-height: 1;

                                                color: #828282;

                                                font-size: 13px;

                                            }

                                        }

                                    }

                                }



                                .comment-text {

                                    margin: 1.5em 3em 0 1em;

                                    display: flex;

                                    flex-direction: row;

                                    gap: 0.5em;

                                    border: unset !important;

                                    padding: 0 !important;



                                    .description {

                                        background: #ffecda;

                                        color: #000;

                                        width: fit-content;

                                        padding: 7px 8px 7px 15px;

                                        border-radius: 15px;

                                        position: relative;

                                        display: flex;

                                        flex-direction: row;

                                        gap: 0.5em;



                                        p:before {

                                            content: "";

                                            background: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/uptail-o.svg);

                                            background-size: cover;

                                            position: absolute;

                                            top: 0;

                                            left: 0;

                                            width: 30px;

                                            height: 30px;

                                            margin-right: 0;

                                            transform: translate(20px, -23px);

                                        }



                                        p {

                                            margin: 0 !important;

                                            padding: 3px 0;

                                            min-width: 50px;

                                            display: flex;

                                        }



                                        .comment-text-media {

                                            display: flex;

                                            align-items: flex-start;

                                            overflow-y: clip;

                                            max-height: 200px;



                                            .all-comment-media-cont {



                                                #media-list{

                                                    list-style-type: none;

                                                    margin: 0px;

                                                    padding: 0;

                                                    display: flex;

                                                    flex-direction: row;

                                                    flex-wrap: wrap;

                                                    justify-content: flex-start;



                                                    .all-comment-video-item {



                                                        a::before {

                                                            content: "";

                                                            background: url(https://starkframe.store/wp-content/themes/starkframe/assets/images/stark-frame/play-butt-comm-trans.svg);

                                                            background-size: contain;

                                                            width: 85px;

                                                            aspect-ratio: 3 / 4;

                                                            position: absolute;

                                                            top: 0;

                                                            right: 0;

                                                            z-index: 999;

                                                        }

                                                    }



                                                    > li {

                                                        margin: 3px;

                                                        display: flex;

                                                        align-items: center;

                                                        border-radius: 6px;

                                                        position: relative !important;

                                                        z-index: unset !important;



                                                        a {



                                                            img {

                                                                width: 85px;

                                                                object-fit: cover;

                                                                padding: 0;

                                                                position: relative;

                                                                border-radius: 6px;

                                                                display: block;

                                                                max-width: unset;

                                                                max-height: unset;

                                                                height: unset !important;

                                                                aspect-ratio: 3 / 4 !important;

                                                                z-index: 9;

                                                            } 

                                                        }

                                                    }

                                                }

                                            }

                                        }

                                    }

                                }

                            }

                        }

                    }

                }

            }



            #show_all_comments {

                cursor: pointer;

                text-align: center;

                background: #dedced;

                color: #3f3c5a;

                width: fit-content;

                padding: 0 20px;

                font-weight: 600;

                align-content: center;

                border-radius: 8px;

                height: 36px;

                width: auto;

                margin: 0 1.5em;

            }

        }

    }

}



@media screen and (min-width: 901px) {

    .sf-addition-product-content {

        margin-top: 1em;

    }

}



@media screen and (max-width: 900px) {

    .sf-addition-product-content {



        .woocommerce-tabs.wc-tabs-wrapper {



            .tabs {

                margin: 0 1.5em !important;

            }



            #tab-reviews {

                .review-comments-toolbar {

                    margin: 0 1.5em !important;

                }

            }

        }

    }

}





@media screen and (min-width: 601px) and (max-width: 900px) {

    .sf-addition-product-content {

        margin-top: 1em;

    }

}



@media screen and (min-width: 601px) {

    .review-comments-toolbar {

        margin: 0.75em 5px 0 !important;

    }

}



@media screen and (max-width: 600px) {

    .sf-addition-product-content {

        margin-top: 1em;



        .review-comments-toolbar {

            display: flex;

            flex-direction: column !important;

            flex-wrap: nowrap;

            margin: 5px;

            justify-content: center;

            gap: 0.25em;



            .review_func {

                display: flex;

                gap: 0.75em;

                flex-direction: row;

                flex-wrap: nowrap;



                > div {

                    width: 50% !important;

                    height: 30px;

                }

            }

        }



        .all-comment-outter-cont {

            width: 100%;

            overflow: hidden;



            .all-comment-cont {

                padding: 3px 0 0 !important;

                overflow-x: scroll !important;

                margin: 0 !important;



                li:first-child{

                    padding-left: 1.5em;

                }



                li {

                    margin: 8px 12px 0 0 !important;

                }



                li:last-child {

                    padding-right: 1.5em;

                }

            }

        }



        #reviews {

            width: 100% !important;



            .comment-text {

                margin: 1.5em 1em 0 1em !important;

                display: flex;

                flex-direction: row;

                gap: 0.5em;

                border: unset !important;

                padding: 0 !important;

            }

        }



        #show_all_comments {

            height: 40px !important;

        }

    }

}