/* Fichier style.css */

/* --- Reset & Base Styles --- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  font-family: 'Inter', sans-serif;
  background-color: #f4f4f4;
  color: #333;
  line-height: 1.6;
  padding: 20px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* --- Header --- */
header {
  text-align: center;
  margin-bottom: 40px;
}
header h1 {
  font-size: 2.5rem;
}
header p {
  font-size: 1.1rem;
  color: #666;
  margin-bottom: 15px;
}
header ul {
  list-style: none;
  margin-bottom: 15px;
}
header ul li {
  margin-bottom: 5px;
}

/* --- Header Actions (Toggle + Download) --- */
.header-actions {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  margin-top: 15px;
}
.header-actions button#theme-toggle {
  display: inline-block;
  padding: 4px 12px; /* augmente la largeur du toggle */
  font-size: 0.9rem; /* taille de police légèrement plus grande */
  background-color: #1a73e8;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.header-actions .btn {
  display: inline-block;
  padding: 3px 8px;
  font-size: 0.85rem;
  background-color: #1a73e8;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.header-actions button#theme-toggle:hover,
.header-actions .btn:hover {
  background-color: #155ab6;
}
.header-actions button#theme-toggle:hover,
.header-actions .btn:hover {
  background-color: #155ab6;
}
.header-actions button#theme-toggle:hover,
.header-actions .btn:hover {
  background-color: #155ab6;
}

/* --- Sections --- */
section {
  max-width: 900px;
  margin: 0 auto 40px;
  background: #fff;
  padding: 20px;
  border-left: 4px solid #1a73e8; /* Ajout de la barre de couleur à gauche */
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease;
}
section:hover {
  transform: scale(1.01);
}
section:hover {
  transform: scale(1.01);
}

/* --- Headings & Text --- */
h2 {
  color: #1a73e8;
  margin-bottom: 15px;
}

/* --- Lists --- */
ul {
  list-style: none;
}
li {
  margin-bottom: 10px;
}

/* --- Timeline --- */
.timeline {
  /* On retire la bordure ici, la barre est désormais sur chaque section */
  padding-left: 15px;
}
.timeline-item {
  margin-bottom: 20px;
}
.timeline-item h3 {
  margin-bottom: 5px;
}
/* Espacement réduit pour listes d'expérience */
.timeline-item ul {
  margin-top: 5px;
  margin-bottom: 10px;
}
.timeline-item > ul {
  list-style-type: disc;
  margin: 8px 0 10px 20px;
  padding: 0;
}
.timeline-item ul li {
  font-size: 0.8rem;
  margin-bottom: 4px;
}

/* --- Contact Section --- */
.contact a {
  color: #1a73e8;
  text-decoration: none;
}
.contact svg.icon {
  width: 16px;
  vertical-align: middle;
  margin-right: 5px;
  transition: filter 0.3s ease;
}

/* --- Dark Mode --- */
body.dark {
  background-color: #1a1a1a;
  color: #f5f5f5;
}
body.dark header p,
body.dark header ul li {
  color: #ccc;
}
body.dark section {
  background-color: #2a2a2a;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
}
/* conserver le texte du bouton de téléchargement en blanc en mode sombre */
body.dark .header-actions button#theme-toggle {
  color: #90caf9;
  background-color: #155ab6;
}
body.dark .header-actions .btn {
  color: #fff;
  background-color: #155ab6;
}
body.dark .contact svg.icon {
  filter: brightness(0) invert(1);
}

/* --- Override iOS auto-detected links --- */ */
a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  cursor: default !important;
}
.skills {
  max-width: 900px;
  margin: 0 auto 40px;
}
.skill {
  margin-bottom: 12px;
}
.skill span {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}
.skill-bar {
  background: #e0e0e0;
  border-radius: 4px;
  overflow: hidden;
  height: 8px;
}
.skill-level {
  height: 100%;
  background: #1a73e8;
  transition: width 0.6s ease;
}
body.dark .skill-bar {
  background: #444;
}
body.dark .skill-level {
  background: #90caf9;
}