.theme-toggle {
  position: fixed;
  top: 20px;
  right: 20px;
  cursor: pointer;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(255,255,255,0.05);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.15);
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
  transition: background 0.3s ease;
}

.theme-toggle:hover {
  background: rgba(255,255,255,0.1);
}

.theme-icon {
  position: absolute;
  width: 24px;
  height: 24px;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Soleil visible par défaut */
.theme-icon.sun { opacity: 1; }
.theme-icon.moon { opacity: 0; }

/* Quand dark-mode activé, inverser */
body.dark-mode .theme-icon.sun { opacity: 0; transform: rotate(-45deg); }
body.dark-mode .theme-icon.moon { opacity: 1; transform: rotate(0deg); }

/* Mode nuit automatique */
body.dark-mode {
  filter: invert(0) hue-rotate(180deg);
  background: #16213e; /* optionnel, juste pour assurer le fond */
}

/* Corriger les images pour ne pas qu'elles soient inversées */
body.dark-mode img, 
body.dark-mode video {
  filter: invert(0) hue-rotate(180deg);
}

/* Garder certains éléments avec couleurs originales si besoin */
body.dark-mode .no-invert {
  filter: none;
}



body.dark-mode .job:hover,
body.dark-mode .education-box:hover {
  border-color: rgba(255,255,255,0.4);
  background: rgba(197, 14, 14, 0.137);
}