/* ============================================================================
   03-excel-ai-analysis.css
   PAGE RÉSULTAT QUIZ — bloc #excel-ai-analysis injecté par JS
   À coller dans : /wp-content/themes/infinite-child/css/quiz_ai/03-excel-ai-analysis.css
   ============================================================================ */

/* === Reset du conteneur === */
#excel-ai-analysis{
  margin:0 !important;
  padding:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  text-align:left !important;
}
#excel-ai-analysis *{text-align:left !important}

/* ========== 1. HERO RESULT (jauge + statut + résumé) ========== */
.ai-hero{
  padding:36px 36px 28px !important;
  border-bottom:1px solid #dde4df !important;
  background:
    radial-gradient(700px 240px at 90% 0%, rgba(184, 84, 63, .08), transparent 60%),
    linear-gradient(to bottom, #ffffff, #fbfdfb) !important;
  display:grid !important;
  grid-template-columns: auto 1fr !important;
  gap:32px !important;
  align-items:center !important;
}
body[data-scenario="pass"] .ai-hero{
  background:
    radial-gradient(700px 240px at 90% 0%, rgba(16, 124, 65, .1), transparent 60%),
    linear-gradient(to bottom, #ffffff, #f4f9f6) !important;
}
@media (max-width:680px){
  .ai-hero{grid-template-columns:1fr !important; padding:28px 22px !important; gap:20px !important; justify-items:center !important}
  .ai-hero *{text-align:center !important}
}
.ai-gauge{position:relative; width:172px; height:172px}
.ai-gauge svg{transform:rotate(-90deg); display:block}
.ai-gauge .track{fill:none; stroke:#e6ede9; stroke-width:14}
.ai-gauge .fill{
  fill:none; stroke:#b8543f; stroke-width:14; stroke-linecap:round;
  stroke-dasharray: 502; stroke-dashoffset: 401;
  transition:stroke-dashoffset .8s ease, stroke .3s;
}
.ai-gauge.pass .fill{stroke:#107C41}
.ai-gauge.warn .fill{stroke:#b07a1f}
.ai-gauge .center{position:absolute; inset:0; display:grid; place-items:center; text-align:center !important}
.ai-gauge .center *{text-align:center !important}
.ai-gauge .score{
  font-family:'Fraunces', serif !important;
  font-size:54px !important; line-height:1 !important; font-weight:600 !important;
  color:#0e1814 !important; letter-spacing:-.02em !important;
  margin:0 !important;
}
.ai-gauge .score .denom{font-size:22px; color:#677571; font-weight:500}
.ai-gauge .pct{
  margin-top:4px !important;
  font-family:'JetBrains Mono', monospace !important;
  font-size:11px !important; color:#677571 !important;
  letter-spacing:.08em !important; text-transform:uppercase !important;
}

.ai-status{
  display:inline-flex !important;
  align-items:center; gap:8px;
  background:#fbe6df; color:#7a3727;
  padding:6px 12px; border-radius:999px;
  font-size:12px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase;
  margin:0 !important;
}
.ai-status.pass{background:#dceee3; color:#0b5a2f}
.ai-status.warn{background:#fbeec8; color:#7a571a}
.ai-status .ai-dot{width:6px; height:6px; border-radius:50%; background:currentColor}

.ai-headline{
  font-family:'Fraunces', serif !important;
  font-size:clamp(26px,2.6vw,34px) !important;
  font-weight:600 !important; line-height:1.1 !important;
  color:#0e1814 !important;
  margin:12px 0 6px !important;
  text-wrap:balance;
}
.ai-subhead{
  color:#36443e !important; font-size:15.5px !important; line-height:1.5 !important;
  max-width:48ch; margin:0 !important;
}
.ai-subhead b, .ai-subhead strong{font-weight:600; color:#0e1814}
.ai-target{
  margin-top:14px !important;
  display:inline-flex; align-items:center; gap:10px;
  font-size:13px; color:#677571;
  padding:7px 12px;
  background:#fff; border:1px solid #dde4df;
  border-radius:8px;
}
.ai-target b{color:#0e1814; font-weight:600}

/* ========== 2. SECTIONS GÉNÉRIQUES ========== */
.ai-section{
  padding:30px 36px !important;
  background:#fff !important;
  border-bottom:1px solid #dde4df !important;
  margin:0 !important;
}
.ai-section.tinted{
  background:linear-gradient(135deg, #f0f8f3 0%, #e8f3ed 100%) !important;
}
@media (max-width:680px){.ai-section{padding:24px 22px !important}}

.ai-section-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  margin-bottom:14px; flex-wrap:wrap;
}
.ai-section-head h3{
  font-family:'Fraunces', serif !important;
  font-size:20px !important; font-weight:600 !important; color:#0e1814 !important;
  margin:0 !important;
  padding:0 !important;
}
.ai-badge-premium{
  display:inline-flex !important; align-items:center; gap:6px;
  font-family:'JetBrains Mono', monospace !important;
  font-size:10px !important; font-weight:600 !important; letter-spacing:.08em !important;
  text-transform:uppercase !important;
  background:linear-gradient(135deg, #f1d997 0%, #e9b863 100%) !important;
  color:#5e4310 !important;
  padding:4px 9px !important; border-radius:6px !important;
  margin:0 !important;
}

/* ========== ANALYSE IA ========== */
.ai-analysis{
  display:grid !important;
  grid-template-columns: auto 1fr !important;
  gap:22px !important;
}
@media (max-width:680px){.ai-analysis{gap:14px !important}}
.ai-ai-icon{
  width:44px; height:44px;
  background:#107C41; color:#fff;
  border-radius:12px;
  display:grid; place-items:center;
  font-family:'JetBrains Mono', monospace;
  font-size:13px; font-weight:700;
  box-shadow:0 4px 12px -3px rgba(16,124,65,.4);
  position:relative;
}
.ai-ai-icon::after{
  content:""; position:absolute; inset:-3px;
  border-radius:14px; border:1.5px solid #107C41;
  opacity:.25;
}
.ai-analysis-label{
  font-size:11px !important; font-weight:600 !important; letter-spacing:.1em !important;
  text-transform:uppercase !important; color:#0b5a2f !important;
  margin:0 0 4px !important;
}
.ai-analysis-body{font-size:14.5px !important; line-height:1.6 !important; color:#36443e !important}
.ai-analysis-body p{margin:0 0 10px !important; padding:0 !important}
.ai-analysis-body p:last-child{margin-bottom:0 !important}
.ai-analysis-body b, .ai-analysis-body strong{color:#0e1814; font-weight:600}
.ai-analysis-body ul{margin:6px 0 10px !important; padding:0 !important; list-style:none !important}
.ai-analysis-body ul li{
  padding:8px 12px !important; margin:0 0 6px !important;
  background:rgba(255,255,255,.6);
  border-left:2px solid #107C41;
  border-radius:0 8px 8px 0;
  font-size:14px;
}
.ai-analysis-body ul li b{display:block; margin-bottom:2px}

.ai-disclaimer{
  margin-top:12px !important;
  font-size:11.5px; color:#677571;
  display:flex; align-items:center; gap:8px;
  font-style:italic;
}
.ai-disclaimer .by{
  font-style:normal; font-family:'JetBrains Mono', monospace; font-weight:600;
  color:#36443e;
}

/* ========== REPLAY DES RÉPONSES (premium) ========== */
.ai-review-list{display:flex; flex-direction:column; gap:8px; margin-top:14px !important}
.ai-q{
  border:1px solid #dde4df;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  margin:0 !important;
}
.ai-q[open]{border-color:#dceee3}
.ai-q summary{
  list-style:none; cursor:pointer;
  padding:14px 18px;
  display:grid; grid-template-columns: auto 1fr auto; gap:14px;
  align-items:center;
}
.ai-q summary::-webkit-details-marker{display:none}
.ai-q .qnum{
  width:30px; height:30px; border-radius:8px;
  background:#eef6f1; color:#0b5a2f;
  display:grid; place-items:center;
  font-family:'JetBrains Mono', monospace; font-size:12px; font-weight:700;
}
.ai-q.ko .qnum{background:#fbe6df; color:#7a3727}
.ai-q .qtxt{font-size:14.5px; color:#0e1814; font-weight:500; line-height:1.4}
.ai-q .qtag{
  font-family:'JetBrains Mono', monospace;
  font-size:10.5px; font-weight:600; letter-spacing:.06em;
  text-transform:uppercase;
  padding:4px 9px; border-radius:6px;
  background:#eef6f1; color:#0b5a2f;
  white-space:nowrap;
}
.ai-q.ko .qtag{background:#fbe6df; color:#7a3727}
.ai-q .qbody{padding:0 18px 18px; border-top:1px dashed #dde4df; margin-top:0}
.ai-q .qrow{
  display:flex; gap:10px; align-items:flex-start;
  padding:12px 0; border-bottom:1px dashed #dde4df;
  font-size:14px;
}
.ai-q .qrow:last-child{border-bottom:none}
.ai-q .qrow .qlbl{
  font-family:'JetBrains Mono', monospace;
  font-size:10.5px; font-weight:600;
  color:#677571; text-transform:uppercase; letter-spacing:.06em;
  min-width:88px; padding-top:3px;
}
.ai-q .qrow.user .qval{color:#b8543f; font-weight:500}
.ai-q .qrow.ok .qval{color:#0b5a2f; font-weight:600}
.ai-q .qrow.expl .qval{color:#36443e; line-height:1.55}
.ai-q .qrow.expl .qval a{
  color:#0b5a2f; font-weight:600; text-decoration:underline; text-underline-offset:3px;
}

/* ========== COURS RECOMMANDÉS / QUIZ SUIVANT ========== */
.ai-section.alt{background:#fbfdfb !important}
.ai-courses{
  display:grid !important; gap:12px !important;
  margin-top:14px !important;
}
.ai-courses[data-count="3"]{grid-template-columns:1fr 1fr 1fr}
.ai-courses[data-count="2"]{grid-template-columns:1fr 1fr; max-width:760px}
.ai-courses[data-count="1"]{grid-template-columns:1fr; max-width:520px}
@media (max-width:780px){.ai-courses{grid-template-columns:1fr !important}}
.ai-course{
  display:block !important;
  padding:18px !important;
  background:#fbfdfb;
  border:1px solid #dde4df;
  border-radius:12px;
  transition:transform .15s, box-shadow .15s, border-color .15s;
  color:inherit !important;
  margin:0 !important;
  text-decoration:none;
}
.ai-course:hover{
  transform:translateY(-2px);
  border-color:#107C41;
  box-shadow:0 12px 24px -12px rgba(11,90,47,.18);
  background:#fff;
}
.ai-course-kicker{
  display:inline-flex; align-items:center; gap:6px;
  font-family:'JetBrains Mono', monospace;
  font-size:10.5px; font-weight:600;
  letter-spacing:.08em; text-transform:uppercase;
  color:#0b5a2f;
  margin:0 0 10px !important;
}
.ai-course-kicker::before{content:""; width:14px; height:1.5px; background:#107C41}
.ai-course-title{
  font-family:'Fraunces', serif !important;
  font-size:17px !important; font-weight:600 !important; color:#0e1814 !important;
  line-height:1.2; margin:0 0 6px !important;
}
.ai-course-desc{
  font-size:13px !important; color:#677571 !important;
  line-height:1.5; margin:0 !important;
}
.ai-course-foot{
  margin-top:14px !important; padding-top:12px;
  border-top:1px dashed #dde4df;
  display:flex; justify-content:space-between; align-items:center;
  font-size:12px;
}
.ai-course-foot .meta{color:#677571}
.ai-course-foot .meta b{color:#36443e; font-weight:600}
.ai-course-foot .go{color:#0b5a2f; font-weight:600}

.ai-next{
  background:linear-gradient(135deg, #eaf5ee 0%, #dceee3 100%) !important;
  border:1px solid #dceee3;
  border-radius:14px;
  padding:22px 26px !important;
  display:grid !important;
  grid-template-columns: auto 1fr auto !important;
  gap:22px !important; align-items:center !important;
  margin-top:14px !important;
}
@media (max-width:680px){
  .ai-next{grid-template-columns:1fr !important; padding:20px !important; gap:14px !important}
  .ai-next *{text-align:center !important}
}
.ai-next-ic{
  width:56px; height:56px; border-radius:14px;
  background:#107C41; color:#fff;
  display:grid; place-items:center;
  font-family:'Fraunces', serif; font-size:24px;
  box-shadow:0 6px 18px -4px rgba(11,90,47,.35);
}
.ai-next-label{
  font-family:'JetBrains Mono', monospace !important;
  font-size:10.5px !important; font-weight:600 !important; letter-spacing:.08em !important;
  text-transform:uppercase !important; color:#0b5a2f !important;
  margin:0 0 4px !important;
}
.ai-next h4{
  font-family:'Fraunces', serif !important;
  font-size:21px !important; color:#0e1814 !important; font-weight:600 !important;
  margin:0 0 6px !important;
}
.ai-next p{color:#36443e !important; font-size:13.5px !important; margin:0 !important; line-height:1.5 !important}
.ai-next .ai-cta{
  background:#107C41; color:#fff !important;
  padding:13px 22px; border-radius:10px;
  font-weight:600; font-size:14px;
  display:inline-flex; align-items:center; gap:8px;
  white-space:nowrap;
  text-decoration:none;
}
.ai-next .ai-cta:hover{background:#0b5a2f}

/* ========== UPSELL PREMIUM (gratuit) ========== */
.ai-upsell-wrap{padding:0; margin:0;}
.ai-upsell{
  background:linear-gradient(135deg, #fff8e7 0%, #fbeec8 100%) !important;
  border:1px solid #efd58a;
  border-radius:14px;
  padding:22px 26px !important;
  display:grid !important;
  grid-template-columns: auto 1fr auto !important;
  gap:20px !important; align-items:center !important;
  margin:24px 36px !important;
}
@media (max-width:680px){
  .ai-upsell{grid-template-columns:1fr !important; padding:20px !important; margin:22px !important; gap:14px !important}
  .ai-upsell *{text-align:center !important}
}
.ai-upsell-ic{
  width:52px; height:52px; border-radius:14px;
  background:#fff; border:1px solid #efd58a;
  display:grid; place-items:center; font-size:24px;
}
.ai-upsell h4{
  font-family:'Fraunces', serif !important;
  font-size:19px !important; color:#5e4310 !important; font-weight:600 !important;
  margin:0 0 4px !important;
}
.ai-upsell p{color:#7a5a1f !important; font-size:13.5px !important; margin:0 !important; line-height:1.5 !important}
.ai-upsell .ai-cta-dark{
  background:#5e4310; color:#fff !important;
  padding:13px 22px; border-radius:10px;
  font-weight:600; font-size:14px;
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  text-decoration:none;
}
.ai-upsell .ai-cta-dark:hover{background:#7a571a}
.ai-upsell .ai-cta-dark b{color:#f1d997; font-weight:600}

/* ========== ÉCHELLE DE SCORE ========== */
.ai-scale-track{
  position:relative;
  margin:22px 0 8px;
  height:14px;
  border-radius:999px;
  background:linear-gradient(to right,
    #e9b8a8 0%, #e9b8a8 40%,
    #f1d997 40%, #f1d997 70%,
    #a7d4b3 70%, #a7d4b3 100%
  );
  border:1px solid #dde4df;
}
.ai-scale-marker{
  position:absolute; top:50%; left:20%;
  width:24px; height:24px;
  transform:translate(-50%, -50%);
  background:#0e1814; color:#fff;
  border-radius:50%;
  display:grid; place-items:center;
  font-family:'JetBrains Mono', monospace;
  font-size:10px; font-weight:700;
  border:3px solid #fff;
  box-shadow:0 4px 10px -2px rgba(0,0,0,.25);
  transition:left .4s ease;
}
.ai-scale-marker .ai-scale-lbl{
  position:absolute; top:-44px; left:50%;
  transform:translateX(-50%);
  background:#0e1814; color:#fff;
  padding:3px 8px; border-radius:6px;
  font-size:11px; font-weight:600;
  white-space:nowrap;
  font-family:'Inter', sans-serif;
  letter-spacing:0;
}
.ai-scale-marker .ai-scale-lbl::after{
  content:""; position:absolute;
  bottom:-5px; left:50%; transform:translateX(-50%);
  width:0; height:0;
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:5px solid #0e1814;
}
.ai-scale-ticks{
  display:grid;
  grid-template-columns:40% 30% 30%;
  font-size:12.5px;
  margin-top:14px;
}
.ai-scale-ticks > div{
  border-top:1px solid #dde4df;
  padding:10px 12px 0;
  display:flex; flex-direction:column; gap:2px;
}
.ai-scale-ticks .ai-zone-label{
  font-family:'JetBrains Mono', monospace;
  font-size:11px; font-weight:600; color:#36443e;
  letter-spacing:.04em;
}
.ai-scale-ticks .ai-zone-desc{color:#677571; font-size:12.5px; line-height:1.4}
.ai-scale-ticks .current{position:relative}
.ai-scale-ticks .current .ai-zone-label{color:#b8543f}
.ai-scale-ticks .current::before{
  content:""; position:absolute; top:-1px; left:0; right:0;
  height:2px; background:#b8543f;
}
body[data-scenario="pass"] .ai-scale-ticks .current .ai-zone-label{color:#0b5a2f}
body[data-scenario="pass"] .ai-scale-ticks .current::before{background:#107C41}

/* ========== ORDRE D'AFFICHAGE ========== */
.ays_quiz_results_page{display:flex !important; flex-direction:column}
#excel-ai-analysis{display:contents !important}
.ai-hero                      { order:1 }
.ai-section#echelle           { order:2 }
.ays_quiz_results_page > h2   { order:3 }
.ays_result_by_cats           { order:4 }
.ai-section.tinted            { order:5 }
.ai-upsell-wrap               { order:6 }
.ai-section#replay            { order:7 }
.ai-section.alt#cours         { order:8 }
.ays_score_message            { order:90 }
.ays_message                  { order:91 }
.ays_score                    { order:92 }
.ays_average                  { order:93 }
.ays-quiz-social-shares       { order:94 }
.ays_restart_button_p         { order:95 }

/* ========== SCÉNARIO switching ========== */
body[data-scenario="pass"] .scenario-fail{display:none !important}
body:not([data-scenario="pass"]) .scenario-pass{display:none !important}
.ai-courses[data-count="1"] [data-slot="2"],
.ai-courses[data-count="1"] [data-slot="3"],
.ai-courses[data-count="2"] [data-slot="3"]{display:none !important}

/* ========== VISIBILITÉ FREE / PREMIUM ========== */
body[data-tier="free"]    .premium-only{display:none !important}
body[data-tier="premium"] .free-only{display:none !important}