/* SCROLL BAR */

* {
  scrollbar-color: #f4f5fa transparent;
  scrollbar-width: thin;
}

*:hover {
  scrollbar-color: #d8d8d8 transparent;
  scrollbar-width: thin;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #f4f5fa;
}

::-webkit-scrollbar-thumb {
  background: #d8d8d8;
}

::-webkit-scrollbar-thumb:hover {
  background: #888;
}

/* SCROLL BAR */

.bg-body {
  background-color: #f4f5fa !important;
}

.w-40 {
  width: 40% !important;
}

.m-05 {
  margin: .5rem !important;
}

.mb-05 {
  margin-bottom: .5rem !important;
}

.mt-05 {
  margin-top: .5rem !important;
}

.mr-05 {
  margin-right: .5rem !important;
}

.ml-05 {
  margin-left: .5rem !important;
}

.px-05 {
  padding-right: .5rem !important;
  padding-left: .5rem !important;
}

.pt-05 {
  padding-top: .5rem !important;
}

.pb-05 {
  padding-bottom: .5rem !important;
}

.p-05 {
  padding: .5rem !important;
}

.pl-05 {
  padding-left: .5rem;
}

.my-05 {
  margin-top: .5rem !important;
  margin-bottom: .5rem !important;
}

body,
div {
  font-size: 12px !important;
}

.card {
  margin-bottom: .5rem;
}

.card-toolbar {
  box-shadow: none !important;
}

.card-toolbar>.card-body {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.card-header {
  padding: .5rem !important;
}

.card-body {
  padding: .5rem !important;
}

.table th,
.table td {
  padding: .5rem !important;
  vertical-align: inherit;
}

.btn-table-action>button {
  padding: .2rem .5rem !important;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto {
  padding-right: 7.5px;
  padding-left: 7.5px;
}

.table.b-table>tfoot>tr>[aria-sort]:not(.b-table-sort-icon-left),
.table.b-table>thead>tr>[aria-sort]:not(.b-table-sort-icon-left) {
  padding-right: calc(.75rem + .65em);
  background-position: right .375rem center;
}

.table.b-table>tfoot>tr>[aria-sort="ascending"],
.table.b-table>thead>tr>[aria-sort="ascending"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='101' height='101' preserveAspectRatio='none'%3E%3Cpath d='M51 1l25 23 24 22H1l25-22z'/%3E%3Cpath opacity='.3' d='M51 101l25-23 24-22H1l25 22z'/%3E%3C/svg%3E");
}

.table.b-table>tfoot>tr>[aria-sort="none"],
.table.b-table>thead>tr>[aria-sort="none"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='101' height='101' preserveAspectRatio='none'%3E%3Cpath opacity='.3' d='M51 1l25 23 24 22H1l25-22zm0 100l25-23 24-22H1l25 22z'/%3E%3C/svg%3E");
}

.table.b-table>tfoot>tr>[aria-sort="descending"],
.table.b-table>thead>tr>[aria-sort="descending"] {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='101' height='101' preserveAspectRatio='none'%3E%3Cpath opacity='.3' d='M51 1l25 23 24 22H1l25-22z'/%3E%3Cpath d='M51 101l25-23 24-22H1l25 22z'/%3E%3C/svg%3E");
}

.table.b-table>tfoot>tr>[aria-sort],
.table.b-table>thead>tr>[aria-sort] {
  cursor: pointer;
  background-repeat: no-repeat;
  background-size: 0.65em 1em;
}

html body.fixed-navbar {
  padding-top: 3rem !important;
}

.main-menu.menu-fixed {
  top: 3rem !important;
  height: calc(100% - 3rem) !important;
}

/* Resizable row */

.row {
  margin-right: -5px !important;
  margin-left: -5px !important;
}

.row>.col-xs-1,
.row>.col-xs-2,
.row>.col-xs-3,
.row>.col-xs-4,
.row>.col-xs-5,
.row>.col-xs-6,
.row>.col-xs-7,
.row>.col-xs-8,
.row>.col-xs-9,
.row>.col-xs-10,
.row>.col-xs-11,
.row>.col-xs-12 {
  min-height: 100px;
}

.row>.col-xs-1::before,
.row>.col-xs-2::before,
.row>.col-xs-3::before,
.row>.col-xs-4::before,
.row>.col-xs-5::before,
.row>.col-xs-6::before,
.row>.col-xs-7::before,
.row>.col-xs-8::before,
.row>.col-xs-9::before,
.row>.col-xs-10::before,
.row>.col-xs-11::before,
.row>.col-xs-12::before {
  position: absolute;
  top: 0;
  right: 15px;
  bottom: 0;
  left: 15px;
  display: block;
  content: "";
  background-color: rgba(52, 152, 219, .25);
}

.row>.col-xs-1:hover::before,
.row>.col-xs-2:hover::before,
.row>.col-xs-3:hover::before,
.row>.col-xs-4:hover::before,
.row>.col-xs-5:hover::before,
.row>.col-xs-6:hover::before,
.row>.col-xs-7:hover::before,
.row>.col-xs-8:hover::before,
.row>.col-xs-9:hover::before,
.row>.col-xs-10:hover::before,
.row>.col-xs-11:hover::before,
.row>.col-xs-12:hover::before {
  background-color: rgba(52, 152, 219, 0.5);
}

/* Resizable Grid */

.resizable-grid>.resizable-row>.resizable-column>.resizable-column-handle {
  position: absolute;
  top: 0;
  z-index: 100;
  display: none;
  width: 6px;
  height: 100%;
  cursor: col-resize;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: none;
  touch-action: none;
}

.resizable-grid>.resizable-row>.resizable-column>.resizable-column-handle-w {
  left: 12px;
}

.resizable-grid>.resizable-row>.resizable-column>.resizable-column-handle-e {
  right: 12px;
}

.resizable-grid>.resizable-row>.resizable-column:first-child:not(:last-child)>.resizable-column-handle-e,
.resizable-grid>.resizable-row>.resizable-column:not(:first-child):not(:last-child)>.resizable-column-handle-w,
.resizable-grid>.resizable-row>.resizable-column:not(:first-child):not(:last-child)>.resizable-column-handle-e,
.resizable-grid>.resizable-row>.resizable-column:last-child:not(:first-child)>.resizable-column-handle-w {
  display: block;
}

.resizable-grid-resizing {
  cursor: col-resize;
}

.resizable-grid>.resizable-row-resizing>.resizable-column:not(.resizable-column-resizing) {
  opacity: .5;
}

.bg-whitesmoke,
.table-active,
.table-active>th,
.table-active>td {
  color: white !important;
  background-color: #1e9ff2 !important;
}

.table-active>td>a {
  color: white !important;
}

.border {
  border: 1px solid #f4f5fa !important;
}

.border-top {
  border-top: 1px solid #f4f5fa !important;
}

.border-left {
  border-left: 1px solid #f4f5fa !important;
}

.border-right {
  border-right: 1px solid #f4f5fa !important;
}

.border-bottom {
  border-bottom: 1px solid #f4f5fa !important;
}

/* Resizable row */

[class*=" ft-"],
[class^="ft-"] {
  line-height: 1.4;
}

.attribute-item {
  padding-top: .25rem;
  padding-bottom: .25rem;
  border-radius: .5rem;
}

.attribute-item:hover {
  background-color: #f5f5f5;
}

.custom-file-content .custom-file {
  position: absolute;
  top: 0;
  left: 0;
}

.custom-file-content .custom-file>input {
  display: none;
}

.custom-file-content .custom-file>label {
  display: none;
}

/* APP LAYOUT */

#app {
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}

.content {
  min-height: calc(100% - 3rem) !important;
  max-height: calc(100% - 3rem) !important;
  overflow: hidden;
}

.content-wrapper {
  flex: 1 1 auto;
}

.scroll-row,
.scroll-container {
  display: flex;
  overflow: hidden;
}

.scroll-container {
  flex-direction: column;
}

.scroll-content,
.scroll-col {
  overflow-x: hidden;
  overflow-y: auto;
}

.scroll-content {
  flex: 1 1 auto;
}

.scroll-col {
  height: 100% !important;
}

/* CHECKBOXES */

.readonly>.custom-control-input:disabled:not(:checked)~.custom-control-label::before {
  background-color: #fff !important;
}

.readonly>.custom-control-input:disabled:checked~.custom-control-label::before {
  background-color: #1e9ff2 !important;
}

.input-group-text {
  font-size: 12px !important;
  color: #72767a !important;
}

.bg-hover:hover {
  background-color: #e5e7ee !important;
}

.position-square {
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
}

.position-square.selected {
  background-color: #f8d7da;
  border: 1px solid #ea868f !important;
}

.position-square:hover {
  cursor: pointer;
  background-color: #e9ecef;
}

.position-square:hover.selected {
  background-color: #f1aeb5;
}

.position-square-main {
  background: #cce5ff;
  border: 1px solid #66b0ff;
}

.position-square-main .position-square {
  border: 1px solid #ced4da;
}

/* GESTION DES GROUPES */

.group-item:not(.active):hover {
  background-color: #e0e0e0;
}

.list-group-custom .list-group-item {
  padding: .5rem !important;
}

.list-group-custom .list-group-item.active {
  color: var(--dark) !important;
  background-color: #f2f2f2;
  border-color: #f2f2f2;
}

/* FIN GESTION DES GROUPES */
/*
.position-square:hover {
  cursor: pointer;
  background-color: #e9ecef;
}

.position-square:hover.selected {
  background-color: #f1aeb5;
}

.position-square-main {
  background: #cce5ff;
  border: 1px solid #66b0ff;
}

.position-square-main .position-square {
  border: 1px solid #ced4da;
} */

.tag {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.tag.tag-primary .tag-triangle {
  border-right-color: #007bff;
}

.tag.tag-primary .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #007bff;
  align-items: center;
}

.tag.tag-primary .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-primary .tag-body a {
  color: inherit;
  margin-left: 4px;
}

.tag.tag-secondary .tag-triangle {
  border-right-color: #6c757d;
}

.tag.tag-secondary .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #6c757d;
}

.tag.tag-secondary .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-secondary .tag-body a {
  color: inherit;
}

.tag.tag-success .tag-triangle {
  border-right-color: #28a745;
}

.tag.tag-success .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #28a745;
}

.tag.tag-success .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-success .tag-body a {
  color: inherit;
}

.tag.tag-info .tag-triangle {
  border-right-color: #17a2b8;
}

.tag.tag-info .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #17a2b8;
}

.tag.tag-info .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-info .tag-body a {
  color: inherit;
}

.tag.tag-warning .tag-triangle {
  border-right-color: #ffc107;
}

.tag.tag-warning .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #ffc107;
}

.tag.tag-warning .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-warning .tag-body a {
  color: inherit;
}

.tag.tag-danger .tag-triangle {
  border-right-color: #dc3545;
}

.tag.tag-danger .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #dc3545;
}

.tag.tag-danger .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-danger .tag-body a {
  color: inherit;
}

.tag.tag-light .tag-triangle {
  border-right-color: #f8f9fa;
}

.tag.tag-light .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #f8f9fa;
}

.tag.tag-light .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-light .tag-body a {
  color: inherit;
}

.tag.tag-dark .tag-triangle {
  border-right-color: #343a40;
}

.tag.tag-dark .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #343a40;
}

.tag.tag-dark .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-dark .tag-body a {
  color: inherit;
}

.tag.tag-brown .tag-triangle {
  border-right-color: #b08102;
}

.tag.tag-brown .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #b08102;
}

.tag.tag-brown .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-brown .tag-body a {
  color: inherit;
}

.tag.tag-100 .tag-triangle {
  border-right-color: #f8f9fa;
}

.tag.tag-100 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #f8f9fa;
}

.tag.tag-100 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-100 .tag-body a {
  color: inherit;
}

.tag.tag-200 .tag-triangle {
  border-right-color: #e9ecef;
}

.tag.tag-200 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #e9ecef;
}

.tag.tag-200 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-200 .tag-body a {
  color: inherit;
}

.tag.tag-300 .tag-triangle {
  border-right-color: #dee2e6;
}

.tag.tag-300 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #dee2e6;
}

.tag.tag-300 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-300 .tag-body a {
  color: inherit;
}

.tag.tag-400 .tag-triangle {
  border-right-color: #ced4da;
}

.tag.tag-400 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #ced4da;
}

.tag.tag-400 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-400 .tag-body a {
  color: inherit;
}

.tag.tag-500 .tag-triangle {
  border-right-color: #adb5bd;
}

.tag.tag-500 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #adb5bd;
}

.tag.tag-500 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-500 .tag-body a {
  color: inherit;
}

.tag.tag-600 .tag-triangle {
  border-right-color: #6c757d;
}

.tag.tag-600 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #6c757d;
}

.tag.tag-600 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-600 .tag-body a {
  color: inherit;
}

.tag.tag-700 .tag-triangle {
  border-right-color: #495057;
}

.tag.tag-700 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #495057;
}

.tag.tag-700 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-700 .tag-body a {
  color: inherit;
}

.tag.tag-800 .tag-triangle {
  border-right-color: #343a40;
}

.tag.tag-800 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #343a40;
}

.tag.tag-800 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-800 .tag-body a {
  color: inherit;
}

.tag.tag-900 .tag-triangle {
  border-right-color: #212529;
}

.tag.tag-900 .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #212529;
}

.tag.tag-900 .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-900 .tag-body a {
  color: inherit;
}

.tag.tag-blue .tag-triangle {
  border-right-color: #007bff;
}

.tag.tag-blue .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #007bff;
}

.tag.tag-blue .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-blue .tag-body a {
  color: inherit;
}

.tag.tag-indigo .tag-triangle {
  border-right-color: #6610f2;
}

.tag.tag-indigo .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #6610f2;
}

.tag.tag-indigo .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-indigo .tag-body a {
  color: inherit;
}

.tag.tag-purple .tag-triangle {
  border-right-color: #6f42c1;
}

.tag.tag-purple .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #6f42c1;
}

.tag.tag-purple .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-purple .tag-body a {
  color: inherit;
}

.tag.tag-pink .tag-triangle {
  border-right-color: #e83e8c;
}

.tag.tag-pink .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #e83e8c;
}

.tag.tag-pink .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-pink .tag-body a {
  color: inherit;
}

.tag.tag-red .tag-triangle {
  border-right-color: #dc3545;
}

.tag.tag-red .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #dc3545;
}

.tag.tag-red .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-red .tag-body a {
  color: inherit;
}

.tag.tag-orange .tag-triangle {
  border-right-color: #fd7e14;
}

.tag.tag-orange .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #fd7e14;
}

.tag.tag-orange .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-orange .tag-body a {
  color: inherit;
}

.tag.tag-yellow .tag-triangle {
  border-right-color: #ffc107;
}

.tag.tag-yellow .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #ffc107;
}

.tag.tag-yellow .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-yellow .tag-body a {
  color: inherit;
}

.tag.tag-green .tag-triangle {
  border-right-color: #28a745;
}

.tag.tag-green .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #28a745;
}

.tag.tag-green .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-green .tag-body a {
  color: inherit;
}

.tag.tag-teal .tag-triangle {
  border-right-color: #20c997;
}

.tag.tag-teal .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #20c997;
}

.tag.tag-teal .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-teal .tag-body a {
  color: inherit;
}

.tag.tag-cyan .tag-triangle {
  border-right-color: #17a2b8;
}

.tag.tag-cyan .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #17a2b8;
}

.tag.tag-cyan .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-cyan .tag-body a {
  color: inherit;
}

.tag.tag-white .tag-triangle {
  border-right-color: #fff;
}

.tag.tag-white .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #212529;
  background-color: #fff;
}

.tag.tag-white .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-white .tag-body a {
  color: inherit;
}

.tag.tag-gray .tag-triangle {
  border-right-color: #6c757d;
}

.tag.tag-gray .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #6c757d;
}

.tag.tag-gray .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-gray .tag-body a {
  color: inherit;
}

.tag.tag-gray-dark .tag-triangle {
  border-right-color: #343a40;
}

.tag.tag-gray-dark .tag-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  background-color: #343a40;
}

.tag.tag-gray-dark .tag-body div {
  min-width: 0;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tag.tag-gray-dark .tag-body a {
  color: inherit;
}

.tag .tag-triangle {
  width: 0;
  height: 0;
  border-top: solid 0.83333rem transparent;
  border-right: solid 0.83333rem transparent;
  border-bottom: solid 0.83333rem transparent;
}

.tag .tag-body {
  padding-right: 0.33333rem;
  padding-left: 0.33333rem;
  color: #fff;
  border-top-right-radius: .25rem;
  border-bottom-right-radius: .25rem;
}

.sortable-ghost .tag,
.ghost .tag {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  opacity: 0.5;
}

.spinner-hidden span {
  display: none !important;
}

/* TABLEAUX */

.col-action {
  width: 100px;
  max-width: 150px !important;
}

.bg-light {
  background-color: #f4f5fa !important;
}

.page-header {
  font-weight: bold;
  color: var(--blue);
  margin-bottom: 0 !important;
}

.flex-0>.nav-item {
  flex: 0 !important;
}

.bg-body-n2>div:nth-of-type(2n + 1) {
  background-color: red !important;
}

.menu-title {
  font-size: 1.1rem !important;
}

.menu-item.active {
  background-color: whitesmoke !important;
  font-weight: 700;
  margin: 0 1rem 0 1rem;
  border-right: 4px solid #1e9ff2;
  border-radius: 0.3rem;
}

.has-sub>.collapse>.menu-content .active {
  border-right: 4px solid #1e9ff2;
}

/*sticky-header*/

.sticky-header thead th {
  position: sticky !important;
}

.attributes.list-group-item.list-group-item-action {
  background-color: #f3f3f3 !important;
  border: none !important;
}

.attributes.list-group-item.list-group-item-action.active {
  color: var(--dark) !important;
}

/* Yed */

.yfiles-svgpanel>div:last-child {
  display: none !important;
}

.yfiles-svgpanel>div:nth-child(2n) {
  display: none !important;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

.modal .modal-xxl {
  width: 97% !important;
  max-width: 97% !important;
}


/* .node-editor {
    input,
    select {
        max-width: 20rem !important;
    }
}

.input-group-prepend>.b-form-datepicker>.btn {
    border-top-right-radius: $spacer / 4 !important;
    border-bottom-right-radius: $spacer / 4 !important;
} */

.ql-editor {
  min-height: 150px !important;
}

.handle {
  cursor: all-scroll !important;
}


/*
.h-100-toolbar {
    height: calc(100vh - 60px);
    margin: 0 !important;
}

.h-50-toolbar {
    height: calc(50vh - 60px);
    margin: 0 !important;
} */

.modal-header,
.modal-footer {
  border-color: #dce0e6;
}


/* Menu principal */

.main-menu {
  transition: 300ms ease all;
}

.menu-collapsed.main-menu {
  width: 60px !important;
  transform: translateZ(-160px) translateX(-160px);
  transform: translate3d(0, 0, 0);
}

.menu-collapsed .menu-content .menu-item {
  padding-left: 18px !important;
}

.menu-collapsed .navigation-header {
  padding-top: 8px !important;
}

.menu-collapsed .menu-item {
  padding-right: 5px !important;
}

.menu-collapsed .menu-item.active {
  margin: 0 !important;
}

.menu-collapsed.navbar-header {
  float: left;
  width: 60px !important;
  overflow: hidden;
}

.menu-collapsed.navbar-container {
  margin-left: 60px !important;
}

.menu-collapsed.app-content {
  margin-left: 60px !important;
}

.menu-collapsed.footer {
  margin-left: 60px !important;
}

.nav.nav-tabs.nav-underline {
  position: relative;
  background: #fff;
  background-color: rgb(255, 255, 255);
  border-bottom: 1px solid #1e9ff2;
  border-radius: 0;
}

.btn-light {
  color: #212529;
}

.col-tabs {
  width: 260px !important;
  max-width: 260px !important;
  overflow-x: hidden;
}

.group-item {
  border-radius: .25rem;
}

.group-item.active {
  color: var(--white);
  background-color: var(--primary);
}

.group-item.active .dropdown-toggle {
  color: inherit !important;
}

.input-rich-text-preview {
  min-height: 2rem;
  max-height: 4rem;
  overflow: hidden;
}

.input-rich-text-preview>p {
  margin-bottom: 0;
}

.modal-button-container {
  text-align: right;
}

.modal-button-container>button:not(:last-child) {
  margin-right: .5rem;
}

.modal-container {
  margin: -14px;
  height: calc(100% + 28px);
  max-height: calc(100% + 28px);
}

.popover {
  max-width: 350px !important;
}

.popover span.picker {
  height: 300px;
  width: 344px;
}

.node-text-content p {
  margin-top: 0;
  margin-bottom: 0;
}

/* Custom spinner css */
/* Used in treegrid for groups */

@keyframes custom-rolling {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
  }

  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

@-webkit-keyframes custom-rolling {
  0% {
    -webkit-transform: translate(-50%, -50%) rotate(0deg);
    transform: translate(-50%, -50%) rotate(0deg);
  }

  100% {
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

.custom-rolling {
  position: relative;
}

.custom-rolling div,
.custom-rolling div:after {
  border: 8px solid #7e7e7e;
  border-radius: 50%;
  border-top-color: transparent;
  height: 80px;
  position: absolute;
  width: 80px;
}

.custom-rolling div {
  -webkit-animation: custom-rolling 1.3s linear infinite;
  animation: custom-rolling 1.3s linear infinite;
  top: 100px;
  left: 100px;
}

.custom-rolling div:after {
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.custom-rolling {
  -webkit-transform: translate(-31px, -31px) scale(0.31) translate(31px, 31px);
  height: 62px !important;
  transform: translate(-31px, -31px) scale(0.31) translate(31px, 31px);
  width: 62px !important;
}

.spinner-background {
  background-color: #00000030;
}

/*#region Gestion des couleurs des boutons des toolbars */
.btn-group-sm-generic {
  border: 1px solid #cbcccf !important;
  border-radius: 0.25rem !important;
  margin-left: 1rem !important;
  height: 100%;
}

.btn-generic {
  height: 100%;
  font-size: 1rem !important;
  border: none;
  line-height: 1;
}

/* Override spécifique pour les b-dropdown (btn-secondary) qui appliquent un arrière plan gris de base*/
.btn-secondary.btn-outline-dark:not(:hover):not(:disabled),
.btn-outline-dark[aria-expanded="false"]:not(:disabled) {
  color: #424242 !important;
  background-color: transparent !important;
}

/** Style appliqué au hover sur les dropdown noirs quand dropdown fermé*/
.btn-outline-dark:hover:not(:disabled),
.btn-secondary.btn-outline-dark[aria-expanded="true"]:not(:disabled),
.btn-secondary.btn-outline-dark[aria-expanded="false"]:hover:not(:disabled),
.btn-outline-dark[aria-expanded="true"]:not(:disabled),
.btn-outline-dark[aria-expanded="false"]:hover:not(:disabled) {
  color: #fff !important;
  background-color: #424242 !important;
}

/** Style appliqué au hover sur les boutons noirs */
.btn-outline-dark[aria-expanded="true"]:hover:not(:disabled){
  color: #fff !important;
  background-color: #616161 !important;
}

/* Gestion de la couleur + background pour les buttons désactivés */
.btn-generic:disabled {
  background-color: transparent !important;
}

.btn-generic:disabled:hover,
.btn-outline-dark:disabled:hover,
.btn-outline-danger:disabled:hover,
.btn-outline-primary:disabled:hover {
  background-color: transparent !important;
}

.btn-outline-danger {
  color: #EA203F !important;
}

.btn-outline-dark:disabled {
  color: #C9C9C9 !important;
}

.btn-outline-danger:disabled {
  color: #F9C0C8 !important;
}

.btn-outline-primary:disabled {
  color: #D3D6F8 !important;
}

/*#endregion */

.ql-align-right
{
  text-align: right;
}

.ql-align-left
{
  text-align: left;
}

.ql-align-center
{
  text-align: center;
}

.modal-title-custom
{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}