@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400&display=swap');

:root {
	--text-color: #f8485e;
	--next-color: teal;
	--just-color: #f8485e5c;	
}

html,
body {
  height: 100%;
  color: var(--text-color);
  font-family: 'Montserrat';
 }

.main-loader {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.9);
  z-index: 1004;  /*car .modal à un z-index 1003 par defaut*/
}

.flex-container-column {
  height: 100%;
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.flex-container-row {
  height: 100%;
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}


.modal {
	max-height: 80%;
}

.modal.modal-fixed-footer {
	height: 80%;
}

.btn-floating {
	background-color: #f8485e;
}

input, textarea {
	color: var(--text-color);
}	

.toast {
  background-color: teal;
  color: white;
}

nav {
  background-color:var(--text-color);
}

.sidenav li > a {
  background-color: var(--text-color);
  color: white;
  padding: 0 16px;
}

.sidenav .collapsible-header, .sidenav.fixed .collapsible-header {
  background-color: var(--text-color);
  color: white;
}

.sidenav a:hover {
  background-color: var(--just-color) !important;
}

.sidenav li>a>i.material-icons {
	color: white;
}

.sidenav .collapsible-body li a, .sidenav.fixed .collapsible-body li a {
	background-color: var(--text-color);
}

tbody tr {
	font-size: 12px;
}

td a {
	height: 25px !important;
	line-height: 25px !important;
}

li .collapsible-header .material-icons.expand {
	margin-left: auto;
    margin-right: 0;
}

li.active .collapsible-header .material-icons.expand {
	-ms-transform: rotate(180deg);
	/* IE 9 */
	-webkit-transform: rotate(180deg);
	/* Chrome, Safari, Opera */
	transform: rotate(180deg);
}