/* Couleur bleue principale */
:root {
    --blue-00205c: #00205c;
    --blue-00205c-light: #1a366d;
    --blue-00205c-lighter: #33487d;
    --blue-00205c-dark: #001a4d;
    --blue-00205c-darker: #00153d;
    --blue-00205c-rgb: 0, 32, 92;

    --teal-006d77: #006d77;
    --teal-006d77-light: #1a7f89;
    --teal-006d77-lighter: #33909a;
    --teal-006d77-dark: #005c65;
    --teal-006d77-darker: #004a52;
    --teal-006d77-rgb: 0, 109, 119;

    --gray-74788d: #74788d;
    --gray-74788d-light: #8589a1;
    --gray-74788d-lighter: #989bb4;
    --gray-74788d-dark: #636678;
    --gray-74788d-darker: #525462;
    --gray-74788d-rgb: 116, 120, 141;
  }
  
  /* Classes de fond */
  .bg-blue {
    background-color: var(--blue-00205c) !important;
    color: #ffffff !important;
  }
  
  .bg-blue-light {
    background-color: var(--blue-00205c-light) !important;
    color: #ffffff !important;
  }
  
  .bg-blue-lighter {
    background-color: var(--blue-00205c-lighter) !important;
    color: #ffffff !important;
  }
  
  /* Classes de texte */
  .text-blue {
    color: var(--blue-00205c) !important;
  }
  
  .text-blue-light {
    color: var(--blue-00205c-light) !important;
  }
  
  .text-blue-lighter {
    color: var(--blue-00205c-lighter) !important;
  }
  
  /* Classes d'alerte */
  .alert-blue {
    color: #ffffff;
    background-color: var(--blue-00205c-lighter);
    border-color: var(--blue-00205c);
  }
  
  /* Classes de bordure */
  .border-blue {
    border-color: var(--blue-00205c) !important;
  }
  
  /* Classes de bouton */
  .btn-blue {
    color: #ffffff;
    background-color: var(--blue-00205c);
    border-color: var(--blue-00205c);
  }
  
  .btn-blue:hover {
    color: #ffffff;
    background-color: var(--blue-00205c-dark);
    border-color: var(--blue-00205c-darker);
  }
  
  .btn-outline-blue {
    color: var(--blue-00205c);
    border-color: var(--blue-00205c);
    background-color: transparent;
  }
  
  .btn-outline-blue:hover {
    color: #ffffff;
    background-color: var(--blue-00205c);
    border-color: var(--blue-00205c);
  }
  
  /* Classes pour les liens */
  .link-blue {
    color: var(--blue-00205c);
    text-decoration: none;
  }
  
  .link-blue:hover {
    color: var(--blue-00205c-dark);
    text-decoration: underline;
  }
  
  /* Classes pour badges */
  .badge-blue {
    color: #ffffff;
    background-color: var(--blue-00205c);
  }

  /* Couleur teal principale */
:root {
    --teal-006d77: #006d77;
    --teal-006d77-light: #1a7f89;
    --teal-006d77-lighter: #33909a;
    --teal-006d77-dark: #005c65;
    --teal-006d77-darker: #004a52;
    --teal-006d77-rgb: 0, 109, 119;
  }
  
  /* Classes de fond */
  .bg-teal {
    background-color: var(--teal-006d77) !important;
    color: #ffffff !important;
  }
  
  .bg-teal-light {
    background-color: var(--teal-006d77-light) !important;
    color: #ffffff !important;
  }
  
  .bg-teal-lighter {
    background-color: var(--teal-006d77-lighter) !important;
    color: #ffffff !important;
  }
  
  /* Classes de texte */
  .text-teal {
    color: var(--teal-006d77) !important;
  }
  
  .text-teal-light {
    color: var(--teal-006d77-light) !important;
  }
  
  .text-teal-lighter {
    color: var(--teal-006d77-lighter) !important;
  }
  
  /* Classes d'alerte */
  .alert-teal {
    color: #ffffff;
    background-color: var(--teal-006d77-lighter);
    border-color: var(--teal-006d77);
  }
  
  /* Classes de bordure */
  .border-teal {
    border-color: var(--teal-006d77) !important;
  }
  
  /* Classes de bouton */
  .btn-teal {
    color: #ffffff;
    background-color: var(--teal-006d77);
    border-color: var(--teal-006d77);
  }
  
  .btn-teal:hover {
    color: #ffffff;
    background-color: var(--teal-006d77-dark);
    border-color: var(--teal-006d77-darker);
  }
  
  .btn-outline-teal {
    color: var(--teal-006d77);
    border-color: var(--teal-006d77);
    background-color: transparent;
  }
  
  .btn-outline-teal:hover {
    color: #ffffff;
    background-color: var(--teal-006d77);
    border-color: var(--teal-006d77);
  }
  
  /* Classes pour les liens */
  .link-teal {
    color: var(--teal-006d77);
    text-decoration: none;
  }
  
  .link-teal:hover {
    color: var(--teal-006d77-dark);
    text-decoration: underline;
  }
  
  /* Classes pour badges */
  .badge-teal {
    color: #ffffff;
    background-color: var(--teal-006d77);
  }

  
/* Classes de fond */
.bg-gray {
    background-color: var(--gray-74788d) !important;
    color: #ffffff !important;
  }
  
  .bg-gray-light {
    background-color: var(--gray-74788d-light) !important;
    color: #ffffff !important;
  }
  
  .bg-gray-lighter {
    background-color: var(--gray-74788d-lighter) !important;
    color: #ffffff !important;
  }
  
  /* Classes de texte */
  .text-gray {
    color: var(--gray-74788d) !important;
  }
  
  .text-gray-light {
    color: var(--gray-74788d-light) !important;
  }
  
  .text-gray-lighter {
    color: var(--gray-74788d-lighter) !important;
  }
  
  /* Classes d'alerte */
  .alert-gray {
    color: #ffffff;
    background-color: var(--gray-74788d-lighter);
    border-color: var(--gray-74788d);
  }
  
  /* Classes de bordure */
  .border-gray {
    border-color: var(--gray-74788d) !important;
  }
  
  /* Classes de bouton */
  .btn-gray {
    color: #ffffff;
    background-color: var(--gray-74788d);
    border-color: var(--gray-74788d);
  }
  
  .btn-gray:hover {
    color: #ffffff;
    background-color: var(--gray-74788d-dark);
    border-color: var(--gray-74788d-darker);
  }
  
  .btn-outline-gray {
    color: var(--gray-74788d);
    border-color: var(--gray-74788d);
    background-color: transparent;
  }
  
  .btn-outline-gray:hover {
    color: #ffffff;
    background-color: var(--gray-74788d);
    border-color: var(--gray-74788d);
  }
  
  /* Classes pour les liens */
  .link-gray {
    color: var(--gray-74788d);
    text-decoration: none;
  }
  
  .link-gray:hover {
    color: var(--gray-74788d-dark);
    text-decoration: underline;
  }
  
  /* Classes pour badges */
  .badge-gray {
    color: #ffffff;
    background-color: var(--gray-74788d);
  }