/* =========================================
   BASE GLOBALE
========================================= */
body {
    display: flex;
    margin: 0;
    min-height: 100vh;
    color: white;
    background-color: black;
    font-family: "Times New Roman", Times, serif;
    font-size: 18px;           /* Base confortable pour la lecture */
    line-height: 1.6;          /* Aération du texte de l'article */
}

/* =========================================
   CONTENU PRINCIPAL (.main)
========================================= */
.main {
    flex-grow: 1;
    min-width: 0;
    padding: 2rem 3.5rem;      /* Marge généreuse autour du texte */
}

h1 {
    font-size: 32px;
    color: white; 
    background-color: black;
    text-align: center;
    border: 2px solid white;
    padding: 10px;
    margin-top: 0;
    margin-bottom: 1.5em;
    letter-spacing: 1px;
}

h2 {
    font-size: 24px;
    margin-top: 1.8em;
    margin-bottom: 0.8em;
    border-bottom: 1px dotted #5cb7df; /* Soulignement léger pour structurer */
    padding-bottom: 4px;
}

h3 {
    font-size: 20px;
    margin-top: 1.5em;
}

/* =========================================
   ALIGNEMENTS ET PARAGRAPHES
========================================= */
p.left { 
    text-align: left; 
}

p.center { 
    text-align: center; 
}
/* =========================================
   SOMMAIRE / NAVIGATION LATÉRALE (.sidenav)
========================================= */
.sidenav {
    width: 250px;
    min-width: 250px;
    max-width: 250px;
    flex-shrink: 0;
    height: 100vh;
    position: sticky;
    top: 0;
    overflow-y: auto;          
    overflow-x: hidden;        
    padding: 15px 15px 25px 15px; /* Un peu plus d'air en haut et en bas */
    border-right: 1px solid #333;
    background-color: #050505;    /* Très léger contraste de fond (optionnel) */
    line-height: 1.4;
}

/* Taille de texte compacte pour le menu */
.sidenav p, 
.sidenav ul, 
.sidenav li, 
.sidenav a {
    font-size: 14px;
}

/* Titres de rubriques du menu (Design "Label") */
.sidenav h3 {
    font-size: 12px;           /* Très petit... */
    font-weight: bold;
    text-transform: uppercase; /* ...mais en majuscules */
    letter-spacing: 1px;       /* ...et espacé */
    color: #888;               /* Gris clair pour adoucir */
    margin-top: 2em;
    margin-bottom: 0.8em;
    padding-bottom: 4px;
    border-bottom: 1px solid #333;
}

/* Gestion fine des listes du menu */
.sidenav ul {
    list-style-type: none;     
    margin: 0;
    padding-left: 8px;
}

.sidenav ul ul {
    padding-left: 14px;
    border-left: 1px solid #333; /* Ligne verticale discrète pour les sous-menus */
    margin-left: 2px;
}

.sidenav li {
    margin: 6px 0;
    overflow-wrap: break-word; 
    word-break: break-word;
}

/* =========================================
   LIENS GLOBAUX (Contenu principal)
========================================= */
a {
    text-decoration: none;           /* Retire le soulignement permanent pour alléger la page */
}
a:link { color: #dddddd; }           /* Gris clair très lisible sur fond noir */
a:visited { color: #999999; }        /* Gris moyen pour les pages lues (élimine totalement le violet) */
a:hover { 
    color: #ffffff;                  /* Devient blanc pur au survol */
    text-decoration: underline; 
}
a:active { color: #ffffff; }

/* =========================================
   LIENS DU SOMMAIRE (.sidenav)
========================================= */
/* On rend la table des matières légèrement plus discrète que le texte central */
.sidenav a:link { color: #aaaaaa; }  
.sidenav a:visited { color: #777777; }
.sidenav a:hover { 
    color: #ffffff; 
    text-decoration: underline; 
}
/* =========================================
   IMAGES
========================================= */
/* Cadre blanc par défaut pour toutes les photos (Portfolio, accueil, etc.) */
img {
    vertical-align: middle;
    border: 2px solid white;
    margin: 5px;
}

/* Classes spécifiques sans cadre (pour les icônes du menu par exemple) */
img.simple {
    vertical-align: middle;
    border: 0;
    margin: 5px;
}

img.nomargin {
    vertical-align: middle;
    border: 0;
    margin: 0;
}

img.test {
    display: block;
    margin-left: auto; 
    margin-right: auto; 
    width: 100%;
}

/* =========================================
   TABLEAUX
========================================= */
table.noborder {
    margin: auto;
    text-align: center;
    border: 0;
}

table.center {
    margin: auto;
    text-align: center;
    border: 2px solid white;
    border-collapse: collapse;
}

table.center tr, table.center td { 
    border: 2px solid white;
    padding: 4px 8px;
}

table.center tr:first-child { border-top: none; }
table.center tr:last-child { border-bottom: none; }
table.center td:first-child { border-left: none; }
table.center td:last-child { border-right: none; }