/* ════════════════════════════════════════════════════════════════════════
   IPX — Feuille de style partagée (navbar, layout, composants dashboard)
   Reprend la palette de l'app portabilité pour rester cohérent.
═══════════════════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg:#F7F7F5; --surface:#fff; --border:#E4E4DF; --border-light:#EFEFEB;
  --text:#1A1A18; --text-2:#6B6B66; --text-3:#9E9E99;
  --green:#1B8A4C; --green-l:#E8F5EE; --green-b:#A8D9BC;
  --blue:#1E6FBF; --blue-l:#EBF3FC; --blue-b:#A8C9E8;
  --amber:#9A5A10; --amber-l:#FEF0D8; --amber-b:#E8C07A;
  --red:#C9382A; --red-l:#FEF0EE; --red-b:#F0B0AA;
  --navy:#1A2744; --navy-2:#243459;
  --r-sm:6px; --r:10px; --r-lg:14px;
  --shadow:0 4px 16px rgba(0,0,0,.08),0 1px 3px rgba(0,0,0,.04);
}
body {
  font-family:'DM Sans',system-ui,-apple-system,sans-serif;
  background:var(--bg); color:var(--text); min-height:100vh;
}

/* ── SIDENAV (barre latérale, inspirée d'admin-views) ───────────────────── */
body.ipx-has-side { padding-left:220px; }
.ipx-side {
  position:fixed; top:0; left:0; width:220px; height:100vh;
  background:var(--navy); color:#fff; z-index:200;
  display:flex; flex-direction:column; overflow-y:auto;
}
.ipx-side-logo {
  display:flex; align-items:center; gap:9px; padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-size:14px; font-weight:600; color:#fff; text-decoration:none; flex-shrink:0;
}
.ipx-side-logo svg { color:#7DD3A8; flex-shrink:0; }
.ipx-side-logo small { font-size:10px; font-weight:400; color:rgba(255,255,255,.35); margin-left:4px; }
.ipx-side-sec { padding:16px 12px 6px; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.28); }
.ipx-side-item {
  display:flex; align-items:center; gap:9px; padding:8px 14px; margin:1px 8px;
  border-radius:var(--r-sm); font-size:13px; font-weight:500;
  color:rgba(255,255,255,.6); cursor:pointer; transition:all .14s; text-decoration:none;
}
.ipx-side-item:hover { background:rgba(255,255,255,.07); color:#fff; }
.ipx-side-item.active { background:rgba(255,255,255,.12); color:#fff; }
.ipx-side-item svg { width:15px; height:15px; flex-shrink:0; opacity:.7; }
.ipx-side-item.active svg { opacity:1; }
.ipx-side-item.disabled { color:rgba(255,255,255,.3); cursor:not-allowed; pointer-events:none; }
.ipx-side-item.danger { color:#F0B0AA; }
.ipx-side-badge { margin-left:auto; font-size:9px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:1px 6px; border-radius:20px; background:rgba(255,255,255,.12); color:rgba(255,255,255,.6); }
/* Profil + actions, ancrés en bas */
.ipx-side-foot { margin-top:auto; border-top:1px solid rgba(255,255,255,.08); padding:8px 0 12px; }
.ipx-side-profile { display:flex; align-items:center; gap:9px; padding:10px 16px; }
.ipx-side-avatar { width:34px; height:34px; border-radius:50%; background:rgba(125,211,168,.18); color:#7DD3A8; font-size:12px; font-weight:600; border:1px solid rgba(125,211,168,.35); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ipx-side-name { font-size:12px; font-weight:600; color:#fff; line-height:1.25; }
.ipx-side-role { font-size:10px; color:rgba(255,255,255,.55); }

/* Repli responsive : la sidebar devient une barre horizontale en haut */
@media (max-width:760px) {
  body.ipx-has-side { padding-left:0; }
  .ipx-side { position:static; width:100%; height:auto; flex-direction:row; flex-wrap:wrap; align-items:center; overflow:visible; }
  .ipx-side-logo { border-bottom:none; }
  .ipx-side-sec { display:none; }
  .ipx-side-item { margin:4px; }
  .ipx-side-foot { margin-top:0; border-top:none; padding:4px; display:flex; align-items:center; margin-left:auto; }
  .ipx-side-profile { display:none; }
}

/* ── LAYOUT PAGE ────────────────────────────────────────────────────────── */
.ipx-page { max-width:1080px; margin:0 auto; padding:24px 20px 80px; }
.ipx-greeting { font-size:21px; font-weight:600; margin-bottom:4px; }
.ipx-greeting-sub { font-size:13.5px; color:var(--text-2); margin-bottom:22px; }
.ipx-greeting-sub .hot { color:var(--red); font-weight:600; }
.ipx-greeting-sub .warm { color:var(--amber); font-weight:600; }
.ipx-section-title { font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--text-3); margin:26px 0 12px; }

/* ── GRILLE DE MODULES ──────────────────────────────────────────────────── */
.ipx-modules { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; }
.ipx-mod {
  display:flex; flex-direction:column; gap:10px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg);
  padding:16px; text-decoration:none; color:inherit; transition:.12s;
  box-shadow:0 1px 2px rgba(0,0,0,.03);
}
.ipx-mod:hover { box-shadow:var(--shadow); transform:translateY(-2px); border-color:var(--navy); }
.ipx-mod.disabled { opacity:.55; pointer-events:none; box-shadow:none; }
.ipx-mod-top { display:flex; align-items:flex-start; justify-content:space-between; }
.ipx-mod-icon { width:40px; height:40px; border-radius:var(--r); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.ipx-mod-icon svg { width:20px; height:20px; }
.mi-navy  { background:rgba(26,39,68,.08);  color:var(--navy); }
.mi-green { background:var(--green-l); color:var(--green); }
.mi-blue  { background:var(--blue-l);  color:var(--blue); }
.mi-amber { background:var(--amber-l); color:var(--amber); }
.mi-gray  { background:#EEEEEC; color:var(--text-3); }
.ipx-mod-title { font-size:14.5px; font-weight:600; }
.ipx-mod-desc { font-size:12px; color:var(--text-2); line-height:1.5; }
.ipx-mod-stat { font-size:12px; color:var(--text-3); margin-top:auto; display:flex; align-items:center; gap:6px; }
.ipx-mod-stat strong { color:var(--text); font-weight:600; }
.ipx-badge { font-size:10px; font-weight:600; padding:2px 8px; border-radius:10px; }
.b-navy  { background:rgba(26,39,68,.08);  color:var(--navy); }
.b-green { background:var(--green-l); color:var(--green); }
.b-amber { background:var(--amber-l); color:var(--amber); }
.b-gray  { background:#EEEEEC; color:var(--text-3); }

/* ── TOAST ──────────────────────────────────────────────────────────────── */
#ipx-toast { position:fixed; bottom:24px; right:24px; background:var(--navy); color:#fff; padding:10px 18px; border-radius:var(--r); font-size:13px; font-weight:500; box-shadow:var(--shadow); transform:translateY(80px); opacity:0; transition:all .25s; z-index:999; }
#ipx-toast.show { transform:translateY(0); opacity:1; }
#ipx-toast.error { background:var(--red); }
#ipx-toast.ok { background:var(--green); }

/* ── LOGIN ──────────────────────────────────────────────────────────────── */
.ipx-login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
