/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

.asterisk {
    display:none;
}

.bg-light {
    background-color : white !important;
}

.text-info {
    --bs-text-opacity: 1;
    color: rgb(156 2 55) !important;
}

.btn-primary {
    background-color: black;
    border-color: black;
    color: #fff;
}

.btn-primary:hover {
    background-color: #9d0636;
    border-color: #9d0636;
    color: #fff;
}

#ls-button-previous {
    background-color: black;
    border-color: black;
    color: #fff;
}

#ls-button-previous:hover {
    background-color: #9d0636;
    border-color: #9d0636;
    color: #fff;
}

body {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.progress-bar {
   background-color: #9d0636;
}

.control-label {
    font-size:16px;
}

.logo-container > img {
    max-height: 100px;
    padding: 15px;
    width: auto;
    display: block;
    float: none;
}

/* .text-danger {display:none;} */

.top-container .progress {
    width: 60%;
    margin-left: 10%;
    margin-right: auto;
    margin-top:-2.5em;
}

/* IAT questions */

.iatWrapper {
	position: relative;
	width: 100%;
	max-width: 600px;
	height: 300px;
	margin: 0 auto;
	color: #D0DBE5;
	background-color: #2C3E50;
	font-size: 21px;
}

.iatLeftLabel {
	float: left;
	padding: 10px;
}

.iatRightLabel {
	float: right;
	padding: 10px;
}

.iatWord {
	position: absolute;
	width: 100%;
	top: 35%;
	text-align: center;
	font-size: 36px;
	color: #C4D1DE;
}

.iatWord.done {
	color: #C4D1DE;
}

.iatInstructions {
	position: absolute;
	width: 100%;
	bottom: 0px;
	padding-bottom: 10px;
	text-align: center;
}

.iatMobileButtonWrapper {
	display: none;
	position: relative;
	width: 100%;
	max-width: 600px;
	margin: 0 auto;
	font-size: 36px;
}

.iatButton {
	float: left;
	margin: 20px;
	width: 100px;
	padding: 2px 0 5px 0;
	border: 5px solid #233140;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-khtml-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
	line-height: normal;
	cursor: pointer;
}

.iatLeftButton {
	float: left;
}

.iatRightButton {
	float: right;
}

.max-diff-array th.answertext { 
	text-align: center;
	border-right: 3px solid #FFFFFF;
	border-left: 3px solid #FFFFFF;
}
 
/* Override the responsive "no-more-tables" stuff */
@media only screen and (max-width: 801px) {
 
	.max-diff-array .no-more-tables table {
		display: table;
		border-collapse: inherit;
	}	
 
	.max-diff-array .no-more-tables thead, 
	.max-diff-array .no-more-tables tbody {
		display: table-row-group;
	}
 
	.max-diff-array .no-more-tables tr {
		left: auto;
		position: relative;
		top: auto;
		display: table-row;
		border: 0 none;
	}	
 
	.max-diff-array .no-more-tables th, 
	.max-diff-array .no-more-tables td {
		display: table-cell;
		text-align: center !important;
		color: #2c3e50;
		font-size: 15px;
	}
 
	.max-diff-array th.answertext { 
		border-right: 3px solid #FFFFFF;
		border-left: 3px solid #FFFFFF;
	}
 
	.max-diff-array .answer-item label span {
		display: none !important;
	}	
}

#answer459844X63X10789 { display:none;}

.addedcheckbox-item label {
    padding-left:10px; }
    
.radio-item label::before {
    border: 1px solid #000000;
}

.checkbox-item label::before {
    border: 1px solid #000000;
}


@media only screen and (max-width: 768px) {
td.hideEmptyColumn-hiddencolumn{display:none !important;}
th.hideEmptyColumn-hiddencolumn{display:none !important;}
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
td.hideEmptyColumn-hiddencolumn{display:none !important;}
th.hideEmptyColumn-hiddencolumn{display:none !important;}
}

    
_:-ms-lang(x), _:-webkit-full-screen, td.hideEmptyColumn-hiddencolumn{display:none !important;}
_:-ms-lang(x), _:-webkit-full-screen, th.hideEmptyColumn-hiddencolumn{display:none !important;}

.card-sort-question .items-start {
    float: left;
    width: 63%;
    max-width: 800px;
}

.ls-questionhelp:before {
    display:none;
}

 
.ls-label-question {
     font-size: 20px;
     font-weight: bold;
 }

#vmsg_2842_default {display:none;}
#vmsg_2842_num_answers {display:none;}

@media screen and (min-width: 480px) {
    .card-sort-question .items-start {
    float: left;
    width: 100%;
    height: 100%;
    max-width: 480px;
}


}




.upperC {
  text-transform: uppercase;
}

.lowerC {
  text-transform: lowercase;
}

.capitalC {
  text-transform: capitalize;
}


.question-item.sub-header, 
.question-item.sub-header label {
		padding: 0;
	   font-size:13.0pt;
      line-height:107%;
      font-family:"Century Gothic",sans-serif;
       font-weight: bold;
      
      
	}
 
	.question-item.sub-header label::before,
	.question-item.sub-header label::after {
		display: none;
	}
@media only screen and (min-width: 640px) {	

	.vTH2 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 18em;
}
.vTH2 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH2 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH3 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 16em;
}
.vTH3 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH3 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH4 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 15em;
}
.vTH4 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH4 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH5 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 14em;
}
.vTH5 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH5 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH6 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 13em;
}
.vTH6 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH6 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH7 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 12em;
}
.vTH7 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH7 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH8 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 12em;
}
.vTH8 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH8 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH9 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 11.5em;
}
.vTH9 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH9 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH10 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 11em;
}
.vTH10 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH10 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH11 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 11em;
}
.vTH11 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH11 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH12 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 10.5em;
}
.vTH12 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH12 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH13 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 10em;
}
.vTH13 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH13 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH14 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 10em;
}
.vTH14 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH14 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH15 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 9.5em;
}
.vTH15 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH15 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH16 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 9.5em;
}
.vTH16 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH16 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH17 {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 9em;
}
.vTH17 p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH17 p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.vTH {
    text-align: center;
    white-space: nowrap;
    transform: rotate(270deg);
    /* margin-bottom: 5em; */
    height: 8em;
    width: 11em;
}
.vTH p {
    margin:0 -999px;/* virtually reduce space needed on width to very little */
    display:inline-block;
}
.vTH p:before {
    content:'';
    width:0;
    padding-top:110%;
    /* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

}

body{
    word-break: keep-all !important;}
    
    


.zoom:hover {
  transform: scale(3); 
  margin-left:20%;
}


.ls-label-question {font-weight: normal;}




i {font-weight:300;}
em {font-weight:300;}

.question-help-container{padding-left:0;}

.fruity .btn-primary:hover, .fruity .btn-primary:focus, .fruity .btn-primary:active, .fruity .btn-primary.active, .fruity .btn-primary.active:focus, .fruity .open .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #328637;
    border: 1px solid #000;
}

ul.ui-autocomplete {
	width: 250px !important;
	padding: 5px 10px;
	list-style: none;
}

.easy-autocomplete-container { max-height: 250px; overflow: auto; overflow-y: auto; overflow-x:hidden; }

.question-title-container, .question-valid-container {
  -moz-hyphens: none;
  -ms-hyphens: none;
  -webkit-hyphens: none;
  hyphens: none;
}


/*Responsive CSS*/

/* Style for select and input */
select {
    min-width: 25%;
}
.form-inline .form-group,
.form-inline input.form-control[type="text"] {
    width: 100% !important;
}
.answers-list.radio-list {
  width: 100%;
}
.form-group.answer-item.text-item {
  margin-top: 15px;
}
@media only screen and (min-width: 768px) {
  .form-inline .form-group.other-text-item {
    padding-left: 50px;
  }
}


/* Special radio & checkbox styles */
.radio-item label::after,
.checkbox-item label::after,
input[type='radio'],
input[type='checkbox'],
.radio-item input[type="radio"],
.radio-item input[type="checkbox"] {
  opacity: 0;
  visibility: hidden;
}
.radio-item label::before {
  border: none;
  background-color: transparent;
  transition: color 0s ease-in;
  font-family: 'FontAwesome';
  visibility: visible;
  content: "\f1db";
  font-size: 160%;
  color: #bbb;
  top: 4px;
  text-shadow: none;
}
.checkbox-item label::before {
  border: none;
  background-color: transparent;
  transition: color 0s ease-in;
  font-family: 'FontAwesome';
  visibility: visible;
  content: "\f096";
  font-size: 160%;
  color: #bbb;
  top: 4px;
  text-shadow: none;
}
input[type='radio']:checked + label:before, input[type='radio']:checked + .label:before, input[type='radio']:checked:focus + label:before, input[type='radio']:checked:focus + .label:before {
  font-family: 'FontAwesome';
  visibility: visible;
  transition: color 0.5s ease-in;
  content: "\f00c";
  font-size: 160%;
  color: #638f4d;
}
input[type='checkbox']:checked + label:before, input[type='checkbox']:checked + .label:before, input[type='checkbox']:checked:focus + label:before, input[type='checkbox']:checked:focus + .label:before {
  font-family: 'FontAwesome';
  visibility: visible;
  transition: color 0.5s ease-in;
  content: "\f046";
  font-size: 160%;
  color: #9d0636;
}
.dir-ltr .radio-item label.ls-label-xs-visibility::before, .dir-ltr .checkbox-item label.ls-label-xs-visibility::before,
.dir-ltr .radio-item .ls-label-xs-visibility, .dir-ltr .checkbox-item .ls-label-xs-visibility {
    margin-left: -19px;
}
.radio-item .ls-label-xs-visibility, .checkbox-item .ls-label-xs-visibility {
  width: 32px;
  height: 32px;
}
@media only screen and (max-width: 768px) {
  table.ls-answers > tbody > tr td.answer-item.radio-item, table.ls-answers > tbody > tr td.answer-item.checkbox-item {
    padding: 0;
  }
  .dir-ltr table.ls-answers .radio-item label.ls-label-xs-visibility::before, .dir-ltr table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {
    margin: 0;
    display: inline-block;
    position: static;
    left: auto;
    top: auto;
    transform: none;
  }
  .dir-ltr table.ls-answers .radio-item .ls-label-xs-visibility, .dir-ltr table.ls-answers .checkbox-item .ls-label-xs-visibility {
    margin: 0;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
  }
  table.ls-answers > tbody > tr td.radio-item:hover, table.ls-answers > tbody > tr td.checkbox-item:hover {
    background-color: transparent;
  }
  tr.ls-odd, .array-flexible-column tr.answers-list:nth-child(even) {
    background-color: transparent;
  }
  table.ls-answers > tbody > tr:nth-child(even):hover {
    background-color: transparent;
  }
  .radio-item label::before {
    top: 14px;
  }
  .checkbox-item label::before {
    top: 14px;
  }
  input[type='radio']:checked + label:before, input[type='radio']:checked + .label:before, input[type='radio']:checked:focus + label:before, input[type='radio']:checked:focus + .label:before,
  input[type='checkbox']:checked + label:before, input[type='checkbox']:checked + .label:before, input[type='checkbox']:checked:focus + label:before, input[type='checkbox']:checked:focus + .label:before {
    color: white;
  }
  td.radio-item input[type='radio']:checked + label,
  td.checkbox-item input[type='checkbox']:checked + label {
    color: white;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
    background-color: #9d0636;
    background-image: -moz-linear-gradient(#9d0636, #9d0636);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#9d0636), to(#9d0636));
    background-image: -webkit-linear-gradient(#9d0636, #9d0636);
    background-image: -o-linear-gradient(#9d0636, #9d0636);
    opacity: 0.85;
    filter: alpha(opacity=85);
  }
}

/* Additional styles for large buttons */
ul label, ul .label {
  padding: 1.5rem 0;
}
.form-inline .radio-item, .form-inline .checkbox-item,
li.radio-item, li.checkbox-item {
  display: block;
  padding: 0;
  margin: 0;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(102, 102, 102, 0.35);
}
.form-inline .radio-item:hover, .form-inline .checkbox-item:hover,
li.radio-item:hover, li.checkbox-item:hover {
  background-color: #f0f0f0;
}
.othertext-label-checkox-container {
  border: 0 !important;
  margin-bottom: 10px !important;
}
li.radio-item:first-child, li.checkbox-item:first-child {
  border-top: 1px solid rgba(102, 102, 102, 0.35);
}
.list-radio .radio-item label::before, .list-with-comment .radio-item label::before, .choice-5-pt-radio .radio-item label::before {
  top: 15px;
}
input[type='radio']:checked + .radio-label:before, input[type='radio']:checked:focus + .radio-label:before,
input[type='checkbox']:checked + .checkbox-label:before, input[type='checkbox']:checked:focus + .checkbox-label:before {
  color: #fff;
}
input[type='radio']:checked + label.radio-label, input[type='radio']:checked + label.label-radio, input[type='radio']:checked + label.label-radio:before,
input[type='checkbox']:checked + label.checkbox-label, input[type='checkbox']:checked + label.answertext, input[type='checkbox']:checked + label.answertext:before {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
  background-color: #9d0636;
  background-image: -moz-linear-gradient(#9d0636, #9d0636);
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#9d0636), to(#9d0636));
  background-image: -webkit-linear-gradient(#9d0636, #9d0636);
  background-image: -o-linear-gradient(#9d0636, #9d0636);
  opacity: 0.85;
  filter: alpha(opacity=85);
  font-weight:bolder;
}
.radio-list li {
  margin-right: 0;
}
.radio-list li label, .radio-list li .label, .checkbox-list li label, .checkbox-list li .label, .checkbox-text-list li label, .checkbox-text-list li .label {
  position: relative;
  display: block;
  padding-left: 5rem;
  padding-right: 15px;
  margin: 0;
}
input[type='radio'] + .radio-label:before, input[type='radio'] + .label-radio:before, input[type='radio'] + .answertext:before,
input[type='checkbox'] + .checkbox-label:before, input[type='checkbox'] + .label-checkbox:before, input[type='checkbox'] + .answertext:before,
.other-item label:before, .other-item .label:before,
label.answer-comment-wrapper:before, .answer-comment-wrapper.label:before {
  position: absolute;
  left: 35px;
}

/* Multiple Options fixes */
.multiple-opt-comments .other-item label:before {
  visibility: hidden;
}
.multiple-opt-comments .label-text {
  padding-left: 0;
}
.multiple-opt-comments .form-horizontal .control-label {
  padding-top: 1.5rem;
}
.multiple-opt-comments .form-horizontal .checkbox-item label::before {
  top: 15px;
}
.multiple-opt-comments .comment-item {
  margin-top: 1rem;
}
.multiple-opt-comments ul.checkbox-text-list li.checkbox-text-item > div {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  .multiple-opt-comments ul.checkbox-text-list li.checkbox-text-item .comment-item {
    padding-left: 50px;
  }
  .multiple-opt-comments ul.checkbox-text-list li.checkbox-text-item .other-text-item {
    padding-left: 36px;
    width: 100%;
  }
  .multiple-opt-comments ul.checkbox-text-list li.checkbox-text-item.other-item .comment-item {
    padding-left: 36px;    
  }
  .multiple-opt-comments ul.checkbox-text-list li.checkbox-text-item input.other-text {
    width: 100%;
  }
}
.multiple-opt .checkbox-item label::before {
  top: 15px;
}
.multiple-opt ul {
  margin: 0;
}
.form-horizontal .checkbox-item label::before {
  top: 1px;
}
.checkbox-item {
  padding-left: 0;
}


ul.ui-autocomplete {
	width: 250px !important;
	padding: 5px 10px;
	list-style: none;
}

.easy-autocomplete-container { max-height: 250px; overflow: auto; overflow-y: auto; overflow-x:hidden; }

.question-title-container, .question-valid-container {
  -moz-hyphens: none;
  -ms-hyphens: none;
  -webkit-hyphens: none;
  hyphens: none;
}

.fruity .progress-bar {

    background-color: #f61b71;

}

.fruity .btn-primary:hover, .fruity .btn-primary:focus, .fruity .btn-primary:active, .fruity .btn-primary.active, .fruity .btn-primary.active:focus, .fruity .open .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #f61b71;
    border: 1px solid #f61b71;
}

.fruity .btn-primary {
    color: #fff;
    background-color: #002f29;
    border: 1px solid #002f29;
}

.navbar-action-link {
    padding-right: 1em;
    display: none;
}

input[type='radio']:checked + .radio-label:before, input[type='radio']:checked:focus + .radio-label:before, input[type='checkbox']:checked + .checkbox-label:before, input[type='checkbox']:checked:focus + .checkbox-label:before {
    color: #fff;
    position: absolute;
    margin-top: -5px;
}

input[type='radio'] + .radio-label:before, input[type='radio'] + .label-radio:before, input[type='radio'] + .answertext:before, input[type='checkbox'] + .checkbox-label:before, input[type='checkbox'] + .label-checkbox:before, input[type='checkbox'] + .answertext:before, .other-item label:before, .other-item .label:before, label.answer-comment-wrapper:before, .answer-comment-wrapper.label:before {
    position: absolute;
    left: 35px;
    margin-top: -6px;
}

.addedcheckbox-item label {
    display: inline-block;
    font-weight: 400;
    border-width: thin;
    height: 2em;
    width: 12em;
    border-style: solid;
    text-align: center;
    padding-top: 2px;
}

input[type='radio']:checked + label:before, input[type='radio']:checked + .label:before, input[type='radio']:checked:focus + label:before, input[type='radio']:checked:focus + .label:before {
    font-family: 'FontAwesome';
    visibility: visible;
    transition: color 0.5s ease-in;
    content: "\f00c";
    font-size: 160%;
    color: #f61b71;
    font-weight: bolder;
}

html body .navbar.navbar-default.navbar-fixed-top {
    height: 7em;
}


.easy-autocomplete-container ul {
    margin-top: 0px !important;
}

@media (min-width: 760px) {
 
  .question-container.numeric-multi .ls-group-dynamic .ls-input-group > div {
    float: left;
    /*width: 100%;*/
    max-width: 130px        
  }
}
 
 
@media (max-width: 760px) {
 
  .question-container.numeric-multi .ls-group-dynamic .control-label {
    text-align: left;      
  }
 
  .question-container.numeric-multi .ls-group-dynamic > div > div {
    float: left;
    width: 100%;
    max-width: 130px        
  }
  
  .col-auto {
    flex: 0 0 auto;
    width: 100% !important;
    }
}

    .other-text-item {
   padding-top:20px;
    }

    #navigator-container {
        display: flex;
    }
    
    
    .ls-group-remaining { display: none;}
    .em_value_integer { display: none;}
    
.question-item.answer-item.numeric-item.align-items-center.text-item.row.mb-3.withsuffix.numberonly.ls-input-sized { display:flex;}

.mb-3.ls-group-total.ls-group-dynamic.row { display:flex;}
.numeric-item.mb-3 { display:flex;}


.hide-pseudo-elements label::before,.hide-pseudo-elements label::after {
    display: none;
}
 
.hide-pseudo-elements .label-text {
    margin-left: 0px;
}

.answertextright.information-item {
    font-size: 16px;
}

.form-horizontal .control-label.col-12 {
    text-align: left;
}

.no-question{border-top:0;}
.no-question .question-title-container{display:none;}
.no-question .question-valid-container{display:none;}
.no-question .answer-container {
    padding-top: 0em;
    padding-bottom: 0.5em;
}
.no-question .ls-answers {padding-top: 0px;}
 
.no-bottom {
    border-bottom:0;
    margin-bottom:0;
}
.no-bottom .answer-container {padding-bottom: 0em;}
.no-bottom .ls-answers {
    padding-bottom: 0;
    margin-bottom: 0;
}

#javatbd129554X178X73531.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73532.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73533.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73534.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73535.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73536.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73537.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73538.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X73539.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735310.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735311.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735312.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735313.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735314.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735315.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735316.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735317.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735318.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735319.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735320.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735321.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735322.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735323.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X735324.mb-3 {margin-bottom: -5px !important;}


#javatbd129554X178X75111.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X75112.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X75113.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X75114.mb-3 {margin-bottom: -25px !important;}
#javatbd129554X178X75115.mb-3 {margin-bottom: -5px !important;}


.display-horizontal .table-multi-num,
.display-horizontal .table-multi-num tbody {
  display: block;
  margin: 0;
  width: 100%;
}
 
.display-horizontal .answer-item {
  padding: 0 !important;
}
 
.display-horizontal .answer-item,
.display-horizontal .answer-item td {
  width: auto !important;
  display: block;
  float: left;
}
 
.display-horizontal .answer-item .mb-3 {
  width: auto;
  padding-left: 0;
}
 
.display-horizontal .answer-item input[type="text"] {
  width: 50px;
}


.hide-pseudo-elements label::before,
.hide-pseudo-elements label::after {
    display: none;
    font-weight: bolder;
}
 
.hide-pseudo-elements .label-text {
    margin-left: 0px;
	font-weight: bolder;
  }
  
.nav-link {
    text-align: right !important;
    }
    
    
.ls-no-js-hidden.answers-list {
    display: flex !important;
    flex-direction: row !important;
    gap: 2%; /* space between columns */
}

.ranking-available-items,
.ranking-sorted-items {
    flex: 1 1 0;
    min-width: 230px;
}


.ls-answers.ls-heading th {
    hyphens: none;
}

.text-item.other-text-item.col-auto {
    width: 50% !important;
}







/* Common row/cell subheader styling */
.ls-subheader-row,
.ls-subheader-cell {
    background: #555 !important;
    color: #fff !important;
    font-weight: bold !important;
    text-align: center !important;
    pointer-events: none !important;
    cursor: default !important;
}

/* Subheader for MCQ/list questions - label styling */
.ls-subheader-row .checkbox-label,
.ls-subheader-row .control-label {
    display: block !important;
    width: 100%;
    text-align: center !important;
    color: #fff !important;
    font-weight: bold !important;
    pointer-events: none !important;
    background: none !important;
    position: static !important;
}

/* For array/matrix: ensure our single merged cell keeps the correct formatting */
.ls-subheader-cell {
    background: #555 !important;
    color: #fff !important;
    font-size: 1em;
    font-weight: bold !important;
    text-align: center !important;
    pointer-events: none !important;
}

/* Hide ALL inputs in subheader rows (checkbox, radio, hidden) */
.ls-subheader-row input,
.ls-subheader-row .checkbox,
.ls-subheader-row .radio,
.ls-subheader-row .form-check-input {
    display: none !important;
}

/* Hide any span/div for custom-styled checkboxes */
.ls-subheader-row .custom-checkbox,
.ls-subheader-row .form-check,
.ls-subheader-row span,
.ls-subheader-row .icheckbox, 
.ls-subheader-row .pretty {
    display: none !important;
}

/* Hide label pseudo-elements used for fake checkboxes/radios */
.ls-subheader-row label.checkbox-label:before,
.ls-subheader-row label.checkbox-label:after,
.ls-subheader-row label.control-label:before,
.ls-subheader-row label.control-label:after {
    display: none !important;
    content: none !important;
}

/* Remove padding/indent from col-auto div that would align the checkbox */
.ls-subheader-row .col-auto {
    padding-left: 0 !important;
}

/* Remove unwanted hover/focus/outline/cursor styling */
.ls-subheader-row:hover,
.ls-subheader-cell:hover,
.ls-subheader-row:focus,
.ls-subheader-cell:focus,
.ls-subheader-row *:hover,
.ls-subheader-cell *:hover,
.ls-subheader-row *:focus,
.ls-subheader-cell *:focus {
    background: #555 !important;
    color: #fff !important;
    cursor: default !important;
    outline: none !important;
}


.btn-check:active+.btn-primary, .btn-check:checked+.btn-primary, .btn-primary.active, .btn-primary:active, .show>.btn-primary.dropdown-toggle {
    background-color: #9d0636;
    border-color: #9d0636;
    color: #fff;
}

li.checkbox-item {
  border-top: 1px solid rgba(102, 102, 102, 0.35);
}

/* NPS: force answers 0–10 into a single horizontal row */
.nps-wrapper .nps-table{
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: .25rem;
  padding: 0;
  margin: 0;
}

.nps-wrapper .nps-table > li.answer-item{
  list-style: none;
  flex: 1 1 0;
  margin: 0;
  text-align: center;
}

.nps-wrapper .nps-table > li.answer-item label{
  display: block;
  width: 100%;
}

/* =========================
   NPS: remove checkmark + apply colours
   ========================= */

/* Remove the global "FontAwesome checkmark radio" just for NPS */
.nps-wrapper .nps-table > li.answer-item label::before,
.nps-wrapper .nps-table > li.answer-item label::after{
  content: none !important;
  display: none !important;
}

/* Undo global padding/row borders/hover that are meant for vertical lists */
.nps-wrapper .nps-table > li.answer-item{
  border: 0 !important;
  background: transparent !important;
}
.nps-wrapper .nps-table > li.answer-item:hover{
  background: transparent !important;
}

.nps-wrapper .nps-table > li.answer-item label{
  padding-left: 0 !important;          /* overrides .radio-list li label { padding-left: 5rem; } */
  padding-right: 0 !important;
  margin: 0 !important;
  text-shadow: none !important;
  font-weight: 600;
  border: 1px solid #cfd4da;
  border-top: 6px solid #cfd4da;       /* default, overridden by item colours below */
  border-radius: .25rem;
  background: #fff !important;
  cursor: pointer;
}

/* Hide the native radio itself (keep it accessible) */
.nps-wrapper .nps-table > li.answer-item input[type="radio"]{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* --- Colour scheme (top border) --- */
.nps-wrapper.show-colors .nps-table > li.item-0  label,
.nps-wrapper.show-colors .nps-table > li.item-1  label,
.nps-wrapper.show-colors .nps-table > li.item-2  label,
.nps-wrapper.show-colors .nps-table > li.item-3  label,
.nps-wrapper.show-colors .nps-table > li.item-4  label,
.nps-wrapper.show-colors .nps-table > li.item-5  label,
.nps-wrapper.show-colors .nps-table > li.item-6  label { border-top-color: #FF0000; }

.nps-wrapper.show-colors .nps-table > li.item-7  label,
.nps-wrapper.show-colors .nps-table > li.item-8  label { border-top-color: #E6D50E; }

.nps-wrapper.show-colors .nps-table > li.item-9  label,
.nps-wrapper.show-colors .nps-table > li.item-10 label { border-top-color: #008000; }

/* Selected state (fill with the same colour group) */
.nps-wrapper.show-colors .nps-table > li.item-0  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-1  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-2  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-3  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-4  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-5  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-6  input:checked + label {
  background: #FF0000 !important;
  border-color: #FF0000 !important;
  color: #fff !important;
}

.nps-wrapper.show-colors .nps-table > li.item-7  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-8  input:checked + label {
  background: #E6D50E !important;
  border-color: #E6D50E !important;
  color: #111 !important;
}

.nps-wrapper.show-colors .nps-table > li.item-9  input:checked + label,
.nps-wrapper.show-colors .nps-table > li.item-10 input:checked + label {
  background: #008000 !important;
  border-color: #008000 !important;
  color: #fff !important;
}

/* NPS end labels: 1.5x larger + very bold */
.nps-wrapper .nps-left-text,
.nps-wrapper .nps-right-text{
  font-size: 1.2em !important;
  font-weight: 900 !important;
  line-height: 1.2;
}

/* Applies to any question you opt-in with the ls-array-carousel class */
.ls-array-carousel table.ls-answers tr.answers-list > th.answertext{
  text-align: center;
  font-weight: 700;
  width: 100%;
}

/* Ensure the inner label doesn’t override alignment */
.ls-array-carousel table.ls-answers tr.answers-list > th.answertext .control-label,
.ls-array-carousel table.ls-answers tr.answers-list > th.answertext label{
  display: block;
  text-align: center;
  font-weight: 700;
}

/* Carousel: scale labels directly below the statement (inside the th.answertext) */
.ls-array-carousel .ls-carousel-scale{
  flex: 0 0 100%;
  width: 100%;
  display: flex;
  margin: 8px 0 10px 0;
}

.ls-array-carousel .ls-carousel-scale .ls-carousel-scale-item{
  flex: 1 0 0;
  min-width: 44px;   /* must match the td min-width used by the carousel */
  text-align: center;
  font-weight: 600;
}

.ls-array-carousel td.ls-carousel-scale-row{
  padding-left: 0;
  padding-right: 0;
}

@media (max-width: 767.98px) {
    #survey-nav .logo-container {
        display: block !important;
    }

    #survey-nav .logo-container img {
        max-height: 60px;
        width: auto;
        padding: 5px;
        display: block;
        float: none;
    }
}

@media (max-width: 767.98px) {
    #survey-nav .container-fluid {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #survey-nav .logo-container {
        display: block !important;
        margin: 0 auto;
    }

    .top-container .progress {
        width: 100%;
        margin: 0;
    }
}

#survey-nav {
    min-height: 0 !important;
    padding: 0 !important;
}

#survey-nav .container-fluid {
    padding: 0.2rem 0.5rem !important;
    align-items: center;
}

body .top-container {
    margin-top: 0 !important;
    padding: 0 !important;
}

#survey-nav .top-content {
    padding: 0 !important;
}

.top-container .progress {
    width: 100% !important;
    margin: 0 !important;
    height: 4px;
    border-radius: 0;
}

.logo-container img,
.logo-container > img {
    max-height: 30px !important;
    padding: 2px 0 !important;
}


.logo-container img,
.logo-container > img {
    max-height: 100px !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 auto !important;
    display: block;
    float: none;
}

#survey-nav,
#survey-nav .container-fluid ,
#survey-nav .logo-container,
body .top-container,
#survey-nav .top-content {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
}

.top-container .progress {
    margin: 0 !important;
    height: 4px;
}

.p-6 {
    padding: 2px !important;
}

/* Center the logo horizontally */
#survey-nav .logo-container{
  width: 100% !important;
  text-align: center !important;
}

#survey-nav .logo-container > img,
#survey-nav .logo-container img.img-fluid{
  display: inline-block !important;
  float: none !important;
  margin: 0 auto !important;
}

/* =============================
   Global Modern Dark Theme
   Keep this block at the end.
   ============================= */
:root {
    --dt-bg: #000000;
    --dt-surface: #0f0f10;
    --dt-surface-2: #181a1d;
    --dt-border: #2b2f36;
    --dt-text: #f5f7fa;
    --dt-text-soft: #c8ced8;
    --dt-accent: #3da9fc;
    --dt-accent-hover: #66bcff;
    --dt-success: #35c97a;
    --dt-danger: #ff5f74;
}

html {
    font-size: 90%;
}

html,
body {
    background: var(--dt-bg) !important;
    color: var(--dt-text) !important;
}

body {
    max-width: 1100px;
    width: min(95%, 1100px);
    margin: 0 auto !important;
    line-height: 1.55;
}

/* Slightly tighter global vertical rhythm */
.question-container {
    padding-top: 0.2rem !important;
    padding-bottom: 0.2rem !important;
}

.question-title-container,
.question-valid-container,
.question-help-container,
.answer-container {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

.answers-list > .answer-item,
.questions-list > .question-item.answer-item {
    margin-bottom: 0.35rem !important;
}

.btn,
.btn-lg,
#ls-button-submit,
#ls-button-next,
#ls-button-previous {
    padding-top: 0.42rem !important;
    padding-bottom: 0.42rem !important;
}

/* Reliable 90% text sizing without nested compounding */
body,
.question-container,
#navigator-container,
#survey-nav,
.dropdown-menu,
.modal-content {
    font-size: 0.9rem !important;
}

/* Override fixed px text sizes from legacy/theme rules */
.control-label {
    font-size: 14.4px !important;
}

.ls-label-question {
    font-size: 18px !important;
}

.answertextright.information-item {
    font-size: 14.4px !important;
}

.bg-light,
.question-container,
.question-item,
.answer-container,
.top-container,
.navbar,
.card,
.well,
.alert,
.modal-content,
.dropdown-menu,
.list-group-item {
    background-color: var(--dt-surface) !important;
    color: var(--dt-text) !important;
    border-color: var(--dt-border) !important;
}

.question-container {
    border-radius: 14px !important;
    overflow: hidden;
}

.ls-questionhelp,
.question-help-container,
.text-muted,
small,
.small,
.help-block,
.hint {
    color: var(--dt-text-soft) !important;
}

h1, h2, h3, h4, h5, h6,
.ls-label-question,
.question-title,
.control-label,
label,
.answertext {
    color: var(--dt-text) !important;
}

a,
.text-info {
    color: var(--dt-accent) !important;
}

a:hover,
a:focus {
    color: var(--dt-accent-hover) !important;
}

.progress {
    background-color: #1d2129 !important;
}

.progress-bar {
    background-color: var(--dt-accent) !important;
}

.btn,
.btn-default,
.btn-primary,
#ls-button-previous,
#ls-button-submit,
#ls-button-next {
    background: linear-gradient(180deg, #222833 0%, #191d25 100%) !important;
    color: var(--dt-text) !important;
    border: 1px solid #384252 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}

.btn:hover,
.btn:focus,
.btn-primary:hover,
.btn-primary:focus,
#ls-button-previous:hover,
#ls-button-submit:hover,
#ls-button-next:hover {
    background: linear-gradient(180deg, #2a3341 0%, #212936 100%) !important;
    border-color: var(--dt-accent) !important;
    color: #ffffff !important;
}

input,
select,
textarea,
.form-control,
.input-group-text {
    background-color: var(--dt-surface-2) !important;
    color: var(--dt-text) !important;
    border: 1px solid var(--dt-border) !important;
}

input::placeholder,
textarea::placeholder {
    color: #97a2b1 !important;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
    border-color: var(--dt-accent) !important;
    box-shadow: 0 0 0 2px rgba(61, 169, 252, 0.25) !important;
}

table,
.table,
.ls-answers,
.array-flexible-column,
.array-number,
.array {
    color: var(--dt-text) !important;
    border-color: var(--dt-border) !important;
}

table th,
table td,
.table th,
.table td {
    border-color: var(--dt-border) !important;
}

tr:nth-child(even),
.array-flexible-column tr.answers-list:nth-child(even) {
    background: rgba(255, 255, 255, 0.02) !important;
}

.radio-item:hover,
.checkbox-item:hover,
li.radio-item:hover,
li.checkbox-item:hover,
table.ls-answers > tbody > tr:hover {
    background-color: rgba(61, 169, 252, 0.08) !important;
}

/* Keep array/matrix hover readable (same tone as single/multi hover) */
.table-hover > tbody > tr:hover > *,
table.ls-answers > tbody > tr:hover > td,
table.ls-answers > tbody > tr:hover > th,
table.ls-answers > tbody > tr > td.answer-item:hover,
table.ls-answers > tbody > tr > th.answertext:hover {
    background-color: rgba(61, 169, 252, 0.08) !important;
    color: var(--dt-text) !important;
}

table.ls-answers > tbody > tr:hover label,
table.ls-answers > tbody > tr:hover .control-label,
table.ls-answers > tbody > tr:hover .answertext {
    color: var(--dt-text) !important;
}

/* Bootstrap table-hover uses CSS vars/box-shadow; set them explicitly for LS arrays */
table.ls-answers.table-hover,
table.ls-answers.table-array-radio,
table.ls-answers.radio-array {
    --bs-table-color: var(--dt-text);
    --bs-table-bg: transparent;
    --bs-table-hover-color: var(--dt-text);
    --bs-table-hover-bg: rgba(61, 169, 252, 0.08);
    --bs-table-striped-color: var(--dt-text);
}

table.ls-answers.table-hover > tbody > tr.answers-list:hover > *,
table.ls-answers.table-array-radio > tbody > tr.answers-list:hover > *,
table.ls-answers.radio-array > tbody > tr.answers-list:hover > * {
    --bs-table-accent-bg: rgba(61, 169, 252, 0.08) !important;
    color: var(--dt-text) !important;
    background-color: rgba(61, 169, 252, 0.08) !important;
    box-shadow: inset 0 0 0 9999px rgba(61, 169, 252, 0.08) !important;
}

.radio-item label::before,
.checkbox-item label::before {
    color: #9ca7b8 !important;
}

input[type='radio']:checked + label:before,
input[type='radio']:checked + .label:before,
input[type='checkbox']:checked + label:before,
input[type='checkbox']:checked + .label:before {
    color: var(--dt-accent) !important;
}

input[type='radio']:checked + label.radio-label,
input[type='checkbox']:checked + label.checkbox-label,
input[type='checkbox']:checked + label.answertext {
    background: rgba(61, 169, 252, 0.18) !important;
    color: #ffffff !important;
    text-shadow: none !important;
}

.alert-info {
    background: rgba(61, 169, 252, 0.14) !important;
    color: #d8edff !important;
    border-color: rgba(61, 169, 252, 0.4) !important;
}

.alert-success {
    background: rgba(53, 201, 122, 0.14) !important;
    color: #d8ffe9 !important;
    border-color: rgba(53, 201, 122, 0.45) !important;
}

.alert-danger,
.text-danger {
    color: #ffd3d9 !important;
    background: rgba(255, 95, 116, 0.14) !important;
    border-color: rgba(255, 95, 116, 0.45) !important;
}

.navbar,
#survey-nav,
#survey-nav .container-fluid {
    background: #060708 !important;
    border-color: #16191f !important;
}

#survey-nav .logo-container > img,
#survey-nav .logo-container img.img-fluid {
    max-width: 200px !important;
    margin-top: 25px !important;
    /*max-height: 120px !important;*/
    padding: 5px 0 !important;
}

.ls-subheader-row,
.ls-subheader-cell {
    background: #1c2026 !important;
    color: #f5f7fa !important;
}

@media only screen and (max-width: 768px) {
    body {
        width: 96% !important;
    }
}

/* =========================================
   Opt-in question text scroll card
   Usage: add `scroll-card-question` to a question's CSS class
   ========================================= */
.question-container.scroll-card-question .question-title-container,
.question-container.\.scroll-card-question .question-title-container {
    margin-bottom: 0.55rem;
}

.question-container.scroll-card-question .question-text,
.question-container.\.scroll-card-question .question-text {
    background: linear-gradient(180deg, #15181c 0%, #0f1114 100%) !important;
    border: 1px solid #2d3440 !important;
    border-radius: 14px;
    padding: 0.85rem 0.95rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
    max-height: min(56vh, calc(100dvh - 390px));
    min-height: clamp(220px, 42vh, 460px);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: #4d5a6d #12151a;
}

.question-container.scroll-card-question .question-text::-webkit-scrollbar,
.question-container.\.scroll-card-question .question-text::-webkit-scrollbar {
    width: 10px;
}

.question-container.scroll-card-question .question-text::-webkit-scrollbar-track,
.question-container.\.scroll-card-question .question-text::-webkit-scrollbar-track {
    background: #12151a;
    border-radius: 10px;
}

.question-container.scroll-card-question .question-text::-webkit-scrollbar-thumb,
.question-container.\.scroll-card-question .question-text::-webkit-scrollbar-thumb {
    background: #4d5a6d;
    border-radius: 10px;
    border: 2px solid #12151a;
}

.question-container.scroll-card-question .ls-label-question,
.question-container.scroll-card-question .ls-label-question p,
.question-container.scroll-card-question .ls-label-question li,
.question-container.\.scroll-card-question .ls-label-question,
.question-container.\.scroll-card-question .ls-label-question p,
.question-container.\.scroll-card-question .ls-label-question li {
    color: #f5f7fa !important;
}

.question-container.scroll-card-question .answer-container,
.question-container.\.scroll-card-question .answer-container {
    margin-top: 0.15rem;
}

.question-container.scroll-card-question .radio-list li label,
.question-container.scroll-card-question .checkbox-list li label,
.question-container.\.scroll-card-question .radio-list li label,
.question-container.\.scroll-card-question .checkbox-list li label {
    padding-top: 1.1rem !important;
    padding-bottom: 1.1rem !important;
}

@media (max-width: 767.98px) {
    .question-container.scroll-card-question .question-text,
    .question-container.\.scroll-card-question .question-text {
        max-height: min(46vh, calc(100dvh - 320px));
        min-height: clamp(180px, 34vh, 320px);
        padding: 0.8rem;
    }
}

/* Keep Next visible for scroll-card questions */
form#limesurvey:has(.question-container.scroll-card-question) #navigator-container,
form#limesurvey:has(.question-container.\.scroll-card-question) #navigator-container {
    position: sticky;
    bottom: 0;
    z-index: 30;
    background: rgba(0, 0, 0, 0.92);
    backdrop-filter: blur(2px);
    margin-top: 0.35rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

/* ==========================================================
   17) FINAL RADIO/CHECKBOX/ARRAY ALIGNMENT OVERRIDE
   - Last-rule-wins safety net for all list + array renderers
   ========================================================== */

/* List questions: keep icon centered against row text */
.question-container ul.ls-answers li.radio-item > label,
.question-container ul.ls-answers li.checkbox-item > label,
.question-container ul.ls-answers li.checkbox-text-item > label {
  position: relative !important;
  display: block !important;
  min-height: 56px !important;
  padding-top: 1.2rem !important;
  padding-bottom: 1.2rem !important;
  padding-left: 70px !important;
}

.question-container ul.ls-answers li.radio-item > label::before,
.question-container ul.ls-answers li.checkbox-item > label::before,
.question-container ul.ls-answers li.checkbox-text-item > label::before,
.question-container ul.ls-answers li.radio-item .ls-label-xs-visibility::before,
.question-container ul.ls-answers li.checkbox-item .ls-label-xs-visibility::before,
.question-container ul.ls-answers li.checkbox-text-item .ls-label-xs-visibility::before {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  line-height: 1 !important;
}

/* Neutralize earlier hardcoded offsets */
.list-radio .radio-item label::before,
.list-with-comment .radio-item label::before,
.choice-5-pt-radio .radio-item label::before,
.multiple-opt .checkbox-item label::before,
.multiple-opt-comments .form-horizontal .checkbox-item label::before,
.form-horizontal .checkbox-item label::before,
.radio-item label::before,
.checkbox-item label::before {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Array/matrix questions: keep icon centered in each answer cell */
table.ls-answers td.answer-item.radio-item,
table.ls-answers td.answer-item.checkbox-item {
  vertical-align: middle !important;
  text-align: center !important;
}

table.ls-answers td.answer-item.radio-item > label,
table.ls-answers td.answer-item.checkbox-item > label,
table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility,
table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
}

table.ls-answers td.answer-item.radio-item > label::before,
table.ls-answers td.answer-item.checkbox-item > label::before,
table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility::before,
table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility::before {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
}

/* ==========================================================
   18) ARRAY ACCESSIBILITY LABEL TEXT HIDE (KEEP ICON)
   - Prevent visible 1/2/3 text next to radio/checkbox in array cells
   ========================================================== */
@media only screen and (min-width: 769px) {
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility,
  table.ls-answers td.radio-item .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility {
    text-indent: -9999px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    color: transparent !important;
  }

  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility::before,
  table.ls-answers td.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility::before {
    text-indent: 0 !important;
  }
}

/* White text inputs (incl. Input on demand + Multiple short text) */
.question-container.multiple-short-txt input[type="text"],
.question-container.multiple-short-txt input[type="email"],
.question-container.multiple-short-txt input[type="number"],
.question-container.multiple-short-txt textarea,

.question-container .other-text-item input[type="text"],
.question-container .comment-item input[type="text"],
.question-container .comment-item textarea,

/* fallback for LimeSurvey text fields */
.question-container .form-control[type="text"],
.question-container .form-control[type="email"],
.question-container .form-control[type="number"],
.question-container input.other,
.question-container input[type="text"],
.question-container textarea {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #bfc5cc !important;
}

.question-container input::placeholder,
.question-container textarea::placeholder {
  color: #666666 !important;
}

/* Registration page: white input fields + black text */
.register-container .register-form .form-control,
.register-container #register_firstname,
.register-container #register_lastname,
.register-container #register_email {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #bfc5cc !important;
  -webkit-text-fill-color: #000000 !important; /* Safari autofill text */
}

.register-container .register-form .form-control::placeholder {
  color: #666666 !important;
  opacity: 1;
}

/* Keep labels readable on dark theme */
.register-container .register-form label,
.register-container .register-form .control-label {
  color: #f5f7fa !important;
}

/* Optional: ensure autofill stays white instead of yellow/dark */
.register-container .register-form input:-webkit-autofill,
.register-container .register-form input:-webkit-autofill:hover,
.register-container .register-form input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
  -webkit-text-fill-color: #000000 !important;
}

.register-container .register-form textarea,
.register-container .register-form select {
  background-color: #ffffff !important;
  color: #000000 !important;
  border: 1px solid #bfc5cc !important;
}
/* Fix hidden answers in mobile array radio (Q34399) */
@media only screen and (max-width: 768px) {
  #question34399 td.answer-item.radio-item .ls-label-xs-visibility {
    text-indent: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 14px !important;
  }

  #question34399 td.answer-item.radio-item .ls-label-xs-visibility::before {
    display: inline-block !important;
    position: static !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 10px !important;
  }

  #question34399 table.ls-answers.table-array-radio thead,
  #question34399 tr.answers-list > th.answertext {
    display: none !important;
  }

  #question34399 td.answer-item.radio-item {
    display: block !important;
    width: 100% !important;
  }
}

/* ==========================================================
   20) MOBILE ARRAY INLINE LABEL + STANDARD HIGHLIGHT
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers.table-array-radio td.answer-item.radio-item > label,
  table.ls-answers.table-array-radio td.answer-item.checkbox-item > label,
  table.ls-answers.radio-array td.answer-item.radio-item > label,
  table.ls-answers.radio-array td.answer-item.checkbox-item > label,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility,
  table.ls-answers td.radio-item .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 10px 12px !important;
    text-align: center !important;
    text-indent: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    color: inherit !important;
  }

  table.ls-answers.table-array-radio td.answer-item.radio-item > label::before,
  table.ls-answers.table-array-radio td.answer-item.checkbox-item > label::before,
  table.ls-answers.radio-array td.answer-item.radio-item > label::before,
  table.ls-answers.radio-array td.answer-item.checkbox-item > label::before,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility::before,
  table.ls-answers td.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility::before {
    position: static !important;
    display: inline-block !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 !important;
  }

  table.ls-answers.table-array-radio td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers.table-array-radio td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers.radio-array td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers.radio-array td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5) !important;
    background-color: #9d0636 !important;
    background-image: none !important;
    opacity: 0.95 !important;
  }
}


/* ==========================================================
   21) MOBILE ARRAY UNIVERSAL INLINE LABEL FIX
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers td.radio-item,
  table.ls-answers td.checkbox-item,
  table.ls-answers td.answer-item.radio-item,
  table.ls-answers td.answer-item.checkbox-item {
    text-align: center !important;
    vertical-align: middle !important;
  }

  table.ls-answers td.radio-item > label,
  table.ls-answers td.checkbox-item > label,
  table.ls-answers td.answer-item.radio-item > label,
  table.ls-answers td.answer-item.checkbox-item > label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 10px 12px !important;
    text-align: center !important;
  }

  table.ls-answers td.radio-item > label::before,
  table.ls-answers td.checkbox-item > label::before,
  table.ls-answers td.answer-item.radio-item > label::before,
  table.ls-answers td.answer-item.checkbox-item > label::before {
    position: static !important;
    display: inline-block !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 !important;
  }

  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5) !important;
    background-color: #9d0636 !important;
    background-image: none !important;
    opacity: 0.95 !important;
  }
}


/* ==========================================================
   22) NAVIGATOR VISIBILITY SAFETY NET
   ========================================================== */
#navigator-container {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 40 !important;
}

#navigator-container .col-6,
#navigator-container .text-start,
#navigator-container .text-end,
#navigator-container .first-page-btn {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

#ls-button-submit,
#ls-button-next,
button.ls-move-submit-btn,
button.ls-move-next-btn {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

#ls-button-submit[disabled],
#ls-button-next[disabled],
button.ls-move-submit-btn[disabled],
button.ls-move-next-btn[disabled] {
  opacity: 0.65 !important;
}


/* ==========================================================
   23) MOBILE ARRAYS AS STACKED LIST QUESTIONS
   - Make array options look/behave like normal single/multi lists
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers td.radio-item,
  table.ls-answers td.checkbox-item,
  table.ls-answers td.answer-item.radio-item,
  table.ls-answers td.answer-item.checkbox-item {
    padding: 0 !important;
    text-align: left !important;
    vertical-align: middle !important;
    background: transparent !important;
    border-bottom: 1px solid rgba(102, 102, 102, 0.35) !important;
  }

  table.ls-answers td.radio-item > label,
  table.ls-answers td.checkbox-item > label,
  table.ls-answers td.answer-item.radio-item > label,
  table.ls-answers td.answer-item.checkbox-item > label,
  table.ls-answers td.radio-item .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 56px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 16px 15px 16px 70px !important;
    text-align: left !important;
    text-indent: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
    color: inherit !important;
  }

  table.ls-answers td.radio-item > label::before,
  table.ls-answers td.checkbox-item > label::before,
  table.ls-answers td.answer-item.radio-item > label::before,
  table.ls-answers td.answer-item.checkbox-item > label::before,
  table.ls-answers td.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility::before {
    position: absolute !important;
    left: 35px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    display: inline-block !important;
  }

  table.ls-answers td.radio-item:hover,
  table.ls-answers td.checkbox-item:hover,
  table.ls-answers td.answer-item.radio-item:hover,
  table.ls-answers td.answer-item.checkbox-item:hover {
    background-color: #19324a !important;
  }

  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility {
    color: #ffffff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5) !important;
    background-color: #9d0636 !important;
    background-image: none !important;
    opacity: 0.95 !important;
  }
}


/* ==========================================================
   24) MOBILE ARRAY SUBQUESTION HEADER VISIBILITY
   - Keep each subquestion title above its stacked answers
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers tr.answers-list > th.answertext,
  table.ls-answers tr.answers-list > th.arraycaptionleft,
  table.ls-answers tr.answers-list > th.arraycaptionright {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
    font-weight: 600 !important;
    padding: 12px 15px !important;
    margin: 0 !important;
    background: #0f2235 !important;
    color: #ffffff !important;
    border-top: 1px solid rgba(102, 102, 102, 0.35) !important;
    border-bottom: 1px solid rgba(102, 102, 102, 0.35) !important;
    white-space: normal !important;
  }
}


/* ==========================================================
   25) MOBILE ARRAY SELECTED STATE MATCH STANDARD LIST
   - Full-row blue highlight + cyan tick (not magenta chip)
   ========================================================== */
@media only screen and (max-width: 768px) {
  /* Remove chip-style selected background from inline label nodes */
  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility {
    background: transparent !important;
    color: inherit !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }

  /* Apply selected style to the whole answer cell like normal list questions */
  table.ls-answers td.radio-item:has(input[type="radio"]:checked),
  table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked),
  table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked),
  table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked) {
    background-color: rgba(61, 169, 252, 0.22) !important;
    color: #ffffff !important;
  }

  table.ls-answers td.radio-item:has(input[type="radio"]:checked) > label,
  table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked) > label,
  table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked) > label,
  table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked) > label,
  table.ls-answers td.radio-item:has(input[type="radio"]:checked) .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked) .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked) .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked) .ls-label-xs-visibility {
    color: #ffffff !important;
    font-weight: 600 !important;
  }

  table.ls-answers td.radio-item:has(input[type="radio"]:checked) > label::before,
  table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked) > label::before,
  table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked) > label::before,
  table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked) > label::before,
  table.ls-answers td.radio-item:has(input[type="radio"]:checked) .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked) .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked) .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked) .ls-label-xs-visibility::before {
    color: #3da9fc !important;
  }
}


/* ==========================================================
   26) MOBILE ARRAY REMOVE CHIP FORCE FULL-ROW SELECT
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers td.radio-item label,
  table.ls-answers td.checkbox-item label,
  table.ls-answers td.answer-item.radio-item label,
  table.ls-answers td.answer-item.checkbox-item label,
  table.ls-answers td.radio-item .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 16px 15px 16px 70px !important;
    margin: 0 !important;
    text-align: left !important;
    background: transparent !important;
    color: inherit !important;
  }

  /* Neutralize inner chip spans that still receive magenta backgrounds */
  table.ls-answers td.radio-item label span,
  table.ls-answers td.checkbox-item label span,
  table.ls-answers td.answer-item.radio-item label span,
  table.ls-answers td.answer-item.checkbox-item label span,
  table.ls-answers td.radio-item .ls-label-xs-visibility span,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility span,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility span,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility span {
    background: transparent !important;
    color: inherit !important;
  }

  table.ls-answers td.radio-item label::before,
  table.ls-answers td.checkbox-item label::before,
  table.ls-answers td.answer-item.radio-item label::before,
  table.ls-answers td.answer-item.checkbox-item label::before,
  table.ls-answers td.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility::before {
    position: absolute !important;
    left: 35px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
  }

  /* Checked state must be full row (not chip) */
  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility {
    background-color: rgba(61, 169, 252, 0.22) !important;
    color: #ffffff !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }

  table.ls-answers td.radio-item input[type="radio"]:checked + label::before,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label::before,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label::before,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label::before,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility::before {
    color: #3da9fc !important;
  }
}


/* ==========================================================
   27) ARRAY TABLE OVERRIDE FOR LEGACY ANSWERTEXT CHIP
   - Defeat old checked label.answertext chip rules in arrays
   ========================================================== */
@media only screen and (max-width: 768px) {
  /* Force array option labels to occupy full row width */
  table.ls-answers td.radio-item label.answertext,
  table.ls-answers td.checkbox-item label.answertext,
  table.ls-answers td.answer-item.radio-item label.answertext,
  table.ls-answers td.answer-item.checkbox-item label.answertext,
  table.ls-answers td.radio-item label.radio-label,
  table.ls-answers td.checkbox-item label.checkbox-label,
  table.ls-answers td.answer-item.radio-item label.radio-label,
  table.ls-answers td.answer-item.checkbox-item label.checkbox-label,
  table.ls-answers td.radio-item .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item .ls-label-xs-visibility {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 16px 15px 16px 70px !important;
    background: transparent !important;
    text-align: left !important;
  }

  /* Kill legacy magenta chip on label + pseudo */
  table.ls-answers td.radio-item input[type="radio"]:checked + label.answertext,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label.answertext,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label.answertext,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label.answertext,
  table.ls-answers td.radio-item input[type="radio"]:checked + label.answertext::before,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label.answertext::before,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label.answertext::before,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label.answertext::before {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }

  /* Apply full-row selected style to checked array labels */
  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility {
    background-color: rgba(61, 169, 252, 0.22) !important;
    background-image: none !important;
    color: #ffffff !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }

  table.ls-answers td.radio-item input[type="radio"]:checked + label::before,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label::before,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label::before,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label::before,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility::before {
    color: #3da9fc !important;
  }
}


/* ==========================================================
   28) EXACT ARRAY CELL LABEL FIX (ls-label-xs-visibility)
   - Match td.answer-item.radio-item > input + label.ls-label-xs-visibility
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers td.answer-item.radio-item > label.ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item > label.ls-label-xs-visibility,
  table.ls-answers td.radio-item > label.ls-label-xs-visibility,
  table.ls-answers td.checkbox-item > label.ls-label-xs-visibility {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 56px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 16px 15px 16px 70px !important;
    background: transparent !important;
    text-align: left !important;
    color: inherit !important;
    border-radius: 0 !important;
  }

  table.ls-answers td.answer-item.radio-item > label.ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item > label.ls-label-xs-visibility::before,
  table.ls-answers td.radio-item > label.ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item > label.ls-label-xs-visibility::before {
    position: absolute !important;
    left: 35px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
  }

  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label.ls-label-xs-visibility,
  table.ls-answers td.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label.ls-label-xs-visibility {
    background-color: rgba(61, 169, 252, 0.22) !important;
    background-image: none !important;
    color: #ffffff !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }

  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility::before,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label.ls-label-xs-visibility::before,
  table.ls-answers td.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility::before,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label.ls-label-xs-visibility::before {
    color: #3da9fc !important;
  }
}


/* ==========================================================
   29) MOBILE ARRAY SELECTED TEXT INHERIT THEME
   ========================================================== */
@media only screen and (max-width: 768px) {
  table.ls-answers td.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + label,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + label,
  table.ls-answers td.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.radio-item input[type="radio"]:checked + .ls-label-xs-visibility,
  table.ls-answers td.answer-item.checkbox-item input[type="checkbox"]:checked + .ls-label-xs-visibility {
    color: inherit !important;
  }
}


/* ==========================================================
   31) KEEP SUBHEADERS STABLE ON ARRAY SELECTION
   - Only selected answer rows should change; subheaders stay constant
   ========================================================== */
@media only screen and (max-width: 768px) {
  #limesurvey table.ls-answers tr.ls-subheader-row,
  #limesurvey table.ls-answers .ls-subheader-row,
  #limesurvey table.ls-answers .ls-subheader-cell {
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
  }

  #limesurvey table.ls-answers tr.ls-subheader-row > th,
  #limesurvey table.ls-answers tr.ls-subheader-row > td,
  #limesurvey table.ls-answers .ls-subheader-cell,
  #limesurvey table.ls-answers tr.ls-subheader-row label,
  #limesurvey table.ls-answers .ls-subheader-row label,
  #limesurvey table.ls-answers .ls-subheader-cell label,
  #limesurvey table.ls-answers .ls-subheader-row .control-label,
  #limesurvey table.ls-answers .ls-subheader-cell .control-label {
    opacity: 1 !important;
    text-shadow: none !important;
    filter: none !important;
  }
}


/* ==========================================================
   32) HARD SUBHEADER LOCK (NO SELECTION BLEED)
   - Subheaders must never inherit answer selected-state styling
   ========================================================== */
@media only screen and (max-width: 768px) {
  #limesurvey table.ls-answers tr.ls-subheader-row,
  #limesurvey table.ls-answers tr.ls-subheader-row > th,
  #limesurvey table.ls-answers tr.ls-subheader-row > td,
  #limesurvey table.ls-answers .ls-subheader-cell,
  #limesurvey table.ls-answers tr.answers-list > th.ls-subheader-cell {
    background: #0f2235 !important;
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
  }

  #limesurvey table.ls-answers tr.ls-subheader-row label,
  #limesurvey table.ls-answers .ls-subheader-cell label,
  #limesurvey table.ls-answers tr.ls-subheader-row .control-label,
  #limesurvey table.ls-answers .ls-subheader-cell .control-label {
    background: transparent !important;
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
  }

  #limesurvey table.ls-answers tr.ls-subheader-row input,
  #limesurvey table.ls-answers .ls-subheader-cell input,
  #limesurvey table.ls-answers tr.ls-subheader-row label::before,
  #limesurvey table.ls-answers tr.ls-subheader-row label::after,
  #limesurvey table.ls-answers .ls-subheader-cell label::before,
  #limesurvey table.ls-answers .ls-subheader-cell label::after {
    display: none !important;
    content: none !important;
  }

  /* If any subheader row accidentally contains checked inputs, neutralize it */
  #limesurvey table.ls-answers tr.ls-subheader-row input:checked + label,
  #limesurvey table.ls-answers tr.ls-subheader-row input:checked + .ls-label-xs-visibility,
  #limesurvey table.ls-answers .ls-subheader-cell input:checked + label,
  #limesurvey table.ls-answers .ls-subheader-cell input:checked + .ls-label-xs-visibility {
    background: transparent !important;
    color: #ffffff !important;
    opacity: 1 !important;
  }
}


/* ==========================================================
   33) HARD LIST SUBHEADER LOCK (NO SELECTION BLEED)
   - For ul.ls-answers subheading rows ([[SubHeading]])
   ========================================================== */
@media only screen and (max-width: 768px) {
  #limesurvey ul.ls-answers li.ls-subheader-row,
  #limesurvey ul.ls-answers li.ls-subheader-row:hover,
  #limesurvey ul.ls-answers li.ls-subheader-row:focus {
    background: #0f2235 !important;
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    border-top: 1px solid rgba(102,102,102,.35) !important;
    border-bottom: 1px solid rgba(102,102,102,.35) !important;
  }

  #limesurvey ul.ls-answers li.ls-subheader-row label,
  #limesurvey ul.ls-answers li.ls-subheader-row .control-label,
  #limesurvey ul.ls-answers li.ls-subheader-row .checkbox-label,
  #limesurvey ul.ls-answers li.ls-subheader-row .label-text,
  #limesurvey ul.ls-answers li.ls-subheader-row span {
    background: transparent !important;
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    font-weight: 600 !important;
  }

  #limesurvey ul.ls-answers li.ls-subheader-row input,
  #limesurvey ul.ls-answers li.ls-subheader-row label::before,
  #limesurvey ul.ls-answers li.ls-subheader-row label::after,
  #limesurvey ul.ls-answers li.ls-subheader-row .checkbox,
  #limesurvey ul.ls-answers li.ls-subheader-row .radio {
    display: none !important;
    content: none !important;
  }

  #limesurvey ul.ls-answers li.ls-subheader-row input:checked + label,
  #limesurvey ul.ls-answers li.ls-subheader-row input:checked + .ls-label-xs-visibility {
    background: transparent !important;
    color: #ffffff !important;
    opacity: 1 !important;
  }
}


/* ==========================================================
/* ==========================================================
   35) LOCK TR.ANSWERS-LIST.RADIO-LIST > TH.ANSWERTEXT.CONTROL-LABEL
   - Exact row structure guard from selection bleed
   ========================================================== */
@media only screen and (max-width: 768px) {
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list > th.answertext.control-label,
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list.ls-odd > th.answertext.control-label,
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list.ls-even > th.answertext.control-label {
    background: #0f2235 !important;
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    font-weight: 600 !important;
    text-align: left !important;
  }

  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list > th.answertext.control-label *,
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list.ls-odd > th.answertext.control-label *,
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list.ls-even > th.answertext.control-label * {
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
    text-shadow: none !important;
    background: transparent !important;
  }

  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list > th.answertext.control-label input[type="hidden"],
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list.ls-odd > th.answertext.control-label input[type="hidden"],
  #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list.ls-even > th.answertext.control-label input[type="hidden"] {
    display: none !important;
  }
}


/* ==========================================================
/* ==========================================================
/* ==========================================================
   38) FORCE ARRAY ANSWERS-LIST ROW OPACITY STABLE
   - Prevent any state class from fading question header row text
   ========================================================== */
@media only screen and (max-width: 900px) {
  .js #limesurvey table.ls-answers.radio-array > tbody > tr.answers-list,
  .js #limesurvey table.ls-answers.table-array-radio > tbody > tr.answers-list,
  .js #limesurvey table.ls-answers.subquestion-list.questions-list.radio-array > tbody > tr.answers-list,
  .js #limesurvey table.ls-answers > tbody > tr.answers-list.radio-list,
  .js #limesurvey table.ls-answers > tbody > tr.answers-list.ls-odd,
  .js #limesurvey table.ls-answers > tbody > tr.answers-list.ls-even,
  .js #limesurvey table.ls-answers > tbody > tr.answers-list.ls-disabled,
  .js #limesurvey table.ls-answers > tbody > tr.answers-list.ls-irrelevant {
    opacity: 1 !important;
    filter: none !important;
  }
}

/* ==========================================================
/* ==========================================================
   40) MOBILE ARRAY: DISABLE BOOTSTRAP TABLE-HOVER ACCENT BLEED
   - Prevent `.table-hover > tbody > tr:hover > *` from washing row headers
   ========================================================== */
@media only screen and (max-width: 900px) {
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:hover > *,
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:focus-within > * {
    --bs-table-accent-bg: transparent !important;
    background-image: none !important;
  }

  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:hover > th.answertext,
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:hover > th.answertext.control-label,
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:focus-within > th.answertext,
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:focus-within > th.answertext.control-label {
    --bs-table-accent-bg: transparent !important;
    background-color: inherit !important;
  }
}

/* ==========================================================
   41) MOBILE ARRAY HEADER NEVER TRANSPARENT ON DESELECT
   ========================================================== */
@media only screen and (max-width: 900px) {
  #limesurvey table.ls-answers > tbody > tr.answers-list > th.answertext,
  #limesurvey table.ls-answers > tbody > tr.answers-list > th.answertext.control-label {
    --bs-table-accent-bg: transparent !important;
    background-image: none !important;
    background-color: #0f2235 !important;
    color: #ffffff !important;
  }

  #limesurvey table.ls-answers > tbody > tr.answers-list > th.answertext *,
  #limesurvey table.ls-answers > tbody > tr.answers-list > th.answertext.control-label * {
    color: #ffffff !important;
    background: transparent !important;
  }
}

/* ==========================================================
   42) QUASAI MOBILE: ONLY SELECTED ANSWER CELL HIGHLIGHTS
   - Disable row-level table-hover accent bleed on touch/mobile arrays
   ========================================================== */
@media only screen and (max-width: 900px), (hover: none) {
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list > * {
    --bs-table-accent-bg: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:hover > *,
  #limesurvey table.ls-answers.table-hover > tbody > tr.answers-list:focus-within > * {
    --bs-table-accent-bg: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  /* keep selected state scoped to the selected answer cell only */
  #limesurvey table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked),
  #limesurvey table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked),
  #limesurvey table.ls-answers td.radio-item:has(input[type="radio"]:checked),
  #limesurvey table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked) {
    --bs-table-accent-bg: transparent !important;
  }
}

/* ==========================================================
   43) QUASAI MOBILE: REMOVE ROW/LIST HOVER FILL
   - Disable `li.checkbox-item:hover, table.ls-answers > tbody > tr:hover` on mobile
   ========================================================== */
@media only screen and (max-width: 900px), (hover: none) {
  #limesurvey .radio-item:hover,
  #limesurvey .checkbox-item:hover,
  #limesurvey li.radio-item:hover,
  #limesurvey li.checkbox-item:hover,
  #limesurvey table.ls-answers > tbody > tr:hover,
  #limesurvey table.ls-answers > tbody > tr:hover > td,
  #limesurvey table.ls-answers > tbody > tr:hover > th,
  #limesurvey .table-hover > tbody > tr:hover > * {
    --bs-table-accent-bg: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  /* keep only selected answer cells highlighted */
  #limesurvey table.ls-answers td.answer-item.radio-item:has(input[type="radio"]:checked),
  #limesurvey table.ls-answers td.answer-item.checkbox-item:has(input[type="checkbox"]:checked),
  #limesurvey table.ls-answers td.radio-item:has(input[type="radio"]:checked),
  #limesurvey table.ls-answers td.checkbox-item:has(input[type="checkbox"]:checked) {
    background-color: rgba(61, 169, 252, 0.22) !important;
    box-shadow: none !important;
  }
}
