/* ==========================================================================
   SpeakPro Academy — espaces d'apprentissage (Classic, Practice, Premium)
   Pages : classic-dashboard, practice-dashboard, premium-dashboard,
   premium-module, classic-apercu, classic-module, test-debutant-resume,
   classic-/practice-/premium-paiement, offres.
   Présentation uniquement (classe body.sp-app) : les identifiants, les
   données et les parcours ne changent pas.
   ========================================================================== */
body.sp-app{
  --ap-ivory:#FBF8F3; --ap-paper:#F4EEE6; --ap-line:#E5DBCF; --ap-line-2:#EFE7DC;
  --ap-ink:#1E2430; --ap-ink-2:#4A505B; --ap-mute:#6B707A; --ap-copper:#A9552F; --ap-copper-2:#8E4626;
  --blue:#A9552F; --blue-dark:#8E4626;
  background:var(--ap-ivory) !important; color:var(--ap-ink);
}

/* --- Bandeaux de titre --- */
body.sp-app .px-hero{
  background:var(--ap-paper) !important; color:var(--ap-ink) !important; text-align:left !important;
  border-radius:0 !important; box-shadow:none !important; border-bottom:1px solid var(--ap-line);
  padding:44px 24px 36px !important;
}
body.sp-app .px-hero > *{ max-width:880px; margin-left:auto !important; margin-right:auto !important; }
body.sp-app .px-hero .px-badge{
  display:flex; align-items:center; gap:12px; background:none !important; border:0 !important; padding:0 !important; border-radius:0;
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ap-copper) !important; margin-bottom:12px;
}
body.sp-app .px-hero .px-badge::before{ content:""; width:28px; height:1.5px; background:var(--ap-copper); }
body.sp-app .px-hero h1, body.sp-app .cx-header h1, body.sp-app .ap-header h1{
  font-family:var(--display-serif); font-weight:500 !important; letter-spacing:-.02em; color:var(--ap-ink) !important;
  font-size:clamp(30px,4.4vw,46px) !important; line-height:1.06; margin:0 0 10px !important;
}
body.sp-app .px-hero p, body.sp-app .cx-header p, body.sp-app .ap-header p{ color:var(--ap-ink-2) !important; font-size:15.5px !important; }
body.sp-app .px-hero a, body.sp-app .cx-header a{ color:var(--ap-copper) !important; font-weight:600; font-size:14px !important; }
body.sp-app .cx-header, body.sp-app .ap-header{ text-align:left !important; padding:8px 0 22px; border-bottom:1px solid var(--ap-line); margin-bottom:26px !important; }

/* --- Conteneurs --- */
body.sp-app .cx-wrap, body.sp-app .px-wrap, body.sp-app .ap-wrap{ max-width:880px; padding-top:32px; }
body.sp-app .cm-wrap, body.sp-app .tb-wrap{ max-width:720px; padding-top:32px; }

/* --- Cartes --- */
body.sp-app .cx-section, body.sp-app .ap-section, body.sp-app .cm-card, body.sp-app .tb-card, body.sp-app .cp-card{
  background:#fff; border:1px solid var(--ap-line); border-radius:20px; box-shadow:none; padding:24px;
}
body.sp-app .cx-section h2, body.sp-app .ap-section h2, body.sp-app .cm-card h2{
  font-family:var(--display-serif); font-weight:500; font-size:23px; letter-spacing:-.01em; color:var(--ap-ink);
}
body.sp-app .cx-progress-label{ color:var(--ap-mute); }
body.sp-app .cx-bar{ background:var(--ap-line-2); }
body.sp-app .cx-bar-fill{ background:var(--ap-copper) !important; }

/* --- Bandeaux d'information (anciens fonds pastel) --- */
body.sp-app .cx-locked-banner,
body.sp-app #cx-diagnosed-level-banner, body.sp-app #cx-confirm-acquis-banner, body.sp-app #cx-skip-to-intermediate-banner,
body.sp-app #cx-coaching-unlock{
  background:var(--ap-paper) !important; border:0 !important; border-left:2px solid var(--ap-copper) !important; border-radius:0 14px 14px 0 !important;
  color:var(--ap-ink-2) !important; text-align:left !important; font-size:14.5px;
}
body.sp-app [id$="-banner"] a, body.sp-app .cx-locked-banner a{ color:var(--ap-copper) !important; }

/* Carte « coaching » de Practice : encre profonde au lieu du dégradé orange */
body.sp-app .px-coaching-card{ background:var(--ap-ink) !important; box-shadow:none !important; border-radius:20px; }
body.sp-app .px-coaching-card h2{ font-family:var(--display-serif); font-weight:500; font-size:23px; }
body.sp-app .px-coaching-card p{ color:#D7D2CB !important; }
body.sp-app .px-coaching-card .btn{ background:var(--ap-copper) !important; color:#fff !important; box-shadow:none; }
body.sp-app #cx-premium-upsell{ background:#fff !important; border:1px solid var(--ap-line) !important; color:var(--ap-ink) !important; }
body.sp-app #cx-premium-upsell *{ color:var(--ap-ink-2) !important; }
body.sp-app #cx-premium-upsell a{ color:var(--ap-copper) !important; }

/* --- Modules premium / test débutant : options de réponse --- */
body.sp-app .cm-back, body.sp-app .tb-wrap > a:first-child{ color:var(--ap-copper) !important; font-weight:600; font-size:14px !important; }
body.sp-app .cm-opt, body.sp-app .tb-opt{ border-color:var(--ap-line) !important; border-radius:12px; }
body.sp-app .cm-opt:hover, body.sp-app .tb-opt:hover{ border-color:#CDBFAE !important; }
body.sp-app .cm-opt.selected, body.sp-app .tb-opt.selected{ border-color:var(--ap-copper) !important; background:#FBF4EE !important; }
body.sp-app .cm-pdf-btn{ background:var(--ap-paper); border-radius:999px; }
body.sp-app .cm-explain, body.sp-app .tb-explain{ background:var(--ap-paper); }
body.sp-app .cm-result-score, body.sp-app .tb-result-score{ font-family:var(--display-serif); font-weight:600; color:var(--ap-ink); }

/* --- Paiement Classic / Practice / Premium --- */
body.sp-app .cp-wrap{ padding-top:56px; }
body.sp-app .cp-card{ padding:34px 30px; text-align:left; }
body.sp-app .cp-card h1{ font-family:var(--display-serif); font-weight:500; font-size:32px; color:var(--ap-ink); }
body.sp-app .cp-price{ font-family:var(--display-serif); font-weight:600; color:var(--ap-ink); }
body.sp-app .cp-btn-secondary{ border-radius:999px; border-color:#CDBFAE; color:var(--ap-ink); }

/* --- Aperçu Classic : barre d'achat au-dessus de la barre d'onglets mobile --- */
body.sp-app .ap-cta-bar{ border-top:1px solid var(--ap-line); box-shadow:none; background:rgba(255,255,255,.97); z-index:240; }
@media (max-width:860px){ body.sp-app .ap-cta-bar{ bottom:calc(64px + env(safe-area-inset-bottom, 0px)); } }

/* --- Offres : la vidéo d'ouverture ne s'affiche que si elle se charge --- */
body.sp-app .of-wrap{ padding-top:48px; }

@media (max-width:640px){
  body.sp-app .px-hero{ padding:30px 16px 26px !important; }
  body.sp-app .cx-section, body.sp-app .ap-section, body.sp-app .cm-card, body.sp-app .tb-card, body.sp-app .cp-card{ padding:20px 18px; border-radius:18px; }
}