@charset "utf-8"; 

.page-landing-tab-content .tableMainRow{
	cursor: pointer;
}
/****transitional survey start****/
.survey-pop .iconContainer .icon,
.survey-pop .iconContainerNps .icon{
    float: left;
    margin: 5px;
    cursor: pointer;
    width: 51px;
    height: 51px;
    background-repeat: no-repeat;
    background-size: 51px 51px;
}
 .survey-pop .iconContainer .icon.very_satisfied{
     background-image: url("/sesv/resources/images/survey/05_very_satisfied.jpg");
 }
 .survey-pop .iconContainer .icon.very_satisfied.selected {
     background-image: url("/sesv/resources/images/survey/05_very_satisfied_selected.jpg");
 }
 .survey-pop .iconContainer .icon.satisfied{
     background-image: url("/sesv/resources/images/survey/04_satisfied.jpg");
 }
 .survey-pop .iconContainer .icon.satisfied.selected {
     background-image: url("/sesv/resources/images/survey/04_satisfied_selected.jpg");
 }
 .survey-pop .iconContainer .icon.neutral{
     background-image: url("/sesv/resources/images/survey/03_neutral.jpg");
 }
 .survey-pop .iconContainer .icon.neutral.selected {
     background-image: url("/sesv/resources/images/survey/03_neutral_selected.jpg");
 }
 .survey-pop .iconContainer .icon.dissatisfied{
     background-image: url("/sesv/resources/images/survey/02_dissatisfied.jpg");
 }
 .survey-pop .iconContainer .icon.dissatisfied.selected {
     background-image: url("/sesv/resources/images/survey/02_dissatisfied_selected.jpg");
 }
 .survey-pop .iconContainer .icon.very_dissatisfied{
     background-image: url("/sesv/resources/images/survey/01_very_dissatisfied.jpg");
 }
 .survey-pop .iconContainer .icon.very_dissatisfied.selected {
     background-image: url("/sesv/resources/images/survey/01_very_dissatisfied_selected.jpg");
 }
 .survey-pop .iconContainerNps .icon.very_satisfied{
     background-image: url("/sesv/resources/images/survey/nps_very_satisfied.jpg");
 }
 .survey-pop .iconContainerNps .icon.very_satisfied.selected {
     background-image: url("/sesv/resources/images/survey/nps_very_satisfied_selected.jpg");
 }
 .survey-pop .iconContainerNps .icon.satisfied{
     background-image: url("/sesv/resources/images/survey/nps_satisfied.jpg");
 }
 .survey-pop .iconContainerNps .icon.satisfied.selected {
     background-image: url("/sesv/resources/images/survey/nps_satisfied_selected.jpg");
 }
 .survey-pop .iconContainerNps .icon.neutral{
     background-image: url("/sesv/resources/images/survey/nps_neutral.jpg");
 }
 .survey-pop .iconContainerNps .icon.neutral.selected {
     background-image: url("/sesv/resources/images/survey/nps_neutral_selected.jpg");
 }
 .survey-pop .iconContainerNps .icon.dissatisfied{
     background-image: url("/sesv/resources/images/survey/nps_dissatisfied.jpg");
 }
 .survey-pop .iconContainerNps .icon.dissatisfied.selected {
     background-image: url("/sesv/resources/images/survey/nps_dissatisfied_selected.jpg");
 }
 .survey-pop .iconContainerNps .icon.very_dissatisfied{
     background-image: url("/sesv/resources/images/survey/nps_very_dissatisfied.jpg");
 }
 .survey-pop .iconContainerNps .icon.very_dissatisfied.selected {
     background-image: url("/sesv/resources/images/survey/nps_very_dissatisfied_selected.jpg");
 }
 .survey-pop .star-rating-group .icon-star {
    background-image: url("/sesv/resources/images/icon_star_empty.png");
    background-size: contain;
    background-repeat: no-repeat;
}
.survey-pop .star-rating-group .icon-star.hovered {
    background-image: url("/sesv/resources/images/icon_star_hover.png");
    cursor: pointer;
}
 .survey-pop .star-rating-group .icon-star.selected {
    background-image: url("/sesv/resources/images/icon_star_filled.png");
    background-size: contain;
    background-repeat: no-repeat;
}
.icon-star {
    width: 27.131px;
    height: 26px;
}
.survey-pop .iconContainer .icon img{
    max-width: 50px;
    max-height: 50px;
    margin: 0 2px 2px 0;
}
.flex-space-between{
    display: flex;
    justify-content: space-between;
}
.nps-description-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.nps-description-group .question.b2-600:lang(zh) {
    font-weight: 500;
}
.survey-pop .iconContainer .icon:last-child,
.survey-pop .iconContainerNps .icon:last-child{
	margin-right: 0rem !important;
}
.survey-pop .iconContainer .icon.selected img{
	box-shadow: 2px 2px 2px #a7a8aa;
}
.survey-pop .iconContainer .iconbox,
.survey-pop .iconContainerNps .iconbox {
    margin-bottom: 10px;
}
.survey-pop .iconContainer,
.survey-pop .iconContainerNps{
    overflow: hidden;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    cursor: pointer;
    flex-wrap: nowrap;
}
.survey-pop .textContainer {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.survey-pop .swal2-close{
    height: 24px;
    width: 24px;
    top: 24px;
    right: 40px;
    color: #000;
    font-weight: bolder;
    font-size: 24px;
}

.survey-pop .swal2-close:focus {
    border: none !important;
    box-shadow: none !important;
    outline:none !important;
}

.survey-pop .surveyTitle{
    font-size: 1.5rem;
}
 .survey-pop .surveyText{
     font-size: 0.8rem;
     white-space: pre-line;     /* allow \n in i18next */
 }
.survey-pop .swal2-validation-message{
    background-color:#fff; 
    color:#ED1B2E; 
    justify-content: flex-start; 
    padding:0;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    align-items: flex-start;
}

.survey-pop .btn.swal2-styled{margin-top:0px; margin-bottom:0px;} 

.survey-pop .swal2-actions{margin:0rem}

.swal2-container .swal2-popup.survey-pop{
    max-width: 800px!important;
    margin: 50px 300px!important;
}

.survey-pop .swal2-validation-message::before {     
    content: url(../../images/icon-alert-circle.svg);
    width: 24px;
    height: 24px;
    display: flex;
    padding: 2.25px;
    background-color: unset;
    margin: 0px;
}
.nps-container .survey-error-message {
    color: #ED1B2E;
    font-weight: 600;
    display: flex;
}

.nps-container .survey-error-message::before {
    content: url(../../images/icon-alert-circle.svg);
    width: 24px;
    height: 24px;
    display: flex;
    padding: 2.25px;
    background-color: unset;
    margin: 0px;
}
 .surveyCommentCls{
    font-size: 18px;
    font-weight: 400;
    line-height: 28px;
    height: 100px;
    min-height: 100px;
    padding: 12px 24px;
    align-items: flex-start;
    display: flex;
    border-radius: 8px;
    border: 1px solid #B4B4B4;
    margin: 0;
    resize: none;
 }

 .surveyCommentCls::placeholder { /* Modern browsers */
    color: #B4B4B4!important;  
}

 textarea:focus, textarea:hover { 
    outline: unset;
    border-color: #B4B4B4;
}

 :lang(zh) #surveyTitleComment {
     margin-left: -327px;
     font-size: 13px;
 }
 :lang(en) #surveyTitleComment {
     margin-left: -297px;
     font-size: 13px;
 }

 .nps-group, .nps-container, .rating-group{
    display: flex;
    justify-content: center;
    flex-direction: column;
 }

 .nps-group {
    gap: 20px;
 }

 .nps-container {
    gap: 40px;
    padding: 0px 35px 40px 40px;
    justify-content: flex-start;
    background: #FFF;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
    border-radius: 0 0 8px 8px;
 }
 .nps-title {
    margin: 0 auto;
 }
/*::-webkit-scrollbar {*/
/*    width: 6px;*/
/*    height: 253px;*/
/*}*/
 @media only screen and (min-width:767px) {
     ::-webkit-scrollbar {
         width: 6px;
         height: 253px;
     }
    #thankyou{
        text-align: center;
        padding-right: 5px;
    }
 }
 @media only screen and (max-width:767px) {
    #thankyou{
        text-align: center;
    }
 }
::-webkit-scrollbar-button {
    background: transparent;
    border-radius: 8px;
}

::-webkit-scrollbar-track-piece {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: rgba(85, 85, 85, 0.55);
}

::-webkit-scrollbar-track {
    box-shadow: transparent;
}

* {
    -webkit-tap-highlight-color: transparent;
}

 .btn-rating {
    width: 56px;
    height: 40px;
    padding: 10px 0;
    text-align: center;
    background: #EEE;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
 }

 .btn-rating:hover {
    border: 1px solid #68737A;
    color: #000;
    background: #FFF;
    transition-duration: 1s; /* delays for 1 second */
    -webkit-transition-duration: 1s; /* for Safari & Chrome */
 }

 .btn-rating.selected {
    background: #68737A;
    color: #FFF;
 }

 .rating-group {
    gap: 10px;
 }

 .rating-text-group {
    justify-content: space-between;
 }
 
 .rating-text {
    color: #333!important;
 }

 .swal2-container .swal2-content {
    text-align: left;
    height: 100%;
 }

 .nps-header {
    height: 48px;
    border-radius: 8px 8px;
 }

 .star-rating-group {
    display: flex;
    justify-content: center;
    gap: 10px;
    align-items: center;
 }

 .swal2-styled.swal2-confirm {
    border-radius: 52px!important;
    width: 240px;
    margin: unset!important;
    font-size: 18px!important;
 }

 .swal2-container {
    padding:0 !important;
    z-index: 999 !important;
    overflow-y: hidden !important;
}

.swal2-html-container {
    height: 100%;
}

.rating-text.note{
    display: none;
}
 /****transitional survey end****/

@media only screen and (max-width:767px) {
		
	.survey-pop .iconContainer .icon img{
	    max-width: 45px;
	    max-height: 45px;
	}
	.survey-pop .surveyTitle{
	    font-size: 1.2rem;
	}
    :lang(zh) #surveyTitleComment {
        margin-left: -208px;
        font-size: 13px;
    }
    :lang(en) #surveyTitleComment {
        margin-left: -178px;
        font-size: 13px;
    }

    .btn-rating {
        height: 24.167px;
        min-width: 29px;
        padding:4.647px 9.295px;
        font-size: 14.5px;
        font-weight: 400;
        line-height: 13.013px;
        border-radius: 3.718px;
    }

    .nps-container {
        padding: 0px 16px 24px 16px;
        max-height: unset;
        height: calc(100% - 40px);
        border-radius: unset;
    }

    .survey-pop .iconContainerNps {
        gap: 4.647px;
    }

    .surveyCommentCls {
        font-size: 14px;
        font-weight: 400;
        line-height: 22px; 
    }

    .swal2-container .swal2-popup.survey-pop {
        bottom: 0px;
        position: absolute;
        margin: unset!important;
        -webkit-overflow-scrolling: touch;
        height: calc(100% - 80px);
        min-width: unset !important;
        max-width: 800px !important;
    }

    .icon-star {
        width: 16.696px;
        height: 16px;
    }

    .swal2-container .swal2-actions {
        margin: 0px;
    }

    .nps-header {
        height: 44px;
    }

    .swal2-styled.swal2-confirm {
        width: 100%;
        font-size: 16px !important;
     }

    .survey-pop .swal2-close {
        top: 20px;
        right: 24px;
    }
    .nps-group.gap-10-mobile {
        gap: 10px;
    }
    .nps-group.gap-10-mobile .flex-space-between:not(:last-child) {
        padding-bottom: 10px;
    }

}

@media only screen and (max-width:401px) {	
	.rating-text.note{
	    display: block;
        text-align: center;
        margin-top: 0;
        margin-bottom: 0;
	}
    .rating-text-group {
        display: none!important;
    }
    .survey-pop .iconContainerNps {
        justify-content: flex-start;
        flex-direction: column-reverse;
        gap: 2px;
    }
    .btn-rating {
        width: 100%;
    }
    .btn-rating:not(:first-child) {
        margin-bottom: 2px;
    }
    .flex-space-between .rating-text {
        flex-basis: calc(50% - 10px);
    }
    .star-rating-group {
        flex-basis: 50%;
        justify-content: flex-end;
     }
}