.scy-form-group {
	margin: 0;
	margin-bottom: calc(1rem*1);
	position:relative;
}


.form-group label {
	font-style: italic;
	/*color: var(--scy-body-gradient1-color-muted);*/
	color: var(--scy-element-gradient1-color-muted);
	padding-top: .25rem;
	padding-bottom: .25rem;
} 

.form-group label.scy-label-value {
	position:absolute;
	right:0;
} 


/*
FORM / INPUT 
*/

.scy-form-group .form-control {
	color: var(--scy-element-gradient1-input-color);
	background-color: var(--scy-element-gradient1-input-background);
	/*border: 1px solid var(--scy-element-gradient1-border);*/
}
.scy-form-group .form-control::placehoder {
	color: var(--scy-element-gradient1-input-color-muted);
}
.scy-form-group .form-control:disabled, 
.scy-form-group .form-control[readonly] {
	color: var(--scy-element-gradient1-input-color-muted);
	background-color: var(--scy-element-gradient1-input-background-muted);
}




/*
FORM / INPUT / COLOR
*/

.scy-form-group ::-webkit-color-swatch,
.scy-form-group ::-moz-color-swatch {
	border-color: transparent;
	border-radius: var(--scy-border-radius-lg);
}

.scy-form-group input[type="color"] {
	background: transparent;
	padding: 0;
	cursor: pointer;
}



/*
FORM / INPUT / RANGE
*/

.scy-form-group input[type=range] {
	padding: 0;                   
	font: inherit;                
	outline: none;
	color:var(--scy-body-gradient1-color-muted);                  
	box-sizing: border-box;       
	transition: all .2s;
	cursor: pointer;
	padding-left: 0.25rem;
	padding-right: 0.25rem; 

}
.scy-form-group input[type=range]:hover,
.scy-form-group:focus input[type=range] {
	color:var(--scy-primary-background);                  
}
/* la zone de déplacement */
.scy-form-group input[type=range]::-webkit-slider-runnable-track,
.scy-form-group input[type=range]::-moz-range-track {
	height: 100%;
	border: none;
	border-radius: 2.5rem;
	background-color: transparent;
	 
}
/* Cursor */
.scy-form-group input[type=range]::-webkit-slider-thumb,
.scy-form-group input[type=range]::-moz-range-thumb {
	width: 2rem;
	height: 2rem;                
	border: none;                   
	border-radius: 50%;               
	background: currentColor;
}
/* Cursor */
.scy-form-group input[type=range]::-ms-thumb {
	width: 2rem;
	height: 2rem;                
	border: none;                   
	border-radius: 50%;               
	background: currentColor;
}
/* Progress (before) */
.scy-form-group input[type=range]::-moz-range-progress {
	height: inherit;
	background: transparent;     
}   

/*
FORM / CHECKBOX
*/

/* Customize the label (the scy-checkbox-container) */
.scy-form-group .scy-checkbox-container {
	display: block;
	position: relative;
	padding-left: 2.5rem;
	margin-bottom: 12px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
} 

/* Hide the browser's default checkbox */
.scy-form-group .scy-checkbox-container input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

/* Create a custom checkbox */
.scy-form-group .scy-checkbox-container .checkmark {
	position: absolute;
	top: .25rem;
	left: 0;
	height: 1.5rem;
	width: 1.5rem;
	background-color: var(--scy-body-gradient1-color-muted);
}

/* On mouse-over, add a grey background color */
.scy-form-group .scy-checkbox-container:hover input ~ .checkmark {
	background-color: var(--scy-primary-background-hover);
}

/* When the checkbox is checked, add a blue background */
.scy-form-group .scy-checkbox-container input:checked ~ .checkmark {
	background-color: var(--scy-primary-background);
}

/* Create the checkmark/indicator (hidden when not checked) */
.scy-form-group .scy-checkbox-container .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

/* Show the checkmark when checked */
.scy-form-group .scy-checkbox-container input:checked ~ .checkmark:after {
	display: block;
}

/* Style the checkmark/indicator */
.scy-form-group .scy-checkbox-container .checkmark:after {
	left: 9px;
	top: 3px;
	width: .5rem;
	height: 1rem;
	border: solid var(--scy-primary-color);
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
} 


/*
FORM / DROPDOWN LIST (CUSTOM SELECT)
*/
.scy-form-group .dropdown-toggle {
	width:100%;
	color: var(--scy-element-gradient1-input-color);
	background-color: var(--scy-element-gradient1-input-background);
	border: var(--scy-border-size) solid var(--scy-form-input-background);
	text-align: left;
	display: flex;
	justify-content: space-between;
}
.scy-form-group .dropdown-toggle::after {
	display: none;
}
.scy-form-group .dropdown-toggle .bi{
	width:1.5rem;
	height:1.5rem;
}

.scy-form-group .dropdown-menu {
	/*border: var(--scy-border-size) solid var(--scy-primary-background-focus);*/
	border: var(--scy-border-size) solid var(--scy-form-input-background);
	width: 100%;
	min-width: 20rem;
}
.scy-form-group .dropdown-menu:not(.scy-dropdown-media-select) .dropdown-list {
	max-height: 30rem; 
	display: block; 
	overflow: auto; 
	margin: .5rem;
}
.scy-form-group .dropdown-menu:not(.scy-dropdown-media-select) .dropdown-item {
	text-overflow: ellipsis;
	overflow: hidden;
}

.scy-form-group .dropdown-menu.scy-dropdown-media-select {
	position: fixed !important;
	top: 50% !important;
	width: 90vw;
	height: 90vh;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
}

.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-search-section {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 1rem;
	justify-content: space-between;
	align-items: center;
}
.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-search-title {
	display: flex;
	justify-content: left;
	align-items: center;
}
.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-search-title h3 {
	margin:0;
	padding-left:1rem;
}
.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-search-input {
	width:25rem;
}

.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin: 0;
	overflow: hidden;
	overflow-y: auto;
	height: calc(90vh - 12rem);
	align-content: start;
	padding:1rem;
	justify-content: space-evenly;
}
.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-item {
	width: 15rem;
	height: 15rem;
}
.scy-form-group .dropdown-menu.scy-dropdown-media-select .dropdown-list a {
	cursor: pointer;
}

/*
FORM / MEDIAS
*/



/*
FORM / STEPS
*/


/* Hide all steps by default: */
.scy-form-step-tab {
	display: none;
	/*visibility: hidden;*/
}

/* Make circles that indicate the steps of the form: */
.scy-form-step-point {
	height: .75rem;
	width: .75rem;
	margin: 0 2px;
	background-color: var(--scy-body-gradient1-color-muted);
	border: none;
	border-radius: 50%;
	display: inline-block;
	opacity: 0.5;
}

/* Mark the active step: */
.scy-form-step-point.active {
	background-color: var(--scy-body-gradient1-color);
	opacity: 1;
}

/* Mark the steps that are finished and valid: */
.scy-form-step-point.finish {
	background-color: var(--scy-body-gradient1-color-muted);
}