:root {
  /* Vert */
  --green-light: #71d88e;
  --green: #28a745;
  --green-dark: #1c6b2e;

  /* Rouge */
  --red-light: #f28b94;
  --red: #dc3545;
  --red-dark: #9e1c26;

  /* Noir */
  --black-light: #4d4d4d;
  --black: #000000;
  --black-dark: #000000; /* noir reste noir */

  /* Gris */
  --grey-light: #a0a5ab;
  --grey: #6c757d;
  --grey-dark: #3f4449;

  /* Violet */
  --violet-light: #b592e3;
  --violet: #6f42c1;
  --violet-dark: #4b2b7a;

  /* Bleu */
  --blue-light: #66b2ff;
  --blue: #007bff;
  --blue-dark: #004a99;
}




.i-mask {
    width: 100%;
    height: 100%;
    display: inline-block;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    vertical-align: middle;
}
.i-mask-md {
    width: 1.2rem;
    height: 1.2rem;
}
.i-mask-lg {
    width: 1.5rem;
    height: 1.5rem;
}
.i-mask-xl {
    width: 2rem;
    height: 2rem;
}
.i-mask-rem-4 {
    width: 4rem;
    height: 4rem;
}
.i-mask-list {
    -webkit-mask-image: url("../assets/icone/svg/list.svg");
    mask-image: url("../assets/icone/svg/list.svg");
}
.i-mask-window-layout {
    -webkit-mask-image: url("../assets/icone/svg/window-layout.svg");
    mask-image: url("../assets/icone/svg/window-layout.svg");
}
.i-mask-trajectoire {
    -webkit-mask-image: url("../assets/icone/svg/trajectoire.svg");
    mask-image: url("../assets/icone/svg/trajectoire.svg");
}
.i-mask-write {
    -webkit-mask-image: url("/assets/icone/svg/write.svg");
    mask-image: url("../assets/icone/svg/write.svg");
}
.i-mask-calendar {
    -webkit-mask-image: url("/assets/icone/svg/calendar.svg");
    mask-image: url("../assets/icone/svg/calendar.svg");
}