/***** Curseur étoiles de type radio ACCESSIBLE ******/

.cursorRadio table.question-choices{
	margin : 0 auto;
}
body.elq_js_loaded .cursorRadio fieldset{
	margin : 0;
	padding : 0;
	padding-top:6px;
	border:none;
}

body.elq_js_loaded .cursorRadio label:not(:last-of-type){
	margin-right : 10px;
}
body.elq_js_loaded .cursorRadio label {
	display: inline-block;
	cursor: pointer;
}
body.elq_js_loaded .cursorRadio output {
	display : inline-block;
	font-size:100%;
	width : 100%;
	box-sizing :border-box;
	color:#f16e00;
	font-weight:bold;
	padding : 15px 15px 5px 15px;
}

/* Pour les questions tableaux étoiles*/
body.elq_js_loaded  tbody.cursorRadio fieldset{
	width : 240px;
	max-width : 240px;
}

body.elq_js_loaded  tbody.cursorRadio output{
	width : 100%;
	padding : 0 15px 0px 15px;
	line-height:30px;
}

/* Pour pouvoir voir l'outline sur le premier curseur étoile du tableau et la dernière à droite */
body.elq_js_loaded .question-GROUPE .questions-table-parent{
	padding-top:2px;
	padding-right : 2px;
}

body.elq_js_loaded .cursorRadio svg {
	width: 40px;
	height: 40px;
	fill :#F16E00;
	fill: var(--stars-selected-color,#F16E00);
	stroke :#F16E00 ;
	stroke : var(--stars-selected-color,#F16E00);
	stroke-width : 1px;
}

body.elq_js_loaded .cursorRadio.noSelection label > svg,
body.elq_js_loaded .cursorRadio input:checked ~ label > svg{
	fill : none;
	stroke :#000000 ;
	stroke : var(--stars-stroke-color,#000000);
	stroke-width : 1px;
}
body.elq_js_loaded .cursorRadio input:checked + label >svg{
	fill :#F16E00;
	fill: var(--stars-selected-color,#F16E00);
	stroke :#F16E00;
	stroke: var(--stars-selected-color,#F16E00);
	stroke-width : 1px;
}
body.elq_js_loaded .cursorRadio:not(.readOnly) fieldset:hover input + label >svg{
	fill : #F16E00;
	fill: var(--stars-hover-color,#F16E00);
	stroke : #F16E00;
	stroke: var(--stars-hover-color,#F16E00);
	stroke-width : 1px;
}

body.elq_js_loaded .cursorRadio:not(.readOnly) input:hover ~ label >svg{
	fill :none;
	stroke :#000000;
	stroke: var(--stars-stroke-color,#000000);
	stroke-width : 1px;
}
body.elq_js_loaded .cursorRadio:not(.readOnly) input:hover + label >svg,
body.elq_js_loaded .cursorRadio:not(.readOnly) label.beforeHover >svg{
	fill :#F16E00;
	fill: var(--stars-hover-color,#F16E00);
	stroke : #F16E00;
	stroke: var(--stars-hover-color,#F16E00);
	stroke-width : 1px;
}
body.elq_js_loaded .cursorRadio:not(.readOnly) label.afterHover >svg{
	fill:none !important;
	stroke :#000000;
	stroke: var(--stars-stroke-color,#000000) !important;
	stroke-width : 1px;
}


/* Partie spé DIFF MAIL : positionner la classe diffMail sur le questionnaire (dispo dès v4.0.3) */

body.diffMail{
	--stars-unselected-color:#cccccc;
}

/***** On "efface" les réglages orange *****/
body.elq_js_loaded .diffMail .cursorRadio svg >g>g,
body.elq_js_loaded .diffMail .cursorRadio.noSelection label > svg>g>g,
body.elq_js_loaded .diffMail .cursorRadio input:checked ~ label > svg >g >g,
body.elq_js_loaded .diffMail .cursorRadio input:checked + label >svg >g >g,
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) fieldset:hover input + label >svg,
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) input:hover ~ label >svg >g >g,
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) input:hover + label >svg>g>g,
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) label.beforeHover >svg >g >g,
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) label.afterHover >svg >g >g,
body.elq_js_loaded .diffMail .cursorRadio svg >g>g{
	fill : none ;
	stroke : none ;
}

body.elq_js_loaded .diffMail .cursorRadio svg {
	width: 40px;
	height: 40px;
	fill : #F16E00;
	fill: var(--stars-selected-color,#F16E00);
	stroke : none ;
}

body.elq_js_loaded .diffMail .cursorRadio.noSelection label > svg,
body.elq_js_loaded .diffMail .cursorRadio input:checked ~ label > svg{
	fill : #cccccc;
	fill:var(--stars-unselected-color,#cccccc);
	stroke : none ;
}
body.elq_js_loaded .diffMail .cursorRadio input:checked + label >svg{
	fill :#F16E00;
	fill: var(--stars-selected-color,#F16E00);
	stroke : none ;
}
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) fieldset:hover input + label >svg{
	fill : #F16E00;
	fill: var(--stars-hover-color,#F16E00);
	stroke : none ;
}

body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) input:hover ~ label >svg{
	fill :#ffd943;
	fill : var(--stars-unselected-color,#ffd943);
	stroke : none ;
}
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) input:hover + label >svg,
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) label.beforeHover >svg{
	fill :#F16E00;
	fill: var(--stars-hover-color,#F16E00);
	stroke : none ;
}
body.elq_js_loaded .diffMail .cursorRadio:not(.readOnly) label.afterHover >svg{
	fill:#cccccc !important;
	fill : var(--stars-unselected-color,#cccccc);
	stroke : none !important;
}

/* Pour les encadrés en version DiffMail */
body .diffMail textarea, body .diffMail textarea.valid, body .diffMail input[type='text'], body .diffMail input[type='text'].valid{
	border : 1px solid #000000 !important;
}
body .diffMail textarea:focus, body .diffMail textarea.valid:focus, body .diffMail input[type='text']:focus, body .diffMail input[type='text'].valid:focus{
	border : 1px solid #F16E00 !important;
}

/****** Fin partie spé diffMail */

body.elq_js_loaded .cursorRadio tr.question-choices-label{
	display : none;
}

body.elq_js_loaded  .cursorRadio table.question-choices{
	margin : 0;
	width : auto !important;
	/* pour voir l'outline de la première et dernière étoile */
	padding : 0 2px;
}

body.elq_js_loaded .cursorRadio output{
	width : auto;
	font-weight : normal;
	color:#000000;
	padding : 0 15px;
}

body.elq_js_loaded .visuallyhidden{
	border: 0;
	clip: rect(0 0 0 0);

	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
	left:-999999px;
	margin : 0;
}

/************ Gestion de l'outline = bordure apparaissant au focus *******************/

body textarea, body textarea.valid, body input[type='text'], body input[type='text'].valid{
	/* pour ne pas gêner le focus */
	border: 1px solid transparent;
	border-bottom:1px solid #000000;
}

body.elq_js_loaded .radioContainer input ~ .radiomark,
body.elq_js_loaded .checkboxContainer input ~ .checkmark,
body.elq_js_loaded .cursorRadio input + label,
button, input[type='text'], input[type='email'], select, textarea, a{
	outline-offset: .25rem;
	transition: outline-offset .15s ease-in-out;
}

button:focus,
body.elq_js_loaded .radioContainer input:focus ~ .radiomark,
body.elq_js_loaded .checkboxContainer input:focus ~ .checkmark,
body.elq_js_loaded .cursorRadio input:focus + label,
input[type='text']:focus,input[type='email']:focus, select:focus,  a:focus,
textarea:focus,
.js-focus-visible button.focus-visible:focus,
.js-focus-visible body.elq_js_loaded .radioContainer input.focus-visible:focus ~ .radiomark,
.js-focus-visible body.elq_js_loaded .checkboxContainer input.focus-visible:focus ~ .checkmark,
.js-focus-visible body.elq_js_loaded .cursorRadio input.focus-visible:focus + label,
.js-focus-visible input[type='text'].focus-visible:focus,input[type='email'].focus-visible:focus, select.focus-visible:focus,  a.focus-visible:focus,
.js-focus-visible textarea.focus-visible:focus{
	outline-style : solid;
	outline-width : 2px;
	outline-color:#f16E00;
	outline: .125rem solid #f16e00;
	outline-offset: 0;
}

/*.js-focus-visible :focus:not(.focus-visible),*/
.js-focus-visible button:focus:not(.focus-visible),
.js-focus-visible body.elq_js_loaded .radioContainer input:focus:not(.focus-visible) ~ .radiomark,
.js-focus-visible body.elq_js_loaded .checkboxContainer input:focus:not(.focus-visible) ~ .checkmark,
.js-focus-visible body.elq_js_loaded .cursorRadio input:focus:not(.focus-visible) + label,
.js-focus-visible input[type='text']:focus:not(.focus-visible),
.js-focus-visible input[type='email']:focus:not(.focus-visible),
.js-focus-visible select:focus:not(.focus-visible),
.js-focus-visible a:focus:not(.focus-visible),
.js-focus-visible textarea:focus:not(.focus-visible){
 	outline: none ;
	outline-offset:0;
}

@supports selector(:focus-visible) {

  /* uniquement au clic/tap focus */
	button:focus:not(:focus-visible),
   	body.elq_js_loaded .radioContainer input:focus:not(:focus-visible) ~ .radiomark,
 	body.elq_js_loaded .checkboxContainer input:focus:not(:focus-visible) ~ .checkmark,
   	body.elq_js_loaded .cursorRadio input:focus:not(:focus-visible) + label,
  	input[type='text']:focus:not(:focus-visible),.js-focus-visible input[type='email']:focus:not(:focus-visible), select:focus:not(:focus-visible),  a:focus:not(:focus-visible),
  	textarea:focus:not(:focus-visible){
  		outline: 0;
		outline-offset: 0;
  }

  /* uniquement au focus clavier */
	button:focus-visible,
	body.elq_js_loaded .radioContainer input:focus-visible ~ .radiomark,
	body.elq_js_loaded .checkboxContainer input:focus-visible ~ .checkmark,
	body.elq_js_loaded  .cursorRadio input:focus-visible + label,
	input[type='text']:focus-visible,.js-focus-visible input[type='email']:focus-visible,.js-focus-visible select:focus-visible,.js-focus-visible  a:focus-visible,
	textarea:focus-visible {
	  	outline: .125rem solid #f16e00;
	  	outline-offset: 0;
  	}
}

/* Pour que l'outline soit visible */
body .question-TEXTE textarea ,body .question-TEXTE input[tyep=text]{
	width : calc(100% - 4px) !important;
}

body .question-TEXTE .question-body{
	padding-left :2px;
	padding-right : 2px;
}