:root {
    --bg-color: #ffffff;
    --text-color: #000000
}

body.dark-theme {
    --bg-color: #282a35;
    --text-color: #f0f0f0
}

.logo {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 27px;
    color: #000;
    letter-spacing: -2px;
    text-align: center
}

body.dark-theme .logo {
    color: #fff
}

.navigation-toggle {
    display: none;
    text-transform: uppercase;
    position: relative;
    color: #0f0f0f;
    background-color: #fff
}

body.dark-theme .navigation-toggle {
    color: #fff;
    background-color: #282a35
}

.main-nav {
    padding-top: 30px;
    padding-bottom: 25px;
    background-color: #FFF;
    -moz-box-shadow: 0 1px 5px rgb(0 0 0 / .1);
    -webkit-box-shadow: 0 1px 5px rgb(0 0 0 / .1);
    box-shadow: 0 1px 5px rgb(0 0 0 / .1);
    z-index: 10;
    position: relative
}

body.dark-theme .main-nav {
    background-color: #282a35
}

.top-nav .item-nav li a {
    font-family: "Lato", sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #A4A4A4;
    margin: -5px
}

body.dark-theme .top-nav .item-nav li a {
    color: #fff
}

body.dark-theme .top-nav .item-nav li.active a {
    color: #FF6C40
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: "Helvetica Neue", Helvetica, Tahoma, sans-serif;
    font-weight: 700;
    color: #000;
    text-rendering: optimizeLegibility;
    margin: 0 0 .5em 0
}

body.dark-theme h1,
body.dark-theme h2,
body.dark-theme h3,
body.dark-theme h4,
body.dark-theme h5,
body.dark-theme h6,
body.dark-theme .h1,
body.dark-theme .h2,
body.dark-theme .h3,
body.dark-theme .h4,
body.dark-theme .h5,
body.dark-theme .h6 {
    color: #fff
}

p.p-intro {
    color: #E85F37;
    font-family: "Open Sans", sans-serif;
    font-size: 0.8em;
    letter-spacing: 2px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 25px;
    background-color: #FFF;
    border: 1px solid #DC5227;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow: inset 0 -3px 0 #FFF;
    position: relative;
    -webkit-animation: smooth-entry-btn 1s;
    -moz-animation: smooth-entry-btn 1s;
    animation: smooth-entry-btn 1s
}

body.dark-theme p.p-intro {
    background-color: #282a35;
    color: #E85F37;
    box-shadow: inset 0 -3px 0 #282a35;
}

.content .post h1 {
    color: #000;
    font-family: Lato, sans-serif;
    font-size: 22px;
    font-weight: 400;
    position: relative
}

body.dark-theme .content .post h1 {
    color: #fff; /* Couleur blanche pour le texte en mode sombre */
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    transition: background-color 0.3s ease, color 0.3s ease
}

.content .post p {
    color: #535353;
    font-family: "Open Sans", sans-serif;
    font-size: 15px;
    font-weight: 400
}

body.dark-theme .content .post p {
    color: #d1d1d1
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    transition: background-color 0.3s ease, color 0.3s ease
}

#theme-toggle {
    cursor: pointer;
    font-size: 20px;
    transition: color 0.3s ease
}

body.dark-theme #theme-toggle {
    color: #fff
}