@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');
/* ================================================================
   theme-shared.css — Diamond Staff / Illegal Bot
   Design system commun : thème clair/sombre + composants d'UI
   partagés entre index.html, dashboard-admin.html, entretiens.html.
   Ce fichier ne redéfinit jamais les styles propres à chaque page :
   il n'ajoute que des classes préfixées "ds-" + le mécanisme de thème.
   ================================================================ */

:root{
  --ds-ac:#4f8eff; --ds-ac2:#7fb3ff; --ds-ac-glow:rgba(79,142,255,.35);
  --ds-green:#1fd98a; --ds-red:#f0496e; --ds-yellow:#f7c948; --ds-purple:#a78bfa;
  --ds-r:12px; --ds-r2:8px;
  --ds-font:'Rajdhani','Inter',sans-serif; --ds-mono:'Share Tech Mono','JetBrains Mono',monospace;

  /* surfaces neutres utilisées UNIQUEMENT par les composants ds-* */
  --ds-bg:#0a0c12; --ds-panel:#11141d; --ds-panel2:#161a26; --ds-panel3:#1c2130;
  --ds-line:rgba(255,255,255,.08); --ds-line2:rgba(255,255,255,.14);
  --ds-t1:#eef1fa; --ds-t2:#8a92a8; --ds-t3:#4a5268;
  --ds-shadow:0 20px 60px rgba(0,0,0,.55);
  --ds-overlay:rgba(4,5,9,.6);
}
html[data-theme="light"]{
  --ds-bg:#f4f6fb; --ds-panel:#ffffff; --ds-panel2:#f1f3f9; --ds-panel3:#e7eaf3;
  --ds-line:rgba(20,25,45,.10); --ds-line2:rgba(20,25,45,.16);
  --ds-t1:#161a26; --ds-t2:#565f78; --ds-t3:#8a92a8;
  --ds-shadow:0 20px 50px rgba(30,40,70,.16);
  --ds-overlay:rgba(80,90,120,.28);
}

/* ── Quickbar (haut-droite, injectée par shell.js sur toutes les pages) ── */
#ds-quickbar{position:fixed;top:14px;right:18px;z-index:900;display:flex;align-items:center;gap:8px;font-family:var(--ds-font)}
.ds-qb-btn{position:relative;width:38px;height:38px;border-radius:10px;background:var(--ds-panel);border:1px solid var(--ds-line);color:var(--ds-t2);display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer;transition:all .15s;box-shadow:var(--ds-shadow)}
.ds-qb-btn:hover{border-color:var(--ds-ac);color:var(--ds-ac2)}
.ds-qb-dot{position:absolute;top:6px;right:6px;min-width:15px;height:15px;padding:0 3px;border-radius:8px;background:var(--ds-red);color:#fff;font-size:9px;font-weight:800;font-family:var(--ds-mono);display:none;align-items:center;justify-content:center;box-shadow:0 0 8px rgba(240,73,110,.6)}
.ds-qb-dot.show{display:flex}
.ds-qb-user{display:flex;align-items:center;gap:9px;padding:5px 12px 5px 6px;border-radius:11px;background:var(--ds-panel);border:1px solid var(--ds-line);cursor:pointer;transition:all .15s;box-shadow:var(--ds-shadow)}
.ds-qb-user:hover{border-color:var(--ds-ac)}
.ds-qb-av{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--ds-ac),var(--ds-purple));display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#fff;overflow:hidden;flex-shrink:0}
.ds-qb-av img{width:100%;height:100%;object-fit:cover}
.ds-qb-name{font-size:12.5px;font-weight:700;color:var(--ds-t1);max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ds-qb-chev{color:var(--ds-t3);font-size:9px}

/* ── Dropdowns génériques (cloche / menu utilisateur) ── */
.ds-dd{position:fixed;top:58px;width:340px;max-height:min(560px,80vh);background:var(--ds-panel);border:1px solid var(--ds-line2);border-radius:14px;box-shadow:var(--ds-shadow);display:none;flex-direction:column;overflow:hidden;z-index:901;animation:ds-dd-in .16s cubic-bezier(.34,1.56,.64,1)}
.ds-dd.open{display:flex}
@keyframes ds-dd-in{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.ds-dd-hd{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--ds-line);font-size:13px;font-weight:800;color:var(--ds-t1)}
.ds-dd-hd small{margin-left:auto;font-size:10px;font-weight:600;color:var(--ds-t3);font-family:var(--ds-mono)}
.ds-dd-body{overflow-y:auto;flex:1;padding:6px}
.ds-dd-ft{padding:10px 14px;border-top:1px solid var(--ds-line)}
.ds-empty{padding:32px 16px;text-align:center;color:var(--ds-t3);font-size:12px}
.ds-empty span{display:block;font-size:22px;margin-bottom:8px;opacity:.6}

/* items */
.ds-item{padding:10px 12px;border-radius:9px;cursor:default;transition:background .12s;margin-bottom:2px}
.ds-item:hover{background:var(--ds-panel2)}
.ds-item.clickable{cursor:pointer}
.ds-item-top{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.ds-item-title{font-size:12px;font-weight:700;color:var(--ds-t1)}
.ds-item-time{margin-left:auto;font-size:9.5px;color:var(--ds-t3);font-family:var(--ds-mono)}
.ds-item-body{font-size:11.5px;color:var(--ds-t2);line-height:1.5;word-break:break-word}

/* user menu specific */
.ds-um-user{display:flex;align-items:center;gap:11px;padding:14px 16px;border-bottom:1px solid var(--ds-line)}
.ds-um-av{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--ds-ac),var(--ds-purple));display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;overflow:hidden;flex-shrink:0}
.ds-um-av img{width:100%;height:100%;object-fit:cover}
.ds-um-name{font-size:13.5px;font-weight:800;color:var(--ds-t1)}
.ds-um-role{display:inline-block;margin-top:3px;font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:5px;font-family:var(--ds-mono);background:rgba(79,142,255,.15);color:var(--ds-ac2)}
.ds-um-role.owner{background:rgba(167,139,250,.18);color:var(--ds-purple)}
.ds-menu-row{display:flex;align-items:center;gap:10px;padding:11px 14px;font-size:12.5px;font-weight:600;color:var(--ds-t2);cursor:pointer;transition:background .12s;border-radius:9px}
.ds-menu-row:hover{background:var(--ds-panel2);color:var(--ds-t1)}
.ds-menu-row.danger{color:var(--ds-red)}
.ds-menu-row.danger:hover{background:rgba(240,73,110,.1)}
.ds-menu-ico{width:16px;text-align:center;opacity:.85}
.ds-sep{height:1px;background:var(--ds-line);margin:6px 4px}

/* préférences inline */
.ds-pref-panel{padding:6px 6px 4px}
.ds-pref-row{display:flex;align-items:center;justify-content:space-between;padding:9px 10px;font-size:12px;color:var(--ds-t2);font-weight:600}
.ds-theme-toggle{display:flex;background:var(--ds-panel3);border-radius:9px;padding:3px;gap:2px}
.ds-theme-opt{padding:5px 10px;border-radius:7px;font-size:11px;font-weight:700;color:var(--ds-t3);cursor:pointer;transition:all .15s;font-family:var(--ds-mono)}
.ds-theme-opt.active{background:var(--ds-ac);color:#fff}

/* switch */
.ds-switch{width:36px;height:20px;border-radius:11px;background:var(--ds-panel3);border:1px solid var(--ds-line2);position:relative;cursor:pointer;flex-shrink:0;transition:all .2s}
.ds-switch::after{content:'';position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--ds-t3);transition:all .2s}
.ds-switch.on{background:rgba(31,217,138,.2);border-color:var(--ds-green)}
.ds-switch.on::after{left:18px;background:var(--ds-green)}

/* ── Panneau latéral Journal de bord ── */
#ds-notes-overlay{position:fixed;inset:0;background:var(--ds-overlay);backdrop-filter:blur(3px);z-index:950;display:none}
#ds-notes-overlay.open{display:block}
#ds-notes-panel{position:fixed;top:0;right:0;bottom:0;width:min(420px,92vw);background:var(--ds-panel);border-left:1px solid var(--ds-line2);z-index:951;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .25s cubic-bezier(.22,1,.36,1);box-shadow:-20px 0 60px rgba(0,0,0,.4);font-family:var(--ds-font)}
#ds-notes-overlay.open #ds-notes-panel{transform:translateX(0)}
.ds-notes-hd{padding:18px 20px;border-bottom:1px solid var(--ds-line);display:flex;align-items:center;gap:10px}
.ds-notes-hd h3{font-size:15px;font-weight:800;color:var(--ds-t1);margin:0}
.ds-notes-hd p{font-size:11px;color:var(--ds-t3);margin:2px 0 0}
.ds-notes-close{margin-left:auto;background:none;border:none;color:var(--ds-t3);font-size:18px;cursor:pointer;padding:4px}
.ds-notes-list{flex:1;overflow-y:auto;padding:14px 20px}
.ds-note{background:var(--ds-panel2);border:1px solid var(--ds-line);border-radius:11px;padding:13px 14px;margin-bottom:10px}
.ds-note-hd{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.ds-note-author{font-size:12px;font-weight:700;color:var(--ds-t1)}
.ds-note-vis{font-size:9px;font-weight:700;padding:2px 6px;border-radius:5px;font-family:var(--ds-mono);text-transform:uppercase;background:var(--ds-panel3);color:var(--ds-t2)}
.ds-note-vis.team{color:var(--ds-ac2);background:rgba(79,142,255,.12)}
.ds-note-vis.custom{color:var(--ds-purple);background:rgba(167,139,250,.12)}
.ds-note-vis.private{color:var(--ds-yellow);background:rgba(247,201,72,.12)}
.ds-note-time{margin-left:auto;font-size:9.5px;color:var(--ds-t3);font-family:var(--ds-mono)}
.ds-note-body{font-size:12.5px;color:var(--ds-t2);line-height:1.6;white-space:pre-wrap;word-break:break-word}
.ds-note-del{background:none;border:none;color:var(--ds-t3);cursor:pointer;font-size:12px;padding:2px 4px}
.ds-note-del:hover{color:var(--ds-red)}
.ds-notes-compose{border-top:1px solid var(--ds-line);padding:14px 20px 18px;background:var(--ds-panel2)}
.ds-notes-compose textarea{width:100%;min-height:70px;background:var(--ds-panel);border:1px solid var(--ds-line2);border-radius:9px;padding:10px 12px;color:var(--ds-t1);font-family:var(--ds-font);font-size:12.5px;resize:vertical;outline:none;margin-bottom:8px}
.ds-notes-compose textarea:focus{border-color:var(--ds-ac)}
.ds-compose-row{display:flex;gap:8px;align-items:center}
.ds-compose-row select{flex:1;background:var(--ds-panel);border:1px solid var(--ds-line2);border-radius:8px;padding:8px 10px;color:var(--ds-t1);font-family:var(--ds-font);font-size:11.5px;outline:none}
.ds-btn{display:inline-flex;align-items:center;gap:6px;background:var(--ds-ac);color:#fff;border:none;border-radius:8px;padding:8px 15px;font-family:var(--ds-font);font-size:12px;font-weight:700;cursor:pointer;transition:all .15s;white-space:nowrap}
.ds-btn:hover{background:#3d7aee}
.ds-btn.ghost{background:var(--ds-panel3);color:var(--ds-t2);border:1px solid var(--ds-line2)}
.ds-btn.ghost:hover{color:var(--ds-t1);border-color:var(--ds-ac)}
.ds-btn.sm{padding:6px 11px;font-size:11px}
.ds-owner-flag{font-size:9.5px;color:var(--ds-t3);font-family:var(--ds-mono);padding:0 20px 12px;display:flex;align-items:center;gap:5px}

/* ── Modal règles d'alerte ── */
#ds-alert-overlay{position:fixed;inset:0;background:var(--ds-overlay);backdrop-filter:blur(4px);z-index:960;display:none;align-items:center;justify-content:center;padding:20px}
#ds-alert-overlay.open{display:flex}
#ds-alert-modal{width:100%;max-width:480px;max-height:88vh;overflow:hidden;display:flex;flex-direction:column;background:var(--ds-panel);border:1px solid var(--ds-line2);border-radius:16px;box-shadow:var(--ds-shadow);font-family:var(--ds-font);animation:ds-dd-in .18s cubic-bezier(.34,1.56,.64,1)}
.ds-alert-hd{display:flex;align-items:center;gap:10px;padding:18px 20px;border-bottom:1px solid var(--ds-line)}
.ds-alert-hd h3{font-size:15px;font-weight:800;color:var(--ds-t1);margin:0}
.ds-alert-body{overflow-y:auto;padding:18px 20px;flex:1}
.ds-alert-sec{margin-bottom:20px}
.ds-alert-sec:last-child{margin-bottom:0}
.ds-alert-lbl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--ds-t3);margin-bottom:4px}
.ds-alert-sub{font-size:11.5px;color:var(--ds-t3);margin-bottom:10px;line-height:1.5}
.ds-rule{display:flex;align-items:center;gap:8px;background:var(--ds-panel2);border:1px solid var(--ds-line);border-radius:9px;padding:9px 12px;margin-bottom:7px}
.ds-rule code{font-family:var(--ds-mono);font-size:11.5px;color:var(--ds-t1);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-rule .ds-note-vis{flex-shrink:0}
.ds-alert-form{display:flex;gap:7px;margin-top:4px}
.ds-alert-form input,.ds-alert-form select{background:var(--ds-panel2);border:1px solid var(--ds-line2);border-radius:8px;padding:8px 10px;color:var(--ds-t1);font-family:var(--ds-font);font-size:12px;outline:none}
.ds-alert-form input{flex:1;min-width:0}
.ds-alert-form input:focus,.ds-alert-form select:focus{border-color:var(--ds-ac)}
.ds-webhook-input{width:100%;background:var(--ds-panel2);border:1px solid var(--ds-line2);border-radius:9px;padding:10px 12px;color:var(--ds-t1);font-family:var(--ds-mono);font-size:11.5px;outline:none;margin-bottom:10px}
.ds-webhook-input:focus{border-color:var(--ds-ac)}
.ds-alert-ft{padding:14px 20px;border-top:1px solid var(--ds-line);display:flex;justify-content:flex-end;gap:8px}

/* toast alerte (popup son/visuel quand une règle matche) */
#ds-alert-toasts{position:fixed;bottom:24px;left:24px;z-index:1500;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.ds-alert-toast{background:var(--ds-panel);border:1px solid var(--ds-red);border-left:3px solid var(--ds-red);border-radius:9px;padding:11px 15px;max-width:320px;box-shadow:var(--ds-shadow);font-family:var(--ds-font);animation:ds-dd-in .2s ease}
.ds-alert-toast b{color:var(--ds-t1);font-size:12px}
.ds-alert-toast div{font-size:11.5px;color:var(--ds-t2);margin-top:3px}

@media(max-width:640px){
  #ds-quickbar{top:8px;right:8px}
  .ds-qb-name{display:none}
  .ds-dd{width:calc(100vw - 24px);right:8px!important}
}

/* ================================================================
   DIAMOND CITY — skin unifiée (portail, bot manager, entretiens)
   Remappe les variables de CHAQUE page + restyle les composants
   communs. Préfixe "html" = priorité sur les <style> inline.
   ================================================================ */

html:root{
  /* portail + entretiens */
  --bg:#070b15;--bg2:#0b1120;--bg3:#0e1526;--bg4:#131c31;--bg5:#1a2540;
  --bd:rgba(255,255,255,.06);--bd2:rgba(255,255,255,.10);--bd3:rgba(255,255,255,.16);
  --t1:#eaf1ff;--t2:#8c9ab5;--t3:#53617f;
  --cy:#2fb7ff;--cy2:#1d94d6;--vi:#9d8cf7;--vi2:#8070e0;--gr:#2ccf9b;--gr2:#1fae80;--re:#f2587a;--am:#f5c452;
  --cyglow:rgba(47,183,255,.25);--viglow:rgba(157,140,247,.25);--grglow:rgba(44,207,155,.25);
  /* dashboard */
  --card:#0e1526;--card2:#131c31;--card3:#1a2540;--b1:rgba(255,255,255,.06);--b2:rgba(255,255,255,.10);--b3:rgba(255,255,255,.16);
  --ac:#2f8cff;--ac2:#6db0ff;--ac3:#12305f;--green:#2ccf9b;--red:#f2587a;--yellow:#f5c452;--orange:#f58a3a;--purple:#9d8cf7;--teal:#2fc4e6;--pink:#ec6ab0;
  --grad-ac:linear-gradient(135deg,#1e7bff,#2fc4e6);--glow-ac:0 0 22px rgba(47,140,255,.25);
  /* typo commune */
  --font:'Plus Jakarta Sans',system-ui,sans-serif;--title:'Plus Jakarta Sans',system-ui,sans-serif;--mono:'JetBrains Mono',ui-monospace,monospace;
  --r:16px;--r2:10px;--r3:8px;--sidebar:236px;--sidebar-w:236px;
  /* composants ds-* */
  --ds-ac:#2f8cff;--ds-ac2:#6db0ff;--ds-green:#2ccf9b;--ds-red:#f2587a;--ds-purple:#9d8cf7;
  --ds-bg:#070b15;--ds-panel:#0e1526;--ds-panel2:#131c31;--ds-panel3:#1a2540;
  --ds-line:rgba(255,255,255,.07);--ds-line2:rgba(255,255,255,.13);--ds-t1:#eaf1ff;--ds-t2:#8c9ab5;--ds-t3:#53617f;
  --ds-font:'Plus Jakarta Sans',system-ui,sans-serif;--ds-mono:'JetBrains Mono',monospace;
  --dc-surface:#0e1526;--dc-hero:linear-gradient(115deg,#0a3a86 0%,#0b64c9 58%,#1b8ae6 100%);--dc-sel:rgba(47,140,255,.14);
}
html:root[data-theme="light"]{
  --bg:#eef3fb;--bg2:#ffffff;--bg3:#ffffff;--bg4:#f1f5fc;--bg5:#e4ebf7;
  --bd:rgba(18,34,70,.08);--bd2:rgba(18,34,70,.13);--bd3:rgba(18,34,70,.2);
  --t1:#10192e;--t2:#4a5878;--t3:#8896b3;
  --card:#ffffff;--card2:#f1f5fc;--card3:#e4ebf7;--b1:rgba(18,34,70,.08);--b2:rgba(18,34,70,.13);--b3:rgba(18,34,70,.2);
  --ac:#1668d6;--ac2:#1668d6;--cy:#0a8fcf;--vi:#6f5be0;--gr:#12a37a;--green:#12a37a;--re:#e03a5f;--red:#e03a5f;--am:#c98a0c;--yellow:#c98a0c;--purple:#6f5be0;
  --ds-ac:#1668d6;--ds-ac2:#1668d6;--ds-bg:#eef3fb;--ds-panel:#fff;--ds-panel2:#f1f5fc;--ds-panel3:#e4ebf7;
  --ds-line:rgba(18,34,70,.09);--ds-line2:rgba(18,34,70,.15);--ds-t1:#10192e;--ds-t2:#4a5878;--ds-t3:#8896b3;
  --dc-surface:#ffffff;--dc-sel:rgba(22,104,214,.1);
}

/* ── Base ── */
html body{font-family:var(--font);background:var(--bg);color:var(--t1);letter-spacing:-.005em}
html body::before{display:none}
html #pg-portal,html #main,html .main,html #login,html #pg-login{background:radial-gradient(ellipse 70% 40% at 80% -5%,rgba(47,140,255,.10),transparent 60%),var(--bg)}
html :is(h1,h2,h3,.ph,.s-ttl,.blk-title,.mhdr-title,.welcome-title,.stat-val,.sv,.cs-title){font-family:var(--title);letter-spacing:-.02em;text-shadow:none}
html :is(.ph,.s-ttl){color:var(--t1);font-weight:800;font-size:24px}
html :is(.ps,.s-sub){font-family:var(--font);color:var(--t2);font-size:13px}

/* ── Sidebar unifiée ── */
html :is(.ds-sidebar,#sb,.sidebar){width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--bg2);border-right:1px solid var(--bd);box-shadow:none;padding-left:12px;padding-right:12px}
html :is(.ds-sb-brand,.sb-logo,.sb-brand){flex-direction:column;align-items:center;text-align:center;gap:6px;padding:22px 8px 16px;border-bottom:1px solid var(--bd)}
html :is(.ds-sb-brand-txt div:first-child,.sb-logo-line1,.sb-nm){font-family:var(--title);font-size:15px;font-weight:800;letter-spacing:-.01em;color:var(--t1);text-transform:none}
html :is(.ds-sb-brand-txt div:last-child,.sb-logo-line2,.sb-tg){font-family:var(--font);font-size:10px;color:var(--t3);letter-spacing:.12em}
html .ds-sb-diamond,html .sb-ico{width:44px;height:44px;border-radius:0;background:linear-gradient(135deg,#7fd0ff,#2f8cff 55%,#1344a8);clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%);box-shadow:none;font-size:0}
html .sb-diamond{font-size:30px}
html :is(.ds-sb-lbl,.nav-lbl){font-family:var(--font);font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--t3);padding:16px 10px 6px}
html .nav-lbl::after{display:none}
html :is(.ds-sb-item,.nb,.nav-item,.ds-space){display:flex;align-items:center;gap:10px;padding:9px 12px;margin-bottom:2px;border-radius:10px;font-family:var(--font);font-size:13px;font-weight:600;color:var(--t2);border:0;background:transparent;transition:background .15s,color .15s}
html :is(.ds-sb-item,.nb,.nav-item,.ds-space):hover{background:var(--bg4);color:var(--t1)}
html :is(.ds-sb-item.on,.nb.on,.nav-item.active,.ds-space.on){background:var(--dc-sel);color:var(--ac2);font-weight:700}
html .nav-item.active::before{display:none}
html :is(.ico,.nb-ico,.ni-ico){font-size:0!important;width:10px;opacity:1;display:inline-flex;align-items:center;justify-content:center}
html :is(.ico,.nb-ico,.ni-ico)::before,html .ds-space i{content:'';display:block;width:6px;height:6px;background:currentColor;opacity:.4;transform:rotate(45deg)}
html .ds-space i{flex-shrink:0}
html :is(.nav-item.active,.nb.on,.ds-space.on) :is(.ni-ico,.nb-ico)::before,html .ds-space.on i{opacity:1;background:var(--ac)}
html .nav-item.danger{color:var(--red)!important}
html .ds-spaces{padding:10px 0 4px;border-bottom:1px solid var(--bd);margin-bottom:4px}
html .ds-spaces-lbl{font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--t3);padding:4px 10px 6px;text-transform:uppercase}
html .sb-user{border-top:1px solid var(--bd);background:var(--bg4);border-radius:14px;margin:8px 0 12px;padding:10px 12px}
html .sb-back{border-radius:10px;font-size:12px}

/* ── Hero (accueil portail) ── */
html .welcome{position:relative;overflow:hidden;text-align:left;margin-bottom:28px;padding:34px 40px;border-radius:20px;background:var(--dc-hero);box-shadow:0 20px 50px rgba(10,80,190,.22)}
html .welcome::before{content:'Boîte à outils du staff';display:block;font-size:11px;font-weight:700;letter-spacing:.12em;color:rgba(255,255,255,.8);text-transform:uppercase;margin-bottom:10px}
html .welcome::after{content:'';position:absolute;right:56px;top:-10px;width:190px;height:210px;background:linear-gradient(150deg,rgba(255,255,255,.85),rgba(160,220,255,.5) 45%,rgba(255,255,255,.12));clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%);opacity:.55}
html .welcome-title{background:none;-webkit-text-fill-color:#fff;color:#fff;font-size:30px;font-weight:800;max-width:520px}
html .welcome-sub{color:rgba(255,255,255,.8);font-family:var(--font);letter-spacing:0;font-size:14px}

/* ── Header portail / topbar dashboard ── */
html .hdr{background:color-mix(in srgb,var(--bg) 86%,transparent);border-bottom:1px solid var(--bd);padding-right:380px}
html .hdr-title{background:none;-webkit-text-fill-color:var(--t1);color:var(--t1);font-size:14px}
html .hdr-left,html .hdr-badge,html .hdr-sub{font-family:var(--font);letter-spacing:.08em}
html .topbar{background:color-mix(in srgb,var(--bg) 86%,transparent);border-bottom:1px solid var(--bd);padding-right:380px}
html #tb-title{font-weight:800}

/* ── Cartes ── */
html :is(.card,.pblock,.stat,.sc,.ucard,.guild-card,.tc-cat,.warn-card,.quota-member,.iv-row,.iv-item,.qrc){background:var(--dc-surface);border:1px solid var(--bd);border-radius:var(--r);box-shadow:none}
html :is(.card,.pblock,.sc,.stat)::before{box-shadow:none}
html .card::before{display:none}
html :is(.card,.guild-card):hover{border-color:var(--bd2)}
html :is(.pblock,.guild-card):hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(8,20,50,.28)}
html .pblock::before{display:none}
html .pblock::after{content:'';position:absolute;top:0;right:0;left:auto;width:84px;height:40px;background:var(--blk-col);opacity:.16;clip-path:polygon(34% 0,100% 0,100% 100%)}
html .blk-title{font-size:18px}
html :is(.blk-cy,.blk-vi,.blk-gr) .blk-title{text-shadow:none}
html :is(.blk-icon){border-radius:14px;box-shadow:none}
html .blk-btn{border-radius:10px;font-family:var(--font)}
html :is(.stat-val,.sv){font-weight:800}
html .stats-bar .stat,html .stats-grid .stat{border-radius:14px}

/* ── Boutons ── */
html :is(.btn,.ubtn,.ds-btn,.btn-ref,.blk-btn){font-family:var(--font);border-radius:10px;font-weight:700;letter-spacing:0}
html :is(.btn-primary,.bp,.ubtn-cy,.ubtn-vi,.ubtn-gr,.ds-btn){background:var(--ac);color:#fff;box-shadow:0 6px 16px rgba(47,140,255,.25)}
html :is(.btn-primary,.bp,.ubtn-cy,.ubtn-vi,.ubtn-gr,.ds-btn):hover{background:#1f78eb;box-shadow:0 8px 20px rgba(47,140,255,.35)}
html :is(.btn-ghost,.bs,.ubtn-ghost,.ds-btn.ghost){background:var(--bg4);border:1px solid var(--bd2);color:var(--t2);box-shadow:none}
html :is(.btn-ghost,.bs,.ubtn-ghost):hover{color:var(--t1);border-color:var(--ac)}

/* ── Champs ── */
html :is(input,select,textarea,.fi,.ft,.fse,.uinp,.usel,.utxt){background:var(--bg4);border:1px solid var(--bd2);border-radius:10px;color:var(--t1);font-family:var(--font)}
html :is(input,select,textarea,.fi,.ft,.fse,.uinp,.usel,.utxt):focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(47,140,255,.16)}
html :is(.fl,.ulbl,.sh,.sl,.stat-lbl,.stat-lbl){font-family:var(--font);letter-spacing:.08em;color:var(--t3)}

/* ── Badges / onglets ── */
html :is(.badge,.bdg,.mode-tag,.ev-pill){font-family:var(--font);border-radius:999px}
html :is(.tab-btn,.mtab,.ftab){font-family:var(--font);font-weight:600}
html :is(.tab-btn.active,.mtab.tcy,.mtab.tvi,.mtab.tgr,.ftab.on){color:var(--ac2);border-color:var(--ac);background:var(--dc-sel)}

/* ── Modales, popups, menus (fonds en dur → surface unifiée) ── */
html :is(.mbox,#rpbox,#rphead,#rpfoot,#cabox,#qmbox,.modal-box,.dot-dd,#thd,#gp-dd,.login-card){background:var(--dc-surface);border-color:var(--bd2)}
html #tov{background:var(--bg)}
html :is(.modal-box,.mbox,#rpbox){border-radius:18px;box-shadow:0 30px 80px rgba(3,8,22,.5)}
html :is(#toast,#tst,.toast){background:var(--dc-surface);font-family:var(--font)}
html :is(.dd-item,.perm-row,.list-item,td,th){font-family:var(--font)}
html :is(.tbl-wrap,table) :is(td,th){border-color:var(--bd)}

/* ── Login ── */
html :is(#pg-login,#login) :is(.lorb,.scanlines,.lgrid){opacity:.5}
html .login-card{border-radius:22px;box-shadow:0 30px 80px rgba(3,8,22,.4)}
html .ltitle,html .login-card h1{font-family:var(--title);font-weight:800;color:var(--t1);-webkit-text-fill-color:var(--t1);background:none}

/* ── Quickbar : bascule Clair / Noir ── */
.ds-theme-pill{display:flex;padding:3px;border-radius:999px;background:var(--ds-panel);border:1px solid var(--ds-line);box-shadow:var(--ds-shadow)}
.ds-theme-pill span{padding:6px 12px;border-radius:999px;font-size:11.5px;font-weight:700;color:var(--ds-t3);cursor:pointer;transition:all .15s}
.ds-theme-pill span.active{background:var(--dc-sel);color:var(--ds-ac2)}
.ds-qb-btn,.ds-qb-user{border-radius:12px}

@media(max-width:900px){html :is(.hdr,.topbar){padding-right:150px}}
@media(prefers-reduced-motion:reduce){html *{animation:none!important;transition:none!important}}
/* ── Sidebars : jamais de soulignement sur les liens de navigation ── */
html :is(.ds-space,.ds-sb-item,.sb-back,.nav-item,.nb,.ds-sidebar a,.sidebar a,#sb a,.ds-spaces a),
html :is(.ds-space,.ds-sb-item,.sb-back,.nav-item,.nb,.ds-sidebar a,.sidebar a,#sb a,.ds-spaces a):is(:hover,:focus,:active,:visited){text-decoration:none!important}

/* ── Profil utilisateur (bas de la sidebar) ── */
.ds-profile{position:relative;display:flex;align-items:center;gap:10px;margin:auto 12px 12px;padding:9px 11px;border-radius:14px;background:var(--ds-panel2);border:1px solid var(--ds-line);cursor:pointer;transition:border-color .15s,background .15s;font-family:var(--ds-font);flex-shrink:0}
.ds-profile:hover{border-color:var(--ds-ac)}
.ds-pf-av{position:relative;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--ds-ac),var(--ds-purple));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff;flex-shrink:0}
.ds-pf-av img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.ds-pf-dot{position:absolute;top:-4px;right:-4px;min-width:15px;height:15px;padding:0 3px;border-radius:8px;background:var(--ds-red);color:#fff;font-size:9px;font-weight:800;font-family:var(--ds-mono);display:none;align-items:center;justify-content:center;box-shadow:0 0 8px rgba(240,73,110,.6)}
.ds-pf-dot.show{display:flex}
.ds-pf-info{flex:1;min-width:0}
.ds-pf-name{font-size:12.5px;font-weight:700;color:var(--ds-t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ds-pf-role{font-size:10px;color:var(--ds-t3);font-family:var(--ds-mono);margin-top:1px}
.ds-pf-chev{color:var(--ds-t3);font-size:11px;flex-shrink:0}
.ds-profile.ds-float{position:fixed;left:14px;bottom:14px;margin:0;z-index:900;box-shadow:var(--ds-shadow);min-width:200px}
#sb .ds-profile{margin:8px 0 0}
#sb .sb-back{margin-top:auto}
body.ds-has-profile .sidebar>.sb-user{display:none!important}  /* ancien bloc user du dashboard, remplacé */

.ds-menu-count{margin-left:auto;min-width:18px;padding:1px 6px;border-radius:9px;background:var(--ds-red);color:#fff;font-size:10px;font-weight:800;font-family:var(--ds-mono);text-align:center;display:none}
.ds-menu-count.show{display:inline-block}
.ds-dd{bottom:auto}
@media(max-width:640px){
  .ds-dd{width:calc(100vw - 24px);left:12px!important;right:auto!important}
}