/* Général */
body {
    background-color: #1e1e1e;
    color: #e0e0e0;
  }

  /* Navigation */
  .nav-menu a {
    color: #1e1e1e;
  }
  
  .nav-menu a:hover, .nav-menu .active {
    color: #e0e0e0;
  }
  
  .nav-menu ul {
    background-color: #1e1e1e00;
  }
  
  /* Header */
  #header {
    background-color: #1e1e1e00;
  }

  @media (max-width: 991px) {
    /* Header */
    #header {
      background-color: #1e1e1e;
    }
  }
  
  /* Sections */
  section {
    background-color: #1e1e1e00;
    color: #e0e0e0;
  }
  
  /* Héros */
  #hero {
    background-color: #121212;
  }
  #hero:before {
    content: "";
    background: rgba(30, 30, 30, 0.8);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
  }
  #hero h1, #hero p {
    color: #e0e0e0;
  }
  
  #hero .typed {
    color: #ff3e3e;
  }
  
  #hero .social-links a {
    color: #e0e0e0;
  }
  
  #hero .social-links a:hover {
    color: #ff3e3e;
  }
  
  /* À propos */
  .about {
    background-color: #1e1e1e00;
  }
  
  .about h2, .about p {
    color: #e0e0e0;
  }

  /* Photo de profile */
  .profile {
    border-radius: 25px;
  }
  
  /* Historique */
  .resume {
    background-color: #1e1e1e00;
  }
  
  .resume-title {
    color: #ff3e3e;
  }
  
  .resume-item h4, .resume-item h5, .resume-item p, .resume-item ul li {
    color: #e0e0e0;
  }
  
  /* Portfolio */
  .portfolio {
    background-color: #1e1e1e00;
    border-radius: 25px;
  }
  
  .portfolio .section-title h2, .portfolio .section-title p {
    color: #e0e0e0 !important;
  }
  
  .portfolio .portfolio-wrap {
    background-color: #2c2c2c;
    border-radius: 25px;
  }
  
  .portfolio .portfolio-info {
    background-color: rgba(0, 0, 0, 0.7);
    color: #e0e0e0 !important;
    border-radius: 25px !important;
  }
  .portfolio .portfolio-wrap .portfolio-info h4 {
    font-size: 20px;
    color: #e0e0e0 !important;
    font-weight: 600;
    border-radius: 25px !important;
  }
  .portfolio .portfolio-wrap .portfolio-info p {
    color: #e0e0e0 !important;
    font-size: 14px;
    text-transform: uppercase;
    padding: 0;
    margin: 0;
    border-radius: 25px;
  }
  .portfolio .portfolio-wrap .portfolio-links a {
    color: #e0e0e0;
    margin: 0 2px;
    font-size: 28px;
    display: inline-block;
    transition: 0.3s;
    border-radius: 25px;
  }
  /* Footer */
  #footer {
    background-color: #12121200;
    color: #e0e0e0;
  }
  
  #footer a {
    color: #ff3e3e;
  }
  
  #footer a:hover {
    color: #e0e0e0;
  }
  
  .copyright, .credits {
    color: #e0e0e0;
  }
  
  /* Bouton de retour en haut */
  .back-to-top {
    background-color: #bb0505;
    color: #e0e0e0;
  }
  
  .back-to-top:hover {
    background-color: #e0e0e0;
    color: #bb0505;
  }
  .custom-danger {
    --bs-btn-border-color: #ff3e3e; /* Ta couleur rouge personnalisée */
    --bs-btn-hover-bg: #ff3e3e; /* Fond au survol */
    --bs-btn-hover-border-color: #ff3e3e; /* Bordure au survol */
    --bs-btn-color: #ff3e3e; /* Couleur du texte */
    --bs-btn-hover-color: #fff; /* Couleur du texte au survol */
  }

  .custom-danger2 {
    --bs-btn-border-color: #bb0505; /* Ta couleur rouge personnalisée */
    --bs-btn-hover-bg: #bb0505; /* Fond au survol */
    --bs-btn-hover-border-color: #bb0505; /* Bordure au survol */
    --bs-btn-color: #fff; /* Couleur du texte */
    --bs-btn-hover-color: #fff; /* Couleur du texte au survol */
  }

  .vanta-canvas {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: -1 !important;
    pointer-events: none !important;
    filter: blur(5px);
  }
  
  .separator {
    position: relative;
    width: 100%;
    height: 20px;
    margin-top: 15px;
    margin-bottom: 10px;
  }
  
  .separator::before {
    content: "";
    position: absolute;
    width: 80px;
    height: 1px;
    background: #ddd;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
  }
  
  .separator::after {
    content: "";
    position: absolute;
    width: 30px;
    height: 3px;
    background: #bb0505;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
  }