/*
|--------------------------------------------------------------------------
| Filigrane du site — RÉGLAGES
|--------------------------------------------------------------------------
| intensite : 0 = invisible, 1 = image pleine. Recommandé entre 0.06 et 0.15.
| vitesse   : 0 = fixe, 1 = défile avec la page, entre les deux = parallaxe.
|
| Pour retirer le filigrane : Extensions > SNAA – Filigrane > Désactiver.
| Pour changer d'image : remplacer paysage.jpg et portrait.jpg (régénérables
| avec outils/compose_filigrane.py) et ajuster leur proportion ci-dessous.
*/

:root{

    --snaa-filigrane-intensite: 0.10;

    --snaa-filigrane-vitesse: 0.3;
}

/*
|--------------------------------------------------------------------------
| Calque du filigrane, derrière tout le contenu
|--------------------------------------------------------------------------
| proportion = hauteur / largeur du motif (paysage.jpg : 624 / 1600).
*/

.snaa-filigrane{

    --snaa-filigrane-proportion: 0.39;

    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;

    width: 100%;
    height: 100%;

    background-image: url(paysage.jpg);
    background-repeat: repeat-y;
    background-position: center top;
    background-size: 100% auto;

    opacity: var(--snaa-filigrane-intensite);

    pointer-events: none;

    will-change: transform;
}

/* écran plus haut que large (téléphone, tablette en portrait) : portrait.jpg = 1404 / 900 */

@media (max-aspect-ratio: 1/1){

    .snaa-filigrane{

        --snaa-filigrane-proportion: 1.56;

        background-image: url(portrait.jpg);
    }
}

/*
|--------------------------------------------------------------------------
| Fonds blancs et gris très clair rendus transparents
|--------------------------------------------------------------------------
| Seuls les fonds clairs sont concernés : les sections colorées (doré,
| gris foncé...), les cartes, formulaires, tableaux et le menu gardent
| leur fond. !important : les sections portent leur couleur en style en ligne.
*/

.content-section:not([style*="background-color"]):not([class*="bg-color"]),
.content-section[style*="background-color: rgb(255, 255, 255)"],
.content-section[style*="background-color: rgb(245, 250, 253)"],
.content-section[style*="background-color: #fff" i],
.content-section[style*="background-color: #f5fafd" i],
.page-content,
.page-content > .content,
.page-content .gridContainer.content,
.footer,
.footer .footer-content{

    background-color: transparent !important;
}

/*
|--------------------------------------------------------------------------
| En-têtes des pages intérieures : la vague laisse voir le filigrane
|--------------------------------------------------------------------------
| Le thème dessine la vague en blanc par-dessus le bas de l'en-tête doré, ce
| qui cachait le filigrane. On découpe à la place l'en-tête selon le même
| dessin (vague.svg) : la vague garde sa forme et ses coups de pinceau, et
| le filigrane apparaît dessous. hauteur : celle de la vague dans le
| Customizer (.header-separator svg, 65px).
*/

/* navigateurs sans masques : la vague blanche d'origine reste en place */

@supports (mask-composite: exclude) or (-webkit-mask-composite: xor){

    .header-wrapper .header{

        --snaa-vague-hauteur: 65px;

        -webkit-mask-image: url(vague.svg), linear-gradient(#000, #000);
                mask-image: url(vague.svg), linear-gradient(#000, #000);

        -webkit-mask-size: 100% var(--snaa-vague-hauteur), 100% 100%;
                mask-size: 100% var(--snaa-vague-hauteur), 100% 100%;

        -webkit-mask-position: left 0 bottom -1px, 0 0;
                mask-position: left 0 bottom -1px, 0 0;

        -webkit-mask-repeat: no-repeat;
                mask-repeat: no-repeat;

        /* la vague est retranchée de l'en-tête */
        -webkit-mask-composite: xor;
                mask-composite: exclude;
    }

    .header-wrapper .header .header-separator{

        visibility: hidden;
    }
}

/*
|--------------------------------------------------------------------------
| Lisibilité
|--------------------------------------------------------------------------
| Le gris du texte courant du thème (#6B7C93) était déjà un peu pâle sur
| fond blanc (4,3:1 pour 4,5:1 recommandé) ; sur le filigrane il le devient
| davantage. Il est légèrement foncé, ainsi que la mention de bas de page.
| Désactiver l'extension rend aussi leurs couleurs d'origine.
*/

html body{

    color: #5E6D81;
}

html body .footer .copyright{

    color: #6A6A6A;
}