/* ============================================================ Mode sombre de la DA Pop (26 sept.). Classe « sombre » sur , posée par js/theme.js : réglage du téléphone par défaut, ou choix fait dans Compte → Apparence (clé localStorage wikimi_apparence). Nuit indigo, cartes indigo plus claires, texte clair. Les couleurs des domaines restent vives et gardent leur texte presque noir ; le rose et le jaune gardent l'encre sombre ; le violet, le blanc. ============================================================ */ html.theme-pop.theme-elan.sombre { color-scheme: dark; --pop-nuit: #16142E; --pop-carte: #221F45; --pop-carte2: #2C2856; --pop-bord: #37326A; --pop-encre: #F4F1FF; --pop-sombre: #1E1B4B; /* l'encre sur rose, jaune, pastilles claires */ --pop-gris: #B9B4DA; --pop-violet: #6A4FF0; --pop-violet-o: #3A22A8; --ink: #F4F1FF; --ink2: #E2DEFA; --muted: #B9B4DA; --faint: #9A94C2; --card: #221F45; --track: #2C2856; --line: rgba(255, 255, 255, .1); --bg: #16142E; --lav: #3A3470; --glass: rgba(34, 31, 69, .92); --elan-marine: #F4F1FF; /* les couleurs de texte des domaines, éclaircies pour le fond sombre */ --tete-ci: #C9BEFF; --autres-ci: #FFB6DE; --corps-ci: #86EDC4; --travail-ci: #FFD98A; --quotidien-ci: #A2DEFF; } html.theme-pop.theme-elan.sombre body { background: #0E0C22; } html.theme-pop.theme-elan.sombre .shell { background: var(--pop-nuit) !important; } /* surfaces : tout ce qui était blanc devient indigo */ html.theme-pop.theme-elan.sombre .panel, html.theme-pop.theme-elan.sombre .group, html.theme-pop.theme-elan.sombre .lcard, html.theme-pop.theme-elan.sombre .pistes, html.theme-pop.theme-elan.sombre .duo-carte, html.theme-pop.theme-elan.sombre .balance, html.theme-pop.theme-elan.sombre .tl, html.theme-pop.theme-elan.sombre .lecon-cta, html.theme-pop.theme-elan.sombre .row, html.theme-pop.theme-elan.sombre .duo-theme, html.theme-pop.theme-elan.sombre .note, html.theme-pop.theme-elan.sombre .empty, html.theme-pop.theme-elan.sombre .rung, html.theme-pop.theme-elan.sombre .opt, html.theme-pop.theme-elan.sombre .card, html.theme-pop.theme-elan.sombre .plan, html.theme-pop.theme-elan.sombre .sh-body { background: var(--pop-carte); border-color: var(--pop-bord); color: var(--ink); } html.theme-pop.theme-elan.sombre .panel .note { background: none; } html.theme-pop.theme-elan.sombre .entry, html.theme-pop.theme-elan.sombre .lcard.soft, html.theme-pop.theme-elan.sombre .recap li { background: var(--pop-carte2); border-color: var(--pop-bord); } html.theme-pop.theme-elan.sombre .sheet { background: #1B1840; box-shadow: 0 -12px 40px rgba(0, 0, 0, .5); } html.theme-pop.theme-elan.sombre .sheet .grab { background: #4A4480; } html.theme-pop.theme-elan.sombre .sheet-bg { background: rgba(4, 2, 16, .6); } /* champs de saisie */ html.theme-pop.theme-elan.sombre input[type=text], html.theme-pop.theme-elan.sombre input[type=email], html.theme-pop.theme-elan.sombre input[type=time], html.theme-pop.theme-elan.sombre textarea, html.theme-pop.theme-elan.sombre .lecon .trou { background: var(--pop-carte2); color: var(--ink); } html.theme-pop.theme-elan.sombre input::placeholder, html.theme-pop.theme-elan.sombre textarea::placeholder { color: #9A94C2; } html.theme-pop.theme-elan.sombre .group input[type=text], html.theme-pop.theme-elan.sombre .group input[type=email] { background: var(--pop-carte); } /* petits éléments clairs par défaut */ html.theme-pop.theme-elan.sombre .eyebrow.soft, html.theme-pop.theme-elan.sombre .tagline, html.theme-pop.theme-elan.sombre .pill, html.theme-pop.theme-elan.sombre .lecon .ltype, html.theme-pop.theme-elan.sombre .recap li i, html.theme-pop.theme-elan.sombre .tick, html.theme-pop.theme-elan.sombre .hint3d { background: var(--pop-carte2); color: var(--ink); border-color: var(--pop-bord); } html.theme-pop.theme-elan.sombre .ltags span { background: var(--pop-carte2); color: var(--muted); } html.theme-pop.theme-elan.sombre .row .act { background: var(--pop-carte2); color: var(--ink); } html.theme-pop.theme-elan.sombre .sw i { background: #fff; } /* boutons ronds, retour, pastilles */ html.theme-pop.theme-elan.sombre .hbar .ico, html.theme-pop.theme-elan.sombre .back, html.theme-pop.theme-elan.sombre .rbtn, html.theme-pop.theme-elan.sombre .chip { background: var(--pop-carte); border-color: var(--pop-bord); box-shadow: 0 3px 0 var(--pop-bord); color: var(--ink); } html.theme-pop.theme-elan.sombre .chip.has, html.theme-pop.theme-elan.sombre .chips.tabs .chip.has { background: var(--pop-encre); color: var(--pop-sombre); border-color: var(--pop-encre); box-shadow: 0 3px 0 #8D86C9; } html.theme-pop.theme-elan.sombre .gi.pick, html.theme-pop.theme-elan.sombre .lopt { background: var(--pop-carte); border-color: var(--pop-bord); color: var(--ink); } html.theme-pop.theme-elan.sombre .gi.pick.on, html.theme-pop.theme-elan.sombre .lopt.good { background: #3A3470; border-color: var(--pop-encre); color: var(--ink); } /* textes posés sur du rose, du jaune ou du clair : encre sombre */ html.theme-pop.theme-elan.sombre .btn:not(.soft):not(.soft2):not(.danger), html.theme-pop.theme-elan.sombre .panel .btn:not(.soft):not(.soft2):not(.danger), html.theme-pop.theme-elan.sombre .kicker, html.theme-pop.theme-elan.sombre .who .av { color: var(--pop-sombre); } html.theme-pop.theme-elan.sombre .btn.soft, html.theme-pop.theme-elan.sombre .link { background: var(--pop-carte); color: var(--ink); border-color: var(--pop-encre); box-shadow: 0 4px 0 var(--pop-encre); } html.theme-pop.theme-elan.sombre .btn.soft2 { background: var(--pop-carte); color: var(--ink); border-color: var(--pop-bord); box-shadow: 0 4px 0 var(--pop-bord); } html.theme-pop.theme-elan.sombre .row.on { background: color-mix(in srgb, var(--c) 22%, var(--pop-carte)); border-color: color-mix(in srgb, var(--c) 50%, var(--pop-carte)); } html.theme-pop.theme-elan.sombre .row.on .act, html.theme-pop.theme-elan.sombre .resume .ch { background: var(--pop-encre); color: var(--pop-sombre); } html.theme-pop.theme-elan.sombre .row.on .ts { color: var(--ink); } html.theme-pop.theme-elan.sombre .duo-longueur .duo-theme { background: var(--pop-carte); border-color: var(--pop-bord); } html.theme-pop.theme-elan.sombre .duo-longueur .duo-theme b, html.theme-pop.theme-elan.sombre .duo-longueur .duo-theme span { color: var(--ink); } html.theme-pop.theme-elan.sombre .duo-longueur .duo-theme.on { background: var(--pop-jaune); border-color: var(--pop-encre); } html.theme-pop.theme-elan.sombre .duo-longueur .duo-theme.on b, html.theme-pop.theme-elan.sombre .duo-longueur .duo-theme.on span { color: var(--pop-sombre); } /* thèmes du duo : teinte sombre, texte clair ; le thème choisi en couleur pleine */ html.theme-pop.theme-elan.sombre .duo-theme[data-theme] { background: color-mix(in srgb, var(--c) 24%, var(--pop-carte)); border-color: color-mix(in srgb, var(--c) 40%, var(--pop-carte)); } html.theme-pop.theme-elan.sombre .duo-theme[data-theme] b, html.theme-pop.theme-elan.sombre .duo-theme[data-theme] span { color: var(--ink); } html.theme-pop.theme-elan.sombre .duo-theme[data-theme].on { background: var(--c); border-color: var(--pop-encre); } html.theme-pop.theme-elan.sombre .duo-theme[data-theme].on b, html.theme-pop.theme-elan.sombre .duo-theme[data-theme].on span { color: var(--pop-t); } html.theme-pop.theme-elan.sombre .duo-rep { border-top-color: var(--pop-bord); } /* le pas en cours, l'échelle */ html.theme-pop.theme-elan.sombre .panel.pas-cours { background: var(--pop-carte); } html.theme-pop.theme-elan.sombre .rung { color: var(--ink); } html.theme-pop.theme-elan.sombre .rung .rn { background: var(--pop-carte2); color: var(--ink); } html.theme-pop.theme-elan.sombre .rung.now .rn { background: #fff; color: var(--pop-sombre); } html.theme-pop.theme-elan.sombre .rung.done .rn { background: #3DDC97; color: #0B3B26; } html.theme-pop.theme-elan.sombre .ajout { border-color: var(--pop-encre); background: rgba(255, 255, 255, .04); color: var(--ink); } /* Explorer : un halo discret derrière la silhouette */ html.theme-pop.theme-elan.sombre .mapcard { background: radial-gradient(46% 50% at 50% 46%, rgba(155, 133, 255, .22) 0%, rgba(155, 133, 255, .06) 55%, transparent 78%); } /* compte */ html.theme-pop.theme-elan.sombre .brow .bb { background: var(--pop-carte2); } /* barre du bas */ html.theme-pop.theme-elan.sombre .nav { background: #1B1840; border-top-color: var(--pop-bord); } html.theme-pop.theme-elan.sombre .nav button { color: var(--pop-gris); } html.theme-pop.theme-elan.sombre .nav button.on { color: var(--pop-encre); } html.theme-pop.theme-elan.sombre .nav button.on svg { color: var(--pop-sombre); } /* calendrier */ html.theme-pop.theme-elan.sombre .day { color: var(--ink); } html.theme-pop.theme-elan.sombre .day.on { color: var(--pop-sombre); } html.theme-pop.theme-elan.sombre .day.on span { color: var(--pop-sombre); } /* les états « choisi » que la règle générale des surfaces a éteints */ html.theme-pop.theme-elan.sombre .panel.pas-cours { border: 3px solid var(--c); border-bottom: 7px solid var(--pop-o); } html.theme-pop.theme-elan.sombre .rung.now { background: var(--pop-violet); border-color: var(--pop-violet); box-shadow: 0 4px 0 var(--pop-violet-o); color: #fff; } html.theme-pop.theme-elan.sombre .rung.now .rlt { color: #fff; } html.theme-pop.theme-elan.sombre .opt.on, html.theme-pop.theme-elan.sombre .card.on { background: #3A3470; } /* contrastes relevés par l'audit (AA) en sombre */ html.theme-pop.theme-elan.sombre .unlock .ut span { color: #fff; } html.theme-pop.theme-elan.sombre .partage { color: var(--pop-t); } html.theme-pop.theme-elan.sombre .gi.set.danger .sl { color: #FF9C94; } html.theme-pop.theme-elan.sombre .hint3d { background: var(--pop-carte); border-color: var(--pop-bord); box-shadow: 0 3px 0 var(--pop-bord); color: var(--ink); }