/* ============================================================
   SEMAINE CLASSIQUE — CSS GLOBAL NETTOYÉ
   ============================================================ */

/* ================================
   0. Titres & structure générale
   ================================ */

.bloc-title {
  font-size: clamp(1.6rem, 2vw, 1.9rem);
  font-weight: 700;
  margin: 2.5rem 0 0.75rem;
  letter-spacing: 0.02em;
  position: relative;
}

.bloc-title::after {
  content: "";
  display: block;
  width: 250px;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, #3b82f6, #22c55e);
  margin-top: 0.4rem;
}

.bloc-subtitle {
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  color: #2563eb;
  font-weight: 600;
}

.bloc-intro {
  margin-top: 0.5rem;
  color: #4b5563;
  font-size: 0.95rem;
  line-height: 1.6;
}
.semaine-programme ul.bloc-intro {
  padding-left: 1.2rem;
  margin-top: 0.6rem;
}

.semaine-programme ul.bloc-intro li {
  margin-bottom: 0.25rem;
}


/* ============================================================
   1. ONGLETS (Questions + Mini-exos)
   ============================================================ */

.semaine-classique .cours-tabs-row,
.semaine-classique .exo-tabs-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 0.5rem;
  margin-bottom: 0.8rem;
}

.semaine-classique .cours-tab,
.semaine-classique .exo-tab {
  flex: 1 1 0;
  min-width: 120px;
  padding: 0.7rem 1rem;
  border-radius: 999px;
  background: #f3f7ff;
  color: #2563eb;
  font-weight: 600;
  font-size: 0.95rem;
  border: 1px solid rgba(191, 219, 254, 0.9);
  cursor: pointer;
  text-align: center;
  transition:
    background 0.15s ease,
    color 0.15s ease,
    transform 0.08s ease,
    box-shadow 0.15s ease;
}

.semaine-classique .cours-tab:hover,
.semaine-classique .exo-tab:hover {
  background: #e0ecff;
  transform: translateY(-1px);
}

.semaine-classique .cours-tab.is-active,
.semaine-classique .exo-tab.is-active {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff !important;
  border-color: transparent;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.35);
  transform: translateY(-1px);
}


@media (max-width: 768px) {
  .cours-tabs-row,
  .exo-tabs-row {
    flex-direction: column;
  }
}
/* ============================================
   Mini-exos : détail "Voir un corrigé possible"
   ============================================ */

.semaine-classique .exo-corrige {
  margin-top: 1.4rem;
  text-align: center;              /* pour centrer le summary et le contenu */
}

/* 1. On enlève la flèche native */
.semaine-classique .exo-corrige > summary {
  list-style: none;                /* Firefox */
}

.semaine-classique .exo-corrige > summary::-webkit-details-marker {
  display: none;                   /* Chrome / Safari */
}

/* 2. Summary = bouton pilule centré */
.semaine-classique .exo-corrige > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 0.55rem 1.6rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.6);
  background: #ffffff;
  color: #111827;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.10);
  transition:
    background 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.08s ease;
}

/* Effet hover quand fermé */
.semaine-classique .exo-corrige > summary:hover {
  transform: translateY(-1px);
  box-shadow: 0 7px 16px rgba(15, 23, 42, 0.15);
}

/* 3. Quand le corrigé est ouvert : bouton bleu rempli */
.semaine-classique .exo-corrige[open] > summary {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.40);
}

/* 4. Le contenu du corrigé dans une petite carte */

.semaine-classique .exo-corrige > div {
  max-width: 650px;
  margin: 0.9rem auto 0;
  text-align: left;
  background: #f9fafb;
  border-radius: 14px;
  padding: 1rem 1.2rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  font-size: 0.95rem;
  line-height: 1.5;
}


/* ============================================================
   2. CARTES DE COURS (Questions de cours)
   ============================================================ */

.cours-card-wrapper .question-cours-card {
  max-width: 650px;
  margin: 1rem auto;
  background: #ffffff;
  border-radius: 16px;
  padding: 1.25rem 1.4rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
  display: none;
}

.cours-card-wrapper .question-cours-card.is-visible {
  display: block;
}

.cours-card-wrapper .question-cours-card h3 {
  margin: 0 0 0.6rem;
}

/* ============================================================
   3. CARTES MINI-EXOS
   ============================================================ */

.exo-card-wrapper .exo-court-card {
  max-width: 650px;
  margin: 1rem auto;
  background: #ffffff;
  border-radius: 16px;
  padding: 1.25rem 1.4rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
  display: none;
}

.exo-card-wrapper .exo-court-card.is-visible {
  display: block;
}

/* ============================================================
   6. Drag & Drop — Zone photo manuscrite
   ============================================================ */

.usc-dropzone {
  margin-top: 1rem;
  padding: 1rem 1.2rem;
  background: #f9fafb;
  border: 2px dashed rgba(148, 163, 184, 0.7);
  border-radius: 16px;
  text-align: center;
  color: #4b5563;
  font-size: 0.9rem;
  cursor: pointer;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.1s ease;
}

.usc-dropzone span {
  color: #2563eb;
}

.usc-dropzone:hover {
  background: #eef2ff;
  border-color: #2563eb;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.12);
}

.usc-dropzone.is-dragover {
  background: #dbeafe;
  border-color: #2563eb;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.25);
}

/* ============================================================
   7. Feedback IA (cours + exos + annales)
   ============================================================ */

.usc-feedback {
  margin-top: 1rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 12px;
  font-size: 0.95rem;
  border: 1px solid rgba(148, 163, 184, 0.3);
}

/* masquer quand c’est vide */
.annale-step-feedback:empty,
.usc-feedback:empty,
.coach-feedback:empty,
.exo-feedback:empty {
  display: none;
}

/* ré-afficher quand il y a du contenu */
.annale-step-feedback:not(:empty),
.usc-feedback:not(:empty),
.coach-feedback:not(:empty),
.exo-feedback:not(:empty) {
  display: block;
}

/* ============================================================
   8. Assistant annales – bloc global
   ============================================================ */

#annale-assistant {
  margin-top: 3rem;
  padding: 1.5rem 1.75rem;
  border-radius: 18px;
  background: linear-gradient(135deg, #f9fafb, #eff6ff);
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
}

#annale-assistant .annale-header {
  margin-bottom: 1rem;
}

#annale-assistant .bloc-title {
  margin-top: 0;
}

#annale-assistant .annale-meta {
  font-size: 0.9rem;
  color: #4b5563;
}

#annale-assistant .annale-meta span {
  font-weight: 500;
}

/* ============================================================
   8.1 Switch de mode (solo / coach)
   ============================================================ */

#annale-assistant .annale-mode-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  align-items: center;
  margin: 1.2rem 0 1.4rem;
}

#annale-assistant .annale-mode-btn {
  flex: 0 0 auto;
  min-width: 220px;
  max-width: 360px;
  padding: 0.55rem 1.2rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  font-size: 0.9rem;
  font-weight: 600;
  white-space: normal;
  text-align: center;
  background: #f3f7ff;
  color: #2563eb;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  transition:
    background 0.15s ease,
    color 0.15s ease,
    transform 0.08s ease,
    box-shadow 0.15s ease;
}

#annale-assistant .annale-mode-btn:hover:not(.is-active) {
  background: #e0ecff;
  transform: translateY(-1px);
}

#annale-assistant .annale-mode-btn.is-active {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff !important;
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.35);
}

@media (max-width: 640px) {
  #annale-assistant .annale-mode-switch {
    flex-direction: column;
  }
}

/* Conteneurs de mode */

.annale-mode {
  display: none;
  margin-top: 0.5rem;
}

.annale-mode.is-visible {
  display: block;
}

.annale-mode h3 {
  font-size: 1.1rem;
  margin-bottom: 0.75rem;
}

/* ============================================================
   8.2 Cartes sujet & étapes — annales
   ============================================================ */

.annale-enonce-solo,
.annale-full-subject-content,
.annale-step-card {
  max-width: 900px;
  margin: 0.5rem auto 1rem;
  background: #ffffff;
  border-radius: 16px;
  padding: 1.25rem 1.4rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

/* Limiter la hauteur du sujet + scroll interne */
.annale-enonce-solo,
.annale-full-subject-content {
  max-height: 420px;
  overflow: auto;
}

.annale-enonce-solo::-webkit-scrollbar,
.annale-full-subject-content::-webkit-scrollbar {
  width: 6px;
}

.annale-enonce-solo::-webkit-scrollbar-thumb,
.annale-full-subject-content::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.6);
}

.annale-enonce-solo::-webkit-scrollbar-track,
.annale-full-subject-content::-webkit-scrollbar-track {
  background: transparent;
}

/* Sujet complet dans mode coach */

.annale-full-subject {
  margin: 1rem 0 1.5rem;
}

.annale-full-subject summary {
  cursor: pointer;
  font-weight: 600;
  padding: 0.6rem 0;
}

.annale-full-subject-content {
  max-height: 260px;
  overflow-y: auto;
}

/* Corrigé global */

.annale-corrige-global {
  max-width: 900px;
  margin: 1rem auto;
}


/* 1. Cacher la petite flèche native */
.annale-corrige-global summary {
  list-style: none;              /* Firefox */
}

.annale-corrige-global summary::-webkit-details-marker {
  display: none;                 /* Chrome / Safari */
}

/* 2. Centrer le texte et personnaliser le style */
.annale-corrige-global summary {
  cursor: pointer;
  font-weight: 600;
  text-align: center;            /* Centrage */
  padding: 0.5em 1em;
}


.annale-corrige-global-content {
  margin-top: 0.75rem;
  background: #ffffff;
  border-radius: 14px;
  padding: 1rem 1.2rem;
  border: 1px solid rgba(148, 163, 184, 0.3);
}

.annale-corrige-global summary {
  position: relative;
  visibility: hidden;    /* on cache le texte réel */
  text-align: center;    /* centrage du contenu en flux normal */
  padding: 0.8em 1.5em;  /* ajuste comme tu veux */
}

/* texte quand la boîte est fermée */
.annale-corrige-global summary::before {
  content: "Voir le corrigé complet (à n’ouvrir qu’après avoir vraiment essayé 😊)";
  visibility: visible;   /* on ré-affiche le contenu généré */
  display: inline-block; /* permet le retour à la ligne propre */
  white-space: normal;   /* le texte peut passer à la ligne */
}

/* texte quand la boîte est ouverte */
.annale-corrige-global[open] summary::before {
  content: "Cacher le corrigé";
}



/* ============================================================
   8.3 Mode solo – zone question / réponse
   ============================================================ */

.annale-solo-actions {
  max-width: 820px;              /* même largeur que la carte finale */
  margin: 1.5rem auto 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.annale-solo-actions textarea {
  width: 100% !important;
  align-self: stretch;
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.6);
  font-size: 0.95rem;
  min-height: 120px;
  resize: vertical;
  margin-top: 0.9rem !important;
}

.annale-solo-actions textarea:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.3);
}

/* Bouton bleu "Demander de l’aide sur ce sujet" */
.annale-solo-actions .btn-ia-texte.usc-eval-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 260px;
  max-width: 420px;
  margin: 0.8rem auto 0;
  padding: 0.6rem 1.8rem;
  border-radius: 999px;
  border: none;
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff !important;
  font-weight: 600;
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.35);
  cursor: pointer;
}

.annale-solo-actions .btn-ia-texte.usc-eval-button:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.45);
}

.annale-solo-feedback {
  max-width: 780px;
  margin: 0.75rem auto 0;
}

/* ============================================================
   8.4 Mode coach – méta, carte & navigation
   ============================================================ */

/* Petite ligne de méta "Question 1 / 12 — Question 1.a" */
.annale-step-meta {
  max-width: 780px;
  margin: 0.5rem auto 0.7rem;
  font-size: 0.9rem;
  color: #4b5563;
}

.annale-step-meta span {
  font-weight: 600;
}

/* Carte d'étape (base) */
.annale-step-card {
  max-width: 900px;
  margin: 0.5rem auto 1rem;
  background: #ffffff;
  border-radius: 16px;
  padding: 1.25rem 1.4rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

/* Ligne des 2 boutons "Expliquer..." */
.annale-step-card .question-actions {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  align-items: center;
  margin: 0.4rem 0 0.6rem;
}

/* Boutons "Expliquer ma démarche…" (oral + écrit) */
.annale-step-card .question-actions .btn-ia-audio,
.annale-step-card .question-actions .btn-ia-texte {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 420px;
  padding: 0.5rem 1.6rem;
  font-size: 0.9rem;
  border-radius: 999px;
}

/* Zone texte juste en dessous */
.annale-step-text-zone {
  margin: 0.2rem 0 0;
}

.annale-step-text-zone textarea {
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.6);
  font-size: 0.95rem;
  min-height: 90px;
  resize: vertical;
}

.annale-step-text-zone textarea:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.3);
}

/* Bouton "💡 J’aimerais une indication" (coach) */
.annale-step-card .usc-hint-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 260px;
  max-width: 420px;
  margin: 0.6rem auto 0.2rem;
  padding: 0.5rem 1.6rem;
  border-radius: 999px;
  border: none;
  background: #f97316;
  color: #ffffff;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 6px 14px rgba(249, 115, 22, 0.35);
  transition:
    transform 0.1s ease,
    filter 0.15s ease,
    box-shadow 0.15s ease;
}

.annale-step-card .usc-hint-button:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 8px 18px rgba(249, 115, 22, 0.45);
}

/* Feedback IA de l’étape */
.annale-step-feedback {
  margin-top: 0.8rem;
}

/* Navigation entre questions */
.annale-step-nav {
  max-width: 520px;
  margin: 0.8rem auto 0;
  display: flex;
  justify-content: center;
  gap: 0.75rem;
}

.annale-step-nav button {
  flex: 1 1 0;
  max-width: 260px;
  padding: 0.5rem 0.8rem;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 600;
  background: #0f172a;
  color: #ffffff !important;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.4);
  transition:
    transform 0.1s ease,
    filter 0.15s ease,
    box-shadow 0.15s ease;
}

.annale-step-nav button *,
#annale-assistant .annale-step-nav button,
#annale-assistant .annale-step-nav button * {
  color: #ffffff !important;
}

.annale-step-nav button:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.55);
}

/* Version mobile : boutons l’un sous l’autre */
@media (max-width: 640px) {
  .annale-step-nav {
    flex-direction: column;
  }
}

/* ============================================================
   BOUTONS – BASE COMMUNE (cours + exos + annales)
   ============================================================ */

.semaine-classique .btn-ia-audio,
.semaine-classique .btn-ia-photo,
.semaine-classique .btn-mode-ecrit,
.semaine-classique .btn-mode-oral,
.semaine-classique .btn-ia-texte,
#annale-assistant .btn-ia-audio,
#annale-assistant .btn-ia-photo,
#annale-assistant .btn-ia-texte,
#annale-assistant .usc-hint-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 260px;
  padding: 0.6rem 1.8rem;
  border-radius: 999px;
  border: none;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    transform 0.1s ease,
    filter 0.15s ease,
    box-shadow 0.15s ease;
}

/* Couleur BLEUE (texte, photo, bouton aide, etc.) */
.semaine-classique .btn-mode-ecrit,
.semaine-classique .btn-ia-photo,
.semaine-classique .btn-ia-texte,
#annale-assistant .btn-ia-texte,
#annale-assistant .usc-hint-button,
.annale-solo-actions .btn-ia-texte.usc-eval-button {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff !important;
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.35);
}

/* Couleur VERTE (oral) */
.semaine-classique .btn-mode-oral,
.semaine-classique .btn-ia-audio,
#annale-assistant .btn-ia-audio {
  background: #22c55e;
  color: #ffffff !important;
  box-shadow: 0 6px 14px rgba(22, 163, 74, 0.35);
}

/* Effet hover commun */
.semaine-classique .btn-ia-audio:hover,
.semaine-classique .btn-ia-photo:hover,
.semaine-classique .btn-mode-ecrit:hover,
.semaine-classique .btn-mode-oral:hover,
.semaine-classique .btn-ia-texte:hover,
#annale-assistant .btn-ia-audio:hover,
#annale-assistant .btn-ia-photo:hover,
#annale-assistant .btn-ia-texte:hover,
#annale-assistant .usc-hint-button:hover,
.annale-solo-actions .btn-ia-texte.usc-eval-button:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.35);
}

/* ============================================================
   Cours + mini-exos : lignes de boutons
   ============================================================ */

.cours-card-modes,
.exo-card-wrapper .question-actions {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  align-items: center;
  margin: 0.8rem 0 0.6rem;
}

@media (min-width: 769px) {
  .cours-card-modes,
  .exo-card-wrapper .question-actions {
    flex-direction: row;
    justify-content: center;
  }
}

/* Cours & mini-exos : les deux gros boutons "Répondre…" */
.cours-card-modes .btn-mode-ecrit,
.cours-card-modes .btn-mode-oral,
.exo-card-wrapper .question-actions .btn-mode-ecrit,
.exo-card-wrapper .question-actions .btn-mode-oral {
  width: 100%;
  max-width: 420px;
}

/* Bouton texte "Évaluer ma réponse" dans cours / mini-exos */
.cours-card-wrapper .btn-ia-texte,
.exo-card-wrapper .btn-ia-texte {
  margin-top: 0.6rem;
}

/* ============================================================
   Hints globaux (Aide 1 / Aide 2…)
   ============================================================ */

.usc-hints-wrapper {
  max-width: 700px !important;
  margin: 1.4rem auto !important;
  padding: 10px 0 !important;
}

.usc-hint-line {
  margin-bottom: 0.9rem !important;
}

/* Bouton d’aide (pilule bleue) */
.usc-hint-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 220px !important;
  max-width: 260px !important;
  padding: 0.55rem 1.6rem !important;
  border: none !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #5cc4ff, #2563eb) !important;
  color: #ffffff !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.35) !important;
  transition:
    transform 0.1s ease,
    box-shadow 0.15s ease,
    filter 0.15s ease;
}

.usc-hint-button:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.05) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.45) !important;
}

/* Le texte du hint (quand affiché) */
.usc-hint-text {
  background: #f9fbff !important;
  border-radius: 8px !important;
  padding: 12px 18px !important;
  margin-left: 10px !important;
  margin-top: 5px !important;
  font-size: 17px !important;
  line-height: 1.5 !important;
  color: #333 !important;
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.06) !important;
}

/* ============================================================
   OVERRIDES ANNALe – LOOK FLUIDE & DYNAMIQUE
   ============================================================ */

/* Carte question un peu plus "app" */
#annale-assistant .annale-step-card {
  max-width: 900px;
  margin: 0.75rem auto 1.1rem;
  padding: 1.4rem 1.6rem;
  border-radius: 18px;
  background: radial-gradient(circle at top left, #eef5ff 0, #ffffff 40%, #f9fafb 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.12);
}

/* Énoncé un peu plus grand */
#annale-assistant .annale-step-enonce {
  font-size: 1rem;
  line-height: 1.65;
}

/* --------- Zone des 2 boutons principaux --------- */

#annale-assistant .annale-step-main-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  justify-content: center;
  margin: 2rem 0 0.8rem;
}

/* Bouton principal : assistant */
#annale-assistant .annale-step-main-actions .annale-chat-toggle {
  flex: 1 1 220px;
  max-width: 320px;
  width: auto !important;
  padding: 0.55rem 1.5rem;
  border-radius: 999px;
  border: none;
  background: linear-gradient(90deg, #60a5fa, #2563eb) !important;
  color: #ffffff !important;
  font-size: 0.95rem;
  font-weight: 600;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.4);
  cursor: pointer;
  transition:
    transform 0.1s ease,
    box-shadow 0.15s ease,
    filter 0.15s ease;
}

/* Bouton secondaire : indication, en outline */
#annale-assistant .annale-step-main-actions .usc-hint-request {
  flex: 1 1 220px;
  max-width: 280px;
  width: auto !important;
  padding: 0.52rem 1.4rem;
  border-radius: 999px;
  border: 1px solid #93c5fd !important;
  background: #ffffff !important;
  color: #2563eb !important;
  font-size: 0.93rem;
  font-weight: 600;
  box-shadow: 0 6px 14px rgba(148, 163, 184, 0.4);
  cursor: pointer;
  transition:
    transform 0.1s ease,
    box-shadow 0.15s ease,
    filter 0.15s ease;
}

/* Hover commun */
#annale-assistant .annale-step-main-actions .annale-chat-toggle:hover,
#annale-assistant .annale-step-main-actions .usc-hint-request:hover {
  transform: translateY(-1px);
  filter: brightness(1.03);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.4);
}

/* Mobile : l’un sous l’autre */
@media (max-width: 640px) {
  #annale-assistant .annale-step-main-actions {
    flex-direction: column;
    align-items: stretch;
  }

  #annale-assistant .annale-step-main-actions .annale-chat-toggle,
  #annale-assistant .annale-step-main-actions .usc-hint-request {
    max-width: 100%;
  }
}

/* --------- Chat assistant --------- */

#annale-assistant .annale-step-chat {
  margin-top: 0.6rem;
  padding-top: 0.7rem;
  border-top: 1px dashed rgba(148, 163, 184, 0.5);
}

/* --------- Zone photo : plus légère --------- */

#annale-assistant .annale-step-photo-zone {
  margin-top: 1.5rem;
}

/* "Soumettre ma réponse en photo" → lien bleu propre */
#annale-assistant .annale-step-photo-zone > .usc-eval-button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 0 0.35rem !important;
  min-width: 0 !important;
  box-shadow: none !important;
  font-size: 0.95rem;
  font-weight: 600;
  color: #2563eb !important;
  text-decoration: none !important;
  cursor: pointer;
}

#annale-assistant .annale-step-photo-zone > .usc-eval-button:hover {
  text-decoration: underline;
}

/* Dropzone plus compacte */
#annale-assistant .annale-step-photo-zone .usc-dropzone {
  max-width: 520px;
  margin: 0 auto 0.3rem;
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
}

/* --------- Chat : bouton Envoyer + micro --------- */

#annale-assistant .annale-step-chat-actions {
  display: flex;
  gap: 0.5rem;
  justify-content: flex-end;
  margin-top: 0.6rem;
}

#annale-assistant .annale-step-chat-send,
#annale-assistant .annale-step-chat-mic {
  border-radius: 999px;
  padding: 0.45rem 1.4rem;
  border: none;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.25);
  transition:
    transform 0.1s ease,
    box-shadow 0.15s ease,
    filter 0.15s ease;
}

#annale-assistant .annale-step-chat-send {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff !important;
}

#annale-assistant .annale-step-chat-mic {
  background: #22c55e;
  color: #ffffff !important;
}

#annale-assistant .annale-step-chat-send:hover,
#annale-assistant .annale-step-chat-mic:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.4);
}

#annale-assistant .annale-step-chat-mic.is-recording {
  background: #b91c1c !important;
  color: #ffffff !important;
}

/* ===== Annale – Mode solo : textarea pleine largeur + bouton dessous ===== */

.annale-solo-actions {
  max-width: 900px !important;        /* même largeur que la carte du sujet */
  width: 100% !important;
  margin: 1.4rem auto 0.9rem !important;

  display: block !important;          /* on désactive le flex */
}

/* Le label devient un bloc qui occupe toute la largeur */
.annale-solo-actions label {
  display: block !important;
  width: 100% !important;
}

/* Le textarea remplit le label */
.annale-solo-actions textarea {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-top: 0.7rem !important;      /* petit espace entre le texte et la zone */
}

/* Le bouton IA est en dessous, centré, pilule bleue comme avant */
.annale-solo-actions .btn-ia-texte.usc-eval-button {
  display: block !important;
  margin: 0.9rem auto 0 !important;
  min-width: 260px !important;
  max-width: 420px !important;
}

/* Même largeur pour sujet complet et question */
#annale-assistant .annale-enonce-solo,
#annale-assistant .annale-full-subject-content {
  max-width: 900px;
}

/* ============================================
   Carte "sujet complet" avec look type app
   (même style que la carte question)
   ============================================ */

#annale-assistant .annale-enonce-solo,
#annale-assistant .annale-full-subject-content {
  max-width: 900px;  /* ou 820px si tu préfères l’ancienne largeur */
  margin: 0.75rem auto 1.1rem;
  padding: 1.4rem 1.6rem;
  border-radius: 18px;

  background: radial-gradient(circle at top left,
    #eef5ff 0,
    #ffffff 40%,
    #f9fafb 100%) !important;

  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.12);
}
/* Carte sujet complet sans ombre */
#annale-assistant .annale-enonce-solo,
#annale-assistant .annale-full-subject-content {
  box-shadow: none !important;
}

/* ===== Centrage parfait du bouton Voir/Masquer ===== */

/* Le <details> occupe 100% */
#annale-assistant .annale-full-subject {
  width: 100%;
}

/* Conteneur <details> : même largeur que la carte sujet, centré */
#annale-assistant .annale-full-subject {
  max-width: 900px;          /* même largeur que la carte */
  margin: 1rem auto 1.5rem;  /* centré */
}

/* Summary = barre cliquable centrée, texte HTML masqué */
#annale-assistant .annale-full-subject > summary {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 100%;
  padding: 0.4rem 0;
  cursor: pointer;

  font-size: 0;              /* ⬅ on cache le texte réel ("📄 Voir le sujet complet") */
  list-style: none;          /* enlève le triangle natif */
}

/* Conteneur <details> : même largeur que la carte, centré */
#annale-assistant .annale-full-subject {
  max-width: 900px;            /* même largeur que la carte sujet */
  margin: 1rem auto 1.5rem;    /* centré */
}

/* Summary : barre cliquable centrée, texte HTML masqué */
#annale-assistant .annale-full-subject > summary {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 100%;
  padding: 0.8rem 0;           /* hauteur confortable */
  cursor: pointer;

  font-size: 0;                 /* ⬅ on cache le vrai texte du summary */
  list-style: none;             /* pas de petit triangle */
}

/* supprime le marqueur Chrome/Safari */
#annale-assistant .annale-full-subject > summary::-webkit-details-marker {
  display: none;
}

/* Texte visible quand FERMÉ */
#annale-assistant .annale-full-subject > summary::before {
  content: "Voir le sujet complet";
  font-size: 0.9rem;            /* texte affiché */
  font-weight: 650;
  color: #4b5563;
}

/* Texte visible quand OUVERT */
#annale-assistant .annale-full-subject[open] > summary::before {
  content: "Masquer le sujet complet";
}

/* Aligner la ligne "Question 1 / 12" avec la carte */

#annale-assistant .annale-step-meta {
  max-width: 880px !important;   /* même largeur que la carte */
  margin-left: auto !important;  /* centre */
  margin-right: auto !important; /* centre */
}

/* Espace sous les deux gros boutons du haut */
#annale-assistant .annale-step-main-actions {
  margin: 1.4rem 0 1.3rem !important;
}

/* Bloc texte + textarea : un peu plus d'air */
#annale-assistant .annale-step-text-zone {
  margin-top: 1rem !important;
  margin-bottom: 1.1rem !important;
}

/* Espace entre la phrase et la zone de saisie */
#annale-assistant .annale-step-text-zone textarea {
  margin-top: 0.7rem !important;
}

/* Ligne des 2 boutons "Résoudre…" / "J’aimerais…" */
#annale-assistant .annale-step-main-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.8rem;
}

#annale-assistant .annale-step-chat-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.8rem;
  margin-top: 0rem !important;   /* ← AVANT : 1.2rem */
}


/* Largeur commune pour les 4 boutons */
#annale-assistant .annale-step-main-actions .annale-chat-toggle,
#annale-assistant .annale-step-main-actions .usc-hint-request,
#annale-assistant .annale-step-chat-send,
#annale-assistant .annale-step-chat-mic {
  flex: 1 1 260px;              /* base 260px, extensible si besoin */
  max-width: 320px;             /* même max pour tous */
}

/* ==========================
   Chat annale – bulles IA / élève
   ========================== */

#annale-assistant .annale-step-chat-messages {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin-top: 0.8rem;
}

/* Wrapper d’un message (sert à l’alignement) */
#annale-assistant .annale-chat-msg-wrapper {
  display: flex;
  flex-direction: column;
  max-width: 80%;
}

/* Assistant à gauche */
#annale-assistant .annale-chat-msg-wrapper-assistant {
  align-self: flex-start;
}

/* Étudiant à droite */
#annale-assistant .annale-chat-msg-wrapper-user {
  align-self: flex-end;
}

/* Petit label au-dessus de la bulle */
#annale-assistant .annale-chat-msg-label {
  font-size: 0.75rem;
  margin-bottom: 0.15rem;
  opacity: 0.7;
}

/* Bulle de base */
#annale-assistant .annale-chat-msg {
  padding: 0.55rem 0.9rem;
  border-radius: 16px;
  font-size: 0.9rem;
  line-height: 1.4;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.15);
}

/* Bulle assistant (gauche, clair) */
#annale-assistant .annale-chat-msg-assistant {
  background: #f4f7ff;
  color: #111827;
}

/* Bulle étudiant (droite, sombre) */
#annale-assistant .annale-chat-msg-user {
  background: #111827;
  color: #ffffff;
}

/* ==========================
   Chat annale – espace & look zone de saisie
   ========================== */

/* 1) Plus d’espace entre les bulles et la zone de saisie */
#annale-assistant .annale-step-chat-messages {
  margin-top: 0.8rem;
  margin-bottom: 1.1rem;  /* ← espace au-dessus du bloc de saisie */
}

/* 2) Bloc de saisie = petite carte "fun" */
#annale-assistant .annale-step-chat-input {
  padding: 0.9rem 1rem;
  border-radius: 16px;
  background: radial-gradient(circle at top left,
    #eef5ff 0,
    #ffffff 45%,
    #f9fafb 100%);
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

/* 3) Textarea du chat : pilule bleue claire, un peu plus “app” */
#annale-assistant .annale-step-chat-text {
  width: 100%;
  box-sizing: border-box;
  border-radius: 12px;
  border: 1px solid #60a5fa;                 /* bleu clair */
  padding: 0.75rem 1rem;
  min-height: 90px;
  resize: vertical;
  font-size: 0.95rem;
  line-height: 1.4;
  background: #f9fbff;
  color: #111827;
}

/* Placeholder un peu plus doux */
#annale-assistant .annale-step-chat-text::placeholder {
  color: #9ca3af;
}

/* Focus propre */
#annale-assistant .annale-step-chat-text:focus {
  outline: none;
  border-color: #1d4ed8;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.35);
}


/* ===== HERO SEMAINE ===== */



/* Badge */
.semaine-badge {
  display: inline-block;
  padding: 0.3rem 0.75rem;
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 0.6rem;
}

/* Titre */
.semaine-title {
  font-size: clamp(2.1rem, 4vw, 2.9rem);
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 0.3rem;
}

/* Sous-titre */
.semaine-subtitle {
  font-size: 1.08rem;
  color: #475569;
  margin: 0 0 1.2rem;
}

/* Blocs méta en colonne */
.semaine-meta-vertical {
  margin-bottom: 1.2rem;
  line-height: 1.55;
}

.semaine-meta-vertical p {
  margin: 0.1rem 0;
  font-size: 0.96rem;
  color: #334155;
}

/* Objectif */
.semaine-objectif {
  font-size: 0.98rem;
  color: #374151;
}

/* Fix rendu mobile des deux gros boutons assistant / indication */
@media (max-width: 640px) {

  /* On centre les boutons, on ne les étire plus en pleine largeur */
  #annale-assistant .annale-step-main-actions {
    flex-direction: column;
    align-items: center;      /* au lieu de stretch */
    gap: 0.9rem;
  }

  #annale-assistant .annale-step-main-actions .annale-chat-toggle,
  #annale-assistant .annale-step-main-actions .usc-hint-request {
    width: auto !important;   /* pas 100% */
    max-width: 320px;         /* largeur confortable */
    padding: 0.7rem 1.6rem;   /* pilule, pas ballon 😄 */
    border-radius: 999px;
  }
}

.semaine-classique .usc-eval-button[data-mode="oral"].is-recording {
  background: #b91c1c !important;
  color: #ffffff !important;
  box-shadow: 0 6px 16px rgba(185, 28, 28, 0.5) !important;
}

.usc-weeks-search-wrapper {
  margin-top: 1.5rem;
  margin-bottom: 2rem;
}

.usc-weeks-search-wrapper span {
  display: block;
  font-size: 0.9rem;
  margin-bottom: 0.25rem;
  color: #4b5563;
}

.usc-weeks-search {
  width: 100%;
  padding: 0.75rem 1rem;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  font-size: 0.95rem;
  outline: none;
}

.usc-weeks-search:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.2);
}

/* Conteneur global pour les semaines */
.semaine-classique {
  max-width: 1100px;
  margin: 0 auto 4rem;
  padding: 0 1.5rem;
}

/* Contenu principal de la semaine */
.semaine-classique {
  padding-bottom: 4rem;
}

/* ===== HERO "Une semaine, un classique" ===== */

/* Conteneur global de la semaine (page) */
.usc-semaine-wrapper {
  max-width: 1200px;
  margin: 0 auto 4rem;
  padding: 0 24px;
}

/* Carte hero principale */
.semaine-hero {
  max-width: 1160px;                             /* largeur alignée avec le reste */
  margin: 2rem auto 3rem;                        /* centrée + espace au-dessus et dessous */
  padding: 1rem 3rem 2.75rem;
  border-radius: 32px;
  background: radial-gradient(circle at top left,
    #e0f2fe 0,
    #f9fafb 45%,
    #eef2ff 100%);
  box-shadow: 0 40px 80px rgba(16, 56, 120, 0.10);
}

/* Contenu interne du hero : simple wrapper, pas une deuxième carte */
.semaine-hero-inner {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
}


/* =========================================
   Taille un peu plus petite dans les zones
   à forte densité de maths (énoncés/corrigés)
   ========================================= */

/* a) Enoncés / corrigés des annales */
.annale-enonce-solo,
.annale-full-subject-content,
.annale-step-enonce,
.annale-step-corrige-content {
  font-size: 0.92rem;   /* un peu plus compact */
  line-height: 1.65;
}

/* b) Questions de cours + mini-exos (texte mathématique) */
.cours-card-wrapper .question-cours-card .question-texte,
.exo-card-wrapper .exo-court-card .exo-enonce {
  font-size: 0.92rem;
  line-height: 1.65;
}

/* Taille un peu réduite dans toutes les zones "maths" */
mjx-container[jax="CHTML"] {
  font-size: 0.9em !important;
}

/* Encore un peu plus compact dans les zones très denses */
.annale-enonce-solo mjx-container,
.annale-full-subject-content mjx-container,
.annale-step-card mjx-container,
.cours-card-wrapper mjx-container,
.exo-card-wrapper mjx-container {
  font-size: 0.85em !important;
}



/* ============================================
   Annales : "Voir le corrigé de la question"
   ============================================ */

#annale-assistant .annale-step-corrige {
  margin-top: 1.4rem;
  text-align: center;
}

/* 1) on enlève la flèche native */
#annale-assistant .annale-step-corrige > summary {
  list-style: none;
}

#annale-assistant .annale-step-corrige > summary::-webkit-details-marker {
  display: none;
}

/* 2) summary = bouton pilule centré */
#annale-assistant .annale-step-corrige > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 0.55rem 1.6rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.6);
  background: #ffffff;
  color: #111827;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.10);
  transition:
    background 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.08s ease;
}

/* hover quand fermé */
#annale-assistant .annale-step-corrige > summary:hover {
  transform: translateY(-1px);
  box-shadow: 0 7px 16px rgba(15, 23, 42, 0.15);
}

/* 3) quand ouvert : bouton bleu rempli */
#annale-assistant .annale-step-corrige[open] > summary {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.40);
}

/* 4) contenu du corrigé = petite carte */
#annale-assistant .annale-step-corrige > .annale-step-corrige-content {
  max-width: 900px;
  margin: 0.9rem auto 0;
  text-align: left;
  background: #f9fafb;
  border-radius: 14px;
  padding: 1rem 1.2rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
  font-size: 0.95rem;
  line-height: 1.5;
}
/* ============================================
   Annales : "Voir le corrigé complet"
   ============================================ */

#annale-assistant .annale-corrige-global {
  max-width: 900px;
  margin: 1.6rem auto 0;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

/* 1) enlever la flèche native + annuler le hack précédent */
#annale-assistant .annale-corrige-global > summary {
  list-style: none;
  visibility: visible;      /* on annule l'ancien visibility:hidden */
  position: static;
  font-size: 0.95rem;
}

#annale-assistant .annale-corrige-global > summary::-webkit-details-marker {
  display: none;
}

/* 2) summary = bouton pilule centré */
#annale-assistant .annale-corrige-global > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 0.55rem 1.8rem;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.6);
  background: #ffffff;
  color: #111827;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.10);
  transition:
    background 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.08s ease;
}

/* hover quand fermé */
#annale-assistant .annale-corrige-global > summary:hover {
  transform: translateY(-1px);
  box-shadow: 0 7px 16px rgba(15, 23, 42, 0.15);
}

/* 3) quand ouvert : bouton bleu rempli */
#annale-assistant .annale-corrige-global[open] > summary {
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.40);
}

/* 4) contenu = grande carte sous le bouton */
#annale-assistant .annale-corrige-global > .annale-corrige-global-content {
  max-width: 900px;
  margin: 1rem auto 0;
  text-align: left;
  background: #ffffff;
  border-radius: 14px;
  padding: 1.1rem 1.3rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
  font-size: 0.95rem;
  line-height: 1.55;
}


/* ============
   Wrapper global
   ============ */

/* garde ce bloc, mais allège vraiment le padding */
.usc-weeks-home {
  max-width: 1200px;
  margin: 0 auto 3rem;
  padding: 0.5rem 24px 3rem;   /* ← top 0.5rem au lieu de 2rem */
}

/* ===== HERO "Une semaine, un classique" ===== */

/* Carte hero principale */
.semaine-hero {
  max-width: 1160px;
  margin: 0.5rem auto 2rem;    /* ← au lieu de 2rem auto 3rem */
  padding: 1.8rem 3rem 2.4rem; /* tu peux ajuster un peu si tu veux encore moins haut */
}


/* Hero déjà utilisé sur les pages semaine individuelles ;
   on garde le même style, juste légère adaptation mobile si besoin */

.semaine-hero-inner {
  max-width: 1000px;
  margin: 0 auto;
}

/* ============
   Bloc liste semaines
   ============ */

.usc-weeks-index-block {
  margin-top: 3rem;
}

/* largeur un peu plus étroite que le hero */
.usc-weeks-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem 0;
}

/* ============================================================
   PAGE D'ACCUEIL "UNE SEMAINE, UN CLASSIQUE"
   – Conteneur + liste des semaines
   ============================================================ */
 

/* Bloc "Toutes les semaines disponibles" un peu plus étroit
   que le hero du haut */
.usc-weeks-home .usc-weeks-index-block {
  margin-top: 3rem;
}

.usc-weeks-home .usc-weeks-inner {
  max-width: 1100px;      /* plus étroit que la carte hero (1160px) */
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* Titre + zone de recherche */
.usc-weeks-home .usc-weeks-index-header {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.usc-weeks-home .usc-weeks-index-header h2 {
  font-size: 1.45rem;
  font-weight: 600;
  margin: 0;
}

.usc-weeks-home .usc-weeks-search-wrapper label span {
  display: block;
  font-size: 0.9rem;
  color: #6b7280;
  margin-bottom: 0.35rem;
}

.usc-weeks-home .usc-weeks-search {
  width: 100%;
  padding: 0.7rem 0.9rem;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  font-size: 0.95rem;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.usc-weeks-home .usc-weeks-search:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

/* Grille verticale des semaines */
.usc-weeks-home .usc-weeks-grid {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

/* Carte d’une semaine */
.usc-weeks-home .usc-week-card {
  background: rgba(0, 80, 160, 0.03);        /* léger bleu permanent */
  border-radius: 18px;
  padding: 1.25rem 1.5rem;
  border: 1px solid rgba(0, 80, 160, 0.08);  /* bord légèrement bleuté */
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06);
}


/* Titre dans la carte */
.usc-weeks-home .usc-week-title {
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 0.4rem;
}

.usc-weeks-home .usc-week-title a {
  color: #0f172a;
  text-decoration: none;
}

.usc-weeks-home .usc-week-title a:hover {
  text-decoration: underline;
}

/* Ligne méta (ID, thème, niveau, difficulté) */
.usc-weeks-home .usc-week-meta {
  font-size: 0.9rem;
  color: #6b7280;
  margin: 0 0 0.5rem;
}

.usc-weeks-home .usc-week-meta span {
  white-space: nowrap;
}

/* Objectif + mots-clés */
.usc-weeks-home .usc-week-skills,
.usc-weeks-home .usc-week-tags {
  font-size: 0.95rem;
  line-height: 1.4;
  margin: 0.25rem 0;
}

.usc-weeks-home .usc-week-skills strong,
.usc-weeks-home .usc-week-tags strong {
  font-weight: 600;
  color: #111827;
}

/* Avertissement si page non reliée */
.usc-weeks-home .usc-week-warning {
  font-size: 0.85rem;
  color: #9ca3af;
  margin-top: 0.4rem;
}

/* Dernier paragraphe sans marge inutile */
.usc-weeks-home .usc-week-card p:last-child {
  margin-bottom: 0;
}

/* Responsive : un peu moins de padding sur mobile */
@media (max-width: 768px) {
  .usc-weeks-home .usc-weeks-inner {
    padding: 0 1rem;
  }

  .usc-weeks-home .usc-week-card {
    padding: 1.1rem 1.2rem;
  }
}

.usc-main-cta-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}


.usc-main-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.8rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #5cc4ff, #2563eb);
  color: #ffffff !important;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(37, 99, 235, 0.35);
  transition:
    transform 0.1s ease,
    box-shadow 0.15s ease,
    filter 0.15s ease;
}

.usc-main-cta:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 14px 32px rgba(37, 99, 235, 0.45);
}

/* Lien englobant la carte */
.usc-week-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* Effet hover sur toute la carte si cliquable */
.usc-week-card.has-link {
  transition: transform 0.12s ease, box-shadow 0.15s ease;
}

.usc-week-card.has-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px rgba(15, 23, 42, 0.10);
}

.usc-week-card.has-link {
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.15s ease;
}

.usc-week-card.has-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px rgba(15, 23, 42, 0.10);
}


/* --- Cartes "Une semaine, un classique" --- */

/* État normal — fond léger */
.usc-week-card {
  background: rgba(0, 80, 160, 0.03); /* bleu très subtil */
  border-radius: 14px;
  padding: 20px;
  transition: all 0.25s ease;
  cursor: pointer;
  border: 1px solid rgba(0, 80, 160, 0.08);
}

/* Hover — plus de contraste + shadow */
.usc-week-card.has-link:hover {
  background: rgba(0, 120, 200, 0.12); /* bleu clair visible */
  transform: translateY(-3px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
  border-color: rgba(0, 120, 200, 0.25);
}

/* Petit accent sur le titre */
.usc-week-card h3,
.usc-week-card p {
  transition: color 0.25s ease;
}

.usc-week-card.has-link:hover h3 {
  color: #007adc;
}

/* ===== Style premium façon HERO ===== */
/* ===== Style premium façon HERO ===== */

.usc-week-card {
  background: radial-gradient(circle at top left,
    #e0f2fe 0%,      /* bleu très doux */
    #f8fbff 45%,     /* blanc bleuté */
    #eef2ff 100%     /* violet très clair */
  );
  border-radius: 22px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  padding: 22px 26px;
  box-shadow: 0 30px 60px rgba(16, 56, 120, 0.10);
  transition: transform 0.20s ease, box-shadow 0.25s ease, background 0.25s ease;
}

/* Hover façon HERO */
.usc-week-card.has-link:hover {
  background: radial-gradient(circle at top left,
    #d7ecff 0%,
    #f3f7ff 45%,
    #e3e8ff 100%
  );
  transform: translateY(-4px);
  box-shadow: 0 40px 80px rgba(16, 56, 120, 0.15);
  border-color: rgba(120, 160, 255, 0.35);
}

/* Titre coloré légèrement au hover */
.usc-week-card.has-link:hover h3 {
  color: #1d4ed8; /* bleu hero */
}

/* Bouton "Voir le corrigé complet" du mode solo */
.annale-corrige-global summary {
  position: relative;            /* on enlève tout sticky/fixed éventuel */
  display: inline-block;
  margin: 2rem auto 0;
  padding: 0.9rem 2.4rem;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.04);
  box-shadow: 0 12px 40px rgba(15, 76, 129, 0.12);
  cursor: pointer;
  text-align: center;
  list-style: none;              /* enlève le petit triangle natif */
}

/* Cache le marqueur natif sur WebKit */
.annale-corrige-global summary::-webkit-details-marker {
  display: none;
}

/* Désactive tout pseudo-bouton global qui duplique le texte */
.annale-corrige-global summary::before,
.annale-corrige-global summary::after {
  content: none !important;
  display: none !important;
}



.question-cours-card .question-texte,
.exo-court-card .exo-enonce {
  margin-top: clamp(1rem, 2vw, 2rem);
}

.question-cours-card,
exo-court-card {
  padding-top: 1.2rem; /* ou 2rem si tu veux vraiment aérer */
}

/* 1) Cible large : tous les conteneurs MathJax, quelle que soit la techno */
mjx-container,
.MathJax,
.MathJax_SVG {
  font-size: 0.85em !important;   /* à ajuster entre 0.75 et 0.9 */
}

/* 2) Dans les zones d’énoncés/corrigés très denses, encore un peu plus petit */
.annale-enonce-solo mjx-container,
.annale-full-subject-content mjx-container,
.annale-step-card mjx-container,
.cours-card-wrapper mjx-container,
.exo-card-wrapper mjx-container {
  font-size: 0.85em !important;
}

/* ===== Paywall USC — Annales (locked) ===== */

.annale-assistant--locked .annale-mode-btn.is-locked{
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(0.2);
}

.usc-locked-box{
  max-width: 640px;
  margin: 1.2rem auto 0;
  padding: 1.2rem 1.4rem;
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid rgba(148,163,184,0.35);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
  text-align: center;
}

.usc-locked-title{ margin: 0 0 0.4rem; }
.usc-locked-text{ margin: 0 0 0.9rem; color:#334155; }

.usc-locked-actions{
  display:flex;
  gap:0.7rem;
  justify-content:center;
  flex-wrap:wrap;
  margin:0;
}

.usc-locked-btn,
.usc-locked-btn:visited{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0.5rem 1.1rem;
  border-radius:999px;
  background:#2563eb;
  color:#fff !important;
  text-decoration:none !important;
  font-size:0.9rem;
  font-weight:600;
  border:1px solid #1d4ed8;
}

.usc-locked-btn:hover{ background:#1d4ed8; }

.usc-locked-btn--ghost,
.usc-locked-btn--ghost:visited{
  background:transparent;
  color:#2563eb !important;
  border-color:#c7d2fe;
}

.usc-locked-btn--ghost:hover{
  background:#eef2ff;
}

/* ===== Paywall USC — Annales (modal) ===== */

.annale-assistant--locked .annale-mode-btn.is-locked{
  opacity: 0.7;
  cursor: pointer; /* cliquable */
  filter: grayscale(0.15);
}

.usc-paywall{
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  z-index: 9999;
}

.usc-paywall[hidden]{ display:none !important; }

.usc-paywall__box{
  background: #ffffff;
  border-radius: 20px;
  padding: 1.8rem 2.1rem;
  max-width: 520px;
  width: calc(100% - 2rem);
  text-align: center;
  border: 1px solid rgba(148,163,184,0.35);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.35);
  animation: uscPaywallPop 0.25s ease-out;
}

@keyframes uscPaywallPop{
  from{ transform: translateY(8px) scale(0.98); opacity:0; }
  to{ transform: translateY(0) scale(1); opacity:1; }
}

.usc-paywall__title{ font-size: 1.15rem; margin: 0 0 0.6rem; color:#0f172a; }
.usc-paywall__text{ font-size: 0.95rem; line-height: 1.55; color:#334155; margin: 0 0 1.2rem; }

.usc-paywall__actions{
  display:flex;
  gap:0.7rem;
  justify-content:center;
  flex-wrap:wrap;
  margin:0;
}

.usc-paywall__btn,
.usc-paywall__btn:visited{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0.5rem 1.1rem;
  border-radius:999px;
  background:#2563eb;
  color:#fff !important;
  text-decoration:none !important;
  font-size:0.9rem;
  font-weight:600;
  border:1px solid #1d4ed8;
}

.usc-paywall__btn:hover{ background:#1d4ed8; }

.usc-paywall__btn--ghost,
.usc-paywall__btn--ghost:visited{
  background:transparent;
  color:#2563eb !important;
  border-color:#c7d2fe;
}

.usc-paywall__btn--ghost:hover{
  background:#eef2ff;
}

/* FIX : les boutons locked doivent rester cliquables */
.annale-assistant--locked .annale-mode-btn.is-locked{
  pointer-events: auto !important;
}

/* --- Bloc Année / Option / Difficulté : compact seulement ENTRE eux --- */

/* espace normal AVANT "Année" */
.usc-week-card .usc-week-meta {
  margin: 0.55rem 0 0;   /* top | sides | bottom */
}

/* espace réduit ENTRE Année -> Option -> Difficulté */
.usc-week-card .usc-week-meta + .usc-week-meta {
  margin-top: 0.18rem;
}

/* espace normal APRÈS "Difficulté" (avant Objectif) */
.usc-week-card .usc-week-meta + .usc-week-skills {
  margin-top: 0.55rem;
}


/* Resserrement UNIQUEMENT entre les lignes meta consécutives */
.usc-week-card .usc-week-meta + .usc-week-meta {
  margin-top: 0.2em;
}
/* Espace au-dessus du texte d’intro SEO */
.usc-intro-seo {
  margin-top: 1.8rem;   /* ajuste : 1.5rem / 2rem / 2.2rem */
}