.w_product_wide{
    width: 100%;
    margin-bottom: var(--margin_btm, 43px);

    display: grid;
    grid-template-columns: 140px calc(100% - 385px) 205px;
    gap: 20px;

    @media(max-width: 720px){
        grid-template-columns: 140px calc(100% - 160px);
    } @media(max-width: 400px){
        grid-template-columns: 100px calc(100% - 120px);
    }

    a{text-decoration: none;display: block;}

    .product_image{
        width: 100%;
        display: block;

        img{width: 100%;height:180px;object-fit:cover;display: block;}
    }

    .product_info{

        :has(.text_gradient){
            position: relative;
            height: var(--heigth);
            padding-top: 3px;
            overflow: hidden;
        }

        .text_gradient{
            background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
            background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
            background: -o-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
            background: -ms-linear-gradient(left, rgba(255, 255, 255, 0.2), #fff 100%);
            background: linear-gradient(to right, rgba(255, 255, 255, 0.2), #fff 100%);

            position: absolute;
            right: 0;
            top: 0;
            width: 25px;
            height: 100%;
        }

        .product_name{
            position: relative;
            width: 100%;
            display: block;

            font-size: 14px;
            line-height: 16px;
            font-weight: bold;
            color: #0096cd;
            margin-bottom: 3px;
        }

        .compiled_description{
            font-size: 12px;
            color: #52a9cd;
            margin-bottom: 3px;
        }

        .author{
            font-size: 12px;
            color: #303030;
            margin-bottom: 5px;
        }

        .description{
            font-size: 12px;
            color: #657170;
            line-height: 17px;
            margin-bottom: 22px;
        }

        .highlights{
            color: #657170;

            font-size: 12px;
            line-height: 17px;
        }

        .advenced_product_info{display: none;margin-top: 20px;}
        @media(max-width: 720px){.advenced_product_info{display: block;}}
    }

    .advenced_product_info{
        @media(max-width: 720px){display: none;}
        .publisher{
            color: #0096cd;
            text-decoration: underline;
            font-size: 12px;

            line-height: 15px;
            margin-bottom: 5px;

            &:hover{
                text-decoration: none;
            }
        }

        .advanced_book_info{
            color: #657170;
            font-size: 12px;
            margin-bottom: 15px;
        }

        .isbn{
            font-size: 12px;
            color: #657170;
        }

        .element{
            color: #657170;
            font-size: 12px;
            margin-bottom: 15px;
        }
    }

    .product_control_panel{
        margin-top: 25px;

        .price{
            color: #ff6000;
            font-size: 16px;
            font-weight: 500;

            .normal_price{
                color: #000000;
                text-decoration: line-through solid 1px #ff0000;
            }
        }

        .product_control_btns{
            display: flex;
            gap: 10px;
            margin-top: 2px;
            .control_btn{
                --filter: var(--white_icon_filter);
                padding: 5px 9px;
                cursor: pointer;

                display: flex;
                align-items: center;
                gap: 5px;
                background: #aeb6b5;

                div{
                    font-size: 12px;
                    color: #fff;
                }
                img{filter: var(--filter);height: 13.5px;}

                transition: 0.3s ease all;
                &:hover{
                    background: #0096cd;
                }
                &:active{scale: 1.11;}
                &.active{
                    background: #edefee;
                    cursor: not-allowed;
                    --filter: var(--light_grey_icon_filter);
                    div{color: #657170;}
                }
            }
        }
    }
}