/*Formio element styles added globally for all the forms*/
.label-hidden span {
    display: none;
}
/* Customer satisfaction survey */
#formio-customer-survey .required {
    color: black;
}

#formio-customer-survey .checkbox.form-check-inline,
#formio-customer-survey .radio.form-check-inline {
    display: inline;
}

#formio-customer-survey input[type=checkbox] {
    margin: 4px -20px;
}

#formio-customer-survey .emoji-options-list {
    padding: 0;
    list-style-type: none;
}
#formio-customer-survey .formio-emoji input[type="radio"],
#formio-customer-survey .formio-emoji input[type="checkbox"] {
    margin: 4px 0 0;
    margin-top: 1px \9;
    line-height: normal;
}
#formio-customer-survey .emoji-options-list-item {
    position: relative;
    display: inline-block;
    padding: 0 10px 10px;
}
#formio-customer-survey .emoji-options-list-item:hover, .emoji-options-list-item.checked {
    cursor: pointer;
    background-color: rgba(53, 142, 215, 0.05);
}
#formio-customer-survey .emoji-options-list-item .emoji-image {
	background-repeat: no-repeat;
	display: inline-block;
	height: 50px;
	width: 50px;
	position: relative;
	top: 10px;
	left: calc(50% - 50px);
	transition: top .25s;
}
#formio-customer-survey .emoji-options-list-item label {
    position: relative;
    text-align: center;
    margin-bottom: 0;
    min-width: 100px;
    max-width: 100px;
    vertical-align: top;
}
#formio-customer-survey .emoji-options-list-item .emoji-name {
	font-weight: 400;
	display: block;
	word-break: break-word;
	padding-top: 10px;
	font-size: 14px;
}
#formio-customer-survey .form-check-inline label {
    background: #edf2f7;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    border-radius: 5px;
    color: black;
    margin-bottom:10px;
}
#formio-customer-survey .form-check-inline label:hover {
    background: #e2e8f0;
}
#formio-customer-survey .form-radio.radio input[type="radio"] {
    display: none;
}
#formio-customer-survey .form-radio .checkbox input[type="checkbox"] {
    display: none;
}
#formio-customer-survey .form-check label {
    background: #edf2f7;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    border-radius: 5px;
    color: black;
}

#formio-customer-survey .form-check label:hover{
	background: #e2e8f0;
}
#formio-customer-survey .set-width-wrapper-7 {
    width: 380px;
    height: 30px;
    font-size:14px;
}
#formio-customer-survey .set-width-wrapper-10 {
    width: 558px;
    height: 30px;
    font-size:14px;
}
#formio-customer-survey .form-check-inline.radio-selected label {
    background: #3182ce;
    color: white;
}
#formio-customer-survey .form-check-inline.radio-selected label:hover {
    background: #2b6cb0;
}
#formio-customer-survey .form-check.radio-selected label {
    background: #3182ce;
    color: white;
}
#formio-customer-survey .form-check.radio-selected label::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f058"
}
#formio-customer-survey .form-check.radio-selected label:hover {
    background: #2b6cb0;
}
#formio-customer-survey .form-check-inline.radio-selected label span::before {
    content: " ";
}
#formio-customer-survey .form-check-inline.radio-selected label::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f058"
}
#formio-customer-survey .radio span, #formio-customer-survey .checkbox span{
     font-weight:400;
}
#formio-customer-survey .required {
	color: black;
}
#formio-customer-survey ol.emoji-options-list {
	display: flex;
	flex-wrap: wrap;
}
#formio-customer-survey ol.emoji-options-list li {
	border-radius: 5px;
	background: #fff;
}
#formio-customer-survey input:checked+label {
	color:#000;
}

#formio-customer-survey .emoji-options-list-item .emoji-1 {
    background-image: url(../images/very-dissatisfied-inactive.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-1.active {
    background-image: url(../images/very-dissatisfied-active.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-2 {
    background-image: url(../images/dissatisfied-inactive.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-2.active {
    background-image: url(../images/dissatisfied-active.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-3 {
    background-image: url(../images/neutral-inactive.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-3.active {
    background-image: url(../images/neutral-active.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-4 {
    background-image: url(../images/satisfied-inactive.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-4.active {
    background-image: url(../images/satisfied-active.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-5 {
    background-image: url(../images/verysatisfied-inactive.svg);
}
#formio-customer-survey .emoji-options-list-item .emoji-5.active {
    background-image: url(../images/verysatisfied-active.svg);
}

/*Preloading emojis*/
#formio-customer-survey .emoji-options-list-item .emoji-1::before {
	position: absolute;
	width: 0;
	height: 0;
    background-image: url(../images/very-dissatisfied-active.svg);
	content: '';
}
#formio-customer-survey .emoji-options-list-item .emoji-2::before {
	position: absolute;
	width: 0;
	height: 0;
    background-image: url(../images/dissatisfied-active.svg);
	content: '';
}

#formio-customer-survey .emoji-options-list-item .emoji-3::before {
	position: absolute;
	width: 0;
	height: 0;
    background-image: url(../images/neutral-active.svg);
	content: '';
}

#formio-customer-survey .emoji-options-list-item .emoji-4::before {
	position: absolute;
	width: 0;
	height: 0;
    background-image: url(../images/satisfied-active.svg);
	content: '';
}
#formio-customer-survey .emoji-options-list-item .emoji-5::before {
	position: absolute;
	width: 0;
	height: 0;
    background-image: url(../images/verysatisfied-active.svg);
	content: '';
}

#formio-customer-survey .form-check-inline label{
    margin-bottom:40px;
}

#formio-customer-survey .radio.form-check-inline:first-child:after {
    content: 'Very difficult';
    position: absolute;
    bottom: -40px;
    left: 0;
    min-width: 200px;
    color: #6c757d;
}

#formio-customer-survey .radio.form-check-inline:last-child:after {
    content: 'Very easy';
    position: absolute;
    bottom: -40px;
    left: -15px;
    min-width: 200px;
    color: #6c757d;
}

#formio-customer-survey .set-width-wrapper-7,
#formio-customer-survey .set-width-wrapper-10{
    display:none;
}

#formio-customer-survey .form-check-inline{
    margin-right:0.05rem;
}

@media only screen and (max-width:380px) {
	#formio-customer-survey .set-width-wrapper-7 {
		width: 100%;
	}
}
@media only screen and (max-width:640px) {
	#formio-customer-survey .set-width-wrapper-10 {
		width: 100%;
	}
	#formio-customer-survey .emoji-options-list-item .emoji-image {
		height: 30px;
		width: 30px;
	}
}

/**
 * Added by Adeel BDT-441
 */
.customer-satisfaction-survey__title-valuation{
    margin-top:30px;
}

#formio-customer-survey .has-error.has-message .form-check-inline.radio-selected label:before{
    display:none;
}

#formio-customer-survey .has-error.has-message .form-check-inline.radio-selected label{
    background:#edf2f7;
    color:black;
}
