
:root {
    /* Couleurs pour le Dégradé */
    --color-black: #000000;
    --color-dark-blue-deep: #0a142f; /* Bleu très foncé (bas) */
    --color-dark-blue-mid: #1d3363; /* Bleu pour le milieu */
    
    /* Couleur d'Accentuation Material Design (Cyan Vif) */
    --color-primary-accent: #00bcd4; /* Accentuation pour les titres et boutons primaires */
    
    /* Autres Couleurs */
    --color-text-fade: #a0a0a0;
    --color-card-bg: rgba(255, 255, 255, 0.08); /* Fond de carte légèrement transparent */
    --color-impact-section-bg: rgba(0, 0, 0, 0.4);
}


body {
    /* Le dégradé Noir (haut) vers Bleu Foncé (bas) */
    background: linear-gradient(
        to bottom, 
        var(--color-black) 0%, 
        var(--color-dark-blue-mid) 60%, 
        var(--color-dark-blue-deep) 100%
    );
}

body,
.card,
.card,
a {
    color: #eceff1 !important;
    /*blue-grey lighten-5*/
}

body {
    background-color: #263238 !important;
    /*blue-grey darken-4*/
}

nav {
    background-color: #90a4ae !important;
}

footer {
    background-color: #212121 !important;
    /*grey darken-4*/
}
/* 
.card,
.card {
    background-color: #37474f !important;
    /*blue-grey darken-3*/
} */



.highlight,
.highlight-low {
    color: #263238;
    /*blue-grey darken-4*/
    background: linear-gradient(120deg, #e4a0a1 0%, #b8e1ff 100%);
    background-repeat: no-repeat;
    padding-left: 5px;
    padding-right: 5px;
}

.highlight {
    border-radius: 10px;
    /* box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2); */
}

.highlight-low {
    background-size: 100% 40%;
    background-position: 0 100%;
}

.idea {
	border-left: 8px solid #455a64;
}

/* NAV : Rendre la barre de navigation personnalisée et semi-transparente */
.custom-nav-bg {
    background-color: rgba(0, 0, 0, 0.7) !important; 
    box-shadow: none; /* Enlever l'ombre Materialize par défaut */
}


/* LOGO : Couleur d'accentuation pour le logo */
.custom-logo {
    color: var(--color-primary-accent) !important;
    font-weight: 700;
}

/* FOOTER : Couleur du pied de page */
.custom-footer-bg {
    background-color: var(--color-dark-blue-deep) !important;
    padding-top: 40px;
}

/* CTA Primaire (Boutons) */
.custom-cta-primary {
    background-color: var(--color-primary-accent) !important;
    color: var(--color-dark-blue-deep) !important; /* Texte sombre sur bouton clair */
    font-weight: 700;
}

.custom-cta-primary:hover {
    background-color: #0097a7 !important; /* Assombrir au survol */
}

/* CTA Secondaire (boutons plats blancs) */
.secondary-cta-flat {
    border: 2px solid white;
    margin-left: 15px;
    /* Suppression des marges Materialize par défaut si besoin */
}

/* =================================================== */
/* 4. Mobile (SideNav)                                 */
/* =================================================== */

/* Couleur du SideNav Mobile (pour un fond sombre) */
.sidenav {
    background-color: var(--color-dark-blue-mid) !important;
}

.sidenav li > a {
    color: white !important; /* Liens blancs dans le sidenav */
}

.sidenav li > a:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}