body{
	/*font-size: 14px;*/
}
img {
	border: 0px;
}
form{
	margin-bottom: 0;
}

.ui-widget {
	font-size: 98% !important;
}
.langSelect{
	min-width:100px;
	color: #878787;
}

a.elt-link:hover{
	color: #fa6b1b;/*as bgColorHighlight but after a.elt-link:link */
}

#panelRight {
	z-index: 1000 !important;
}

.elt-link{
	text-decoration: underline;
}

.outer100h {
	display: flex;
	flex-direction: column;
}
.inner100h {
	flex-grow: 1;
}

body.login .appVersion {
	position: fixed;
	bottom: 0;
	right: 0;
	padding-right: 1.2em;
    padding-bottom: 0.5em;
	display: block;
	font-size: 1.2em
}
@media (min-width: 740px) {
	.login-body .login-content .login-panel .login-panel-content h1 {
		font-size: 30px !important;
	}
}

body.min{
	margin : 8px;
}

.blink .ui-menuitem-icon.fa-question {
	/*animation: blink_help_txt 1.5s linear 60;*/
	font-size: larger;
}
@keyframes blink_help_txt {  
	50% { color: #fa6b1b; }
}
.mtb-menuitem.help.blink {
	animation: blink_help 1.5s linear 60;
}
@keyframes blink_help {  
	50% { background-color: #fa6b1b; background-image: none}
}
.news.blink {
	animation: blink_news 1.5s linear infinite;
}
@keyframes blink_news {  
	0% { color: #fa6b1b;}	
	50% { color: #fa6b1b;}
}

body .ui-fieldset {
    padding: 5px;
    margin: 5px;
    height: fit-content;
}

.treeSite {
	background: none;
	font-size: 102% !important;
}	
.treeSite .ui-treenode {
	color: white;
	padding-top: 1px !important;
	padding-bottom: 1px !important;
	padding-left: 0px;
	padding-right: 0px !important;
}
.treeSite .ui-tree-container {
	overflow: visible;
}
.ui-treenode-icon.ui-icon.fa{
	display: inline;
}
.treeSite {
	padding: 0 !important;	
}
.ui-treenode:not(.ui-treenode-leaf) .ui-treenode-icon {
	font-size: 1.2rem;
}

.clearFilterBtn {
	float: right;
	margin-top: -10px;
	padding:2px;
	padding-bottom: 0;
}

#formTreeFilter .label{
	font-size: 85% !important;
}

.searchText.fieldset-in-panel, .myFieldsetOthers.fieldset-in-panel {
	padding-left: 0.5em;
	padding-right: 0.2em;
	padding-bottom: 0.5em;
	padding-top: 0.0em;
	margin: 0
}
.searchText .ui-fieldset-legend {
	cursor: default;
}
.smaller, .selectText .ui-selectonemenu-label, .selectTextSearch .ui-selectonemenu-label {
	font-size: 12px !important;
}

.ui-menuitem, .nowrap, .nowrapd, .ui-fieldset-legend {
	white-space: nowrap !important;
}
th.nowrapd{
	white-space: normal !important;
}


th.editable-column .ui-column-title {
	padding-right: 25px;
	background-image: url("../img/edit.png") !important;
	background-repeat: no-repeat !important;
	background-position: right !important;
}

.ui-wizard-step-title {
	padding-right: 1em;
	background-repeat: no-repeat !important;
	background-position: right !important;
}

.ui-wizard-step-titles li:last-of-type {
	padding-right: 0.4em;
	background-image: none !important;
}
#subTitle0{
	display: none;
}

.ui-dialog  {
	max-height: 100vh;
	max-width: 100vw;
}
.ui-dialog .ui-dialog-content {
	max-height:85vh;
	max-width:100vw;
}

.ui-dialog, .ui-dialog .ui-dialog-content{
	background-color: white;
}
.dialog-buttons, .ui-dialog-buttonpane {
	text-align: center !important;
}
.dialogError {
	border-color: red;
}

.dialogError .ui-widget,.dialogError .ui-widget .ui-widget {
	font-size: 100% !important;
}

.dialogError .ui-dialog-titlebar {
	background: red;
}

.animated .ui-progressbar-value, .ui-progressbar .ui-progressbar-value {
	background-image: url("../../../javax.faces.resource/fileupload/progressbar.gif.xhtml?ln=primefaces") !important;
}				

.panelStep2 {
	margin-top: 15px;
}

.cellspacing5 {
	/*border-collapse:collapse;*/
	border-spacing: 5px !important;
}
.cellpadding5 th, .cellpadding5 td {
	padding: 5px !important;
}
.cellspacing2 {
	/*border-collapse:collapse;*/
	border-spacing: 2px !important;
}
.cellpadding2 th, .cellpadding2 td {
	padding: 2px !important;
}

table.center {
	margin-left:auto; 
	margin-right:auto;
}
  
.tableWidthAuto table{
	width: auto;
}
.dataTable_header_none table thead {
	display: none;
}			
.dataTable_header_left .ui-datatable-header {
	text-align:left;
}
.dataTable_inner_header_clear table thead {
	display: table-header-group;
}
.dt-footer-action .ui-datatable-footer {
	text-align:left;
}
.footerCmd tfoot tr td {
	text-align:center;
}
th.padding-s, td.td-padding-s{
	padding-left: 4px !important;
	padding-right: 4px !important;
}
th.padding-xs, td.td-padding-xs{
	padding-left: 2px !important;
	padding-right: 2px !important;
}
.reflowSortOff .ui-reflow-dropdown, .reflowSortOff .ui-reflow-label{
	display: none;
}
.ui-datatable.nowrap > tr > td {
    white-space: nowrap !important;
}

.wrap-long-word {
	word-break: break-all;
}


.picklist-xxl .ui-picklist-list{
	width:100%;
}
.picklist-xl .ui-picklist-list{
	width:500px;
}
.picklist-l .ui-picklist-list{
	width:250px;
}
.picklist-hxl .ui-picklist-list{
	height:300px;
}
.picklist-hs .ui-picklist-list{
	height:100px;
}
.button-text-browse .ui-button-text{
	padding-left: 0.5em;
    padding-right: 0.5em;
}
.button-icon-action-s{
	width:20px;
	height:20px;
}

.image-icon-action-s{
	height:20px;
	margin-right: .2em;
}
.button-icon-action, .button-icon-action-s, .image-icon-action, .image-icon-action-s{
	vertical-align: middle;
}
.button-action-l {
	/* font-size:larger !important; */
	margin-right: .5em;
}
.cmd-click .image-icon-action {
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 1px;
	padding-bottom: 1px;
}

.cmd-click:hover.ui-state-disabled .image-icon-action {
	background: none;
}
.filter01 .ui-button-text-only .ui-button-text {
	padding: .1em .3em;
}
.ui-datatable .filter01-only .ui-sortable-column-icon {
    float: right;
    margin-top: 3px;
}
.ui-datatable .filter01-only .ui-column-customfilter{
    float: left;
}

.button-float-right{
	float: right;
	margin: -5px -10px 5px 5px;
}
.ui-fieldset .ui-fieldset-content .button-float-right{
	margin-right:0;
}
.ui-fieldset:has(legend) .ui-fieldset-content .button-float-right{
	margin-top: -15px;
}
.button-float-left{
	width: 20px !important;
	float: left;
	margin: -7px 0px 0px -6px !important;
}

.float-right{
	float: right;
}

.sp-message {
	padding: 10px;
	margin:5px 0px;
}
.msg .ui-message-error, .msg .ui-message-warn{
	font-weight: bold;
	padding: 0px;
	margin: 0px;
}
.carouselItem {
	padding-top: 5px;
	padding-bottom: 5px;
	display: inline-block;
	text-align: center;
	vertical-align: middle;
}
.carousel-titleL .ui-carousel-header .ui-carousel-header-title {
	width: 50%;
}
.noBorder, .ui-panelgrid .noBorder, .noBorder tr, .noBorder td, .noBorder .ui-panelgrid-cell {
	border: none !important;
}
.noBg, .noBg tr, .noBg td, .noBg .ui-accordion-content, .noBg .ui-datagrid-content {
	background: none !important;
}

.noPad, .noPad td{
	padding: 0px;
}

.grid-top-center {
	vertical-align: top;
	text-align: center;
}
.grid-top {
	vertical-align: top;
}
.grid-bottom {
	vertical-align: bottom;
}
.grid-middle {
	align-content: center;
}

.center {
	text-align: center;
}
.left {
	text-align: left;
}
.right {
	text-align: right;
}
/* .inlineb {
	display: inline-block;
} */
.inlineb-valign-parent:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
} 
.inlineb-valign-parent:after, .inline-parent:after, .float-parent:after, .float-parent-flex:after { 
   content: "";
   display: block; 
   clear: both;
}
.inline-parent{
  vertical-align: middle;
}
.float-parent-flex { 
   display: flex; 
}
.float-child-valign-middle  {
  margin:auto;
}
.ml-s {
	margin-left: 0.5em;
}
.mr-s {
	margin-right: 0.5em;
}
.mt-s {
	margin-top: 0.5em;
}
.mb-s {
	margin-bottom: 0.5em;
}
.ml-xs {
	margin-left: 0.2em;
}
.mr-xs {
	margin-right: 0.2em;
}
.mt-xs {
	margin-top: 0.2em;
}
.mb-xs {
	margin-bottom: 0.2em;
}
.disabled {
	color: grey;
}
.userPrincipal, .bold , .bold.ui-state-hover{
	font-weight: bold !important;
}
.redAlert, .redAlert .ui-column-title, .redAlert.ui-state-highlight, .redAlert.ui-state-hover {
	font-weight: bold !important;
}
.italic, .newOne {
	font-style: italic;
}
.newOne, a.newOne:link, a.newOne:visited, a.newOne:active {
	color: #fa6b1b !important;
}

.alert-warning {
	color: orange;
}
.quota-warning, .quota-warning .ui-inputfield{
	background-color: #ffa50077 !important;
}

.imgAuto {
	max-width: 100%;
	max-height: 100%;
}
.imgCenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.myGalleria .ui-galleria-panel{
	text-align: center;
	vertical-align: middle;
}

.jqplot-highlighter-tooltip{
	color: white;
	background-color: #9c2063;
	background-color: rgba(156, 32, 99, 0.75);
	padding: 2px;
	z-index: 9999;/*to be over canvasOverlay*/
}
.jqplot-canvasOverlay-tooltip{
	color: white;
	/*font-weight: bold;*/
	background-color: rgba(236, 104, 25, 0.75);
	padding: 2px;
	font-size: larger;
	/*z-index: 9998;/*to be over series*/
}
.jqplot-table-legend-label{
	white-space:nowrap;	
}
.jqplot-table-legend{
	z-index: 9 !important;
}

.selectManyButton-action img{
	opacity: 0.6;
	max-height: 26px;
}
.selectManyButton-action .ui-state-active img{
	opacity: initial;
}
.percent20{
	width:20%;
}
.percent30{
	width:30%;
}
.percent50{
	width:50%;
}
.percent80{
	width:80%;
}
.percent90{
	width:90%;
}
.percent98{
	width:98%;
}
.percent100{
	width:100%;
}
.calData a.ui-state-default {
	color: rgb(0, 255, 61) !important;
}
.CodeMirror { line-height: 1.2; }
.CodeMirror-merge-copy { display: none}
.diffBtn { 
	cursor: pointer;
	vertical-align: middle
}
.diffName {
	width: 45%;
	display: inline-block;
	font-weight: bold;
}
.CodeMirror-merge-r-chunk {
	background: rgba(250, 107, 27, 0.6) !important;
}


/*PF bug: fixed height 200 ko for small picklist (ex: contract option)*/
.ui-picklist .ui-picklist-buttons {
  height: auto !important;
}

.menuTable {
	width:100%;
	border-spacing:0;	
}

.menuTableConnect {
	float:right;	
}

#formDetail .sname {
	font-size: small;
	font-weight: bold;
	margin-top: 10px;	
}
#formDetail .img-missing {
	margin-left: 50px;
}

.galleriaWebcam .imgThumbnail {	
	border: 1px solid rgb(156 32 99);
}
.ui-galleria .ui-galleria-thumbnail-container {
    padding-top: 5px;
}

.panelWebCam {
	padding: 0px;
	width: 320px; 
	margin: auto;
	min-height: 250px
}
.panelWebCam img {
	max-width: 100% !important;
	border-radius: 5px;
  	/*max-height: 250px;*/
}
.panelWebCam .img-none {
	width: 100%;
}
.panelWebCam div {
	padding: 0px !important;
}
.statusOK {
	background:#30a630;
    border-radius: 5px;
}
.statusKO{
	background:#ff6262;
    border-radius: 5px;
}
.panelWebCam .statusOK, .panelWebCam .statusKO {
    font-size: larger;
}
.panelWebCam table {
	width: 100%;
	text-align: center;
}
.panelWebCam td{
	padding: 0px;
}
.panelWebCam .title, .panelWebCam .date{
    border-radius: 5px;
	padding: 2px 0px;
	text-align: center;
}

:focus {
	outline: none !important;
}

.ui-g fieldset, .p-grid  fieldset{
	margin-inline-end: 0;
	margin-inline-start: 0;	
}

.ui-tooltip{
	border: 0;
	background: none;
}



li.ui-carousel-indicator {
	margin-left:5px;
}

div.ui-treenode-content.ui-tree-selectable {
	cursor:pointer;
}


/*************************************************************************** From ##-fix.css files ********************************************************************************************/
/** datatable-fix.css **/

.ui-datatable table {
    table-layout: auto !important;
}

body .ui-datatable .ui-datatable-data > tr > td.datatable-actions {
    text-align: center;
    white-space: nowrap !important;
    padding: 0 !important;
}

body .ui-datatable .ui-datatable-data > tr > td.datatable-actions *,
.ui-datatable-reflow .ui-datatable-data td.datatable-actions[role="gridcell"]:not(.ui-helper-hidden) * {
    margin-right: 3px;
}

body .ui-datatable .ui-paginator {
    position: relative !important;
}

/** pagination **/
body .ui-paginator .ui-paginator-current, body .ui-paginator .ui-paginator-rpp-options {
    padding: 0.1rem 0.1rem !important;
    outline: 0 none !important;
    font-size: 1rem !important;
    border-radius: 4px !important;
    transition: background-color 0.15s, color 0.15s, border-color 0.15s, box-shadow 0.15s !important;
    font-weight: normal !important;
    margin: 0 1rem !important;
}

body .ui-paginator .ui-paginator-current, body .ui-paginator .ui-paginator-rpp-options {
    vertical-align: top !important;
}

/** end pagination **/

/********************************/
/** details-fix.css #panelRight**/

#dialogGalleryForm {
    max-width: 830px !important;
    width: auto !important;
    /*z-index: 10000 !important; ko nested dialog*/
}

.dialog-wrapper-fix {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    z-index: 1010;
    background: transparent;
}

.layout-config .layout-config-button {
    width: 30px;
    height: 30px;
    line-height: 30px;
    left: -30px;
}

.layout-config .layout-config-button i {
	font-size: 22px;
}

.custom-topbar-logo .sidebar-pin {
    background-color: #2e3440;
    display: block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    -moz-transition: all 0.15s;
    -o-transition: all 0.15s;
    -webkit-transition: all 0.15s;
    transition: all 0.15s;
}

.custom-topbar-logo .sidebar-pin i {
  font-size: 22px !important;
  font-weight: normal !important;
  line-height: 30px !important;
}

 .layout-config.layout-config-active {
	top: calc(var(--topbar_height) + 45px);
}

.layout-config-button.shift-up {
	transform: translateY(-50px);	
}

/********************************/
/** general-fix.css **/

:root {
    --menu-width: 280px;
    --sidebar-width: 364px;
    --topbar_height: 75px;
}

/********************************/
/** login-fix.css **/

.panel-login-info .demo {
	background-color: #dddee0;
    padding: 0.3em 1em;
    text-decoration: underline;
}
.panel-login-info .ui-panel-content {
	text-align: right;
}
.login-panel-content .ui-panel .ui-panel-content {
	border: 0 !important;
}

.langSelectWrapper {
    position: absolute;
    top: 1.3rem;
    left: 1rem;
}

.langSelect0 {
    /* Reset Select */
    appearance: none;
    outline: 0;
    border: 0;
    box-shadow: none;
    /* Personalize */
    flex: 1;
    padding: 0 1em;
    color: #fff;
    background-color: #2c3e50;
    background-image: none;
    cursor: pointer;

    position: relative;
    display: flex;
    width: 10em;
    height: 3em;
    border-radius: .25em;
    overflow: hidden;
}

.langSelect0::after {
    content: '\25BC';
    position: absolute;
    top: 0;
    right: 0;
    padding: 1em;
    background-color: #34495e;
    transition: .25s all ease;
    pointer-events: none;
}

/* Transition */
.langSelect0:hover::after {
    color: #f39c12;
}

.appVersion {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    color: darkgrey;
    font-size: 1.2rem;
}

.login-body .login-content .login-panel {
    flex-wrap: wrap;
    height: auto;
    min-height: 100vh;
}

.login-body .login-content .login-panel .login-panel-content .forms {
    margin-top: 0;
}

.login-body .login-content .login-panel .login-panel-content {
    width: 100%;
}

/********************************/
/** sidebar-content-fix.css **/

/** class fix for the fieldset of filters **/
.layout-sidebar #formTreeFilter .fieldset-in-panel-class-fix {
    margin: 4px 4px 4px 4px;
    padding: 0px 3px 3px 3px;
    position: relative;
    border: solid 1px black;
}

/** class fix for the legend of the fieldset **/
.layout-sidebar #formTreeFilter .ui-fieldset.fieldset-in-panel-class-fix > .ui-fieldset-legend {
    /*top: -13px;
    left: 12px;
    position: absolute;*/
    padding: 3px !important;
}

/** give some padding to the filters wrapper **/
.filters-wrapper {
    padding: 0 8px;
}

/** fix the width of the tree context menu (right click) **/
.custom-treesite-contextmenu1,
.custom-treesite-contextmenu2 {
    width: 16.5em !important;
}

/** place the ui-commandlink in the center **/
.filters-wrapper .ui-commandlink {
    display: grid;
    place-items: center;
}

/** delete the focus effect from the buttons **/
.filters-wrapper .ui-button.ui-state-focus {
    box-shadow: none !important;
}

/** have compact **/
body .filters-wrapper .filter3 .ui-button,
body .filters-wrapper .filter4 .ui-button,
body .filters-wrapper .ui-fieldset .ui-button {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
}

.filters-wrapper .filter3 .ui-selectonemenu {
    flex-grow: 1;
}

.filter4 > div {
    width: 100% !important;
}

.block-tree-filter {
    display: flex;
    width: 100%;
    gap: 2px;
    align-items: center;
}

.block-tree-filter > span {
    width: 12%;
}

.block-tree-filter input.ui-inputfield {
    width: 20%;
}

.block-tree-filter .ui-selectonemenu, .ui-selectcheckboxmenu-multiple.ui-selectcheckboxmenu {
    width: 70%;
    flex-grow: 1;
}

/** search fieldset **/
.filters-wrapper .searchText {
    position: relative;
    background: #dddee0;
}

.filters-wrapper .searchText .ui-button.ui-button-icon-only {
    position: absolute;
    right: 8px;
    top: -26px;
}

.filters-wrapper .searchText .ui-fieldset-legend {
    /*padding: 3px !important;*/
    /*margin-left: 0;*/
}

.search-fields-wrapper div:nth-child(1) {
    min-width: unset !important;
    width: 29% !important;
}

.search-fields-wrapper div:nth-child(2) {
    min-width: unset !important;
    width: 29% !important;
}

.search-fields-wrapper > input:nth-child(3) {
    width: 30%;
    flex-grow: 1;
}

/** fix padding of the tree **/
body .filters-wrapper .ui-tree {
    width: 100% !important;
    /*padding: 0.6rem !important;*/
}

.filters-wrapper .ui-treenode {
    /*cursor: pointer !important;*/
}

.filters-wrapper .ui-treenode-content:hover .ui-treenode-label,
.filters-wrapper .ui-treenode-content:hover .ui-tree-toggler::before,
.filters-wrapper .ui-treenode-content:hover .ui-icon,
.filters-wrapper .ui-treenode-content:hover svg.fa-folder.ui-icon {
    /*color: white !important;*/
}

.filter3 .ui-selectonebutton,
.operator_and_or .ui-selectonebutton {
    display: flex;
}

/** have compact **/
.filter3 .ui-selectonebutton .ui-button,
.operator_and_or .ui-selectonebutton .ui-button {
    display: grid;
    place-items: center;
}

/** fix the tree helper icon at the bottom left of page **/
.tree-icon-helper {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
}

/********************************/
/** topbar-fix.css **/

.col-topbar-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    height: var(--topbar_height);
    padding: 0 6px;
}

.col-topbar-left {
    flex-grow: 1;
    display: flex;
    align-items: center;
}

.col-topbar-right {
    display: grid;
    place-items: center;
    grid-auto-flow: column;
    gap: 7px;
}

.col-topbar-left .custom-topbar-logo {
    flex-flow: row-reverse;
    align-items: center;
    column-gap: 10px;
    flex-wrap: nowrap;
}

/** ".custom-topbar-logo img" sans le niveau " a img" pour gérer le cas span sans lien site web sur logo client */ 
.col-topbar-left .custom-topbar-logo img, .layout-sidebar .sidebar-logo img, .my-header .custom-topbar-logo img {
    vertical-align: middle;
    max-height: var(--topbar_height);
    padding-top: 10px;
    padding-bottom: 10px;
    border: 0 none;
	width: auto !important;
	height: auto !important;
}


.col-topbar-left .custom-topbar-logo .logo-client img, .layout-sidebar .sidebar-logo .logo-client img{
	padding-left: 5px;
	padding-right: 5px;
}
.col-topbar-left .custom-topbar-logo .logo-client img, .my-header .custom-topbar-logo .logo-client img{
	max-width: 190px;
}
.layout-sidebar.layout-sidebar-active .sidebar-logo {
	padding-left: 5px;
}
.sidebar-logo .logo-client img{
	max-width: calc(var(--sidebar-width) * 0.45)
}

.sidebar-logo .logo1 img{
	max-width: calc(var(--sidebar-width) * 0.15)
}

.sidebar-logo .logo2 img{
	max-width: calc(var(--sidebar-width) * 0.25)
}


.custom-topbar-logo .sidebar-pin i {
    color: #ffffff;
}

.signout-button {
    color: #434c5e;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-color: #d8dee9;
    padding: 6px 12px;
    border: none;
    cursor: pointer;
}

/** screen over 991px */
.custom-topbar-logo,
.mobile-navbar-icons {
    display: none !important;
}

.layout-topbar {
    width: calc(100% - var(--sidebar-width));
}

/** Menu **/
body .layout-topbar .ui-menu {
    width: 100%;
    border: none;
    background: transparent;
    display: flex;
    justify-content: center;
    padding: 0 !important;
    border-radius: unset !important;
}

body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link {
    display: flex;
    justify-content: center;
}

body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link > span,
body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link > svg {
    color: #fff;
}

body .layout-topbar .ui-menu .ui-menu-parent .ui-menu-child {
    width: auto;
}

body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem {
    margin-right: 5px;
    border-radius: 3px;
    color: #fff;
}
body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem:last-child {
    margin-right: 0px;
}

body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link {
    padding-top: 7px;
    padding-right: 10px;
    padding-bottom: 7px;
	padding-left: 6px;
}
body .ui-menu .ui-menu-list .ui-menuitem:not(.icon-only) .ui-menuitem-link:not(.icon-only) .ui-menuitem-icon {
	margin-right: 0.4rem !important;
}
body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-icon-triangle-1-s:last-child {
	margin-left: 0.4rem !important;
	/*margin-right: -0.7rem;*/
}
.icon-only .ui-menuitem-icon {
	margin-right: 0 !important;
}
body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link.icon-only, .ui-menuitem:not(.ui-menu-parent) .ui-menuitem-link /* home without submenu*/ {
    padding-right: 6px !important;
}

/** End Menu **/


/********************************/
/** topbar-profile-fix.css **/

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    list-style-type: none;
    margin: 0;
    padding: 0;
    height: 100%;
    gap: 3px;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions > li > ul:before {
    width: 50px;
    height: 6px;
    background-color: #5e81ac;
    content: " ";
    -moz-border-radius-topleft: 2px;
    -webkit-border-top-left-radius: 2px;
    border-top-left-radius: 2px;
    -moz-border-radius-topright: 2px;
    -webkit-border-top-right-radius: 2px;
    border-top-right-radius: 2px;
    position: absolute;
    top: -5px;
    left: auto;
    right: 0;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions > li {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions > li.active-topmenuitem > ul {
    display: block;
    left: auto;
    right: 0;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions > li > ul {
    display: none;
    position: absolute;
    top: var(--topbar_height);
    list-style-type: none;
    margin: 0;
    padding: 0;
    z-index: 1000;
    min-width: 140px;
    height: fit-content;
    font-weight: 500;
    background-color: #ffffff;
    -webkit-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    -moz-box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header {
    padding: 12px 18px 0 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background-image: url("/traffic/javax.faces.resource/images/topbar/bg-profilemenu@2x.jpg.xhtml?ln=mirage-layout");
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header .performance {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header .performance span {
    margin-bottom: 12px;
    font-size: 11px;
    color: #c3ccdd;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions > li > ul > li img {
    margin-right: 8px;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header .profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    text-align: right;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header .profile img {
    margin: 0;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header .profile h1 {
    color: #eceff4;
    margin: 0;
    font-size: 16px;
    font-weight: normal;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.profile-submenu-header .profile span {
    color: #c3ccdd;
    font-size: 13px;
    margin-bottom: 10px;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li.layout-submenu-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > ul > li:last-child {
    cursor: initial;
    border: none;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .layout-topbar-actions > li > ul > li {
    padding: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    color: #4c566a;
    cursor: pointer;
}

.fadeInDown {
    -webkit-animation: fadeInDown 0.5s;
    animation: fadeInDown 0.5s;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > a.anchor-open {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
    margin: 0 0.5em;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > .anchor-open .profile-image-wrapper img {
    height: 45px;
    width: 45px;
    border: 0 none;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > .anchor-open .profile-info-wrapper {
    margin-left: 10px;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > .anchor-open .profile-info-wrapper h3 {
    font-size: 16px !important;
    font-weight: 500;
    color: #4c566a;
    margin: 0;
}

h3 {
	font-size: unset;
	margin: 0.5rem 0 0.5rem 0 !important;
}

.layout-topbar .col-topbar-wrapper .col-topbar-right .profile-item > .anchor-open .profile-info-wrapper span {
    font-size: 13px;
    font-weight: 500;
    color: #9199a9;
}

/********************************/
/** user-fix.css **/

.abc input,
.abc select,
.abc .ui-selectonemenu {
    width: 100% !important;
}

.user-roles-list-datatable .ui-column-title .ui-outputpanel {
    display: flex;
    gap: 3px;
    justify-content: center;
}

body .user-fieldset-in-panel.fieldset-in-panel.ui-fieldset {
    margin: 0;
}

.user-fieldset-in-panel.fieldset-in-panel .ui-picklist > div {
    float: unset;
    display: unset;
    vertical-align: unset;
}

.user-fieldset-in-panel.fieldset-in-panel .ui-picklist .ui-picklist-list {
    width: 100%;
}

.user-fieldset-in-panel.fieldset-in-panel .ui-picklist {
    display: flex;
}

.user-fieldset-in-panel.fieldset-in-panel .ui-picklist-list-wrapper {
    width: 42%;
}

.user-fieldset-in-panel.fieldset-in-panel .ui-picklist-buttons {
    width: 16% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: unset !important;
    padding: 0 !important;
}

body .user-fieldset-in-panel.fieldset-in-panel .ui-button.ui-button-icon-only {
    width: unset;
    min-width: 2.357rem;
}

.change-password-user-settings .login-input-wrapper {
    position: relative;
    margin-bottom: 24px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

.change-password-user-settings label {
    color: #c3ccdd;
}

.change-password-user-settings .login-input-wrapper input {
    border: solid 1px #c3ccdd;
    color: #d8dee9;
}

.change-password-user-settings .login-input-wrapper input {
    width: 100%;
    padding-right: 16px;
    background-color: transparent;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px #c3ccdd;
    color: #d8dee9;
    margin-top: 6px;
}

.change-password-user-settings .login-input-wrapper i {
    color: #d8dee9;
}

.change-password-user-settings .login-input-wrapper i {
    position: absolute;
    color: #d8dee9;
    font-size: 16px;
    top: 50%;
    right: 0.429em;
    margin-top: 3px;
}

/*************************************************************************** previous mainXXXXX.css  ********************************************************************************************/


/** compact style override theme **/
.ui-datatable input.ui-column-filter {
    font-size: 80% !important;
    width: 90% !important;
}

body .ui-paginator .ui-paginator-first,
body .ui-paginator .ui-paginator-prev,
body .ui-paginator .ui-paginator-next,
body .ui-paginator .ui-paginator-last,
body .ui-paginator .ui-paginator-pages .ui-paginator-page {
    line-height: 1.75rem;
    width: 1.75rem;
    height: 1.75rem;
    min-width: unset;
}

/* pour n'indenter que les inputs de type "filtrer" */
body .ui-inputfield:not(.ui-spinner-input):not(input[aria-label="Filtrer"]) {
    padding: 2.5px !important;
}
input[aria-label="Filtrer"] {
    padding: 2.5px !important;
    text-indent: 30px;
}

body .ui-spinner .ui-spinner-input {
    padding: 2px 2.8rem !important;
}

body .ui-button.ui-button-text-only .ui-button-text {
    padding: .3em;
}

body .ui-button.ui-button-icon-only .ui-button-text {
    padding: .3em !important;
    text-indent: -9999999px !important;
}

body .ui-panelgrid .ui-panelgrid-cell {
    padding: .3rem !important;
}

body .ui-wizard .ui-wizard-step-titles .ui-wizard-step-title {
    padding: 0.4em;
    font-weight: bold;
}

body .ui-wizard-step-title:not(.ui-state-highlight) {
    background-color: #818284 !important;
}

.ui-accordion .ui-accordion-header {
    cursor: pointer !important;
    position: relative !important;
    margin-top: 2px !important;
    min-height: 0 !important;
    padding: .5em .5em .5em 2.2em !important;
}

.fieldset-in-panel .ui-fieldset-legend,
.fieldset-in-cell .ui-fieldset-legend {
    padding-bottom: 2px !important;
    padding-top: 2px !important;
    border: none !important;
}

.ui-selectonelistbox .ui-selectlistbox-item,
.ui-selectmanymenu .ui-selectlistbox-item,
.ui-multiselectlistbox .ui-multiselectlistbox-item {
    margin: 2px !important;
    padding: 0 !important;
}

.ui-datatable .ui-datatable-header,
.ui-datatable .ui-datatable-footer {
    text-align: center !important;
    padding: 4px 10px !important;
}

body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label {
    padding: 0.1rem !important;
}

body .ui-datatable thead th,
body .ui-datatable tbody td, body .ui-datatable .ui-datatable-data > tr > td,
body .ui-datatable tfoot td,
body .ui-datatable tfoot th {
    padding: 4px;
    overflow: hidden;
}

/*body .ui-datatable thead th {
	border-width: 1px 0 2px 1px !important;
}*/

.ui-panel .ui-panel-titlebar {
    padding: .5em 1em .3em !important;
}

/** end compact style override theme **/


/** compact style custom classes **/
/** over 1225px **/
@media (min-width: 1225px) {
    .picklist-xl .ui-picklist-list {
        width: 500px;
    }
}

.image-icon-action {
    height: 25px !important;
    margin-right: .2em !important;
}

.ml-s {
    margin-left: 0.5em !important;
}

.ui-wizard-navbar2Top {
    border-top: none !important;
    margin: 3px 5px 0 0 !important;
    padding: 2px !important;
}

.table-visu-filters .ui-inputfield {
    max-width: 90px !important;
}

body .selectManyButton-action .ui-button.ui-button-text-only .ui-button-text {
    padding: .3em !important;
    background-color: transparent !important;
    border-color: transparent !important;
    font-size: 90% !important;
}

body .selectManyButton-action2 .ui-button.ui-button-text-only .ui-button-text {
    padding: .7em .5em !important;
    font-size: 90% !important;
}

.button-icon-action {
    width: 25px !important;
    height: 25px !important;
}

body .filter01 .ui-button.ui-button-text-only .ui-button-text {
    padding: .1em .3em;
}

body .filters-wrapper .filter3 .ui-button,
body .filters-wrapper .filter4 .ui-button,
body .filters-wrapper .ui-fieldset .ui-button {
    max-height: 25px !important;
    max-width: 25px !important;
}

.filters-wrapper .ui-c img {
    width: 26px !important;
    height: 26px !important;
}

.input-xl, .table-xl {
    width: 100%;
}

.input-xl, .table-xl {
    width: 100% !important;
}

/** end compact style custom classes **/

/** fix svg icons positions **/
.svg-inline--fa.fa-arrow-pointer,
.svg-inline--fa.fa-pause {
    margin-left: -4px !important;
}

.svg-inline--fa.fa-file,
.svg-inline--fa.fa-play {
    margin-left: -5px !important;
}

.svg-inline--fa.fa-eraser {
    margin-left: -9px !important;
}

/** end fix svg icons positions **/

/** Fix input type select **/
body .ui-selectonemenu,
body .filters-wrapper .ui-inputfield {
    display: flex !important;
    align-content: center !important;
    flex-wrap: wrap !important;
}

body .ui-selectonemenu .ui-selectonemenu-trigger .ui-icon, body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger .ui-icon {
    color: #fff !important;
}

/** End Fix input type select **/

body .ui-selectonemenu,
body .ui-inputfield {
    vertical-align: bottom !important;
}

body .ui-inputfield {
    font-size: 12px;
}
.widthWith20px {
	 width: calc(100% + 20px);
}

.overflowAuto {
	overflow: auto;
}

/** FIX COLORS ******************* **/
.ui-tabs .ui-tabs-panel {
    background: none !important;
}

.treeSite .ui-treenode {
    color: white !important;
}

body .filters-wrapper .ui-tree {
    background: transparent !important;
}


input[readonly="readonly"], 
input[readonly], 
textarea[readonly="readonly"], 
textarea[readonly], 
input[disabled], 
textarea[disabled] {
    background-color: #CCCCCC !important;
    color: #313131 !important;
    opacity: 55%;
}
/* .ui-inputfield:not([readonly]):not([disabled]), 
.ui-widget-content .ui-inputfield:not([readonly]):not([disabled]), 
.ui-widget-header .ui-inputfield:not([readonly]):not([disabled]) {
    color: #313131 !important;
} */

.ui-wizard-navbar,
.ui-wizard-navbar2Top {
    text-align: center !important;
}

*:focus, *:active {
    outline: none !important;
    box-shadow: none !important;
}

.filter-plus-moins, .ui-inputfield.filter-plus-moins:not([readonly]):not([disabled]) {
    background: wheat !important;
}


.ui-panel {
    padding: .2em !important;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 3px;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 3px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 3px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 3px;
}

.ui-panel .ui-panel-content {
    border: none;
    background: transparent !important;
    padding: .5em 1em !important;
}

.ui-panel-content.ui-widget-content {
    background: transparent;
    border: none;
}

.ui-panelgrid-cell table.ui-panelgrid tr.ui-widget-content {
    border: none;
}



/* body div.ui-selectonemenu.ui-state-default,
body input.ui-inputfield.ui-state-default,
body textarea.ui-inputfield.ui-state-default,
body select.ui-inputfield.ui-state-default,
body div.ui-chkbox-box.ui-state-default {
    background: white !important;
    color: black !important;
} */

body .ui-chkbox .ui-chkbox-box.ui-state-focus {
  box-shadow: none !important;
}

.ui-widget-header * {
    color: #ffffff !important;
}

#formSelect\:tabView > ul {
    background-color: transparent !important;
}

.ui-layout-unit.ui-widget-content,
.ui-layout-unit-content.ui-widget-content,
.ui-panel.ui-widget-content {
    background: none !important;
}

body .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem.ui-menuitem-active > .ui-menuitem-link > .ui-menuitem-text,
body .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem.ui-menuitem-active > .ui-menuitem-link > .ui-menuitem-icon,
body .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem.ui-menuitem-active > .ui-menuitem-link > .ui-icon {
    color: #fff !important;
}

body .ui-panelgrid .ui-panelgrid-cell.no-bg {
    background: transparent !important;
}


/** END FIX COLORS ******************* **/

.ui-paginator.ui-paginator-top {
    border-bottom: 0 none !important;
    border-top: 0 none !important;
}

body .noBorder, .ui-panelgrid .noBorder, .noBorder tr, .noBorder td, .noBorder .ui-panelgrid-cell {
    border: none !important;
}



body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-leaf-icon {
    width: 0 !important;
    height: 0 !important;
    margin: 12px 20px !important;
}

.input-xl, .menu-xl {
    width: 250px !important;
}

.input-l, .menu-l {
    width: 200px !important;
}

.input-m {
    width: 150px !important;
}

.input-xm {
    width: 110px !important;
}

.input-s {
    width: 80px !important;
}

.input-sm {
    width: 50px !important;
}

.input-xs {
    width: 30px !important;
}
.ui-wizard-navbar-step {
  padding-right: 5px !important;
}
.langSelect, body .ui-selectonemenu.langSelect .ui-selectonemenu-label {
	background-color: #dddee0 !important;
}


.pageCenterActionButtons {
    display: inline-flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    position: absolute;
    top: calc(10px + var(--topbar_height)) !important;
    right: 10px;
}


.dataMap {
	position: absolute;
}

.ui-outputlabel {
	padding-right: 3px;
}

.ui-fileupload-content {
	border-left-style: dashed !important;
	border-left-width: 2px !important; 
	border-right-style: dashed !important;
	border-right-width: 2px !important;
	border-bottom-style: dashed !important;
	border-bottom-width: 2px !important;
}

.layout-sidebar .sidebar-logo .sidebar-pin i {
    font-size: 14px;
}

.layout-sidebar .sidebar-logo .sidebar-pin {
	position: absolute;
	top: 6px;
	right: 5px;	
	line-height: unset;
	z-index: 1001;
	height: 20px;
	width: 20px;
	background-color: rgb(224, 40, 79) !important;
	align-content: center;
}

.ui-fieldset:not(:has(legend)) {
    /*margin-top: 15px;*/
}

.ui-selectonemenu {
    height: 22px;
    font-size: 14px !important;
}

.ui-selectcheckboxmenu-token span {
    font-size: 10px;
}
/* center table column as before */
.ui-datatable-resizable th, .ui-datatable th {
	text-align: center !important;
}

body .ui-fileupload .ui-fileupload-content {
	padding: 0.5rem !important;
}

/* .ui-dialog .ui-dialog-content {
	width: fit-content;	
} */

.ui-datatable-tablewrapper {
	overflow: unset;
}

#formSelect\:downloadLink, #formSelect\:livretLink, #formSelect\:newsLink {
	font-size: 14px !important;	
}

body .ui-fileupload .ui-fileupload-buttonbar {
	height: 36px !important;
	padding: 1px 1px;
}

.buttonTopPage {
	position: absolute;
	top: calc(var(--topbar_height) + 10px);
	right: 1px;
}

body .ui-toggleswitch.ui-toggleswitch-checked .ui-toggleswitch-slider .ui-toggleswitch-handler {
    background: #474747;
}

body .ui-toggleswitch.ui-toggleswitch-checked .ui-toggleswitch-slider {
    background: #818284;
    border: 1px solid #995f80;
}

body .ui-toggleswitch .ui-toggleswitch-slider .ui-toggleswitch-handler {
    background: #ced4da;
}

body .ui-toggleswitch .ui-toggleswitch-slider {
    background: #ffffff;
    border: 1px solid #995f80;
}

/* max-width to add */
.ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
}

.ellipsis.login-link {
	max-width: 120px;
	display: block;
	text-align: center;
}

.panel-my-title{
	padding: 0.3rem 0.75rem;
	border: none;
	font-weight: bold;
	background: #818284 !important;
}

body .ui-selectmanymenu .ui-selectlistbox-listcontainer .ui-selectlistbox-list .ui-selectlistbox-item > td {
	padding: 0.5rem 0.5rem;
}

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger {
	width: 1.3rem;
}

.toggleDarkMode .ui-button-text {
	padding-top: 0.2rem !important;
    padding-bottom: 0.2rem !important;
}

.dark .leaflet-layer, .dark .leaflet-control-zoom-in, .dark .leaflet-control-zoom-out, .dark .leaflet-control-attribution {
	filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%);
}

.fc .fc-scrollgrid table {
	border-style: unset !important;
}	

body .ui-accordion .ui-accordion-header:first-child, body .ui-accordion .ui-accordion-header { 
	border-color: transparent;	
}	

.gm-style .gm-style-iw-d {
	overflow: auto !important;
	padding: 10px !important;
}

/* Suppression des checkbox pour faire de la selection/déselection au clic simple mais sans voir la checkbox (seule option possible pour les mobile) */
.hide-checkbox .ui-selectlistbox-item .ui-chkbox {
    display: none !important;
}

/**************************************************************************************************************************************************/
/******************************************************  SPECIFIC RESPONSIVE  *********************************************************************/


/** screen width under 1200px */
@media (max-width: 1200px) and (min-width: 991px) {
    :root {
        --sidebar-width: 300px;
    }
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link * {
        font-size: 16px !important;
    }
}

/** screen width under 991px */
@media (max-width: 991px) {
    :root {
        --sidebar-width: 420px;
    }
    .layout-wrapper .layout-topbar .topbar-logo {
    	margin-top: 0px !important;
    }
    .layout-wrapper .layout-sidebar {
    	top: var(--topbar_height) !important;
    }
}

/** main-fix.css **/

/** screen over 991px */
.layout-main {
    margin-left: var(--sidebar-width);
}

.layout-content {
    /*height: calc(100vh - var(--topbar_height)) !important;*/
    /*overflow-y: scroll !important;*/
    /*padding: 0 2em 2em 2em !important;*/
    padding-top: 0.5em;
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-bottom: 0.5em;
    /*margin-top: var(--topbar_height);*/
}


/** screen under 991px */
@media (max-width: 991px) {
    .layout-menu-mobile-active .layout-main-mask {
        display: block !important;
    }
}


/** screen under 377px */
@media (max-width: 377px) {
    .custom-treesite-contextmenu2 {
        left: calc(100% - 16.5em) !important;
    }
}


/** the sidebar resizer **/
.sidebar-resizer {
    position: absolute;
    top: 0;
    right: -10px;
    height: 100%;
    width: 20px;
    cursor: ew-resize;
    touch-action: none;
}

.sidebar-resizer::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #9c2063;
    transform: scale(0);
    transition: .3s;
    opacity: 0;
}

.sidebar-resizer:hover::after {
    opacity: 1;
    transform: scaleX(0.2);
}

/** sidebar-fix.css **/

.layout-wrapper .layout-sidebar {
    width: var(--sidebar-width) !important;
    max-width: calc(100% - 100px) !important;
}

.layout-sidebar.layout-sidebar-active .sidebar-logo {
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
}

/*.layout-sidebar .sidebar-logo img {
    width: auto !important;
}*/


/** screen over 991px */
@media (min-width: 991px) {
    .minimize-sidebar {
        --sidebar-width: 0px;
    }

    .minimize-sidebar .custom-topbar-logo {
        display: flex !important;
    }

    .minimize-sidebar .sidebar-logo,
    .minimize-sidebar .tree-icon-helper {
        display: none !important;
    }
}

/** screen under 991px */
@media (max-width: 991px) {
    /** classes jquery **/
    .layout-sidebar-mobile-active .sidebar-filter-button {
        background-color: #4c566a;
    }

    .layout-sidebar-mobile-active .sidebar-filter-button .ui-icon {
        color: #fff !important;
    }

    .layout-wrapper .layout-sidebar {
        transform: translate3d(calc(var(--sidebar-width) * -1), 0px, 0px);
    }

    /*body .layout-wrapper .layout-sidebar .layout-menu-container #formTreeSite .filters-wrapper {*/
    /*    margin-left: 35px;*/
    /*}*/
}



@media (min-width: 1705px) and (max-width: 1729px) {
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link {
        padding: 0.75rem 7px !important;
    }
}

@media (min-width: 992px) and (max-width: 1705px) {
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link > .ui-menuitem-text {
        display: none !important;
    }
    .ui-menuitem:not(.ui-menu-parent) .ui-menuitem-icon {
		margin-right: 0 !important;/* home without text */
	}
}

/** taille du menu pour chaque device */

/** screen over 1612px */
@media (min-width: 1612px) {
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link * {
        font-size: 16px !important;
    }
}

/** screen between 1519px and 1611px */
@media (min-width: 1519px) and (max-width: 1611px) {
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link * {
        font-size: 16px !important;
    }
}

/** screen between 1200px and 1519px */
@media (min-width: 1200px) and (max-width: 1519px) {
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link * {
        font-size: 16px !important;
    }
}

/** réduit la taille du header pour les petits devices **/
@media (max-height: 800px), (orientation: portrait) and (max-width: 500px) {
	:root {
        --topbar_height: 38px;
    }
    /** hauteur arbre partie logo */
    .layout-sidebar .sidebar-logo {
    	height: var(--topbar_height);
    }
    /** ".custom-topbar-logo img" sans le niveau " a img" pour gérer le cas span sans lien site web sur logo client */ 
    .col-topbar-left .custom-topbar-logo img, .layout-sidebar .sidebar-logo img {
    	padding-top: 1px;
    	padding-bottom: 1px;
    }    
	.col-topbar-left .custom-topbar-logo .logo-client{
		padding-left: 2px;
		padding-right: 2px;
	}
	
	.layout-sidebar .layout-menu-container {
	    height: calc(100% - var(--topbar_height));
	}
}
	
/** réduit la largeur max des logos header pour les petits devices pour avoir les 3 boutons menu à droite (120px) **/
@media (max-width: 430px) {
	.logo-client img {
		max-width: calc((100vw - 120px) * 0.45) !important;
	}
	.logo1 img{
		/*display: none;*/
		max-width: calc((100vw - 120px) * 0.15) !important;
	}
	.logo2 img{
		/*display: none;*/
		max-width: calc((100vw - 120px) * 0.25) !important;
	}
}

@media (max-width: 650px) {
	#ui-datepicker-div > div[class*="ui-datepicker-group"] {
		width: auto;
	}
}
/** screen under 991px */
@media (max-width: 991px) {
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link > span,
    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link > svg {
        color: #fff !important;
    }

    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem {
        margin-right: 0;
        border-radius: 0;
        color: #fff;
    }

    body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link {
        padding: 6px 12px;
    }

    .anchor-open {
        display: none !important;
    }
    
    .custom-topbar-logo,
    .mobile-navbar-icons {
        display: flex !important;
    }

    /** Menu **/
    body .layout-topbar .ui-menu {
        transform: translate3d(calc(var(--menu-width) * -1), 0px, 0px);
        position: fixed !important;
        height: calc(100vh - var(--topbar_height)) !important;
        bottom: 0 !important;
        max-width: calc(100% - 100px);
        width: var(--menu-width);
        left: 0 !important;
        overflow: auto !important;
        transition: transform 0.15s;
    }

    body .layout-topbar .ui-menu > ul {
        width: 100%;
        list-style-type: none;
        margin: 10px 0 0 0;
        padding: 0;
        padding-bottom: 20px;
        position: absolute !important;
        top: 50px !important;
    }

    body .layout-topbar .ui-menu > ul > li {
        width: 100% !important;
        padding: 4px 10px;
    }

    body .layout-topbar .ui-menu > ul > li > a {
        padding: 10px;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        -moz-transition: all 0.15s;
        -o-transition: all 0.15s;
        -webkit-transition: all 0.15s;
        transition: all 0.15s;
        position: relative;
        cursor: pointer;
    }

    body .layout-topbar .ui-menu .ui-menu-parent .ui-menu-child {
        position: relative !important;
        padding: 0 !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
    }

    body .layout-topbar .ui-menu .ui-menu-list .ui-menu-child.ui-shadow {
        border: none !important;
        border-radius: 0 !important;
    }

    body .layout-topbar .ui-menu > ul > li > a > span {
        color: #2e3440 !important;
    }

    body .layout-topbar .ui-menu > ul > li > a:hover {
        background-color: #ebebeb;
    }

    body .layout-topbar .ui-menu > ul > li > a:focus span {
        color: #fff !important;
    }

    body .layout-topbar .ui-menu.ui-menubar {
        margin-top: auto;
    }

    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link {
        border-radius: 0 !important;
        justify-content: start;
    }

    body .layout-topbar .ui-menu.ui-menubar > .ui-menu-list > .ui-menuitem > .ui-menuitem-link .ui-icon-triangle-1-s {
        right: 30px;
        position: absolute;
    }

    body .layout-menu-mobile-active .layout-topbar .ui-menu {
        transform: translate3d(0, 0, 0) !important;
    }

    /** End Menu **/
    /** classes jquery **/
    body .layout-menu-mobile-active .sidebar-menu-button {
        background-color: #4c566a;
    }

    body .layout-menu-mobile-active .sidebar-menu-button .ui-icon {
        color: #fff !important;
    }

    .sidebar-pin {
        display: none !important;
    }
}

@media (min-width: 991px) and (max-width: 1200px)  {
	.layout-sidebar.layout-sidebar-active .sidebar-logo {
		padding: 0px 40px;
	}
}

@media (max-width: 1440px) {
	.grid-chart-pi {
		grid-template-columns: 1fr;
   		display: grid !important;
	}
}

@media (min-width: 1441px) {
	.grid-chart-pi {
		grid-template-columns: repeat(2, 1fr) !important;
   		display: grid !important;
	}
}

@media (max-width: 1110px) {
	.pageCenterActionButtons {
		top: calc(36px + var(--topbar_height)) !important;
		position: unset;
		align-self: end;
	}
	.dataMap {
	    display: flex;
	    padding-top: 15px;
	}
	.layout-config.layout-config-active {
    top: calc(var(--topbar_height) + 76px);
	}
}

@media (max-width: 1110px) {
	#mainForm\:dataTrafficType {
	 	position: relative;
	    right: 7px !important;
	    min-width: 140px !important;
	}
}
/* dans certains cas le bouton de selection d'upload n'est pas bien affiché */
@media screen and (max-width: 40em) {
    .ui-fileupload-buttonbar .ui-button .ui-button-text {
        display: block !important;
    }
    .ui-fileupload-buttonbar .ui-button {
    	padding: 0em 1em 0em 1.2em
    }
}

@media (max-width: 700px) {
	#backToSelectedSite {
		position: unset;
	}
}
@media (min-width: 701px) {
	#backToSelectedSite {
		position: absolute;
		right: 1px;
	}
}

@media (max-width: 450px) {
	#mainForm\:nbNoGps {
		display: none;
	}
	#mainForm\:siteSelectList {
		display: none;
	}
}

/* display datatable global filter in header only when reflow is active via media max-width as ".ui-datatable-reflow thead th" in component.css
 - when no other header use dt styleClass: globalFilter-on-reflow-only-no-other-header
 - when other header in dt use dt styleClass: globalFilter-on-reflow-only-with-other-header
 - to always display do not use these 2 dt styleClass
*/
.ui-datatable.globalFilter-on-reflow-only-no-other-header.ui-datatable-reflow .ui-datatable-header,
.ui-datatable.globalFilter-on-reflow-only-with-other-header.ui-datatable-reflow .globalFilter
 {
	display: none;
}
@media(max-width: 640px) {
	.ui-datatable.globalFilter-on-reflow-only-no-other-header.ui-datatable-reflow .ui-datatable-header,
	.ui-datatable.globalFilter-on-reflow-only-with-other-header.ui-datatable-reflow .globalFilter {
		display: block;
	}
	.ui-datatable.globalFilter-on-reflow-only-with-other-header.ui-datatable-reflow .globalFilter {
		display: inline-flex;
	}	
}

/*
Permet d'augmenter la height de paginator si les icones (position:float) gomme et csv passent à la ligne lors du resize de la page (petites devices)
*/
body .ui-datatable .ui-paginator.ui-paginator-top,
body .ui-datatable .ui-paginator.ui-paginator-bottom {
	display: flow-root;
}
	

/******** END SPECIFIC RESPONSIVE ************************/
/********************************/
	