Zettlr : astuces (Bonus)

/* --- Impression --- */
@page {
    size: A4 portrait;
    margin: 2.5cm 2cm; /* Marges confortables pour la reliure */

    @top-center { /* voir autres éléments dans l'entête Yaml du document */
        font-size: 9pt;
        color: #666;
        border-bottom: 0.5pt solid #2B7FFF;
        margin-bottom: 5px;
        width: 100%;
    }

    @bottom-center { /* On indique le compteur de pages en bas, centré */
        content: "Page " counter(page) " de " counter(pages);
        font-size: 10pt;
        color: #2B7FFF;
    }
}


/* On n'oublie pas les compteurs sur 4 niveaux à      */
/* commencer  par H2 (car H1 sert au titre principal) */

body {
    counter-reset: h2counter h3counter h4counter; 
    text-align: justify;
    text-justify: inter-word; /* Optimise l'espace entre les mots */
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    font-family: "Times New Roman", "Times", "Liberation Serif", FreeSerif, serif;
    line-height: 1.5;
    color: #000;
    font-size: 11pt;
}

/* --- Les styles Pandoc par défaut qu'on modifie --- */
h1 {
    text-align: center;
    font-size: 2.5em;
    font-weight: 300;
    margin-top: 1cm;
    margin-bottom: 1cm;
    color: #000;
}

.subtitle {
    text-align: center;
    font-size: 1.2em;
    color: #2B7FFF;
    font-weight: bold;
    margin-top: -0.5cm;
    margin-bottom: 1cm;
}

.author, .date {
    text-align: center;
    margin: 0.2em 0;
    font-weight: 300;
}

.date { color: #2B7FFF; }

.abstract {
    border-top: 2px solid #2B7FFF;
    border-bottom: 2px solid #2B7FFF;
    margin: 1cm 5%;
    padding: 1em;
    font-size: 0.95em;
    font-style: italic;
}

.abstract-title {
    font-weight: bold;
    text-align: center;
    display: block;
    padding-bottom: 0.5em;
    font-style: normal;
}

/* --- Corps de texte --- */
p {
    orphans: 3;
    widows: 3;
    margin-bottom: 1em;
}

blockquote {
    margin: 1.5em 2em;
    padding-left: 1em;
    border-left: 3px solid #2B7FFF;
    font-style: italic;
    color: #444;
}

a { 
    text-decoration: none; 
    color: magenta; /* Ou noir #000 pour l'impression */
}

/* --- Listes --- */
ul, ol { margin-bottom: 1em; }

ul { list-style-type: none; }

ul li {
    position: relative;
    margin-left: 1.5em;
}

ul li::before {
    content: "\2014"; /* Tiret cadratin */
    position: absolute;
    left: -1.5em;
}

/* --- Bibliographie --- */
.csl-entry {
    text-indent: -1cm;
    margin-bottom: 0.5em;
    line-height: 1.3;
    orphans: 3;
    widows: 3;
}

a, .csl-entry, .footnotes {
    /* Permet de casser l'URL n'importe où pour éviter le débordement */
    overflow-wrap: break-word; 
    word-wrap: break-word;
  word-break: break-all;  /*Coupe les caractères si nécessaire pour les URL trop longues */
  /* hyphens: none !important; Optionnel : améliore le rendu sur certains navigateurs */
}

/* --- 5. TITRES ET NUMÉROTATION --- */

/* Sécuriser le saut de page : pas de titre seul en bas de page */
h2, h3, h4 {
    color: #2B7FFF;
    break-after: avoid;
    page-break-after: avoid;
    margin-top: 1.5em;
}

/* H2 : Niveau 1 de numérotation */
h2:not(.unnumbered) {
    display: flex;
    align-items: flex-start;
    counter-increment: h2counter;
    counter-reset: h3counter; /* Reset les enfants */
}

h2:not(.unnumbered)::before {
    content: counter(h2counter) ". ";
    flex-basis: 2em;
    flex-shrink: 0;
    font-weight: bold;
}

/* H3 : Niveau 2 de numérotation */
h3:not(.unnumbered) {
    display: flex;
    align-items: flex-start;
    counter-increment: h3counter;
    counter-reset: h4counter; /* Reset les enfants */
}

h3:not(.unnumbered)::before {
    content: counter(h2counter) "." counter(h3counter) " ";
    flex-basis: 2.8em;
    flex-shrink: 0;
    font-weight: bold;
}

/* H4 : Niveau 3 de numérotation */
h4:not(.unnumbered) {
    display: flex;
    align-items: flex-start;
    counter-increment: h4counter;
}

h4:not(.unnumbered)::before {
    content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) " ";
    flex-basis: 3.5em;
    flex-shrink: 0;
    font-weight: bold;
}

/* --- 6. NETTOYAGE IMPRESSION --- */
@media print {
    nav, .ads, .social-share, button, .no-print {
        display: none !important;
    }

}