/* ANUS BOT 3000 · interface admin. Thèmes via [data-theme] : matrix (défaut), discord (violet), neon, clair. */
:root{
  --bg:#050a06; --bg2:#09130b; --panel:#0c1a10; --panel2:#112218; --line:#1c3a26; --text:#c9f5d4; --muted:#7fa68a;
  --accent:#00ff66; --accent-ink:#021207; --accent2:#7a5cff; --danger:#ff4d5e; --warn:#ffb020; --ok:#2bd96b;
  --glow:0 0 18px rgba(0,255,102,.25); --radius:12px; --nav-w:230px; --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
[data-theme=discord]{--bg:#1e1f22;--bg2:#2b2d31;--panel:#313338;--panel2:#383a40;--line:#3f4147;--text:#e3e5e8;--muted:#9da1a8;--accent:#5865f2;--accent-ink:#fff;--accent2:#b5a6ff;--glow:0 0 18px rgba(88,101,242,.3)}
[data-theme=neon]{--bg:#0d0716;--bg2:#150b24;--panel:#1b1030;--panel2:#25153f;--line:#3a2162;--text:#eadcff;--muted:#a38bd0;--accent:#c06bff;--accent-ink:#17061f;--accent2:#00ffd0;--glow:0 0 20px rgba(192,107,255,.35)}
[data-theme=clair]{--bg:#f2f4f8;--bg2:#e8ebf2;--panel:#fff;--panel2:#f5f6fa;--line:#d6dbe6;--text:#1c2230;--muted:#5d6678;--accent:#5865f2;--accent-ink:#fff;--accent2:#00a86b;--glow:none}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--text);font:15px/1.5 var(--font);-webkit-tap-highlight-color:transparent}
[data-theme=matrix] body{background:radial-gradient(1200px 600px at 80% -10%,#0b2412 0,transparent 60%),var(--bg)}
a{color:var(--accent)} button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0 0 .5rem;line-height:1.2} h1{font-size:1.5rem} h2{font-size:1.15rem} h3{font-size:1rem}
.mono{font-family:var(--mono)} .muted{color:var(--muted)} .small{font-size:.85rem}

/* ---- structure */
.shell{display:grid;grid-template-columns:var(--nav-w) 1fr;min-height:100vh}
.nav{background:var(--bg2);border-right:1px solid var(--line);padding:16px 12px;position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column;gap:4px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.04em;padding:6px 10px 14px;color:var(--accent);text-shadow:var(--glow)}
.brand .dot{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:var(--glow)}
.nav a.item{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:10px;text-decoration:none;color:var(--muted);border:1px solid transparent}
.nav a.item:hover{background:var(--panel);color:var(--text)}
.nav a.item.active{background:var(--panel2);color:var(--accent);border-color:var(--line);box-shadow:var(--glow)}
.nav .sep{flex:1}
.main{padding:22px clamp(14px,3vw,34px) 90px;max-width:1200px;width:100%}
.topbar{display:none}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}

/* ---- composants */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:14px}
.card.glow{box-shadow:var(--glow)}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.grid>.card{margin:0}
.stat{display:flex;flex-direction:column;gap:2px} .stat b{font-size:1.7rem;color:var(--accent)} .stat span{color:var(--muted);font-size:.85rem}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.btn{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:9px 14px;cursor:pointer;min-height:40px}
.btn:hover{border-color:var(--accent)} .btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}
.btn.danger{border-color:var(--danger);color:var(--danger)} .btn.danger:hover{background:var(--danger);color:#fff}
.btn.small{padding:5px 10px;min-height:32px;font-size:.85rem}
input[type=text],input[type=number],input[type=password],select,textarea{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 12px;width:100%;min-height:40px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
label.f{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;font-size:.9rem;color:var(--muted)}
.badge{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.75rem;border:1px solid var(--line);background:var(--bg);color:var(--muted)}
.badge.ok{color:var(--ok);border-color:var(--ok)} .badge.warn{color:var(--warn);border-color:var(--warn)} .badge.accent{color:var(--accent);border-color:var(--accent)}
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.tabs button{background:transparent;border:1px solid var(--line);border-radius:99px;padding:7px 14px;cursor:pointer;color:var(--muted)}
.tabs button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
.bar{height:8px;border-radius:99px;background:var(--bg);overflow:hidden;border:1px solid var(--line)} .bar i{display:block;height:100%;background:var(--accent)}
.list{display:flex;flex-direction:column;gap:8px}
.item-row{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;flex-wrap:wrap}
.banner{padding:12px 14px;border-radius:10px;border:1px solid var(--warn);color:var(--warn);background:rgba(255,176,32,.08);margin-bottom:14px}
.banner.err{border-color:var(--danger);color:var(--danger);background:rgba(255,77,94,.08)}
table{width:100%;border-collapse:collapse} td,th{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;font-size:.9rem}

/* ---- modale, toasts */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}
.modal{background:var(--panel);border:1px solid var(--accent);border-radius:14px;padding:20px;width:min(560px,100%);max-height:90vh;overflow:auto;box-shadow:var(--glow)}
.modal .actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap}
#toasts{position:fixed;right:14px;bottom:76px;display:flex;flex-direction:column;gap:8px;z-index:60;max-width:min(380px,calc(100vw - 28px))}
.toast{background:var(--panel);border:1px solid var(--accent);border-radius:10px;padding:10px 14px;box-shadow:var(--glow);white-space:pre-wrap}
.toast.err{border-color:var(--danger)}

/* ---- connexion */
.login{min-height:100vh;display:grid;place-items:center;padding:20px}
.login .card{width:min(430px,100%);text-align:center}
.login h1{color:var(--accent);text-shadow:var(--glow);letter-spacing:.05em}
.login .btn.primary{width:100%;margin-top:6px;display:block;text-decoration:none;padding:12px}

/* ---- mobile : barre d'onglets en bas */
@media (max-width:820px){
  .shell{grid-template-columns:1fr}
  .nav{position:fixed;inset:auto 0 0 0;height:auto;flex-direction:row;overflow-x:auto;border-right:0;border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom));z-index:40;gap:2px}
  .nav .brand,.nav .sep,.nav .hide-m{display:none}
  .nav a.item{flex-direction:column;gap:2px;font-size:.7rem;padding:6px 10px;min-width:62px;text-align:center}
  .nav a.item .ic{font-size:1.25rem}
  .topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--bg2);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
  .main{padding-bottom:110px}
  .grid.stats{grid-template-columns:1fr 1fr}
  #toasts{bottom:84px}
}
