.comment-title { font-size: 18px; } 
.comment-show { display: block !important; } 
.comment-point { font-size: 40px; color: #fe302e; display: flex; align-items: center; justify-content: center; gap: 10px; font-weight: 900; } 
.comment-point i { color: #ffc103; font-size: 35px; margin-top: -5px; } 
.comment-star { font-size: 0; position: relative; display: inline-block; vertical-align: top; margin-bottom: 0; } 
.comment-star span { display: block; position: absolute; top: 0; left: 0px; bottom: 0; z-index: 1; overflow: hidden; text-align: left; white-space: nowrap; } 
.comment-star i {display: inline-block;margin: 0.1rem;color: #b8b8b8;text-rendering: auto;font-size: 14px;} 
.comment-star i:nth-child(1) { margin-left: 0; } 
.comment-star span i { color: #ffb903; } 
.comment-progress { width: 100%; margin-bottom: 0.375rem; display: flex; align-items: center; justify-content: space-between; } 
.comment-progress:last-child { margin-bottom: 0px; } 
.comment-progress .progress { height: 5px; margin-right: 10px; margin-left: 10px; width: calc(100% - 90px); border-radius: 10px; } 
.comment-progress .progress-bar#has-rate { background-color: var(--c1); } 
.comment-progress .progress-num { font-size: 15px; width: 25px; text-align: center; color: #787878; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 3px; } 
.comment-progress .progress-num i { color: #ffc103; font-size: 12px; margin-top: -2px; } 
.comment-progress .progress-total { font-weight: normal; text-align: left; color: #333; width: 50px; font-size: 13px; } 
.comment-write { display: none; /* position: fixed; z-index: 999; background: #0000007e; width: 100%; height: 100%; top: 0px; right: 0px; */ } 
/* .comment-write .card { max-width: 600px; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); } */
.comment-write .card-header { background: var(--c1); color: #fff; border-color: var(--c1); } 
.review-rating-star { font-size: 0; } 
.review-rating-star-icon .fa { font-weight: 400; font-style: normal; display: inline-block; margin: 0.1rem; font-size: 21px; } 
.review-rating-star-icon .fa.star-empty { color: #dedddc; } 
.review-rating-star-icon .fa { cursor: pointer; } 
.review-rating-star-icon .fa { color: #f0c808; } 
.review-rating-star-icon .fa.star-not-empty { color: #f0c808; } 
.review-rating-star-icon .fa:nth-child(1) { margin-left: 0; } 
.review-fileuploader { padding: 20px 15px; text-align: center; background-color: #ffffff; cursor: pointer; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; border: 2px dashed #c2cdda; } 
.review-fileuploader .review-fileuploader-text { color: #90a0bc; } 
.review-file-uploader .fileuploader { padding: 0px; margin: 0px; background: transparent; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list { margin: 1rem -5px 0 -5px; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list:after { display: block; content: ''; clear: both; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item { padding: 0px; width: calc(100% / 7 - 10px); float: left; margin: 0 5px 5px 5px; border-bottom: 0px; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item .columns { display: block; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item .column-thumbnail { width: auto; height: auto; } 
.review-file-uploader
.fileuploader-items
.fileuploader-items-list
.fileuploader-item
.column-thumbnail
.fileuploader-item-image { height: auto; padding: 50% 0; } 
.review-file-uploader
.fileuploader-items
.fileuploader-items-list
.fileuploader-item
.column-thumbnail
.fileuploader-item-image
img { position: absolute; top: 0px; left: 0px; max-width: 100%; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transform: none; -ms-transform: none; transform: none; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item .column-title { padding: 0px; margin-top: 0.5rem; text-align: center; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item .column-title { display: none; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item .column-actions { margin: 0px; position: absolute; top: 0px; right: -5px; } 
.review-file-uploader .fileuploader-items .fileuploader-items-list .fileuploader-item .column-infos input { border: 1px solid #dddddd; border-radius: 0.25rem; } 

.review-poster-video-avatar .avatar-detail { width: 95px; height: 95px; } 
.review-poster-video-avatar .avatar-detail img { max-width: 95px; max-height: 95px; } 
#review-content { height: 150px; resize: none; } 
.carousel-comment-media .carousel-control a { opacity: 1; width: 45px; height: 45px; top: calc(50% - 45px / 2); bottom: inherit; } 
.carousel-comment-media .carousel-control a span { display: block; cursor: pointer; color: #222222; width: 45px; height: 45px; padding: 5px; text-align: center; display: flex; align-items: center; justify-content: center; background-color: #ffffff; box-shadow: 0 1px 12px 0 rgb(0 0 0 / 12%); border-radius: 100%; -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; } 
.carousel-comment-media .carousel-control a.carousel-control-prev { left: 20px; } 
.carousel-comment-media .carousel-control a.carousel-control-prev span { padding-right: 9px; } 
.carousel-comment-media .carousel-control a.carousel-control-next { right: 20px; } 
.carousel-comment-media .carousel-control a.carousel-control-next span { padding-left: 8px; } 
.carousel-comment-media .carousel-indicators { position: static; margin: 0px 0px 0.75rem 0px; text-align: left; display: block; list-style: none; } 
.carousel-comment-media .carousel-indicators li { width: auto; max-width: 60px; height: auto; text-indent: inherit; margin: 0px 0px 3px 0px; opacity: 1; cursor: zoom-in; border: 1px solid #cbcbcb; padding: 2px; border-radius: 0.5rem; overflow: hidden; } 
.carousel-comment-media .carousel-indicators li.active { border-color: #ffc120; cursor: zoom-out; -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 
.carousel-comment-media .carousel-inner { max-width: 550px; box-shadow: 0 1px 12px 0 rgb(0 0 0 / 12%); } 
.carousel-comment-media .carousel-inner .carousel-lists .carousel-comment-media-item-video #file-video { max-width: 100%; width: 100%; height: 500px; vertical-align: top; display: inline-block; background-color: #000000; } 
#form-reply { display: none; } 
.comment-item { display: flex; align-items: flex-start; justify-content: flex-start; padding-bottom: 1.25rem; margin-bottom: 1.25rem; border-bottom: 1px solid #ededed; } 
.comment-item:last-of-type { margin-bottom: 0; padding-bottom: 0; border: none; } 
.comment-item-poster { width: 120px; margin-right: 30px; text-align: center; } 
.comment-item-letter { border-radius: 50%; background-color: #d3d2d3; color: #919090; width: 65px; height: 65px; text-transform: uppercase; display: inline-block; vertical-align: top; line-height: 67px; font-size: 25px; font-weight: 700; margin-bottom: 0.5rem; } 
.comment-item-name { margin-bottom: 0.20rem; text-transform: capitalize; font-weight: bold; color: #333333; } 
.comment-item-posttime { font-size: 12px; color: #999999; } 
.comment-item-information { width: 100%; } 
.comment-item-star { float: left; margin-right: 17px; margin-top: -2px; margin-bottom: 5px !important; !i; !; } 
.comment-item-star i { font-size: 17px; } 
.comment-item-title { font-size: 15px; font-weight: 500; } 
.comment-replies { position: relative; background: #f8f9fa; border: 1px solid #dfdfdf; padding: 15px 15px 10px; border-radius: 0.5rem; } 
.comment-replies:after,
.comment-replies:before { content: ''; position: absolute; } 
.comment-replies:before { z-index: 1; top: -13px; left: 10px; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 13px solid #f8f9fa; } 
.comment-replies:after { top: -14px; left: 9px; border-left: 11px solid transparent; border-right: 11px solid transparent; border-bottom: 14px solid #dfdfdf; } 
.comment-replies-item { margin-bottom: 1.5rem; display: flex; align-items: flex-start; justify-content: flex-start; display: none; } 

.comment-replies-item:first-child { display: flex; } 
.comment-replies-item:last-child { margin-bottom: 0px; } 
.comment-replies-letter { width: 45px; height: 45px; margin-right: 10px; line-height: 45px; padding-left: 1px; font-size: 14px; border-radius: 50%; background-color: #e5e3e5; color: #919090; text-transform: uppercase; display: inline-block; vertical-align: top; font-weight: 500; text-align: center; margin-top: 0.125rem; } 
.comment-replies-letter.admin { position: relative; background-color: #189eff; text-indent: 9999px; overflow: hidden; } 
.comment-replies-letter.admin:before { content: 'QTV'; text-indent: 0px; color: #ffffff; font-weight: 500; text-transform: uppercase; font-size: 13px; position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } 
.comment-replies-info { width: calc(100% - 55px); } 
.comment-replies-name { font-weight: 500; margin-bottom: 0.125rem; font-weight: bold; } 
.comment-replies-name span { font-weight: normal; } 
.comment-replies [class*='btn-load-more-'] { border: 0px; outline: none; padding: 0px; background: transparent; } 
.comment-media-play { z-index: 1; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); } 
.comment-media-play svg { -webkit-box-shadow: 1px 1px 15px rgb(0 0 0 / 30%); box-shadow: 1px 1px 15px rgb(0 0 0 / 30%); border-radius: 50%; background-color: rgb(255 255 255 / 15%); } 
.comment-media-play svg .comment-media-play-stroke-dotted { opacity: 0; stroke-dasharray: 4, 5; stroke-width: 1px; transform-origin: 50% 50%; animation: spin 4s infinite linear; transition: opacity 1s ease, stroke-width 1s ease; } 
.comment-media-play svg .comment-media-play-stroke-solid { stroke-dashoffset: 0; stroke-dasharray: 300; stroke-width: 4px; transition: stroke-dashoffset 1s ease, opacity 1s ease; } 
.comment-media-play svg .comment-media-play-icon { transform-origin: 50% 50%; transition: transform 200ms ease-out; } 
.comment-media-play:hover svg .comment-media-play-stroke-dotted { stroke-width: 4px; opacity: 1; } 
.comment-media-play:hover svg .comment-media-play-stroke-solid { opacity: 0; stroke-dashoffset: 300; } 
.comment-media-play:hover svg .comment-media-play-icon { transform: scale(1.05); } 
@keyframes spin { to { transform: rotate(360deg); } 
 }
@media (max-width: 992px){
 .review-preview { display: none; } 
.comment-item {display: block;margin-bottom: 0.8rem;padding-bottom: 0.8rem;} 
.comment-item-poster { width: auto; margin-right: 0px; margin-bottom: 0.5rem; display: flex; align-items: center; justify-content: flex-start; } 
.comment-item-letter { width: 40px; height: 40px; line-height: 40px; font-size: 13px; margin-bottom: 0; } 
.comment-item-name {margin-bottom: 5px;margin-left: 0;margin-right: 0;} 
.comment-item-information { width: 100%; } 
 }

.btn-load-more-comment-parent { background: var(--c3); } 
.btn-write-comment { font-weight: bold; background: #09913b !important; border: none !important; color: #fff; font-weight: normal; border-radius: 0.5rem; transition: all .2s ease; } 

.btn-write-comment:hover { background: var(--c1) !important; !i; !; color: #fff; transition: all .2s ease; } 
.hidden { display: none; } 
.float-left { float: left !important; } 
.view-more-replies { color: #f00; cursor: pointer; font-weight: 500; } 

.btn-comment { margin: 20px auto 0px; display: block; text-transform: uppercase !important; font-weight: bold; background-color: #03a0e2; border: 1px solid; color: #fff; } 

/* Admin */
.w-clear:after { display: block; content: ''; clear: both; } 

.response-reply-admin { display: none; margin-top: 20px; } 
.comment-statistic-row { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 15px 30px; } 
.comment-statistic-line { width: 1px; height: 100px; background: #ededed; } 
.comment-statistic-col.col2 { width: 35%; } 
.comment-statistic { display: block; margin-bottom: 0; } 
.comment-item-action { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 10px; } 
.comment-item-action .btn-reply-comment { font-weight: normal; font-size: 13px; color: #000; } 
.comment-item-line { display: block; width: 3px; height: 3px; background: #8e8e8e; border-radius: 3px; } 
.comment-item-rating .comment-item-star i { font-size: 10px; } 
.comment-item-content { font-size: 14px; color: #373737; line-height: 1.6; } 
.comment-page { display: block; margin-top: 2rem; } 
.comment-page-title { font-size: 15px; color: #333333; font-weight: bold; text-transform: uppercase; line-height: normal; margin-bottom: 10px; } 
.comment-page-line { display: block; width: 100%; height: 1px; background: #ededed; margin-bottom: 12px; } 
.comment-statistic-body { display: block; border: 1px solid #cbcbcb; border-radius: 0.5rem; } 
.comment-more { display: block; border-radius: 0.5rem !important; line-height: normal; font-weight: 400; font-size: 13px; background: #09913b; border: none; } 
.comment-more:hover { background: var(--c1) !important; color: #fff; transition: all .2s ease; } 