* {
    font-family: 'Atkinson Hyperlegible', sans-serif;
    margin: 0;
    padding: 0;
}

body {
  color: var(--main-dark-blue-color);

  --main-dark-blue-color: #283747;
  --main-light-color: #EAF0F1;
  --main-yellow-color: #fab60a;
  --second-yellow-color: #F5B041;

  --global-border-radius: 12px;
  --main-hover-color: #283747;
  --light-text-color: #8395A7;
  --bs-link-color: #FFC300;
  --bs-link-hover-color: #F5B041;
}

.background-login {
  height: 100%;
  background-color: var(--main-yellow-color);
}

.background-yellow {
  background-color: var(--main-yellow-color);
}

.background-dark-blue {
  background-color: var(--main-dark-blue-color);
}

.btn-primary {
  --bs-btn-font-weight: 600;
  --bs-btn-color: var(--main-dark-blue-color);
  --bs-btn-bg: var(--main-yellow-color);
  --bs-btn-border-color: var(--main-dark-blue-color);
  --bs-btn-hover-color: var(--main-dark-blue-color);
  --bs-btn-hover-bg: var(--second-yellow-color);
  --bs-btn-hover-border-color: var(--main-dark-blue-color);
}

.badge-success {
  background-color: #28a745;
  color: #fff;
}

.badge-danger {
  background-color: #ffffff;
  color: #73510d;
}

.badge-real-danger {
  background-color: #dc3545;
  color: #fff;
}

.badge-warning {
  background-color: #ffc107;
  color: #000;
}

.badge-info-dispo {
  background-color: #17a2b8;
  color: #fff;
}

.badge-info-indispo {
  background-color: #174fb8;
  color: #fff;
}

.badge-dark {
  background-color: #000;
  color: #fff;
}

.badge-habilitation-red {
  background-color: #ff6666;
  color: #461010;
}

.badge-habilitation-green {
  background-color: #94e7b4;
  color: #0d6832;
}

.badge-habilitation-orange {
  background-color: #ecca88;
  color: #4f3605;
}

.card-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;

  gap: 1rem;
  padding: 1rem;
}

.card {
  width: 18rem;
  height: auto;
  transition: 0.3s;
}

.card:hover {
  scale: 1.05;
}

.card-img-top {
  height: 100%;
  object-fit: cover;
  justify-self: center;
  align-self: center;
}

.pdf-container {
  height: 75vh;
}

.legende
{
  margin: 30px;
}