/* ===========================================================================
   POPPY MOVE — jetons de marque « Onyx et or »
   Spec : docs/superpowers/specs/2026-09-15-charte-onyx-or-design.md
   ---------------------------------------------------------------------------
   :root porte le thème onyx ; [data-theme="light"] porte le crème.
   lib/theme.js pose data-theme avant le premier rendu.

   Les ALIAS DE TRANSITION (--rose, --dark…) gardent vivants les noms que les
   pages utilisent encore : ils pointent vers les nouveaux jetons, donc tout
   bascule d'un coup. Une page migrée n'utilise plus que les jetons nouveaux.
   Règle : sur crème, --or n'écrit jamais un texte de moins de 24 px ;
   les petits textes dorés prennent --or-texte.
   =========================================================================== */
:root {
    --fond:       #161513;
    --surface:    #211F1C;
    --surface-2:  #2A2724;
    --texte:      #F3EEE4;
    --texte-rgb:  243, 238, 228;
    --texte-doux: #B3ADA2;
    --or:         #C9A55C;
    --or-rgb:     201, 165, 92;
    --or-texte:   #C9A55C;
    --sur-or:     #2A1F08;
    --trait:      #3A3631;

    /* Les quatre phases du cycle : des repères de lecture, pas des couleurs de
       marque. Elles suivent le thème, restent lisibles sur leur fond (≥ 3:1) et
       se distinguent deux à deux par la clarté autant que par la teinte — une
       personne qui confond le vert et l'orange les sépare quand même. */
    --phase-regles:       #A8672F;
    --phase-folliculaire: #C9A55C;
    --phase-ovulation:    #F3EEE4;
    --phase-luteale:      #AFB89A;

    --f-titre: 'Oswald', 'Arial Narrow', sans-serif;
    --f-d:     'Cormorant Garamond', Georgia, serif;
    --f-b:     'DM Sans', system-ui, sans-serif;

    color-scheme: dark;

    /* Alias de transition */
    --rose:      var(--or);
    --rose-dk:   var(--or-texte);
    --gold:      var(--or);
    --dark:      var(--fond);
    --dark2:     var(--surface);
}

:root[data-theme="light"] {
    --fond:       #F2EBDF;
    --surface:    #FBF7F0;
    --surface-2:  #E9E0D1;
    --texte:      #171411;
    --texte-rgb:  23, 20, 17;
    --texte-doux: #5C554B;
    --or:         #A5813C;
    --or-rgb:     165, 129, 60;
    --or-texte:   #7A5C22;
    --sur-or:     #171411;
    --trait:      #D9CFBF;

    --phase-regles:       #8C5426;
    --phase-folliculaire: #A5813C;
    --phase-ovulation:    #171411;
    --phase-luteale:      #7E8C66;

    color-scheme: light;
}

/* Le logo existe en deux encres : on n'affiche que celle du thème. */
:root[data-theme="light"] .logo-onyx,
:root:not([data-theme="light"]) .logo-creme { display: none; }
