/* Style global pour un défilement doux */
html {
  scroll-behavior: smooth;
 }

 /* Style de la scrollbar */
::-webkit-scrollbar {
   width: 0.625rem;
 }

 ::-webkit-scrollbar-thumb {
   border-radius: 1rem;
   background: linear-gradient(90deg, red, black);
 }

 ::-webkit-scrollbar-track {
   background: black;
 }

 /* Fallback pour navigateurs non Webkit */
 .scrollbar-thumb {
   scrollbar-color: linear-gradient(90deg, red, black);
   scrollbar-width: thin;
 }

 /* Style de base pour le corps de la page */
 body {
    background-color: black;
    color: whitesmoke;
    font-family: Arial, sans-serif;
 }

 /* Style pour les liens a */
 .link-color {
  text-decoration: none;
  color: whitesmoke;
  font-weight: bold;
 }

 /* Effet hover pour les liens et les boutons */
 .link-color:hover,
 .custom-button:hover {
    transition: color 0.25s ease, background-color 0.25s ease;
 }

 ul, ol {
   list-style: none;
   padding: 10px;
 }
 li {
   margin-bottom: 16px;
 }

 /* Style pour le texte rouge */
 .text-red {
    color: red;
 }

 /* Style pour les éléments surlignés */
 mark {
  background-color: red;
  color: white;
  padding: 4px;
  border-radius: 4px;
 }

 /* Style pour les boutons */
 .custom-button {
    cursor: pointer;
    padding: 10px 20px;
    font-size: 16px;
    border: none;
    border-radius: 12px;
    background-color: red;
    color: black;
    transition: 0.3s ease;
 }

 /* Effet hover pour les boutons */
 .custom-button:hover {
    background-color: darkred;
    color: whitesmoke;
 }

 /* Style pour les liens à l'intérieur des boutons */
 .custom-button a {
    color: black;
    text-decoration: none;
    transition: 0.3s ease;
 }

 /* Effet hover pour les liens à l'intérieur des boutons */
 .custom-button a:hover {
    color: whitesmoke;
 }

 /* Style pour les articles */
 article {
  border: 1px solid #444;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
 }

 /* Style pour les en-têtes et pieds de page */
 header, footer {
    background: linear-gradient(120deg, #323232, black);
    padding: 15px;
    text-align: center;
    border-radius: 12px 12px 0 0;
    transition: background 0.3s ease;
 }