/* =========================================================
   ILMDU — Dashboard UI (Scoped .ilmdu)
   Objectif : mêmes couleurs que TON SITE (brand green/navy),
   plugin indépendant (fallbacks inclus).
   ========================================================= */

.ilmdu{
  --site-green:     var(--brand-green,   #17A051);
  --site-green-2:   var(--brand-green-2, #64CA4F);
  --site-lime:      var(--brand-lime,    #9FCC2E);
  --site-yellow:    var(--brand-yellow,  #F2C94C);
  --site-navy:      var(--brand-navy,    #101323);

  --site-bg:        var(--bg,        #ffffff);
  --site-bg-soft:   var(--bg-soft,   #F2F3F4);
  --site-surface:   var(--surface,   #ffffff);
  --site-surface2:  var(--surface-2, #F7F8FA);

  --site-text:      var(--text,      #111827);
  --site-text-2:    var(--text-2,    #2B2F3A);
  --site-muted:     var(--muted,     #666672);
  --site-muted-2:   var(--muted-2,   #98999D);

  --site-line:      var(--line,      #E6E8EE);
  --site-line-2:    var(--line-2,    #D6DAE4);

  --site-shadow-sm: var(--shadow-sm, 0 10px 24px rgba(16,19,35,.08));
  --site-shadow-md: var(--shadow-md, 0 14px 34px rgba(16,19,35,.12));
  --site-shadow-lg: var(--shadow-lg, 0 24px 60px rgba(16,19,35,.16));

  --site-focus:     var(--focus, 0 0 0 3px rgba(23,160,81,.25));

  --site-alpha-ink-03:   var(--alpha-ink-03, rgba(16,19,35,.03));
  --site-alpha-ink-06:   var(--alpha-ink-06, rgba(16,19,35,.06));
  --site-alpha-ink-10:   var(--alpha-ink-10, rgba(16,19,35,.10));

  --site-alpha-brand-08: var(--alpha-brand-08, rgba(23,160,81,.08));
  --site-alpha-brand-10: var(--alpha-brand-10, rgba(23,160,81,.10));
  --site-alpha-brand-12: var(--alpha-brand-12, rgba(23,160,81,.12));
  --site-alpha-brand-18: var(--alpha-brand-18, rgba(23,160,81,.18));
  --site-alpha-brand-22: var(--alpha-brand-22, rgba(23,160,81,.22));

  --site-panel-bg: var(--panel-bg, rgba(255,255,255,.72));

  /* Tokens ILMDU */
  --bg:     transparent;
  --card:   var(--site-panel-bg);
  --txt:    var(--site-text);
  --muted:  rgba(17,24,39,.58);

  --border: var(--site-line);
  --accent: var(--site-green);
  --danger: #e24b4b;

  --shadow: var(--site-shadow-md);

  color: var(--txt);
  background: transparent;
}

.ilmdu-topbar{
  background: var(--card);
  border-color: var(--border);
  box-shadow: var(--shadow);
  backdrop-filter: blur(10px);
}

.ilmdu-card{
  background: rgba(255,255,255,.86);
  border-color: var(--border);
  box-shadow: var(--site-shadow-sm);
}

.ilmdu-title{ color: var(--txt); }
.ilmdu-sub{ color: var(--muted); }

.ilmdu-badge,
.ilmdu-pill{
  background: var(--site-alpha-ink-03);
  border-color: var(--site-line);
  color: rgba(17,24,39,.62);
}

.ilmdu-btn{
  background: rgba(255,255,255,.65);
  border-color: rgba(16,19,35,.10);
  color: var(--txt);
  box-shadow: none;
}
.ilmdu-btn:hover{
  background: rgba(255,255,255,.92);
  border-color: rgba(16,19,35,.14);
}

.ilmdu-btn--accent{
  background: var(--site-alpha-brand-10);
  border-color: var(--site-alpha-brand-22);
  color: rgba(16,19,35,.88);
}

.ilmdu-btn--danger{
  background: rgba(226,75,75,.10);
  border-color: rgba(226,75,75,.28);
  color: rgba(126,22,30,.92);
}

.ilmdu-kpi{
  background: rgba(255,255,255,.70);
  border-color: var(--border);
}
.ilmdu-kpi__label,
.ilmdu-kpi__meta{ color: var(--muted); }
.ilmdu-kpi__value{ color: var(--txt); }

.ilmdu-score__bar{
  background: var(--site-alpha-ink-03);
  border-color: var(--border);
}
.ilmdu-score__bar span{
  background: linear-gradient(90deg, rgba(23,160,81,.22), rgba(23,160,81,.85));
}
.ilmdu-score__label{ color: var(--muted); }
.ilmdu-score__val{ color: var(--txt); }

.ilmdu-tablewrap{ border-color: var(--border); }
.ilmdu-table{ background: rgba(255,255,255,.72); }
.ilmdu-table th{ color: var(--muted); }
.ilmdu-table td{ color: var(--txt); }

.ilmdu-status{
  background: var(--site-alpha-ink-03);
  border-color: rgba(16,19,35,.10);
  color: rgba(17,24,39,.62);
}
.ilmdu-status--ok{
  background: var(--site-alpha-brand-10);
  border-color: var(--site-alpha-brand-22);
  color: rgba(16,19,35,.88);
}
.ilmdu-status--bad{
  background: rgba(226,75,75,.10);
  border-color: rgba(226,75,75,.28);
  color: rgba(126,22,30,.92);
}

.ilmdu-modal{ background: rgba(16,19,35,.45); }
.ilmdu-modal__panel{
  background: rgba(255,255,255,.96);
  border-color: rgba(16,19,35,.10);
  box-shadow: var(--site-shadow-lg);
}
.ilmdu-modal__head{ border-bottom-color: rgba(16,19,35,.10); }
.ilmdu-modal__title{ color: var(--txt); }
.ilmdu-modal__body{ color: var(--muted); }

.ilmdu-pre{
  background: rgba(16,19,35,.04);
  border-color: rgba(16,19,35,.10);
  color: var(--txt);
}