/* ============================================================ QUIZ ARENA — Studio (Espace Créateur) au thème clair ------------------------------------------------------------ Le Studio gardait les blocs bleu nuit de l'ancienne version : texte sombre sur fond sombre, illisible. Tout ce qui suit ne s'applique QUE dans le Studio (classe « qaStudio » posée sur par studio.js), le reste du jeu n'est pas touché. ============================================================ */ body.qaStudio { --st-fond: #fff7ec; --st-carte: #ffffff; --st-doux: #fbf3ea; --st-ligne: #eee1d2; --st-texte: #23203a; --st-gris: #7a7390; --st-accent: #ff6b57; --st-accent-doux: #ffe7e1; --st-vert: #2fb67c; } /* Cartes, blocs et lignes : fond blanc, texte foncé */ body.qaStudio .adminPanel, body.qaStudio .qa-studio-block, body.qaStudio .categoryAdminCard, body.qaStudio .subAdminList > *, body.qaStudio .subcatCard, body.qaStudio .qRow, body.qaStudio .shopAdminRow, body.qaStudio .qa-product-row, body.qaStudio .qa-section-row, body.qaStudio .qa-json-box, body.qaStudio .qualityBox, body.qaStudio .mesBloc, body.qaStudio .emptyState { background: var(--st-carte) !important; background-image: none !important; color: var(--st-texte) !important; border: 1px solid var(--st-ligne) !important; box-shadow: 0 2px 10px rgba(80, 50, 20, 0.06) !important; } body.qaStudio .qa-studio-block, body.qaStudio .subAdminList > *, body.qaStudio .qRow { background: var(--st-doux) !important; box-shadow: none !important; } body.qaStudio .adminPanel :is(h1, h2, h3, h4, b, strong, label, legend, p, span, li, td, th), body.qaStudio .qa-studio-block :is(h2, h3, h4, b, label, p, span), body.qaStudio .qRow :is(b, span), body.qaStudio .subAdminList :is(b, span, label), body.qaStudio .categoryAdminCard :is(b, h3, span) { color: var(--st-texte) !important; } body.qaStudio :is(small, .fine, .fieldHint, .panelHead small, .qMain small) { color: var(--st-gris) !important; } body.qaStudio .eyebrow { color: var(--st-accent) !important; } /* Chiffres clés (tableau de bord, mesures) */ body.qaStudio .adminStats > div, body.qaStudio .qualitySummary > div, body.qaStudio .statGrid > *, body.qaStudio .stChiffres > div { background: var(--st-carte) !important; background-image: none !important; border: 1px solid var(--st-ligne) !important; box-shadow: 0 2px 10px rgba(80, 50, 20, 0.06) !important; color: var(--st-texte) !important; } body.qaStudio :is(.adminStats, .qualitySummary, .statGrid, .stChiffres) b { color: var(--st-texte) !important; opacity: 1 !important; font-size: 26px; } body.qaStudio .statClick { cursor: pointer; } body.qaStudio .statClick:hover { border-color: var(--st-accent) !important; } /* Onglets : pastilles claires, l'onglet actif en couleur */ body.qaStudio .adminTabs, body.qaStudio .qa-studio-tabs { display: flex; flex-wrap: wrap; gap: 8px; overflow: visible !important; } body.qaStudio .adminTabs button, body.qaStudio .qa-studio-tabs button { background: var(--st-carte) !important; background-image: none !important; color: var(--st-texte) !important; border: 1px solid var(--st-ligne) !important; box-shadow: none !important; border-radius: 999px !important; padding: 9px 14px !important; font-size: 13px !important; font-weight: 700 !important; white-space: nowrap; } body.qaStudio .adminTabs button.active, body.qaStudio .adminTabs button.mesTab.on, body.qaStudio .qa-studio-tabs button.on { background: var(--st-accent) !important; border-color: var(--st-accent) !important; color: #fff !important; } /* Champs de saisie */ body.qaStudio :is(.field, .qa-field, input, select, textarea):not([type='checkbox']):not([type='radio']):not([type='color']):not([type='file']) { background: #fff !important; background-image: none !important; color: var(--st-texte) !important; border: 1px solid var(--st-ligne) !important; border-radius: 12px !important; box-shadow: none !important; } body.qaStudio :is(.field, .qa-field, input, textarea)::placeholder { color: #aaa2b8 !important; } body.qaStudio .searchBox { background: #fff !important; border: 1px solid var(--st-ligne) !important; color: var(--st-texte) !important; } body.qaStudio .searchBox input { border: none !important; } body.qaStudio input[type='color'] { border: 1px solid var(--st-ligne) !important; border-radius: 10px; background: #fff !important; } /* Boutons secondaires et boutons « nus » (Modifier, Supprimer, Aperçu…) */ body.qaStudio #app button:not(.primary):not(.sw):not(.back):not(.adminTabs button):not(.qa-studio-tabs button):not(.dangerBtn):not(.danger) { background: #fff !important; background-image: none !important; color: var(--st-texte) !important; border: 1px solid var(--st-ligne) !important; box-shadow: none !important; border-radius: 10px; } body.qaStudio #app button:not(.primary):not(.sw):not(.back):hover { border-color: var(--st-accent) !important; } body.qaStudio .dangerBtn, body.qaStudio .danger { background: #fff1f0 !important; color: #d8412f !important; border: 1px solid #f6c9c2 !important; } body.qaStudio #app button svg { color: inherit; } /* Liste des questions : plus aérée et lisible */ body.qaStudio .questionTable { display: grid; gap: 8px; } body.qaStudio .qRow { border-radius: 14px !important; padding: 10px 12px !important; } body.qaStudio .qRow b { font-weight: 700; line-height: 1.35; } body.qaStudio .qStatus.ok { background: var(--st-vert) !important; } body.qaStudio .qFlagged { border-color: #f6c9c2 !important; background: #fff4f1 !important; } /* Mesures : barres et lignes */ body.qaStudio .mesBars { height: 130px; padding: 8px 6px 4px; border-radius: 12px; background: var(--st-doux) !important; } body.qaStudio .mesBar i { background: linear-gradient(180deg, #ff8a5c, var(--st-accent)) !important; } body.qaStudio :is(.mesLigne, .mesEtape, .mesQ, .mesErr) { color: var(--st-texte) !important; border-color: var(--st-ligne) !important; } /* Fenêtres ouvertes depuis le Studio (modifier une question…) */ body.qaStudio .modalCard :is(.field, .qa-field, input, select, textarea):not([type='checkbox']):not([type='radio']) { background: #fff !important; color: var(--st-texte) !important; border: 1px solid var(--st-ligne) !important; } /* Interrupteurs : gris éteint, vert allumé */ body.qaStudio .sw { background: #e6ddd3 !important; border: none !important; } body.qaStudio .sw:after { background: #fff !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important; } body.qaStudio .sw.on { background: var(--st-vert) !important; } body.qaStudio .stChiffres { margin-bottom: 8px; } body.qaStudio .mesBloc h3 { color: var(--st-texte) !important; }