.item-product__all {

    display: flex;

    flex-direction: column;

}

.item-product__all .wattage {

    width: fit-content;

}

.price-sale {

    height: 12px;

}

.item-product__all h3 {

    flex: 1;

}

.btn-grown__alls:hover {

    background: white;

}

/* MODAL CANCEL */

#modal-cancel-order .modal-title {

    font-size: 20px;

    color: #313131;

    font-weight: bold;

}

#modal-cancel-order .content-header {

    position: relative;

    padding: 20px 20px 20px 40px;

    background: #f5f5f5;

    border: 1px solid #f5f5f5;

    margin-top: 16px;

    margin-bottom: 24px;

    font-size: 14px;

    font-weight: 400;

}

#modal-cancel-order .content-header::before {

    content: "";

    position: absolute;

    left: 16px;

    top: 50%;

    transform: translateY(-50%);

    border-radius: 100%;

    width: 16px;

    height: 16px;

    border: 1px solid #e7e7e7;

}

#modal-cancel-order .content-header::after {

    content: "";

    position: absolute;

    left: 19px;

    top: 50%;

    width: 10px;

    border-radius: 100%;

    background: #ed3237;

    height: 10px;

    transform: translateY(-50%);

    opacity: 1;

}

#modal-cancel-order .title-form {

    font-weight: bold;

    font-size: 16px;

    line-height: 18px;

    color: #313131;

}

#modal-cancel-order .modal-header .btn-close {

    border: none;

    background: transparent;

}

#modal-cancel-order .modal-header,

#modal-cancel-order .modal-footer {

    border: none;

}

#modal-cancel-order .modal-footer {

    margin-top: 24px;

}

#modal-cancel-order .group-items .item label {

    cursor: pointer;

    position: relative;

}

#modal-cancel-order .group-items .item label::before {

    content: "";

    position: absolute;

    left: -20px;

    top: 50%;

    transform: translateY(-50%);

    border-radius: 100%;

    width: 14px;

    height: 14px;

    border: 1px solid #dfdfdf;

}

#modal-cancel-order .group-items .item input:checked + label::after {

    opacity: 1;

}

#modal-cancel-order .group-items .item label::after {

    content: "";

    position: absolute;

    left: -17px;

    top: 50%;

    width: 8px;

    border-radius: 100%;

    background: #ed3237;

    height: 8px;

    transform: translateY(-50%);

    opacity: 0;

}

#modal-cancel-order .group-items .item {

    margin-top: 16px;

    padding: 0 24px;

    font-size: 14px;

    font-weight: 400;

    cursor: pointer;

}

.loader {

    border-radius: 50%;

    border: 4px solid #d32b2f;

    border-left: 4px solid transparent;

    border-right: 4px solid transparent;

    width: 35px;

    height: 35px;

    -webkit-animation: spin 2s linear infinite;

    animation: spin 2s linear infinite;

}

.title-order--success {

    font-size: 18px;

}

.content_note {

    font-weight: bold;

}

.code-order--success {

    color: #ed3237;

    font-weight: bold;

}

.section-no-border {

    border: none !important;

}

.quanty input::-webkit-outer-spin-button,

.quanty input::-webkit-inner-spin-button {

    -webkit-appearance: none;

    margin: 0;

}

.quanty input {

    flex: 0 0 50%;

}

.quanty .value-button {

    flex: 1;

}

.rating-item p {

    white-space: nowrap;

}

.vouchers,

.box-voucher {

    display: flex;

    align-items: center;

    position: relative;

    flex: 1;

}

.module__detail .vouchers{

    max-width: 100%;

    display: inline-flex;

}

.module__detail .vouchers .voucher-details{

    width: 200%;

    max-width: 450px;

}

.box-voucher {

    font-size: 14px;

    overflow-x: auto;

    display: inline-flex;

}

.vouchers {

    padding-bottom: 10px;

    margin-bottom: 0 !important;

    white-space: nowrap;

}

.overflow-item {

    flex: 1;

    position: absolute;

    right: 0;

    background-image: linear-gradient(45deg, #ffffffd4, white);

    padding: 2px 12px;

    color: var(--color-main);

}

.voucher-item {

    padding: 2px 12px;

    margin-right: 12px;

    background: rgba(255, 0, 0, 0.1);

    color: var(--color-main);

}

.voucher-details .voucher {

    display: flex;

    flex-wrap: wrap;

    box-shadow: 0px 0px 3px 1px #ebebeb;

    margin-bottom: 12px;

    padding: 2px 12px;

}

.voucher-details .voucher a img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    position: absolute;

    inset: 0;

}

.voucher-details .voucher a {

    flex: 0 0 25%;

    padding-bottom: 25%;

    display: block;

    position: relative;

}

.section-product__detail {

    overflow: unset !important;

}

.voucher-details {

    position: absolute;

    top: 100%;

    left: 0;

    background: white;

    padding: 12px 16px;

    width: 100%;

    box-shadow: 0px 2px 5px #c1c1c1;

    border-bottom-right-radius: 5px;

    border-bottom-left-radius: 5px;

    visibility: hidden;

    opacity: 0;

    pointer-events: none;

    transition: all 0.5s;

    z-index: 10;

}

.voucher-lists {

    height: 250px;

    overflow: auto;

    padding: 2px 12px;

}

.voucher-details::after {

    content: "";

    border: 8px solid white;

    border-color: transparent transparent #ffffff;

    position: absolute;

    top: -16px;

    left: 50%;

    transform: translateX(-50%);

    z-index: 1;

}

.voucher-details::before {

    content: "";

    border: 8px solid white;

    border-color: transparent transparent #c1c1c1;

    position: absolute;

    top: -16px;

    left: 50%;

    transform: translateX(-50%);

    z-index: 1;

}

.vouchers:hover .voucher-details{

    pointer-events: all;

    opacity: 1;

    visibility: visible;

} 

/* .vouchers::after {

    content: "";

    width: 100%;

    height: 30px;

    top: 10px;

    background: #ff000000;

    position: absolute;

    z-index: 0;

} */

.voucher-body {

    justify-content: space-between;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    flex: 1;

    margin-left: 12px;

}

.color-main {

    color: #ed3237;

}

.voucher-expired {

    font-size: 12px;

}

.sort-mobile {

    display: none !important;

}

.category-viewed-product ul li a {

    padding: 6px 12px;

}

.category-viewed-product ul::-webkit-scrollbar {

    display: none;

}

.category-viewed-product ul li + li {

    margin-left: 12px;

}

.category-viewed-product ul li a {

    align-items: flex-start;

    border-color: #ebebeb;

    border-radius: 4px;

    border-style: solid;

    border-width: 1px;

    color: #333333;

    font-family: Roboto_Light;

    font-size: 14px;

    line-height: 21px;

    padding: 4px 16px;

    text-align: center;

}

.category-viewed-product ul {

    display: flex;

    align-items: center;

    white-space: nowrap;

    overflow: auto;

    padding: 6px 0;

}

.category-viewed-product {

    display: flex;

    white-space: nowrap;

    flex: 0 0 85%;

    max-width: 85%;

    align-items: center;

}

button.show-info-prd-detail {

    left: 50%;

    transform: translateX(-50%);

    position: absolute;

    border: none;

    bottom: 0;

}

.prd-desc.hidden button.show-info-prd-detail{

    display: block !important;

    bottom:0;

}

.content-sidebar__product::-webkit-scrollbar-thumb {

    background: #ed3237;

}

.content-sidebar__product::-webkit-scrollbar {

    width: 8px;

}

.content-sidebar__product:first-child {

    max-height: 300px;

}

.item-property.checked span {

    border: 1px solid #ed3237 !important;

    color: #ed3237;

}

/* VOUCHER LIST */

#voucher-cart .modal-dialog {

    max-width: 1080px;

}

#voucher-cart button.btn-close {

    background: transparent;

    border: none;

}

.expiredVoucher p + p {

    margin-left: 6px;

}

#voucher-cart .vouchers {

    position: fixed;

    top: 50px;

    left: 50%;

    transform: translate(-50%, -200%);

    max-width: 775px;

    width: 90%;

    background: #fff;

    z-index: 1000;

    box-shadow: 0 0 3px 1px #00000050;

    border-radius: 2px;

    overflow: auto;

    transition: all 1s ease;

    visibility: hidden;

}

.vouchers.show {

    visibility: visible;

    transform: translate(-50%, 0);

}

.main_vouchers .img-voucher img {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    width: 100%;

    height: 100%;

    object-fit: contain;

}

button.apply-voucher {

    position: relative;

}

button.apply-voucher .active i {

    padding: 5px;

    color: #fff;

    border-radius: 100%;

    position: absolute;

    right: -15px;

    top: 0;

    transform: translateY(-50%);

}

button.apply-voucher .active {

    position: absolute;

    right: 5px;

    top: 50%;

    transform: translateY(-50%);

}

.main_vouchers .img-voucher {

    position: relative;

    display: block;

    height: 100%;

    width: 100%;

    overflow: hidden;

    padding: 5%;

}

.main_vouchers .name_voucher {

    padding: 15px;

    width: 200px;

    overflow: hidden;

    background-color: #ebebeb !important;

}

.main_vouchers .name_voucher p {

    border: 1px dashed #fff;

    text-align: center;

    padding: 20px 5px;

    color: #fff;

    font-size: 22px;

    text-transform: uppercase;

    font-weight: 700;

}

.detail_voucher button {

    display: block;

    padding: 5px 20px;

    color: #fff;

    transition: all 0.3s;

    border: 1px solid transparent;

    border-radius: 1000px;

    background-color: #ed3237 !important;

    border: solid 1px transparent;

}

.detail_voucher button:hover {

    box-shadow: 0 0 5px 2px #ebebeb !important;

    background-color: #fff !important;

    color: #ed3237;

    border: 1px solid #ed3237;

}

.main_vouchers {

    padding: 15px;

}

.detail_voucher {

    display: block;

    padding: 15px;

    width: 100%;

    flex: 1;

}

.top_add_voucher {

    display: flex;

    justify-content: space-between;

    background: #ebebeb;

    padding: 15px;

    align-items: center;

}

.voucher .name-voucher {

    font-weight: 700;

    color: #1b8d4f;

    margin-bottom: 10px;

}

.form_use_voucher input {

    padding: 5px 10px;

    outline: 0;

    border: 1px solid #000;

}

.form_use_voucher input:forcus {

    outline: 1px solid #c51940;

    padding-left: 5px 10px;

}

.form_use_voucher button {

    padding-left: 5px 15px;

    margin-left: 5px;

    position: relative;

    display: inline-block;

    vertical-align: middle;

    transform: perspective(1px) translateZ(0);

    box-shadow: 0 0 1px transparent;

    position: relative;

    transition-property: color;

    transition-duration: 0.3s;

    background: #000;

    border: 1px solid #000;

    color: #fff;

    padding: 5px 10px;

    transition: all 0.5s ease;

    margin-left: 5px;

}

.form_use_voucher button::after {

    content: "";

    position: absolute;

    z-index: -1;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: #fff;

    color: #000;

    transform: scaleX(0);

    transform-origin: 0 50%;

    transition-property: transform;

    transition-duration: 0.3s;

    transition-timing-function: ease-out;

}

.form_use_voucher button:hover {

    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.27);

    border: 1px solid #000;

    background-color: #000;

    color: #000;

}

.form_use_voucher button:hover::after {

    transform: scaleX(1);

}

.form_use_voucher {

    flex: 0 0 50%;

    display: flex;

    align-items: center;

}

.title-vouchers {

    text-align: center;

    padding: 10px 0;

    font-size: 24px;

    font-weight: 700;

}

.closeModalVouchers i {

    font-size: 24px;

}

.closeModalVouchers {

    position: absolute;

    top: 10px;

    right: 10px;

    border: none;

    background: 0 0;

}

.main_vouchers .row .voucher {

    box-shadow: unset !important;

    height: 100%;

    position: relative;

    display: flex;

    flex-wrap: wrap;

    border: solid 1px #ebebeb;

    border-radius: 5px !important;

    overflow: hidden;

}

.main_vouchers .row li {

    margin-bottom: 15px;

}

.main_vouchers .row {

    overflow: auto;

    max-height: 60vh;

    padding-bottom: 60px;

}

.main_vouchers .row::-webkit-scrollbar {

    width: 6px;

    border-radius: 0;

}

.main_vouchers .row::-webkit-scrollbar-track {

    background-color: #fff;

}

.main_vouchers .row::-webkit-scrollbar-thumb {

    background-color: #000;

    -webkit-transition: all 0.3s ease-in-out;

    -khtml-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    -ms-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}

.expiredVoucher {

    font-size: 14px;

}

.bg-black.show {

    visibility: visible;

    opacity: 0.4;

}

.bg-black {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    opacity: 0;

    z-index: 999;

    background: #000;

    visibility: hidden;

    transition: all 0.3s;

}

button.showModalVoucher {

    border: 1px dashed #c51490;

}

button.showModalVoucher.checkout {

    width: 100%;

    text-align: center;

    display: inline-block;

}

.title_menu_cate.title-all{

    font-size: 16px;

}

@media (max-width: 1366px) {

    .main_vouchers .name_voucher p {

        font-size: 16px;

    }

}

@media (max-width: 991px) {

    .vouchers {

        width: 90%;

    }

}

@media (max-width: 767px) {

    .top_add_voucher {

        display: block;

    }

    .top_add_voucher a {

        display: block;

        text-align: center;

        margin-top: 10px;

    }

    .form_use_voucher {

        justify-content: center;

    }

    .top_add_voucher p {

        text-align: center;

        margin-bottom: 10px;

    }

}

@media all and (max-width: 576px){

    .title_menu_cate{

        font-size: 18px !important;

        color: #ed3237 !important;

    }

    .module__detail .vouchers .voucher-details{

        width: 200%;

        max-width: 320px;

    }

    

}

@media (max-width: 414px) {

    .form_use_voucher input {

        width: 70%;

    }

    .title-vouchers {

        font-size: 16px;

    }

    .closeModalVouchers i {

        font-size: 16px;

    }

}

/* END VOUCHER LIST */

@media (max-width: 991px) {

    .sort-mobile {

        display: flex !important;

    }

}