/* FAIOA GROUP - SUPER ADMIN v2.0.0 - ANIMATED */
:root{--bl:#0b6cb7;--tq:#16b3a6;--dk:#081a2b;--bg:#f2f6fa;--bd:#dde5ee;--rd:#d94f45;--gn:#1e9e63}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:#132433;font-size:14px}
a{text-decoration:none;color:inherit}
h1{font-size:18px;letter-spacing:2px;margin:0 0 16px;display:flex;gap:10px;align-items:center}
h1 i,h2 i{color:var(--bl)}
h2{font-size:12px;letter-spacing:1.6px;margin:0 0 12px;color:#5b6b7a}
input,select,textarea{font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--bd);border-radius:8px;background:#fff;transition:.25s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--bl);box-shadow:0 0 0 4px #0b6cb722;transform:translateY(-1px)}
textarea{width:100%;min-height:130px;resize:vertical}
code{background:#eef3f8;padding:2px 6px;border-radius:5px;font-size:11px}
.hint{font-size:10.5px;letter-spacing:1.3px;color:#7b8a99;text-transform:uppercase}
.nw{white-space:nowrap}
.b{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(120deg,var(--bl),var(--tq));background-size:200% 100%;color:#fff;border:0;border-radius:9px;padding:9px 14px;font-size:11.5px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;cursor:pointer;transition:.3s}
.b:hover{background-position:100% 0;transform:translateY(-2px);box-shadow:0 8px 18px #0b6cb740}
.b:active{transform:translateY(0) scale(.97)}
.b.g{background:#fff;color:var(--bl);border:1px solid var(--bl)}
.b.g:hover{background:var(--bl);color:#fff}
.b.r{background:linear-gradient(120deg,#d94f45,#e5763a)}
.b.ok{background:linear-gradient(120deg,#1e9e63,#16b3a6)}
.b.big{width:100%;justify-content:center;padding:13px;font-size:13px;margin-top:6px}
.b.big i{transition:.3s}.b.big:hover i{transform:translateX(6px)}
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(100deg,#081a2b,#0b3a5c);color:#fff;padding:8px 16px;box-shadow:0 4px 20px #08182a30}
.brand{display:flex;align-items:center;gap:9px;letter-spacing:2px;font-size:13px}
.brand i{font-size:20px;color:var(--tq);transition:.5s}
.brand:hover i{transform:rotate(360deg) scale(1.15)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.tab{display:flex;align-items:center;gap:7px;padding:8px 11px;border-radius:9px;font-size:10.5px;font-weight:800;letter-spacing:1.1px;color:#bdd6e8;transition:.28s}
.tab i{transition:.28s}
.tab:hover{background:#ffffff18;color:#fff}
.tab:hover i{transform:translateY(-3px) scale(1.15)}
.tab.on{background:linear-gradient(120deg,var(--bl),var(--tq));color:#fff;box-shadow:0 6px 16px #16b3a640}
.tab.on i{animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.2)}}
.me{display:flex;align-items:center;gap:6px}
.chip{font-size:10.5px;letter-spacing:1.2px;border:1px solid #ffffff33;padding:5px 9px;border-radius:20px}
.lang{font-size:10px;font-weight:800;letter-spacing:1px;padding:4px 6px;border-radius:6px;color:#8fb2ca;transition:.25s}
.lang:hover{color:#fff;background:#ffffff1a}
.lang.on{background:var(--tq);color:#04202a}
.wrap{padding:20px 18px 60px;max-width:1500px;margin:0 auto}
.card{background:#fff;border:1px solid var(--bd);border-radius:16px;padding:16px;margin-bottom:16px;box-shadow:0 2px 10px #0b213609;transition:.35s}
.card:hover{box-shadow:0 10px 30px #0b213618;transform:translateY(-2px)}
.tb{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin-bottom:16px}
.grid.f{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.grid.f label{display:flex;flex-direction:column;gap:4px}
.grid.f span{font-size:10px;letter-spacing:1.3px;color:#7b8a99}
.kpi{background:#fff;border:1px solid var(--bd);border-radius:16px;padding:16px;transition:.35s}
.kpi:hover{transform:translateY(-6px);box-shadow:0 14px 30px #0b6cb730}
.kpi i{color:var(--bl);font-size:17px}
.kpi b{display:block;font-size:32px;line-height:1.1;color:var(--dk)}
.kpi span{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:#6c7c8b}
.site{background:#fff;border:1px solid var(--bd);border-radius:16px;padding:16px;display:block;transition:.35s}
.site:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:0 14px 30px #16b3a636;border-color:var(--tq)}
.site i{color:var(--tq)}.site b{display:block;letter-spacing:2px;margin:6px 0 3px}
.site span{font-size:10px;color:#7b8a99;word-break:break-all}
table{width:100%;border-collapse:collapse;font-size:12.5px}
th{background:#eef3f9;text-align:left;padding:9px;font-size:10px;letter-spacing:1.3px;text-transform:uppercase;color:#546675;border-bottom:1px solid var(--bd)}
td{padding:7px 9px;border-bottom:1px solid #eff3f7}
tr.row{opacity:0;transform:translateX(-10px);transition:.4s}
tr.row.vis{opacity:1;transform:none}
tr.row:hover td{background:#f4f9ff}
.tag{background:#e8f1fb;color:var(--bl);border-radius:20px;padding:2px 9px;font-size:10px;font-weight:800;letter-spacing:1px}
.tag.live{background:#e4f7ee;color:var(--gn);animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.45}}
.xp{max-width:460px;font-size:11px;color:#5b6b7a}
.term{background:#081a2b;color:#8ff0d8;padding:14px;border-radius:12px;font-size:11px;overflow:auto}
.bars{display:flex;align-items:flex-end;gap:5px;height:150px;padding-top:10px}
.bar{flex:1;height:100%;display:flex;align-items:flex-end}
.bar i{display:block;width:100%;height:var(--h);border-radius:5px 5px 0 0;background:linear-gradient(180deg,var(--tq),var(--bl));animation:grow .9s cubic-bezier(.2,.9,.2,1) both;transition:.3s}
.bar:hover i{filter:brightness(1.25)}
@keyframes grow{from{height:0}}
.thumbs{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.kb{overflow:hidden;border-radius:14px;box-shadow:0 6px 18px #0b213620}
.kb img{width:100%;height:150px;object-fit:cover;display:block;animation:ken 16s ease-in-out infinite alternate}
@keyframes ken{0%{transform:scale(1) translate(0,0)}50%{transform:scale(1.14) translate(-2%,-2%)}100%{transform:scale(1.22) translate(2%,1.5%)}}
.msg{padding:11px 15px;border-radius:11px;margin-bottom:14px;font-weight:800;letter-spacing:1.2px;font-size:11.5px}
.msg.ok{background:#e4f7ee;color:var(--gn);border:1px solid #b4e6cd}
.msg.err{background:#fdeceb;color:var(--rd);border:1px solid #f6c8c4}
.fade,.rise{opacity:0;transform:translateY(18px);transition:.55s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.fade.vis,.rise.vis{opacity:1;transform:none}
.slide{animation:slide .5s cubic-bezier(.2,.9,.2,1) both}
@keyframes slide{from{opacity:0;transform:translateX(-22px)}}
.pop{animation:pop .45s cubic-bezier(.2,1.4,.4,1) both}
@keyframes pop{from{opacity:0;transform:scale(.94)}}
.shake{animation:shake .45s}
@keyframes shake{25%{transform:translateX(-7px)}50%{transform:translateX(7px)}75%{transform:translateX(-4px)}}
.bot{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(100deg,#081a2b,#0b3a5c);color:#a8c6dc;padding:7px 16px;font-size:10px;letter-spacing:1.6px;text-transform:uppercase;z-index:25}
.bot i{color:var(--tq)}.bot b{color:#fff;letter-spacing:2.5px}
.bot .v{color:var(--tq);font-weight:800}
.bot .clock{margin-left:auto;font-variant-numeric:tabular-nums}
.loginpage{min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg,#061423,#0b3a5c 55%,#0e6b70)}
.orb{position:fixed;border-radius:50%;filter:blur(60px);opacity:.55}
.o1{width:420px;height:420px;background:#16b3a6;top:-100px;left:-90px;animation:fl1 16s ease-in-out infinite alternate}
.o2{width:380px;height:380px;background:#0b6cb7;bottom:-110px;right:-80px;animation:fl2 19s ease-in-out infinite alternate}
.o3{width:280px;height:280px;background:#7a4fd6;top:45%;left:60%;animation:fl1 23s ease-in-out infinite alternate-reverse}
@keyframes fl1{to{transform:translate(140px,90px) scale(1.25)}}
@keyframes fl2{to{transform:translate(-130px,-80px) scale(1.2)}}
.login{position:relative;z-index:2;width:min(92vw,380px);background:#ffffff12;backdrop-filter:blur(18px);border:1px solid #ffffff2e;border-radius:22px;padding:32px 26px;text-align:center;color:#fff;box-shadow:0 24px 60px #00000045}
.login h1{justify-content:center;font-size:21px;letter-spacing:5px;margin:14px 0 2px}
.login .sub{font-size:10px;letter-spacing:3px;color:#a9d6e8;margin:0 0 20px}
.logo{width:64px;height:64px;margin:0 auto;border-radius:20px;display:grid;place-items:center;font-size:26px;background:linear-gradient(135deg,var(--bl),var(--tq));box-shadow:0 12px 30px #16b3a655}
.float{animation:float 3.6s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-11px) rotate(-4deg)}}
.fld{display:flex;align-items:center;gap:9px;background:#ffffff14;border:1px solid #ffffff2e;border-radius:11px;padding:0 12px;margin-bottom:11px;transition:.3s}
.fld:focus-within{background:#ffffff22;border-color:var(--tq);box-shadow:0 0 0 4px #16b3a633}
.fld i{color:#9fd8e6}
.fld input{flex:1;background:0;border:0;color:#fff;padding:13px 0}
.fld input:focus{outline:0;box-shadow:none;transform:none}
.fld input::placeholder{color:#a9c8dc;letter-spacing:1.4px;font-size:11.5px}
.login .langs{display:flex;justify-content:center;gap:6px;margin-top:16px}
.login .ft{margin-top:12px;font-size:9px;letter-spacing:1.8px;color:#8fb6cc}
.reveal{animation:rev .6s cubic-bezier(.2,.9,.2,1) both}
.d1{animation-delay:.08s}.d2{animation-delay:.16s}.d3{animation-delay:.24s}.d4{animation-delay:.32s}.d5{animation-delay:.4s}
@keyframes rev{from{opacity:0;transform:translateY(16px)}}
@media(max-width:760px){.tabs{order:3;width:100%}.tab span{display:none}.tab{padding:9px 12px}.wrap{padding:14px 10px 70px}}

/* ================= THEME SOMBRE — COHERENT AVEC FAIOA-GROUP.DAMOTIC.FR ================= */
:root{--bl:#0a84ff;--tq:#30d158;--vi:#bf5af2;--dk:#000;--bg:#000;--bd:rgba(255,255,255,.10);--rd:#ff453a;--gn:#30d158}
body{background:#000;color:#f5f5f7;font-family:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Display',Arial,sans-serif;letter-spacing:-.01em}
h2{color:#8a8f98}
input,select,textarea{background:#0e1014;border:1px solid var(--bd);color:#f5f5f7}
input:focus,select:focus,textarea:focus{border-color:var(--bl);box-shadow:0 0 0 4px #0a84ff28}
code{background:#14161b;color:#8a8f98}
.top{background:rgba(8,8,10,.86);backdrop-filter:saturate(180%) blur(22px);border-bottom:1px solid var(--bd);box-shadow:none}
.brand i{color:var(--bl)}
.tab{color:#8a8f98}
.tab.on{background:linear-gradient(120deg,var(--bl),var(--vi));box-shadow:0 6px 22px #0a84ff40}
.card{background:#08090b;border:1px solid var(--bd);box-shadow:none}
.card:hover{border-color:rgba(255,255,255,.2);box-shadow:0 14px 40px #0a84ff1a}
.kpi{background:linear-gradient(180deg,#0e1014,#08090b);border:1px solid var(--bd)}
.kpi b{color:#fff}.kpi span{color:#8a8f98}.kpi i{color:var(--bl)}
.kpi:hover{border-color:var(--bl);box-shadow:0 16px 40px #0a84ff26}
.site{background:linear-gradient(180deg,#0e1014,#08090b);border:1px solid var(--bd)}
.site i{color:var(--tq)}.site span{color:#8a8f98}
.site:hover{border-color:var(--tq);box-shadow:0 16px 40px #30d15826}
th{background:#0e1014;color:#8a8f98;border-bottom:1px solid var(--bd)}
td{border-bottom:1px solid rgba(255,255,255,.06)}
tr.row:hover td{background:rgba(10,132,255,.08)}
.tag{background:rgba(10,132,255,.16);color:#7ab8ff}
.tag.live{background:rgba(48,209,88,.16);color:var(--tq)}
.xp,.hint{color:#8a8f98}
.msg.ok{background:rgba(48,209,88,.12);color:var(--tq);border-color:rgba(48,209,88,.3)}
.msg.err{background:rgba(255,69,58,.12);color:var(--rd);border-color:rgba(255,69,58,.3)}
.b{background:linear-gradient(120deg,var(--bl),var(--vi))}
.b.g{background:transparent;color:#f5f5f7;border:1px solid var(--bd)}
.b.g:hover{background:#fff;color:#000;border-color:#fff}
.b.ok{background:linear-gradient(120deg,#30d158,#0a84ff)}
.bot{background:rgba(8,8,10,.92);backdrop-filter:blur(22px);border-top:1px solid var(--bd);color:#8a8f98}
.bot i{color:var(--bl)}
.bar i{background:linear-gradient(180deg,var(--vi),var(--bl))}
.term{background:#0e1014;color:#30d158;border:1px solid var(--bd)}
.kb{box-shadow:0 10px 30px #00000080}
.loginpage{background:#000}
.o1{background:#0a84ff}.o2{background:#bf5af2}.o3{background:#30d158}
.orb{opacity:.32}
.login{background:rgba(14,16,20,.72);border:1px solid var(--bd)}
.logo{background:linear-gradient(135deg,var(--bl),var(--vi));box-shadow:0 14px 36px #0a84ff4d}
.login .sub{color:#8a8f98}.login .ft{color:#6b7280}
.fld{background:rgba(255,255,255,.05);border:1px solid var(--bd)}
.fld:focus-within{border-color:var(--bl);box-shadow:0 0 0 4px #0a84ff28}
.fld i{color:#8a8f98}
.lang.on{background:var(--bl);color:#fff}