/* css/test.css — feuille propre à test.html (page d’un test public, intro → questions → inscription).
   Sortie du bloc <style> de la page le 17/10/2026 (lot 8 du dossier 1 de l’API : CSP sans style en ligne), à la même
   place dans la page (même ordre de cascade). Polices en chemin relatif (../fonts/) : mêmes fichiers sous
   temporaire.psychologue.fr et sous www.psychologue.fr/test/. Changer le ?v= de la page à chaque modification
   (CSS en cache 7 jours). */
    /* Habillage embed : on ne garde que le contenu utile (états quiz/signup) —
       header, hero (note Trustindex + H1) et footer appartiennent à la page hôte. */
    html.embed .top-header, html.embed .center-section, html.embed .page-footer { display: none !important; }
    html.embed body { background: #fff; }
    html.embed .main-content-box { margin: 0 !important; padding: 0 !important; }
    html.embed .container { padding-left: 0; padding-right: 0; }

    /* ── Embed : CONTINUITÉ VISUELLE avec le teaser widget.html ──────────────
       Le lecteur clique la question 1 dans l'encart → les questions suivantes
       doivent avoir EXACTEMENT le même habillage (titre accent, eyebrow
       « Question k sur N », question en Newsreader italique, réponses en
       pills). Mêmes fonts auto-hébergées et mêmes tokens (DS psy-annuaire)
       que widget.html. Ces règles ne s'appliquent QUE sous html.embed. */
    @font-face {font-family:'Kumbh Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/kumbh-latin-ext-0.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
    @font-face {font-family:'Kumbh Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/kumbh-latin-1.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
    @font-face {font-family:'Newsreader';font-style:italic;font-weight:400 600;font-display:swap;src:url(../fonts/newsreader-italic-latin-ext-2.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
    @font-face {font-family:'Newsreader';font-style:italic;font-weight:400 600;font-display:swap;src:url(../fonts/newsreader-italic-latin-3.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

    .embed-qhead { display: none; }
    html.embed .embed-qhead { display: block; }
    html.embed .embed-test-title {
        font-family: 'Kumbh Sans', ui-sans-serif, system-ui, sans-serif;
        font-size: 17px; font-weight: 700; line-height: 1.35;
        color: #5B65DE; text-wrap: balance; overflow-wrap: break-word;
        margin: 2px 0 2px;
    }
    html.embed .embed-eyebrow {
        font-family: 'Kumbh Sans', ui-sans-serif, system-ui, sans-serif;
        font-size: 13px; font-weight: 700; letter-spacing: .08em;
        text-transform: uppercase; color: #62688E; margin-bottom: 8px;
    }
    /* Badge « Vos symptômes » et gros H2 centré : remplacés par le header embed */
    html.embed #state-questions .d-md-flex.justify-content-center { display: none !important; }
    html.embed #state-questions .steps-wrapper { margin: 0 0 12px; }
    html.embed #qText {
        font-family: 'Newsreader', Georgia, serif !important;
        font-style: italic; font-weight: 600;
        font-size: clamp(20px, 4.5vw, 27px) !important;
        line-height: 1.3 !important; color: #0E1338 !important;
        text-align: left !important; margin: 4px 0 18px !important;
    }
    html.embed #state-questions .text-center-desktop { text-align: left !important; }
    /* Réponses : cartes pleine largeur → pills identiques au teaser */
    html.embed #qChoices { display: flex; flex-wrap: wrap; gap: 10px 12px; }
    html.embed #qChoices .select-option {
        display: inline-flex; align-items: center; width: auto; margin: 0;
        padding: 12px 22px; border: 1.5px solid #D9DCEC; border-radius: 999px;
        background: #fff; box-shadow: none; cursor: pointer;
        font-family: 'Kumbh Sans', ui-sans-serif, system-ui, sans-serif;
        font-size: 16px; font-weight: 600; color: #0E1338;
        transition: border-color .15s ease, background .15s ease, transform .15s ease;
    }
    html.embed #qChoices .select-option:hover { border-color: #5B65DE; background: #E8EAFB; transform: translateY(-1px); }
    html.embed #qChoices .select-option:has(input:checked) { border-color: #5B65DE; background: #E8EAFB; }
    html.embed #qChoices .select-option input { display: none; }
    html.embed #qChoices .select-option span { font: inherit; color: inherit; }

    /* ── Embed : WIZARD SIGNUP aligné sur le même habillage que le quiz ──────
       Le lecteur enchaîne questions (widget) → inscription / connexion (ici) sans
       rupture : mêmes fonts (Kumbh Sans / Newsreader italique pour les
       « questions » du formulaire), mêmes formes (bordures #D9DCEC, focus
       accent, pills), même header (titre du test + eyebrow). La palette
       accent #5B65DE est déjà celle du wizard — on ne touche que typo/formes. */
    html.embed body { font-family: 'Kumbh Sans', ui-sans-serif, system-ui, -apple-system, sans-serif; }
    html.embed input, html.embed button, html.embed select, html.embed textarea { font-family: inherit; }

    html.embed #suCount {
        font-size: 13px; font-weight: 700; letter-spacing: .08em;
        text-transform: uppercase; color: #62688E;
        text-align: left; margin: 0 0 8px;
    }
    html.embed #state-signup .steps-wrapper { margin: 0 0 10px; }
    html.embed #state-signup .text-center-desktop { text-align: left !important; }
    html.embed #state-signup .main-heading-2 {
        font-family: 'Newsreader', Georgia, serif !important;
        font-style: italic; font-weight: 600;
        font-size: clamp(20px, 4.5vw, 27px) !important;
        line-height: 1.3 !important; color: #0E1338 !important;
        text-align: left !important; margin: 4px 0 10px !important;
    }
    /* Les labels sont les « questions » du formulaire → même voix serif
       italique que les questions du quiz, un cran plus petite. */
    html.embed #state-signup .identify-field label {
        font-family: 'Newsreader', Georgia, serif !important;
        font-style: italic; font-weight: 600;
        font-size: 21px !important; line-height: 1.3 !important;
        color: #0E1338 !important;
    }
    html.embed #state-signup .identify-field input {
        background: #fff !important;
        border: 1.5px solid #D9DCEC !important;
        border-radius: 12px !important;
        color: #141838 !important;
    }
    html.embed #state-signup .identify-field input:focus {
        border-color: #5B65DE !important;
        box-shadow: 0 0 0 3px #E8EAFB !important;
    }
    html.embed #state-signup .su-otp-cell {
        background: #fff !important;
        border: 1.5px solid #D9DCEC !important;
        border-radius: 12px !important;
        color: #0E1338 !important;
    }
    html.embed #state-signup .su-otp-cell:focus {
        border-color: #5B65DE !important;
        box-shadow: 0 0 0 3px #E8EAFB !important;
        outline: none;
    }
    html.embed #state-signup .su-sex-pill {
        background: #fff;
        border: 1.5px solid #D9DCEC;
        border-radius: 999px;
        color: #0E1338;
    }
    html.embed #state-signup .su-sex-pill:hover { border-color: #5B65DE; background: #E8EAFB; }
    html.embed #state-signup .su-sex-pill.on { background: #E8EAFB; }
    html.embed #state-signup .custom-btn { font-weight: 700; }
    html.embed #state-signup .identify-subtitle,
    html.embed #state-signup .su-hint,
    html.embed #state-signup .su-field-help,
    html.embed #state-signup .su-resend-row { color: #62688E !important; text-align: left !important; }
    html.embed #state-signup a { color: #5B65DE; }

/* 17/10/2026 (lot 8, CSP) : mise en forme du bloc « Voir les N questions du test » inséré par le pont de www
   (psy-annuaire, src/lib/test-bridge.js, ssrQuestionsHtml). Mêmes valeurs que ses anciens attributs style= : le bloc
   garde son rendu quand la CSP refuse les styles en ligne, et le pont peut cesser d'en poser. */
#ssrQuestions { margin: 18px 0 0; font-size: 15px; line-height: 1.5; }
#ssrQuestions > summary { cursor: pointer; font-weight: 600; }
#ssrQuestions > ol { margin: 12px 0 0; padding-left: 22px; }
#ssrQuestions > ol > li { margin: 0 0 10px; }
#ssrQuestions > ol > li > p { margin: 0 0 4px; }
#ssrQuestions > ol > li > ul { margin: 0; padding-left: 18px; color: #5c6486; }
