/* ====================================================================
   IVANN BREATHING FIX #41 — Espacement + barre allégée
   Cible le bar gradient de slideshow qui touchait le contenu.
   ==================================================================== */

/* ============================================================
   1. SLIDESHOW INDICATOR : plus de respiration
   ============================================================ */

html body.izi-game .ivann-slideshow__indicator {
  margin: 0 auto 40px !important;  /* 40px en bas au lieu de 32 */
  padding: 14px 22px !important;
}

/* Sur la slide elle-même, padding-top pour espacer du indicator sticky */
html body.izi-game .ivann-slide {
  padding-top: 8px !important;
}

/* Premier h2 d'une slide (le titre de la quête) : margin-top respiré */
html body.izi-game .ivann-slide > h2:first-child {
  margin-top: 8px !important;
  margin-bottom: 24px !important;
}

/* Premier paragraphe (lead) : margin-bottom plus généreux */
html body.izi-game .ivann-slide > h2:first-child + p,
html body.izi-game .ivann-slide > p:first-child,
html body.izi-game .ivann-slide > h2 + p {
  margin-bottom: 28px !important;
  padding-top: 8px !important;
}

/* ============================================================
   2. PROGRESS BAR : plus subtile, moins épaisse
   ============================================================ */

html body.izi-game .ivann-slideshow__progress {
  height: 2px !important;  /* 2px au lieu de 3-4 */
  background: rgba(255, 255, 255, 0.04) !important;
  margin-left: 12px !important;
}

html body.izi-game .ivann-slideshow__progress-fill {
  background: linear-gradient(90deg, rgba(0, 225, 255, 0.6), rgba(168, 85, 247, 0.6)) !important;
  box-shadow: none !important;
}

/* Retire le dot lumineux à l'extrémité (trop bling) */
html body.izi-game .ivann-slideshow__progress-fill::after {
  display: none !important;
}

/* ============================================================
   3. TOP READING-TIME PROGRESS BAR (de #20 quest progression)
   La barre 3px fixe en haut de page. La rendre subtle.
   ============================================================ */

html body.izi-game #ivann-quest-progress {
  height: 2px !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

html body.izi-game #ivann-quest-progress .ivann-quest-progress__fill {
  background: linear-gradient(90deg, rgba(0, 225, 255, 0.5), rgba(79, 124, 255, 0.5), rgba(168, 85, 247, 0.5)) !important;
  box-shadow: none !important;
}

/* ============================================================
   4. SPACING général dans le slideshow content
   ============================================================ */

/* Entre h2 et paragraphes : aération */
html body.izi-game-course .field--name-body h2 + p,
html body.izi-game-course .block-field-blocknodecoursbody h2 + p,
html body.izi-game-course .field--name-field-ivann-contenu-du-cours h2 + p {
  margin-top: 24px !important;
}

/* Entre paragraphes consécutifs */
html body.izi-game-course .ivann-slide > p {
  margin-bottom: 1.1rem !important;
  line-height: 1.7 !important;
}

/* Entre le contenu et le mini-défi */
html body.izi-game-course .ivann-slide > .ivann-mini-exercise {
  margin-top: 32px !important;
}

/* Entre le mini-défi et la nav (continuer →) */
html body.izi-game-course .ivann-slide__nav {
  margin-top: 56px !important;
  padding-top: 36px !important;
}

/* ============================================================
   5. PARCOURS PROGRESS (la card en haut "Parcours d'apprentissage")
   Plus d'espace au-dessous
   ============================================================ */

html body.izi-game-course .parcours-progress {
  margin-bottom: 32px !important;
}

/* ============================================================
   6. CARDS CONTENU COURS : breathing autour
   ============================================================ */

html body.izi-game-course .ivann-course-page,
html body.izi-game-course .node--view-mode-full {
  padding: 32px !important;
}

@media (min-width: 1024px) {
  html body.izi-game-course .ivann-course-page,
  html body.izi-game-course .node--view-mode-full {
    padding: 40px !important;
  }
}

/* === QUÊTE WIDGET COMPACT (drupal-claude-agent fix) === */
html body.izi-game .ivann-slideshow__indicator {
  width: fit-content !important;
  max-width: 100% !important;
  padding: 8px 16px !important;
  gap: 10px !important;
  border-radius: 12px !important;
  margin: 0 auto 32px !important;
}

html body.izi-game .ivann-slideshow__step-label {
  font-size: 0.68rem !important;
  letter-spacing: 0.18em !important;
  color: rgba(255, 255, 255, 0.45) !important;
}

html body.izi-game .ivann-slideshow__step-num {
  font-size: 1rem !important;
  font-weight: 800 !important;
}

html body.izi-game .ivann-slideshow__step-sep,
html body.izi-game .ivann-slideshow__step-total {
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.55) !important;
}

/* Barre proportionnee : largeur fixe au lieu de flex:1 qui etire a l'infini */
html body.izi-game .ivann-slideshow__progress {
  flex: 0 0 100px !important;
  width: 100px !important;
  height: 2px !important;
  margin-left: 14px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: 999px !important;
}

html body.izi-game .ivann-slideshow__progress-fill {
  background: linear-gradient(90deg, #00e1ff, #4f7cff) !important;
  box-shadow: none !important;
}