.woocommerce:where(body:not(.woocommerce-uses-block-theme)) .woocommerce-breadcrumb {

    font-size: 14px;

    color: #000000;

    margin-bottom: 0em;



    a {

    color: #000 !important;

}

}



.product {

    display: grid;

    grid-template-columns: 1fr;

    grid-template-rows: auto;

    margin-bottom: 0;

    position: relative;



    .sf-main-product-content {

        display: grid;

        grid-template-rows: max-content;

        gap: 1em;

        width: 100%;



        .sf-product-subcontent {



            .sf-product-gallery {

                display: grid;

                position: sticky;

                top: 45px;

                gap: 0.75em;



                .main-product-image-cont {

                    overflow: hidden;

                    position: relative;

                    display: grid;

                    grid-template-columns: 1fr;

                    grid-template-rows: 1fr;

                    height: 100%;

                    order: 2;



                    .main-gallery-wrapper {



                            .sf-main-image.has-blur-bg {

                               position: relative;

                               display: flex;

                               justify-content: center;

                               align-items: center;

                               background-size: cover;

                               background-position: center;

                               overflow: hidden;

                            }







                            a {

                               text-decoration: none;



                               img {

                                   height: unset;

                                   max-height: unset;

                                   max-width: 100%;

                                   padding: 0;

                                   display: block;

                                   position: relative;

                                   margin: 0 !important;

                                   width: auto;

                                   object-fit: contain;

                                   z-index: 9;

                                   backdrop-filter: blur(30px);

                               }

                            }



                    }

                }





                .sf-product-thumbnails {

                    position: relative;

                    display: grid;

                    grid-template-columns: 1fr;

                    grid-template-rows: 1fr;

                    overflow: hidden;

                    height: 100%;

                    order: 1;

                    border-radius: 8px;



                    .swiper-slide.active::before {

                        content: '';

                        position: absolute;

                        top: 0;

                        left: 0;

                        right: 0;

                        bottom: 0;

                        box-shadow: 0 0 0 3px #ffb471 inset;

                        z-index: 999;

                        border-radius: 7px;

                    }



                    .swiper-slide.active {

                        transform: scale(0.9);

                    }



                    .swiper-slide {

                        transition: transform 0.3s ease;

                        cursor: pointer;

                    }



                    img {

                        height: unset;

                        aspect-ratio: 3 / 4 !important;

                        max-height: unset;

                        max-width: 100%;

                        object-fit: cover;

                        padding: 0;

                        border-radius: 8px;

                        display: block;

                        position: relative;

                        margin: 0px !important;

                        width: unset;

                    }

                }

            }

        }

        

        .sf-summary.entry-summary {

            background: #fff;

            padding: 10px 10px 20px;

            border-radius: 15px;

            height: auto;

            position: sticky;

            top: 45px;

            display: grid;

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



            > *:not(.variations) {

                padding: 0.75em 1.5em 0;

            }



            .top-summary {

                display: flex;

                flex-direction: row;

                flex-wrap: nowrap;

                justify-content: space-between;



                .sf-product-rating {

                    display: inline-flex;

                    flex-direction: row;

                    flex-wrap: nowrap;

                    gap: 0.5em;

                    margin: 0;

                    width: fit-content;

                    align-items: center;

                    line-height: 2;



                    .rating {

                        font-size: 15px;

                    }



                    .woocommerce-review-link {

                        position: relative;

                        padding-left: 8px;

                        color: #888;

                    }



                    .woocommerce-review-link::before {

                        content: "·";

                        color: #868695;

                        width: 4px;

                        height: 20px;

                        position: absolute;

                        left: 0px;

                    }



                    .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%;

                        }

                    }

                }

            }



            h1 {

                color: #3f3c5a;

                font-size: 24px;

                clear: none;

                font-weight: 600;

                padding: 0 0 0.25em !important;

                margin: 0 1em;

                border-bottom: 1.5px solid #dad9e1;

            }



            .woocommerce-product-rating::after, .woocommerce-product-rating::before {

                content: unset !important;

            }



            .woocommerce-product-details__short-description {

                display: flex;

                flex-direction: column;

                flex-wrap: nowrap;

                gap: 0.5em;

                margin-bottom: 0;

                margin-top: 1em;



                p {

                    margin-bottom: 0;

                    margin-top: 0;

                }

            }



            .product_meta {

                display: flex;

                flex-direction: column;

                height: fit-content;

                flex-wrap: nowrap;

                scrollbar-gutter: stable;

                gap: 0.5em;

                margin-top: 0.5em;



                .product_meta_title {

                    margin: 0;

                    font-size: 14px;

                }



                span {

                    display: flex !important;

                    flex-direction: row;

                    flex-wrap: nowrap;

                    justify-content: space-between;

                    padding: 0;

                    color: #1c1c1c;

                    font-weight: 500;

                    white-space: nowrap;



                    .filter-name {

                        font-weight: 400;

                    }



                    .meta-space {

                        width: 100%;

                        margin: 4px 10px;

                    }



                    .filter-val {

                        font-weight: normal;

                        white-space: nowrap;

                    }

                }



                .sf-read-more-butt:hover {

                    background: #fff0e2  !important;

                    color: #ffa95d !important;

                }



                .sf-read-more-butt {

                    cursor: pointer;

                    padding: 5px 15px;

                    width: fit-content;

                    border-radius: 8px;

                    margin-top: 0.3em;

                    background: #ebeaf2;

                    color: #3f3c5a;

                    font-weight: 600;

                }

            }



            .variations {

                display: flex;

                flex-direction: column;

                flex-wrap: nowrap;

                gap: 1em;

                margin-bottom: 0;

                overflow-x: hidden;

                padding-top: 1em;



                .var-container.is-hidden {

                    display: none !important;

                }



                .var-container {

                    display: flex;

                    flex-direction: column;

                    flex-wrap: nowrap;

                    gap: 0.5em;



                    .label {

                        color: #1c1c1c;

                        display: flex;

                        flex-direction: row;

                        flex-wrap: nowrap;

                        justify-content: flex-start;

                        white-space: nowrap;

                        gap: 0.5em;

                        padding: 0 1.5em;

                    }



                    .value {

                        position: relative;



                        .sf-att-img {

                            overflow-x: hidden;

                            scrollbar-width: thin;

                            scrollbar-color: #bababa transparent;

                            scrollbar-gutter: stable;

                            align-content: center;

                            height: fit-content;



                            ul {

                                display: flex;

                                margin: 0;

                                width: fit-content !important;

                                flex-direction: row;

                                list-style-type: none;

                                padding: 0;

                                gap: 0em;

                                flex-wrap: nowrap;



                                .unavailable {

                                    opacity: 0.33;

                                }



                                li:first-child {

                                    padding-left: 1.5em !important;

                                }



                                li:last-child {

                                   padding-right: 1.5em !important;

                                }



                                li.active {

                                    img {

                                        box-shadow: 0 0 0 2px #ffa95d;

                                    }

                                }



                                li.active::before {

                                    content: '';

                                    position: absolute;

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

                                    background-size: cover;

                                    width: 23px;

                                    height: 23px;

                                    top: 3px;

                                    right: 4px;

                                    z-index: 9;

                                    opacity: 1;

                                }



                                li {

                                    background: unset !important;

                                    position: relative;

                                    cursor: pointer;

                                    padding: 0px;

                                    width: unset;

                                    border: unset !important;

                                    border-radius: 6px !important;

                                    transition: all 0.2s ease-in-out;

                                    margin: 3px 6px 3px 3px;



                                    img {

                                        object-fit: cover;

                                        padding: 0;

                                        border-radius: 6px;

                                        display: block;

                                        position: relative;

                                        max-width: unset;

                                        max-height: unset;

                                        width: 80px !important;

                                        aspect-ratio: 3 / 4 !important;

                                        height: unset !important;

                                    }



                                    .option-name {

                                        display: none;

                                    }

                                }



                            }

                        }



                        > div:not(.sf-att-img) {



                            ul {

                                display: flex;

                                flex-wrap: wrap;

                                margin: 0;

                                width: 100%;

                                flex-direction: row;

                                gap: 0.5em;

                                padding: 0 1.5em;



                                li.active {

                                    color: #eea05b !important;

                                    background: #fff0e2 !important;

                                }



                                li.opt-disable {

                                    display: none !important;

                                }



                                li.non-selected {

                                    opacity: 0.3;

                                    pointer-events: none;

                                }



                                li {

                                    padding: 5px 15px;

                                    display: flex;

                                    align-items: center;

                                    flex-direction: row;

                                    margin: 0;

                                    width: fit-content;

                                    justify-content: center;

                                    position: relative;

                                    cursor: pointer;

                                    overflow: hidden;

                                    border-radius: 10px;

                                    transition: all 0.2s ease-in-out;

                                    background: #ebeaf2;

                                    color: #3f3c5a;

                                    font-weight: 600;

                                }

                            }h1

                        }

                    }

                }

            }

        }

    }

}



.sf-summary.entry-summary, .sf-price-summary {



    .price {

        text-align: left;

        padding: 0 10px;

        font-size: 26px !important;

        font-weight: 700;

        color: #3f3c5a !important;

        font-family: 'DM Sans';

        margin: 0 !important;

    }



    form.cart {

        display: flex;

        flex-direction: column;

        align-items: stretch;

        margin: 0 !important;



    }

}



.sf_add_to_cart_buttons {

    display: flex;

    flex-direction: column;

    flex-wrap: nowrap;

    gap: 0.5em;



    .single_add_to_cart_button {

        background: #dedced !important;

        color: #3f3c5a !important;

        border-radius: 8px !important;

        font-family: 'Poppins';

        font-weight: 600 !important;

        height: 36px;

    }



    .single_buy_now_button {

        background: #3f3c5a !important;

        color: #fff !important;

        border-radius: 8px !important;

        font-family: 'Poppins';

        font-weight: 600 !important;

        height: 36px;

    }

}



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

    .sf-main-product-content {

        grid-template-columns: 0.4fr 0.35fr 0.25fr;



        .sf-summary.entry-summary {

grid-template-areas:

        "rating"

        "title"

        "description"

        "variation"

        "parameters";

            grid-template-columns: repeat(1, 1fr);

            grid-template-rows: repeat(5, auto) 1fr;

padding-bottom: 1.5em !important;



            h1 {

                grid-area: title;

            }



            .woocommerce-product-rating {

                grid-area: rating;

            }



            .woocommerce-product-details__short-description {

                grid-area: description;

            }



            .product_meta {

                grid-area: parameters;

            }



            .variations {

                grid-area: variation;

            }



            form.cart, .price {

                display: none  !important;

            }

        }



        .sf-price-summary {

            background: #fff;

            padding: 10px;

            border-radius: 12px;

            height: fit-content;

            position: sticky;

            top: 45px;

            display: flex;

            flex-direction: column;

            flex-wrap: nowrap;

            gap: 1em;

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

        }

    }



    .sf-footer-buy-buttons {

        display: none;

    }

}



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



    .sf-price-summary {

        display: none;

    }

}



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



    .sf-footer-buy-buttons {

        display: none;

    }



    .sf-main-product-content {

        grid-template-columns: 0.5fr 0.5fr;



        .sf-summary.entry-summary {

            padding-bottom: 0 !important;

grid-template-areas:

        "rating"

        "title"

        "price"

        "description"

        "variation"

        "parameters"

        "cart";

            grid-template-columns: repeat(1, 1fr);

            grid-template-rows: repeat(5, auto) 1fr auto;



            h1 {

                grid-area: title;

            }



            .woocommerce-product-rating {

                grid-area: rating;

            }



            .price {

                grid-area: price;

            }



            .woocommerce-product-details__short-description {

                grid-area: description;

            }



            .product_meta {

                grid-area: parameters;

            }



            .variations {

                grid-area: variation;

            }



            form.cart {

                display: flex;

                flex-direction: column;

                align-items: stretch;

                margin: 0 !important;

                background: #ffffffbd;

                position: sticky;

                bottom: 0px;

                color: #fff;

                text-align: center;

                font-size: 16px;

                padding: 10px 0;

                backdrop-filter: blur(4px);

                grid-area: cart;

                z-index: 9;

            }

        }

    }

}



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



    .sf-product-gallery {

        grid-template-columns: 0.2fr 0.9fr;

        overflow: hidden;

        aspect-ratio: 1 / 1.07;



        .main-product-image-cont {

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

        }



        .sf-product-thumbnails {

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

        }

    }

}







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



    .sf-product-gallery {

        grid-template-columns: 1fr;

        grid-template-rows: 1fr auto;

        gap: 5px;



        .main-product-image-cont {

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

        }



        .sf-product-thumbnails {

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

        }

    }



    .sf-summary.entry-summary {

        height: fit-content !important;

    }

}



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



    .product .variations li:hover {

        color: #ffa95d !important;

        background: #fff0e2 !important;

    }



        .sf-summary.entry-summary {

            .product_meta {

                    .meta-space {

                        border-bottom: 1px dashed #1c1c1c40;

                    }

}

}



}



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



    .woocommerce:where(body:not(.woocommerce-uses-block-theme)) .woocommerce-breadcrumb {

        display: none;

    }



    .sf-main-product-content {

        grid-template-columns: 1fr;

        margin-bottom: 0 !important;



.main-product-image-cont {

                    margin-bottom: 2em;

.main-button-next, .main-button-prev {

display: none !important;

}



#main_pag {

    z-index: 1;

}

}

        .sf-summary.entry-summary {

            width: auto;

            grid-template-areas:

                "rating"

                "title"

                "variation"

                "description"

                "parameters";

            grid-template-columns: repeat(1, 1fr);

            grid-template-rows: repeat(5, auto) 1fr;

            padding: 0 0 1.5em 0 !important;



            h1 {

                font-size: 22px !important;

                grid-area: title;

            }



            .variations {

                grid-area: variation;



                .sf-att-img {

                    overflow-x: scroll !important;

                }

            }



            .woocommerce-product-rating {

                grid-area: rating;

                padding-bottom: 0 !important;

            }



            .price {

                display: none  !important;

            }



            .woocommerce-product-details__short-description {

                grid-area: description;

            }



            .product_meta {

                grid-area: parameters;



                    .meta-space {

                        border-bottom: 1px dotted #1c1c1c40;

                    }



            }



            form.cart, .price {

                display: none  !important;

            }

        }

    }



    .sf-footer-buy-buttons {

        position: fixed;

        bottom: 69px;

        left: 0;

        right: 0;

        width: 100%;

        background: #ffffffb3;

        z-index: 9;

        border: 0.5px solid #d7d7d7;

        backdrop-filter: blur(12px);



        .price {

            text-align: right;

            padding: 0.5em 1em;

            font-size: 18px !important;

            font-weight: 700;

            color: #3f3c5a !important;

            font-family: 'DM Sans';

            margin: 0 !important;

        }



        form.cart {

            margin-bottom: 0em !important;



            .sf_add_to_cart_buttons {

                display: inline-flex;

                width: calc(100% - 2em);

                flex-direction: row;

                flex-wrap: nowrap;

                gap: 0.5em;

                padding: 0 1em 0.75em;



                > button {

                    width: 50%;

                    height: 40px !important;

                    font-size: 14px;

                }

            }

        }

    }

}



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

    .sf-product-gallery {

        grid-template-columns: 0.2fr 0.9fr;

        overflow: hidden;

        aspect-ratio: 1 / 1.07;



        .main-product-image-cont {

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

        }



        .sf-product-thumbnails {

            position: relative;

            display: grid;

            grid-template-columns: 1fr;

            grid-template-rows: 1fr;

            overflow: hidden;

            height: 100%;

            order: 1;

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

        }

    }

}



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



        .main-gallery-wrapper {

.sf-main-image.has-blur-bg {

                            aspect-ratio: unset;

                border-radius: 15px;



            img {

                aspect-ratio: 3 / 4;

            }

                        }





        }

}



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



    .sf-product-gallery {

        grid-template-columns: 1fr;

        grid-template-rows: 1fr;

    

        #main_pag {

            bottom: 10px;

        }



        .main-gallery-wrapper {

            img {

                aspect-ratio: 1 / 1;

                border-radius: 0 !important;

            }

        }



        .sf-product-thumbnails {

            display: none !important;

        }

    }

}