/* ============================================================================
   MyEureka Premium Home - édition l'Akadémie : onglet « Mise en forme ».
   Classes meph-opt-* et variables --meph-* posées sur la racine .meph de l'accueil
   (et classes meph-opt-*-dir-* sur la racine .meph-directory du répertoire des cours).
   Les !important sont nécessaires : les feuilles d'écran fixent déjà ces propriétés
   (parfois elles-mêmes en !important) et la racine est le seul point de contrôle.
   ============================================================================ */

/* ---- Bannière : masquage d'éléments ---------------------------------------- */
.meph.meph-opt-no-tag .meph-hero-copy .meph-chip.meph-featured { display: none !important; }
.meph.meph-opt-no-eyebrow .meph-hero-copy .meph-eyebrow { display: none !important; }
.meph.meph-opt-no-description .meph-hero-description { display: none !important; }
.meph.meph-opt-no-meta .meph-hero-meta { display: none !important; }
.meph.meph-opt-no-social .meph-inline-social { display: none !important; }
.meph.meph-opt-no-progress .meph-hero-progress { display: none !important; }
.meph.meph-opt-no-secondary .meph-hero-actions .meph-btn-secondary { display: none !important; }
.meph.meph-opt-no-note .meph-hero-note { display: none !important; }

/* ---- Bannière : tailles ----------------------------------------------------- */
.meph .meph-hero-description { font-size: var(--meph-hero-desc, 14px) !important; }
.meph.meph-opt-hero-scale .meph-hero h1 { font-size: calc(clamp(31px, 2.35vw, 49px) * var(--meph-hero-title-scale, 1)) !important; }
@media (max-width: 1250px) { .meph.meph-opt-hero-scale .meph-hero h1 { font-size: calc(clamp(31px, 3.2vw, 43px) * var(--meph-hero-title-scale, 1)) !important; } }
@media (max-width: 680px) { .meph.meph-opt-hero-scale .meph-hero h1 { font-size: calc(clamp(26px, 7vw, 34px) * var(--meph-hero-title-scale, 1)) !important; } }

/* ---- Bannière : bloc communauté (échelle globale) ---------------------------- */
.meph.meph-opt-social-scale .meph-inline-social { gap: calc(16px * var(--meph-social-scale, 1)) !important; min-height: calc(56px * var(--meph-social-scale, 1)); }
.meph.meph-opt-social-scale .meph-inline-social .meph-inline-avatar, .meph.meph-opt-social-scale .meph-inline-social .meph-inline-plus { width: calc(var(--meph-social-avatar-size, 46px) * var(--meph-social-scale, 1)) !important; height: calc(var(--meph-social-avatar-size, 46px) * var(--meph-social-scale, 1)) !important; flex-basis: calc(var(--meph-social-avatar-size, 46px) * var(--meph-social-scale, 1)) !important; }
.meph.meph-opt-social-scale .meph-inline-social .meph-inline-avatar { margin-right: calc(-8px * var(--meph-social-scale, 1)) !important; }
.meph.meph-opt-social-scale .meph-inline-social .meph-inline-plus svg { transform: scale(var(--meph-social-scale, 1)); }
.meph.meph-opt-social-scale .meph-inline-copy { gap: calc(2px * var(--meph-social-scale, 1)); }
.meph.meph-opt-social-scale .meph-inline-copy strong { font-size: calc(15px * var(--meph-social-scale, 1)) !important; }
.meph.meph-opt-social-scale .meph-inline-copy span { font-size: calc(12px * var(--meph-social-scale, 1)) !important; }
@media (max-width: 680px) {
  .meph.meph-opt-social-scale .meph-inline-social .meph-inline-avatar, .meph.meph-opt-social-scale .meph-inline-social .meph-inline-plus { width: calc(min(var(--meph-social-avatar-size, 46px), 46px) * var(--meph-social-scale, 1)) !important; height: calc(min(var(--meph-social-avatar-size, 46px), 46px) * var(--meph-social-scale, 1)) !important; flex-basis: calc(min(var(--meph-social-avatar-size, 46px), 46px) * var(--meph-social-scale, 1)) !important; }
  .meph.meph-opt-social-scale .meph-inline-copy strong { font-size: calc(14px * var(--meph-social-scale, 1)) !important; }
  .meph.meph-opt-social-scale .meph-inline-copy span { font-size: calc(11px * var(--meph-social-scale, 1)) !important; }
}

/* ---- Boutons ---------------------------------------------------------------- */
.meph.meph-opt-no-tag-shadow .meph-hero-copy .meph-chip { box-shadow: none !important; }
.meph.meph-opt-no-btn-shadow .meph-btn, .meph.meph-opt-no-btn-shadow .meph-btn:hover, .meph.meph-opt-no-btn-shadow .meph-aside-spark, .meph.meph-opt-no-btn-shadow .meph-section-head a, .meph.meph-opt-no-btn-shadow .meph-rail-prev, .meph.meph-opt-no-btn-shadow .meph-rail-next, .meph.meph-opt-no-btn-shadow .meph-hero-dots button { box-shadow: none !important; }
.meph.meph-opt-btn-rounded .meph-btn, .meph.meph-opt-btn-rounded .meph-chip, .meph.meph-opt-btn-rounded .meph-section-head a { border-radius: var(--me-radius-md, 14px) !important; }
.meph.meph-opt-btn-square .meph-btn, .meph.meph-opt-btn-square .meph-chip, .meph.meph-opt-btn-square .meph-section-head a { border-radius: 6px !important; }

/* ---- Cartes ----------------------------------------------------------------- */
.meph.meph-opt-no-card-shadow .meph-dashboard, .meph.meph-opt-no-card-shadow .meph-kpi, .meph.meph-opt-no-card-shadow .meph-course-card, .meph.meph-opt-no-card-shadow .meph-course-card:hover, .meph.meph-opt-no-card-shadow .meph-path, .meph.meph-opt-no-card-shadow .meph-path:hover, .meph.meph-opt-no-card-shadow .meph-hero-aside, .meph.meph-opt-no-card-shadow .meph-hero-float-icon { box-shadow: none !important; }
.meph.meph-opt-no-card-border .meph-dashboard, .meph.meph-opt-no-card-border .meph-kpi, .meph.meph-opt-no-card-border .meph-course-card, .meph.meph-opt-no-card-border .meph-path { border-color: transparent !important; }

/* ---- Indicateurs : barres de séparation verticales fines (à la place des cartes) --- */
.meph.meph-opt-kpi-separators .meph-kpi-items { gap: 0 !important; }
/* Spécificité (0,4,0) : prime sur l'effet verre des indicateurs. */
.meph.meph.meph-opt-kpi-separators .meph-kpi, .meph.meph.meph-opt-kpi-separators .meph-kpi:hover { background: transparent !important; border-color: transparent !important; border-radius: 0 !important; box-shadow: none !important; padding-left: 16px; padding-right: 16px; }
.meph.meph-opt-kpi-separators .meph-kpi + .meph-kpi { border-left: 1px solid var(--meph-kpi-sep, var(--me-border, #e3e5f3)) !important; }
.meph.meph-opt-kpi-sep-strong { --meph-kpi-sep: var(--me-border-strong, #cfd2ea); }
.meph.meph-opt-kpi-sep-accent { --meph-kpi-sep: var(--me-primary-soft-2, #d9dbf5); }
@media (max-width: 680px) { .meph.meph-opt-kpi-separators .meph-kpi { padding-left: 10px; padding-right: 10px; } }

/* ---- Espacements (actifs dès qu'une valeur diffère de l'origine) ------------- */
.meph.meph-opt-spacing .meph-dashboard { margin-top: var(--meph-sp-hero-dash, -18px) !important; margin-bottom: var(--meph-sp-dash-bottom, 22px) !important; padding: var(--meph-sp-dash-pad, 16px) !important; }
.meph.meph-opt-spacing .meph-kpi-items { gap: var(--meph-sp-kpi, 8px) !important; }
.meph.meph-opt-spacing.meph-opt-kpi-separators .meph-kpi-items { gap: 0 !important; }
.meph.meph-opt-spacing .meph-course-section { margin-bottom: var(--meph-sp-sections, 18px) !important; }
.meph.meph-opt-spacing .meph-section-head { margin-bottom: var(--meph-sp-head, 12px) !important; }
.meph.meph-opt-spacing .meph-rail, .meph.meph-opt-spacing .meph-path-grid { gap: var(--meph-sp-cards, 14px) !important; }
.meph.meph-opt-spacing .meph-home-paths { margin-top: var(--meph-sp-paths, 20px) !important; }
.meph.meph-opt-spacing .meph-content { padding-bottom: var(--meph-sp-bottom, 50px) !important; }

/* ---- Tableau de bord et sections -------------------------------------------- */
.meph .meph-kpi-text small { font-size: var(--meph-kpi-label, 10px) !important; font-weight: var(--meph-kpi-label-weight, 700) !important; color: var(--meph-kpi-label-color, var(--me-text)) !important; line-height: 1.2; }
.meph .meph-kpi-text strong { font-size: var(--meph-kpi-value, 20px) !important; font-weight: var(--meph-kpi-value-weight, 700) !important; }
.meph .meph-kpi-text > span { font-size: var(--meph-kpi-sub, 9px) !important; font-weight: var(--meph-kpi-sub-weight, 400) !important; color: var(--meph-kpi-sub-color, var(--me-text-3)) !important; }
/* Étoile de notation de la bannière : jaune de la charte, indépendant du token d'avertissement. */
.meph .meph-hero-meta .meph-meta-rating svg { color: var(--meph-star, #ffac34) !important; stroke: var(--meph-star, #ffac34) !important; fill: var(--meph-star, #ffac34) !important; }
.meph .meph-dash-intro h2 { font-size: var(--meph-dash-title, 21px) !important; }
.meph .meph-section-head h2 { font-size: var(--meph-section-title, 22px) !important; }

/* ---- Effet verre sur le bandeau « Mon tableau de bord » --------------------- */
.meph.meph-opt-dash-glass .meph-dashboard { background: rgba(var(--me-glass-rgb, 255, 255, 255), var(--meph-glass-alpha, .62)) !important; -webkit-backdrop-filter: blur(var(--meph-glass-blur, 16px)) saturate(1.35); backdrop-filter: blur(var(--meph-glass-blur, 16px)) saturate(1.35); border: 1px solid var(--me-glass-border, rgba(255, 255, 255, .7)) !important; }
.meph.meph-opt-dash-glass-kpis .meph-kpi { background: rgba(var(--me-glass-rgb, 255, 255, 255), calc(var(--meph-glass-alpha, .62) * .7)) !important; border-color: var(--me-glass-border, rgba(255, 255, 255, .7)) !important; }
.meph.meph-opt-dash-glass-kpis .meph-kpi-icon { background: rgba(var(--me-glass-rgb, 255, 255, 255), .55) !important; }

/* ---- Répertoire des cours (racine .meph-directory) ---------------------------- */
.meph-directory.meph-opt-no-dir-card-shadow .mec-card, .meph-directory.meph-opt-no-dir-card-shadow .mec-card:hover, .meph-directory.meph-opt-no-dir-card-shadow .mec-category, .meph-directory.meph-opt-no-dir-card-shadow .mec-save-course { box-shadow: none !important; }
.meph-directory.meph-opt-no-dir-panel-shadow .mec-sidebar, .meph-directory.meph-opt-no-dir-panel-shadow .mec-toolbar, .meph-directory.meph-opt-no-dir-panel-shadow .mec-feature, .meph-directory.meph-opt-no-dir-panel-shadow .mec-apply { box-shadow: none !important; }
