body {
  background-color: #eee;
  letter-spacing: 1px;
}

/* Ajout de dégradé moderne pour le fond */
.bg-gradient {
  background-image: linear-gradient(90deg, #1a73e8, #4285f4, #2d89ff);
}

/* Transition douce pour les hover */
.nav-link {
  transition: color 0.3s ease;

  &:hover {
    color: #ffd700; /* Doré au survol */
  }
}

/* Formulaire de recherche et boutons modernisés */
form .form-control {
  &:focus {
    border-color: #ffd700;
    box-shadow: 0 0 5px #ffd700;
  }
}

form .btn-outline-light {
  border: 2px solid #ffd700;
}

/* Bouton call-to-action avec effet */
.btn-primary {
  background: linear-gradient(60deg, #ff9800, #ff5722);
  border: none;
  transition: all 0.3s ease;

  &:hover {
    background: linear-gradient(45deg, #ff5722, #e91e63);
    transform: scale(1.1);
  }
}

.main {
  position: relative;
  margin-left: 5%;
  margin-right: 5%;
}


@media screen and (min-width: 1020px) {
  .main-side {
    width: calc(100% - 250px);
    float: right;
  }
}

a,
a:hover,
a:focus,
a:active {
  text-decoration: none;
  outline: none;
}

.modal-body {
  background: #f0f0f0;
}