/* =========================================================
   MEP V16.2 — identités visuelles par type de compte
   ---------------------------------------------------------
   Une base produit commune, trois expériences distinctes :
   Carrière (progression), Indépendant (pilotage), Employeur (B2B).
   Cette couche est chargée après les CSS métier existants.
   ========================================================= */

body.mep-app{
  --mep-account-accent:#176b4d;
  --mep-account-accent-dark:#0f523b;
  --mep-account-soft:#f3f8f6;
  --mep-account-soft-2:#f8fbfa;
  --mep-account-line:#dce8e2;
  --mep-account-ink:#14231d;
  --mep-account-muted:#66776f;
  --mep-account-shadow:0 16px 42px rgba(22,58,45,.075);
  --mep-account-radius:20px;
  --mep-account-radius-lg:28px;
  --mep-account-focus:rgba(23,107,77,.17);
}

body.mep-account-career{
  --mep-account-accent:#315f9b;
  --mep-account-accent-dark:#244d82;
  --mep-account-soft:#edf4fc;
  --mep-account-soft-2:#f7faff;
  --mep-account-line:#d7e3f0;
  --mep-account-ink:#14243a;
  --mep-account-muted:#68798d;
  --mep-account-shadow:0 18px 48px rgba(38,78,130,.09);
  --mep-account-radius:22px;
  --mep-account-radius-lg:30px;
  --mep-account-focus:rgba(49,95,155,.18);
  background:
    radial-gradient(circle at 8% 12%,rgba(49,95,155,.055),transparent 25rem),
    linear-gradient(#fbfdff,#f7f9fc 42rem,#fff 72rem);
}

body.mep-account-independent{
  --mep-account-accent:#0f7659;
  --mep-account-accent-dark:#0a5a44;
  --mep-account-soft:#eaf7f2;
  --mep-account-soft-2:#f5fbf8;
  --mep-account-line:#cfe6dc;
  --mep-account-ink:#102820;
  --mep-account-muted:#61786e;
  --mep-account-shadow:0 14px 34px rgba(15,91,69,.075);
  --mep-account-radius:16px;
  --mep-account-radius-lg:22px;
  --mep-account-focus:rgba(15,118,89,.18);
  background:
    linear-gradient(90deg,rgba(15,118,89,.027) 1px,transparent 1px),
    linear-gradient(rgba(15,118,89,.027) 1px,transparent 1px),
    linear-gradient(#fbfdfc,#f7fbf9 46rem,#fff 76rem);
  background-size:32px 32px,32px 32px,auto;
}

body.mep-account-employer{
  --mep-account-accent:#5546a8;
  --mep-account-accent-dark:#403481;
  --mep-account-soft:#f0eefb;
  --mep-account-soft-2:#f8f7fc;
  --mep-account-line:#dad5ee;
  --mep-account-ink:#1c1b2d;
  --mep-account-muted:#6d6b7f;
  --mep-account-shadow:0 12px 32px rgba(65,52,129,.09);
  --mep-account-radius:14px;
  --mep-account-radius-lg:20px;
  --mep-account-focus:rgba(85,70,168,.20);
  background:
    radial-gradient(circle at 100% 0,rgba(85,70,168,.07),transparent 30rem),
    linear-gradient(#faf9fd,#f5f4fa 40rem,#fff 72rem);
}

/* ----- Shell : le compte est une identité, plus un sélecteur ----- */
body[class*="mep-account-"] .mep-shell-header{
  border-bottom-color:var(--mep-account-line);
  box-shadow:0 3px 18px rgba(18,31,44,.045);
}
body[class*="mep-account-"] .mep-shell-logo{
  background:linear-gradient(145deg,var(--mep-account-accent),var(--mep-account-accent-dark));
  box-shadow:0 8px 20px color-mix(in srgb,var(--mep-account-accent) 23%,transparent);
}
body[class*="mep-account-"] .mep-portal-switcher{
  padding:5px 6px 5px 8px;
  border-color:var(--mep-account-line);
  background:var(--mep-account-soft-2);
  border-radius:13px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75);
}
body[class*="mep-account-"] .mep-portal-switcher-label{
  color:var(--mep-account-muted);
}
body[class*="mep-account-"] .mep-portal-switch.is-active{
  color:var(--mep-account-accent)!important;
  box-shadow:0 2px 9px color-mix(in srgb,var(--mep-account-accent) 12%,transparent);
}
body[class*="mep-account-"] .mep-shell-avatar{
  background:var(--mep-account-soft);
  color:var(--mep-account-accent-dark);
}
body[class*="mep-account-"] .mep-shell-context-nav{
  border-top-color:color-mix(in srgb,var(--mep-account-line) 48%,#fff);
}
body[class*="mep-account-"] .mep-shell-context-title i{
  background:var(--mep-account-soft);
  color:var(--mep-account-accent);
  border-color:var(--mep-account-line);
}
body[class*="mep-account-"] .mep-shell-context-nav>a.is-active,
body[class*="mep-account-"] .mep-shell-context-nav>a[aria-current="page"]{
  color:var(--mep-account-accent-dark)!important;
  background:var(--mep-account-soft);
}
body[class*="mep-account-"] :focus-visible{
  outline-color:var(--mep-account-focus)!important;
}

/* =========================================================
   CARRIÈRE — plus éditorial, progressif et rassurant
   ========================================================= */
body.mep-account-career .mep-career-dashboard{max-width:1280px}
body.mep-account-career .mep-career-hero-main,
body.mep-account-career .mep-career-hero-status,
body.mep-account-career .mep-career-card{
  border-color:var(--mep-account-line);
  border-radius:var(--mep-account-radius-lg);
  box-shadow:var(--mep-account-shadow);
}
body.mep-account-career .mep-career-hero-main{
  position:relative;
  overflow:hidden;
  padding:34px 36px;
  background:
    radial-gradient(circle at 92% 12%,rgba(49,95,155,.18),transparent 31%),
    linear-gradient(145deg,#fff 4%,#f5f9ff 100%);
}
body.mep-account-career .mep-career-hero-main::after{
  content:"";
  position:absolute;
  width:170px;height:170px;right:-74px;bottom:-102px;
  border:28px solid rgba(49,95,155,.055);border-radius:50%;pointer-events:none;
}
body.mep-account-career .mep-career-hero h1{font-size:clamp(34px,4.3vw,52px);letter-spacing:-.052em}
body.mep-account-career .mep-career-btn.is-primary{background:var(--mep-account-accent);border-color:var(--mep-account-accent);box-shadow:0 9px 22px rgba(49,95,155,.18)}
body.mep-account-career .mep-career-hero-status{background:linear-gradient(160deg,#fff,#f3f7fc)}
body.mep-account-career .mep-career-journey{
  padding:9px;border-color:var(--mep-account-line);border-radius:20px;box-shadow:0 8px 26px rgba(38,78,130,.055)
}
body.mep-account-career .mep-career-journey-item.is-active{background:linear-gradient(135deg,#eaf2fb,#f5f9ff)}
body.mep-account-career .mep-career-next{
  border-color:var(--mep-account-line);
  background:linear-gradient(90deg,#eef5fd,#fff 70%);
  box-shadow:0 10px 28px rgba(38,78,130,.06);
}
body.mep-account-career .mep-career-kpi{
  border-color:var(--mep-account-line);
  border-radius:20px;
  background:#fff;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
body.mep-account-career .mep-career-kpi:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(38,78,130,.085);border-color:#bfd1e5}
body.mep-account-career .mep-career-kpi strong{color:var(--mep-account-accent-dark)}
body.mep-account-career .mep-career-quick-actions>a{border-radius:18px;border-color:var(--mep-account-line);background:rgba(255,255,255,.88)}
body.mep-account-career .mep-career-quick-actions>a b{background:var(--mep-account-soft);color:var(--mep-account-accent-dark)}
body.mep-account-career .mep-career-card-head h2{letter-spacing:-.035em}

/* =========================================================
   INDÉPENDANT — plus dense, chiffré, orienté opérations
   ========================================================= */
body.mep-account-independent .mep-independent-foundation>.mep-independent-hero{
  border-radius:var(--mep-account-radius-lg)!important;
  border-color:var(--mep-account-line)!important;
  background:
    linear-gradient(90deg,rgba(15,118,89,.045) 1px,transparent 1px),
    linear-gradient(rgba(15,118,89,.045) 1px,transparent 1px),
    linear-gradient(145deg,#fff,#f4fbf8)!important;
  background-size:24px 24px,24px 24px,auto!important;
  box-shadow:var(--mep-account-shadow)!important;
}
body.mep-account-independent .mep-independent-hero-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}
body.mep-account-independent .mep-independent-hero-actions .mep-work-btn{white-space:nowrap}
body.mep-account-independent .mep-independent-status{
  border-radius:14px;
  border-color:var(--mep-account-line);
  background:#fff;
  box-shadow:0 6px 20px rgba(15,91,69,.045);
}
body.mep-account-independent .mep-independent-journey{border-radius:14px;border-color:var(--mep-account-line);box-shadow:0 6px 20px rgba(15,91,69,.045)}
body.mep-account-independent .mep-independent-journey-item{border-radius:10px}
body.mep-account-independent .mep-independent-dashboard-panel,
body.mep-account-independent .mep-independent-progress-card,
body.mep-account-independent .mep-independent-profile-shell,
body.mep-account-independent .mep-independent-lifecycle{
  border-radius:var(--mep-account-radius)!important;
  border-color:var(--mep-account-line)!important;
  box-shadow:var(--mep-account-shadow)!important;
}
body.mep-account-independent .mep-independent-dashboard-kpis>*{
  border-radius:14px!important;
  border-color:var(--mep-account-line)!important;
  background:linear-gradient(180deg,#fff,#fbfefc)!important;
}
body.mep-account-independent .mep-independent-dashboard-kpis strong,
body.mep-account-independent .mep-independent-kpis strong{color:var(--mep-account-accent-dark)}
body.mep-account-independent .mep-independent-dashboard-panel{background:rgba(255,255,255,.94)!important}
body.mep-account-independent .mep-work-btn.is-primary{background:var(--mep-account-accent)!important;border-color:var(--mep-account-accent)!important;box-shadow:0 8px 18px rgba(15,118,89,.15)}
body.mep-account-independent .mep-independent-priority{border-radius:11px!important}
body.mep-account-independent .mep-independent-mini-pipeline>*{border-radius:10px!important}
body.mep-account-independent .mep-independent-plus-pilotage{border-color:#bdded1!important;background:linear-gradient(135deg,#eaf7f2,#fff)!important}

/* =========================================================
   EMPLOYEUR — plus compact, premium et B2B
   ========================================================= */
body.mep-account-employer .mep-shell-header{
  box-shadow:0 5px 24px rgba(40,34,75,.07);
}
body.mep-account-employer .mep-shell-context-nav>a,
body.mep-account-employer .mep-shell-more>summary{font-weight:780}
body.mep-account-employer .mep-employer-app>.mep-portal-hero{
  border-radius:var(--mep-account-radius-lg)!important;
  border-color:var(--mep-account-line)!important;
  background:
    radial-gradient(circle at 92% 5%,rgba(113,95,195,.22),transparent 28%),
    linear-gradient(135deg,#25223a 0%,#34304c 60%,#4a3f84 125%)!important;
  color:#fff!important;
  box-shadow:0 18px 44px rgba(45,38,86,.18)!important;
}
body.mep-account-employer .mep-employer-app>.mep-portal-hero h1,
body.mep-account-employer .mep-employer-app>.mep-portal-hero p{color:#fff!important}
body.mep-account-employer .mep-employer-app>.mep-portal-hero p{opacity:.78}
body.mep-account-employer .mep-employer-app>.mep-portal-hero .mep-portal-eyebrow{color:#cfc7ff!important}
body.mep-account-employer .mep-employer-app>.mep-portal-hero .mep-pro-btn{border-color:rgba(255,255,255,.24)!important;background:rgba(255,255,255,.09)!important;color:#fff!important}
body.mep-account-employer .mep-employer-app>.mep-portal-hero .mep-pro-btn.is-primary{background:#fff!important;color:#332b6a!important;border-color:#fff!important}
body.mep-account-employer .mep-employer-welcome,
body.mep-account-employer .mep-pro-card,
body.mep-account-employer .mep-employer-plus-insights,
body.mep-account-employer .mep-employer-job-workspace{
  border-radius:var(--mep-account-radius)!important;
  border-color:var(--mep-account-line)!important;
  box-shadow:var(--mep-account-shadow)!important;
}
body.mep-account-employer .mep-employer-kpi-grid article{
  border-radius:12px!important;
  border-color:var(--mep-account-line)!important;
  background:#fff!important;
}
body.mep-account-employer .mep-employer-kpi-grid article strong{color:var(--mep-account-accent-dark)}
body.mep-account-employer .mep-employer-welcome{background:linear-gradient(135deg,#f1effb,#fff)!important}
body.mep-account-employer .mep-employer-onboarding-list>*{border-radius:10px!important}
body.mep-account-employer .mep-pro-card-head{border-bottom-color:#ebe8f5!important}
body.mep-account-employer .mep-pro-btn.is-primary{background:var(--mep-account-accent)!important;border-color:var(--mep-account-accent)!important;box-shadow:0 8px 18px rgba(85,70,168,.15)}
body.mep-account-employer .mep-employer-next-action{border-radius:11px!important}
body.mep-account-employer .mep-employer-job-list article{border-radius:10px!important}
body.mep-account-employer .mep-employer-editor-steps{border-color:var(--mep-account-line)!important;background:#faf9fd!important}
body.mep-account-employer .mep-employer-form-step{border-radius:12px!important}

/* ----- MEP Plus hérite réellement du type connecté ----- */
body[class*="mep-account-"] .mep-plus-page{
  --mep-plus-accent:var(--mep-account-accent);
  --mep-plus-accent-dark:var(--mep-account-accent-dark);
}
body[class*="mep-account-"] .mep-plus-hero{
  border-color:var(--mep-account-line)!important;
  border-radius:var(--mep-account-radius-lg)!important;
  background:
    radial-gradient(circle at 92% 8%,color-mix(in srgb,var(--mep-account-accent) 16%,transparent),transparent 31%),
    linear-gradient(145deg,#fff,var(--mep-account-soft-2))!important;
  box-shadow:var(--mep-account-shadow)!important;
}
body[class*="mep-account-"] .mep-plus-price-card{
  border-color:var(--mep-account-line)!important;
  border-radius:var(--mep-account-radius)!important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--mep-account-accent) 10%,transparent)!important;
}
body[class*="mep-account-"] .mep-plus-price-card>strong,
body[class*="mep-account-"] .mep-plus-plan,
body[class*="mep-account-"] .mep-global-eyebrow{color:var(--mep-account-accent-dark)!important}
body[class*="mep-account-"] .mep-global-btn.is-plus{
  background:var(--mep-account-accent)!important;
  border-color:var(--mep-account-accent)!important;
}
body[class*="mep-account-"] .mep-plus-compare article,
body[class*="mep-account-"] .mep-plus-nucleus{
  border-color:var(--mep-account-line)!important;
  border-radius:var(--mep-account-radius)!important;
}
body.mep-account-employer .mep-plus-compare article.is-plus,
body.mep-account-employer .mep-plus-nucleus.is-employer{box-shadow:0 12px 32px rgba(85,70,168,.09)}

/* ----- Formulaires et contrôles : focus cohérent ----- */
body[class*="mep-account-"] input:focus,
body[class*="mep-account-"] select:focus,
body[class*="mep-account-"] textarea:focus{
  border-color:color-mix(in srgb,var(--mep-account-accent) 58%,#fff)!important;
  box-shadow:0 0 0 4px var(--mep-account-focus)!important;
}

/* ----- Responsive ----- */
@media (max-width:900px){
  body[class*="mep-account-"] .mep-portal-switcher-label{display:none}
  body.mep-account-independent .mep-independent-hero-actions{width:100%;justify-content:flex-start}
  body.mep-account-employer .mep-employer-app>.mep-portal-hero{padding:24px!important}
}
@media (max-width:640px){
  body.mep-account-career .mep-career-hero-main{padding:25px 22px}
  body.mep-account-career .mep-career-hero h1{font-size:34px}
  body.mep-account-independent .mep-independent-hero-actions{display:grid;grid-template-columns:1fr 1fr}
  body.mep-account-independent .mep-independent-hero-actions .mep-work-btn{width:100%}
  body.mep-account-employer .mep-employer-app>.mep-portal-hero .mep-portal-hero-actions{display:grid;grid-template-columns:1fr}
  body.mep-account-employer .mep-employer-app>.mep-portal-hero .mep-pro-btn{width:100%}
}
