/* ═══════════════════════════════════════════════════════════════
   FranceConcours — Dashboard CCC (#screen-home)
   Lot additif : surcharge mockup/landing sans retirer l’historique.
   Charger après fc-app-shell.css
   ═══════════════════════════════════════════════════════════════ */

#screen-home {
  --fc-dash-ink: var(--fc-ink, #111831);
  --fc-dash-muted: var(--fc-text-sub, #68718b);
  --fc-dash-paper: var(--fc-bg, #f8f8f5);
  --fc-dash-surface: var(--fc-surface, #ffffff);
  --fc-dash-surface-2: var(--fc-bg-secondary, #f0f1f8);
  --fc-dash-indigo: var(--fc-indigo, #5556d9);
  --fc-dash-indigo-dark: var(--fc-indigo-dark, #3c3fb5);
  --fc-dash-indigo-soft: var(--fc-indigo-soft, #eeefff);
  --fc-dash-gold: var(--fc-gold, #c9a96b);
  --fc-dash-line: var(--fc-line, #e5e7ef);
  --fc-dash-shadow-soft: var(--fc-shadow-soft, 0 12px 34px rgba(22, 29, 63, 0.07));
  --fc-dash-shadow-card: var(--fc-shadow-card, 0 24px 70px rgba(22, 29, 63, 0.1));
  --fc-dash-radius-card: 17px;
  --fc-dash-radius-btn: 12px;
  max-width: 1180px;
  padding: clamp(24px, 4vw, 44px) clamp(20px, 4vw, 40px) 72px;
}

/* ── Hub d’orientation ── */
#screen-home.dash-hub-mode {
  background:
    radial-gradient(ellipse 85% 55% at 50% 0%, rgba(85, 86, 217, 0.08), transparent 62%),
    var(--fc-dash-paper);
}

#screen-home .dash-hub-atmosphere-wash {
  background:
    radial-gradient(ellipse 70% 55% at 50% 18%, rgba(85, 86, 217, 0.12), transparent 68%),
    radial-gradient(ellipse 45% 40% at 8% 88%, rgba(17, 24, 49, 0.04), transparent 70%),
    radial-gradient(ellipse 40% 35% at 92% 78%, rgba(201, 169, 107, 0.08), transparent 72%) !important;
}

#screen-home .dash-hub-inner {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-card);
  box-shadow: var(--fc-dash-shadow-soft);
}

#screen-home .dash-hub-brand {
  color: var(--fc-dash-muted);
  letter-spacing: 0.13em;
}

#screen-home .dash-hub-title {
  font-family: 'Sora', 'Plus Jakarta Sans', sans-serif;
  font-weight: 750;
  letter-spacing: -0.04em;
  color: var(--fc-dash-ink);
}

#screen-home .dash-hub-sub {
  color: var(--fc-dash-muted);
  line-height: 1.55;
}

#screen-home .dash-hub-continue {
  border: 1px solid rgba(85, 86, 217, 0.35);
  background: linear-gradient(145deg, rgba(238, 239, 255, 0.95), rgba(255, 255, 255, 0.9));
  border-radius: var(--fc-dash-radius-btn);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

#screen-home .dash-hub-continue:hover {
  background: linear-gradient(145deg, #eeefff, #ffffff) !important;
  border-color: var(--fc-dash-indigo);
  box-shadow: 0 9px 22px rgba(85, 86, 217, 0.18);
  transform: translateY(-1px);
}

#screen-home .dash-hub-continue-kicker {
  color: var(--fc-dash-indigo);
  letter-spacing: 0.1em;
}

#screen-home .dash-hub-tile {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-btn);
  background: var(--fc-dash-surface);
  box-shadow: 0 2px 10px rgba(22, 29, 63, 0.04);
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

#screen-home .dash-hub-tile:hover {
  border-color: rgba(85, 86, 217, 0.45);
  background: var(--fc-dash-indigo-soft);
  box-shadow: var(--fc-dash-shadow-soft);
}

#screen-home .dash-hub-tile-lbl {
  font-weight: 700;
  color: var(--fc-dash-ink);
}

#screen-home .dash-hub-skip {
  color: var(--fc-dash-muted);
  border-radius: var(--fc-dash-radius-btn);
  font-weight: 650;
}

#screen-home .dash-hub-skip:hover {
  background: var(--fc-dash-surface-2);
  color: var(--fc-dash-indigo);
}

#screen-home .dash-hub-reopen {
  border: 1px dashed rgba(85, 86, 217, 0.35);
  border-radius: var(--fc-dash-radius-btn);
  color: var(--fc-dash-indigo);
  font-weight: 650;
  background: rgba(255, 255, 255, 0.7);
}

#screen-home .dash-hub-reopen:hover {
  border-color: var(--fc-dash-indigo);
  background: var(--fc-dash-indigo-soft);
}

/* ── En-tête desktop ── */
#screen-home .welcome-bar {
  margin-bottom: 32px;
  gap: 20px;
}

#screen-home .welcome-title {
  font-family: 'Sora', 'Plus Jakarta Sans', sans-serif;
  font-weight: 750;
  letter-spacing: -0.04em;
  color: var(--fc-dash-ink);
  font-size: clamp(26px, 3.2vw, 36px);
}

#screen-home .welcome-sub {
  color: var(--fc-dash-muted);
  font-size: 15px;
  line-height: 1.6;
}

#screen-home .session-chip {
  background: var(--fc-dash-surface);
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-btn);
  color: var(--fc-dash-muted);
}

#screen-home .session-chip strong {
  color: var(--fc-dash-indigo);
}

/* ── Reprise (priorité visuelle) ── */
#screen-home .continue-banner {
  margin-bottom: 40px !important;
  padding: clamp(28px, 4vw, 40px) !important;
  background: var(--fc-dash-surface) !important;
  border: 1px solid var(--fc-dash-line) !important;
  border-radius: var(--fc-dash-radius-card) !important;
  box-shadow: var(--fc-dash-shadow-soft) !important;
  gap: clamp(24px, 4vw, 48px) !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important;
}

#screen-home .continue-banner::before {
  width: 5px !important;
  background: linear-gradient(180deg, var(--fc-dash-gold), var(--fc-dash-indigo)) !important;
}

#screen-home .continue-banner:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(85, 86, 217, 0.28) !important;
  box-shadow: var(--fc-dash-shadow-card) !important;
}

#screen-home .continue-kicker {
  color: var(--fc-dash-indigo);
}

#screen-home .continue-kicker .continue-dot {
  background: var(--fc-dash-gold);
  box-shadow: 0 0 0 4px rgba(201, 169, 107, 0.14);
}

#screen-home .continue-info p {
  color: var(--fc-dash-ink);
}

#screen-home .continue-info small,
#screen-home .continue-info span {
  color: var(--fc-dash-muted);
}

#screen-home .continue-progress-track {
  background: var(--fc-dash-surface-2);
}

#screen-home .continue-progress-fill {
  background: var(--fc-dash-indigo);
}

#screen-home .btn-resume-sm {
  background: var(--fc-dash-indigo) !important;
  border-radius: var(--fc-dash-radius-btn) !important;
  box-shadow: 0 9px 22px rgba(85, 86, 217, 0.22);
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

#screen-home .btn-resume-sm:hover {
  background: var(--fc-dash-indigo-dark) !important;
}

/* ── Pilotage (prep-pilot) ── */
#screen-home .prep-pilot {
  margin-bottom: 32px;
  padding: 20px 22px;
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-card);
  background: var(--fc-dash-surface);
  box-shadow: var(--fc-dash-shadow-soft);
}

#screen-home .prep-pilot-kicker {
  color: var(--fc-dash-indigo);
}

#screen-home .prep-pilot-title {
  font-family: 'Sora', 'Plus Jakarta Sans', sans-serif;
  font-weight: 750;
  letter-spacing: -0.03em;
  color: var(--fc-dash-ink);
}

#screen-home .prep-pilot-reason {
  color: var(--fc-dash-muted);
}

#screen-home .prep-pilot-cta,
#screen-home .prep-coach-ask {
  background: var(--fc-dash-indigo) !important;
  border-radius: var(--fc-dash-radius-btn);
  box-shadow: 0 9px 22px rgba(85, 86, 217, 0.22);
}

#screen-home .prep-pilot-cta:hover,
#screen-home .prep-coach-ask:hover {
  background: var(--fc-dash-indigo-dark) !important;
}

#screen-home .prep-pilot-min.is-primary {
  background: var(--fc-dash-indigo-soft);
  border-color: rgba(85, 86, 217, 0.35);
  color: var(--fc-dash-indigo-dark);
}

#screen-home .prep-coach {
  border-top-color: var(--fc-dash-line);
}

#screen-home .prep-coach-chip:hover,
#screen-home .prep-coach-chip:focus-visible {
  border-color: var(--fc-dash-indigo);
  color: var(--fc-dash-indigo);
}

#screen-home .prep-coach-action {
  border-color: rgba(85, 86, 217, 0.35);
  background: var(--fc-dash-indigo-soft);
  color: var(--fc-dash-indigo-dark);
}

/* ── Progression globale ── */
#screen-home .progress-overview {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-card);
  background: var(--fc-dash-surface);
  box-shadow: var(--fc-dash-shadow-soft);
  margin-bottom: 28px;
  padding: 20px 24px;
}

#screen-home .progress-overview-pct {
  color: var(--fc-dash-indigo);
}

#screen-home .progress-overview-kicker {
  color: var(--fc-dash-muted);
}

#screen-home .progress-overview-track {
  background: var(--fc-dash-surface-2);
}

#screen-home .progress-overview-fill {
  background: linear-gradient(90deg, var(--fc-dash-indigo), #6768e7);
}

#screen-home .progress-chip--on {
  color: var(--fc-dash-indigo-dark);
  background: var(--fc-dash-indigo-soft);
  border-color: rgba(85, 86, 217, 0.25);
}

/* ── Bandeau épreuves ── */
#screen-home .epreuves-head-title {
  color: var(--fc-dash-muted);
  letter-spacing: 0.08em;
}

#screen-home .epreuve-chip {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-btn);
  background: var(--fc-dash-surface);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

#screen-home .epreuve-chip:hover {
  border-color: rgba(85, 86, 217, 0.4);
  background: var(--fc-dash-indigo-soft);
}

#screen-home .epreuve-chip-name {
  color: var(--fc-dash-ink);
}

#screen-home .epreuve-chip[data-status="progress"] .epreuve-chip-status {
  color: var(--fc-dash-indigo);
}

/* ── Sections & titres ── */
#screen-home .sec-title {
  font-family: 'Sora', 'Plus Jakarta Sans', sans-serif;
  font-weight: 730;
  letter-spacing: -0.02em;
  color: var(--fc-dash-ink);
  font-size: 19px;
}

#screen-home .dashboard-section {
  margin-bottom: 48px;
}

#screen-home .dashboard-learning-grid {
  gap: 32px;
}

/* ── Matières (rail + modules) ── */
#screen-home .lr-btn {
  border-color: var(--fc-dash-line);
  background: var(--fc-dash-surface);
}

#screen-home .lr-btn:hover {
  border-color: var(--fc-dash-indigo);
  color: var(--fc-dash-indigo);
}

#screen-home .lr-card {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-btn);
  background: var(--fc-dash-surface);
  box-shadow: 0 2px 8px rgba(22, 29, 63, 0.04);
}

#screen-home .lr-card:hover {
  border-color: rgba(85, 86, 217, 0.4);
  background: var(--fc-dash-surface);
  box-shadow: var(--fc-dash-shadow-soft);
}

#screen-home .lr-card.is-active {
  border-color: var(--fc-dash-indigo);
  box-shadow: 0 0 0 1px rgba(85, 86, 217, 0.35);
  background: var(--fc-dash-indigo-soft);
}

#screen-home .lr-card.is-active .lr-card-icon {
  background: rgba(85, 86, 217, 0.12);
}

#screen-home .lr-card-bar > span {
  background: var(--fc-dash-indigo);
}

#screen-home .module-card {
  border: 1px solid var(--fc-dash-line) !important;
  border-radius: var(--fc-dash-radius-btn) !important;
  background: var(--fc-dash-surface) !important;
  box-shadow: 0 2px 10px rgba(22, 29, 63, 0.04) !important;
  padding: 16px 18px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

#screen-home .module-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(85, 86, 217, 0.35) !important;
  background: var(--fc-dash-surface) !important;
  box-shadow: var(--fc-dash-shadow-soft) !important;
}

#screen-home .mc-icon {
  background: var(--fc-dash-indigo-soft) !important;
  border-radius: 11px !important;
}

#screen-home .mc-num {
  color: var(--fc-dash-indigo);
}

#screen-home .mc-name {
  color: var(--fc-dash-ink);
  font-weight: 700;
}

#screen-home .mc-description {
  color: var(--fc-dash-muted);
}

#screen-home .mc-bar {
  background: var(--fc-dash-surface-2);
}

#screen-home .module-card-arrow {
  color: var(--fc-dash-indigo);
}

/* ── Panneau S’entraîner (.tc) ── */
#screen-home .training-panel {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-card);
  background: var(--fc-dash-surface);
  box-shadow: var(--fc-dash-shadow-soft);
  padding: 14px 12px !important;
  gap: 6px !important;
}

#screen-home .tc {
  border-radius: 10px;
  transition: background 0.18s ease;
}

#screen-home .tc:hover {
  background: var(--fc-dash-indigo-soft) !important;
  border-color: transparent !important;
}

#screen-home .tc-title {
  color: var(--fc-dash-ink);
}

#screen-home .tc-radar-fill.teal,
#screen-home .tc-radar-fill.indigo {
  background: var(--fc-dash-indigo);
}

#screen-home .tc-badge.teal,
#screen-home .tc-badge.purple {
  background: var(--fc-dash-indigo-soft);
  color: var(--fc-dash-indigo-dark);
}

#screen-home .tc-badge.gold {
  background: rgba(201, 169, 107, 0.14);
  color: #8b6914;
}

/* ── Stats row (si visible) ── */
#screen-home .stats-row {
  border-color: var(--fc-dash-line);
}

#screen-home .stat-val {
  color: var(--fc-dash-ink);
}

/* ── Mobile dashboard ── */
#screen-home .dash-mobile-body {
  padding-bottom: 8px;
}

#screen-home .dash-m-greet {
  font-family: 'Sora', 'Plus Jakarta Sans', sans-serif;
  font-weight: 750;
  letter-spacing: -0.03em;
  color: var(--fc-dash-ink);
}

#screen-home .dash-m-greet-sub {
  color: var(--fc-dash-muted);
}

#screen-home .dash-m-session {
  border: 1px solid var(--fc-dash-line);
  background: var(--fc-dash-surface);
  border-radius: var(--fc-dash-radius-btn);
}

#screen-home .dash-m-session strong {
  color: var(--fc-dash-indigo);
}

#screen-home .dash-m-resume {
  border: 1px solid rgba(85, 86, 217, 0.35);
  background: linear-gradient(145deg, rgba(238, 239, 255, 0.95), #ffffff);
  border-radius: var(--fc-dash-radius-card);
  box-shadow: var(--fc-dash-shadow-soft);
}

#screen-home .dash-m-resume-kicker {
  color: var(--fc-dash-indigo);
}

#screen-home .dash-m-resume-title {
  color: var(--fc-dash-ink);
}

#screen-home .dash-m-resume-cta {
  color: var(--fc-dash-indigo-dark);
}

#screen-home .dash-m-tile {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-btn);
  background: var(--fc-dash-surface);
  box-shadow: 0 2px 10px rgba(22, 29, 63, 0.04);
}

#screen-home .dash-m-tile:active {
  border-color: var(--fc-dash-indigo);
  background: var(--fc-dash-indigo-soft);
}

#screen-home .dash-m-prog-card {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-card);
  background: var(--fc-dash-surface);
  box-shadow: var(--fc-dash-shadow-soft);
}

#screen-home .dash-m-prog-ring {
  background: var(--fc-dash-indigo-soft);
  border-color: var(--fc-dash-indigo);
}

#screen-home .dash-m-prog-ring-val {
  color: var(--fc-dash-indigo-dark);
}

#screen-home .dash-m-feature {
  border: 1px solid var(--fc-dash-line);
  border-radius: var(--fc-dash-radius-btn);
  background: var(--fc-dash-surface);
}

#screen-home .dash-m-link {
  color: var(--fc-dash-indigo);
  font-weight: 700;
}

#screen-home .dash-m-quicklink {
  border: 1px solid var(--fc-dash-line);
  border-radius: 999px;
  background: var(--fc-dash-surface);
  color: var(--fc-dash-muted);
}

/* ── Mode sombre ── */
:root[data-theme="dark"] #screen-home {
  --fc-dash-paper: var(--bg, #0f1419);
  --fc-dash-surface: var(--surface, #161a23);
  --fc-dash-surface-2: var(--surface2, #1c212d);
  --fc-dash-line: rgba(232, 234, 237, 0.12);
  --fc-dash-ink: var(--text, #e8eaf2);
  --fc-dash-muted: var(--text-sub, #9aa3b8);
  --fc-dash-indigo-soft: rgba(85, 86, 217, 0.18);
}

:root[data-theme="dark"] #screen-home.dash-hub-mode {
  background:
    radial-gradient(ellipse 85% 55% at 50% 0%, rgba(85, 86, 217, 0.12), transparent 62%),
    var(--fc-dash-paper);
}

:root[data-theme="dark"] #screen-home .dash-hub-inner {
  background: rgba(22, 26, 35, 0.96);
  border-color: var(--fc-dash-line);
}

:root[data-theme="dark"] #screen-home .dash-hub-continue {
  background: linear-gradient(145deg, rgba(85, 86, 217, 0.15), rgba(22, 26, 35, 0.9)) !important;
  border-color: rgba(85, 86, 217, 0.4);
}

:root[data-theme="dark"] #screen-home .dash-hub-tile {
  background: var(--fc-dash-surface);
  border-color: var(--fc-dash-line);
}

:root[data-theme="dark"] #screen-home .continue-banner,
:root[data-theme="dark"] #screen-home .progress-overview,
:root[data-theme="dark"] #screen-home .prep-pilot,
:root[data-theme="dark"] #screen-home .training-panel,
:root[data-theme="dark"] #screen-home .module-card {
  background: var(--fc-dash-surface) !important;
  border-color: var(--fc-dash-line) !important;
}

:root[data-theme="dark"] #screen-home .dash-m-resume {
  background: linear-gradient(145deg, rgba(85, 86, 217, 0.12), var(--fc-dash-surface));
  border-color: rgba(85, 86, 217, 0.35);
}

:root[data-theme="dark"] #screen-home .btn-resume-sm {
  background: var(--fc-dash-indigo) !important;
}

/* ── Hiérarchie : secondaire sous reprise / pilotage ── */
#screen-home .prep-pilot-next,
#screen-home .prep-pilot-quick {
  padding-top: 4px;
}

#screen-home .prep-coach {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--fc-dash-line);
}

#screen-home .prep-coach-desc {
  color: var(--fc-dash-muted);
  font-size: 12px;
}

#screen-home .prep-pilot-next-label,
#screen-home .epreuves-head-title {
  color: var(--fc-dash-muted);
}

#screen-home .dash-hub-reopen {
  margin-bottom: 12px;
}

/* ── Responsive dashboard ── */
@media (max-width: 1024px) {
  #screen-home .dashboard-learning-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  #screen-home {
    padding-left: clamp(16px, 4vw, 24px);
    padding-right: clamp(16px, 4vw, 24px);
  }
}

@media (max-width: 720px) {
  #screen-home .continue-banner {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    align-items: stretch !important;
  }

  #screen-home .continue-progress {
    align-self: stretch;
    width: 100%;
  }

  #screen-home .welcome-bar {
    flex-direction: column;
    align-items: flex-start;
  }

  #screen-home.dash-hub-mode {
    padding-top: 12px;
    padding-bottom: 20px;
  }

  #screen-home .dash-hub-inner {
    max-width: 100%;
  }
}

@media (max-width: 390px) {
  #screen-home .dash-m-tiles {
    gap: 8px;
  }

  #screen-home .dash-m-tile {
    min-height: 80px;
    padding: 10px 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #screen-home .continue-banner,
  #screen-home .module-card,
  #screen-home .dash-hub-continue,
  #screen-home .dash-hub-tile {
    transition: none !important;
  }
}