

/* Start:/bitrix/components/ql/comments/templates/.default/style.css?164483226511317*/
:root {
    --ql-color-yellow               : #ffb300;
    --ql-color-yellow-secondary     : #c78a00;
    --ql-color-gray                 : #b9b9b9;
    --ql-color-gray-secondary       : #b4b4b4;
    --ql-color-light-gray           : #dcdcdc;
    --ql-color-filled-gray          : #f7f7f7;
    --ql-color-accent               : #f77eb4;
    --ql-color-white                : #ffffff;
}

/* BLOCK START */
.ql-comments__block {
    position: relative;
}
.ql-comments__block.is-pending {
    pointer-events: none;
}
.ql-comments__block.is-pending:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.5);
    z-index: 1;
}
.block__header.ql-comments__header {
    margin-bottom: 20px;
}
.ql-comments__title {
    margin-bottom: 20px;
}
.ql-comments__title:last-child {
    margin-bottom: 0;
}
/* BLOCK END */

/* LIST START */
.ql-comments-list__wrapper {
    width: 100%;
    margin-bottom: 40px;
}
.ql-comments-list__wrapper:last-child {
    margin-bottom: 0;
}
.ql-comments-list__header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -5px 20px;
}
.ql-comments-list__meta-item {
    color: var(--ql-color-gray);
    padding: 0 5px;
}
.ql-comments-list__meta-item:after {
    content: '-';
    margin-left: 5px;
}
.ql-comments-list__meta-item:last-child:after {
    display: none;
}
.ql-comments-list__meta-item span {
    color: var(--ql-color-gray-secondary);
    font-weight: 700;
}
.ql-comments-list__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.ql-comments-list__item {
    width: 100%;
    margin-bottom: 20px;
}
.ql-comments-list__item:last-child {
    margin-bottom: 0;
}
/* LIST END */

/* ITEM START */
.ql-comments-item__header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 0.5em;
}
.ql-comments-item__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1em;
}
.ql-comments-item__name {
    font-weight: 700;
}

.ql-comments-item__date {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    font-size: 0.9em;
    line-height: 1;
    color: var(--ql-color-gray);
}

.ql-comments-item__name + .ql-comments-item__date {
    margin-left: 10px;
}

.ql-comments-item__field {
    margin-bottom: 1em;
}
.ql-comments-item__field:last-child {
    margin-bottom: 0;
}
.ql-comments-item__field dt {
    display: inline;
    font-weight: 700;
    margin-right: 0.5em;
}
.ql-comments-item__field dd {
    display: inline;
}
.ql-comments-item__content {
    margin-bottom: 1em;
}
.ql-comments-item__content:last-child {
    margin-bottom: 0;
}
.ql-comments-item__footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
/* ITEM END */

/* RATING START */
.ql-rating__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1;
    margin: 0 -1px;
}
.ql-rating__item {
    padding: 0 1px;
}
.ql-rating__item > svg {
    width: 18px;
    height: 18px;
}
.ql-rating__star {
    fill: var(--ql-color-light-gray);
    -webkit-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}

.ql-rating__list[data-rate='1'] .ql-rating__item:nth-child(1) .ql-rating__star { fill: var(--ql-color-yellow); }

.ql-rating__list[data-rate='2'] .ql-rating__item:nth-child(1) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='2'] .ql-rating__item:nth-child(2) .ql-rating__star { fill: var(--ql-color-yellow); }

.ql-rating__list[data-rate='3'] .ql-rating__item:nth-child(1) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='3'] .ql-rating__item:nth-child(2) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='3'] .ql-rating__item:nth-child(3) .ql-rating__star { fill: var(--ql-color-yellow); }

.ql-rating__list[data-rate='4'] .ql-rating__item:nth-child(1) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='4'] .ql-rating__item:nth-child(2) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='4'] .ql-rating__item:nth-child(3) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='4'] .ql-rating__item:nth-child(4) .ql-rating__star { fill: var(--ql-color-yellow); }

.ql-rating__list[data-rate='5'] .ql-rating__item:nth-child(1) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='5'] .ql-rating__item:nth-child(2) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='5'] .ql-rating__item:nth-child(3) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='5'] .ql-rating__item:nth-child(4) .ql-rating__star { fill: var(--ql-color-yellow); }
.ql-rating__list[data-rate='5'] .ql-rating__item:nth-child(5) .ql-rating__star { fill: var(--ql-color-yellow); }

.rating-control,
.input-control.rating-control {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
.rating-control .input-like,
.input-control.rating-control .input-like {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    margin-right: 10px;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
}
.input-control.rating-control.parsley-error .error-messages {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    min-width: auto;
}
.input-control.rating-control.parsley-error .rating-control-stars {
    border-color: red;
}

.rating-control-stars {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    position: relative;
    border: 2px solid #eaeaea;
    border-radius: 4px;
    padding: 5px;
    margin-right: 10px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
}
.rating-control-stars > input {
    display: none;
}
.rating-control-stars > label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    width: 20px;
    height: 20px;
}
.rating-control-stars > label > svg {
    width: 18px;
    height: 18px;
}
.rating-control-stars > input:checked ~ label .ql-rating__star,
.rating-control-stars > input:checked ~ label ~ label .ql-rating__star {
    fill: var(--ql-color-yellow);
}
.rating-control-stars > input:not(:checked) ~ label:hover .ql-rating__star,
.rating-control-stars > input:not(:checked) ~ label:hover ~ label .ql-rating__star {
    fill: var(--ql-color-yellow-secondary);
}

/* RATING END */

/* LOAD MORE START */
.ql-comments-load-more__wrapper {
    text-align: center;
    margin-bottom: 20px;
}
.ql-comments-load-more__wrapper:last-child {
    margin-bottom: 0;
}
/* LOAD MORE END */

/* VOTE START */
.ql-voting-list__wrapper {}
.ql-voting-list__items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.ql-voting-list__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 36px;
    line-height: 36px;
}

.ql-voting-item__wrapper {
    position: relative;
    border: 0;
    padding: 0 10px;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}
.ql-voting-item__wrapper:hover {
    background-color: var(--ql-color-light-gray);
}
.ql-voting-item__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-left: -10px;
}
.ql-voting-item__icon svg {
    width: 20px;
    height: 20px;

    fill: rgba(0,0,0,0.4);
}
.ql-voting-item__count {
    font-size: 0.9em;
}
/* VOTE END */

/* FORM START */
.ql-comments-form__wrapper {
    width: 100%;
}
.ql-comments-form__inner {
    background-color: var(--ql-color-filled-gray);
    border-radius: 10px;
    padding: 70px 90px;
}
.ql-comments-form__header {
    margin-bottom: 2em;
}
.ql-comments-form__title {
    font-size: 2em;
    font-weight: 700;
    line-height: 1.2;
}
.ql-comments-form__description {
    color: var(--ql-color-gray-secondary);
}
.ql-comments-form__title + .ql-comments-form__description {
    margin-top: 0.5em;
}
/* FORM END */

/* PAGINATION START */
.ql-comments-list-pagination__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.ql-comments-list-pagination__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    margin: 0 2px;
}
.ql-comments-list-pagination__item[data-pagination-link] {
    cursor: pointer;
    -webkit-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
}
.ql-comments-list-pagination__item[data-pagination-link]:hover {
    background-color: var(--ql-color-filled-gray);

}
.ql-comments-list-pagination__item.active {
    background-color: var(--ql-color-accent);
    color: var(--ql-color-white);
}
/* PAGINATION END */



@media only screen and (max-width: 992px) {
    .ql-comments-form__inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 40px 30px;
    }
}
/* End */
/* /bitrix/components/ql/comments/templates/.default/style.css?164483226511317 */
