/* ============================================================================
   Tokens de thème du profil public — mode clair / sombre.
   Portés à l'identique de template_html_claude/JSX/zic-profil-2.jsx (objet
   THEMES). L'attribut `data-pp-theme="dark|light"` est posé sur <html> par le
   script anti-FOUC de base.html (gardé public_artist_mode) puis piloté par
   public-profile-theme-toggle.js.

   Les ACCENTS du créateur (--pp-accent-*) restent orthogonaux : ils sont
   injectés inline sur .zh-pp-page (public_profile_theme.py) et NE changent PAS
   avec le thème. Seuls les neutres (fond / carte / bordure / texte / overlay)
   basculent ici.
   ========================================================================== */

/* Valeurs par défaut = SOMBRE (apparence historique). Sert aussi de filet quand
   JS est désactivé et qu'aucun attribut n'a été posé sur <html>. */
:root,
:root[data-pp-theme="dark"] {
  --pp-bg: #0b0419;
  --pp-bg-soft: #140924;
  --pp-card: #1a0e2e;
  --pp-card-light: #231340;
  --pp-card-lighter: #2d1a4f;
  --pp-border: rgba(168, 85, 247, 0.18);
  --pp-border-strong: rgba(168, 85, 247, 0.4);
  --pp-text: #fafafb;
  --pp-text-muted: rgba(250, 250, 251, 0.62);
  --pp-text-soft: rgba(250, 250, 251, 0.42);
  --pp-overlay: rgba(255, 255, 255, 0.06);
  --pp-overlay-strong: rgba(255, 255, 255, 0.12);
  --pp-overlay-border: rgba(255, 255, 255, 0.12);
  --pp-menu-bg: rgba(20, 9, 36, 0.96);
  --pp-shadow: rgba(0, 0, 0, 0.55);
  --pp-shadow-soft: rgba(0, 0, 0, 0.35);
  --pp-header-bg-mobile: rgba(11, 4, 25, 0.88);
  --pp-scrim: rgba(4, 2, 8, 0.82);
  /* Liens / textes d'accent posés sur --pp-card (modale d'auth) : #6D28D9
     tombe à ~2,6:1 sur la carte sombre → #A78BFA (~6,7:1, AA). */
  --pp-link: #A78BFA;
  /* Page vitrine (refonte du 23 oct 2026) : neutres du gabarit, rayons et
     ombres. Noms SANS chiffre (lus par la regex des tests de contraste). */
  --pp-page: #0b0419;
  --pp-ink: #fafafb;
  --pp-mut: rgba(250, 250, 251, 0.66);
  --pp-line: rgba(168, 85, 247, 0.18);
  --pp-line-strong: rgba(168, 85, 247, 0.32);
  --pp-brand: #A78BFA;
  --pp-danger: #FB7185;
  --pp-success: #4ADE80;
  --pp-success-ink: #4ADE80;
  --pp-star: #F59E0B;
  --pp-header-bg: rgba(11, 4, 25, 0.86);
  --pp-bar-bg: rgba(11, 4, 25, 0.92);
  --pp-cta-bg: #FAFAFB;
  --pp-cta-ink: #0B0419;
  --pp-shadow-card: 0 1px 2px rgba(0, 0, 0, 0.35);
  --pp-shadow-hover: 0 16px 30px -18px rgba(0, 0, 0, 0.7);
  --pp-shadow-pop: 0 18px 44px rgba(0, 0, 0, 0.55);
  --pp-r-sm: 10px;
  --pp-r-md: 12px;
  --pp-r-lg: 16px;
  --pp-r-xl: 20px;
  --pp-r-xxl: 22px;
  --pp-r-pill: 999px;
  color-scheme: dark;
}

/* No-JS : suivre le système tant qu'aucun choix explicite n'est posé. */
@media (prefers-color-scheme: light) {
  :root:not([data-pp-theme]) {
    --pp-bg: #ffffff;
    --pp-bg-soft: #f5f4fb;
    --pp-card: #ffffff;
    --pp-card-light: #f5f4fb;
    --pp-card-lighter: #ece9f6;
    --pp-border: rgba(26, 10, 61, 0.1);
    --pp-border-strong: rgba(124, 58, 237, 0.32);
    --pp-text: #1a0a3d;
    --pp-text-muted: rgba(26, 10, 61, 0.6);
    --pp-text-soft: rgba(26, 10, 61, 0.4);
    --pp-overlay: rgba(26, 10, 61, 0.05);
    --pp-overlay-strong: rgba(26, 10, 61, 0.09);
    --pp-overlay-border: rgba(26, 10, 61, 0.12);
    --pp-menu-bg: rgba(255, 255, 255, 0.98);
    --pp-shadow: rgba(15, 8, 38, 0.18);
    --pp-shadow-soft: rgba(15, 8, 38, 0.1);
    --pp-header-bg-mobile: rgba(255, 255, 255, 0.88);
    --pp-scrim: rgba(26, 10, 61, 0.42);
    --pp-link: #6D28D9;
    /* Page vitrine : palette claire du gabarit (--pp-mut 5,15:1 sur la page). */
    --pp-page: #F6F4FB;
    --pp-ink: #1F1340;
    --pp-mut: #6B6383;
    --pp-line: #E7E2F5;
    --pp-line-strong: #D9D3EA;
    --pp-brand: #7B3FF2;
    --pp-danger: #E11D48;
    --pp-success: #16A34A;
    --pp-success-ink: #15803D;
    --pp-star: #D97706;
    --pp-header-bg: rgba(255, 255, 255, 0.94);
    --pp-bar-bg: rgba(246, 244, 251, 0.96);
    --pp-cta-bg: #1F1340;
    --pp-cta-ink: #FFFFFF;
    --pp-shadow-card: 0 1px 2px rgba(31, 19, 64, 0.04);
    --pp-shadow-hover: 0 16px 30px -18px rgba(31, 19, 64, 0.45);
    --pp-shadow-pop: 0 18px 44px rgba(31, 19, 64, 0.18);
    --pp-r-sm: 10px;
    --pp-r-md: 12px;
    --pp-r-lg: 16px;
    --pp-r-xl: 20px;
    --pp-r-xxl: 22px;
    --pp-r-pill: 999px;
    color-scheme: light;
  }
}

/* Choix explicite / valeur résolue par le script. */
:root[data-pp-theme="light"] {
  --pp-bg: #ffffff;
  --pp-bg-soft: #f5f4fb;
  --pp-card: #ffffff;
  --pp-card-light: #f5f4fb;
  --pp-card-lighter: #ece9f6;
  --pp-border: rgba(26, 10, 61, 0.1);
  --pp-border-strong: rgba(124, 58, 237, 0.32);
  --pp-text: #1a0a3d;
  --pp-text-muted: rgba(26, 10, 61, 0.6);
  --pp-text-soft: rgba(26, 10, 61, 0.4);
  --pp-overlay: rgba(26, 10, 61, 0.05);
  --pp-overlay-strong: rgba(26, 10, 61, 0.09);
  --pp-overlay-border: rgba(26, 10, 61, 0.12);
  --pp-menu-bg: rgba(255, 255, 255, 0.98);
  --pp-shadow: rgba(15, 8, 38, 0.18);
  --pp-shadow-soft: rgba(15, 8, 38, 0.1);
  --pp-header-bg-mobile: rgba(255, 255, 255, 0.88);
  --pp-scrim: rgba(26, 10, 61, 0.42);
  --pp-link: #6D28D9;
  /* Page vitrine : palette claire du gabarit (--pp-mut 5,15:1 sur la page). */
  --pp-page: #F6F4FB;
  --pp-ink: #1F1340;
  --pp-mut: #6B6383;
  --pp-line: #E7E2F5;
  --pp-line-strong: #D9D3EA;
  --pp-brand: #7B3FF2;
  --pp-danger: #E11D48;
  --pp-success: #16A34A;
  --pp-success-ink: #15803D;
  --pp-star: #D97706;
  --pp-header-bg: rgba(255, 255, 255, 0.94);
  --pp-bar-bg: rgba(246, 244, 251, 0.96);
  --pp-cta-bg: #1F1340;
  --pp-cta-ink: #FFFFFF;
  --pp-shadow-card: 0 1px 2px rgba(31, 19, 64, 0.04);
  --pp-shadow-hover: 0 16px 30px -18px rgba(31, 19, 64, 0.45);
  --pp-shadow-pop: 0 18px 44px rgba(31, 19, 64, 0.18);
  --pp-r-sm: 10px;
  --pp-r-md: 12px;
  --pp-r-lg: 16px;
  --pp-r-xl: 20px;
  --pp-r-xxl: 22px;
  --pp-r-pill: 999px;
  color-scheme: light;
}