/* MyCorpo-Sanlam — Design system commun
   Objectif : base visuelle homogène pour le portail et les outils intégrés. */
:root{
  --sl-blue:#0072b8;
  --sl-blue-dark:#005a93;
  --sl-blue-soft:#e8f4fb;
  --sl-blue-ink:#073b63;
  --sl-bg:#f6f8fb;
  --sl-surface:#ffffff;
  --sl-surface-muted:#f1f5f9;
  --sl-border:#dbe5ef;
  --sl-text:#172033;
  --sl-muted:#64748b;
  --sl-success:#147a52;
  --sl-success-soft:#e8f7ef;
  --sl-warning:#b86b00;
  --sl-warning-soft:#fff4df;
  --sl-danger:#b42318;
  --sl-danger-soft:#fff0ee;
  --sl-radius:18px;
  --sl-radius-sm:12px;
  --sl-shadow:0 14px 36px rgba(13,54,96,.10);
  --sl-shadow-sm:0 8px 20px rgba(13,54,96,.07);
  --sl-font:Inter,"DM Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --sl-mono:"JetBrains Mono","SFMono-Regular",Consolas,monospace;
}
html{scroll-behavior:smooth;}
body{font-family:var(--sl-font);}
.sl-card,
.panel,
.tool-card,
.login-box{
  border-radius:var(--sl-radius);
  border:1px solid var(--sl-border);
  box-shadow:var(--sl-shadow-sm);
}
.sl-card{background:var(--sl-surface);padding:22px;}
.sl-stack{display:flex;flex-direction:column;gap:16px;}
.sl-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.sl-spread{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.sl-title{font-size:clamp(1.15rem,2vw,1.65rem);font-weight:850;color:var(--sl-blue-ink);letter-spacing:-.02em;}
.sl-subtitle{color:var(--sl-muted);font-size:.94rem;line-height:1.55;}
.sl-btn,
.btn{
  border-radius:999px;
  font-weight:750;
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease;
}
.sl-btn:hover,
.btn:hover{transform:translateY(-1px);}
.sl-btn-primary,
.btn-primary{background:linear-gradient(135deg,var(--sl-blue-dark),var(--sl-blue));border-color:transparent;color:#fff;box-shadow:0 10px 20px rgba(0,114,184,.18);}
.sl-pill,
.pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:.32rem .72rem;font-size:.76rem;font-weight:800;}
.sl-pill-ok,.pill-active{background:var(--sl-success-soft);color:var(--sl-success);}
.sl-pill-dev,.pill-dev{background:var(--sl-warning-soft);color:var(--sl-warning);}
.sl-pill-lock,.pill-lock{background:var(--sl-danger-soft);color:var(--sl-danger);}
.sl-input,
input,select,textarea{border-radius:12px;}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 4px rgba(0,114,184,.12);border-color:var(--sl-blue)!important;}
.table-wrap{border-radius:var(--sl-radius-sm);border:1px solid var(--sl-border);overflow:auto;background:#fff;}
.table th,table th{background:#eef6fc;color:var(--sl-blue-ink);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;}
.table td,table td{border-bottom:1px solid var(--sl-border);}
.sl-toast-host{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:9999;}
.sl-toast{max-width:min(360px,calc(100vw - 36px));background:#fff;border:1px solid var(--sl-border);border-left:5px solid var(--sl-blue);box-shadow:var(--sl-shadow);border-radius:14px;padding:12px 14px;color:var(--sl-text);font-weight:650;animation:slToastIn .2s ease both;}
.sl-toast.success{border-left-color:var(--sl-success);}
.sl-toast.warning{border-left-color:var(--sl-warning);}
.sl-toast.danger{border-left-color:var(--sl-danger);}
@keyframes slToastIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.sl-spread{align-items:flex-start;flex-direction:column}.sl-card{padding:16px}}