/* 
    ---
    MVIEWER STUDIO
    Feuille de style pour les propriétés spécifiques des composants d'interface
    -
    Compatible avec la version Bootstrap 5.2	
    ---
    */

	@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

	body {
	  font-family: 'Poppins', sans-serif;
	  width: 100%;
	  height: 100%;
	}
	
	/*
	-- PROPRIETES GENERALES
	*/
	
	a {
	  cursor: pointer;
	}
	
	.noborder {
	  border: none;
	}
	
	.noborderradius {
	  border-radius: 0 !important;
	}
	
	.strong {
	  font-weight: 600;
	  font-size: 1.1em;
	}
	
	.hideBlock {
	  display: none;
	}
	
	.showBlock {
	  display: block;
	}
	
	.list-group-item {
	  background-color: #ffffff00;
	}
	
	.modal {
	  overflow-y: auto !important;
	}

	/* Tooltip */
	.tooltip-info i {
		vertical-align: middle;
		margin-left: 3px;
	}

	
	/* Alert */
	
	.alert {
	  display: flex;
	  align-items: center;
	  line-height: 1.2;
	}
	
	.alert i {
		margin-right: 0.2em;
		vertical-align: bottom;
	}
	
	#liveAlertPlaceholder {
		position: fixed;
		z-index: 2000;
		bottom: 1rem;
		right: 2rem;
	}

	#liveAlertPlaceholder .alert i {
		font-size: 1.2rem;
		vertical-align: middle;
	}

	#liveAlertPlaceholder .btn-close i {
		font-size: 1.4rem;
		margin-left: 2.5rem;
		margin-right: 0!important;
	}
	/*lib : Bootstrap5 Tags input*/
	.subcomponents .badge .btn-close {
		box-sizing: content-box;
		width: 1em;
		height: 1em;
		padding: 0.25em 0.25em;
		color: white;
		background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
		border: 0;
		border-radius: 0.375rem;
		opacity: .5;
	}

	.subcomponents .badge .btn-close-white {
		filter: invert(1) grayscale(100%) brightness(200%);
	}

	/* Tagsinput */
	
	#mod-layerOptions .bootstrap-tagsinput {
	  width: 100%;
	  box-shadow: none;
	  border-radius: 0.6em;
	  padding: 0.5rem 0.5rem;
	}
	
	.bootstrap-tagsinput .tag {
	  background-color: var(--info) !important;
	  color: white;
	  padding: 2px 6px !important;
	  border-radius: 7px !important;
	}
	
	/* Button */
	
	button i {
	  vertical-align: middle;
	}
	
	.btn-outline-danger:hover {
	  color: white;
	}
	
	/*
	-- EFFECTS HOVER
	*/
	
	.zoom,
	.zoomCard {
	  transition: transform .2s;
	}
	
	.zoom:hover {
	  transform: scale(1.2);
	}
	
	.zoomCard:hover {
	  transform: scale(1.05);
	  opacity: 0.92;
	}
	
	/* 
	-- ACCORDION 
	-- NOTE : Ajout du style pour le composant accordion non disponible dans le thème boostrap.css généré 
	*/
	
	.accordion {
	  --bs-accordion-color: #4e4e4e;
	  --bs-accordion-bg: #fff;
	  --bs-accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
	  --bs-accordion-border-color: #D1D1D1;
	  --bs-accordion-border-width: 1px;
	  --bs-accordion-border-radius: 0.8rem;
	  --bs-accordion-inner-border-radius:
		calc(0.8rem - 1px);
	  --bs-accordion-btn-padding-x: 1.25rem;
	  --bs-accordion-btn-padding-y: 1rem;
	  --bs-accordion-btn-color: #212529;
	  --bs-accordion-btn-bg:
		var(--bs-accordion-bg);
	  --bs-accordion-btn-icon:
		url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	  --bs-accordion-btn-icon-width: 1.25rem;
	  --bs-accordion-btn-icon-transform:
		rotate(-180deg);
	  --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
	  --bs-accordion-btn-active-icon:
		url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2c2c52'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	  --bs-accordion-btn-focus-border-color: #86b7fe;
	  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.1rem var(--primary);
	  --bs-accordion-body-padding-x: 1.25rem;
	  --bs-accordion-body-padding-y: 1rem;
	  --bs-accordion-active-color:
		var(--primary);
	  --bs-accordion-active-bg: #f5f5f5;
	}
	
	.accordion-button {
	  position: relative;
	  display: flex;
	  align-items: center;
	  width: 100%;
	  padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
	  font-size: 1rem;
	  font-weight: 600;
	  color: var(--primary);
	  text-align: left;
	  background-color: var(--bs-accordion-btn-bg);
	  border: 0;
	  border-radius: 0;
	  overflow-anchor: none;
	  transition: var(--bs-accordion-transition);
	}
	
	@media (prefers-reduced-motion: reduce) {
	  .accordion-button {
		transition: none;
	  }
	}
	
	.accordion-button:not(.collapsed) {
	  color: #2c2c52;
	  box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
	  font-weight: 600;
	}
	
	.accordion-button:not(.collapsed)::after {
	  background-image: var(--bs-accordion-btn-active-icon);
	  transform: var(--bs-accordion-btn-icon-transform);
	}
	
	.accordion-button::after {
	  flex-shrink: 0;
	  width: var(--bs-accordion-btn-icon-width);
	  height: var(--bs-accordion-btn-icon-width);
	  margin-left: auto;
	  content: "";
	  background-image: var(--bs-accordion-btn-icon);
	  background-repeat: no-repeat;
	  background-size: var(--bs-accordion-btn-icon-width);
	  transition: var(--bs-accordion-btn-icon-transition);
	}
	
	@media (prefers-reduced-motion: reduce) {
	  .accordion-button::after {
		transition: none;
	  }
	}
	
	.accordion-button:hover {
	  z-index: 2;
	}
	
	.accordion-button:focus {
	  z-index: 3;
	  border-color: var(--bs-accordion-btn-focus-border-color);
	  outline: 0;
	  box-shadow: var(--bs-accordion-btn-focus-box-shadow);
	}
	
	.accordion-header {
	  margin-bottom: 0;
	}
	
	.accordion-item {
	  color: var(--bs-accordion-color);
	  background-color: var(--bs-accordion-bg);
	  border: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color);
	}
	
	.accordion-item:first-of-type {
	  border-top-left-radius: var(--bs-accordion-border-radius);
	  border-top-right-radius: var(--bs-accordion-border-radius);
	}
	
	.accordion-item:first-of-type .accordion-button {
	  border-top-left-radius: var(--bs-accordion-inner-border-radius);
	  border-top-right-radius: var(--bs-accordion-inner-border-radius);
	}
	
	.accordion-item:not(:first-of-type) {
	  border-top: 0;
	}
	
	.accordion-item:last-of-type {
	  border-bottom-right-radius: var(--bs-accordion-border-radius);
	  border-bottom-left-radius: var(--bs-accordion-border-radius);
	}
	
	.accordion-item:last-of-type .accordion-button.collapsed {
	  border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
	  border-bottom-left-radius: var(--bs-accordion-inner-border-radius);
	}
	
	.accordion-item:last-of-type .accordion-collapse {
	  border-bottom-right-radius: var(--bs-accordion-border-radius);
	  border-bottom-left-radius: var(--bs-accordion-border-radius);
	}
	
	.accordion-body {
	  padding: var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x);
	}
	
	.accordion-flush .accordion-collapse {
	  border-width: 0;
	}
	
	.accordion-flush .accordion-item {
	  border-right: 0;
	  border-left: 0;
	  border-radius: 0;
	}
	
	.accordion-flush .accordion-item:first-child {
	  border-top: 0;
	}
	
	.accordion-flush .accordion-item:last-child {
	  border-bottom: 0;
	}
	
	.accordion-flush .accordion-item .accordion-button,
	.accordion-flush .accordion-item .accordion-button.collapsed {
	  border-radius: 0;
	}
	
	.title-accordion {
	  color: var(--primary);
	  font-size: 1.1rem;
	  font-weight: 600;
	}
	
	.subtitle-accordion {
	  font-size: 0.9rem;
	  color: #4e4e4e;
	  font-weight: normal;
	}
	
	.accordion-button:hover {
	  background-color: var(--light);
	}
	
	
	/*
	-- NAVBAR
	*/

	#navbarStudio a,
	#navbarStudio span {
	  color: white;
	  font-weight: 500;
	  cursor: default;
	}
	
	/*
	-- PAGE D'ACCUEIL
	*/
	
	.subtitle-home {
	  color: var(--warning);
	  font-size: 18px;
	  font-weight: 700;
	}
	
	.title-home {
	  color: var(--primary);
	  font-size: 50px;
	  font-weight: 700;
	}
	
	.iconCard-home {
	  background-color: #ffffff3d;
	  padding: 0rem;
	  padding: 15px;
	  border-radius: 1em;
	  margin-bottom: 0em;
	}
	
	#cardsHome {
	  display: flex;
	  flex-wrap: wrap;
	  justify-content: flex-start;
	  align-items: stretch;
	}
	
	#cardsHome a:hover {
	  text-decoration: none !important;
	}
	
	#cardsHome .card-text,
	#cardsPublication .card-text {
	  font-size: 16px;
	  font-weight: 300;
	}
	
	#containerHome .nav-item {
	  color: #929292;
	}
	
	/*
	-- STUDIO
	*/
	
	/* Title Tabs */
	
	#stepStudioContent h1 {
	  color: var(--primary);
	  font-weight: 600;
	}
	
	#stepStudioContent h1 i {
	  font-weight: normal;
	  vertical-align: bottom;
	}
	
	/* Wizard */
	
	#blockWizard>div {
	  border-radius: 1em;
	  padding: 2rem;
	}
	
	#wizardCredits a {
	  color: #929292 !important;
	}
	
	#wizardCredits a:hover {
	  text-decoration: underline;
	}
	
	/* Documentation */
	
	#helpStudioBloc {
	  background-color: #934ae424;
	  padding: 1.5rem 1rem;
	  border-radius: 0.8em;
	  display: flex;
	  align-items: center;
	  flex-wrap: wrap;
	  justify-content: space-evenly;
	}
	
	#helpStudioBloc a:hover {
	  color: white;
	}
	
	/*
	-- MODULES STUDIO
	*/
	
	/* TOOLSBAR */
	
	#toolsbarStudio {
	  text-align: end;
	  position: absolute;
	  right: 2em;
	}
	
	#toolsbarStudio .nav-link {
	  border-radius: 0.8rem;
	  margin-left: 1em;
	  font-weight: 500;
	  padding: 0.7rem 0.75rem;
	  font-size: 0.9rem;
	  line-height: 1.5;
	}
	
	#toolsbarStudio .nav-link:hover {
	  opacity: 0.8;
	}
	
	#toolsbarStudio .nav-link i {
	  vertical-align: middle;
	}
	
	#toolsbarStudio-View {
	  color: var(--info);
	  background-color: #934ae430;
	}
	
	#toolsbarStudio-Save {
	  color: white;
	  background-color: var(--info);
	}

	#toolsbarStudio-delete {
		color: white;
		background-color: var(--danger);
	}

	#toolsbarStudio-unpublish {
		color: white;
		background-color: var(--warning);
	}
	
	#btnSwitchAdvanced {
	  color: var(--info);
	}

	#mod-layerOptions .custom-switch {
		margin-bottom: 5px;
	}
	.versionActionsCol a {
		font-size: 18px;
	}

	#versionPreviewLink {
		color: var(--info)
	}
	#versionDeleteLink {
		color: var(--danger);
	}

	#versionAsNewLink {
		color: var(--warning);
	}

	#versionVersionIcon {
		color: var(--success);
	}

	.publishedVersion {
		color: var(--warning);
		font-weight: 500;
	}
	.published {
		color: black;
		font-weight: 500;
	}

	.custom-tooltip-table>span {
		display: none;
		color: white;
		background-color: #585858;
		font-size: small;
		padding: 5px;
		border-radius: 5px;
		font-weight: normal;
		position: absolute;
		margin-left: 10px;
	}

	.custom-tooltip-table:hover>span {
		display: block!important;
	}
	
	/* APPLICATION  */
	
	/* Fond de plan */
	
	.img-BackgroundMap {
	  width: 4em;
	  border-radius: 1em;
	  margin-right: 1em;
	}
	
	#backgroundlayers-config .bl {
	  border-left: none;
	  border-right: none;
	}
	
	#backgroundlayers-config .bl:first-child {
	  border-top: none;
	}
	
	#frm-lis-styles {
	  display: flex;
	  align-items: stretch;
	}
	
	#frm-bl-visible option:disabled {
	  display: none;
	}
	
	/* Recherche */
	
	#collapseSearch .list-group-item:first-child {
	  border-bottom: none;
	}
	
	#collapseSearch .list-group-item:not(:first-child) {
	  border-top: 1px solid rgba(0, 0, 0, 0.125);
	}
	
	/* Thème de l'application */
	
	select#opt-style {
	  color: #fff;
	}
	
	#opt-style option {
	  color: #FFFFFF;
	}
	
	.alizarin,
	.alizarin:focus {
	  background-color: #E64B3B;
	}
	
	.blue,
	.blue:focus {
	  background-color: #032e46;
	}
	
	.default,
	.default:focus {
	  background-color: #34495D;
	}

	.theme-designfr,
	.theme-designfr:focus {
	  background-color: #ffffff;
	  color: #333333 !important;
	}


	.nephritis,
	.nephritis:focus {
	  background-color: #26AE60;
	}
	
	.ripe_lemon,
	.ripe_lemon:focus {
	  background-color: #F6CA17;
	}
	
	.amethyst,
	.amethyst:focus {
	  background-color: #9A59B6;
	}
	
	.carrot,
	.carrot:focus {
	  background-color: #E67E21;
	}
	
	.green,
	.green:focus {
	  background-color: #70BA50;
	}
	
	.peter_river,
	.peter_river:focus {
	  background-color: #3497DB;
	}
	
	.black,
	.black:focus {
	  background-color: #000000;
	}
	
	.chambray,
	.chambray:focus {
	  background-color: #3A529A;
	}
	
	.green_sea,
	.green_sea:focus {
	  background-color: #1ABC9C;
	}
	
	.pink,
	.pink:focus {
	  background-color: #F62359;
	}
	
	.wet_asphalt,
	.wet_asphalt:focus {
	  background-color: #34495D;
	}
	
	.row.fld.selected {
	  background-color: #9E9E9E;
	}
	
	/* Options de la carte */
	
	#map {
	  height: 25em;
	}
	
	/* THEMATIQUES & DONNEES */
	
	/* Panneaux des thématiques */
	
	.themes-list-item {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	}
	
	.theme-options-btn .btn {
	  margin: 0 5px;
	}
	
	.theme-name {
	  font-weight: 500;
	  margin-right: 10px;
	}
	
	.theme-infos-layer {
	  background-color: #934ae430;
	  padding: 4px 9px;
	  border-radius: 10px;
	  color: var(--info);
	}
	
	.layer-move,
	.theme-move {
	  cursor: move;
	  cursor: -webkit-grabbing;
	  float: right;
	  padding-right: 0.2em;
	  padding-left: 0.2em;
	}
	
	.layer-remove,
	.theme-remove {
	  float: right;
	  padding-right: 0.2em;
	  padding-left: 0.2em;
	  cursor: pointer;
	}
	
	.moveList {
	  cursor: move;
	}
	
	.layer-edit,
	.theme-edit {
	  float: right;
	  padding-right: 0.2em;
	  padding-left: 0.2em;
	  cursor: pointer;
	}
	
	#themes-list .list-group-item.active,
	#themeLayers .list-group-item.active {
	  color: #4e4e4e;
	  background-color: var(--light);
	  border-color: rgba(0, 0, 0, 0.125);
	}
	
	/* Paramétrage de la thématique sélectionnée */
	
	.layers-list-item {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	}
	
	.layer-options-btn .btn {
	  margin: 0 5px;
	}
	
	.selected-icon {
	  margin: 0.2em 0.5em;
	  padding: 0.1em 0.5em;
	  padding: 0.6em 0.9em;
	  background-color: #e7e7e7;
	  color: #515151;
	  border-radius: 9px;
	}
	
	/* FONCTIONNALITES AVANCEES */
	
	.list-flex {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	}
	
	#searchelasticsearch_options,
	#searchlocalities_options {
	  display: none;
	  padding-top: 20px;
	  padding-bottom: 20px;
	}
	
	/* PUBLICATION */
	
	.iconCard-finish {
	  background-color: #ffffff3d;
	  padding: 0rem;
	  padding: 18px 18px;
	  border-radius: 1rem;
	  margin-bottom: 0em;
	}
	
	#cardsPublication a:hover {
	  text-decoration: none;
	}
	
	#cardsPublication {
	  display: flex;
	  flex-direction: row-reverse;
	  justify-content: flex-end;
	  align-items: stretch;
	  flex-wrap: wrap;
	  align-content: center;
	}
	
	#cardsPublication div {
	  margin-right: 7px;
	}

	.badge-publish {
		color: white;
		background-color: var(--warning);
	}
	.badge-draft {
		color: white;
		background-color: #934ae4;
	}

	.badge-title {
		font-size: 15px;
	}
	
	/*
	-- MODALS 
	*/
	
	.modal-title {
	  color: var(--primary);
	  font-weight: 600;
	}
	
	/* Nav in modal */
	
	.modal-body .nav-pills .nav-item {
	  padding: 0px 1.5em 0 0;
	}
	
	.modal-body .nav-pills .nav-link {
	  padding: 8px 0px;
	}
		
	.modal-body .nav-pills .nav-link.active {
	  color: var(--info);
	  background: none;
	  font-weight: 500;
	  border-radius: 0;
	  -webkit-box-shadow: 0px 2px 0px 0px #934ae4;
	  box-shadow: 0px 3px 0px 0px #934ae4;
	}
	
	.modal-body .nav .nav-link:hover {
	  color: var(--info);
	  background: none;
	}
	
	/* Modal Open project */
	
	#liste_applications {
	  height: 420px;
	  overflow-y: auto;
	}	
	
	#liste_applications h5 {
	  color: var(--info) !important;
	}
	
	/* Modal - Features value */
	
	#distinct_values {
	  max-height: 450px;
	  overflow-y: auto;
	}
	
	/* Modal - Close Studio */
	
	.cardsClose {
	  display: flex;
	  align-items: center;
	  padding: 1rem;
	  margin: 15px 0;
	  border-radius: 0.6rem;
	}
	
	.save-close {
	  background-color: var(--info) !important;
	  color: white !important;
	}
	
	.notsave-close {
	  color: var(--info) !important;
	  border: 1px solid var(--info);
	}
	
	.cardsClose i {
	  font-size: 1.2em;
	  padding: 8px 12px;
	  border-radius: 0.6rem;
	  margin-right: 1rem;
	}
	
	.save-close i {
	  background-color: #ffffff45;
	}
	
	.notsave-close i {
	  background-color: #934ae43b !important;
	}
	
	.returnConf-close i {
	  font-size: 1.2em;
	  vertical-align: middle;
	}
	
	a.returnConf-close:hover {
	  color: var(--info);
	}
	
	/* Modal - Import des thématiques */
	
	.titleThema {
		color: var(--info);
		font-weight: 600;
		font-size: 1.1em;
		margin-top: 12px;
	}
	
	.publisherThema {
		margin-bottom: 12px;
		font-style: italic;
	}
	
	.descriptionThema:first-letter {
		text-transform: capitalize;
	}
	
	.urlThema,
	.idThema {
		display: none !important;
	}
	
	#tableThemaExt thead {
		display: none !important;
	}
	
	#tableThemaExt td {
		display: block;
		border: none !important;
		padding: 2px !important;
		margin-left: 10px;
	}
	
	#tableThemaExt tr {
		border: 1px solid #D1D1D1;
	}
	
	#tableThemaExt tr:hover {
		background-color: var(--light);
		cursor: pointer;
	}
	
	#tableThemaExt tr.selected td {
		background: none;
	}
	
	.checkCustom {
		margin: 0 !important;
		vertical-align: middle;
		display: table-cell !important;
		padding-left: 35px;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}
	
	.checkCustom input {
		position: absolute;
		opacity: 0;
		cursor: pointer;
		height: 0;
		width: 0;
	}
	
	.checkCustom span {
		position: absolute;
		border-radius: 0.9rem;
		top: 40%;
		left: 1rem;
		width: 1.2rem;
		height: 1.2rem;
		background-color: #fff;
		border: #BDBDBD solid 1px;
	}
	
	.checkCustom input:checked~span {
		background-color: var(--info);
		border-color: var(--info);
	}
	
	.checkCustom span:after {
		content: "";
		position: absolute;
		display: none;
	}
	
	.checkCustom input:checked~span:after {
		display: block;
	}
	
	.checkCustom span:after {
		left: 6px;
		top: 3px;
		width: 5px;
		height: 10px;
		border: solid white;
		border-width: 0 3px 3px 0;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	/* Modal Theme externe - Param */

	#nameThemeExt {
		font-size: 16px;
		font-weight: 500;
	}
	
	/* Modal - Ajout d'une couche */
	
	#mod-layerNew h6,
	#mod-layerOptions h6,
	#mod-themeOptions h6 {
	  font-size: 16px;
	  font-weight: 500;
	}
	
	.ogc-results .list-group-item {
	  margin: 5px 0px;
	  border-radius: 14px;
	}
	
	.ogc-results .list-group-item:hover {
	  background-color: var(--light);
	}
	
	.ogc-results .list-group-item .custom-checkbox {
	  display: flex;
	  align-items: center;
	}
	
	.ogc-results {
	  max-height: 420px;
	  overflow-y: auto;
	}
	
	/* Modal iconPicker */
	
	.icon-picker-list a:hover,
	.icon-picker-list a.active {
	  background-color: var(--info) !important;
	}
	
	.btn-layer-new {
	  float: right;
	  margin-right: 20px;
	}
	
	.icon-picker-list li {
	  flex: 0 0 10% !important;
	}
	
	/*  Modal LayerOptions */

	#layerTypeLabel {
		background-color: var(--info);
		color: white;
		padding: 0.5em 0.7em;
		border-radius: 1em;
		text-transform: uppercase;
		font-size: 0.9em;
		margin-left: 1em;
	}	
	
	#opacity-value {
		margin: 0.7rem;
		background-color: #934de242;
		padding: 0.3rem 0.7rem;
		color: var(--info);
		border-radius: 0.6rem;
	}
	
	/* === range theme and appearance === */
	input[type="range"] {
		font-size: 1rem;
		width: 100%;
	}
	
	input[type="range"] {
		color: var(--info);
		--thumb-height: 1.125em;
		--track-height: 0.125em;
		--track-color: rgba(0, 0, 0, 0.2);
		--clip-edges: 0.125em;
	}
	
	/* === range commons === */
	input[type="range"] {
		position: relative;
		background: #fff0;
		overflow: hidden;
	}
	
	/* === WebKit specific styles === */
	input[type="range"],
	input[type="range"]::-webkit-slider-runnable-track,
	input[type="range"]::-webkit-slider-thumb {
		-webkit-appearance: none;
		transition: all ease 100ms;
		height: var(--thumb-height);
	}
	
	input[type="range"]::-webkit-slider-runnable-track,
	input[type="range"]::-webkit-slider-thumb {
		position: relative;
	}
	
	input[type="range"]::-webkit-slider-thumb {
		--thumb-radius: calc((var(--thumb-height) * 0.5) - 1px);
		--clip-top: calc((var(--thumb-height) - var(--track-height)) * 0.5 - 0.5px);
		--clip-bottom: calc(var(--thumb-height) - var(--clip-top));
		--clip-further: calc(100% + 1px);
		--box-fill: calc(-100vmax - var(--thumb-width, var(--thumb-height))) 0 0
			100vmax currentColor;
		width: var(--thumb-width, var(--thumb-height));
		background: linear-gradient(currentColor 0 0) scroll no-repeat left center /
			50% calc(var(--track-height) + 1px);
		background-color: currentColor;
		box-shadow: var(--box-fill);
		border-radius: var(--thumb-width, var(--thumb-height));
	
		filter: brightness(100%);
		clip-path: polygon(
			100% -1px,
			var(--clip-edges) -1px,
			0 var(--clip-top),
			-100vmax var(--clip-top),
			-100vmax var(--clip-bottom),
			0 var(--clip-bottom),
			var(--clip-edges) 100%,
			var(--clip-further) var(--clip-further)
		);
	}
	
	input[type="range"]:hover::-webkit-slider-thumb {
		cursor: grab;
		opacity:0.9;
	}
	
	input[type="range"]::-webkit-slider-runnable-track {
		background: linear-gradient(var(--track-color) 0 0) scroll no-repeat center /
			100% calc(var(--track-height) + 1px);
	}
	
	/* === Firefox specific styles === */
	input[type="range"],
	input[type="range"]::-moz-range-track,
	input[type="range"]::-moz-range-thumb {
		appearance: none;
		transition: all ease 100ms;
		height: var(--thumb-height);
	}
	
	input[type="range"]::-moz-range-track,
	input[type="range"]::-moz-range-thumb,
	input[type="range"]::-moz-range-progress {
		background: #fff0;
	}
	
	input[type="range"]::-moz-range-thumb {
		background: currentColor;
		border: 0;
		width: var(--thumb-width, var(--thumb-height));
		border-radius: var(--thumb-width, var(--thumb-height));
		cursor: grab;
	}
	
	input[type="range"]:active::-moz-range-thumb {
		cursor: grabbing;
	}
	
	input[type="range"]::-moz-range-track {
		width: 100%;
		background: var(--track-color);
	}
	
	input[type="range"]::-moz-range-progress {
		appearance: none;
		background: currentColor;
		transition-delay: 30ms;
	}
	
	input[type="range"]::-moz-range-track,
	input[type="range"]::-moz-range-progress {
		height: calc(var(--track-height) + 1px);
		border-radius: var(--track-height);
	}
	
	input[type="range"]::-moz-range-thumb,
	input[type="range"]::-moz-range-progress {
		filter: brightness(100%);
	}
  
  
	
	#layer_sections .title-accordion {
	  font-size: 1rem;
	}
	
	.layer-style {
	  margin-bottom: 1em;
	}
	
	.layer-style-block {
	  border: 1px solid #D1D1D1;
	  border-radius: 0.6rem;
	  padding: 15px;
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	  justify-content: space-between;
	}
	
	div#map_filter {
	  height: 300px !important;
	}
	
	#frm-lis-styles input[type="text"]:focus-visible {
	  outline: none;
	  background-color: #d1d1d12b;
	}
	
	.layer-style-block img {
	  width: fit-content;
	  max-width: 100%;
	}
	
	.layer-style-block label:hover {
	  color: var(--info);
	}
	
	/* Interrogation */
	
	.list-group-item.fld {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  flex-direction: row;
	  border-left: none;
	  border-right: none;
	  flex-wrap: wrap;
	}
	
	.list-group-item.fld:first-child {
	  border-top: none;
	}
	
	.list-group-item.fld:last-child {
	  border-bottom: none;
	}
	
	.list-group-item.fld i {
	  cursor: grab;
	}
	
	.list-group-item.fld.selected {
	  background-color: var(--light);
	}
	
	.list-group-item.fld.selected .fld-name {
	  font-weight: 600;
	}
	
	#query-parameters {
	  display: none;
	}
	
	#query-parameters.visible {
	  display: block;
	}
	
	/* Recherche */
	
	#fuse_options {
	  display: none;
	}
	
	/* Modal Configuration XML */
	
	pre.windows-code-XML {
	  background-color: #060024;
	  color: white;
	  padding: 1rem 0.5rem;
	  width: 100%;
	}
	
	/* Scrollbar */
	
	pre::-webkit-scrollbar {
	  width: 8px;
	  height: 10px
	}
	
	pre::-webkit-scrollbar-thumb {
	  background: #767987;
	  border-radius: 8px;
	}
	
	/* Modal - Ajouter une couche */
	
	#providers_dropdown {
	  width: 20em;
	  text-align: right;
	}
	
	
	/*
	-- MOBILE 
	*/
	
	@media (max-width: 800px) {
	  #stepStudioContent {
		margin: 6em 0em !important;
	  }
	
	  #containerHome {
		padding: 10em 2em;
	  }
	
	  #cardsHome a {
		margin-bottom: 2em !important;
	  }
	
	  #homeNavbarDoc {
		position: relative !important;
	  }	
	}

	/*Template generator*/
	#newCustomTemplateManager, #openTemplateGeneratorBtn, #customTemplateManager, #dismissTemplateGeneratorMsg {
		display: flex;
	}

	#generatorComponentsDDArea .subcomponents .tags-menu{
		top: auto !important;
	}

	/*Financeurs credit*/

	.credits img{
		height:50px;
	}
	.credits .col{
		text-align:center;
	}
	.credits {
		padding-bottom: 15px;
	}